[gnome-shell/wip/paging-release2: 12/22] appDisplay: Animate indicators

[Carlos Soriano <csoriano src gnome org>]

commit efc552a52ffa9d70d849d0cc40c7252a8ae69be4
Author: Carlos Soriano <carlos soriano89 gmail com>
Date:   Mon Aug 26 12:47:09 2013 +0200

    appDisplay: Animate indicators
    
    Add a translation animation for indicators, following
    design reasons

 js/ui/appDisplay.js |   28 ++++++++++++++++++++++++++++
 1 files changed, 28 insertions(+), 0 deletions(-)
---
diff --git a/js/ui/appDisplay.js b/js/ui/appDisplay.js
index 3218559..8a78c21 100644
--- a/js/ui/appDisplay.js
+++ b/js/ui/appDisplay.js
@@ -37,6 +37,13 @@ const INACTIVE_GRID_OPACITY = 77;
 const INACTIVE_GRID_OPACITY_ANIMATION_TIME = 0.15;
 const FOLDER_SUBICON_FRACTION = .4;
 
+const INDICATORS_ANIMATION_TIME = 0.6;
+// 100% means indicators wait for be animated until the previous one
+// is animated completely. 0% means all animators are animated
+// at once without delay
+const INDICATORS_ANIMATION_DELAY_PERCENTAGE = 50;
+const INDICATOR_MOVE_OFFSET = 60;
+
 const PAGE_SWITCH_TIME = 0.3;
 
 // Recursively load a GMenuTreeDirectory; we could put this in ShellAppSystem too
@@ -150,6 +157,9 @@ const PageIndicators = new Lang.Class({
                                         y_align: Clutter.ActorAlign.CENTER });
         this._nPages = 0;
         this._currentPage = undefined;
+
+        this.actor.connect('notify::mapped',
+                           Lang.bind(this, this._animateIndicators));
     },
 
     setNPages: function(nPages) {
@@ -185,6 +195,24 @@ const PageIndicators = new Lang.Class({
         let children = this.actor.get_children();
         for (let i = 0; i < children.length; i++)
             children[i].set_checked(i == this._currentPage);
+    },
+
+    _animateIndicators: function() {
+        if (!this.actor.mapped)
+            return;
+
+        let children = this.actor.get_children();
+        let timePerChild = INDICATORS_ANIMATION_TIME / this._nPages;
+        let delay = INDICATORS_ANIMATION_DELAY_PERCENTAGE / 100 * timePerChild;
+        for (let i = 0; i < this._nPages; i++) {
+            children[i].translation_x = INDICATOR_MOVE_OFFSET;
+            Tweener.addTween(children[i],
+                             { translation_x: 0,
+                               time: timePerChild,
+                               delay: delay * i,
+                               transition: 'easeOutQuad'
+                             });
+        }
     }
 });
 Signals.addSignalMethods(PageIndicators.prototype);