[gnome-shell/overview-relayout: 14/14] search-results: Change the default display to use iconGrid

[Florian Müllner <fmuellner src gnome org>]

commit 82a59d616e17fa20164f5e4641e26c702d33541e
Author: Florian Müllner <fmuellner gnome org>
Date:   Thu Oct 14 14:27:28 2010 +0200

    search-results: Change the default display to use iconGrid
    
    Current mockups display all search results as icons as used by
    application results, so change the default result display to use
    iconGrid/BaseIcon. Remove the custom application results display,
    as it is no longer needed.

 data/theme/gnome-shell.css |   18 +++-------
 js/ui/appDisplay.js        |   78 ++------------------------------------------
 js/ui/search.js            |    2 +-
 js/ui/viewSelector.js      |   55 ++++++++++++++++++------------
 4 files changed, 43 insertions(+), 110 deletions(-)
---
diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index 72a5ae6..9fbcb3d 100644
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -480,15 +480,6 @@ StTooltip {
     spacing: 4px;
 }
 
-.dash-search-result-content {
-    padding: 4px;
-}
-
-.dash-search-result-content:selected {
-    border-radius: 4px;
-    background: rgba(255,255,255,0.33);
-}
-
 .dash-results-container {
     spacing: 4px;
 }
@@ -558,7 +549,8 @@ StTooltip {
     padding: 6px 12px;
 }
 
