Previously when the space allocated to the minibuffer input filled up,
its text would be truncated.  Now the info display will be pushed over
to make more room.

The elements are explicitly turned on and off and resized according to
the available space and the input text width.  The code to get the
text width, using the selection, is due to John Foerch.

We want to set a minimum width for the input text area via a css
property.  The code accomplishes this using an awful kludge that
operates on the second update, during the first hints interaction..
Furthermore, each time hints are used, the position of the input is
not set on the first call to update, so another kludge avoids the
calculation in that case.  Yet another kludge is used to reduce the
calculated available space, compensating for the info padding; this
avoids overflowing the minibuffer thus causing re-layout of the
content buffer.  Suggestions to avoid these kludges would be very
welcome.
---
 modules/hints.js      |   64 +++++++++++++++++++++++++++++++++++++++++++++---
 modules/minibuffer.js |   14 ++++++++++
 2 files changed, 74 insertions(+), 4 deletions(-)

diff --git a/modules/hints.js b/modules/hints.js
index 28e9011..2fed19d 100644
--- a/modules/hints.js
+++ b/modules/hints.js
@@ -421,13 +421,16 @@ hint_manager.prototype = {
 /**
  * Display the URL and other information for the currently selected node.
  */
+var input_initial_width;
 function hints_info (hints, window) {
     this.hints = hints;
+    this.window = window;
+    this.minibuffer = window.minibuffer;
     this.input = window.minibuffer.input_element;
     this.info = window.document.getElementById("minibuffer-info");
-
-    this.input.setAttribute("flex", "0");
-    this.info.setAttribute("collapsed", "false");
+    
+    window.addEventListener("resize", this);
+    this.show();
 }
 hints_info.prototype = {
     constructor: hints_info,
@@ -457,12 +460,65 @@ hints_info.prototype = {
             }
        }
         this.info.value = s.join(" ");
+        this.resize();
     },
 
-    destroy: function () {
+    set_initial_width: function () {
+        var w = this.input.getBoundingClientRect().width;
+        //dumpln("SW " + w);
+        if (w > 0)
+            input_initial_width = w;
+    },
+
+    resize: function () {
+        if (input_initial_width === undefined) {
+            this.set_initial_width();
+            return;
+        }
+        var left = this.input.getBoundingClientRect().left;
+        var right = this.window.innerWidth;
+        if (left >= right)      // kludge for first call
+            left = 0;
+        right -= 20;            // kludge to avoid expansion
+        var width = this.minibuffer.input_text_width();
+        width += 1;             // Allow room for cursor.
+        //dumpln("D " + left + " " + width + " " + right);
+        if (width < input_initial_width) 
+            width = input_initial_width;
+        this.show_if(left + width < right);
+        if (this.shown)
+            this.input.setAttribute("width", width);
+    },
+
+    show_if: function (p) {
+        if (p && !this.shown)
+            this.show();
+        if (!p && this.shown)
+            this.hide();
+    },
+    
+    show: function () {
+        //dumpln("Show");
+        this.input.setAttribute("flex", "0");
+        this.info.setAttribute("collapsed", "false");
+        this.shown = true;
+    },
+
+    hide: function () {
+        //dumpln("Hide");
         this.input.setAttribute("flex", "1");
         this.info.setAttribute("collapsed", "true");
+        this.shown = false;
+    },
+
+    handleEvent: function (e) {
+        this.resize();
+    },
+
+    destroy: function () {
+        this.hide();
         this.info.value = "";
+        this.window.removeEventListener("resize", this);
     }
 };
 
diff --git a/modules/minibuffer.js b/modules/minibuffer.js
index 6b19305..1efcb5a 100644
--- a/modules/minibuffer.js
+++ b/modules/minibuffer.js
@@ -385,6 +385,20 @@ minibuffer.prototype = {
             s.unload();
     },
 
+    input_text_width: function () {
+        var field = this.input_element.inputField;
+        //XXX: if we wanted to be really thorough, we could clone all
+        //     ranges, but let's be practical...
+        var start = field.selectionStart;
+        var end = field.selectionEnd;
+        field.select();
+        var sel = 
field.QueryInterface(Ci.nsIDOMNSEditableElement).editor.selection;
+        var w = sel.getRangeAt(0).getBoundingClientRect().width;
+        field.selectionStart = start;
+        field.selectionEnd = end;
+        return w;
+    },
+
     insert_before: function (element) {
         this.element.parentNode.insertBefore(element, this.element);
     }
-- 
1.7.9

_______________________________________________
Conkeror mailing list
[email protected]
https://www.mozdev.org/mailman/listinfo/conkeror

Reply via email to