2006-11-09 20:47:10 +01:00
|
|
|
var SOGoDragHandlesInterface = {
|
|
|
|
dhType: null,
|
|
|
|
origX: -1,
|
|
|
|
origLeft: -1,
|
|
|
|
origRight: -1,
|
|
|
|
origY: -1,
|
|
|
|
origUpper: -1,
|
|
|
|
origLower: -1,
|
|
|
|
delta: -1,
|
|
|
|
leftBlock: null,
|
|
|
|
rightBlock: null,
|
|
|
|
upperBlock: null,
|
|
|
|
lowerBlock: null,
|
2007-05-25 16:29:44 +02:00
|
|
|
startHandleDraggingBinded: null,
|
|
|
|
stopHandleDraggingBinded: null,
|
|
|
|
moveBinded: null,
|
2006-11-09 20:47:10 +01:00
|
|
|
bind: function () {
|
2007-05-25 17:40:05 +02:00
|
|
|
this.startHandleDraggingBound = this.startHandleDragging.bindAsEventListener(this);
|
|
|
|
Event.observe(this, "mousedown", this.startHandleDraggingBound, false);
|
2007-05-09 23:27:55 +02:00
|
|
|
this.onmousedown = function() { return false }
|
2006-11-09 20:47:10 +01:00
|
|
|
},
|
|
|
|
_determineType: function () {
|
|
|
|
if (this.leftBlock && this.rightBlock)
|
|
|
|
this.dhType = 'horizontal';
|
|
|
|
else if (this.upperBlock && this.lowerBlock)
|
|
|
|
this.dhType = 'vertical';
|
|
|
|
},
|
|
|
|
startHandleDragging: function (event) {
|
|
|
|
if (!this.dhType)
|
|
|
|
this._determineType();
|
2007-05-09 23:27:55 +02:00
|
|
|
var targ;
|
|
|
|
if (!event)
|
|
|
|
var event = window.event;
|
|
|
|
if (event.target)
|
|
|
|
targ = event.target
|
|
|
|
else if (event.srcElement)
|
|
|
|
targ = event.srcElement
|
|
|
|
if (targ.nodeType == 1) {
|
2006-11-09 20:47:10 +01:00
|
|
|
if (this.dhType == 'horizontal') {
|
|
|
|
this.origX = this.offsetLeft;
|
|
|
|
this.origLeft = this.leftBlock.offsetWidth;
|
|
|
|
delta = 0;
|
|
|
|
this.origRight = this.rightBlock.offsetLeft - 5;
|
|
|
|
document.body.style.cursor = "e-resize";
|
|
|
|
} else if (this.dhType == 'vertical') {
|
|
|
|
this.origY = this.offsetTop;
|
|
|
|
this.origUpper = this.upperBlock.offsetHeight;
|
2006-11-09 23:55:04 +01:00
|
|
|
delta = event.clientY - this.offsetTop - 5;
|
2006-11-09 20:47:10 +01:00
|
|
|
this.origLower = this.lowerBlock.offsetTop - 5;
|
|
|
|
document.body.style.cursor = "n-resize";
|
|
|
|
}
|
2007-05-25 17:40:05 +02:00
|
|
|
this.stopHandleDraggingBound = this.stopHandleDragging.bindAsEventListener(this);
|
|
|
|
Event.observe(document.body, "mouseup", this.stopHandleDraggingBound, true);
|
|
|
|
this.moveBound = this.move.bindAsEventListener(this);
|
|
|
|
Event.observe(document.body, "mousemove", this.moveBound, true);
|
2006-11-09 20:47:10 +01:00
|
|
|
this.move(event);
|
|
|
|
event.cancelBubble = true;
|
|
|
|
}
|
|
|
|
|
|
|
|
return false;
|
|
|
|
},
|
|
|
|
stopHandleDragging: function (event) {
|
|
|
|
if (!this.dhType)
|
|
|
|
this._determineType();
|
|
|
|
if (this.dhType == 'horizontal') {
|
|
|
|
var deltaX
|
|
|
|
= Math.floor(event.clientX - this.origX - (this.offsetWidth / 2));
|
2007-05-09 23:27:55 +02:00
|
|
|
this.rightBlock.style.left = (this.origRight + deltaX) + 'px';
|
|
|
|
this.leftBlock.style.width = (this.origLeft + deltaX) + 'px';
|
2006-11-09 20:47:10 +01:00
|
|
|
} else if (this.dhType == 'vertical') {
|
|
|
|
var deltaY
|
|
|
|
= Math.floor(event.clientY - this.origY - (this.offsetHeight / 2));
|
2007-05-09 23:27:55 +02:00
|
|
|
this.lowerBlock.style.top = (this.origLower + deltaY - delta) + 'px';
|
|
|
|
this.upperBlock.style.height = (this.origUpper + deltaY - delta) + 'px';
|
2006-11-09 20:47:10 +01:00
|
|
|
}
|
|
|
|
|
2007-05-25 17:40:05 +02:00
|
|
|
Event.stopObserving(document.body, "mouseup", this.stopHandleDraggingBound, true);
|
|
|
|
Event.stopObserving(document.body, "mousemove", this.moveBound, true);
|
2007-05-25 16:29:44 +02:00
|
|
|
|
2006-11-09 20:47:10 +01:00
|
|
|
document.body.setAttribute('style', '');
|
2007-05-25 16:29:44 +02:00
|
|
|
|
2006-11-09 20:47:10 +01:00
|
|
|
this.move(event);
|
|
|
|
event.cancelBubble = true;
|
|
|
|
|
|
|
|
return false;
|
|
|
|
},
|
|
|
|
move: function (event) {
|
|
|
|
if (!this.dhType)
|
|
|
|
this._determineType();
|
|
|
|
if (this.dhType == 'horizontal') {
|
|
|
|
var width = this.offsetWidth;
|
|
|
|
var hX = event.clientX;
|
|
|
|
if (hX > -1) {
|
|
|
|
var newLeft = Math.floor(hX - (width / 2));
|
2007-05-09 23:27:55 +02:00
|
|
|
this.style.left = newLeft + 'px';
|
2006-11-09 20:47:10 +01:00
|
|
|
event.cancelBubble = true;
|
|
|
|
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
} else if (this.dhType == 'vertical') {
|
|
|
|
var height = this.offsetHeight;
|
|
|
|
var hY = event.clientY;
|
|
|
|
if (hY > -1) {
|
|
|
|
var newTop = Math.floor(hY - (height / 2)) - delta;
|
2007-05-09 23:27:55 +02:00
|
|
|
this.style.top = newTop + 'px';
|
2006-11-09 20:47:10 +01:00
|
|
|
event.cancelBubble = true;
|
|
|
|
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
},
|
|
|
|
doubleClick: function (event) {
|
|
|
|
if (!this.dhType)
|
|
|
|
this._determineType();
|
|
|
|
if (this.dhType == 'horizontal') {
|
|
|
|
var lLeft = this.leftBlock.offsetLeft;
|
|
|
|
|
|
|
|
if (this.offsetLeft > lLeft) {
|
|
|
|
var leftdelta = this.rightBlock.offsetLeft - this.offsetLeft;
|
|
|
|
|
2007-05-09 23:27:55 +02:00
|
|
|
this.style.left = lLeft + 'px';
|
2006-11-09 20:47:10 +01:00
|
|
|
this.leftBlock.style.width = '0px';
|
2007-05-09 23:27:55 +02:00
|
|
|
this.rightBlock.style.left = (lLeft + leftdelta) + 'px';
|
2006-11-09 20:47:10 +01:00
|
|
|
}
|
|
|
|
} else if (this.dhType == 'vertical') {
|
|
|
|
var uTop = this.upperBlock.offsetTop;
|
|
|
|
|
|
|
|
if (this.offsetTop > uTop) {
|
|
|
|
var topdelta = this.lowerBlock.offsetTop - this.offsetTop;
|
|
|
|
|
2007-05-09 23:27:55 +02:00
|
|
|
this.style.top = uTop + 'px';
|
2006-11-09 20:47:10 +01:00
|
|
|
this.upperBlock.style.width = '0px';
|
2007-05-09 23:27:55 +02:00
|
|
|
this.lowerBlock.style.top = (uTop + topdelta) + 'px';
|
2006-11-09 20:47:10 +01:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
};
|