From c23c3d81fb62208b17b3a85285d53548fcbecc19 Mon Sep 17 00:00:00 2001
From: EarthlingDavey <15802017+EarthlingDavey@users.noreply.github.com>
Date: Thu, 17 Oct 2024 15:55:36 +0100
Subject: [PATCH] Format files, add example template, and optimise code.

---
 .../clarity/src/globals/js/ajax-templating.js | 42 +++++++++++--------
 .../clarity/src/globals/js/ajax-utils.js      |  2 +-
 2 files changed, 25 insertions(+), 19 deletions(-)

diff --git a/public/app/themes/clarity/src/globals/js/ajax-templating.js b/public/app/themes/clarity/src/globals/js/ajax-templating.js
index 8df0fe418..3948056dc 100644
--- a/public/app/themes/clarity/src/globals/js/ajax-templating.js
+++ b/public/app/themes/clarity/src/globals/js/ajax-templating.js
@@ -5,11 +5,24 @@
  * @see https://stackoverflow.com/a/39065147/6671505
  *
  * @example
+ * Template:
+ * <script type="text/template" data-template="results-template">
+ *  <div class="result">
+ *    <h2>${title}</h2>
+ *    <p>${content}</p>
+ *    ${?imgSrc}
+ *      <img src="${imgSrc}" alt="${title}" />
+ *    ${/?imgSrc}
+ * </div>
+ *
+ * Implementation:
  * const template = new AjaxTemplating("results-template");
  * const html = template.renderHtml({
  *  title: "Hello World",
- *  content: "This is a test."
+ *  content: "This is a test.",
+ *  imgSrc: "https://example.com/image.jpg",
  * });
+ *
  */
 
 export default class AjaxTemplating {
@@ -19,23 +32,16 @@ export default class AjaxTemplating {
    * @param {string} templateName
    */
   constructor(templateName) {
-    this.resultsTemplate = this.loadTemplate(templateName);
-  }
-
-  /**
-   * Load the template from the DOM.
-   *
-   * Returns an array of strings where:
-   * - every odd index is a template variable
-   * - every even is a string of html text
-   *
-   * @param {string} templateName
-   * @returns {string[]}
-   */
-
-  loadTemplate(templateName) {
-    // do this without jQuery
-    return document
+    /**
+     * The template from the DOM.
+     *
+     * An array of strings where:
+     * - every odd index is a template variable
+     * - every even is a string of html text
+     *
+     * @type {string[]}
+     */
+    this.resultsTemplate = document
       .querySelector(`script[data-template="${templateName}"]`)
       .textContent.split(/\$\{(.+?)\}/g);
   }
diff --git a/public/app/themes/clarity/src/globals/js/ajax-utils.js b/public/app/themes/clarity/src/globals/js/ajax-utils.js
index 9b6fea528..4d2fa42d6 100644
--- a/public/app/themes/clarity/src/globals/js/ajax-utils.js
+++ b/public/app/themes/clarity/src/globals/js/ajax-utils.js
@@ -96,7 +96,7 @@ export const renderResults = ({
   // If we are on a page greater than 1, focus on the first new result.
   if (currentPage > 1) {
     const index = (currentPage - 1) * resultsPerPage;
-    $("#content").children().eq(index).find('div.content a').focus();
+    $("#content").children().eq(index).find("div.content a").focus();
   }
 };