added some animations, code for show/hiding items

1 files changed, 53 insertions, 2 deletions

diff --git a/module/web/static/js/utils/animations.js b/module/web/static/js/utils/animations.js
index 9b1448f61..18360c526 100644
--- a/module/web/static/js/utils/animations.js
+++ b/module/web/static/js/utils/animations.js
@@ -10,9 +10,58 @@ define(['jquery', 'underscore', 'transit'], function(jQuery, _) {
         };
     });
 
+    // TODO: sloppy chaining
+    // in functions not possible without previous out
+
+    jQuery.fn.zapIn = function(speed, easing, callback) {
+        var height = this.data('height') || '100%';
+        this.transition({
+            height: height,
+            scale: [1, 1],
+            opacity: 'show'
+        }, speed, easing, callback);
+
+    };
+
+    jQuery.fn.zapOut = function(speed, easing, callback) {
+        if (!this.data('height')) {
+            var height = this.height();
+            this.css({height: height});
+            this.data('height', height)
+        }
+        this.transition({
+            height: '0px',
+            scale: [1, 0],
+            opacity: 'hide'
+        }, speed, easing, callback);
+
+    };
+
+    jQuery.fn.slideIn = function(speed, easing, callback) {
+        var height = this.data('height') || '100%';
+        this.transition({
+            height: height,
+            opacity: 'show'
+        }, speed, easing, callback);
+
+    };
+
+    jQuery.fn.slideOut = function(speed, easing, callback) {
+        if (!this.data('height')) {
+            var height = this.height();
+            this.css({height: height, overflow: 'hidden'});
+            this.data('height', height)
+        }
+        this.transition({
+            height: '0px',
+            opacity: 'hide'
+        }, speed, easing, callback);
+
+    };
+
     jQuery.fn._transit = jQuery.fn.transit;
 
-    // Over riding transit plugin to support hide and show
+    // Overriding transit plugin to support hide and show
     // Props retains it properties across multiple calls, therefore props.show value is introduced
     jQuery.fn.transit = jQuery.fn.transition = function(props, duration, easing, callback) {
         var self = this;
@@ -23,7 +72,9 @@ define(['jquery', 'underscore', 'transit'], function(jQuery, _) {
 
             callback = function() {
                 self.css({display: 'none'});
-                if (typeof cb === 'function') { cb.apply(self); }
+                if (typeof cb === 'function') {
+                    cb.apply(self);
+                }
             };
         } else if (props && (props.opacity === 'show' || (props.opacity === 1 && props.show === true))) {
             props.opacity = 1;