move more-prompt messages to the commandline and use the default UI font size

in the MOW
2025-12-22 14:08:11 +01:00 · 2007-10-02 20:45:56 +00:00
parent bf6a0cdecd
commit e920cd3170
8 changed files with 115 additions and 56 deletions
--- a/content/bookmarks.js
+++ b/content/bookmarks.js
@@ -258,7 +258,7 @@ function Bookmarks() //{{{

            for (var i = 0; i < items.length; i++)
            {
-                var list = "<table style=\"white-space: nowrap;\"><tr align=\"left\" style=\"color: magenta\"><th>title</th><th>keyword</th><th>URL</th><th align=\"right\">tags</th></tr>";
+                var list = "<table><tr align=\"left\" class=\"hl-Title\"><th>title</th><th>keyword</th><th>URL</th><th align=\"right\">tags</th></tr>";
                for (var i = 0; i < items.length; i++)
                {
                    var title = items[i][1].replace(/</, "&lt;").replace(/>/, "&gt;");
@@ -488,7 +488,7 @@ function History() //{{{

            for (var i = 0; i < items.length; i++)
            {
-                var list = "<table style=\"white-space: nowrap;\"><tr align=\"left\" style=\"color: magenta\"><th>title</th><th>URL</th></tr>";
+                var list = "<table><tr align=\"left\" class=\"hl-Title\"><th>title</th><th>URL</th></tr>";
                for (var i = 0; i < items.length; i++)
                {
                    var title = items[i][1].replace(/</, "&lt;").replace(/>/, "&gt;");
@@ -743,11 +743,11 @@ function Marks() //{{{
            }
        }

-        var list = "<table><tr align=\"left\" style=\"color: magenta\"><th>mark</th><th>line</th><th>col</th><th>file</th></tr>";
+        var list = "<table><tr align=\"left\" class=\"hl-Title\"><th>mark</th><th>line</th><th>col</th><th>file</th></tr>";
        for (var i = 0; i < marks.length; i++)
        {
            list += "<tr>"
-                  + "<td>&nbsp;"                   + marks[i][0]                              +  "</td>"
+                  + "<td> "                        + marks[i][0]                              +  "</td>"
                  + "<td align=\"right\">"         + Math.round(marks[i][1].position.y * 100) + "%</td>"
                  + "<td align=\"right\">"         + Math.round(marks[i][1].position.x * 100) + "%</td>"
                  + "<td style=\"color: green;\">" + marks[i][1].location.replace(/</, "&lt;").replace(/>/, "&gt;") +  "</td>"
@@ -838,10 +838,10 @@ function QuickMarks() //{{{
            }
        }

-        var list = "<table><tr align=\"left\" style=\"color: magenta\"><th>QuickMark</th><th>URL</th></tr>";
+        var list = "<table><tr align=\"left\" class=\"hl-Title\"><th>QuickMark</th><th>URL</th></tr>";
        for (var i = 0; i < marks.length; i++)
        {
-            list += "<tr><td>&nbsp;&nbsp;&nbsp;&nbsp;" + marks[i][0] +
+            list += "<tr><td>    " + marks[i][0] +
                    "</td><td style=\"color: green;\">" + marks[i][1].replace(/</, "&lt;").replace(/>/, "&gt;") + "</td></tr>";
        }
        list += "</table>";
--- a/content/buffers.js
+++ b/content/buffers.js
@@ -232,22 +232,22 @@ function Buffer() //{{{
            var items = vimperator.completion.get_buffer_completions("");
            var number, indicator, title, url;

-            var list = "<table style=\"white-space: pre;\">"
+            var list = "<table>"
            for (var i = 0; i < items.length; i++)
            {
                if (i == vimperator.tabs.index())
-                   indicator = "&nbsp;<span style=\"color: blue\">%</span>&nbsp;";
+                   indicator = " <span style=\"color: blue\">%</span> ";
                else if (i == vimperator.tabs.index(vimperator.tabs.alternate))
-                   indicator = "&nbsp;<span style=\"color: blue\">#</span>&nbsp;";
+                   indicator = " <span style=\"color: blue\">#</span> ";
                else
-                   indicator = "&nbsp;&nbsp;&nbsp;";
+                   indicator = "   ";

                [number, title] = items[i][0].split(/:\s+/, 2);
                url = items[i][1];
                url = url.replace(/>/, "&gt;").replace(/</, "&lt;");
                title = title.replace(/>/, "&gt;").replace(/</, "&lt;");

-                list += "<tr><td align=\"right\">&nbsp;&nbsp;" + number + "</td><td>" + indicator +
+                list += "<tr><td align=\"right\">  " + number + "</td><td>" + indicator +
                        "</td><td style=\"width: 250px; max-width: 500px; overflow: hidden;\">" + title +
                        "</td><td><span style=\"color: green\">" + url + "</span></td></tr>";
            }
--- a/content/commands.js
+++ b/content/commands.js
@@ -1426,25 +1426,30 @@ function Commands() //{{{
                    var after_time = Date.now();
                
                    if ((after_time - before_time) / count >= 100)
-                        var each = "&nbsp;&nbsp;Each time:&nbsp;&nbsp;<span style=\"color: green\">" +
+                        var each = "<td>  Each time:</td><td align=\"right\"><span style=\"color: green\">" +
                            ((after_time - before_time) / 1000.0 / count) +
-                            "</span> sec<br/>";
+                            "</span></td><td>sec</td>";
                    else
-                        var each = "&nbsp;&nbsp;Each time:&nbsp;&nbsp;<span style=\"color: green\">" +
+                        var each = "<td>  Each time:</td><td align=\"right\"><span style=\"color: green\">" +
                            ((after_time - before_time) / count) +
-                            "</span> msec<br/>";
+                            "</span></td><td>msec</td>";

                    if (after_time - before_time >= 100)
-                        var total = "&nbsp;&nbsp;Total time: <span style=\"color: red\">" +
+                        var total = "<td>  Total time:</td><td align=\"right\"><span style=\"color: red\">" +
                            ((after_time - before_time) / 1000.0) +
-                            "</span> sec";
+                            "</span></td><td>sec</td>";
                    else
-                        var total = "&nbsp;&nbsp;Total time: <span style=\"color: red\">" +
-                            (after_time - before_time) + "</span> msec";
+                        var total = "<td>  Total time:</td><td align=\"right\"><span style=\"color: red\">" +
+                            (after_time - before_time) + "</span></td><td>msec</td>";

+                    var str = "<table>" +
+                              "<tr align=\"left\" class=\"hl-Title\"><th colspan=\"3\">Code execution summary</th></tr>" +
+                              "<tr><td>  Executed:</td><td align=\"right\"><span style=\"color: green\">" + count + "</span></td><td>times</td></tr>" +
+                              "<tr>" + each + "</tr>" +
+                              "<tr>" + total + "</tr>"
+                              "</table>";

-                    vimperator.echo("<span style=\"color: magenta; font-weight: bold\">Code execution summary</span>:<br/>" +
-                        "&nbsp;&nbsp;Executed:&nbsp;&nbsp;&nbsp;<span style=\"color: green\">" + count + "</span> times<br/>" + each + total);
+                    vimperator.commandline.echo(str, vimperator.commandline.HL_NORMAL, true);
                }
                else
                {
--- a/content/mappings.js
+++ b/content/mappings.js
@@ -288,9 +288,9 @@ function Mappings() //{{{
            for (var j = 0; j < maps[i].names.length; j++)
            {
                list += "<tr>";
-                list += "<td>&nbsp;" + maps[i].names[j].replace(/</g, "&lt;").replace(/>/g, "&gt;") + "</td>"
+                list += "<td> " + maps[i].names[j].replace(/</g, "&lt;").replace(/>/g, "&gt;") + "</td>"
                if (maps[i].rhs)
-                    list += "<td>&nbsp;" + maps[i].rhs.replace(/</g, "&lt;").replace(/>/g, "&gt;") + "</td>"
+                    list += "<td> " + maps[i].rhs.replace(/</g, "&lt;").replace(/>/g, "&gt;") + "</td>"
                list += "</tr>";
            }
        }
