[gnome-shell/origin/wip/swarm: 3/5] appDisplay: Animate on select app

[Carlos Soriano <csoriano src gnome org>]

commit 35dccaf2b40bc75bc76e59084fe9fac9ca9fa785
Author: Carlos Soriano <carlos soriano89 gmail com>
Date:   Mon Jun 23 12:34:38 2014 +0200

    appDisplay: Animate on select app

 js/ui/appDisplay.js |   46 +++++++++++++++++++++++++++++++++-------------
 js/ui/iconGrid.js   |   32 ++++++++++++++++++++++++++++++++
 js/ui/search.js     |    9 +++++++++
 3 files changed, 74 insertions(+), 13 deletions(-)
---
diff --git a/js/ui/appDisplay.js b/js/ui/appDisplay.js
index f8aa436..45ed722 100644
--- a/js/ui/appDisplay.js
+++ b/js/ui/appDisplay.js
@@ -48,7 +48,7 @@ const INDICATORS_ANIMATION_MAX_TIME = 0.75;
 
 // Since we will animate the page indicators only when aniamting with swarm too,
 // make the time of the animation consistent with the swarm one which is divided
-// by two to make the out animation. Also, make sure we don't exceed swarm animation 
+// by two to make the out animation. Also, make sure we don't exceed swarm animation
 // total time.
 const INDICATORS_BASE_TIME_OUT = 0.125;
 const INDICATORS_ANIMATION_DELAY_OUT = 0.0625;
