Removed easing formulas and placed them as a plugin under interface
[jquery.git] / src / fx / fx.js
index 4f81aca..f0b9c8e 100644 (file)
@@ -20,13 +20,14 @@ jQuery.fn.extend({
         * @type jQuery\r
         * @param String|Number speed A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).\r
         * @param Function callback (optional) A function to be executed whenever the animation completes.\r
+        * @param String easing (optional) easing effect\r
         * @cat Effects/Animations\r
         * @see hide(String|Number,Function)\r
         */\r
-       show: function(speed,callback){\r
+       show: function(speed,callback, easing){\r
                return speed ? this.animate({\r
                        height: "show", width: "show", opacity: "show"\r
-               }, speed, callback) : this._show();\r
+               }, speed, callback, easing) : this._show();\r
        },\r
        \r
        // Overwrite the old hide method\r
@@ -49,13 +50,14 @@ jQuery.fn.extend({
         * @type jQuery\r
         * @param String|Number speed A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).\r
         * @param Function callback (optional) A function to be executed whenever the animation completes.\r
+        * @param String easing (optional) easing effect\r
         * @cat Effects/Animations\r
         * @see show(String|Number,Function)\r
         */\r
-       hide: function(speed,callback){\r
+       hide: function(speed,callback, easing){\r
                return speed ? this.animate({\r
                        height: "hide", width: "hide", opacity: "hide"\r
-               }, speed, callback) : this._hide();\r
+               }, speed, callback, easing) : this._hide();\r
        },\r
        \r
        /**\r
@@ -73,14 +75,15 @@ jQuery.fn.extend({
         *\r
         * @name slideDown\r
         * @type jQuery\r
-        * @param String|Number speed A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).\r
+        * @param String|Number speed (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).\r
         * @param Function callback (optional) A function to be executed whenever the animation completes.\r
+        * @param String easing (optional) easing effect\r
         * @cat Effects/Animations\r
         * @see slideUp(String|Number,Function)\r
         * @see slideToggle(String|Number,Function)\r
         */\r