--- a/content/options.js
+++ b/content/options.js
@@ -304,8 +304,8 @@ function Options() //{{{
    this.list = function()
    {
        // TODO: columns like Vim?
-        var list = "<table style=\"white-space: nowrap;\">" +
-                   "<tr align=\"left\" style=\"color: magenta\"><th>--- Options ---</th></tr>";
+        var list = "<table>" +
+                   "<tr align=\"left\" class=\"hl-Title\"><th>--- Options ---</th></tr>";
        var name, value;

        for (var i = 0; i < options.length; i++)
@@ -315,12 +315,12 @@ function Options() //{{{

            if (options[i].type == "boolean")
            {
-                name = value ? "&nbsp;&nbsp;" + name : "no" + name;
+                name = value ? "  " + name : "no" + name;
                list += "<tr><td>" + name + "</td></tr>";
            }
            else
            {
-                list += "<tr><td>" + "&nbsp;&nbsp;" + name + "=" + value + "</td></tr>";
+                list += "<tr><td>" + "  " + name + "=" + value + "</td></tr>";
            }
        }

--- a/content/ui.js
+++ b/content/ui.js
@@ -138,7 +138,7 @@ function CommandLine() //{{{
        commandline_widget.setAttribute("class", group);
    }

-    // Sets the prompt - for example, : or /
+    // sets the prompt - for example, : or /
    function setPrompt(prompt)
    {
        if (typeof prompt != "string")
@@ -147,7 +147,7 @@ function CommandLine() //{{{
        prompt_widget.value = prompt;
        if (prompt)
        {
-            // Initially (in the xul) the prompt is 'collapsed', this makes
+            // initially (in the xul) the prompt is 'collapsed', this makes
            // sure it's visible, then we toggle the display which works better
            prompt_widget.style.visibility = 'visible';
            prompt_widget.style.display = 'inline';
@@ -159,16 +159,15 @@ function CommandLine() //{{{
        }
    }

