Issue 1091 - Implement a better templating approach for Element Hiding Helper

lib/aardvark.js

Index: lib/aardvark.js
===================================================================
--- a/lib/aardvark.js
+++ b/lib/aardvark.js
@@ -7,16 +7,32 @@
 let {Prefs} = require("prefs");
 
 // Make sure to stop selection when we are uninstalled
 onShutdown.add(function() Aardvark.quit());
 
 // To be replaced when selection starts
 function E(id) {return null;}
 
+/*********************************
+ * Minimal element creation code *
+ *********************************/
+
+function createElement(doc, tagName, attrs, children)
+{
+  let el = doc.createElement(tagName);
+  if (attrs)
+    for (let key in attrs)
+      el.setAttribute(key, attrs[key]);
+  if (children)
+    for (let child of children)
+      el.appendChild(child)
+  return el;
+};
+
 /**********************************
  * General element selection code *
  **********************************/
 
 let Aardvark = exports.Aardvark =
 {
   window: null,
   browser: null,
@@ -51,17 +67,24 @@ let Aardvark = exports.Aardvark =
     this.browser.addEventListener("keypress", this.onKeyPress, true);
     this.browser.addEventListener("mousemove", this.onMouseMove, true);
     this.browser.addEventListener("select", this.quit, false);
     this.browser.contentWindow.addEventListener("pagehide", this.onPageHide, true);
 
     this.browser.contentWindow.focus();
 
     let doc = this.browser.contentDocument;
-    this.boxElem = doc.importNode(E("ehh-elementmarker").firstElementChild.cloneNode(true), true);
+    let {elementMarkerClass} = require("main");
+    this.boxElem = createElement(doc, "div", {"class": elementMarkerClass}, [
+      createElement(doc, "div", {"class": "ehh-border"}),
+      createElement(doc, "div", {"class": "ehh-label"}, [
+        createElement(doc, "span", {"class": "ehh-labelTag"}),
+        createElement(doc, "span", {"class": "ehh-labelAddition"})
+      ])
+    ]);
 
     this.initHelpBox();
 
     if (Prefs.showhelp)
       this.showMenu();
 
     // Make sure to select some element immeditely (whichever is in the center of the browser window)
     let [wndWidth, wndHeight] = this.getWindowSize(doc.defaultView);