search-display: 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. https://bugzilla.gnome.org/show_bug.cgi?id=634948
This commit is contained in:
parent
d5d7d8a391
commit
2c5d825c87
@ -433,15 +433,6 @@ StTooltip StLabel {
|
||||
spacing: 4px;
|
||||
}
|
||||
|
||||
.search-result-content {
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
.search-result-content:selected {
|
||||
border-radius: 4px;
|
||||
background: rgba(255,255,255,0.33);
|
||||
}
|
||||
|
||||
.results-container {
|
||||
spacing: 4px;
|
||||
}
|
||||
@ -511,7 +502,8 @@ StTooltip StLabel {
|
||||
padding: 6px 12px;
|
||||
}
|
||||
|
||||
.app-well-app > .overview-icon {
|
||||
.app-well-app > .overview-icon,
|
||||
.search-result-content > .overview-icon {
|
||||
border-radius: 4px;
|
||||
padding: 4px;
|
||||
font-size: 10px;
|
||||
@ -525,11 +517,13 @@ StTooltip StLabel {
|
||||
background-image: url("running-indicator.svg");
|
||||
}
|
||||
|
||||
.app-well-app.selected > .overview-icon {
|
||||
.app-well-app:selected > .overview-icon,
|
||||
.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,
|
||||
.search-result-content:hover > .overview-icon {
|
||||
background: rgba(255,255,255,0.33);
|
||||
text-shadow: black 0px 2px 2px;
|
||||
transition-duration: 100;
|
||||
|
@ -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) {
|
||||
@ -489,14 +425,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());
|
||||
|
@ -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
|
||||
|
@ -4,14 +4,16 @@ const Clutter = imports.gi.Clutter;
|
||||
const Lang = imports.lang;
|
||||
const Gettext = imports.gettext.domain('gnome-shell');
|
||||
const _ = Gettext.gettext;
|
||||
const Gtk = imports.gi.Gtk;
|
||||
const St = imports.gi.St;
|
||||
|
||||
const DND = imports.ui.dnd;
|
||||
const IconGrid = imports.ui.iconGrid;
|
||||
const Main = imports.ui.main;
|
||||
const Search = imports.ui.search;
|
||||
|
||||
const MAX_SEARCH_RESULTS_ROWS = 2;
|
||||
|
||||
// 25 search results (per result type) should be enough for everyone
|
||||
const MAX_RENDERED_SEARCH_RESULTS = 25;
|
||||
|
||||
function SearchResult(provider, metaInfo, terms) {
|
||||
this._init(provider, metaInfo, terms);
|
||||
@ -24,17 +26,19 @@ SearchResult.prototype = {
|
||||
this.actor = new St.Clickable({ style_class: '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: '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: '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);
|
||||
@ -84,36 +88,45 @@ 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: '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;
|
||||
@ -121,19 +134,21 @@ 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();
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
function SearchResults(searchSystem) {
|
||||
this._init(searchSystem);
|
||||
}
|
||||
@ -142,10 +157,23 @@ SearchResults.prototype = {
|
||||
_init: function(searchSystem) {
|
||||
this._searchSystem = searchSystem;
|
||||
|
||||
this.actor = new St.BoxLayout({ name: 'searchResults',
|
||||
vertical: true });
|
||||
this.actor = new St.Bin({ name: 'searchResults',
|
||||
y_align: St.Align.START,
|
||||
x_align: St.Align.START,
|
||||
x_fill: true });
|
||||
this._content = new St.BoxLayout({ name: 'searchResultsContent',
|
||||
vertical: true });
|
||||
|
||||
let scrollView = new St.ScrollView({ x_fill: true,
|
||||
y_fill: false,
|
||||
vshadows: true });
|
||||
scrollView.set_policy(Gtk.PolicyType.NEVER, Gtk.PolicyType.AUTOMATIC);
|
||||
scrollView.add_actor(this._content);
|
||||
|
||||
this.actor.set_child(scrollView);
|
||||
|
||||
this._statusText = new St.Label({ style_class: 'search-statustext' });
|
||||
this.actor.add(this._statusText);
|
||||
this._content.add(this._statusText);
|
||||
this._selectedProvider = -1;
|
||||
this._providers = this._searchSystem.getProviders();
|
||||
this._providerMeta = [];
|
||||
@ -175,14 +203,14 @@ 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);
|
||||
|
||||
this._providerMeta.push({ actor: providerBox,
|
||||
resultDisplay: resultDisplay,
|
||||
count: count });
|
||||
this.actor.add(providerBox);
|
||||
this._content.add(providerBox);
|
||||
},
|
||||
|
||||
_clearDisplay: function() {
|
||||
|
Loading…
Reference in New Issue
Block a user