Bug 1515309 - Scriptify query-explanation binding. r=mkmelin
authorArshad Khan <arshdkhn1@gmail.com>
Wed, 19 Dec 2018 15:34:32 +0530
changeset 34055 2c3b0e1ad6a2448285b7a2d9361ebae2515c0de9
parent 34054 4b4b0e0cbb003a50dc8a451f5832e5cac617a497
child 34056 9bbe95da846a2a80c812edc15ebc65d29156bd0d
push id389
push userclokep@gmail.com
push dateMon, 18 Mar 2019 19:01:53 +0000
reviewersmkmelin
bugs1515309
Bug 1515309 - Scriptify query-explanation binding. r=mkmelin
mail/base/content/glodaFacetBindings.css
mail/base/content/glodaFacetBindings.xml
mail/base/content/glodaFacetView.js
--- a/mail/base/content/glodaFacetBindings.css
+++ b/mail/base/content/glodaFacetBindings.css
@@ -1,16 +1,12 @@
 /* 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/. */
 
-#query-explanation {
-  -moz-binding: url('chrome://messenger/content/glodaFacetBindings.xml#query-explanation');
-}
-
 .facets {
   -moz-binding: url('chrome://messenger/content/glodaFacetBindings.xml#facets');
 }
 
 .facetious[type="discrete"] {
   -moz-binding: url('chrome://messenger/content/glodaFacetBindings.xml#facet-discrete');
 }
 
--- a/mail/base/content/glodaFacetBindings.xml
+++ b/mail/base/content/glodaFacetBindings.xml
@@ -7,104 +7,16 @@
 
 <bindings id="glodaFacetBindings"
           xmlns="http://www.mozilla.org/xbl"
           xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
           xmlns:html="http://www.w3.org/1999/xhtml"
           xmlns:xbl="http://www.mozilla.org/xbl"
           xmlns:svg="http://www.w3.org/2000/svg">
 
