move -> drag

This commit is contained in:
James Campos 2011-04-29 19:31:31 -07:00
parent 6d69ae3910
commit fa04558a71
2 changed files with 16 additions and 16 deletions

View File

@ -168,7 +168,7 @@
} else { } else {
el.style.bottom = '0px'; el.style.bottom = '0px';
} }
el.querySelector('div.move').addEventListener('mousedown', ui.move, true); el.querySelector('div.move').addEventListener('mousedown', ui.dragstart, true);
if ((_ref3 = el.querySelector('div.move a[name=close]')) != null) { if ((_ref3 = el.querySelector('div.move a[name=close]')) != null) {
_ref3.addEventListener('click', (function() { _ref3.addEventListener('click', (function() {
return el.parentNode.removeChild(el); return el.parentNode.removeChild(el);
@ -176,7 +176,7 @@
} }
return el; return el;
}, },
move: function(e) { dragstart: function(e) {
var el, rect; var el, rect;
ui.el = el = e.target.parentNode; ui.el = el = e.target.parentNode;
document.body.className = 'noselect'; document.body.className = 'noselect';
@ -185,10 +185,10 @@
ui.dy = e.clientY - rect.top; ui.dy = e.clientY - rect.top;
ui.width = document.body.clientWidth - el.offsetWidth; ui.width = document.body.clientWidth - el.offsetWidth;
ui.height = document.body.clientHeight - el.offsetHeight; ui.height = document.body.clientHeight - el.offsetHeight;
document.addEventListener('mousemove', ui.moveMove, true); document.addEventListener('mousemove', ui.drag, true);
return document.addEventListener('mouseup', ui.moveEnd, true); return document.addEventListener('mouseup', ui.dragend, true);
}, },
moveMove: function(e) { drag: function(e) {
var bottom, el, left, right, top; var bottom, el, left, right, top;
el = ui.el; el = ui.el;
left = e.clientX - ui.dx; left = e.clientX - ui.dx;
@ -210,10 +210,10 @@
el.style.top = top; el.style.top = top;
return el.style.bottom = bottom; return el.style.bottom = bottom;
}, },
moveEnd: function() { dragend: function() {
var el, id; var el, id;
document.removeEventListener('mousemove', ui.moveMove, true); document.removeEventListener('mousemove', ui.drag, true);
document.removeEventListener('mouseup', ui.moveEnd, true); document.removeEventListener('mouseup', ui.dragend, true);
el = ui.el; el = ui.el;
id = el.id; id = el.id;
localStorage["" + id + "Left"] = el.style.left; localStorage["" + id + "Left"] = el.style.left;

View File

@ -92,11 +92,11 @@ ui =
top = localStorage["#{id}Top"] ? top top = localStorage["#{id}Top"] ? top
if left then el.style.left = left else el.style.right = '0px' if left then el.style.left = left else el.style.right = '0px'
if top then el.style.top = top else el.style.bottom = '0px' if top then el.style.top = top else el.style.bottom = '0px'
el.querySelector('div.move').addEventListener 'mousedown', ui.move, true el.querySelector('div.move').addEventListener 'mousedown', ui.dragstart, true
el.querySelector('div.move a[name=close]')?.addEventListener 'click', el.querySelector('div.move a[name=close]')?.addEventListener 'click',
(-> el.parentNode.removeChild(el)), true (-> el.parentNode.removeChild(el)), true
el el
move: (e) -> dragstart: (e) ->
ui.el = el = e.target.parentNode ui.el = el = e.target.parentNode
document.body.className = 'noselect' document.body.className = 'noselect'
#distance from pointer to el edge is constant; calculate it here. #distance from pointer to el edge is constant; calculate it here.
@ -107,9 +107,9 @@ ui =
#factor out el from document dimensions #factor out el from document dimensions
ui.width = document.body.clientWidth - el.offsetWidth ui.width = document.body.clientWidth - el.offsetWidth
ui.height = document.body.clientHeight - el.offsetHeight ui.height = document.body.clientHeight - el.offsetHeight
document.addEventListener 'mousemove', ui.moveMove, true document.addEventListener 'mousemove', ui.drag, true
document.addEventListener 'mouseup', ui.moveEnd, true document.addEventListener 'mouseup', ui.dragend, true
moveMove: (e) -> drag: (e) ->
{el} = ui {el} = ui
left = e.clientX - ui.dx left = e.clientX - ui.dx
if left < 20 then left = '0px' if left < 20 then left = '0px'
@ -123,9 +123,9 @@ ui =
bottom = if top then '' else '0px' bottom = if top then '' else '0px'
el.style.top = top el.style.top = top
el.style.bottom = bottom el.style.bottom = bottom
moveEnd: -> dragend: ->
document.removeEventListener 'mousemove', ui.moveMove, true document.removeEventListener 'mousemove', ui.drag, true
document.removeEventListener 'mouseup', ui.moveEnd, true document.removeEventListener 'mouseup', ui.dragend, true
{el} = ui #{id} = {el} = ui doesn't work {el} = ui #{id} = {el} = ui doesn't work
{id} = el {id} = el
localStorage["#{id}Left"] = el.style.left localStorage["#{id}Left"] = el.style.left