move -> drag
This commit is contained in:
parent
6d69ae3910
commit
fa04558a71
16
4chan_x.js
16
4chan_x.js
@ -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;
|
||||||
|
|||||||
@ -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
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user