michael@0: #ifdef 0
michael@0: /* This Source Code Form is subject to the terms of the Mozilla Public
michael@0:  * License, v. 2.0. If a copy of the MPL was not distributed with this file,
michael@0:  * You can obtain one at http://mozilla.org/MPL/2.0/. */
michael@0: #endif
michael@0: 
michael@0: let gSearch = {
michael@0: 
michael@0:   currentEngineName: null,
michael@0: 
michael@0:   init: function () {
michael@0:     for (let idSuffix of this._nodeIDSuffixes) {
michael@0:       this._nodes[idSuffix] =
michael@0:         document.getElementById("newtab-search-" + idSuffix);
michael@0:     }
michael@0: 
michael@0:     window.addEventListener("ContentSearchService", this);
michael@0:     this.setUpInitialState();
michael@0:   },
michael@0: 
michael@0:   setUpInitialState: function () {
michael@0:     this._send("GetState");
michael@0:   },
michael@0: 
michael@0:   showPanel: function () {
michael@0:     let panel = this._nodes.panel;
michael@0:     let logo = this._nodes.logo;
michael@0:     panel.openPopup(logo);
michael@0:     logo.setAttribute("active", "true");
michael@0:     panel.addEventListener("popuphidden", function onHidden() {
michael@0:       panel.removeEventListener("popuphidden", onHidden);
michael@0:       logo.removeAttribute("active");
michael@0:     });
michael@0:   },
michael@0: 
michael@0:   search: function (event) {
michael@0:     event.preventDefault();
michael@0:     let searchStr = this._nodes.text.value;
michael@0:     if (this.currentEngineName && searchStr.length) {
michael@0:       this._send("Search", {
michael@0:         engineName: this.currentEngineName,
michael@0:         searchString: searchStr,
michael@0:         whence: "newtab",
michael@0:       });
michael@0:     }
michael@0:   },
michael@0: 
michael@0:   manageEngines: function () {
michael@0:     this._nodes.panel.hidePopup();
michael@0:     this._send("ManageEngines");
michael@0:   },
michael@0: 
michael@0:   setWidth: function (width) {
michael@0:     this._nodes.form.style.width = width + "px";
michael@0:     this._nodes.form.style.maxWidth = width + "px";
michael@0:   },
michael@0: 
michael@0:   handleEvent: function (event) {
michael@0:     this["on" + event.detail.type](event.detail.data);
michael@0:   },
michael@0: 
michael@0:   onState: function (data) {
michael@0:     this._makePanel(data.engines);
michael@0:     this._setCurrentEngine(data.currentEngine);
michael@0:     this._initWhenInitalStateReceived();
michael@0:   },
michael@0: 
michael@0:   onCurrentEngine: function (engineName) {
michael@0:     this._setCurrentEngine(engineName);
michael@0:   },
michael@0: 
michael@0:   _nodeIDSuffixes: [
michael@0:     "form",
michael@0:     "logo",
michael@0:     "manage",
michael@0:     "panel",
michael@0:     "text",
michael@0:   ],
michael@0: 
michael@0:   _nodes: {},
michael@0: 
michael@0:   _initWhenInitalStateReceived: function () {
michael@0:     this._nodes.form.addEventListener("submit", e => this.search(e));
michael@0:     this._nodes.logo.addEventListener("click", e => this.showPanel());
michael@0:     this._nodes.manage.addEventListener("click", e => this.manageEngines());
michael@0:     this._initWhenInitalStateReceived = function () {};
michael@0:   },
michael@0: 
michael@0:   _send: function (type, data=null) {
michael@0:     window.dispatchEvent(new CustomEvent("ContentSearchClient", {
michael@0:       detail: {
michael@0:         type: type,
michael@0:         data: data,
michael@0:       },
michael@0:     }));
michael@0:   },
michael@0: 
michael@0:   _makePanel: function (engines) {
michael@0:     let panel = this._nodes.panel;
michael@0: 
michael@0:     // Empty the panel except for the Manage Engines row.
michael@0:     let i = 0;
michael@0:     while (i < panel.childNodes.length) {
michael@0:       let node = panel.childNodes[i];
michael@0:       if (node != this._nodes.manage) {
michael@0:         panel.removeChild(node);
michael@0:       }
michael@0:       else {
michael@0:         i++;
michael@0:       }
michael@0:     }
michael@0: 
michael@0:     // Add all the engines.
michael@0:     for (let engine of engines) {
michael@0:       panel.insertBefore(this._makePanelEngine(panel, engine),
michael@0:                          this._nodes.manage);
michael@0:     }
michael@0:   },
michael@0: 
michael@0:   _makePanelEngine: function (panel, engine) {
michael@0:     let box = document.createElementNS(XUL_NAMESPACE, "hbox");
michael@0:     box.className = "newtab-search-panel-engine";
michael@0:     box.setAttribute("engine", engine.name);
michael@0: 
michael@0:     box.addEventListener("click", () => {
michael@0:       this._send("SetCurrentEngine", engine.name);
michael@0:       panel.hidePopup();
michael@0:       this._nodes.text.focus();
michael@0:     });
michael@0: 
michael@0:     let image = document.createElementNS(XUL_NAMESPACE, "image");
michael@0:     if (engine.iconURI) {
michael@0:       image.setAttribute("src", engine.iconURI);
michael@0:     }
michael@0:     box.appendChild(image);
michael@0: 
michael@0:     let label = document.createElementNS(XUL_NAMESPACE, "label");
michael@0:     label.setAttribute("value", engine.name);
michael@0:     box.appendChild(label);
michael@0: 
michael@0:     return box;
michael@0:   },
michael@0: 
michael@0:   _setCurrentEngine: function (engine) {
michael@0:     this.currentEngineName = engine.name;
michael@0: 
michael@0:     // Set the logo.
michael@0:     let logoURI = window.devicePixelRatio == 2 ? engine.logo2xURI :
michael@0:                   engine.logoURI;
michael@0:     if (logoURI) {
michael@0:       this._nodes.logo.hidden = false;
michael@0:       this._nodes.logo.style.backgroundImage = "url(" + logoURI + ")";
michael@0:       this._nodes.text.placeholder = "";
michael@0:     }
michael@0:     else {
michael@0:       this._nodes.logo.hidden = true;
michael@0:       this._nodes.text.placeholder = engine.name;
michael@0:     }
michael@0: 
michael@0:     // Set the selected state of all the engines in the panel.
michael@0:     for (let box of this._nodes.panel.childNodes) {
michael@0:       if (box.getAttribute("engine") == engine.name) {
michael@0:         box.setAttribute("selected", "true");
michael@0:       }
michael@0:       else {
michael@0:         box.removeAttribute("selected");
michael@0:       }
michael@0:     }
michael@0:   },
michael@0: };