-    // Sets the command - e.g. 'tabopen', 'open http://example.com/'
+    // sets the command - e.g. 'tabopen', 'open http://example.com/'
    function setCommand(cmd)
    {
        command_widget.value = cmd;
    }

-    // TODO: the invoking command should be pasted at the top of the MOW and
-    //       the MOW messages should actually be displayed in the commandline
-    //     : extract CSS
+    // TODO: extract CSS
    //     : resize upon a window resize
+    //     : echoed lines longer than v-c-c.width should wrap and use MOW
    function setMultiline(str)
    {
        // TODO: we should retain any previous command output like Vim
@@ -177,16 +176,18 @@ function CommandLine() //{{{

        multiline_input_widget.collapsed = true;

-        var output = "<pre>" + str + "</pre>";
-        output += '<span id="end-prompt" style="color: green; background-color: white;">Press ENTER or type command to continue</span>';
-        output += '<span id="more-prompt" style="display: none; position: fixed; top: auto; bottom: 0; left: 0; right: 0; color: green; background-color: white;">';
-        output += "-- More --";
-        output += '</span>';
-        output += '<span id="more-help-prompt" style="display: none; position: fixed; top: auto; bottom: 0; left: 0; right: 0; color: green; background-color: white;">';
-        output += "-- More -- SPACE/d/j: screen/page/line down, b/u/k: up, q: quit";
-        output += '</span>';
+        var output = ":" + command_widget.value + "<br/>" + str;
+
+        var font_size = document.defaultView.getComputedStyle(document.getElementById("main-window"), null).getPropertyValue("font-size");
+        multiline_output_widget.contentDocument.body.setAttribute("style", "font-size: " + font_size);

        multiline_output_widget.contentDocument.body.innerHTML = output;
+        multiline_output_widget.contentDocument.body.id = "vimperator-multiline-output-content";
+
+        var stylesheet = multiline_output_widget.contentDocument.createElement("link");
+        stylesheet.setAttribute("rel", "Stylesheet");
+        stylesheet.setAttribute("href", "chrome://vimperator/skin/vimperator.css");
+        multiline_output_widget.contentDocument.getElementsByTagName("head")[0].appendChild(stylesheet);

        var available_height = getBrowser().mPanelContainer.boxObject.height;
        var content_height = multiline_output_widget.contentDocument.height;
@@ -197,12 +198,17 @@ function CommandLine() //{{{

        if (vimperator.options["more"] && multiline_output_widget.contentWindow.scrollMaxY > 0)
        {
-            multiline_output_widget.contentWindow.document.getElementById("more-prompt").style.display = "inline";
+            setHighlightGroup("hl-MoreMsg");
+            setPrompt("");
+            setCommand("-- More --");
            multiline_output_widget.contentWindow.scrollTo(0, 0);
        }
        else
        {
            multiline_output_widget.contentWindow.scrollTo(0, content_height);
+            setHighlightGroup("hl-Question");
+            setPrompt("");
+            setCommand('Press ENTER or type command to continue');
        }

        multiline_output_widget.contentWindow.focus();
@@ -264,7 +270,7 @@ function CommandLine() //{{{
        command_widget.focus();
    };