-<!-- ===== Constraints ===== -->
-
-<binding id="query-explanation">
-  <content>
-  </content>
-  <implementation>
-    <constructor><![CDATA[
-      ChromeUtils.import("resource:///modules/MailServices.jsm");
-    ]]></constructor>
-    <!-- Indicate that we are based on a fulltext search-->
-    <method name="setFulltext">
-      <parameter name="aMsgSearcher" />
-      <body><![CDATA[
-        while (this.hasChildNodes())
-          this.lastChild.remove();
-
-        let dis = this;
-        let spanify = function(aText, aClass) {
-          let span = document.createElement("span");
-          span.setAttribute("class", aClass);
-          span.textContent = aText;
-          dis.appendChild(span);
-          return span;
-        };
-
-        let searchLabel = glodaFacetStrings.get(
-          "glodaFacetView.search.label");
-        spanify(searchLabel, "explanation-fulltext-label");
-
-        let criteriaText = glodaFacetStrings.get(
-          "glodaFacetView.constraints.query.fulltext." +
-          (aMsgSearcher.andTerms ? "and" : "or") + "JoinWord");
-        for (let [iTerm, term] of aMsgSearcher.fulltextTerms.entries()) {
-          if (iTerm)
-            spanify(criteriaText, "explanation-fulltext-criteria");
-          spanify(term, "explanation-fulltext-term");
-        }
-      ]]></body>
-    </method>
-    <method name="setQuery">
-      <parameter name="aMsgQuery" />
-      <body><![CDATA[
-      try {
-        while (this.hasChildNodes())
-          this.lastChild.remove();
-
-        let dis = this;
-        let spanify = function(aText, aClass) {
-          let span = document.createElement("span");
-          span.setAttribute("class", aClass);
-          span.textContent = aText;
-          dis.appendChild(span);
-          return span;
-        };
-
-        let label = glodaFacetStrings.get(
-          "glodaFacetView.search.label");
-        spanify(label, "explanation-query-label");
-
-        let constraintStrings = [];
-        for (let constraint of aMsgQuery._constraints) {
-          if (constraint[0] != 1) return; // no idea what this is about
-          if (constraint[1].attributeName == "involves") {
-            let involvesLabel = glodaFacetStrings.get(
-              "glodaFacetView.constraints.query.involves.label");
-            involvesLabel = involvesLabel.replace("#1", constraint[2].value);
-            spanify(involvesLabel, "explanation-query-involves");
-          } else if (constraint[1].attributeName == "tag") {
-            let tagLabel = glodaFacetStrings.get(
-              "glodaFacetView.constraints.query.tagged.label");
-            let tag = constraint[2];
-            let tagNode = document.createElement("span");
-            let colorClass = "blc-" + MailServices.tags.getColorForKey(tag.key).substr(1);
-            tagNode.setAttribute("class", "message-tag tag " + colorClass);
-            tagNode.textContent = tag.tag;
-            spanify(tagLabel, "explanation-query-tagged");
-            this.appendChild(tagNode);
-          }
-        }
-        label = label + constraintStrings.join(", "); // XXX l10n?
-      } catch (e) {
-        logException(e);
-      }
-      ]]></body>
-    </method>
-  </implementation>
-</binding>
-
 <!-- ===== Facets ===== -->
 
 <binding id="facets">
   <content>
   </content>
   <implementation>
     <method name="clearFacets">
       <body><![CDATA[
--- a/mail/base/content/glodaFacetView.js
+++ b/mail/base/content/glodaFacetView.js
@@ -11,31 +11,111 @@
  *  push as much of it into mailnews/db/gloda/facet.js.  In some cases we may
  *  get it wrong and it may eventually want to migrate.
  */
 
 var { Log4Moz } = ChromeUtils.import("resource:///modules/gloda/log4moz.js", null);
 ChromeUtils.import("resource:///modules/StringBundle.js");
 ChromeUtils.import("resource://gre/modules/PluralForm.jsm");
 ChromeUtils.import("resource://gre/modules/Services.jsm");
+ChromeUtils.import("resource:///modules/MailServices.jsm");
 var {
   logObject,
   logException,
 } = ChromeUtils.import("resource:///modules/errUtils.js", null);
 
 var { Gloda } = ChromeUtils.import("resource:///modules/gloda/public.js", null);
 var {
   FacetDriver,
   FacetUtils,
 } = ChromeUtils.import("resource:///modules/gloda/facet.js", null);
 
 var glodaFacetStrings =
   new StringBundle("chrome://messenger/locale/glodaFacetView.properties");
 
 /**
+ * Object containing query-explanantion binding methods.
+ */
+const QueryExplanation = {
+  get node() {
+    return document.getElementById("query-explanation");
+  },
+  /**
+   * Indicate that we are based on a fulltext search
+   */
+  setFulltext(aMsgSearcher) {
+    while (this.node.hasChildNodes()) {
+      this.node.lastChild.remove();
+    }
+
+    const spanify = (text, classNames) => {
+      const span = document.createElement("span");
+      span.setAttribute("class", classNames);
+      span.textContent = text;
+      this.node.appendChild(span);
+      return span;
+    };
+
+    const searchLabel = glodaFacetStrings.get("glodaFacetView.search.label");
+    spanify(searchLabel, "explanation-fulltext-label");
+
+    const criteriaText = glodaFacetStrings.get(
+      "glodaFacetView.constraints.query.fulltext." +
+      (aMsgSearcher.andTerms ? "and" : "or") + "JoinWord");
+    for (let [iTerm, term] of aMsgSearcher.fulltextTerms.entries()) {
+      if (iTerm)
+        spanify(criteriaText, "explanation-fulltext-criteria");
+      spanify(term, "explanation-fulltext-term");
+    }
+  },
+  setQuery(msgQuery) {
+    try {
+      while (this.node.hasChildNodes()) {
+        this.node.lastChild.remove();
+      }
+
+      const spanify = (text, classNames) => {
+        const span = document.createElement("span");
+        span.setAttribute("class", classNames);
+        span.textContent = text;
+        this.node.appendChild(span);
+        return span;
+      };
+
+      let label = glodaFacetStrings.get("glodaFacetView.search.label");
+      spanify(label, "explanation-query-label");
+
+      let constraintStrings = [];
+      for (let constraint of msgQuery._constraints) {
+        if (constraint[0] != 1) return; // no idea what this is about
+        if (constraint[1].attributeName == "involves") {
+          let involvesLabel = glodaFacetStrings.get(
+            "glodaFacetView.constraints.query.involves.label");
+          involvesLabel = involvesLabel.replace("#1", constraint[2].value);
+          spanify(involvesLabel, "explanation-query-involves");
+        } else if (constraint[1].attributeName == "tag") {
+          const tagLabel = glodaFacetStrings.get(
+            "glodaFacetView.constraints.query.tagged.label");
+          const tag = constraint[2];
+          const tagNode = document.createElement("span");
+          const colorClass = "blc-" + MailServices.tags.getColorForKey(tag.key).substr(1);
+          tagNode.setAttribute("class", "message-tag tag " + colorClass);
+          tagNode.textContent = tag.tag;
+          spanify(tagLabel, "explanation-query-tagged");
+          this.node.appendChild(tagNode);
+        }
+      }
+      label = label + constraintStrings.join(", "); // XXX l10n?
+    } catch (e) {
+      logException(e);
+    }
+  },
+};
+
+/**
  * Represents the active constraints on a singular facet.  Singular facets can
  *  only have an inclusive set or an exclusive set, but not both.  Non-singular
  *  facets can have both.  Because they are different worlds, non-singular gets
  *  its own class, |ActiveNonSingularConstraint|.
  */
 function ActiveSingularConstraint(aFaceter, aRanged) {
   this.faceter = aFaceter;
   this.attrDef = aFaceter.attrDef;
@@ -346,21 +426,20 @@ var FacetContext = {
     scoredItems.sort((a, b) => b[0] - a[0]);
     this._relevantSortedItems = scoredItems.map(scoredItem => scoredItem[1]);
 
     this._dateSortedItems =
       this._relevantSortedItems.concat().sort((a, b) => b.date - a.date);
   },
 
   initialBuild() {
-    let queryExplanation = document.getElementById("query-explanation");
     if (this.searcher)
-      queryExplanation.setFulltext(this.searcher);
+      QueryExplanation.setFulltext(this.searcher);
     else
-      queryExplanation.setQuery(this.collection.query);
+      QueryExplanation.setQuery(this.collection.query);
     // we like to sort them so should clone the list
     this.faceters = this.facetDriver.faceters.concat();
 
     this._timelineShown = !Services.prefs.getBoolPref("gloda.facetview.hidetimeline");
 
     this.everFaceted = false;
     this._activeConstraints = {};
     if (this.searcher)