From cf93b1d8fcfe1dc8032268abff9bbf3b77bff09d Mon Sep 17 00:00:00 2001
From: Paul van Tilburg
Date: Wed, 16 Jun 2010 20:57:00 +0200
Subject: [PATCH] Added some tests as initial starting point.
---
plemp.rb | 74 ++++++++++++++++++++++++++++++++++++++++++++++++++
public/drag.js | 61 +++++++++++++++++++++++++++++++++++++++++
2 files changed, 135 insertions(+)
create mode 100644 plemp.rb
create mode 100644 public/drag.js
diff --git a/plemp.rb b/plemp.rb
new file mode 100644
index 0000000..413f298
--- /dev/null
+++ b/plemp.rb
@@ -0,0 +1,74 @@
+require "camping"
+require "markaby"
+require "pathname"
+
+Camping.goes :Plemp
+
+Markaby::Builder.set(:indent, 2)
+PUBLIC_DIR = Pathname.new(__FILE__).dirname + "public"
+
+module Plemp::Controllers
+
+ class Index
+ def get
+ render :main
+ end
+ end
+
+ class PublicX
+ MIME_TYPES = {'.css' => 'text/css',
+ '.js' => 'text/javascript',
+ '.jpg' => 'image/jpeg'}
+
+ def get(path)
+ @headers['Content-Type'] = MIME_TYPES[path[/\.\w+$/, 0]] || "text/plain"
+ unless path.include? ".." # prevent directory traversal attacks
+ @headers['X-Sendfile'] = "#{PUBLIC_DIR}/#{path}"
+ else
+ @status = "403"
+ "403 - Invalid path"
+ end
+ end
+ end
+
+ class SaveposXXX
+ def post(id, top, left)
+ $stderr.puts("Got: top: #{top}, left: #{left}")
+ ""
+ end
+ end
+
+end
+
+module Plemp::Views
+
+ def layout
+ xhtml_strict do
+ head do
+ title "Plemp!"
+ ['drag', 'prototype', 'effects', 'controls'].each do |js|
+ script :src => R(PublicX, "#{js}.js"), :type => "text/javascript"
+ end
+ end
+ body do
+ self << yield
+ end
+ end
+ end
+
+ def main
+ div.first! :style => "position:absolute;top:120px;left:100px",
+ :onmousedown => "drag(event)" do "First" end
+ div.second! :style => "position:absolute;top:170px;left:300px",
+ :onmousedown => "drag(event)",
+ :onmouseup => _savepos do "Second" end
+ end
+
+ def _savepos
+ "new Ajax.Request('http://localhost:3301/savepos/' + " +
+ "this.id + '/' + this.style.top + '/' + this.style.left); " +
+ "return false;"
+ end
+
+
+end
diff --git a/public/drag.js b/public/drag.js
new file mode 100644
index 0000000..da4f934
--- /dev/null
+++ b/public/drag.js
@@ -0,0 +1,61 @@
+// Global object to hold drag information.
+var dragObj = new Object();
+dragObj.zIndex = 0;
+
+function drag(event, id) {
+ var x, y;
+
+ // If an element id was given, find it. Otherwise use the element being
+ // clicked on.
+ if (id)
+ dragObj.elNode = document.getElementById(id);
+ else {
+ dragObj.elNode = event.target;
+ // If this is a text node, use its parent element.
+ if (dragObj.elNode.nodeType == 3)
+ dragObj.elNode = dragObj.elNode.parentNode;
+ }
+
+ // Get cursor position with respect to the page.
+ x = event.clientX + window.scrollX;
+ y = event.clientY + window.scrollY;
+
+ // Save starting positions of cursor and element.
+ dragObj.cursorStartX = x;
+ dragObj.cursorStartY = y;
+ dragObj.elStartLeft = parseInt(dragObj.elNode.style.left, 10);
+ dragObj.elStartTop = parseInt(dragObj.elNode.style.top, 10);
+
+ if (isNaN(dragObj.elStartLeft)) dragObj.elStartLeft = 0;
+ if (isNaN(dragObj.elStartTop)) dragObj.elStartTop = 0;
+
+ // Update element's z-index.
+ dragObj.elNode.style.zIndex = ++dragObj.zIndex;
+
+ // Capture mousemove and mouseup events on the page.
+ document.addEventListener("mousemove", dragGo, true);
+ document.addEventListener("mouseup", dragStop, true);
+ event.preventDefault();
+}
+
+function dragGo(event) {
+ var x, y;
+
+ // Get cursor position with respect to the page.
+ x = event.clientX + window.scrollX;
+ y = event.clientY + window.scrollY;
+
+ // Move drag element by the same amount the cursor has moved.
+
+ dragObj.elNode.style.left =
+ (dragObj.elStartLeft + x - dragObj.cursorStartX) + "px";
+ dragObj.elNode.style.top =
+ (dragObj.elStartTop + y - dragObj.cursorStartY) + "px";
+ event.preventDefault();
+}
+
+function dragStop(event) {
+ // Stop capturing mousemove and mouseup events.
+ document.removeEventListener("mousemove", dragGo, true);
+ document.removeEventListener("mouseup", dragStop, true);
+}