selectable.js 7.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287
  1. /*!
  2. * jQuery UI Selectable 1.11.4
  3. * http://jqueryui.com
  4. *
  5. * Copyright jQuery Foundation and other contributors
  6. * Released under the MIT license.
  7. * http://jquery.org/license
  8. *
  9. * http://api.jqueryui.com/selectable/
  10. */
  11. (function( factory ) {
  12. if ( typeof define === "function" && define.amd ) {
  13. // AMD. Register as an anonymous module.
  14. define([
  15. "jquery",
  16. "./core",
  17. "./mouse",
  18. "./widget"
  19. ], factory );
  20. } else {
  21. // Browser globals
  22. factory( jQuery );
  23. }
  24. }(function( $ ) {
  25. return $.widget("ui.selectable", $.ui.mouse, {
  26. version: "1.11.4",
  27. options: {
  28. appendTo: "body",
  29. autoRefresh: true,
  30. distance: 0,
  31. filter: "*",
  32. tolerance: "touch",
  33. // callbacks
  34. selected: null,
  35. selecting: null,
  36. start: null,
  37. stop: null,
  38. unselected: null,
  39. unselecting: null
  40. },
  41. _create: function() {
  42. var selectees,
  43. that = this;
  44. this.element.addClass("ui-selectable");
  45. this.dragged = false;
  46. // cache selectee children based on filter
  47. this.refresh = function() {
  48. selectees = $(that.options.filter, that.element[0]);
  49. selectees.addClass("ui-selectee");
  50. selectees.each(function() {
  51. var $this = $(this),
  52. pos = $this.offset();
  53. $.data(this, "selectable-item", {
  54. element: this,
  55. $element: $this,
  56. left: pos.left,
  57. top: pos.top,
  58. right: pos.left + $this.outerWidth(),
  59. bottom: pos.top + $this.outerHeight(),
  60. startselected: false,
  61. selected: $this.hasClass("ui-selected"),
  62. selecting: $this.hasClass("ui-selecting"),
  63. unselecting: $this.hasClass("ui-unselecting")
  64. });
  65. });
  66. };
  67. this.refresh();
  68. this.selectees = selectees.addClass("ui-selectee");
  69. this._mouseInit();
  70. this.helper = $("<div class='ui-selectable-helper'></div>");
  71. },
  72. _destroy: function() {
  73. this.selectees
  74. .removeClass("ui-selectee")
  75. .removeData("selectable-item");
  76. this.element
  77. .removeClass("ui-selectable ui-selectable-disabled");
  78. this._mouseDestroy();
  79. },
  80. _mouseStart: function(event) {
  81. var that = this,
  82. options = this.options;
  83. this.opos = [ event.pageX, event.pageY ];
  84. if (this.options.disabled) {
  85. return;
  86. }
  87. this.selectees = $(options.filter, this.element[0]);
  88. this._trigger("start", event);
  89. $(options.appendTo).append(this.helper);
  90. // position helper (lasso)
  91. this.helper.css({
  92. "left": event.pageX,
  93. "top": event.pageY,
  94. "width": 0,
  95. "height": 0
  96. });
  97. if (options.autoRefresh) {
  98. this.refresh();
  99. }
  100. this.selectees.filter(".ui-selected").each(function() {
  101. var selectee = $.data(this, "selectable-item");
  102. selectee.startselected = true;
  103. if (!event.metaKey && !event.ctrlKey) {
  104. selectee.$element.removeClass("ui-selected");
  105. selectee.selected = false;
  106. selectee.$element.addClass("ui-unselecting");
  107. selectee.unselecting = true;
  108. // selectable UNSELECTING callback
  109. that._trigger("unselecting", event, {
  110. unselecting: selectee.element
  111. });
  112. }
  113. });
  114. $(event.target).parents().addBack().each(function() {
  115. var doSelect,
  116. selectee = $.data(this, "selectable-item");
  117. if (selectee) {
  118. doSelect = (!event.metaKey && !event.ctrlKey) || !selectee.$element.hasClass("ui-selected");
  119. selectee.$element
  120. .removeClass(doSelect ? "ui-unselecting" : "ui-selected")
  121. .addClass(doSelect ? "ui-selecting" : "ui-unselecting");
  122. selectee.unselecting = !doSelect;
  123. selectee.selecting = doSelect;
  124. selectee.selected = doSelect;
  125. // selectable (UN)SELECTING callback
  126. if (doSelect) {
  127. that._trigger("selecting", event, {
  128. selecting: selectee.element
  129. });
  130. } else {
  131. that._trigger("unselecting", event, {
  132. unselecting: selectee.element
  133. });
  134. }
  135. return false;
  136. }
  137. });
  138. },
  139. _mouseDrag: function(event) {
  140. this.dragged = true;
  141. if (this.options.disabled) {
  142. return;
  143. }
  144. var tmp,
  145. that = this,
  146. options = this.options,
  147. x1 = this.opos[0],
  148. y1 = this.opos[1],
  149. x2 = event.pageX,
  150. y2 = event.pageY;
  151. if (x1 > x2) { tmp = x2; x2 = x1; x1 = tmp; }
  152. if (y1 > y2) { tmp = y2; y2 = y1; y1 = tmp; }
  153. this.helper.css({ left: x1, top: y1, width: x2 - x1, height: y2 - y1 });
  154. this.selectees.each(function() {
  155. var selectee = $.data(this, "selectable-item"),
  156. hit = false;
  157. //prevent helper from being selected if appendTo: selectable
  158. if (!selectee || selectee.element === that.element[0]) {
  159. return;
  160. }
  161. if (options.tolerance === "touch") {
  162. hit = ( !(selectee.left > x2 || selectee.right < x1 || selectee.top > y2 || selectee.bottom < y1) );
  163. } else if (options.tolerance === "fit") {
  164. hit = (selectee.left > x1 && selectee.right < x2 && selectee.top > y1 && selectee.bottom < y2);
  165. }
  166. if (hit) {
  167. // SELECT
  168. if (selectee.selected) {
  169. selectee.$element.removeClass("ui-selected");
  170. selectee.selected = false;
  171. }
  172. if (selectee.unselecting) {
  173. selectee.$element.removeClass("ui-unselecting");
  174. selectee.unselecting = false;
  175. }
  176. if (!selectee.selecting) {
  177. selectee.$element.addClass("ui-selecting");
  178. selectee.selecting = true;
  179. // selectable SELECTING callback
  180. that._trigger("selecting", event, {
  181. selecting: selectee.element
  182. });
  183. }
  184. } else {
  185. // UNSELECT
  186. if (selectee.selecting) {
  187. if ((event.metaKey || event.ctrlKey) && selectee.startselected) {
  188. selectee.$element.removeClass("ui-selecting");
  189. selectee.selecting = false;
  190. selectee.$element.addClass("ui-selected");
  191. selectee.selected = true;
  192. } else {
  193. selectee.$element.removeClass("ui-selecting");
  194. selectee.selecting = false;
  195. if (selectee.startselected) {
  196. selectee.$element.addClass("ui-unselecting");
  197. selectee.unselecting = true;
  198. }
  199. // selectable UNSELECTING callback
  200. that._trigger("unselecting", event, {
  201. unselecting: selectee.element
  202. });
  203. }
  204. }
  205. if (selectee.selected) {
  206. if (!event.metaKey && !event.ctrlKey && !selectee.startselected) {
  207. selectee.$element.removeClass("ui-selected");
  208. selectee.selected = false;
  209. selectee.$element.addClass("ui-unselecting");
  210. selectee.unselecting = true;
  211. // selectable UNSELECTING callback
  212. that._trigger("unselecting", event, {
  213. unselecting: selectee.element
  214. });
  215. }
  216. }
  217. }
  218. });
  219. return false;
  220. },
  221. _mouseStop: function(event) {
  222. var that = this;
  223. this.dragged = false;
  224. $(".ui-unselecting", this.element[0]).each(function() {
  225. var selectee = $.data(this, "selectable-item");
  226. selectee.$element.removeClass("ui-unselecting");
  227. selectee.unselecting = false;
  228. selectee.startselected = false;
  229. that._trigger("unselected", event, {
  230. unselected: selectee.element
  231. });
  232. });
  233. $(".ui-selecting", this.element[0]).each(function() {
  234. var selectee = $.data(this, "selectable-item");
  235. selectee.$element.removeClass("ui-selecting").addClass("ui-selected");
  236. selectee.selecting = false;
  237. selectee.selected = true;
  238. selectee.startselected = true;
  239. that._trigger("selected", event, {
  240. selected: selectee.element
  241. });
  242. });
  243. this._trigger("stop", event);
  244. this.helper.remove();
  245. return false;
  246. }
  247. });
  248. }));