-    /* normally used when pressing esc, does not execute a command */
+    // normally used when pressing esc, does not execute a command
    this.close = function()
    {
        var res = vimperator.triggerCallback("cancel", cur_extended_mode);
@@ -476,7 +482,7 @@ function CommandLine() //{{{
                    if (res)
                        [completion_start_index, completions] = res;

-                    // Sort the completion list
+                    // sort the completion list
                    if (vimperator.options["wildoptions"].search(/\bsort\b/) > -1)
                    {
                        completions.sort(function(a, b) {
@@ -634,6 +640,7 @@ function CommandLine() //{{{

        var show_more_help_prompt = false;
        var show_more_prompt = false;
+        var clear_prompt = false;

        function isScrollable() { return !win.scrollMaxY == 0; }

@@ -641,9 +648,9 @@ function CommandLine() //{{{

        function close()
        {
-            multiline_output_widget.collapsed = true;
            // FIXME: use mode stack
            vimperator.modes.reset();
+            clear_prompt = true;
        }

        function pass(event)
@@ -657,7 +664,7 @@ function CommandLine() //{{{
        switch (key)
        {
            case ":":
-                vimperator.commandline.open(":", "", vimperator.modes.EX);
+                pass(event);
                break;

            // down a line
@@ -786,22 +793,27 @@ function CommandLine() //{{{
        }

        // set appropriate prompt string
-        var more_prompt = win.document.getElementById("more-prompt");
-        var more_help_prompt = win.document.getElementById("more-help-prompt");
-
-        if (show_more_help_prompt)
+        if (clear_prompt)
        {
-            more_prompt.style.display = "none";
-            more_help_prompt.style.display = "inline";
+            this.clear();
+        }
+        else if (show_more_help_prompt)
+        {
+            setHighlightGroup(this.HL_MOREMSG);
+            setPrompt("");
+            setCommand("-- More -- SPACE/d/j: screen/page/line down, b/u/k: up, q: quit");
        }
        else if (show_more_prompt || (vimperator.options["more"] && isScrollable() && !atEnd()))
        {
-            more_help_prompt.style.display = "none";
-            more_prompt.style.display = "inline";
+            setHighlightGroup(this.HL_MOREMSG);
+            setPrompt("");
+            setCommand("-- More --");
        }
        else
        {
-            more_prompt.style.display = more_help_prompt.style.display = "none";
+            setHighlightGroup(this.HL_QUESTION);
+            setPrompt("");
+            setCommand('Press ENTER or type command to continue');
        }
    }

--- a/content/vimperator.js
+++ b/content/vimperator.js
@@ -363,7 +363,7 @@ const vimperator = (function() //{{{
            }

            if (color)
-                string += "<span style=\"color: magenta; font-weight: bold;\">" + obj + "</span>::\n";
+                string += "<span class=\"hl-Title\">" + obj + "</span>::\n";
            else
                string += obj + "::\n";

--- a/skin/vimperator.css
+++ b/skin/vimperator.css
@@ -114,6 +114,8 @@ the terms of any one of the MPL, the GPL or the LGPL.
    background-color: black;
 }

+/* highlight groups */
+
 .hl-Normal {
    background-color: white;
    color: black;
@@ -145,4 +147,44 @@ the terms of any one of the MPL, the GPL or the LGPL.
    color: red;
 }

+.hl-Normal {
+    background-color: white;
+    color: black;
+}
+.hl-ErrorMsg {
+    background-color: red;
+    color: white;
+    font-weight: bold;
+}
+.hl-MoreMsg {
+    color: green;
+    background-color: white;
+}
+.hl-Title {
+    color: magenta;
+    background-color: white;
+    font-weight: bold;
+}
+
+/* MOW */
+
+#vimperator-multiline-output-content {
+    white-space: pre; /* -moz-pre-wrap FIXME: Should lines wrap like Vim? */
+    font-family: -moz-fixed;
+    margin: 0px;
+}
+
+#vimperator-multiline-output-content * {
+    font: inherit;
+}
+
+#vimperator-multiline-output-content table {
+    white-space: inherit;
+    border-spacing: 0px;
+}
+
+#vimperator-multiline-output-content td {
+    padding: 0px;
+}
+
 /* vim: set fdm=marker sw=4 ts=4 et: */