2 * jQuery UI Selectable 1.9.2
5 * Copyright 2012 jQuery Foundation and other contributors
6 * Released under the MIT license.
7 * http://jquery.org/license
9 * http://api.jqueryui.com/selectable/
16 (function( $, undefined ) {
18 $.widget("ui.selectable", $.ui.mouse, {
30 this.element.addClass("ui-selectable");
34 // cache selectee children based on filter
36 this.refresh = function() {
37 selectees = $(that.options.filter, that.element[0]);
38 selectees.addClass("ui-selectee");
39 selectees.each(function() {
41 var pos = $this.offset();
42 $.data(this, "selectable-item", {
47 right: pos.left + $this.outerWidth(),
48 bottom: pos.top + $this.outerHeight(),
50 selected: $this.hasClass('ui-selected'),
51 selecting: $this.hasClass('ui-selecting'),
52 unselecting: $this.hasClass('ui-unselecting')
58 this.selectees = selectees.addClass("ui-selectee");
62 this.helper = $("<div class='ui-selectable-helper'></div>");
65 _destroy: function() {
67 .removeClass("ui-selectee")
68 .removeData("selectable-item");
70 .removeClass("ui-selectable ui-selectable-disabled");
74 _mouseStart: function(event) {
77 this.opos = [event.pageX, event.pageY];
79 if (this.options.disabled)
82 var options = this.options;
84 this.selectees = $(options.filter, this.element[0]);
86 this._trigger("start", event);
88 $(options.appendTo).append(this.helper);
89 // position helper (lasso)
91 "left": event.clientX,
97 if (options.autoRefresh) {
101 this.selectees.filter('.ui-selected').each(function() {
102 var selectee = $.data(this, "selectable-item");
103 selectee.startselected = true;
104 if (!event.metaKey && !event.ctrlKey) {
105 selectee.$element.removeClass('ui-selected');
106 selectee.selected = false;
107 selectee.$element.addClass('ui-unselecting');
108 selectee.unselecting = true;
109 // selectable UNSELECTING callback
110 that._trigger("unselecting", event, {
111 unselecting: selectee.element
116 $(event.target).parents().andSelf().each(function() {
117 var selectee = $.data(this, "selectable-item");
119 var doSelect = (!event.metaKey && !event.ctrlKey) || !selectee.$element.hasClass('ui-selected');
121 .removeClass(doSelect ? "ui-unselecting" : "ui-selected")
122 .addClass(doSelect ? "ui-selecting" : "ui-unselecting");
123 selectee.unselecting = !doSelect;
124 selectee.selecting = doSelect;
125 selectee.selected = doSelect;
126 // selectable (UN)SELECTING callback
128 that._trigger("selecting", event, {
129 selecting: selectee.element
132 that._trigger("unselecting", event, {
133 unselecting: selectee.element
142 _mouseDrag: function(event) {
146 if (this.options.disabled)
149 var options = this.options;
151 var x1 = this.opos[0], y1 = this.opos[1], x2 = event.pageX, y2 = event.pageY;
152 if (x1 > x2) { var tmp = x2; x2 = x1; x1 = tmp; }
153 if (y1 > y2) { var tmp = y2; y2 = y1; y1 = tmp; }
154 this.helper.css({left: x1, top: y1, width: x2-x1, height: y2-y1});
156 this.selectees.each(function() {
157 var selectee = $.data(this, "selectable-item");
158 //prevent helper from being selected if appendTo: selectable
159 if (!selectee || selectee.element == that.element[0])
162 if (options.tolerance == 'touch') {
163 hit = ( !(selectee.left > x2 || selectee.right < x1 || selectee.top > y2 || selectee.bottom < y1) );
164 } else if (options.tolerance == 'fit') {
165 hit = (selectee.left > x1 && selectee.right < x2 && selectee.top > y1 && selectee.bottom < y2);
170 if (selectee.selected) {
171 selectee.$element.removeClass('ui-selected');
172 selectee.selected = false;
174 if (selectee.unselecting) {
175 selectee.$element.removeClass('ui-unselecting');
176 selectee.unselecting = false;
178 if (!selectee.selecting) {
179 selectee.$element.addClass('ui-selecting');
180 selectee.selecting = true;
181 // selectable SELECTING callback
182 that._trigger("selecting", event, {
183 selecting: selectee.element
188 if (selectee.selecting) {
189 if ((event.metaKey || event.ctrlKey) && selectee.startselected) {
190 selectee.$element.removeClass('ui-selecting');
191 selectee.selecting = false;
192 selectee.$element.addClass('ui-selected');
193 selectee.selected = true;
195 selectee.$element.removeClass('ui-selecting');
196 selectee.selecting = false;
197 if (selectee.startselected) {
198 selectee.$element.addClass('ui-unselecting');
199 selectee.unselecting = true;
201 // selectable UNSELECTING callback
202 that._trigger("unselecting", event, {
203 unselecting: selectee.element
207 if (selectee.selected) {
208 if (!event.metaKey && !event.ctrlKey && !selectee.startselected) {
209 selectee.$element.removeClass('ui-selected');
210 selectee.selected = false;
212 selectee.$element.addClass('ui-unselecting');
213 selectee.unselecting = true;
214 // selectable UNSELECTING callback
215 that._trigger("unselecting", event, {
216 unselecting: selectee.element
226 _mouseStop: function(event) {
229 this.dragged = false;
231 var options = this.options;
233 $('.ui-unselecting', this.element[0]).each(function() {
234 var selectee = $.data(this, "selectable-item");
235 selectee.$element.removeClass('ui-unselecting');
236 selectee.unselecting = false;
237 selectee.startselected = false;
238 that._trigger("unselected", event, {
239 unselected: selectee.element
242 $('.ui-selecting', this.element[0]).each(function() {
243 var selectee = $.data(this, "selectable-item");
244 selectee.$element.removeClass('ui-selecting').addClass('ui-selected');
245 selectee.selecting = false;
246 selectee.selected = true;
247 selectee.startselected = true;
248 that._trigger("selected", event, {
249 selected: selectee.element
252 this._trigger("stop", event);
254 this.helper.remove();