git.sur5r.net Git - contagged/blob - scripts/interface/iselect.js

   1 /**\r
   2  * Interface Elements for jQuery\r
   3  * Selectables\r
   4  *\r
   5  * http://interface.eyecon.ro\r
   6  *\r
   7  * Copyright (c) 2006 Stefan Petre\r
   8  * Dual licensed under the MIT (MIT-LICENSE.txt)\r
   9  * and GPL (GPL-LICENSE.txt) licenses.\r
  10  *\r
  11  *\r
  12  */\r
  13 \r
  14 jQuery.selectHelper = null;\r
  15 jQuery.selectKeyHelper = false;\r
  16 jQuery.selectdrug = null;\r
  17 jQuery.selectCurrent = [];      // For current selection\r
  18 jQuery.selectKeyDown = function(e) {\r
  19         var pressedKey = e.charCode || e.keyCode || -1;\r
  20         if (pressedKey == 17 || pressedKey == 16) {\r
  21                 jQuery.selectKeyHelper = true;\r
  22         }\r
  23 };\r
  24 jQuery.selectKeyUp = function(e) {\r
  25         jQuery.selectKeyHelper = false;\r
  26 };\r
  27 jQuery.selectstart = function(e) {\r
  28         this.f.pointer = jQuery.iUtil.getPointer(e);\r
  29         this.f.pos = jQuery.extend(\r
  30                 jQuery.iUtil.getPosition(this), \r
  31                 jQuery.iUtil.getSize(this)\r
  32         );\r
  33         \r
  34         this.f.scr = jQuery.iUtil.getScroll(this);\r
  35         this.f.pointer.x -= this.f.pos.x;\r
  36         this.f.pointer.y -= this.f.pos.y;\r
  37         jQuery(this).append(jQuery.selectHelper.get(0));\r
  38         if (this.f.hc)\r
  39                 jQuery.selectHelper.addClass(this.f.hc).css('display','block');\r
  40         jQuery.selectHelper.css(\r
  41                 {\r
  42                         display: 'block',\r
  43                         width: '0px',\r
  44                         height: '0px'\r
  45                 }\r
  46         );\r
  47         if (this.f.o) {\r
  48                 jQuery.selectHelper.css('opacity', this.f.o);\r
  49         }\r
  50 \r
  51         jQuery.selectdrug = this;\r
  52         jQuery.selectedone = false;\r
  53         jQuery.selectCurrent = [];      // For current selection state\r
  54         this.f.el.each(\r
  55                 function ()\r
  56                 {\r
  57                         this.pos = {\r
  58                                 x: this.offsetLeft + (this.currentStyle && !jQuery.browser.opera ?parseInt(this.currentStyle.borderLeftWidth)||0:0) + (jQuery.selectdrug.scrollLeft||0), \r
  59                                 y: this.offsetTop + (this.currentStyle && !jQuery.browser.opera ?parseInt(this.currentStyle.borderTopWidth)||0:0) + (jQuery.selectdrug.scrollTop||0),\r
  60                                 wb: this.offsetWidth,\r
  61                                 hb: this.offsetHeight\r
  62                         };\r
  63                         if (this.s == true) {\r
  64                                 if (jQuery.selectKeyHelper == false) {\r
  65                                         this.s = false;\r
  66                                         jQuery(this).removeClass(jQuery.selectdrug.f.sc);\r
  67                                 } else {\r
  68                                         jQuery.selectedone = true;\r
  69 \r
  70                                         // Save current state\r
  71                                         jQuery.selectCurrent[jQuery.selectCurrent.length] = jQuery.attr(this,'id');\r
  72                                 }\r
  73                         }\r
  74                 }\r
  75         );\r
  76         jQuery.selectcheck.apply(this, [e]);\r
  77         jQuery(document)\r
  78                 .bind('mousemove', jQuery.selectcheck)\r
  79                 .bind('mouseup', jQuery.selectstop);\r
  80         return false;\r
  81 };\r
  82 jQuery.selectcheck = function(e)\r
  83 {\r
  84         if(!jQuery.selectdrug)\r
  85                 return;\r
  86         jQuery.selectcheckApply.apply(jQuery.selectdrug, [e]);\r
  87 };\r
  88 jQuery.selectcheckApply = function(e)\r
  89 {\r
  90         if(!jQuery.selectdrug)\r
  91                 return;\r
  92         var pointer = jQuery.iUtil.getPointer(e);\r
  93         \r
  94         var scr = jQuery.iUtil.getScroll(jQuery.selectdrug);\r
  95         pointer.x += scr.l - this.f.scr.l - this.f.pos.x;\r
  96         pointer.y += scr.t - this.f.scr.t - this.f.pos.y;\r
  97         \r
  98         var sx = Math.min(pointer.x, this.f.pointer.x);\r
  99         var sw = Math.min(Math.abs(pointer.x - this.f.pointer.x), Math.abs(this.f.scr.w - sx));\r
 100         var sy = Math.min(pointer.y, this.f.pointer.y);\r
 101         var sh = Math.min(Math.abs(pointer.y - this.f.pointer.y), Math.abs(this.f.scr.h - sy));\r
 102         if (this.scrollTop > 0 && pointer.y - 20 < this.scrollTop) {\r
 103                 var diff = Math.min(scr.t, 10);\r
 104                 sy -= diff;\r
 105                 sh += diff;\r
 106                 this.scrollTop -= diff;\r
 107         } else if (this.scrollTop+ this.f.pos.h < this.f.scr.h && pointer.y + 20 > this.scrollTop + this.f.pos.h) {\r
 108                 var diff = Math.min(this.f.scr.h - this.scrollTop, 10);\r
 109                 this.scrollTop += diff;\r
 110                 if (this.scrollTop != scr.t)\r
 111                         sh += diff;\r
 112         }\r
 113         if (this.scrollLeft > 0 && pointer.x - 20 < this.scrollLeft) {\r
 114                 var diff = Math.min(scr.l, 10);\r
 115                 sx -= diff;\r
 116                 sw += diff;\r
 117                 this.scrollLeft -= diff;\r
 118         } else if (this.scrollLeft+ this.f.pos.w < this.f.scr.w && pointer.x + 20 > this.scrollLeft + this.f.pos.w) {\r
 119                 var diff = Math.min(this.f.scr.w - this.scrollLeft, 10);\r
 120                 this.scrollLeft += diff;\r
 121                 if (this.scrollLeft != scr.l)\r
 122                         sw += diff;\r
 123         }\r
 124         jQuery.selectHelper.css(\r
 125                 {\r
 126                         left:   sx + 'px',\r
 127                         top:    sy + 'px',\r
 128                         width:  sw + 'px',\r
 129                         height: sh + 'px'\r
 130                 }\r
 131         );\r
 132         jQuery.selectHelper.l = sx + this.f.scr.l;\r
 133         jQuery.selectHelper.t = sy + this.f.scr.t;\r
 134         jQuery.selectHelper.r = jQuery.selectHelper.l + sw;\r
 135         jQuery.selectHelper.b = jQuery.selectHelper.t + sh;\r
 136         jQuery.selectedone = false;\r
 137         this.f.el.each(\r
 138                 function () {\r
 139                         // Locate the current element in the current selection\r
 140                         iIndex = jQuery.selectCurrent.indexOf(jQuery.attr(this, 'id'));\r
 141                         // In case we are currently OVER an item\r
 142                         if (\r
 143                                 ! ( this.pos.x > jQuery.selectHelper.r\r
 144                                 || (this.pos.x + this.pos.wb) < jQuery.selectHelper.l\r
 145                                 || this.pos.y > jQuery.selectHelper.b\r
 146                                 || (this.pos.y + this.pos.hb) < jQuery.selectHelper.t\r
 147                                 )\r
 148                         )\r
 149                         {\r
 150                                 jQuery.selectedone = true;\r
 151                                 if (this.s != true) {\r
 152                                         this.s = true;\r
 153                                         jQuery(this).addClass(jQuery.selectdrug.f.sc);\r
 154                                 }\r
 155 \r
 156                                 // Check to see if this item was previously selected, if so, unselect it\r
 157                                 if (iIndex != -1) {\r
 158                                         this.s = false;\r
 159                                         jQuery(this).removeClass(jQuery.selectdrug.f.sc);\r
 160                                 }\r
 161                         } else if (\r
 162                                                 (this.s == true) &&\r
 163                                                 (iIndex == -1)\r
 164                                         ) {\r
 165                                 // If the item was marked as selected, but it was not selected when you started dragging unselect it.\r
 166                                 this.s = false;\r
 167                                 jQuery(this).removeClass(jQuery.selectdrug.f.sc);\r
 168                         } else if (\r
 169                                                 (!this.s) &&\r
 170                                                 (jQuery.selectKeyHelper == true) &&\r
 171                                                 (iIndex != -1)\r
 172                                         ) {\r
 173                                 // Reselect the item if:\r
 174                                 // - we ARE multiselecting,\r
 175                                 // - dragged over an allready selected object (so it got unselected)\r
 176                                 // - But then dragged the selection out of it again.\r
 177                                 this.s = true;\r
 178                                 jQuery(this).addClass(jQuery.selectdrug.f.sc);\r
 179                         }\r
 180                 }\r
 181         );\r
 182         return false;\r
 183 };\r
 184 jQuery.selectstop = function(e)\r
 185 {\r
 186         if(!jQuery.selectdrug)\r
 187                 return;\r
 188         jQuery.selectstopApply.apply(jQuery.selectdrug, [e]);\r
 189 };\r
 190 jQuery.selectstopApply = function(e)\r
 191 {\r
 192         jQuery(document)\r
 193                 .unbind('mousemove', jQuery.selectcheck)\r
 194                 .unbind('mouseup', jQuery.selectstop);\r
 195         if(!jQuery.selectdrug)\r
 196                 return;\r
 197         jQuery.selectHelper.css('display','none');\r
 198         if (this.f.hc)\r
 199                 jQuery.selectHelper.removeClass(this.f.hc);\r
 200         jQuery.selectdrug = false;\r
 201         jQuery('body').append(jQuery.selectHelper.get(0));\r
 202         //\r
 203         // In case we have selected some new items..\r
 204         if (jQuery.selectedone == true) {\r
 205                 if (this.f.onselect)\r
 206                         this.f.onselect(jQuery.Selectserialize(jQuery.attr(this,'id')));\r
 207         } else {\r
 208                 if (this.f.onselectstop)\r
 209                         this.f.onselectstop(jQuery.Selectserialize(jQuery.attr(this,'id')));\r
 210         }\r
 211         // Reset current selection\r
 212         jQuery.selectCurrent = [];\r
 213 };\r
 214 \r
 215 jQuery.Selectserialize = function(s)\r
 216 {\r
 217         var h = '';\r
 218         var o = [];\r
 219         if (a = jQuery('#' + s)) {\r
 220                 a.get(0).f.el.each(\r
 221                         function ()\r
 222                         {\r
 223                                 if (this.s == true) {\r
 224                                         if (h.length > 0) {\r
 225                                                 h += '&';\r
 226                                         }\r
 227                                         h += s + '[]=' + jQuery.attr(this,'id');\r
 228                                         o[o.length] = jQuery.attr(this,'id');\r
 229                                 }\r
 230                         }\r
 231                 );\r
 232         }\r
 233         return {hash:h, o:o};\r
 234 };\r
 235 jQuery.fn.Selectable = function(o)\r
 236 {\r
 237         if (!jQuery.selectHelper) {\r
 238                 jQuery('body',document).append('<div id="selectHelper"></div>').bind('keydown', jQuery.selectKeyDown).bind('keyup', jQuery.selectKeyUp);\r
 239                 jQuery.selectHelper = jQuery('#selectHelper');\r
 240                 jQuery.selectHelper.css(\r
 241                         {\r
 242                                 position:       'absolute',\r
 243                                 display:        'none'\r
 244                         }\r
 245                 );\r
 246 \r
 247                 if (window.event) {\r
 248                         jQuery('body',document).bind('keydown', jQuery.selectKeyDown).bind('keyup', jQuery.selectKeyUp);\r
 249                 } else {\r
 250                         jQuery(document).bind('keydown', jQuery.selectKeyDown).bind('keyup', jQuery.selectKeyUp);\r
 251                 }\r
 252         }\r
 253 \r
 254     if (!o) {\r
 255                 o = {};\r
 256         }\r
 257     return this.each(\r
 258                 function()\r
 259                 {\r
 260                         if (this.isSelectable)\r
 261                                 return;\r
 262                         this.isSelectable = true;\r
 263                         this.f = {\r
 264                                 a : o.accept,\r
 265                                 o : o.opacity ? parseFloat(o.opacity) : false,\r
 266                                 sc : o.selectedclass ? o.selectedclass : false,\r
 267                                 hc : o.helperclass ? o.helperclass : false,\r
 268                                 onselect : o.onselect ? o.onselect : false,\r
 269                                 onselectstop : o.onselectstop ? o.onselectstop : false\r
 270                         };\r
 271                         this.f.el = jQuery('.' + o.accept);\r
 272                         jQuery(this).bind('mousedown', jQuery.selectstart).css('position', 'relative');\r
 273                 }\r
 274         );\r
 275 };