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

   1 /**\r
   2  * Interface Elements for jQuery\r
   3  * FX - slide\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 /**\r
  15  * Slides the element\r
  16  */\r
  17 jQuery.fn.extend(\r
  18         {\r
  19                 /**\r
  20                  * @name SlideInUp\r
  21                  * @description slides the element in up\r
  22                  * @param Mixed speed animation speed, integer for miliseconds, string ['slow' | 'normal' | 'fast']\r
  23                  * @param Function callback (optional) A function to be executed whenever the animation completes.\r
  24                  * @param String easing (optional) The name of the easing effect that you want to use.\r
  25                  * @type jQuery\r
  26                  * @cat Plugins/Interface\r
  27                  * @author Stefan Petre\r
  28                  */\r
  29                 SlideInUp : function (speed,callback, easing)\r
  30                 {\r
  31                         return this.queue('interfaceFX', function(){\r
  32                                 new jQuery.fx.slide(this, speed, callback, 'up', 'in', easing);\r
  33                         });\r
  34                 },\r
  35                 \r
  36                 /**\r
  37                  * @name SlideOutUp\r
  38                  * @description slides the element out up\r
  39                  * @param Mixed speed animation speed, integer for miliseconds, string ['slow' | 'normal' | 'fast']\r
  40                  * @param Function callback (optional) A function to be executed whenever the animation completes.\r
  41                  * @param String easing (optional) The name of the easing effect that you want to use.\r
  42                  * @type jQuery\r
  43                  * @cat Plugins/Interface\r
  44                  * @author Stefan Petre\r
  45                  */\r
  46                 SlideOutUp : function (speed,callback, easing)\r
  47                 {\r
  48                         return this.queue('interfaceFX', function(){\r
  49                                 new jQuery.fx.slide(this, speed, callback, 'up', 'out', easing);\r
  50                         });\r
  51                 },\r
  52                 \r
  53                 /**\r
  54                  * @name SlideToggleUp\r
  55                  * @description slides the element in/out up\r
  56                  * @param Mixed speed animation speed, integer for miliseconds, string ['slow' | 'normal' | 'fast']\r
  57                  * @param Function callback (optional) A function to be executed whenever the animation completes.\r
  58                  * @param String easing (optional) The name of the easing effect that you want to use.\r
  59                  * @type jQuery\r
  60                  * @cat Plugins/Interface\r
  61                  * @author Stefan Petre\r
  62                  */\r
  63                 SlideToggleUp : function (speed,callback, easing)\r
  64                 {\r
  65                         return this.queue('interfaceFX', function(){\r
  66                                 new jQuery.fx.slide(this, speed, callback, 'up', 'toggle', easing);\r
  67                         });\r
  68                 },\r
  69                 \r
  70                 /**\r
  71                  * @name SlideInDown\r
  72                  * @description slides the element in down\r
  73                  * @param Mixed speed animation speed, integer for miliseconds, string ['slow' | 'normal' | 'fast']\r
  74                  * @param Function callback (optional) A function to be executed whenever the animation completes.\r
  75                  * @param String easing (optional) The name of the easing effect that you want to use.\r
  76                  * @type jQuery\r
  77                  * @cat Plugins/Interface\r
  78                  * @author Stefan Petre\r
  79                  */\r
  80                 SlideInDown : function (speed,callback, easing)\r
  81                 {\r
  82                         return this.queue('interfaceFX', function(){\r
  83                                 new jQuery.fx.slide(this, speed, callback, 'down', 'in', easing);\r
  84                         });\r
  85                 },\r
  86                 \r
  87                 /**\r
  88                  * @name SlideOutDown\r
  89                  * @description slides the element out down\r
  90                  * @param Mixed speed animation speed, integer for miliseconds, string ['slow' | 'normal' | 'fast']\r
  91                  * @param Function callback (optional) A function to be executed whenever the animation completes.\r
  92                  * @param String easing (optional) The name of the easing effect that you want to use.\r
  93                  * @type jQuery\r
  94                  * @cat Plugins/Interface\r
  95                  * @author Stefan Petre\r
  96                  */\r
  97                 SlideOutDown : function (speed,callback, easing)\r
  98                 {\r
  99                         return this.queue('interfaceFX', function(){\r
 100                                 new jQuery.fx.slide(this, speed, callback, 'down', 'out', easing);\r
 101                         });\r
 102                 },\r
 103                 \r
 104                 /**\r
 105                  * @name SlideToggleDown\r
 106                  * @description slides the element in/out down\r
 107                  * @param Mixed speed animation speed, integer for miliseconds, string ['slow' | 'normal' | 'fast']\r
 108                  * @param Function callback (optional) A function to be executed whenever the animation completes.\r
 109                  * @param String easing (optional) The name of the easing effect that you want to use.\r
 110                  * @type jQuery\r
 111                  * @cat Plugins/Interface\r
 112                  * @author Stefan Petre\r
 113                  */\r
 114                 SlideToggleDown : function (speed,callback, easing)\r
 115                 {\r
 116                         return this.queue('interfaceFX', function(){\r
 117                                 new jQuery.fx.slide(this, speed, callback, 'down', 'toggle', easing);\r
 118                         });\r
 119                 },\r
 120                 \r
 121                 /**\r
 122                  * @name SlideInLeft\r
 123                  * @description slides the element in left\r
 124                  * @param Mixed speed animation speed, integer for miliseconds, string ['slow' | 'normal' | 'fast']\r
 125                  * @param Function callback (optional) A function to be executed whenever the animation completes.\r
 126                  * @param String easing (optional) The name of the easing effect that you want to use.\r
 127                  * @type jQuery\r
 128                  * @cat Plugins/Interface\r
 129                  * @author Stefan Petre\r
 130                  */\r
 131                 SlideInLeft : function (speed,callback, easing)\r
 132                 {\r
 133                         return this.queue('interfaceFX', function(){\r
 134                                 new jQuery.fx.slide(this, speed, callback, 'left', 'in', easing);\r
 135                         });\r
 136                 },\r
 137                 \r
 138                 /**\r
 139                  * @name SlideOutLeft\r
 140                  * @description slides the element out left\r
 141                  * @param Mixed speed animation speed, integer for miliseconds, string ['slow' | 'normal' | 'fast']\r
 142                  * @param Function callback (optional) A function to be executed whenever the animation completes.\r
 143                  * @param String easing (optional) The name of the easing effect that you want to use.\r
 144                  * @type jQuery\r
 145                  * @cat Plugins/Interface\r
 146                  * @author Stefan Petre\r
 147                  */\r
 148                 SlideOutLeft :  function (speed,callback, easing)\r
 149                 {\r
 150                         return this.queue('interfaceFX', function(){\r
 151                                 new jQuery.fx.slide(this, speed, callback, 'left', 'out', easing);\r
 152                         });\r
 153                 },\r
 154                 \r
 155                 /**\r
 156                  * @name SlideToggleLeft\r
 157                  * @description slides the element in/out left\r
 158                  * @param Mixed speed animation speed, integer for miliseconds, string ['slow' | 'normal' | 'fast']\r
 159                  * @param Function callback (optional) A function to be executed whenever the animation completes.\r
 160                  * @param String easing (optional) The name of the easing effect that you want to use.\r
 161                  * @type jQuery\r
 162                  * @cat Plugins/Interface\r
 163                  * @author Stefan Petre\r
 164                  */\r
 165                 SlideToggleLeft : function (speed,callback, easing)\r
 166                 {\r
 167                         return this.queue('interfaceFX', function(){\r
 168                                 new jQuery.fx.slide(this, speed, callback, 'left', 'toggle', easing);\r
 169                         });\r
 170                 },\r
 171                 \r
 172                 /**\r
 173                  * @name SlideInRight\r
 174                  * @description slides the element in right\r
 175                  * @param Mixed speed animation speed, integer for miliseconds, string ['slow' | 'normal' | 'fast']\r
 176                  * @param Function callback (optional) A function to be executed whenever the animation completes.\r
 177                  * @param String easing (optional) The name of the easing effect that you want to use.\r
 178                  * @type jQuery\r
 179                  * @cat Plugins/Interface\r
 180                  * @author Stefan Petre\r
 181                  */\r
 182                 SlideInRight : function (speed,callback, easing)\r
 183                 {\r
 184                         return this.queue('interfaceFX', function(){\r
 185                                 new jQuery.fx.slide(this, speed, callback, 'right', 'in', easing);\r
 186                         });\r
 187                 },\r
 188                 \r
 189                 /**\r
 190                  * @name SlideOutRight\r
 191                  * @description slides the element out right\r
 192                  * @param Mixed speed animation speed, integer for miliseconds, string ['slow' | 'normal' | 'fast']\r
 193                  * @param Function callback (optional) A function to be executed whenever the animation completes.\r
 194                  * @param String easing (optional) The name of the easing effect that you want to use.\r
 195                  * @type jQuery\r
 196                  * @cat Plugins/Interface\r
 197                  * @author Stefan Petre\r
 198                  */\r
 199                 SlideOutRight : function (speed,callback, easing)\r
 200                 {\r
 201                         return this.queue('interfaceFX', function(){\r
 202                                 new jQuery.fx.slide(this, speed, callback, 'right', 'out', easing);\r
 203                         });\r
 204                 },\r
 205                 \r
 206                 /**\r
 207                  * @name SlideToggleRight\r
 208                  * @description slides the element in/out right\r
 209                  * @param Mixed speed animation speed, integer for miliseconds, string ['slow' | 'normal' | 'fast']\r
 210                  * @param Function callback (optional) A function to be executed whenever the animation completes.\r
 211                  * @param String easing (optional) The name of the easing effect that you want to use.\r
 212                  * @type jQuery\r
 213                  * @cat Plugins/Interface\r
 214                  * @author Stefan Petre\r
 215                  */\r
 216                 SlideToggleRight : function (speed,callback, easing)\r
 217                 {\r
 218                         return this.queue('interfaceFX', function(){\r
 219                                 new jQuery.fx.slide(this, speed, callback, 'right', 'toggle', easing);\r
 220                         });\r
 221                 }\r
 222         }\r
 223 );\r
 224 \r
 225 jQuery.fx.slide = function(e, speed, callback, direction, type, easing)\r
 226 {\r
 227         if (!jQuery.fxCheckTag(e)) {\r
 228                 jQuery.dequeue(e, 'interfaceFX');\r
 229                 return false;\r
 230         }\r
 231         var z = this;\r
 232         z.el = jQuery(e);\r
 233         z.easing = typeof callback == 'string' ? callback : easing||null;\r
 234         z.callback = typeof callback == 'function' ? callback : null;\r
 235         if ( type == 'toggle') {\r
 236                 type = z.el.css('display') == 'none' ? 'in' : 'out';\r
 237         }\r
 238         if (!e.ifxFirstDisplay)\r
 239                 e.ifxFirstDisplay = z.el.css('display');\r
 240         z.el.show();\r
 241         \r
 242         z.speed = speed;\r
 243         z.fx = jQuery.fx.buildWrapper(e);\r
 244         \r
 245         z.type = type;\r
 246         z.direction = direction;\r
 247         z.complete = function()\r
 248         {\r
 249                 if(z.type == 'out')\r
 250                         z.el.css('visibility', 'hidden');\r
 251                 jQuery.fx.destroyWrapper(z.fx.wrapper.get(0), z.fx.oldStyle);\r
 252                 if(z.type == 'in'){\r
 253                         z.el.css('display', z.el.get(0).ifxFirstDisplay == 'none' ? 'block' : z.el.get(0).ifxFirstDisplay);\r
 254                 } else {\r
 255                         z.el.css('display', 'none');\r
 256                         z.el.css('visibility', 'visible');\r
 257                 }\r
 258                 if (z.callback && z.callback.constructor == Function) {\r
 259                         z.callback.apply(z.el.get(0));\r
 260                 }\r
 261                 jQuery.dequeue(z.el.get(0), 'interfaceFX');\r
 262         };\r
 263         switch (z.direction) {\r
 264                 case 'up':\r
 265                         z.ef = new jQuery.fx(\r
 266                                 z.el.get(0), \r
 267                                 jQuery.speed(\r
 268                                         z.speed,\r
 269                                         z.easing,\r
 270                                         z.complete\r
 271                                 ),\r
 272                                 'top'\r
 273                         );\r
 274                         z.efx = new jQuery.fx(\r
 275                                 z.fx.wrapper.get(0), \r
 276                                 jQuery.speed(\r
 277                                         z.speed,\r
 278                                         z.easing\r
 279                                 ),\r
 280                                 'height'\r
 281                         );\r
 282                         if (z.type == 'in') {\r
 283                                 z.ef.custom (-z.fx.oldStyle.sizes.hb, 0);\r
 284                                 z.efx.custom(0, z.fx.oldStyle.sizes.hb);\r
 285                         } else {\r
 286                                 z.ef.custom (0, -z.fx.oldStyle.sizes.hb);\r
 287                                 z.efx.custom (z.fx.oldStyle.sizes.hb, 0);\r
 288                         }\r
 289                 break;\r
 290                 case 'down':\r
 291                         z.ef = new jQuery.fx(\r
 292                                 z.el.get(0), \r
 293                                 jQuery.speed(\r
 294                                         z.speed,\r
 295                                         z.easing,\r
 296                                         z.complete\r
 297                                 ),\r
 298                                 'top'\r
 299                         );\r
 300                         if (z.type == 'in') {\r
 301                                 z.ef.custom (z.fx.oldStyle.sizes.hb, 0);\r
 302                         } else {\r
 303                                 z.ef.custom (0, z.fx.oldStyle.sizes.hb);\r
 304                         }\r
 305                 break;\r
 306                 case 'left':\r
 307                         z.ef = new jQuery.fx(\r
 308                                 z.el.get(0), \r
 309                                 jQuery.speed(\r
 310                                         z.speed,\r
 311                                         z.easing,\r
 312                                         z.complete\r
 313                                 ),\r
 314                                 'left'\r
 315                         );\r
 316                         z.efx = new jQuery.fx(\r
 317                                 z.fx.wrapper.get(0), \r
 318                                 jQuery.speed(\r
 319                                         z.speed,\r
 320                                         z.easing\r
 321                                 ),\r
 322                                 'width'\r
 323                         );\r
 324                         if (z.type == 'in') {\r
 325                                 z.ef.custom (-z.fx.oldStyle.sizes.wb, 0);\r
 326                                 z.efx.custom (0, z.fx.oldStyle.sizes.wb);\r
 327                         } else {\r
 328                                 z.ef.custom (0, -z.fx.oldStyle.sizes.wb);\r
 329                                 z.efx.custom (z.fx.oldStyle.sizes.wb, 0);\r
 330                         }\r
 331                 break;\r
 332                 case 'right':\r
 333                         z.ef = new jQuery.fx(\r
 334                                 z.el.get(0), \r
 335                                 jQuery.speed(\r
 336                                         z.speed,\r
 337                                         z.easing,\r
 338                                         z.complete\r
 339                                 ),\r
 340                                 'left'\r
 341                         );\r
 342                         if (z.type == 'in') {\r
 343                                 z.ef.custom (z.fx.oldStyle.sizes.wb, 0);\r
 344                         } else {\r
 345                                 z.ef.custom (0, z.fx.oldStyle.sizes.wb);\r
 346                         }\r
 347                 break;\r
 348         }\r
 349 };\r