normailze variables

This commit is contained in:
James Campos 2011-01-15 17:18:46 -08:00
parent 044a1548e3
commit c7e57a9cd1
2 changed files with 53 additions and 54 deletions

View File

@ -74,10 +74,10 @@ AEOS =
class Dialog class Dialog
constructor: (id, position, html) -> constructor: (id, position, html) ->
@el = dialog = document.createElement 'div' @el = el = document.createElement 'div'
dialog.className = 'reply dialog' el.className = 'reply dialog'
dialog.innerHTML = html el.innerHTML = html
dialog.id = id el.id = id
switch position switch position
when 'topleft' when 'topleft'
left = '0px' left = '0px'
@ -96,42 +96,41 @@ class Dialog
top = '25%' top = '25%'
left = GM_getValue "#{id}Left", left left = GM_getValue "#{id}Left", left
top = GM_getValue "#{id}Top", top top = GM_getValue "#{id}Top", top
if left then dialog.style.left = left else dialog.style.right = '0px' if left then el.style.left = left else el.style.right = '0px'
if top then dialog.style.top = top else dialog.style.bottom = '0px' if top then el.style.top = top else el.style.bottom = '0px'
$('div.move', el).addEventListener 'mousedown', @move, true
$('div.move', dialog).addEventListener 'mousedown', @move, true $('div.move a[name=close]', el)?.addEventListener 'click', (-> remove el), true
$('div.move a[name=close]', dialog)?.addEventListener 'click', (-> remove dialog), true
move: (e) => move: (e) =>
div = @el el = @el
#distance from pointer to div edge is constant; calculate it here. #distance from pointer to el edge is constant; calculate it here.
@dx = e.clientX - div.offsetLeft @dx = e.clientX - el.offsetLeft
@dy = e.clientY - div.offsetTop @dy = e.clientY - el.offsetTop
#factor out div from document dimensions #factor out el from document dimensions
@width = document.body.clientWidth - div.offsetWidth @width = document.body.clientWidth - el.offsetWidth
@height = document.body.clientHeight - div.offsetHeight @height = document.body.clientHeight - el.offsetHeight
document.addEventListener 'mousemove', @moveMove, true document.addEventListener 'mousemove', @moveMove, true
document.addEventListener 'mouseup', @moveEnd, true document.addEventListener 'mouseup', @moveEnd, true
moveMove: (e) => moveMove: (e) =>
div = @el el = @el
left = e.clientX - @dx left = e.clientX - @dx
if left < 20 then left = '0px' if left < 20 then left = '0px'
else if @width - left < 20 then left = '' else if @width - left < 20 then left = ''
right = if left then '' else '0px' right = if left then '' else '0px'
div.style.left = left el.style.left = left
div.style.right = right el.style.right = right
top = e.clientY - @dy top = e.clientY - @dy
if top < 20 then top = '0px' if top < 20 then top = '0px'
else if @height - top < 20 then top = '' else if @height - top < 20 then top = ''
bottom = if top then '' else '0px' bottom = if top then '' else '0px'
div.style.top = top el.style.top = top
div.style.bottom = bottom el.style.bottom = bottom
moveEnd: => moveEnd: =>
document.removeEventListener 'mousemove', @moveMove, true document.removeEventListener 'mousemove', @moveMove, true
document.removeEventListener 'mouseup', @moveEnd, true document.removeEventListener 'mouseup', @moveEnd, true
div = @el el = @el
id = div.id id = el.id
GM_setValue "#{id}Left", div.style.left GM_setValue "#{id}Left", el.style.left
GM_setValue "#{id}Top", div.style.top GM_setValue "#{id}Top", el.style.top
#convenience #convenience
d = document d = document

View File

