/* -*- mode: js2; js2-basic-offset: 4; indent-tabs-mode: nil -*- */ const Big = imports.gi.Big; const Clutter = imports.gi.Clutter; const Pango = imports.gi.Pango; const GLib = imports.gi.GLib; const Gio = imports.gi.Gio; const Gtk = imports.gi.Gtk; const Tidy = imports.gi.Tidy; const Shell = imports.gi.Shell; const Lang = imports.lang; const Signals = imports.signals; const Mainloop = imports.mainloop; const DND = imports.ui.dnd; const GenericDisplay = imports.ui.genericDisplay; const Main = imports.ui.main; const Workspaces = imports.ui.workspaces; const ENTERED_MENU_COLOR = new Clutter.Color(); ENTERED_MENU_COLOR.from_pixel(0x00ff0022); const GLOW_COLOR = new Clutter.Color(); GLOW_COLOR.from_pixel(0x4f6ba4ff); const GLOW_PADDING = 5; const APP_ICON_SIZE = 48; const APP_PADDING = 18; const MENU_ICON_SIZE = 24; const MENU_SPACING = 15; const MAX_ITEMS = 30; /* This class represents a single display item containing information about an application. * * appInfo - AppInfo object containing information about the application */ function AppDisplayItem(appInfo) { this._init(appInfo); } AppDisplayItem.prototype = { __proto__: GenericDisplay.GenericDisplayItem.prototype, _init : function(appInfo) { GenericDisplay.GenericDisplayItem.prototype._init.call(this); this._appInfo = appInfo; this._setItemInfo(appInfo.get_name(), appInfo.get_description()); }, getId: function() { return this._appInfo.get_id(); }, //// Public method overrides //// // Opens an application represented by this display item. launch : function() { this._appInfo.launch(); }, //// Protected method overrides //// // Returns an icon for the item. _createIcon : function() { return this._appInfo.create_icon_texture(GenericDisplay.ITEM_DISPLAY_ICON_SIZE); }, // Returns a preview icon for the item. _createPreviewIcon : function() { return this._appInfo.create_icon_texture(GenericDisplay.PREVIEW_ICON_SIZE); } }; const MENU_UNSELECTED = 0; const MENU_SELECTED = 1; const MENU_ENTERED = 2; function MenuItem(name, id, iconName) { this._init(name, id, iconName); } /** * MenuItem: * Shows the list of menus in the sidebar. */ MenuItem.prototype = { _init: function(name, id, iconName) { this.id = id; this.actor = new Big.Box({ orientation: Big.BoxOrientation.HORIZONTAL, spacing: 4, corner_radius: 4, padding_right: 4, reactive: true }); this.actor.connect('button-press-event', Lang.bind(this, function (a, e) { this.setState(MENU_SELECTED); })); let iconTheme = Gtk.IconTheme.get_default(); let pixbuf = null; this._icon = new Clutter.Texture({ width: MENU_ICON_SIZE, height: MENU_ICON_SIZE }); // Wine manages not to have an icon try { pixbuf = iconTheme.load_icon(iconName, MENU_ICON_SIZE, 0 /* flags */); } catch (e) { pixbuf = iconTheme.load_icon('gtk-file', MENU_ICON_SIZE, 0); } if (pixbuf != null) Shell.clutter_texture_set_from_pixbuf(this._icon, pixbuf); this.actor.append(this._icon, Big.BoxPackFlags.NONE); this._text = new Clutter.Text({ color: GenericDisplay.ITEM_DISPLAY_NAME_COLOR, font_name: "Sans 14px", text: name }); // We use individual boxes for the label and the arrow to ensure that they // are aligned vertically. Just setting y_align: Big.BoxAlignment.CENTER // on this.actor does not seem to achieve that. let labelBox = new Big.Box({ y_align: Big.BoxAlignment.CENTER }); labelBox.append(this._text, Big.BoxPackFlags.NONE); this.actor.append(labelBox, Big.BoxPackFlags.EXPAND); let arrowBox = new Big.Box({ y_align: Big.BoxAlignment.CENTER }); this._arrow = new Shell.Arrow({ surface_width: MENU_ICON_SIZE / 2, surface_height: MENU_ICON_SIZE / 2, direction: Gtk.ArrowType.RIGHT, opacity: 0 }); arrowBox.append(this._arrow, Big.BoxPackFlags.NONE); this.actor.append(arrowBox, Big.BoxPackFlags.NONE); }, getState: function() { return this._state; }, setState: function (state) { if (state == this._state) return; this._state = state; if (this._state == MENU_UNSELECTED) { this.actor.background_color = null; this._arrow.set_opacity(0); } else if (this._state == MENU_ENTERED) { this.actor.background_color = ENTERED_MENU_COLOR; this._arrow.set_opacity(0xFF/2); } else { this.actor.background_color = GenericDisplay.ITEM_DISPLAY_SELECTED_BACKGROUND_COLOR; this._arrow.set_opacity(0xFF); } this.emit('state-changed') } } Signals.addSignalMethods(MenuItem.prototype); /* This class represents a display containing a collection of application items. * The applications are sorted based on their popularity by default, and based on * their name if some search filter is applied. */ function AppDisplay() { this._init(); } AppDisplay.prototype = { __proto__: GenericDisplay.GenericDisplay.prototype, _init : function() { GenericDisplay.GenericDisplay.prototype._init.call(this); this._menus = []; this._menuDisplays = []; // map this._appCategories = {}; this._appMonitor = Shell.AppMonitor.get_default(); this._appSystem = Shell.AppSystem.get_default(); this._appsStale = true; this._appSystem.connect('installed-changed', Lang.bind(this, function(appSys) { this._appsStale = true; this._redisplay(false); this._redisplayMenus(); })); this._appSystem.connect('favorites-changed', Lang.bind(this, function(appSys) { this._redisplay(false); })); this._appMonitor.connect('changed', Lang.bind(this, function(monitor) { this._redisplay(false); })); // Load the apps now so it doesn't slow down the first // transition into the overlay this._refreshCache(); this._focusInMenus = true; this._activeMenuIndex = -1; this._activeMenu = null; this._activeMenuApps = null; this._menuDisplay = new Big.Box({ orientation: Big.BoxOrientation.VERTICAL, spacing: MENU_SPACING }); this._redisplayMenus(); this.connect('expanded', Lang.bind(this, function (self) { this._filterReset(); })); this._filterReset(); }, moveRight: function() { if (this._expanded && this._focusInMenu) { this._focusInMenu = false; this._activeMenu.setState(MENU_ENTERED); this.selectFirstItem(); } }, moveLeft: function() { if (this._expanded && !this._focusInMenu) { this._activeMenu.setState(MENU_SELECTED); this.unsetSelected(); this._focusInMenu = true; } }, // Override genericDisplay.js getNavigationArea: function() { return this._menuDisplay; }, selectUp: function() { if (!(this._expanded && this._focusInMenu)) return GenericDisplay.GenericDisplay.prototype.selectUp.call(this); this._selectMenuIndex(this._activeMenuIndex - 1); return true; }, selectDown: function() { if (!(this._expanded && this._focusInMenu)) return GenericDisplay.GenericDisplay.prototype.selectDown.call(this); this._selectMenuIndex(this._activeMenuIndex+1); return true; }, // Protected overrides _filterActive: function() { // We always have a filter now since a menu must be selected return true; }, _filterReset: function() { GenericDisplay.GenericDisplay.prototype._filterReset.call(this); this._selectMenuIndex(0); }, //// Private //// _emitStateChange: function() { this.emit('state-changed'); }, _selectMenuIndex: function(index) { if (index < 0 || index >= this._menus.length) return; this._menuDisplays[index].setState(MENU_SELECTED); }, _getMostUsed: function() { let context = ""; return this._appMonitor.get_most_used_apps(context, 30).map(Lang.bind(this, function (id) { return this._appSystem.lookup_app(id); })).filter(function (e) { return e != null }); }, _addMenuItem: function(name, id, icon, index) { let display = new MenuItem(name, id, icon); this._menuDisplays.push(display); display.connect('state-changed', Lang.bind(this, function (display) { let activated = display.getState() != MENU_UNSELECTED; if (!activated && display == this._activeMenu) { this._activeMenuIndex = -1; this._activeMenu = null; } else if (activated) { if (display != this._activeMenu && this._activeMenu != null) this._activeMenu.setState(MENU_UNSELECTED); this._activeMenuIndex = index; this._activeMenu = display; if (id == null) { this._activeMenuApps = this._getMostUsed(); } else { this._activeMenuApps = this._appSystem.get_applications_for_menu(id); } } this._redisplay(true); })); this._menuDisplay.append(display.actor, 0); }, _redisplayMenus: function() { this._menuDisplay.remove_all(); this._addMenuItem('Frequent', null, 'gtk-select-all'); for (let i = 0; i < this._menus.length; i++) { let menu = this._menus[i]; this._addMenuItem(menu.name, menu.id, menu.icon, i+1); } }, _addApp: function(appInfo) { let appId = appInfo.get_id(); this._allItems[appId] = appInfo; }, //// Protected method overrides //// // Gets information about all applications by calling Gio.app_info_get_all(). _refreshCache : function() { let me = this; if (!this._appsStale) return; this._allItems = {}; this._appCategories = {}; this._menus = this._appSystem.get_menus(); // Loop over the toplevel menu items, load the set of desktop file ids // associated with each one for (let i = 0; i < this._menus.length; i++) { let menu = this._menus[i]; let menuApps = this._appSystem.get_applications_for_menu(menu.id); for (let j = 0; j < menuApps.length; j++) { let app = menuApps[j]; this._addApp(app); } } // Now grab the desktop file ids for settings/preferences. // These show up in search, but not with the rest of apps. let settings = this._appSystem.get_all_settings(); for (let i = 0; i < settings.length; i++) { let app = settings[i]; this._addApp(app); } this._appsStale = false; }, // Stub this out; the app display always has a category selected _setDefaultList : function() { this._matchedItems = []; }, // Compares items associated with the item ids based on the alphabetical order // of the item names. // Returns an integer value indicating the result of the comparison. _compareItems : function(itemIdA, itemIdB) { let appA = this._allItems[itemIdA]; let appB = this._allItems[itemIdB]; return appA.get_name().localeCompare(appB.get_name()); }, // Checks if the item info can be a match for the search string by checking // the name, description, execution command, and categories for the application. // Item info is expected to be Shell.AppInfo. // Returns a boolean flag indicating if itemInfo is a match. _isInfoMatching : function(itemInfo, search) { // Don't show nodisplay items here if (itemInfo.get_is_nodisplay()) return false; // Search takes precedence; not typically useful to search within a // menu if (this._activeMenu == null || search != "") return this._isInfoMatchingSearch(itemInfo, search); else return this._isInfoMatchingMenu(itemInfo, search); }, _isInfoMatchingMenu : function(itemInfo, search) { let id = itemInfo.get_id(); for (let i = 0; i < this._activeMenuApps.length; i++) { let activeApp = this._activeMenuApps[i]; if (activeApp.get_id() == id) return true; } return false; }, _isInfoMatchingSearch: function(itemInfo, search) { if (search == null || search == '') return true; let fold = function(s) { if (!s) return s; return GLib.utf8_casefold(GLib.utf8_normalize(s, -1, GLib.NormalizeMode.ALL), -1); }; let name = fold(itemInfo.get_name()); if (name.indexOf(search) >= 0) return true; let description = fold(itemInfo.get_description()); if (description) { if (description.indexOf(search) >= 0) return true; } let exec = fold(itemInfo.get_executable()); if (exec == null) { log("Missing an executable for " + itemInfo.name); } else { if (exec.indexOf(search) >= 0) return true; } let categories = itemInfo.get_categories(); for (let i = 0; i < categories.length; i++) { let category = fold(categories[i]); if (category.indexOf(search) >= 0) return true; } return false; }, // Creates an AppDisplayItem based on itemInfo, which is expected be an Shell.AppInfo object. _createDisplayItem: function(itemInfo) { return new AppDisplayItem(itemInfo); } }; Signals.addSignalMethods(AppDisplay.prototype); function WellDisplayItem(appInfo, isFavorite) { this._init(appInfo, isFavorite); } WellDisplayItem.prototype = { _init : function(appInfo, isFavorite) { this.appInfo = appInfo; this.isFavorite = isFavorite; this.actor = new Big.Box({ orientation: Big.BoxOrientation.VERTICAL, corner_radius: 2, border: 0, padding: 1, border_color: GenericDisplay.ITEM_DISPLAY_SELECTED_BACKGROUND_COLOR, reactive: true }); this.actor.connect('enter-event', Lang.bind(this, function(o, event) { this.actor.border = 1; this.actor.padding = 0; return false; })); this.actor.connect('leave-event', Lang.bind(this, function(o, event) { this.actor.border = 0; this.actor.padding = 1; return false; })); this.actor._delegate = this; this.actor.connect('button-release-event', Lang.bind(this, function (b, e) { this._handleActivate(); })); let draggable = DND.makeDraggable(this.actor); let iconBox = new Big.Box({ orientation: Big.BoxOrientation.VERTICAL, x_align: Big.BoxAlignment.CENTER }); this._icon = appInfo.create_icon_texture(APP_ICON_SIZE); iconBox.append(this._icon, Big.BoxPackFlags.NONE); this.actor.append(iconBox, Big.BoxPackFlags.NONE); this._windows = Shell.AppMonitor.get_default().get_windows_for_app(appInfo.get_id()); let nameBox = new Big.Box({ orientation: Big.BoxOrientation.HORIZONTAL, x_align: Big.BoxAlignment.CENTER }); this._nameBox = nameBox; this._name = new Clutter.Text({ color: GenericDisplay.ITEM_DISPLAY_NAME_COLOR, font_name: "Sans 12px", line_alignment: Pango.Alignment.CENTER, ellipsize: Pango.EllipsizeMode.END, text: appInfo.get_name() }); nameBox.append(this._name, Big.BoxPackFlags.NONE); if (this._windows.length > 0) { let glow = new Shell.DrawingArea({}); glow.connect('redraw', Lang.bind(this, function (e, tex) { Shell.draw_glow(tex, GLOW_COLOR.red / 255, GLOW_COLOR.green / 255, GLOW_COLOR.blue / 255, GLOW_COLOR.alpha / 255); })); this._name.connect('notify::allocation', Lang.bind(this, function (n, alloc) { let x = this._name.x; let y = this._name.y; let width = this._name.width; let height = this._name.height; // If we're smaller than the allocated box width, pad out the glow a bit // to make it more visible if ((width + GLOW_PADDING * 2) < this._nameBox.width) { width += GLOW_PADDING * 2; x -= GLOW_PADDING; } glow.set_size(width, height); glow.set_position(x, y); })); nameBox.add_actor(glow); glow.lower(this._name); } this.actor.append(nameBox, Big.BoxPackFlags.NONE); }, _handleActivate: function () { if (this._windows.length == 0) this.launch(); else { /* Pick the first window and activate it; * In the future, we want to have a menu dropdown here. */ let first = this._windows[0]; Main.overlay.activateWindow (first, Clutter.get_current_event_time()); } this.emit('activated'); }, // Opens an application represented by this display item. launch : function() { this.appInfo.launch(); }, // Draggable interface - FIXME deduplicate with GenericDisplay getDragActor: function(stageX, stageY) { this.dragActor = this.appInfo.create_icon_texture(APP_ICON_SIZE); // If the user dragged from the icon itself, then position // the dragActor over the original icon. Otherwise center it // around the pointer let [iconX, iconY] = this._icon.get_transformed_position(); let [iconWidth, iconHeight] = this._icon.get_transformed_size(); if (stageX > iconX && stageX <= iconX + iconWidth && stageY > iconY && stageY <= iconY + iconHeight) this.dragActor.set_position(iconX, iconY); else this.dragActor.set_position(stageX - this.dragActor.width / 2, stageY - this.dragActor.height / 2); return this.dragActor; }, // Returns the original icon that is being used as a source for the cloned texture // that represents the item as it is being dragged. getDragActorSource: function() { return this._icon; }, getWordWidth: function() { return this._wordWidth; }, setWidth: function(width) { this._nameBox.width = width + GLOW_PADDING * 2; } }; Signals.addSignalMethods(WellDisplayItem.prototype); function WellArea(width, isFavorite) { this._init(width, isFavorite); } WellArea.prototype = { _init : function(width, isFavorite) { this.isFavorite = isFavorite; this._grid = new Tidy.Grid({ width: width, row_gap: 4 }); this._grid._delegate = this; this.actor = this._grid; }, redisplay: function (infos) { let children; children = this._grid.get_children(); children.forEach(Lang.bind(this, function (v) { v.destroy(); })); this._maxWordWidth = 0; let displays = [] for (let i = 0; i < infos.length; i++) { let app = infos[i]; let display = new WellDisplayItem(app, this.isFavorite); displays.push(display); let width = display.getWordWidth(); if (width > this._maxWordWidth) this._maxWordWidth = width; display.connect('activated', Lang.bind(this, function (display) { this.emit('activated', display); })); this.actor.add_actor(display.actor); } this._displays = displays; }, getWordWidth: function() { return this._maxWordWidth; }, setItemWidth: function(width) { for (let i = 0; i < this._displays.length; i++) { let display = this._displays[i]; display.setWidth(width); } }, // Draggable target interface acceptDrop : function(source, actor, x, y, time) { let global = Shell.Global.get(); let id = null; if (source instanceof WellDisplayItem) { id = source.appInfo.get_id(); } else if (source instanceof AppDisplayItem) { id = source.getId(); } else if (source instanceof Workspaces.WindowClone) { let appMonitor = Shell.AppMonitor.get_default(); let app = appMonitor.get_window_app(source.metaWindow); id = app.get_id(); if (id === null) return false; } else { return false; } let appSystem = Shell.AppSystem.get_default(); if (source.isFavorite && (!this.isFavorite)) { Mainloop.idle_add(function () { appSystem.remove_favorite(id); }); } else if ((!source.isFavorite) && this.isFavorite) { Mainloop.idle_add(function () { appSystem.add_favorite(id); }); } else { return false; } return true; } } Signals.addSignalMethods(WellArea.prototype); function AppWell(width) { this._init(width); } AppWell.prototype = { _init : function(width) { this._menus = []; this._menuDisplays = []; this.actor = new Big.Box({ orientation: Big.BoxOrientation.VERTICAL, spacing: 4, width: width }); this._appSystem = Shell.AppSystem.get_default(); this._appMonitor = Shell.AppMonitor.get_default(); this._appSystem.connect('installed-changed', Lang.bind(this, function(appSys) { this._redisplay(); })); this._appSystem.connect('favorites-changed', Lang.bind(this, function(appSys) { this._redisplay(); })); this._appMonitor.connect('changed', Lang.bind(this, function(monitor) { this._redisplay(); })); this._favoritesArea = new WellArea(width, true); this._favoritesArea.connect('activated', Lang.bind(this, function (a, display) { Main.overlay.hide(); })); this.actor.append(this._favoritesArea.actor, Big.BoxPackFlags.NONE); this._runningBox = new Big.Box({ border_color: GenericDisplay.ITEM_DISPLAY_NAME_COLOR, border_top: 1, corner_radius: 3, padding_top: GenericDisplay.PREVIEW_BOX_PADDING }); this._runningArea = new WellArea(width, false); this._runningArea.connect('activated', Lang.bind(this, function (a, display) { Main.overlay.hide(); })); this._runningBox.append(this._runningArea.actor, Big.BoxPackFlags.EXPAND); this.actor.append(this._runningBox, Big.BoxPackFlags.NONE); this._redisplay(); }, _lookupApps: function(appIds) { let result = []; for (let i = 0; i < appIds.length; i++) { let id = appIds[i]; let app = this._appSystem.lookup_app(id); if (!app) continue; result.push(app); } return result; }, _redisplay: function() { /* hardcode here pending some design about how exactly activities behave */ let contextId = ""; let arrayToObject = function(a) { let o = {}; for (let i = 0; i < a.length; i++) o[a[i]] = 1; return o; }; let favoriteIds = this._appSystem.get_favorites(); let favoriteIdsObject = arrayToObject(favoriteIds); let runningIds = this._appMonitor.get_running_app_ids(contextId).filter(function (e) { return !(e in favoriteIdsObject); }); let favorites = this._lookupApps(favoriteIds); let running = this._lookupApps(runningIds); this._favoritesArea.redisplay(favorites); this._runningArea.redisplay(running); let maxWidth = this._favoritesArea.getWordWidth(); if (this._runningArea.getWordWidth() > maxWidth) maxWidth = this._runningArea.getWordWidth(); this._favoritesArea.setItemWidth(maxWidth); this._runningArea.setItemWidth(maxWidth); // If it's empty, we hide it so the top border doesn't show up if (running.length == 0) this._runningBox.hide(); else this._runningBox.show(); } }; Signals.addSignalMethods(AppWell.prototype);