err.no Git - scalable-opengroupware.org/blob - UI/WebServerResources/SOGoDragHandles.js

   1 var SOGoDragHandlesInterface = {
   2   dhType: null,
   3   origX: -1,
   4   origLeft: -1,
   5   origRight: -1,
   6   origY: -1,
   7   origUpper: -1,
   8   origLower: -1,
   9   delta: -1,
  10   leftBlock: null,
  11   rightBlock: null,
  12   upperBlock: null,
  13   lowerBlock: null,
  14   startHandleDraggingBinded: null,
  15   stopHandleDraggingBinded: null,
  16   moveBinded: null,
  17   bind: function () {
  18     this.startHandleDraggingBound = this.startHandleDragging.bindAsEventListener(this);
  19     Event.observe(this, "mousedown", this.startHandleDraggingBound, false);
  20   },
  21   _determineType: function () {
  22     if (this.leftBlock && this.rightBlock)
  23       this.dhType = 'horizontal';
  24     else if (this.upperBlock && this.lowerBlock)
  25       this.dhType = 'vertical';
  26   },
  27   startHandleDragging: function (event) {
  28     if (!this.dhType)
  29       this._determineType();
  30     var targ;
  31     if (!event)
  32       var event = window.event;
  33     if (event.target)
  34       targ = event.target
  35     else if (event.srcElement)
  36       targ = event.srcElement
  37     if (targ.nodeType == 1) {
  38       if (this.dhType == 'horizontal') {
  39         this.origX = this.offsetLeft;
  40         this.origLeft = this.leftBlock.offsetWidth;
  41         delta = 0;
  42         this.origRight = this.rightBlock.offsetLeft - 5;
  43         document.body.setStyle({ cursor: "e-resize" });
  44       } else if (this.dhType == 'vertical') {
  45         this.origY = this.offsetTop;
  46         this.origUpper = this.upperBlock.offsetHeight;
  47         delta = event.clientY - this.offsetTop - 5;
  48         this.origLower = this.lowerBlock.offsetTop - 5;
  49         document.body.setStyle({ cursor: "n-resize" });
  50       }
  51       this.stopHandleDraggingBound = this.stopHandleDragging.bindAsEventListener(this);
  52       Event.observe(document.body, "mouseup", this.stopHandleDraggingBound, true);
  53       this.moveBound = this.move.bindAsEventListener(this);
  54       Event.observe(document.body, "mousemove", this.moveBound, true);
  55       this.move(event);
  56       event.cancelBubble = true;
  57     }
  58
  59     return false;
  60   },
  61   stopHandleDragging: function (event) {
  62     if (!this.dhType)
  63       this._determineType();
  64     if (this.dhType == 'horizontal') {
  65       var deltaX
  66         = Math.floor(event.clientX - this.origX - (this.offsetWidth / 2));
  67       this.rightBlock.setStyle({ left: (this.origRight + deltaX) + 'px' });
  68       this.leftBlock.setStyle({ width: (this.origLeft + deltaX) + 'px' });
  69     } else if (this.dhType == 'vertical') {
  70       var deltaY
  71         = Math.floor(event.clientY - this.origY - (this.offsetHeight / 2));
  72       this.lowerBlock.setStyle({ top: (this.origLower + deltaY - delta) + 'px' });
  73       this.upperBlock.setStyle({ height: (this.origUpper + deltaY - delta) + 'px' });
  74     }
  75
  76     Event.stopObserving(document.body, "mouseup", this.stopHandleDraggingBound, true);
  77     Event.stopObserving(document.body, "mousemove", this.moveBound, true);
  78
  79     document.body.setAttribute('style', '');
  80
  81     this.move(event);
  82     event.cancelBubble = true;
  83
  84     return false;
  85   },
  86   move: function (event) {
  87     if (!this.dhType)
  88       this._determineType();
  89     if (this.dhType == 'horizontal') {
  90       var width = this.offsetWidth;
  91       var hX = event.clientX;
  92       if (hX > -1) {
  93         var newLeft = Math.floor(hX - (width / 2));
  94         this.setStyle({ left: newLeft + 'px' });
  95         event.cancelBubble = true;
  96
  97         return false;
  98       }
  99     } else if (this.dhType == 'vertical') {
 100       var height = this.offsetHeight;
 101       var hY = event.clientY;
 102       if (hY > -1) {
 103         var newTop = Math.floor(hY - (height / 2))  - delta;
 104         this.setStyle({ top: newTop + 'px' });
 105         event.cancelBubble = true;
 106
 107         return false;
 108       }
 109     }
 110   },
 111   doubleClick: function (event) {
 112     if (!this.dhType)
 113       this._determineType();
 114     if (this.dhType == 'horizontal') {
 115       var lLeft = this.leftBlock.offsetLeft;
 116
 117       if (this.offsetLeft > lLeft) {
 118         var leftdelta = this.rightBlock.offsetLeft - this.offsetLeft;
 119
 120         this.setStyle({ left: lLeft + 'px' });
 121         this.leftBlock.setStyle({ width: '0px' });
 122         this.rightBlock.setStyle({ left: (lLeft + leftdelta) + 'px' });
 123       }
 124     } else if (this.dhType == 'vertical') {
 125       var uTop = this.upperBlock.offsetTop;
 126
 127       if (this.offsetTop > uTop) {
 128         var topdelta = this.lowerBlock.offsetTop - this.offsetTop;
 129
 130         this.setStyle({ top: uTop + 'px' });
 131         this.upperBlock.setStyle({ width: '0px' });
 132         this.lowerBlock.setStyle({ top: (uTop + topdelta) + 'px' });
 133       }
 134     }
 135   }
 136
 137 };