Move completion indicators to CSS class. Provide current/default :sty/:hi CSS completions. Et cetera.

content/bookmarks.js

@@ -582,9 +582,7 @@ function History() //{{{
     ////////////////////// PRIVATE SECTION /////////////////////////////////////////
     /////////////////////////////////////////////////////////////////////////////{{{
 
-    const historyService = Components.classes["@mozilla.org/browser/nav-history-service;1"]
+    const historyService = PlacesUtils.history;
-                                     .getService(Components.interfaces.nsINavHistoryService);
-
 
     /////////////////////////////////////////////////////////////////////////////}}}
     ////////////////////// MAPPINGS ////////////////////////////////////////////////

content/editor.js

@@ -1087,6 +1087,8 @@ function Editor() //{{{
         expandAbbreviation: function (filter) // try to find an candidate and replace accordingly
         {
             var textbox   = getEditor();
+            if (!textbox)
+                return;
             var text      = textbox.value;
             var currStart = textbox.selectionStart;
             var currEnd   = textbox.selectionEnd;

content/style.js

@@ -29,6 +29,7 @@ function Highlights(name, store, serial)
 
 
         CompTitle          color: magenta; background: white; font-weight: bold;
+        CompTitle>*        border-bottom: 1px dashed magenta;
         CompItem
         CompItem[selected] background: yellow;
         CompItem>*         padding: 0 .5ex;
@@ -36,6 +37,10 @@ function Highlights(name, store, serial)
         CompIcon>img       max-width: 16px; max-height: 16px; vertical-align: middle;
         CompResult         width: 45%; overflow: hidden;
         CompDesc           color: gray; width: 50%;
+        CompLess           text-align: center; height: .5ex; line-height: .5ex;
+        CompLess:after     content: "\2303"
+        CompMore           text-align: center; height: .5ex; line-height: .5ex; padding-bottom: 1ex;
+        CompMore:after     content: "\2304"
 
         Indicator   color: blue;
         Filter      font-weight: bold;
@@ -129,9 +134,10 @@ function Highlights(name, store, serial)
         css = style.selector + " { " + css + " }";
 
         let error = styles.addSheet(style.selector, style.filter, css, true, force);
-        if (!error)
+        if (error)
-            style.value = newStyle;
             return error;
+        style.value = newStyle;
+        highlight[style.class] = style;
     }
 
     highlightCSS.replace(/\{((?:.|\n)*?)\}/g, function (_, _1) _1.replace(/\n\s*/g, " "))
@@ -440,6 +446,12 @@ liberator.registerObserver("load_commands", function ()
                     catch (e) {}
                     context.completions = compl.concat([[s, ""] for each (s in styles.sites)])
                 }
+                else if (args.completeArg == 1)
+                {
+                    let sheet = styles.findSheets(args["-name"], null, null, null, false)[0];
+                    if (sheet)
+                        context.completions = [[sheet.css, "Current Value"]];
+                }
             },
             hereDoc: true,
             literal: true,
@@ -507,6 +519,12 @@ liberator.registerObserver("load_commands", function ()
             {
                 if (args.completeArg == 0)
                     context.completions = [[v.class, ""] for (v in highlight)];
+                else if (args.completeArg == 1)
+                {
+                    let hl = highlight.get(args.arguments[0]);
+                    if (hl)
+                        context.completions = [[hl.value, "Current Value"], [hl.default || "", "Default Value"]];
+                }
             },
             hereDoc: true,
             literal: true,

content/template.js

@@ -48,10 +48,10 @@ const template = {
             var desc = this.process[1].call(this, item, this.getKey(item, "description"));
         }
 
-        return <ul class={class || "hl-CompItem"}>
+        return <div class={class || "hl-CompItem"}>
-                   <li class="hl-CompResult">{text}</li>
+                   <li class="hl-CompResult">{text}&#160;</li>
-                   <li class="hl-CompDesc">{desc}</li>
+                   <li class="hl-CompDesc">{desc}&#160;</li>
-               </ul>;
+               </div>;
     },
 
     bookmarkDescription: function (item, text)
@@ -147,7 +147,7 @@ const template = {
     {
         return this.highlightSubstrings(str, (function ()
         {
-            while (res = re.exec(str) && res[0].length)
+            while ((res = re.exec(str)) && res[0].length)
                 yield [res.index, res[0].length];
         })(), highlight || template.filter);
     },

content/ui.js

@@ -1281,7 +1281,7 @@ function ItemList(id) //{{{
         return;
     }
 
-    function dom(xml) util.xmlToDom(xml, doc);
+    function dom(xml, map) util.xmlToDom(xml, doc, map);
     function elemToString(elem) elem.nodeType == elem.TEXT_NODE ? elem.data :
         "<" + [elem.localName].concat([a.name + "=" + a.value.quote() for (a in util.Array.iterator(elem.attributes))]).join(" ") + ">";
     var doc = iframe.contentDocument;
