[gnome-shell/wip/swarm: 28/30] Search: use AppIcon for grid results



commit 448de21d5277a15d417c20030cff9795def354e7
Author: Carlos Soriano <carlos soriano89 gmail com>
Date:   Wed Jun 25 13:19:52 2014 +0200

    Search: use AppIcon for grid results

 data/theme/gnome-shell.css |   14 ++----
 js/ui/appDisplay.js        |   86 ++++++++++++++++++++-----------------
 js/ui/search.js            |  102 +++++++++++++------------------------------
 3 files changed, 81 insertions(+), 121 deletions(-)
---
diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index c2d1f18..1bcae20 100644
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -47,8 +47,7 @@ stage {
 .window-caption,
 .switcher-list,
 .app-well-app > .overview-icon,
-.show-apps > .overview-icon,
-.grid-search-result .overview-icon {
+.show-apps > .overview-icon {
     font-size: 9pt;
     font-weight: bold;
 }
@@ -1078,8 +1077,7 @@ StScrollBar StButton#vhandle:active {
     background-image: url("more-results.svg");
 }
 
-.app-well-app > .overview-icon.overview-icon-with-label,
-.grid-search-result .overview-icon.overview-icon-with-label {
+.app-well-app > .overview-icon.overview-icon-with-label {
     /* since the label controls its own spacing, it is visually more
     consistent to use different padding values for top and bottom */
     padding: 10px 8px 5px 8px;
@@ -1089,8 +1087,7 @@ StScrollBar StButton#vhandle:active {
 .app-well-app > .overview-icon,
 .show-apps > .overview-icon,
 .search-provider-icon,
-.list-search-result,
-.grid-search-result .overview-icon {
+.list-search-result {
     border-radius: 4px;
     padding: 6px;
     border: 1px rgba(0,0,0,0);
@@ -1126,8 +1123,7 @@ StScrollBar StButton#vhandle:active {
 .app-well-app:hover > .overview-icon,
 .show-apps:hover > .overview-icon,
 .search-provider-icon:hover,
-.list-search-result:hover,
-.grid-search-result:hover .overview-icon {
+.list-search-result:hover {
     background-color: rgba(255,255,255,0.1);
     text-shadow: black 0px 2px 2px;
     transition-duration: 100ms;
@@ -1175,12 +1171,10 @@ StScrollBar StButton#vhandle:active {
 }
 
 .app-well-app:focus > .overview-icon,
-.grid-search-result:focus .overview-icon,
 .show-apps:focus > .overview-icon,
 .search-provider-icon:focus,
 .list-search-result:focus,
 .app-well-app:selected > .overview-icon,
-.grid-search-result:selected .overview-icon,
 .search-provider-icon:selected,
 .list-search-result:selected {
     background-color: rgba(255,255,255,0.33);
diff --git a/js/ui/appDisplay.js b/js/ui/appDisplay.js
index 567f124..b30739e 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();
@@ -498,7 +498,6 @@ const AllView = new Lang.Class({
                         // to not show them for a moment before the animation is
                         // started
                         this._grid.actor.opacity = 0;
-                        log("------- animate before redraw");
                         Meta.later_add(Meta.LaterType.BEFORE_REDRAW, Lang.bind(this,
                             function() {
                                 this._grid.actor.opacity = 255;
@@ -512,6 +511,9 @@ const AllView = new Lang.Class({
                     this._grid.disconnect(animationDoneId);
                     if (onCompleteOut)
                         onCompleteOut();
+                    // Reset to the default, so when we open again AllView it
+                    // opens in the page 0.
+                    this._currentPage = 0;
                 }));
 
             if (this._displayingPopup && this._currentPopup) {
@@ -765,11 +767,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 +929,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,29 +1033,9 @@ const AppSearchProvider = new Lang.Class({
         this.getInitialResultSet(terms, callback, cancellable);
     },
 
-    activateResult: function(result) {
-        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;
-
-        if (openNewWindow)
-            app.open_new_window(-1);
-        else
-            app.activate();
-    },
-
-    dragActivateResult: function(id, params) {
-        params = Params.parse(params, { workspace: -1,
-                                        timestamp: 0 });
-
-        let app = this._appSys.lookup_app(id);
-        app.open_new_window(workspace);
-    },
-
     createResultObject: function (resultMeta) {
         let app = this._appSys.lookup_app(resultMeta['id']);
-        return new AppIcon(app);
+        return new AppIcon(app, {}, { animateOnNewWindow: true });
     }
 });
 
@@ -1081,7 +1063,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);
     },
@@ -1416,13 +1398,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
@@ -1472,10 +1454,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,
@@ -1553,6 +1536,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,
@@ -1572,12 +1556,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._onActivate(Clutter.get_current_event());
+            this.activate();
         } else if (button == 2) {
             this.app.open_new_window(-1);
-            Main.overview.hide();
         }
+
+        Main.overview.hide();
+
         return false;
     },
 
@@ -1632,15 +1622,20 @@ const AppIcon = new Lang.Class({
         this.emit('menu-state-changed', false);
     },
 
-    _onActivate: function (event) {
-        let modifiers = event.get_state();
+    activate: function () {
+        let event = Clutter.get_current_event();
+        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 (modifiers & Clutter.ModifierType.CONTROL_MASK
-            && this.app.state == Shell.AppState.RUNNING) {
+        if (openNewWindow)
             this.app.open_new_window(-1);
-        } else {
+        else
             this.app.activate();
-        }
 
         Main.overview.hide();
     },
@@ -1665,6 +1660,13 @@ const AppIcon = new Lang.Class({
     shouldShowTooltip: function() {
         return this.actor.hover && (!this._menu || !this._menu.isOpen);
     },
+
+    setSelected: function(selected) {
+        if (selected)
+            this.actor.add_style_pseudo_class('selected');
+        else
+            this.actor.remove_style_pseudo_class('selected');
+    }
 });
 Signals.addSignalMethods(AppIcon.prototype);
 
@@ -1725,6 +1727,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/search.js b/js/ui/search.js
index d85fd19..032af0d 100644
--- a/js/ui/search.js
+++ b/js/ui/search.js
@@ -144,47 +144,26 @@ const MaxWidthBin = new Lang.Class({
     }
 });
 
-const SearchResult = new Lang.Class({
-    Name: 'SearchResult',
+const ListSearchResult = new Lang.Class({
+    Name: 'ListSearchResult',
+
+    ICON_SIZE: 64,
 
-    _init: function(provider, metaInfo) {
+    _init: function(provider, metaInfo, terms) {
         this.provider = provider;
         this.metaInfo = metaInfo;
+        this._terms = terms;
 
         this.actor = new St.Button({ reactive: true,
                                      can_focus: true,
                                      track_hover: true,
                                      x_align: St.Align.START,
-                                     y_fill: true });
+                                     x_fill: true,
+                                     y_fill: true,
+                                     style_class: 'list-search-result'});
 
         this.actor._delegate = this;
         this.actor.connect('clicked', Lang.bind(this, this.activate));
-    },
-
-    activate: function() {
-        this.emit('activate', this.metaInfo.id);
-    },
-
-    setSelected: function(selected) {
-        if (selected)
-            this.actor.add_style_pseudo_class('selected');
-        else
-            this.actor.remove_style_pseudo_class('selected');
-    }
-});
-Signals.addSignalMethods(SearchResult.prototype);
-
-const ListSearchResult = new Lang.Class({
-    Name: 'ListSearchResult',
-    Extends: SearchResult,
-
-    ICON_SIZE: 64,
-
-    _init: function(provider, metaInfo) {
-        this.parent(provider, metaInfo);
-
-        this.actor.style_class = 'list-search-result';
-        this.actor.x_fill = true;
 
         let content = new St.BoxLayout({ style_class: 'list-search-result-content',
                                          vertical: false });
@@ -218,45 +197,31 @@ const ListSearchResult = new Lang.Class({
                                        x_align: St.Align.START,
                                        y_align: St.Align.END });
         }
+    },
+
+    activate: function(result, id) {
+        this.provider.activateResult(id, this._terms);
+        Main.overview.toggle();
+    },
+
+    setSelected: function(selected) {
+        if (selected)
+            this.actor.add_style_pseudo_class('selected');
+        else
+            this.actor.remove_style_pseudo_class('selected');
     }
 });
 
 const GridSearchResult = new Lang.Class({
     Name: 'GridSearchResult',
-    Extends: SearchResult,
-
-    _init: function(provider, metaInfo) {
-        this.parent(provider, metaInfo);
-
-        this.actor.style_class = 'grid-search-result';
 
-        let content = provider.createResultObject(metaInfo);
-        log("content  " + content);
-        this._dragActorSource = content;
-
-        this.actor.set_child(content.actor);
-
-        let draggable = DND.makeDraggable(this.actor);
-        draggable.connect('drag-begin',
-                          Lang.bind(this, function() {
-                              Main.overview.beginItemDrag(this);
-                          }));
-        draggable.connect('drag-cancelled',
-                          Lang.bind(this, function() {
-                              Main.overview.cancelledItemDrag(this);
-                          }));
-        draggable.connect('drag-end',
-                          Lang.bind(this, function() {
-                              Main.overview.endItemDrag(this);
-                          }));
-    },
-
-    getDragActorSource: function() {
-        return this._dragActorSource;
-    },
+    _init: function(provider, metaInfo, terms) {
+        this.provider = provider;
+        this.metaInfo = metaInfo;
 
-    getDragActor: function() {
-        return this.metaInfo['createIcon'](Main.overview.dashIconSize);
+        // Expect an AppIcon which already takes management of drag,
+        // activation, selection, etc.
+        this.actor = provider.createResultObject(metaInfo).actor;
     }
 });
 
@@ -292,8 +257,9 @@ const SearchResultsBase = new Lang.Class({
     },
 
     clear: function() {
-        for (let resultId in this._resultDisplays)
+        for (let resultId in this._resultDisplays) {
             this._resultDisplays[resultId].actor.destroy();
+        }
         this._resultDisplays = {};
         this._clearResultDisplay();
         this.actor.hide();
@@ -303,11 +269,6 @@ const SearchResultsBase = new Lang.Class({
         this.emit('key-focus-in', actor);
     },
 
-    _activateResult: function(result, id) {
-        this.provider.activateResult(id, this._terms);
-        Main.overview.toggle();
-    },
-
     _setMoreIconVisible: function(visible) {
     },
 
@@ -336,7 +297,6 @@ const SearchResultsBase = new Lang.Class({
                 metasNeeded.forEach(Lang.bind(this, function(resultId, i) {
                     let meta = metas[i];
                     let display = this._createResultDisplay(meta);
-                    display.connect('activate', Lang.bind(this, this._activateResult));
                     display.actor.connect('key-focus-in', Lang.bind(this, this._keyFocusIn));
                     this._resultDisplays[resultId] = display;
                 }));
@@ -419,7 +379,7 @@ const ListSearchResults = new Lang.Class({
     },
 
     _createResultDisplay: function(meta) {
-        return new ListSearchResult(this.provider, meta);
+        return new ListSearchResult(this.provider, meta, this._terms);
     },
 
     _addItem: function(display) {
@@ -459,7 +419,7 @@ const GridSearchResults = new Lang.Class({
     },
 
     _createResultDisplay: function(meta) {
-        return new GridSearchResult(this.provider, meta);
+        return new GridSearchResult(this.provider, meta, this._terms);
     },
 
     _addItem: function(display) {


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]