[382] | 1 | (function() |
---|
| 2 | { |
---|
[1530] | 3 | var _element = null; |
---|
| 4 | var _elementA = null; |
---|
| 5 | var _elementB = null; |
---|
| 6 | var _parent = null; |
---|
[382] | 7 | |
---|
[1530] | 8 | function _configEvent(pObj, pEvent, pHandler) |
---|
[382] | 9 | { |
---|
[2925] | 10 | try |
---|
[382] | 11 | { |
---|
[2925] | 12 | if (typeof pObj == 'object') |
---|
[382] | 13 | { |
---|
[2925] | 14 | if (pEvent.substring(0, 2) == 'on') |
---|
| 15 | pEvent = pEvent.substring(2, pEvent.length); |
---|
| 16 | |
---|
| 17 | if (arguments.length == 3) |
---|
| 18 | { |
---|
| 19 | if (pObj.addEventListener) |
---|
| 20 | pObj.addEventListener(pEvent, pHandler, false); |
---|
| 21 | else |
---|
| 22 | if (pObj.attachEvent) |
---|
| 23 | pObj.attachEvent('on' + pEvent, pHandler); |
---|
| 24 | } |
---|
| 25 | else |
---|
| 26 | { |
---|
| 27 | if (arguments.length == 4) |
---|
| 28 | { |
---|
| 29 | if (pObj.removeEventListener && pObj.removeEventListener != 'undefined') |
---|
| 30 | pObj.removeEventListener(pEvent, pHandler, false); |
---|
| 31 | else |
---|
| 32 | if (pObj.detachEvent) |
---|
| 33 | pObj.detachEvent('on' + pEvent, pHandler); |
---|
| 34 | } |
---|
| 35 | } |
---|
[382] | 36 | } |
---|
| 37 | } |
---|
[2925] | 38 | catch(e){} |
---|
[382] | 39 | } |
---|
| 40 | |
---|
[1530] | 41 | function _drag(e) |
---|
| 42 | { |
---|
| 43 | if (typeof e.preventDefault != 'undefined') |
---|
| 44 | e.preventDefault(); |
---|
| 45 | else |
---|
| 46 | e.onselectstart = new Function("return false;"); |
---|
| 47 | |
---|
| 48 | _element = ( e.target ) ? e.target : e.srcElement; |
---|
| 49 | |
---|
| 50 | if ( _element ) |
---|
| 51 | { |
---|
| 52 | _configEvent(_element, 'onmousemove', _mouseMove); |
---|
| 53 | _configEvent(top.document, 'onmousemove', _mouseMove); |
---|
| 54 | |
---|
| 55 | _configEvent(_element, 'onmouseup', _mouseUp); |
---|
| 56 | _configEvent(top.document, 'onmouseup', _mouseUp); |
---|
| 57 | } |
---|
| 58 | } |
---|
| 59 | |
---|
| 60 | function _elementShadow( pId ) |
---|
| 61 | { |
---|
| 62 | if( _elementA ) |
---|
| 63 | { |
---|
| 64 | var _elShadow = document.createElement("div"); |
---|
| 65 | _elShadow.id = _elementA.id + "__Shadow"; |
---|
| 66 | _elShadow.setAttribute("onselectstart" , "return false"); |
---|
| 67 | _elShadow.style.width = _elementA.style.width; |
---|
| 68 | _elShadow.style.height = _elementA.style.height; |
---|
| 69 | _elShadow.style.top = _elementA.style.top; |
---|
| 70 | _elShadow.style.left = _elementA.style.left; |
---|
| 71 | _elShadow.style.zIndex = _elementA.style.zIndex; |
---|
| 72 | _elShadow.className = "x-shadow_Div"; |
---|
| 73 | |
---|
| 74 | return _elShadow; |
---|
| 75 | } |
---|
| 76 | } |
---|
| 77 | |
---|
| 78 | function _load() |
---|
| 79 | { |
---|
| 80 | if( arguments.length > 0 ) |
---|
| 81 | { |
---|
| 82 | var pId = arguments[0]; |
---|
| 83 | |
---|
| 84 | _configEvent(document.getElementById( pId + "__draggable"), 'onmousedown', _mouseDownShadow); |
---|
| 85 | } |
---|
| 86 | } |
---|
| 87 | |
---|
[382] | 88 | function _getMouseOffset(e, el) |
---|
| 89 | { |
---|
| 90 | var docPos = _getPosition(el); |
---|
| 91 | var mousePos = _mouseCoords(e); |
---|
| 92 | return { |
---|
| 93 | 'x' : mousePos.x - docPos.x, |
---|
| 94 | 'y' : mousePos.y - docPos.y |
---|
| 95 | }; |
---|
| 96 | } |
---|
| 97 | |
---|
| 98 | function _getPosition(_pObject) |
---|
| 99 | { |
---|
| 100 | var left = 0; |
---|
| 101 | var top = 0; |
---|
| 102 | |
---|
| 103 | while ( _pObject.offsetParent ) |
---|
| 104 | { |
---|
| 105 | left += _pObject.offsetLeft; |
---|
| 106 | top += _pObject.offsetTop; |
---|
| 107 | _pObject = _pObject.offsetParent; |
---|
| 108 | } |
---|
| 109 | |
---|
| 110 | left += _pObject.offsetLeft; |
---|
| 111 | top += _pObject.offsetTop; |
---|
| 112 | |
---|
| 113 | return { |
---|
| 114 | 'x' : left, |
---|
| 115 | 'y' : top |
---|
| 116 | }; |
---|
| 117 | } |
---|
| 118 | |
---|
| 119 | function _mouseCoords(ev) |
---|
| 120 | { |
---|
| 121 | var CoordX = ""; |
---|
| 122 | var CoordY = ""; |
---|
| 123 | |
---|
| 124 | if ( ev.pageX || ev.pageY ) |
---|
| 125 | return { |
---|
| 126 | 'x' : ev.pageX, |
---|
| 127 | 'y' : ev.pageY |
---|
| 128 | }; |
---|
| 129 | |
---|
| 130 | CoordX = ev.clientX + document.body.scrollLeft - document.body.clientLeft; |
---|
| 131 | CoordY = ev.clientY + document.body.scrollTop - document.body.clientTop; |
---|
[1530] | 132 | |
---|
[382] | 133 | return { |
---|
| 134 | 'x' : CoordX, |
---|
| 135 | 'y' : CoordY |
---|
| 136 | }; |
---|
| 137 | } |
---|
| 138 | |
---|
| 139 | function _mouseMove(e) |
---|
| 140 | { |
---|
| 141 | if ( _element ) |
---|
| 142 | { |
---|
| 143 | if ( _element.mouseOffset == null ) |
---|
| 144 | _element.mouseOffset = _getMouseOffset(e, _element); |
---|
| 145 | |
---|
| 146 | var mousePos = _mouseCoords(e); |
---|
| 147 | |
---|
| 148 | var x = mousePos.x - _element.mouseOffset.x; |
---|
| 149 | var y = mousePos.y - _element.mouseOffset.y; |
---|
| 150 | _element.style.left = (( x < 0 ) ? 0 : x) + 'px'; |
---|
| 151 | _element.style.top = (( y < 0 ) ? 0 : y) + 'px'; |
---|
| 152 | } |
---|
| 153 | } |
---|
| 154 | |
---|
| 155 | function _mouseUp() |
---|
| 156 | { |
---|
| 157 | if ( _element ) |
---|
| 158 | { |
---|
[1530] | 159 | _mouseUpShadow(); |
---|
| 160 | |
---|
| 161 | _configEvent(_element, 'onmousemove', _mouseMove, 'remove'); |
---|
| 162 | _configEvent(top.document, 'onmousemove', _mouseMove, 'remove'); |
---|
[382] | 163 | |
---|
[1530] | 164 | _configEvent(_element, 'onmouseup', _mouseUp, 'remove'); |
---|
| 165 | _configEvent(top.document, 'onmouseup', _mouseUp, 'remove'); |
---|
[382] | 166 | |
---|
| 167 | _element.mouseOffset = null; |
---|
| 168 | _element = null; |
---|
| 169 | } |
---|
| 170 | } |
---|
| 171 | |
---|
[1530] | 172 | function _mouseDownShadow(e) |
---|
[382] | 173 | { |
---|
[1530] | 174 | try |
---|
[382] | 175 | { |
---|
[1530] | 176 | if( arguments.length > 0 ) |
---|
[382] | 177 | { |
---|
[1530] | 178 | var _el = ( e.target ) ? e.target : e.srcElement; |
---|
| 179 | var _id = (_el.id.substring(0, _el.id.indexOf("__draggable"))); |
---|
| 180 | |
---|
| 181 | _elementA = document.getElementById( _id + "__parent"); |
---|
| 182 | _elementB = _elementShadow( _id + "__parent"); |
---|
| 183 | |
---|
| 184 | _elementA.style.left = '-1500px'; |
---|
| 185 | _parent = _elementA.parentNode; |
---|
| 186 | |
---|
| 187 | var _B = _parent.appendChild(_elementB); |
---|
| 188 | |
---|
| 189 | _configEvent( _elementB, 'onmouseup', _mouseUpShadow); |
---|
| 190 | _configEvent( _elementB, 'onmousemove', _drag); |
---|
[382] | 191 | } |
---|
[1530] | 192 | |
---|
| 193 | }catch(e){} |
---|
[382] | 194 | } |
---|
| 195 | |
---|
[1530] | 196 | function _mouseUpShadow() |
---|
[382] | 197 | { |
---|
[1530] | 198 | try |
---|
[382] | 199 | { |
---|
[1566] | 200 | _elementA.style.top = _elementB.style.top; |
---|
| 201 | _elementA.style.left = _elementB.style.left; |
---|
[1530] | 202 | |
---|
| 203 | var _B = _parent.removeChild(_elementB); |
---|
[382] | 204 | |
---|
[1530] | 205 | _elementA = null; |
---|
| 206 | _elementB = null; |
---|
| 207 | _element = null; |
---|
[382] | 208 | } |
---|
[1530] | 209 | catch(e){} |
---|
[382] | 210 | } |
---|
[1530] | 211 | |
---|
| 212 | function dragdrop(){} |
---|
[382] | 213 | |
---|
[1530] | 214 | dragdrop.prototype.set = _load; |
---|
| 215 | window.dragdrop = dragdrop; |
---|
| 216 | |
---|
| 217 | })(); |
---|