Chapril/xmpp.chapril.org-conversejs
Chapril/xmpp.chapril.org-conversejs
24
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

Refactored, simplified and removed unused code.

Browse Source
This commit is contained in:
JC Brand 2014-02-20 12:40:03 +02:00
parent 12fc286ca6
commit 3687631d2c
1 changed files with 78 additions and 153 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

231
src/dragresize.js
View File

@ -17,48 +17,6 @@ Simplified and modified for Converse.js by JC Brand https://opkode.com
root.DragResize = factory();
}
}(this, function () {
// Common API code.
if (typeof addEvent != 'function') {
var removeEvent = function(o, t, f, l) {
var d = 'removeEventListener';
if (o[d] && !l) {
return o[d](t, f, false);
}
if (o._evts && o._evts[t] && f._i) {
delete o._evts[t][f._i];
}
};
var addEvent = function(o, t, f, l) {
var d = 'addEventListener', n = 'on' + t, rO = o, rT = t, rF = f, rL = l;
if (o[d] && !l) {
return o[d](t, f, false);
}
if (!o._evts) {
o._evts = {};
}
if (!o._evts[t]) {
o._evts[t] = o[n] ? { b: o[n] } : {};
o[n] = new Function('e',
'var r = true, o = this, a = o._evts["' + t + '"], i; for (i in a) {' +
'o._f = a[i]; r = o._f(e||window.event) != false && r; o._f = null;' +
'} return r'
);
if (t != 'unload') {
addEvent(window, 'unload', function() {
removeEvent(rO, rT, rF, rL);
});
}
}
if (!f._i) {
f._i = addEvent._i++;
}
o._evts[t][f._i] = f;
};
addEvent._i = 1;
}
function cancelEvent(e, c) {
e.returnValue = false;
if (e.preventDefault) {
@ -83,22 +41,16 @@ Simplified and modified for Converse.js by JC Brand https://opkode.com
element: null, // The currently selected element.
handle: null, // Active handle reference of the element.
minWidth: 10, minHeight: 10, // Minimum pixel size of elements.
minLeft: 0, maxLeft: 9999, // Bounding box area, in pixels.
minTop: 0, maxTop: 9999,
zIndex: 1, // The highest Z-Index yet allocated.
mouseX: 0, mouseY: 0, // Current mouse position, recorded live.
lastMouseX: 0, lastMouseY: 0, // Last processed mouse positions.
mOffX: 0, mOffY: 0, // A known offset between position & mouse.
elmX: 0, elmY: 0, // Element position.
elmW: 0, elmH: 0, // Element size.
allowBlur: true, // Whether to allow automatic blur onclick.
ondragfocus: null, // Event handler functions.
ondragstart: null,
ondragmove: null,
ondragend: null,
ondragblur: null
};
for (var p in props) {
this[p] = (typeof config[p] == 'undefined') ? props[p] : config[p];
}
@ -106,13 +58,13 @@ Simplified and modified for Converse.js by JC Brand https://opkode.com
DragResize.prototype.apply = function(node) {
// Adds object event handlers to the specified DOM node.
var obj = this;
addEvent(node, 'mousedown', function(e) { obj.mouseDown(e) } );
addEvent(node, 'mousemove', function(e) { obj.mouseMove(e) } );
addEvent(node, 'mouseup', function(e) { obj.mouseUp(e) } );
/* Adds object event handlers to the specified DOM node */
$(node).bind('mousedown', this.mouseDown.bind(this));
$(node).bind('mousemove', this.mouseMove.bind(this));
$(node).bind('mouseup', this.mouseUp.bind(this));
};
DragResize.prototype.select = function(newElement) {
with (this) {
// Selects an element for dragging.
@ -124,8 +76,6 @@ Simplified and modified for Converse.js by JC Brand https://opkode.com
// Elevate it
element.style.zIndex = ++zIndex;
// Record element attributes for mouseMove().
elmX = parseInt(element.style.left);
elmY = parseInt(element.style.top);
elmW = element.offsetWidth;
elmH = element.offsetHeight;
if (ondragfocus) this.ondragfocus();
@ -185,53 +135,16 @@ Simplified and modified for Converse.js by JC Brand https://opkode.com
}
};
DragResize.prototype.mouseMove = function(e) { with (this) {
// This continually offsets the dragged element by the difference between the
// last recorded mouse position (mouseX/Y) and the current mouse position.
if (!document.getElementById || !enabled) return true;
// We always record the current mouse position.
mouseX = e.pageX || e.clientX + document.documentElement.scrollLeft;
mouseY = e.pageY || e.clientY + document.documentElement.scrollTop;
// Record the relative mouse movement, in case we're dragging.
// Add any previously stored & ignored offset to the calculations.
var diffX = mouseX - lastMouseX + mOffX;
var diffY = mouseY - lastMouseY + mOffY;
mOffX = mOffY = 0;
// Update last processed mouse positions.
lastMouseX = mouseX;
lastMouseY = mouseY;
DragResize.prototype.updateMouseCoordinates = function (e) {
/* Update last processed mouse positions */
this.mOffX = this.mOffY = 0;
this.lastMouseX = e.pageX || e.clientX + document.documentElement.scrollLeft;
this.lastMouseY = e.pageY || e.clientY + document.documentElement.scrollTop;
};
// That's all we do if we're not dragging anything.
if (!handle) return true;
// If included in the script, run the resize handle drag routine.
// Let it create an object representing the drag offsets.
var isResize = false;
if (this.resizeHandleDrag && this.resizeHandleDrag(diffX, diffY)) {
isResize = true;
} else {
// If the resize drag handler isn't set or returns fase (to indicate the drag was
// not on a resize handle), we must be dragging the whole element, so move that.
// Bounds check left-right...
var dX = diffX, dY = diffY;
if (elmX + dX < minLeft) mOffX = (dX - (diffX = minLeft - elmX));
else if (elmX + elmW + dX > maxLeft) mOffX = (dX - (diffX = maxLeft - elmX - elmW));
// ...and up-down.
if (elmY + dY < minTop) mOffY = (dY - (diffY = minTop - elmY));
else if (elmY + elmH + dY > maxTop) mOffY = (dY - (diffY = maxTop - elmY - elmH));
elmX += diffX;
elmY += diffY;
}
// Assign new info back to the element, with minimum dimensions.
with (element.style) {
left = elmX + 'px';
width = elmW + 'px';
top = elmY + 'px';
height = elmH + 'px';
}
DragResize.prototype.operaHack = function (e) {
// Evil, dirty, hackish Opera select-as-you-drag fix.
if (window.opera && document.documentElement) {
var oDF = document.getElementById('op-drag-fix');
@ -243,65 +156,77 @@ Simplified and modified for Converse.js by JC Brand https://opkode.com
}
oDF.focus();
}
};
if (ondragmove) this.ondragmove(isResize);
// Stop a normal drag event.
cancelEvent(e);
}};
DragResize.prototype.resizeElement = function (e) {
// Let it create an object representing the drag offsets.
var resize = this.resizeHandleDrag(e) ? true : false;
// Assign new info back to the element, with minimum dimensions.
this.element.style.width = this.elmW + 'px';
this.element.style.height = this.elmH + 'px';
this.operaHack();
return e;
};
DragResize.prototype.mouseUp = function(e) { with (this) {
// On mouseup, stop dragging, but don't reset handler visibility.
if (!document.getElementById || !enabled) return;
var hRE = new RegExp(myName + '-([trmbl]{2})', '');
if (handle && ondragend) this.ondragend(hRE.test(handle.className));
deselect(false);
}};
DragResize.prototype.resizeHandleDrag = function(diffX, diffY) { with (this) {
// Passed the mouse movement amounts. This function checks to see whether the
// drag is from a resize handle created above; if so, it changes the stored
// elm* dimensions and mOffX/Y.
var hClass = handle && handle.className &&
handle.className.match(new RegExp(myName + '-([tmblr]{2})')) ? RegExp.$1 : '';
// If the hClass is one of the resize handles, resize one or two dimensions.
// Bounds checking is the hard bit -- basically for each edge, check that the
// element doesn't go under minimum size, and doesn't go beyond its boundary.
var dY = diffY, dX = diffX, processed = false;
if (hClass.indexOf('t') >= 0) {
rs = 1;
if (elmH - dY < minHeight) mOffY = (dY - (diffY = elmH - minHeight));
else if (elmY + dY < minTop) mOffY = (dY - (diffY = minTop - elmY));
elmY += diffY;
elmH -= diffY;
processed = true;
DragResize.prototype.mouseMove = function (e) {
/* Continuously offsets the dragged element by the difference between the
* previous mouse position and the current mouse position.
*/
if (!this.enabled) return true;
if (!this.handle) {
// We're not dragging anything
this.updateMouseCoordinates(e);
return true;
}
if (hClass.indexOf('b') >= 0) {
rs = 1;
if (elmH + dY < minHeight) mOffY = (dY - (diffY = minHeight - elmH));
else if (elmY + elmH + dY > maxTop) mOffY = (dY - (diffY = maxTop - elmY - elmH));
elmH += diffY;
processed = true;
cancelEvent(this.resizeElement(e));
};
DragResize.prototype.mouseUp = function(e) {
with (this) {
// On mouseup, stop dragging, but don't reset handler visibility.
if (!document.getElementById || !enabled) return;
var hRE = new RegExp(myName + '-([trmbl]{2})', '');
if (handle && ondragend) this.ondragend(hRE.test(handle.className));
deselect(false);
}
if (hClass.indexOf('l') >= 0) {
rs = 1;
if (elmW - dX < minWidth) mOffX = (dX - (diffX = elmW - minWidth));
else if (elmX + dX < minLeft) mOffX = (dX - (diffX = minLeft - elmX));
elmX += diffX;
elmW -= diffX;
processed = true;
};
DragResize.prototype.resizeHandleDrag = function(e) {
/* Checks to see whether the
* drag is from a resize handle created above; if so, it changes the stored
* elm* dimensions and mOffX/Y.
*/
var x = e.pageX || e.clientX + document.documentElement.scrollLeft;
var y = e.pageY || e.clientY + document.documentElement.scrollTop;
var diffX = x - this.lastMouseX + this.mOffX;
var diffY = y - this.lastMouseY + this.mOffY;
var hClass = this.handle &&
this.handle.className &&
this.handle.className.match(new RegExp(this.myName + '-([tmblr]{2})')) ? RegExp.$1 : '';
with (this) {
// If the hClass is one of the resize handles, resize one or two dimensions.
// Bounds checking is the hard bit -- basically for each edge, check that the
// element doesn't go under minimum size, and doesn't go beyond its boundary.
var dY = diffY, dX = diffX, processed = false;
if (hClass.indexOf('t') >= 0) {
rs = 1;
if (elmH - dY < minHeight) mOffY = (dY - (diffY = elmH - minHeight));
elmH -= diffY;
processed = true;
}
if (hClass.indexOf('b') >= 0) {
rs = 1;
if (elmH + dY < minHeight) mOffY = (dY - (diffY = minHeight - elmH));
elmH += diffY;
processed = true;
}
this.updateMouseCoordinates(e);
return processed;
}
if (hClass.indexOf('r') >= 0) {
rs = 1;
if (elmW + dX < minWidth) mOffX = (dX - (diffX = minWidth - elmW));
else if (elmX + elmW + dX > maxLeft) mOffX = (dX - (diffX = maxLeft - elmX - elmW));
elmW += diffX;
processed = true;
}
return processed;
}};
};
return DragResize;
}));