@@ -1295,15 +1295,14 @@ function ItemList(id) //{{{
     var endIndex = -1;    // The index one *after* the last displayed item
     var selIndex = -1;    // The index of the currently selected element
     var div = null;
-    var noCompletions = null;
+    var divNodes = {};
-    var completionBody = null;
     var minHeight = 0;
 
     function autoSize()
     {
         if (container.collapsed)
             div.style.minWidth = document.getElementById("liberator-commandline").scrollWidth + "px";
-        minHeight = Math.max(minHeight, completionBody.getBoundingClientRect().bottom);
+        minHeight = Math.max(minHeight, divNodes.completions.getBoundingClientRect().bottom);
         container.height = minHeight;
         div.style.minWidth = undefined;
         // FIXME: Belongs elsewhere.
@@ -1316,18 +1315,15 @@ function ItemList(id) //{{{
     {
         div = dom(
             <div class="ex-command-output hl-Normal" style="white-space: nowrap">
-                <div class="hl-Completions"><span class="hl-Title">No Completions</span></div>
+                <div class="hl-Completions" key="noCompletions"><span class="hl-Title">No Completions</span></div>
-                <div/>
+                <div key="completions"/>
                 <div class="hl-Completions">
                 {
                     template.map(util.range(0, maxItems), function (i)
                     <ul><li class="hl-CompTitle hl-NonText">~</li></ul>)
                 }
                 </div>
-            </div>);
+            </div>, divNodes);
-
-        noCompletions =  div.getElementsByTagName("div")[0];
-        completionBody = div.getElementsByTagName("div")[1];
 
         // 1:
         doc.body.replaceChild(div, doc.body.firstChild);
@@ -1336,16 +1332,16 @@ function ItemList(id) //{{{
         items.contextList.forEach(function init_eachContext(context) {
             if (!context.items.length)
                 return;
+            context.cache.nodes = {};
             context.cache.dom = dom(<div>
                     <div class="hl-Completions">
                         {context.createRow(context.title || [], "hl-CompTitle")}
                     </div>
-                    <span style="display: block; text-align: center; height: .5ex; line-height: .5ex;">&#x2303;</span>
+                    <div key="up" class="hl-CompLess"/>
-                    <div/>
+                    <div key="items"/>
-                    <span style="display: block; text-align: center; height: .5ex; line-height: .5ex; padding-bottom: 1ex;">&#x2304;</span>
+                    <div key="down" class="hl-CompMore"/>
-                </div>);
+                </div>, context.cache.nodes);
-            context.cache.arrows = context.cache.dom.getElementsByTagName("span");
+            divNodes.completions.appendChild(context.cache.dom);
-            completionBody.appendChild(context.cache.dom);
         });
     }
 
@@ -1378,19 +1374,21 @@ function ItemList(id) //{{{
         }
 
         items.contextList.forEach(function fill_eachContext(context) {
-            let dom = context.cache.dom;
+            let cache = context.cache;
+            let dom = cache.dom;
             if (!dom)
                 return;
             let [start, end] = getRows(context);
-            context.cache.arrows[0].style.display = (start == 0) ? "none" : "block";
-            context.cache.arrows[1].style.display = (end == context.items.length) ? "none" : "block";
             let d = stuff.cloneNode(true);
             for (let [,row] in Iterator(context.getRows(start, end, doc)))
                 d.appendChild(row);
-            dom.replaceChild(d, dom.getElementsByTagName("div")[1]);
+            dom.replaceChild(d, cache.nodes.items);
+            cache.nodes.items = d;
+            cache.nodes.up.style.display = (start == 0) ? "none" : "block";
+            cache.nodes.down.style.display = (end == context.items.length) ? "none" : "block";
         });
 
-        noCompletions.style.display = off > 0 ? "none" : "block";
+        divNodes.noCompletions.style.display = off > 0 ? "none" : "block";
 
         // 1:
         completionElements = div.getElementsByClassName("hl-CompItem");

content/util.js

@@ -488,7 +488,7 @@ const util = { //{{{
         return urls;
     },
 
-    xmlToDom: function (node, doc)
+    xmlToDom: function (node, doc, nodes)
     {
         XML.prettyPrinting = false;
         switch (node.nodeKind())
@@ -501,7 +501,9 @@ const util = { //{{{
                 for each (let attr in node.@*)
                     domnode.setAttribute(attr.name(), String(attr));
                 for each (let child in node.*)
-                    domnode.appendChild(arguments.callee(child, doc));
+                    domnode.appendChild(arguments.callee(child, doc, nodes));
+                if (nodes && node.@key)
+                    nodes[node.@key] = domnode;
                 return domnode;
         }
     }