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