@ -77,11 +77,11 @@
function Dialog(id, position, html) { function Dialog(id, position, html) {
this.moveEnd = __bind(this.moveEnd, this);; this.moveEnd = __bind(this.moveEnd, this);;
this.moveMove = __bind(this.moveMove, this);; this.moveMove = __bind(this.moveMove, this);;
this.move = __bind(this.move, this);; var dialog, left, top, _ref; this.move = __bind(this.move, this);; var el, left, top, _ref;
this.el = dialog = document.createElement('div'); this.el = el = document.createElement('div');
dialog.className = 'reply dialog'; el.className = 'reply dialog';
dialog.innerHTML = html; el.innerHTML = html;
dialog.id = id; el.id = id;
switch (position) { switch (position) {
case 'topleft': case 'topleft':
left = '0px'; left = '0px';
@ -106,35 +106,35 @@
left = GM_getValue("" + id + "Left", left); left = GM_getValue("" + id + "Left", left);
top = GM_getValue("" + id + "Top", top); top = GM_getValue("" + id + "Top", top);
if (left) { if (left) {
dialog.style.left = left; el.style.left = left;
} else { } else {
dialog.style.right = '0px'; el.style.right = '0px';
} }
if (top) { if (top) {
dialog.style.top = top; el.style.top = top;
} else { } else {
dialog.style.bottom = '0px'; el.style.bottom = '0px';
} }
$('div.move', dialog).addEventListener('mousedown', this.move, true); $('div.move', el).addEventListener('mousedown', this.move, true);
if ((_ref = $('div.move a[name=close]', dialog)) != null) { if ((_ref = $('div.move a[name=close]', el)) != null) {
_ref.addEventListener('click', (function() { _ref.addEventListener('click', (function() {
return remove(dialog); return remove(el);
}), true); }), true);
} }
} }
Dialog.prototype.move = function(e) { Dialog.prototype.move = function(e) {
var div; var el;
div = this.el; el = this.el;
this.dx = e.clientX - div.offsetLeft; this.dx = e.clientX - el.offsetLeft;
this.dy = e.clientY - div.offsetTop; this.dy = e.clientY - el.offsetTop;
this.width = document.body.clientWidth - div.offsetWidth; this.width = document.body.clientWidth - el.offsetWidth;
this.height = document.body.clientHeight - div.offsetHeight; this.height = document.body.clientHeight - el.offsetHeight;
document.addEventListener('mousemove', this.moveMove, true); document.addEventListener('mousemove', this.moveMove, true);
return document.addEventListener('mouseup', this.moveEnd, true); return document.addEventListener('mouseup', this.moveEnd, true);
}; };
Dialog.prototype.moveMove = function(e) { Dialog.prototype.moveMove = function(e) {
var bottom, div, left, right, top; var bottom, el, left, right, top;
div = this.el; el = this.el;
left = e.clientX - this.dx; left = e.clientX - this.dx;
if (left < 20) { if (left < 20) {
left = '0px'; left = '0px';
@ -142,8 +142,8 @@
left = ''; left = '';
} }
right = left ? '' : '0px'; right = left ? '' : '0px';
div.style.left = left; el.style.left = left;
div.style.right = right; el.style.right = right;
top = e.clientY - this.dy; top = e.clientY - this.dy;
if (top < 20) { if (top < 20) {
top = '0px'; top = '0px';
@ -151,17 +151,17 @@
top = ''; top = '';
} }
bottom = top ? '' : '0px'; bottom = top ? '' : '0px';
div.style.top = top; el.style.top = top;
return div.style.bottom = bottom; return el.style.bottom = bottom;
}; };
Dialog.prototype.moveEnd = function() { Dialog.prototype.moveEnd = function() {
var div, id; var el, id;
document.removeEventListener('mousemove', this.moveMove, true); document.removeEventListener('mousemove', this.moveMove, true);
document.removeEventListener('mouseup', this.moveEnd, true); document.removeEventListener('mouseup', this.moveEnd, true);
div = this.el; el = this.el;
id = div.id; id = el.id;
GM_setValue("" + id + "Left", div.style.left); GM_setValue("" + id + "Left", el.style.left);
return GM_setValue("" + id + "Top", div.style.top); return GM_setValue("" + id + "Top", el.style.top);
}; };
return Dialog; return Dialog;
})(); })();