From 45026f8540a2ca26a9fddaeb75994f066fe60921 Mon Sep 17 00:00:00 2001
From: Nicolas Pierron <nicolas.b.pierron@gmail.com>
Date: Mon, 25 Apr 2011 22:20:30 +0000
Subject: [PATCH] nixos-gui: - Add a scroll bar for option details. - Respect
 text eol and indentation on the ui.

svn path=/nixos/trunk/; revision=26974
---
 gui/chrome/content/main.js      | 23 +++++++++++++++--------
 gui/chrome/content/myviewer.xul | 29 ++++++++++++++++-------------
 2 files changed, 31 insertions(+), 21 deletions(-)

diff --git a/gui/chrome/content/main.js b/gui/chrome/content/main.js
index ee238993a3d..ecfc5a8c5c9 100644
--- a/gui/chrome/content/main.js
+++ b/gui/chrome/content/main.js
@@ -15,6 +15,13 @@ function setProgress(current, max)
 }
 */
 
+function updateTextbox(id, value)
+{
+  // setting the height cause an overflow which resize the textbox to its
+  // content due to its onoverflow attribute.
+  $(id).attr("value", value).attr("height", 1);
+};
+
 function updatePanel(options)
 {
   log("updatePanel: " + options.length);
@@ -32,22 +39,22 @@ function updatePanel(options)
   $("#desc").text(o.description);
 
   if (o.value != null)
-    $("#val").text(o.value);
+    updateTextbox("#val", o.value);
   else
-    $("#val").text("");
+    updateTextbox("#val", "");
 
   if (o.defaultValue != null)
-    $("#def").text(o.defaultValue);
+    updateTextbox("#def", o.defaultValue);
   else
-    $("#def").text("");
+    updateTextbox("#def", "");
 
   if (o.example != null)
-    $("#exp").text(o.example);
+    updateTextbox("#exp", o.example);
   else
-    $("#exp").text("");
+    updateTextbox("#exp", "");
 
-  $("#decls").text(o.declarations.join("\n"));
-  $("#defs").text(o.definitions.join("\n"));
+  updateTextbox("#decls", o.declarations.join("\n"));
+  updateTextbox("#defs", o.definitions.join("\n"));
 }
 
 
diff --git a/gui/chrome/content/myviewer.xul b/gui/chrome/content/myviewer.xul
index 732d5d62606..2aeb9391d07 100644
--- a/gui/chrome/content/myviewer.xul
+++ b/gui/chrome/content/myviewer.xul
@@ -18,43 +18,46 @@
   <script src="nixos.js"/>
   <script src="optionView.js"/>
   <script src="main.js"/>
-  <columns height="580">
-    <column width = "300">
+  <hbox flex="1">
+    <vbox width="250">
       <tree flex="1" id="option-tree" persist="height" onselect="gOptionView.selectionChanged()">
         <treecols>
-          <treecol persist="hidden width" flex="1" id="opt-name"
+          <treecol persist="hidden width" flex="9" id="opt-name"
                    label="Option" primary="true"/>
           <!-- Uncomment the following column to see the number of option
                printed below each options. -->
           <!--
           <treecol persist="hidden width" flex="1" id="dbg-size"
-                   label="Size"/>
+                   label="sz"/>
           -->
         </treecols>
         <treechildren id="first-child" flex="1"/>
       </tree>
-    </column>
-    <column flex="1">
+    </vbox>
+    <vbox flex="3" style="overflow: auto">
       <caption id="name" label=""/>
       <caption id="typename" label=""/>
       <separator/>
       <description id="desc" hidden="false"></description>
       <separator/>
       <caption label="Value:"/>
-      <description id="val" hidden="false"></description>
+      <textbox id="val" readonly="true" multiline="true" value=""
+      class="plain" hidden="false" onoverflow="this.height =
+      this.inputField.scrollHeight;" />
       <separator/>
       <caption label="Default:"/>
-      <description id="def" hidden="false"></description>
+      <textbox id="def" readonly="true" multiline="true" value="" class="plain" hidden="false" onoverflow="this.height = this.inputField.scrollHeight;" />
       <separator/>
       <caption label="Example:"/>
-      <description id="exp" hidden="false"></description>
+      <textbox id="exp" readonly="true" multiline="true" value="" class="plain" hidden="false" onoverflow="this.height = this.inputField.scrollHeight;" />
       <separator/>
       <caption label="Declarations:"/>
-      <description id="decls" hidden="false"></description>
+      <textbox id="decls" readonly="true" multiline="true" value="" class="plain" hidden="false" onoverflow="this.height = this.inputField.scrollHeight;" />
       <separator/>
       <caption label="Definitions:"/>
-      <description id="defs" hidden="false"></description>
-    </column>
-  </columns>
+      <textbox id="defs" readonly="true" multiline="true" value=""
+      class="plain" hidden="false" onoverflow="this.height = this.inputField.scrollHeight;" />
+    </vbox>
+  </hbox>
 <!--  <progressmeter id="progress-bar" value="0%"/> -->
 </window>