fc6641ea72ed9efa1c4ef7f10416dabb0996bd4c.svn-base 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420
  1. /**
  2. * jQuery EasyUI 1.3.6
  3. *
  4. * Copyright (c) 2009-2014 www.jeasyui.com. All rights reserved.
  5. *
  6. * Licensed under the GPL license: http://www.gnu.org/licenses/gpl.txt
  7. * To use it on other terms please contact us at info@jeasyui.com
  8. *
  9. */
  10. /**
  11. * draggable - jQuery EasyUI
  12. *
  13. */
  14. (function($){
  15. // var isDragging = false;
  16. function drag(e){
  17. var state = $.data(e.data.target, 'draggable');
  18. var opts = state.options;
  19. var proxy = state.proxy;
  20. var dragData = e.data;
  21. var left = dragData.startLeft + e.pageX - dragData.startX;
  22. var top = dragData.startTop + e.pageY - dragData.startY;
  23. if (proxy){
  24. if (proxy.parent()[0] == document.body){
  25. if (opts.deltaX != null && opts.deltaX != undefined){
  26. left = e.pageX + opts.deltaX;
  27. } else {
  28. left = e.pageX - e.data.offsetWidth;
  29. }
  30. if (opts.deltaY != null && opts.deltaY != undefined){
  31. top = e.pageY + opts.deltaY;
  32. } else {
  33. top = e.pageY - e.data.offsetHeight;
  34. }
  35. } else {
  36. if (opts.deltaX != null && opts.deltaX != undefined){
  37. left += e.data.offsetWidth + opts.deltaX;
  38. }
  39. if (opts.deltaY != null && opts.deltaY != undefined){
  40. top += e.data.offsetHeight + opts.deltaY;
  41. }
  42. }
  43. }
  44. // if (opts.deltaX != null && opts.deltaX != undefined){
  45. // left = e.pageX + opts.deltaX;
  46. // }
  47. // if (opts.deltaY != null && opts.deltaY != undefined){
  48. // top = e.pageY + opts.deltaY;
  49. // }
  50. if (e.data.parent != document.body) {
  51. left += $(e.data.parent).scrollLeft();
  52. top += $(e.data.parent).scrollTop();
  53. }
  54. if (opts.axis == 'h') {
  55. dragData.left = left;
  56. } else if (opts.axis == 'v') {
  57. dragData.top = top;
  58. } else {
  59. dragData.left = left;
  60. dragData.top = top;
  61. }
  62. }
  63. function applyDrag(e){
  64. var state = $.data(e.data.target, 'draggable');
  65. var opts = state.options;
  66. var proxy = state.proxy;
  67. if (!proxy){
  68. proxy = $(e.data.target);
  69. }
  70. // if (proxy){
  71. // proxy.css('cursor', opts.cursor);
  72. // } else {
  73. // proxy = $(e.data.target);
  74. // $.data(e.data.target, 'draggable').handle.css('cursor', opts.cursor);
  75. // }
  76. proxy.css({
  77. left:e.data.left,
  78. top:e.data.top
  79. });
  80. $('body').css('cursor', opts.cursor);
  81. }
  82. function doDown(e){
  83. // isDragging = true;
  84. $.fn.draggable.isDragging = true;
  85. var state = $.data(e.data.target, 'draggable');
  86. var opts = state.options;
  87. var droppables = $('.droppable').filter(function(){
  88. return e.data.target != this;
  89. }).filter(function(){
  90. var accept = $.data(this, 'droppable').options.accept;
  91. if (accept){
  92. return $(accept).filter(function(){
  93. return this == e.data.target;
  94. }).length > 0;
  95. } else {
  96. return true;
  97. }
  98. });
  99. state.droppables = droppables;
  100. var proxy = state.proxy;
  101. if (!proxy){
  102. if (opts.proxy){
  103. if (opts.proxy == 'clone'){
  104. proxy = $(e.data.target).clone().insertAfter(e.data.target);
  105. } else {
  106. proxy = opts.proxy.call(e.data.target, e.data.target);
  107. }
  108. state.proxy = proxy;
  109. } else {
  110. proxy = $(e.data.target);
  111. }
  112. }
  113. proxy.css('position', 'absolute');
  114. drag(e);
  115. applyDrag(e);
  116. opts.onStartDrag.call(e.data.target, e);
  117. return false;
  118. }
  119. function doMove(e){
  120. var state = $.data(e.data.target, 'draggable');
  121. drag(e);
  122. if (state.options.onDrag.call(e.data.target, e) != false){
  123. applyDrag(e);
  124. }
  125. var source = e.data.target;
  126. state.droppables.each(function(){
  127. var dropObj = $(this);
  128. if (dropObj.droppable('options').disabled){return;}
  129. var p2 = dropObj.offset();
  130. if (e.pageX > p2.left && e.pageX < p2.left + dropObj.outerWidth()
  131. && e.pageY > p2.top && e.pageY < p2.top + dropObj.outerHeight()){
  132. if (!this.entered){
  133. $(this).trigger('_dragenter', [source]);
  134. this.entered = true;
  135. }
  136. $(this).trigger('_dragover', [source]);
  137. } else {
  138. if (this.entered){
  139. $(this).trigger('_dragleave', [source]);
  140. this.entered = false;
  141. }
  142. }
  143. });
  144. return false;
  145. }
  146. function doUp(e){
  147. // isDragging = false;
  148. $.fn.draggable.isDragging = false;
  149. // drag(e);
  150. doMove(e);
  151. var state = $.data(e.data.target, 'draggable');
  152. var proxy = state.proxy;
  153. var opts = state.options;
  154. if (opts.revert){
  155. if (checkDrop() == true){
  156. $(e.data.target).css({
  157. position:e.data.startPosition,
  158. left:e.data.startLeft,
  159. top:e.data.startTop
  160. });
  161. } else {
  162. if (proxy){
  163. var left, top;
  164. if (proxy.parent()[0] == document.body){
  165. left = e.data.startX - e.data.offsetWidth;
  166. top = e.data.startY - e.data.offsetHeight;
  167. } else {
  168. left = e.data.startLeft;
  169. top = e.data.startTop;
  170. }
  171. proxy.animate({
  172. left: left,
  173. top: top
  174. }, function(){
  175. removeProxy();
  176. });
  177. } else {
  178. $(e.data.target).animate({
  179. left:e.data.startLeft,
  180. top:e.data.startTop
  181. }, function(){
  182. $(e.data.target).css('position', e.data.startPosition);
  183. });
  184. }
  185. }
  186. } else {
  187. $(e.data.target).css({
  188. position:'absolute',
  189. left:e.data.left,
  190. top:e.data.top
  191. });
  192. checkDrop();
  193. }
  194. opts.onStopDrag.call(e.data.target, e);
  195. $(document).unbind('.draggable');
  196. setTimeout(function(){
  197. $('body').css('cursor','');
  198. },100);
  199. function removeProxy(){
  200. if (proxy){
  201. proxy.remove();
  202. }
  203. state.proxy = null;
  204. }
  205. function checkDrop(){
  206. var dropped = false;
  207. state.droppables.each(function(){
  208. var dropObj = $(this);
  209. if (dropObj.droppable('options').disabled){return;}
  210. var p2 = dropObj.offset();
  211. if (e.pageX > p2.left && e.pageX < p2.left + dropObj.outerWidth()
  212. && e.pageY > p2.top && e.pageY < p2.top + dropObj.outerHeight()){
  213. if (opts.revert){
  214. $(e.data.target).css({
  215. position:e.data.startPosition,
  216. left:e.data.startLeft,
  217. top:e.data.startTop
  218. });
  219. }
  220. $(this).trigger('_drop', [e.data.target]);
  221. removeProxy();
  222. dropped = true;
  223. this.entered = false;
  224. return false;
  225. }
  226. });
  227. if (!dropped && !opts.revert){
  228. removeProxy();
  229. }
  230. return dropped;
  231. }
  232. return false;
  233. }
  234. $.fn.draggable = function(options, param){
  235. if (typeof options == 'string'){
  236. return $.fn.draggable.methods[options](this, param);
  237. }
  238. return this.each(function(){
  239. var opts;
  240. var state = $.data(this, 'draggable');
  241. if (state) {
  242. state.handle.unbind('.draggable');
  243. opts = $.extend(state.options, options);
  244. } else {
  245. opts = $.extend({}, $.fn.draggable.defaults, $.fn.draggable.parseOptions(this), options || {});
  246. }
  247. var handle = opts.handle ? (typeof opts.handle=='string' ? $(opts.handle, this) : opts.handle) : $(this);
  248. $.data(this, 'draggable', {
  249. options: opts,
  250. handle: handle
  251. });
  252. if (opts.disabled) {
  253. $(this).css('cursor', '');
  254. return;
  255. }
  256. handle.unbind('.draggable').bind('mousemove.draggable', {target:this}, function(e){
  257. // if (isDragging) return;
  258. if ($.fn.draggable.isDragging){return}
  259. var opts = $.data(e.data.target, 'draggable').options;
  260. if (checkArea(e)){
  261. $(this).css('cursor', opts.cursor);
  262. } else {
  263. $(this).css('cursor', '');
  264. }
  265. }).bind('mouseleave.draggable', {target:this}, function(e){
  266. $(this).css('cursor', '');
  267. }).bind('mousedown.draggable', {target:this}, function(e){
  268. if (checkArea(e) == false) return;
  269. $(this).css('cursor', '');
  270. var position = $(e.data.target).position();
  271. var offset = $(e.data.target).offset();
  272. var data = {
  273. startPosition: $(e.data.target).css('position'),
  274. startLeft: position.left,
  275. startTop: position.top,
  276. left: position.left,
  277. top: position.top,
  278. startX: e.pageX,
  279. startY: e.pageY,
  280. offsetWidth: (e.pageX - offset.left),
  281. offsetHeight: (e.pageY - offset.top),
  282. target: e.data.target,
  283. parent: $(e.data.target).parent()[0]
  284. };
  285. $.extend(e.data, data);
  286. var opts = $.data(e.data.target, 'draggable').options;
  287. if (opts.onBeforeDrag.call(e.data.target, e) == false) return;
  288. $(document).bind('mousedown.draggable', e.data, doDown);
  289. $(document).bind('mousemove.draggable', e.data, doMove);
  290. $(document).bind('mouseup.draggable', e.data, doUp);
  291. // $('body').css('cursor', opts.cursor);
  292. });
  293. // check if the handle can be dragged
  294. function checkArea(e) {
  295. var state = $.data(e.data.target, 'draggable');
  296. var handle = state.handle;
  297. var offset = $(handle).offset();
  298. var width = $(handle).outerWidth();
  299. var height = $(handle).outerHeight();
  300. var t = e.pageY - offset.top;
  301. var r = offset.left + width - e.pageX;
  302. var b = offset.top + height - e.pageY;
  303. var l = e.pageX - offset.left;
  304. return Math.min(t,r,b,l) > state.options.edge;
  305. }
  306. });
  307. };
  308. $.fn.draggable.methods = {
  309. options: function(jq){
  310. return $.data(jq[0], 'draggable').options;
  311. },
  312. proxy: function(jq){
  313. return $.data(jq[0], 'draggable').proxy;
  314. },
  315. enable: function(jq){
  316. return jq.each(function(){
  317. $(this).draggable({disabled:false});
  318. });
  319. },
  320. disable: function(jq){
  321. return jq.each(function(){
  322. $(this).draggable({disabled:true});
  323. });
  324. }
  325. };
  326. $.fn.draggable.parseOptions = function(target){
  327. var t = $(target);
  328. return $.extend({},
  329. $.parser.parseOptions(target, ['cursor','handle','axis',
  330. {'revert':'boolean','deltaX':'number','deltaY':'number','edge':'number'}]), {
  331. disabled: (t.attr('disabled') ? true : undefined)
  332. });
  333. };
  334. $.fn.draggable.defaults = {
  335. proxy:null, // 'clone' or a function that will create the proxy object,
  336. // the function has the source parameter that indicate the source object dragged.
  337. revert:false,
  338. cursor:'move',
  339. deltaX:null,
  340. deltaY:null,
  341. handle: null,
  342. disabled: false,
  343. edge:0,
  344. axis:null, // v or h
  345. onBeforeDrag: function(e){},
  346. onStartDrag: function(e){},
  347. onDrag: function(e){},
  348. onStopDrag: function(e){}
  349. };
  350. $.fn.draggable.isDragging = false;
  351. // $(function(){
  352. // function touchHandler(e) {
  353. // var touches = e.changedTouches, first = touches[0], type = "";
  354. //
  355. // switch(e.type) {
  356. // case "touchstart": type = "mousedown"; break;
  357. // case "touchmove": type = "mousemove"; break;
  358. // case "touchend": type = "mouseup"; break;
  359. // default: return;
  360. // }
  361. // var simulatedEvent = document.createEvent("MouseEvent");
  362. // simulatedEvent.initMouseEvent(type, true, true, window, 1,
  363. // first.screenX, first.screenY,
  364. // first.clientX, first.clientY, false,
  365. // false, false, false, 0/*left*/, null);
  366. //
  367. // first.target.dispatchEvent(simulatedEvent);
  368. // if (isDragging){
  369. // e.preventDefault();
  370. // }
  371. // }
  372. //
  373. // if (document.addEventListener){
  374. // document.addEventListener("touchstart", touchHandler, true);
  375. // document.addEventListener("touchmove", touchHandler, true);
  376. // document.addEventListener("touchend", touchHandler, true);
  377. // document.addEventListener("touchcancel", touchHandler, true);
  378. // }
  379. // });
  380. })(jQuery);