-       slideDown: function(speed,callback){\r
-               return this.animate({height: "show"}, speed, callback);\r
+       slideDown: function(speed,callback, easing){\r
+               return this.animate({height: "show"}, speed, callback, easing);\r
        },\r
        \r
        /**\r
@@ -98,14 +101,15 @@ jQuery.fn.extend({
         *\r
         * @name slideUp\r
         * @type jQuery\r
-        * @param String|Number speed A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).\r
+        * @param String|Number speed (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).\r
         * @param Function callback (optional) A function to be executed whenever the animation completes.\r
+        * @param String easing (optional) easing effect\r
         * @cat Effects/Animations\r
         * @see slideDown(String|Number,Function)\r
         * @see slideToggle(String|Number,Function)\r
         */\r
-       slideUp: function(speed,callback){\r
-               return this.animate({height: "hide"}, speed, callback);\r
+       slideUp: function(speed,callback, easing){\r
+               return this.animate({height: "hide"}, speed, callback, easing);\r
        },\r
 \r
        /**\r
@@ -123,16 +127,17 @@ jQuery.fn.extend({
         *\r
         * @name slideToggle\r
         * @type jQuery\r
-        * @param String|Number speed A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).\r
+        * @param String|Number speed (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).\r
         * @param Function callback (optional) A function to be executed whenever the animation completes.\r
+        * @param String easing (optional) easing effect\r
         * @cat Effects/Animations\r
         * @see slideDown(String|Number,Function)\r
         * @see slideUp(String|Number,Function)\r
         */\r
-       slideToggle: function(speed,callback){\r
+       slideToggle: function(speed, callback, easing){\r
                return this.each(function(){\r
                        var state = jQuery(this).is(":hidden") ? "show" : "hide";\r
-                       jQuery(this).animate({height: state}, speed, callback);\r
+                       jQuery(this).animate({height: state}, speed, callback, easing);\r
                });\r
        },\r
        \r
@@ -152,14 +157,15 @@ jQuery.fn.extend({
         *\r
         * @name fadeIn\r
         * @type jQuery\r
-        * @param String|Number speed A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).\r
+        * @param String|Number speed (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).\r
         * @param Function callback (optional) A function to be executed whenever the animation completes.\r
+        * @param String easing (optional) easing effect\r
         * @cat Effects/Animations\r
         * @see fadeOut(String|Number,Function)\r
         * @see fadeTo(String|Number,Number,Function)\r
         */\r
-       fadeIn: function(speed,callback){\r
-               return this.animate({opacity: "show"}, speed, callback);\r
+       fadeIn: function(speed, callback, easing){\r
+               return this.animate({opacity: "show"}, speed, callback, easing);\r
        },\r
        \r
        /**\r
@@ -178,14 +184,15 @@ jQuery.fn.extend({
         *\r
         * @name fadeOut\r
         * @type jQuery\r
-        * @param String|Number speed A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).\r
+        * @param String|Number speed (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).\r
         * @param Function callback (optional) A function to be executed whenever the animation completes.\r
+        * @param String easing (optional) easing effect\r
         * @cat Effects/Animations\r
         * @see fadeIn(String|Number,Function)\r
         * @see fadeTo(String|Number,Number,Function)\r
         */\r
-       fadeOut: function(speed,callback){\r
-               return this.animate({opacity: "hide"}, speed, callback);\r
+       fadeOut: function(speed, callback, easing){\r
+               return this.animate({opacity: "hide"}, speed, callback, easing);\r
        },\r
        \r
        /**\r
@@ -207,12 +214,13 @@ jQuery.fn.extend({
         * @param String|Number speed A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).\r
         * @param Number opacity The opacity to fade to (a number from 0 to 1).\r
         * @param Function callback (optional) A function to be executed whenever the animation completes.\r
+        * @param String easing (optional) easing effect\r
         * @cat Effects/Animations\r
         * @see fadeIn(String|Number,Function)\r
         * @see fadeOut(String|Number,Function)\r
         */\r
-       fadeTo: function(speed,to,callback){\r
-               return this.animate({opacity: to}, speed, callback);\r
+       fadeTo: function(speed,to,callback, easing){\r
+               return this.animate({opacity: to}, speed, callback, easing);\r
        },\r
        \r
        /**\r
@@ -238,17 +246,18 @@ jQuery.fn.extend({
         * @name animate\r
         * @type jQuery\r
         * @param Hash params A set of style attributes that you wish to animate, and to what end.\r
-        * @param String|Number speed A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).\r
-        * @param Function callback A function to be executed whenever the animation completes.\r
+        * @param String|Number speed (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).\r
+        * @param Function callback (optional) A function to be executed whenever the animation completes.\r
+        * @param String easing (optional) easing effect\r
         * @cat Effects/Animations\r
         */\r
-       animate: function(prop,speed,callback) {\r
+       animate: function(prop,speed,callback, easing) {\r
                return this.queue(function(){\r
                \r
                        this.curAnim = jQuery.extend({}, prop);\r
                        \r
                        for ( var p in prop ) {\r
-                               var e = new jQuery.fx( this, jQuery.speed(speed,callback), p );\r
+                               var e = new jQuery.fx( this, jQuery.speed(speed,callback), p, easing );\r
                                if ( prop[p].constructor == Number )\r
                                        e.custom( e.cur(), prop[p] );\r
                                else\r
@@ -328,7 +337,7 @@ jQuery.extend({
         * people. You've been warned.\r
         */\r
        \r
-       fx: function( elem, options, prop ){\r
+       fx: function( elem, options, prop, easing ){\r
 \r
                var z = this;\r
 \r
@@ -336,9 +345,10 @@ jQuery.extend({
                z.o = {\r
                        duration: options.duration || 400,\r
                        complete: options.complete,\r
-                       step: options.step\r
+                       step: options.step,\r
+                       easing : easing || 'linear'\r
                };\r
-\r
+               \r
                // The element\r
                z.el = elem;\r
 \r
@@ -485,9 +495,14 @@ jQuery.extend({
                                        // Execute the complete function\r
                                        z.o.complete.apply( z.el );\r
                        } else {\r
+                               var n = t - this.startTime;\r
                                // Figure out where in the animation we are and set the number\r
-                               var p = (t - this.startTime) / z.o.duration;\r
-                               z.now = ((-Math.cos(p*Math.PI)/2) + 0.5) * (lastNum-firstNum) + firstNum;\r
+                               var p = n / z.o.duration;\r
+                               //if the easing function exists then use it else use default linear easing\r
+                               if (jQuery.easing && jQuery.easing[z.o.easing])\r
+                                       z.now = jQuery.easing[z.o.easing](p, n,  firstNum, (lastNum-firstNum), z.o.duration);\r
+                               else \r
+                                       z.now = ((-Math.cos(p*Math.PI)/2) + 0.5) * (lastNum-firstNum) + firstNum;\r
 \r
                                // Perform the next step of the animation\r
                                z.a();\r
@@ -495,5 +510,4 @@ jQuery.extend({
                };\r
        \r
        }\r
-\r
-});\r
+});
\ No newline at end of file