@@ -467,14 +467,14 @@ const AllView = new Lang.Class({
 
         apps.forEach(Lang.bind(this, function(appId) {
             let app = appSys.lookup_app(appId);
-            let icon = new AppIcon(app);
+            let icon = new AppIcon(app, {}, { animateOnNewWindow: true });
             this.addItem(icon);
         }));
 
         this.loadGrid();
         this._refilterApps();
     },
-    
+
     animate: function(animationDirection, onCompleteOut) {
         let dashPosition = Main.overview._dash._showAppsIcon.get_transformed_position();
         let dashSize = Main.overview._dash._showAppsIcon.get_transformed_size();
@@ -765,11 +765,11 @@ const FrequentView = new Lang.Class({
         for (let i = 0; i < mostUsed.length; i++) {
             if (!mostUsed[i].get_app_info().should_show())
                 continue;
-            let appIcon = new AppIcon(mostUsed[i]);
+            let appIcon = new AppIcon(mostUsed[i], {}, { animateOnNewWindow: true });
             this._grid.addItem(appIcon, -1);
         }
     },
-    
+
     animate: function(animationDirection, onCompleteOut) {
         let dashPosition = Main.overview._dash._showAppsIcon.get_transformed_position();
         let dashSize = Main.overview._dash._showAppsIcon.get_transformed_size();
@@ -927,7 +927,7 @@ const AppDisplay = new Lang.Class({
         this._showView(initialView);
         this._updateFrequentVisibility();
     },
-    
+
     animate: function(animationDirection, onCompleteOut) {
         let view = this._views[global.settings.get_uint('app-picker-view')].view;
         view.animate(animationDirection, onCompleteOut);
@@ -1031,12 +1031,16 @@ const AppSearchProvider = new Lang.Class({
         this.getInitialResultSet(terms, callback, cancellable);
     },
 
-    activateResult: function(result) {
+    activateResult: function(result, terms, icon) {
         let app = this._appSys.lookup_app(result);
         let event = Clutter.get_current_event();
         let modifiers = event ? event.get_state() : 0;
         let openNewWindow = modifiers & Clutter.ModifierType.CONTROL_MASK;
 
+        log("animate activate result " + icon);
+        //if (icon && app.state == Shell.AppState.STOPPED)
+        //    icon.animateOut();
+
         if (openNewWindow)
             app.open_new_window(-1);
         else
@@ -1053,7 +1057,7 @@ const AppSearchProvider = new Lang.Class({
 
     createResultObject: function (resultMeta) {
         let app = this._appSys.lookup_app(resultMeta['id']);
-        return new AppIcon(app);
+        return new AppIcon(app, {}, { animateOnNewWindow: true });
     }
 });
 
@@ -1081,7 +1085,7 @@ const FolderView = new Lang.Class({
     _keyFocusIn: function(actor) {
         Util.ensureActorVisibleInScrollView(this.actor, actor);
     },
-    
+
     animate: function(animationType, animationDirection, params) {
         this._grid.animate(animationType, animationDirection, params);
     },
@@ -1415,13 +1419,13 @@ const AppFolderPopup = new Lang.Class({
         this.actor.show();
 
         this._boxPointer.setArrowActor(this._source.actor);
-        // We need to hide the icons of the view until the boxpointer animation 
+        // We need to hide the icons of the view until the boxpointer animation
         // is completed so we can animate the icons after as we like withouth
         // showing them while boxpointer is animating.
         this._view.actor.opacity = 0;
         this._boxPointer.show(BoxPointer.PopupAnimation.FADE |
                               BoxPointer.PopupAnimation.SLIDE,
-                              Lang.bind(this, 
+                              Lang.bind(this,
             function() {
                 // Restore the view opacity, so now we show the icons and animate
                 // them
@@ -1471,10 +1475,11 @@ Signals.addSignalMethods(AppFolderPopup.prototype);
 const AppIcon = new Lang.Class({
     Name: 'AppIcon',
 
-    _init : function(app, iconParams) {
+    _init : function(app, iconParams, params) {
         this.app = app;
         this.id = app.get_id();
         this.name = app.get_name();
+        this.params = Params.parse(params, { animateOnNewWindow: false });
 
         this.actor = new St.Button({ style_class: 'app-well-app',
                                      reactive: true,
@@ -1552,6 +1557,7 @@ const AppIcon = new Lang.Class({
 
     _onButtonPress: function(actor, event) {
         let button = event.get_button();
+        log("555555555555555555555555555555555 Pushing button " + button);
         if (button == 1) {
             this._removeMenuTimeout();
             this._menuTimeoutId = Mainloop.timeout_add(MENU_POPUP_TIMEOUT,
@@ -1571,12 +1577,18 @@ const AppIcon = new Lang.Class({
     _onClicked: function(actor, button) {
         this._removeMenuTimeout();
 
+        if (this.params.animateOnNewWindow &&
+            this.app.state == Shell.AppState.STOPPED)
+            this.icon.animateOut();
+
         if (button == 1) {
             this.activate();
         } else if (button == 2) {
             this.app.open_new_window(-1);
-            Main.overview.hide();
         }
+
+        Main.overview.hide();
+
         return false;
     },
 
@@ -1636,6 +1648,10 @@ const AppIcon = new Lang.Class({
         let modifiers = event ? event.get_state() : 0;
         let openNewWindow = modifiers & Clutter.ModifierType.CONTROL_MASK &&
                             this.app.state == Shell.AppState.RUNNING;
+                            
+        if (this.params.animateOnNewWindow &&
+            this.app.state == Shell.AppState.STOPPED)
+            this.icon.animateOut();
 
         if (openNewWindow)
             this.app.open_new_window(-1);
@@ -1732,6 +1748,10 @@ const AppIconMenu = new Lang.Class({
 
             this._newWindowMenuItem = this._appendMenuItem(_("New Window"));
             this._newWindowMenuItem.connect('activate', Lang.bind(this, function() {
+                if (this._source.params.animateOnNewWindow &&
+                    this._source.app.state == Shell.AppState.STOPPED)
+                    this._source.animateOut();
+
                 this._source.app.open_new_window(-1);
                 this.emit('activate-window', null);
             }));
diff --git a/js/ui/iconGrid.js b/js/ui/iconGrid.js
index c593e16..ddbedc6 100644
--- a/js/ui/iconGrid.js
+++ b/js/ui/iconGrid.js
@@ -31,6 +31,9 @@ const ANIMATION_TYPE_SWARM_SPRING = 2;
 const ANIMATION_DIRECTION_OUT = 0;
 const ANIMATION_DIRECTION_IN = 1;
 
+const APPICON_ANIMATION_OUT_SCALE = 3;
+const APPICON_ANIMATION_OUT_TIME = 0.25;
+
 const BaseIcon = new Lang.Class({
     Name: 'BaseIcon',
 
@@ -188,9 +191,38 @@ const BaseIcon = new Lang.Class({
 
     _onIconThemeChanged: function() {
         this._createIconTexture(this.iconSize);
+    },
+
+    animateOut: function() {
+        actorZoomOut(this.actor);
     }
 });
 
+function actorZoomOut(actor) {
+    let actorClone = new Clutter.Clone({ source: actor,
+                                         reactive: false });
+    let [width, height] = actor.get_transformed_size();
+    let [x, y] = actor.get_transformed_position();
+    log("animation widht hetihg " + [width, height]);
+    log("animation pos " + [x, y]);
+    actorClone.set_size(width, height);
+    actorClone.set_position(x, y);
+    actorClone.opacity = 255;
+    actorClone.set_pivot_point(0.5, 0.5);
+    Main.uiGroup.add_actor(actorClone);
+
+    Tweener.addTween(actorClone,
+                    { time: APPICON_ANIMATION_OUT_TIME,
+                      scale_x: APPICON_ANIMATION_OUT_SCALE,
+                      scale_y: APPICON_ANIMATION_OUT_SCALE,
+                      opacity: 0,
+                      transition: 'easeOutQuad',
+                      onComplete: function() {
+                           actorClone.destroy();
+                        }
+                    });
+}
+
 const IconGrid = new Lang.Class({
     Name: 'IconGrid',
 
diff --git a/js/ui/search.js b/js/ui/search.js
index f47676f..7035cea 100644
--- a/js/ui/search.js
+++ b/js/ui/search.js
@@ -6,6 +6,7 @@ const Gio = imports.gi.Gio;
 const Gtk = imports.gi.Gtk;
 const Meta = imports.gi.Meta;
 const Signals = imports.signals;
+const Shell = imports.gi.Shell;
 const St = imports.gi.St;
 const Atk = imports.gi.Atk;
 
@@ -350,6 +351,7 @@ const ListSearchResults = new Lang.Class({
         this.providerIcon.connect('key-focus-in', Lang.bind(this, this._keyFocusIn));
         this.providerIcon.connect('clicked', Lang.bind(this,
             function() {
+                this.providerIcon.animateOut();
                 provider.launchSearch(this._terms);
                 Main.overview.toggle();
             }));
@@ -650,5 +652,12 @@ const ProviderIcon = new Lang.Class({
                                  gicon: provider.appInfo.get_icon() });
         this._content.add_actor(icon);
         this._content.add_actor(this.moreIcon);
+    },
+
+    animateOut: function() {
+        let appSys = Shell.AppSystem.get_default();
+        let app = appSys.lookup_app(this.provider.appInfo.get_id());
+        //if (app.state == Shell.AppState.STOPPED)
+        IconGrid.actorZoomOut(this._content);
     }
 });