diff options
Diffstat (limited to '')
| -rw-r--r-- | browser/components/search/SearchOneOffs.sys.mjs | 1130 |
1 files changed, 1130 insertions, 0 deletions
diff --git a/browser/components/search/SearchOneOffs.sys.mjs b/browser/components/search/SearchOneOffs.sys.mjs new file mode 100644 index 0000000000..ddab74f94a --- /dev/null +++ b/browser/components/search/SearchOneOffs.sys.mjs @@ -0,0 +1,1130 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +const lazy = {}; + +ChromeUtils.defineESModuleGetters(lazy, { + PrivateBrowsingUtils: "resource://gre/modules/PrivateBrowsingUtils.sys.mjs", + SearchUIUtils: "resource:///modules/SearchUIUtils.sys.mjs", +}); + +const EMPTY_ADD_ENGINES = []; + +/** + * Defines the search one-off button elements. These are displayed at the bottom + * of the address bar and search bar. The address bar buttons are a subclass in + * browser/components/urlbar/UrlbarSearchOneOffs.jsm. If you are adding a new + * subclass, see "Methods for subclasses to override" below. + */ +export class SearchOneOffs { + constructor(container) { + this.container = container; + this.window = container.ownerGlobal; + this.document = container.ownerDocument; + + this.container.appendChild( + this.window.MozXULElement.parseXULToFragment( + ` + <hbox class="search-panel-one-offs-header search-panel-header"> + <label class="search-panel-one-offs-header-label" data-l10n-id="search-one-offs-with-title"/> + </hbox> + <box class="search-panel-one-offs-container"> + <hbox class="search-panel-one-offs" role="group"/> + <button class="searchbar-engine-one-off-item search-setting-button" tabindex="-1" data-l10n-id="search-one-offs-change-settings-compact-button"/> + </box> + <box> + <menupopup class="search-one-offs-context-menu"> + <menuitem class="search-one-offs-context-open-in-new-tab" data-l10n-id="search-one-offs-context-open-new-tab"/> + <menuitem class="search-one-offs-context-set-default" data-l10n-id="search-one-offs-context-set-as-default"/> + <menuitem class="search-one-offs-context-set-default-private" data-l10n-id="search-one-offs-context-set-as-default-private"/> + </menupopup> + </box> + ` + ) + ); + + this._popup = null; + this._textbox = null; + + this._textboxWidth = 0; + + /** + * Set this to a string that identifies your one-offs consumer. It'll + * be appended to telemetry recorded with maybeRecordTelemetry(). + */ + this.telemetryOrigin = ""; + + this._query = ""; + + this._selectedButton = null; + + this.buttons = this.querySelector(".search-panel-one-offs"); + + this.header = this.querySelector(".search-panel-one-offs-header"); + + this.settingsButton = this.querySelector(".search-setting-button"); + + this.contextMenuPopup = this.querySelector(".search-one-offs-context-menu"); + + this._engineInfo = null; + + /** + * `_rebuild()` is async, because it queries the Search Service, which means + * there is a potential for a race when it's called multiple times in succession. + */ + this._rebuilding = false; + + this.addEventListener("mousedown", this); + this.addEventListener("click", this); + this.addEventListener("command", this); + this.addEventListener("contextmenu", this); + + // Prevent popup events from the context menu from reaching the autocomplete + // binding (or other listeners). + let listener = aEvent => aEvent.stopPropagation(); + this.contextMenuPopup.addEventListener("popupshowing", listener); + this.contextMenuPopup.addEventListener("popuphiding", listener); + this.contextMenuPopup.addEventListener("popupshown", aEvent => { + aEvent.stopPropagation(); + }); + this.contextMenuPopup.addEventListener("popuphidden", aEvent => { + aEvent.stopPropagation(); + }); + + // Add weak referenced observers to invalidate our cached list of engines. + this.QueryInterface = ChromeUtils.generateQI([ + "nsIObserver", + "nsISupportsWeakReference", + ]); + Services.prefs.addObserver("browser.search.hiddenOneOffs", this, true); + Services.obs.addObserver(this, "browser-search-engine-modified", true); + Services.obs.addObserver(this, "browser-search-service", true); + + // Rebuild the buttons when the theme changes. See bug 1357800 for + // details. Summary: On Linux, switching between themes can cause a row + // of buttons to disappear. + Services.obs.addObserver(this, "lightweight-theme-changed", true); + + // This defaults to false in the Search Bar, subclasses can change their + // default in the constructor. + this.disableOneOffsHorizontalKeyNavigation = false; + } + + addEventListener(...args) { + this.container.addEventListener(...args); + } + + removeEventListener(...args) { + this.container.removeEventListener(...args); + } + + dispatchEvent(...args) { + this.container.dispatchEvent(...args); + } + + getAttribute(...args) { + return this.container.getAttribute(...args); + } + + hasAttribute(...args) { + return this.container.hasAttribute(...args); + } + + setAttribute(...args) { + this.container.setAttribute(...args); + } + + querySelector(...args) { + return this.container.querySelector(...args); + } + + handleEvent(event) { + let methodName = "_on_" + event.type; + if (methodName in this) { + this[methodName](event); + } else { + throw new Error("Unrecognized search-one-offs event: " + event.type); + } + } + + /** + * @returns {boolean} + * True if we will hide the one-offs when they are requested. + */ + async willHide() { + if (this._engineInfo?.willHide !== undefined) { + return this._engineInfo.willHide; + } + let engineInfo = await this.getEngineInfo(); + let oneOffCount = engineInfo.engines.length; + this._engineInfo.willHide = + !oneOffCount || + (oneOffCount == 1 && + engineInfo.engines[0].name == engineInfo.default.name); + return this._engineInfo.willHide; + } + + /** + * Invalidates the engine cache. After invalidating the cache, the one-offs + * will be rebuilt the next time they are shown. + */ + invalidateCache() { + if (!this._rebuilding) { + this._engineInfo = null; + } + } + + /** + * Width in pixels of the one-off buttons. + * NOTE: Used in browser/components/search/content/searchbar.js only. + * + * @returns {number} + */ + get buttonWidth() { + return 48; + } + + /** + * The popup that contains the one-offs. + * + * @param {DOMElement} val + * The new value to set. + */ + set popup(val) { + if (this._popup) { + this._popup.removeEventListener("popupshowing", this); + this._popup.removeEventListener("popuphidden", this); + } + if (val) { + val.addEventListener("popupshowing", this); + val.addEventListener("popuphidden", this); + } + this._popup = val; + + // If the popup is already open, rebuild the one-offs now. The + // popup may be opening, so check that the state is not closed + // instead of checking popupOpen. + if (val && val.state != "closed") { + this._rebuild(); + } + } + + get popup() { + return this._popup; + } + + /** + * The textbox associated with the one-offs. Set this to a textbox to + * automatically keep the related one-offs UI up to date. Otherwise you + * can leave it null/undefined, and in that case you should update the + * query property manually. + * + * @param {DOMElement} val + * The new value to set. + */ + set textbox(val) { + if (this._textbox) { + this._textbox.removeEventListener("input", this); + } + if (val) { + val.addEventListener("input", this); + } + this._textbox = val; + } + + get style() { + return this.container.style; + } + + get textbox() { + return this._textbox; + } + + /** + * The query string currently shown in the one-offs. If the textbox + * property is non-null, then this is automatically updated on + * input. + * + * @param {string} val + * The new query string to set. + */ + set query(val) { + this._query = val; + if (this.isViewOpen) { + let isOneOffSelected = + this.selectedButton && + this.selectedButton.classList.contains( + "searchbar-engine-one-off-item" + ) && + !( + this.selectedButton == this.settingsButton && + this.hasAttribute("is_searchbar") + ); + // Typing de-selects the settings or opensearch buttons at the bottom + // of the search panel, as typing shows the user intends to search. + if (this.selectedButton && !isOneOffSelected) { + this.selectedButton = null; + } + } + } + + get query() { + return this._query; + } + + /** + * The selected one-off, a xul:button, including the add-engine button + * and the search-settings button. + * + * @param {DOMElement|null} val + * The selected one-off button. Null if no one-off is selected. + */ + set selectedButton(val) { + let previousButton = this._selectedButton; + if (previousButton) { + previousButton.removeAttribute("selected"); + } + if (val) { + val.setAttribute("selected", "true"); + } + this._selectedButton = val; + + if (this.textbox) { + if (val) { + this.textbox.setAttribute("aria-activedescendant", val.id); + } else { + let active = this.textbox.getAttribute("aria-activedescendant"); + if (active && active.includes("-engine-one-off-item-")) { + this.textbox.removeAttribute("aria-activedescendant"); + } + } + } + + let event = new CustomEvent("SelectedOneOffButtonChanged", { + previousSelectedButton: previousButton, + }); + this.dispatchEvent(event); + } + + get selectedButton() { + return this._selectedButton; + } + + /** + * The index of the selected one-off, including the add-engine button + * and the search-settings button. + * + * @param {number} val + * The new index to set, -1 for nothing selected. + */ + set selectedButtonIndex(val) { + let buttons = this.getSelectableButtons(true); + this.selectedButton = buttons[val]; + } + + get selectedButtonIndex() { + let buttons = this.getSelectableButtons(true); + for (let i = 0; i < buttons.length; i++) { + if (buttons[i] == this._selectedButton) { + return i; + } + } + return -1; + } + + async getEngineInfo() { + if (this._engineInfo) { + return this._engineInfo; + } + + this._engineInfo = {}; + if (lazy.PrivateBrowsingUtils.isWindowPrivate(this.window)) { + this._engineInfo.default = await Services.search.getDefaultPrivate(); + } else { + this._engineInfo.default = await Services.search.getDefault(); + } + + let currentEngineNameToIgnore; + if (!this.getAttribute("includecurrentengine")) { + currentEngineNameToIgnore = this._engineInfo.default.name; + } + + let pref = Services.prefs.getStringPref("browser.search.hiddenOneOffs"); + let hiddenList = pref ? pref.split(",") : []; + + this._engineInfo.engines = ( + await Services.search.getVisibleEngines() + ).filter(e => { + let name = e.name; + return ( + (!currentEngineNameToIgnore || name != currentEngineNameToIgnore) && + !hiddenList.includes(name) + ); + }); + + return this._engineInfo; + } + + observe(aEngine, aTopic, aData) { + // Make sure the engine list was updated. + this.invalidateCache(); + } + + _getAddEngines() { + return this.window.gBrowser.selectedBrowser.engines || EMPTY_ADD_ENGINES; + } + + get _maxInlineAddEngines() { + return 3; + } + + /** + * Infallible, non-re-entrant version of `__rebuild()`. + */ + async _rebuild() { + if (this._rebuilding) { + return; + } + + this._rebuilding = true; + try { + await this.__rebuild(); + } catch (ex) { + console.error("Search-one-offs::_rebuild() error: " + ex); + } finally { + this._rebuilding = false; + } + } + + /** + * Builds all the UI. + */ + async __rebuild() { + // Return early if the list of engines has not changed. + if (!this.popup && this._engineInfo?.domWasUpdated) { + return; + } + + const addEngines = this._getAddEngines(); + + // Return early if the engines and panel width have not changed. + if (this.popup && this._textbox) { + let textboxWidth = await this.window.promiseDocumentFlushed(() => { + return this._textbox.clientWidth; + }); + + if ( + this._engineInfo?.domWasUpdated && + this._textboxWidth == textboxWidth && + this._addEngines == addEngines + ) { + return; + } + this._textboxWidth = textboxWidth; + this._addEngines = addEngines; + } + + const isSearchBar = this.hasAttribute("is_searchbar"); + if (isSearchBar) { + // Hide the container during updating to avoid flickering. + this.container.hidden = true; + } + + // Finally, build the list of one-off buttons. + while (this.buttons.firstElementChild) { + this.buttons.firstElementChild.remove(); + } + + let headerText = this.header.querySelector( + ".search-panel-one-offs-header-label" + ); + headerText.id = this.telemetryOrigin + "-one-offs-header-label"; + this.buttons.setAttribute("aria-labelledby", headerText.id); + + // For the search-bar, always show the one-off buttons where there is an + // option to add an engine. + let addEngineNeeded = isSearchBar && addEngines.length; + let hideOneOffs = (await this.willHide()) && !addEngineNeeded; + + // The _engineInfo cache is used by more consumers, thus it is not a good + // representation of whether this method already updated the one-off buttons + // DOM. For this reason we introduce a separate flag tracking the DOM + // updating, and use it to know when it's okay to not rebuild the one-offs. + // We set this early, since we might either rebuild the DOM or hide it. + this._engineInfo.domWasUpdated = true; + + this.container.hidden = hideOneOffs; + + if (hideOneOffs) { + return; + } + + // Ensure we can refer to the settings buttons by ID: + let origin = this.telemetryOrigin; + this.settingsButton.id = origin + "-anon-search-settings"; + + let engines = (await this.getEngineInfo()).engines; + this._rebuildEngineList(engines, addEngines); + + this.dispatchEvent(new Event("rebuild")); + } + + /** + * Adds one-offs for the given engines to the DOM. + * + * @param {Array} engines + * The engines to add. + * @param {Array} addEngines + * The engines that can be added. + */ + _rebuildEngineList(engines, addEngines) { + for (let i = 0; i < engines.length; ++i) { + let engine = engines[i]; + let button = this.document.createXULElement("button"); + button.engine = engine; + button.id = this._buttonIDForEngine(engine); + let iconURI = + engine.iconURI?.spec || + "chrome://browser/skin/search-engine-placeholder.png"; + button.setAttribute("image", iconURI); + button.setAttribute("class", "searchbar-engine-one-off-item"); + button.setAttribute("tabindex", "-1"); + this.setTooltipForEngineButton(button); + this.buttons.appendChild(button); + } + + for ( + let i = 0, len = Math.min(addEngines.length, this._maxInlineAddEngines); + i < len; + i++ + ) { + const engine = addEngines[i]; + const button = this.document.createXULElement("button"); + button.id = this._buttonIDForEngine(engine); + button.classList.add("searchbar-engine-one-off-item"); + button.classList.add("searchbar-engine-one-off-add-engine"); + button.setAttribute("tabindex", "-1"); + if (engine.icon) { + button.setAttribute("image", engine.icon); + } + button.setAttribute("data-l10n-id", "search-one-offs-add-engine"); + button.setAttribute( + "data-l10n-args", + JSON.stringify({ engineName: engine.title }) + ); + button.setAttribute("engine-name", engine.title); + button.setAttribute("uri", engine.uri); + this.buttons.appendChild(button); + } + } + + _buttonIDForEngine(engine) { + return ( + this.telemetryOrigin + + "-engine-one-off-item-engine-" + + this._engineInfo.engines.indexOf(engine) + ); + } + + getSelectableButtons(aIncludeNonEngineButtons) { + const buttons = [ + ...this.buttons.querySelectorAll(".searchbar-engine-one-off-item"), + ]; + + if (aIncludeNonEngineButtons) { + buttons.push(this.settingsButton); + } + + return buttons; + } + + /** + * Returns information on where a search results page should be loaded: in the + * current tab or a new tab. + * + * @param {event} aEvent + * The event that triggered the page load. + * @param {boolean} [aForceNewTab] + * True to force the load in a new tab. + * @returns {object} An object { where, params }. `where` is a string: + * "current" or "tab". `params` is an object further describing how + * the page should be loaded. + */ + _whereToOpen(aEvent, aForceNewTab = false) { + let where = "current"; + let params; + // Open ctrl/cmd clicks on one-off buttons in a new background tab. + if (aForceNewTab) { + where = "tab"; + if (Services.prefs.getBoolPref("browser.tabs.loadInBackground")) { + params = { + inBackground: true, + }; + } + } else { + let newTabPref = Services.prefs.getBoolPref("browser.search.openintab"); + if ( + (KeyboardEvent.isInstance(aEvent) && aEvent.altKey) ^ newTabPref && + !this.window.gBrowser.selectedTab.isEmpty + ) { + where = "tab"; + } + if ( + MouseEvent.isInstance(aEvent) && + (aEvent.button == 1 || aEvent.getModifierState("Accel")) + ) { + where = "tab"; + params = { + inBackground: true, + }; + } + } + + return { where, params }; + } + + /** + * Increments or decrements the index of the currently selected one-off. + * + * @param {boolean} aForward + * If true, the index is incremented, and if false, the index is + * decremented. + * @param {boolean} aIncludeNonEngineButtons + * If true, buttons that do not have engines are included. + * These buttons include the OpenSearch and settings buttons. For + * example, if the currently selected button is an engine button, + * the next button is the settings button, and you pass true for + * aForward, then passing true for this value would cause the + * settings to be selected. Passing false for this value would + * cause the selection to clear or wrap around, depending on what + * value you passed for the aWrapAround parameter. + * @param {boolean} aWrapAround + * If true, the selection wraps around between the first and last + * buttons. + */ + advanceSelection(aForward, aIncludeNonEngineButtons, aWrapAround) { + let buttons = this.getSelectableButtons(aIncludeNonEngineButtons); + let index; + if (this.selectedButton) { + let inc = aForward ? 1 : -1; + let oldIndex = buttons.indexOf(this.selectedButton); + index = (oldIndex + inc + buttons.length) % buttons.length; + if ( + !aWrapAround && + ((aForward && index <= oldIndex) || (!aForward && oldIndex <= index)) + ) { + // The index has wrapped around, but wrapping around isn't + // allowed. + index = -1; + } + } else { + index = aForward ? 0 : buttons.length - 1; + } + this.selectedButton = index < 0 ? null : buttons[index]; + } + + /** + * This handles key presses specific to the one-off buttons like Tab and + * Alt+Up/Down, and Up/Down keys within the buttons. Since one-off buttons + * are always used in conjunction with a list of some sort (in this.popup), + * it also handles Up/Down keys that cross the boundaries between list + * items and the one-off buttons. + * + * If this method handles the key press, then it will call + * event.preventDefault() and return true. + * + * @param {Event} event + * The key event. + * @param {number} numListItems + * The number of items in the list. The reason that this is a + * parameter at all is that the list may contain items at the end + * that should be ignored, depending on the consumer. That's true + * for the urlbar for example. + * @param {boolean} allowEmptySelection + * Pass true if it's OK that neither the list nor the one-off + * buttons contains a selection. Pass false if either the list or + * the one-off buttons (or both) should always contain a selection. + * @param {string} [textboxUserValue] + * When the last list item is selected and the user presses Down, + * the first one-off becomes selected and the textbox value is + * restored to the value that the user typed. Pass that value here. + * However, if you pass true for allowEmptySelection, you don't need + * to pass anything for this parameter. (Pass undefined or null.) + * @returns {boolean} True if the one-offs handled the key press. + */ + handleKeyDown(event, numListItems, allowEmptySelection, textboxUserValue) { + if (!this.hasView) { + return false; + } + let handled = this._handleKeyDown( + event, + numListItems, + allowEmptySelection, + textboxUserValue + ); + if (handled) { + event.preventDefault(); + event.stopPropagation(); + } + return handled; + } + + _handleKeyDown(event, numListItems, allowEmptySelection, textboxUserValue) { + if (this.container.hidden) { + return false; + } + if ( + event.keyCode == KeyEvent.DOM_VK_RIGHT && + this.selectedButton && + this.selectedButton.classList.contains("addengine-menu-button") + ) { + // If the add-engine overflow menu item is selected and the user + // presses the right arrow key, open the submenu. Unfortunately + // handling the left arrow key -- to close the popup -- isn't + // straightforward. Once the popup is open, it consumes all key + // events. Setting ignorekeys=handled on it doesn't help, since the + // popup handles all arrow keys. Setting ignorekeys=true on it does + // mean that the popup no longer consumes the left arrow key, but + // then it no longer handles up/down keys to select items in the + // popup. + this.selectedButton.open = true; + return true; + } + + // Handle the Tab key, but only if non-Shift modifiers aren't also + // pressed to avoid clobbering other shortcuts (like the Alt+Tab + // browser tab switcher). The reason this uses getModifierState() and + // checks for "AltGraph" is that when you press Shift-Alt-Tab, + // event.altKey is actually false for some reason, at least on macOS. + // getModifierState("Alt") is also false, but "AltGraph" is true. + if ( + event.keyCode == KeyEvent.DOM_VK_TAB && + !event.getModifierState("Alt") && + !event.getModifierState("AltGraph") && + !event.getModifierState("Control") && + !event.getModifierState("Meta") + ) { + if ( + this.getAttribute("disabletab") == "true" || + (event.shiftKey && this.selectedButtonIndex <= 0) || + (!event.shiftKey && + this.selectedButtonIndex == + this.getSelectableButtons(true).length - 1) + ) { + this.selectedButton = null; + return false; + } + this.selectedViewIndex = -1; + this.advanceSelection(!event.shiftKey, true, false); + return !!this.selectedButton; + } + + if (event.keyCode == KeyboardEvent.DOM_VK_UP) { + if (event.altKey) { + // Keep the currently selected result in the list (if any) as a + // secondary "alt" selection and move the selection up within the + // buttons. + this.advanceSelection(false, false, false); + return true; + } + if (numListItems == 0) { + this.advanceSelection(false, true, false); + return true; + } + if (this.selectedViewIndex > 0) { + // Moving up within the list. The autocomplete controller should + // handle this case. A button may be selected, so null it. + this.selectedButton = null; + return false; + } + if (this.selectedViewIndex == 0) { + // Moving up from the top of the list. + if (allowEmptySelection) { + // Let the autocomplete controller remove selection in the list + // and revert the typed text in the textbox. + return false; + } + // Wrap selection around to the last button. + if (this.textbox && typeof textboxUserValue == "string") { + this.textbox.value = textboxUserValue; + } + this.selectedViewIndex = -1; + this.advanceSelection(false, true, true); + return true; + } + if (!this.selectedButton) { + // Moving up from no selection in the list or the buttons, back + // down to the last button. + this.advanceSelection(false, true, true); + return true; + } + if (this.selectedButtonIndex == 0) { + // Moving up from the buttons to the bottom of the list. + this.selectedButton = null; + return false; + } + // Moving up/left within the buttons. + this.advanceSelection(false, true, false); + return true; + } + + if (event.keyCode == KeyboardEvent.DOM_VK_DOWN) { + if (event.altKey) { + // Keep the currently selected result in the list (if any) as a + // secondary "alt" selection and move the selection down within + // the buttons. + this.advanceSelection(true, false, false); + return true; + } + if (numListItems == 0) { + this.advanceSelection(true, true, false); + return true; + } + if ( + this.selectedViewIndex >= 0 && + this.selectedViewIndex < numListItems - 1 + ) { + // Moving down within the list. The autocomplete controller + // should handle this case. A button may be selected, so null it. + this.selectedButton = null; + return false; + } + if (this.selectedViewIndex == numListItems - 1) { + // Moving down from the last item in the list to the buttons. + if (!allowEmptySelection) { + this.selectedViewIndex = -1; + if (this.textbox && typeof textboxUserValue == "string") { + this.textbox.value = textboxUserValue; + } + } + this.selectedButtonIndex = 0; + if (allowEmptySelection) { + // Let the autocomplete controller remove selection in the list + // and revert the typed text in the textbox. + return false; + } + return true; + } + if (this.selectedButton) { + let buttons = this.getSelectableButtons(true); + if (this.selectedButtonIndex == buttons.length - 1) { + // Moving down from the buttons back up to the top of the list. + this.selectedButton = null; + if (allowEmptySelection) { + // Prevent the selection from wrapping around to the top of + // the list by returning true, since the list currently has no + // selection. Nothing should be selected after handling this + // Down key. + return true; + } + return false; + } + // Moving down/right within the buttons. + this.advanceSelection(true, true, false); + return true; + } + return false; + } + + if (event.keyCode == KeyboardEvent.DOM_VK_LEFT) { + if ( + this.selectedButton && + this.selectedButton.engine && + !this.disableOneOffsHorizontalKeyNavigation + ) { + // Moving left within the buttons. + this.advanceSelection(false, true, true); + return true; + } + return false; + } + + if (event.keyCode == KeyboardEvent.DOM_VK_RIGHT) { + if ( + this.selectedButton && + this.selectedButton.engine && + !this.disableOneOffsHorizontalKeyNavigation + ) { + // Moving right within the buttons. + this.advanceSelection(true, true, true); + return true; + } + return false; + } + + return false; + } + + /** + * Determines if the target of the event is a one-off button or + * context menu on a one-off button. + * + * @param {Event} event + * An event, like a click on a one-off button. + * @returns {boolean} True if telemetry was recorded and false if not. + */ + eventTargetIsAOneOff(event) { + if (!event) { + return false; + } + + let target = event.originalTarget; + + if (KeyboardEvent.isInstance(event) && this.selectedButton) { + return true; + } + if ( + MouseEvent.isInstance(event) && + target.classList.contains("searchbar-engine-one-off-item") + ) { + return true; + } + if ( + this.window.XULCommandEvent.isInstance(event) && + target.classList.contains("search-one-offs-context-open-in-new-tab") + ) { + return true; + } + + return false; + } + + // Methods for subclasses to override + + /** + * @returns {boolean} True if the one-offs are connected to a view. + */ + get hasView() { + return !!this.popup; + } + + /** + * @returns {boolean} True if the view is open. + */ + get isViewOpen() { + return this.popup && this.popup.popupOpen; + } + + /** + * @returns {number} The selected index in the view or -1 if no selection. + */ + get selectedViewIndex() { + return this.popup.selectedIndex; + } + + /** + * Sets the selected index in the view. + * + * @param {number} val + * The selected index or -1 if no selection. + */ + set selectedViewIndex(val) { + this.popup.selectedIndex = val; + } + + /** + * Closes the view. + */ + closeView() { + this.popup.hidePopup(); + } + + /** + * Called when a one-off is clicked or the "Search in New Tab" context menu + * item is picked. This is not called for the settings button. + * + * @param {event} event + * The event that triggered the pick. + * @param {nsISearchEngine|SearchEngine} engine + * The engine that was picked. + * @param {boolean} forceNewTab + * True if the search results page should be loaded in a new tab. + */ + handleSearchCommand(event, engine, forceNewTab = false) { + let { where, params } = this._whereToOpen(event, forceNewTab); + this.popup.handleOneOffSearch(event, engine, where, params); + } + + /** + * Sets the tooltip for a one-off button with an engine. This should set + * either the `tooltiptext` attribute or the relevant l10n ID. + * + * @param {element} button + * The one-off button. + */ + setTooltipForEngineButton(button) { + button.setAttribute("tooltiptext", button.engine.name); + } + + // Event handlers below. + + _on_mousedown(event) { + // This is necessary to prevent the input from losing focus and closing the + // popup. Unfortunately it also has the side effect of preventing the + // buttons from receiving the `:active` pseudo-class. + event.preventDefault(); + } + + _on_click(event) { + if (event.button == 2) { + return; // ignore right clicks. + } + + let button = event.originalTarget; + let engine = button.engine; + + if (!engine) { + return; + } + + // Select the clicked button so that consumers can easily tell which + // button was acted on. + this.selectedButton = button; + this.handleSearchCommand(event, engine); + } + + _on_command(event) { + let target = event.target; + + if (target == this.settingsButton) { + this.window.openPreferences("paneSearch"); + + // If the preference tab was already selected, the panel doesn't + // close itself automatically. + this.closeView(); + return; + } + + if (target.classList.contains("searchbar-engine-one-off-add-engine")) { + // On success, hide the panel and tell event listeners to reshow it to + // show the new engine. + lazy.SearchUIUtils.addOpenSearchEngine( + target.getAttribute("uri"), + target.getAttribute("image"), + this.window.gBrowser.selectedBrowser.browsingContext + ) + .then(result => { + if (result) { + this._rebuild(); + } + }) + .catch(console.error); + return; + } + + if (target.classList.contains("search-one-offs-context-open-in-new-tab")) { + // Select the context-clicked button so that consumers can easily + // tell which button was acted on. + this.selectedButton = target.closest("menupopup")._triggerButton; + this.handleSearchCommand(event, this.selectedButton.engine, true); + } + + const isPrivateButton = target.classList.contains( + "search-one-offs-context-set-default-private" + ); + if ( + target.classList.contains("search-one-offs-context-set-default") || + isPrivateButton + ) { + const engineType = isPrivateButton + ? "defaultPrivateEngine" + : "defaultEngine"; + let currentEngine = Services.search[engineType]; + + const isPrivateWin = lazy.PrivateBrowsingUtils.isWindowPrivate( + this.window + ); + let button = target.closest("menupopup")._triggerButton; + // We're about to replace this, so it must be stored now. + let newDefaultEngine = button.engine; + if ( + !this.getAttribute("includecurrentengine") && + isPrivateButton == isPrivateWin + ) { + // Make the target button of the context menu reflect the current + // search engine first. Doing this as opposed to rebuilding all the + // one-off buttons avoids flicker. + let uri = "chrome://browser/skin/search-engine-placeholder.png"; + if (currentEngine.iconURI) { + uri = currentEngine.iconURI.spec; + } + button.setAttribute("image", uri); + button.setAttribute("tooltiptext", currentEngine.name); + button.engine = currentEngine; + } + + if (isPrivateButton) { + Services.search.setDefaultPrivate( + newDefaultEngine, + Ci.nsISearchService.CHANGE_REASON_USER_SEARCHBAR_CONTEXT + ); + } else { + Services.search.setDefault( + newDefaultEngine, + Ci.nsISearchService.CHANGE_REASON_USER_SEARCHBAR_CONTEXT + ); + } + } + } + + _on_contextmenu(event) { + let target = event.originalTarget; + // Prevent the context menu from appearing except on the one off buttons. + if ( + !target.classList.contains("searchbar-engine-one-off-item") || + target.classList.contains("search-setting-button") + ) { + event.preventDefault(); + return; + } + this.contextMenuPopup + .querySelector(".search-one-offs-context-set-default") + .setAttribute( + "disabled", + target.engine == Services.search.defaultEngine.wrappedJSObject + ); + + const privateDefaultItem = this.contextMenuPopup.querySelector( + ".search-one-offs-context-set-default-private" + ); + + if ( + Services.prefs.getBoolPref( + "browser.search.separatePrivateDefault.ui.enabled", + false + ) && + Services.prefs.getBoolPref("browser.search.separatePrivateDefault", false) + ) { + privateDefaultItem.hidden = false; + privateDefaultItem.setAttribute( + "disabled", + target.engine == Services.search.defaultPrivateEngine.wrappedJSObject + ); + } else { + privateDefaultItem.hidden = true; + } + + // When a context menu is opened on a one-off button, this is set to the + // button to be used for the command. + this.contextMenuPopup._triggerButton = target; + this.contextMenuPopup.openPopupAtScreen(event.screenX, event.screenY, true); + event.preventDefault(); + } + + _on_input(event) { + // Allow the consumer's input to override its value property with + // a oneOffSearchQuery property. That way if the value is not + // actually what the user typed (e.g., it's autofilled, or it's a + // mozaction URI), the consumer has some way of providing it. + this.query = event.target.oneOffSearchQuery || event.target.value; + } + + _on_popupshowing() { + this._rebuild(); + } + + _on_popuphidden() { + this.selectedButton = null; + } +} |