resources/jquery.ui/jquery.ui.selectable.js

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