-.app-well-app > .overview-icon {
+.app-well-app > .overview-icon,
+.dash-search-result-content > .overview-icon {
     border-radius: 4px;
     padding: 4px;
     font-size: 10px;
@@ -572,11 +564,13 @@ StTooltip {
     background-image: url("running-indicator.svg");
 }
 
-.app-well-app.selected > .overview-icon {
+.app-well-app:selected > .overview-icon,
+.dash-search-result-content:selected > .overview-icon {
     background: rgba(255,255,255,0.33);
 }
 
-.app-well-app:hover > .overview-icon {
+.app-well-app:hover > .overview-icon,
+.dash-search-result-content:hover > .overview-icon {
     background: rgba(255,255,255,0.33);
     text-shadow: black 0px 2px 2px;
     transition-duration: 100;
diff --git a/js/ui/appDisplay.js b/js/ui/appDisplay.js
index a192ce7..7af8dcb 100644
--- a/js/ui/appDisplay.js
+++ b/js/ui/appDisplay.js
@@ -21,8 +21,6 @@ const Tweener = imports.ui.tweener;
 const Workspace = imports.ui.workspace;
 const Params = imports.misc.params;
 
-const WELL_MAX_COLUMNS = 16;
-const WELL_MAX_SEARCH_ROWS = 1;
 const MENU_POPUP_TIMEOUT = 600;
 
 function AlphabeticalView() {
@@ -171,68 +169,8 @@ AllAppDisplay.prototype = {
         this._appView.refresh(apps);
     }
 };
-
 Signals.addSignalMethods(AllAppDisplay.prototype);
 
-function AppSearchResultDisplay(provider) {
-    this._init(provider);
-}
-
-AppSearchResultDisplay.prototype = {
-    __proto__: Search.SearchResultDisplay.prototype,
-
-    _init: function (provider) {
-        Search.SearchResultDisplay.prototype._init.call(this, provider);
-        this._grid = new IconGrid.IconGrid({ rowLimit: WELL_MAX_SEARCH_ROWS });
-        this.actor = new St.Bin({ name: 'dashAppSearchResults',
-                                  x_align: St.Align.START });
-        this.actor.set_child(this._grid.actor);
-    },
-
-    renderResults: function(results, terms) {
-        let appSys = Shell.AppSystem.get_default();
-        let maxItems = WELL_MAX_SEARCH_ROWS * WELL_MAX_COLUMNS;
-        for (let i = 0; i < results.length && i < maxItems; i++) {
-            let result = results[i];
-            let app = appSys.get_app(result);
-            let display = new AppWellIcon(app);
-            this._grid.addItem(display.actor);
-        }
-    },
-
-    clear: function () {
-        this._grid.removeAll();
-        this.selectionIndex = -1;
-    },
-
-    getVisibleResultCount: function() {
-        return this._grid.visibleItemsCount();
-    },
-
-    selectIndex: function (index) {
-        let nVisible = this.getVisibleResultCount();
-        if (this.selectionIndex >= 0) {
-            let prevActor = this._grid.getItemAtIndex(this.selectionIndex);
-            prevActor._delegate.setSelected(false);
-        }
-        this.selectionIndex = -1;
-        if (index >= nVisible)
-            return false;
-        else if (index < 0)
-            return false;
-        let targetActor = this._grid.getItemAtIndex(index);
-        targetActor._delegate.setSelected(true);
-        this.selectionIndex = index;
-        return true;
-    },
-
-    activateSelected: function() {
-        if (this.selectionIndex < 0)
-            return;
-        let targetActor = this._grid.getItemAtIndex(this.selectionIndex);
-        this.provider.activateResult(targetActor._delegate.app.get_id());
-    }
-};
 
 function BaseAppSearchProvider() {
     this._init();
@@ -285,12 +223,10 @@ AppSearchProvider.prototype = {
         return this._appSys.subsearch(false, previousResults, terms);
     },
 
-    createResultContainerActor: function () {
-        return new AppSearchResultDisplay(this);
-    },
-
     createResultActor: function (resultMeta, terms) {
-        return new AppIcon(resultMeta.id);
+        let app = this._appSys.get_app(resultMeta['id']);
+        let icon = new AppWellIcon(app);
+        return icon.actor;
     },
 
     expandSearch: function(terms) {
@@ -490,14 +426,6 @@ AppWellIcon.prototype = {
         }
     },
 
-    setSelected: function (isSelected) {
-        this._selected = isSelected;
-        if (this._selected)
-            this.actor.add_style_class_name('selected');
-        else
-            this.actor.remove_style_class_name('selected');
-    },
-
     _onMenuPoppedUp: function() {
         if (this._getRunning()) {
             Main.overview.getWorkspacesForWindow(null).setApplicationWindowSelection(this.app.get_id());
diff --git a/js/ui/search.js b/js/ui/search.js
index f2a9915..eff039c 100644
--- a/js/ui/search.js
+++ b/js/ui/search.js
@@ -2,7 +2,7 @@
 
 const Signals = imports.signals;
 
-const RESULT_ICON_SIZE = 24;
+const RESULT_ICON_SIZE = 48;
 
 // Not currently referenced by the search API, but
 // this enumeration can be useful for provider
diff --git a/js/ui/viewSelector.js b/js/ui/viewSelector.js
index 8a83f9f..7c94084 100644
--- a/js/ui/viewSelector.js
+++ b/js/ui/viewSelector.js
@@ -12,13 +12,13 @@ const _ = Gettext.gettext;
 
 const BoxPointer = imports.ui.boxpointer;
 const DND = imports.ui.dnd;
+const IconGrid = imports.ui.iconGrid;
 const Main = imports.ui.main;
 const Overview = imports.ui.overview;
 const Search = imports.ui.search;
 const Tweener = imports.ui.tweener;
 
-// 25 search results (per result type) should be enough for everyone
-const MAX_RENDERED_SEARCH_RESULTS = 25;
+const MAX_SEARCH_RESULTS_ROWS = 2;
 
 function SearchEntry() {
     this._init();
@@ -181,17 +181,19 @@ SearchResult.prototype = {
         this.actor = new St.Clickable({ style_class: 'dash-search-result',
                                         reactive: true,
                                         x_align: St.Align.START,
-                                        x_fill: true,
                                         y_fill: true });
         this.actor._delegate = this;
 
         let content = provider.createResultActor(metaInfo, terms);
         if (content == null) {
-            content = new St.BoxLayout({ style_class: 'dash-search-result-content' });
-            let title = new St.Label({ text: this.metaInfo['name'] });
-            let icon = this.metaInfo['icon'];
-            content.add(icon, { y_fill: false });
-            content.add(title, { expand: true, y_fill: false });
+            content = new St.Bin({ style_class: 'dash-search-result-content',
+                                   reactive: true,
+                                   track_hover: true });
+            let icon = new IconGrid.BaseIcon(this.metaInfo['name'],
+                                             { createIcon: Lang.bind(this, function(size) {
+                                                 return this.metaInfo['icon'];
+                                             })});
+            content.set_child(icon.actor);
         }
         this._content = content;
         this.actor.set_child(content);
@@ -241,36 +243,44 @@ SearchResult.prototype = {
     }
 };
 
-function OverflowSearchResults(provider) {
+function GridSearchResults(provider) {
     this._init(provider);
 }
 
-OverflowSearchResults.prototype = {
+GridSearchResults.prototype = {
     __proto__: Search.SearchResultDisplay.prototype,
 
     _init: function(provider) {
         Search.SearchResultDisplay.prototype._init.call(this, provider);
-        this.actor = new St.OverflowBox({ style_class: 'dash-search-section-list-results' });
+        this._grid = new IconGrid.IconGrid({ rowLimit: MAX_SEARCH_RESULTS_ROWS,
+                                             xAlign: St.Align.START });
+        this.actor = new St.Bin({ x_align: St.Align.START });
+        this.actor.set_child(this._grid.actor);
+        this.selectionIndex = -1;
     },
 
     getVisibleResultCount: function() {
-        return this.actor.get_n_visible();
+        return this._grid.visibleItemsCount();
     },
 
     renderResults: function(results, terms) {
-        for (let i = 0; i < results.length && i < MAX_RENDERED_SEARCH_RESULTS; i++) {
+        for (let i = 0; i < results.length; i++) {
             let result = results[i];
             let meta = this.provider.getResultMeta(result);
             let display = new SearchResult(this.provider, meta, terms);
-            this.actor.add_actor(display.actor);
+            this._grid.addItem(display.actor);
         }
     },
 
-    selectIndex: function(index) {
-        let nVisible = this.actor.get_n_visible();
-        let children = this.actor.get_children();
+    clear: function () {
+        this._grid.removeAll();
+        this.selectionIndex = -1;
+    },
+
+    selectIndex: function (index) {
+        let nVisible = this.getVisibleResultCount();
         if (this.selectionIndex >= 0) {
-            let prevActor = children[this.selectionIndex];
+            let prevActor = this._grid.getItemAtIndex(this.selectionIndex);
             prevActor._delegate.setSelected(false);
         }
         this.selectionIndex = -1;
@@ -278,15 +288,16 @@ OverflowSearchResults.prototype = {
             return false;
         else if (index < 0)
             return false;
-        let targetActor = children[index];
+        let targetActor = this._grid.getItemAtIndex(index);
         targetActor._delegate.setSelected(true);
         this.selectionIndex = index;
         return true;
     },
 
     activateSelected: function() {
-        let children = this.actor.get_children();
-        let targetActor = children[this.selectionIndex];
+        if (this.selectionIndex < 0)
+            return;
+        let targetActor = this._grid.getItemAtIndex(this.selectionIndex);
         targetActor._delegate.activate();
     }
 };
@@ -345,7 +356,7 @@ SearchResults.prototype = {
         providerBox.add(resultDisplayBin, { expand: true });
         let resultDisplay = provider.createResultContainerActor();
         if (resultDisplay == null) {
-            resultDisplay = new OverflowSearchResults(provider);
+            resultDisplay = new GridSearchResults(provider);
         }
         resultDisplayBin.set_child(resultDisplay.actor);