Added support for search localization

lib/providers/jsx.js

@@ -32,7 +32,7 @@ export default /* JSX */ {
    *
    * @param {string} tag - Tag name
    * @param {?Object} properties - Properties
-   * @param {Array<string | number | { __html?: string } | Array<HTMLElement>>}
+   * @param {Array<string | number | { __html: string } | Array<HTMLElement>>}
    *   children - Child nodes
    * @return {HTMLElement} Native DOM node
    */

material/base.html

@@ -151,7 +151,7 @@
       {% endblock %}
     </div>
     {% block scripts %}
-      <script src="{{ base_url }}/assets/javascripts/application-2b47141f13.js"></script>
+      <script src="{{ base_url }}/assets/javascripts/application-95c175e0e2.js"></script>
       <script>app.initialize({url:{base:"{{ base_url }}"}})</script>
       {% for path in extra_javascript %}
         <script src="{{ path }}"></script>

material/partials/language.html

@@ -5,6 +5,10 @@
   "meta.comments": "Comments",
   "meta.source": "Source",
   "search.placeholder": "Search",
+  "search.message.placeholder": "Type to start searching",
+  "search.message.none": "No matching documents",
+  "search.message.one": "1 matching document",
+  "search.message.other": "# matching documents",
   "source.link.title": "Go to repository",
   "toc.title": "Table of contents"
 }[key] }}{% endmacro %}

material/partials/search.html

@@ -8,7 +8,12 @@
     </form>
     <div class="md-search__output">
       <div class="md-search__scrollwrap" data-md-scrollfix>
-        <div class="md-search-result" data-md-component="result"></div>
+        <div class="md-search-result" data-md-component="result">
+          <div class="md-search-result__meta" data-md-message-none="{{ lang.t('search.message.none') }}" data-md-message-one="{{ lang.t('search.message.one') }}" data-md-message-other="{{ lang.t('search.message.other') }}">
+            {{ lang.t('search.message.placeholder') }}
+          </div>
+          <ol class="md-search-result__list"></ol>
+        </div>
       </div>
     </div>
   </div>

src/assets/javascripts/components/Material/Search/Result.jsx

@@ -38,6 +38,7 @@ export default class Result {
    * @property {Object} docs_ - Indexed documents
    * @property {HTMLElement} meta_ - Search meta information
    * @property {HTMLElement} list_ - Search result list
+   * @property {Object} message_ - Search result messages
    * @property {Object} index_ - Search index
    *
    * @param {(string|HTMLElement)} el - Selector or HTML element
@@ -51,20 +52,20 @@ export default class Result {
       throw new ReferenceError
     this.el_ = ref
 
-    /* Set data and create metadata and list elements */
+    /* Retrieve metadata and list element */
-    this.data_ = data
+    const [meta, list] = this.el_.children
-    this.meta_ = (
-      <div class="md-search-result__meta">
-        Type to start searching
-      </div>
-    )
-    this.list_ = (
-      <ol class="md-search-result__list"></ol>
-    )
 
-    /* Inject created elements */
+    /* Set data, metadata and list elements */
-    this.el_.appendChild(this.meta_)
+    this.data_ = data
-    this.el_.appendChild(this.list_)
+    this.meta_ = meta
+    this.list_ = list
+
+    /* Load messages for metadata display */
+    this.message_ = {
+      none: this.meta_.dataset.mdMessageNone,
+      one: this.meta_.dataset.mdMessageOne,
+      other: this.meta_.dataset.mdMessageOther
+    }
   }
 
   /**
@@ -236,8 +237,17 @@ export default class Result {
       })
 
       /* Update search metadata */
-      this.meta_.textContent =
+      switch (result.size) {
-        `${result.size} search result${result.size !== 1 ? "s" : ""}`           // TODO "20 references in 8 documents"
+        case 0:
+          this.meta_.textContent = this.message_.none
+          break
+        case 1:
+          this.meta_.textContent = this.message_.one
+          break
+        default:
+          this.meta_.textContent =
+            this.message_.other.replace("#", result.size)
+      }
     }
   }
 }

src/partials/language.html

@@ -28,6 +28,10 @@
   "meta.comments": "Comments",
   "meta.source": "Source",
   "search.placeholder": "Search",
+  "search.message.placeholder": "Type to start searching",
+  "search.message.none": "No matching documents",
+  "search.message.one": "1 matching document",
+  "search.message.other": "# matching documents",
   "source.link.title": "Go to repository",
   "toc.title": "Table of contents"
 }[key] }}{% endmacro %}

src/partials/search.html

@@ -35,7 +35,15 @@
     </form>
     <div class="md-search__output">
       <div class="md-search__scrollwrap" data-md-scrollfix>
-        <div class="md-search-result" data-md-component="result"></div>
+        <div class="md-search-result" data-md-component="result">
+          <div class="md-search-result__meta"
+              data-md-message-none="{{ lang.t('search.message.none') }}"
+              data-md-message-one="{{ lang.t('search.message.one') }}"
+              data-md-message-other="{{ lang.t('search.message.other') }}">
+            {{ lang.t('search.message.placeholder') }}
+          </div>
+          <ol class="md-search-result__list"></ol>
+        </div>
       </div>
     </div>
   </div>