[Summary view] [Print] [Text view]

   1  /*

   2   * jQuery UI Selectable 1.6

   3   *

   4   * Copyright (c) 2008 AUTHORS.txt (http://ui.jquery.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   *    ui.core.js

  12   */
  13  (function($) {
  14  
  15  $.widget("ui.selectable", $.extend({}, $.ui.mouse, {
  16  
  17      _init: function() {
  18          var self = this;
  19  
  20          this.element.addClass("ui-selectable");
  21  
  22          this.dragged = false;
  23  
  24          // cache selectee children based on filter

  25          var selectees;
  26          this.refresh = function() {
  27              selectees = $(self.options.filter, self.element[0]);
  28              selectees.each(function() {
  29                  var $this = $(this);
  30                  var pos = $this.offset();
  31                  $.data(this, "selectable-item", {
  32                      element: this,
  33                      $element: $this,
  34                      left: pos.left,
  35                      top: pos.top,
  36                      right: pos.left + $this.width(),
  37                      bottom: pos.top + $this.height(),
  38                      startselected: false,
  39                      selected: $this.hasClass('ui-selected'),
  40                      selecting: $this.hasClass('ui-selecting'),
  41                      unselecting: $this.hasClass('ui-unselecting')
  42                  });
  43              });
  44          };
  45          this.refresh();
  46  
  47          this.selectees = selectees.addClass("ui-selectee");
  48  
  49          this._mouseInit();
  50  
  51          this.helper = $(document.createElement('div'))
  52              .css({border:'1px dotted black'})
  53              .addClass("ui-selectable-helper");
  54      },
  55  
  56      destroy: function() {
  57          this.element
  58              .removeClass("ui-selectable ui-selectable-disabled")
  59              .removeData("selectable")
  60              .unbind(".selectable");
  61          this._mouseDestroy();
  62      },
  63  
  64      _mouseStart: function(event) {
  65          var self = this;
  66  
  67          this.opos = [event.pageX, event.pageY];
  68  
  69          if (this.options.disabled)
  70              return;
  71  
  72          var options = this.options;
  73  
  74          this.selectees = $(options.filter, this.element[0]);
  75  
  76          // selectable START callback

  77          this.element.triggerHandler("selectablestart", [event, {
  78              "selectable": this.element[0],
  79              "options": options
  80          }], options.start);
  81  
  82          $('body').append(this.helper);
  83          // position helper (lasso)

  84          this.helper.css({
  85              "z-index": 100,
  86              "position": "absolute",
  87              "left": event.clientX,
  88              "top": event.clientY,
  89              "width": 0,
  90              "height": 0
  91          });
  92  
  93          if (options.autoRefresh) {
  94              this.refresh();
  95          }
  96  
  97          this.selectees.filter('.ui-selected').each(function() {
  98              var selectee = $.data(this, "selectable-item");
  99              selectee.startselected = true;
 100              if (!event.metaKey) {
 101                  selectee.$element.removeClass('ui-selected');
 102                  selectee.selected = false;
 103                  selectee.$element.addClass('ui-unselecting');
 104                  selectee.unselecting = true;
 105                  // selectable UNSELECTING callback

 106                  self.element.triggerHandler("selectableunselecting", [event, {
 107                      selectable: self.element[0],
 108                      unselecting: selectee.element,
 109                      options: options
 110                  }], options.unselecting);
 111              }
 112          });
 113  
 114          var isSelectee = false;
 115          $(event.target).parents().andSelf().each(function() {
 116              if($.data(this, "selectable-item")) isSelectee = true;
 117          });
 118          return this.options.keyboard ? !isSelectee : true;
 119      },
 120  
 121      _mouseDrag: function(event) {
 122          var self = this;
 123          this.dragged = true;
 124  
 125          if (this.options.disabled)
 126              return;
 127  
 128          var options = this.options;
 129  
 130          var x1 = this.opos[0], y1 = this.opos[1], x2 = event.pageX, y2 = event.pageY;
 131          if (x1 > x2) { var tmp = x2; x2 = x1; x1 = tmp; }
 132          if (y1 > y2) { var tmp = y2; y2 = y1; y1 = tmp; }
 133          this.helper.css({left: x1, top: y1, width: x2-x1, height: y2-y1});
 134  
 135          this.selectees.each(function() {
 136              var selectee = $.data(this, "selectable-item");
 137              //prevent helper from being selected if appendTo: selectable

 138              if (!selectee || selectee.element == self.element[0])
 139                  return;
 140              var hit = false;
 141              if (options.tolerance == 'touch') {
 142                  hit = ( !(selectee.left > x2 || selectee.right < x1 || selectee.top > y2 || selectee.bottom < y1) );
 143              } else if (options.tolerance == 'fit') {
 144                  hit = (selectee.left > x1 && selectee.right < x2 && selectee.top > y1 && selectee.bottom < y2);
 145              }
 146  
 147              if (hit) {
 148                  // SELECT

 149                  if (selectee.selected) {
 150                      selectee.$element.removeClass('ui-selected');
 151                      selectee.selected = false;
 152                  }
 153                  if (selectee.unselecting) {
 154                      selectee.$element.removeClass('ui-unselecting');
 155                      selectee.unselecting = false;
 156                  }
 157                  if (!selectee.selecting) {
 158                      selectee.$element.addClass('ui-selecting');
 159                      selectee.selecting = true;
 160                      // selectable SELECTING callback

 161                      self.element.triggerHandler("selectableselecting", [event, {
 162                          selectable: self.element[0],
 163                          selecting: selectee.element,
 164                          options: options
 165                      }], options.selecting);
 166                  }
 167              } else {
 168                  // UNSELECT

 169                  if (selectee.selecting) {
 170                      if (event.metaKey && selectee.startselected) {
 171                          selectee.$element.removeClass('ui-selecting');
 172                          selectee.selecting = false;
 173                          selectee.$element.addClass('ui-selected');
 174                          selectee.selected = true;
 175                      } else {
 176                          selectee.$element.removeClass('ui-selecting');
 177                          selectee.selecting = false;
 178                          if (selectee.startselected) {
 179                              selectee.$element.addClass('ui-unselecting');
 180                              selectee.unselecting = true;
 181                          }
 182                          // selectable UNSELECTING callback

 183                          self.element.triggerHandler("selectableunselecting", [event, {
 184                              selectable: self.element[0],
 185                              unselecting: selectee.element,
 186                              options: options
 187                          }], options.unselecting);
 188                      }
 189                  }
 190                  if (selectee.selected) {
 191                      if (!event.metaKey && !selectee.startselected) {
 192                          selectee.$element.removeClass('ui-selected');
 193                          selectee.selected = false;
 194  
 195                          selectee.$element.addClass('ui-unselecting');
 196                          selectee.unselecting = true;
 197                          // selectable UNSELECTING callback

 198                          self.element.triggerHandler("selectableunselecting", [event, {
 199                              selectable: self.element[0],
 200                              unselecting: selectee.element,
 201                              options: options
 202                          }], options.unselecting);
 203                      }
 204                  }
 205              }
 206          });
 207  
 208          return false;
 209      },
 210  
 211      _mouseStop: function(event) {
 212          var self = this;
 213  
 214          this.dragged = false;
 215  
 216          var options = this.options;
 217  
 218          $('.ui-unselecting', this.element[0]).each(function() {
 219              var selectee = $.data(this, "selectable-item");
 220              selectee.$element.removeClass('ui-unselecting');
 221              selectee.unselecting = false;
 222              selectee.startselected = false;
 223              self.element.triggerHandler("selectableunselected", [event, {
 224                  selectable: self.element[0],
 225                  unselected: selectee.element,
 226                  options: options
 227              }], options.unselected);
 228          });
 229          $('.ui-selecting', this.element[0]).each(function() {
 230              var selectee = $.data(this, "selectable-item");
 231              selectee.$element.removeClass('ui-selecting').addClass('ui-selected');
 232              selectee.selecting = false;
 233              selectee.selected = true;
 234              selectee.startselected = true;
 235              self.element.triggerHandler("selectableselected", [event, {
 236                  selectable: self.element[0],
 237                  selected: selectee.element,
 238                  options: options
 239              }], options.selected);
 240          });
 241          this.element.triggerHandler("selectablestop", [event, {
 242              selectable: self.element[0],
 243              options: this.options
 244          }], this.options.stop);
 245  
 246          this.helper.remove();
 247  
 248          return false;
 249      }
 250  
 251  }));
 252  
 253  $.extend($.ui.selectable, {
 254      version: "1.6",
 255      defaults: {
 256          appendTo: 'body',
 257          autoRefresh: true,
 258          cancel: ":input",
 259          delay: 0,
 260          distance: 1,
 261          filter: '*',
 262          tolerance: 'touch'
 263      }
 264  });
 265  
 266  })(jQuery);