Bug 731041 - Tidy up addon inline preferences code, mobile; r=mbrubeck, Unfocused

mobile/android/chrome/content/aboutAddons.js

@@ -247,18 +247,31 @@ var Addons = {
       xhr.open("GET", optionsURL, false);
       xhr.send();
       if (xhr.responseXML) {
-        let currentNode;
-        let nodeIterator = xhr.responseXML.createNodeIterator(xhr.responseXML, NodeFilter.SHOW_TEXT, null, false);
-        while (currentNode = nodeIterator.nextNode()) {
-          let trimmed = currentNode.nodeValue.replace(/^\s\s*/, "").replace(/\s\s*$/, "");
-          if (!trimmed.length)
-            currentNode.parentNode.removeChild(currentNode);
+        // This function removes and returns the text content of aNode without
+        // removing any child elements. Removing the text nodes ensures any XBL
+        // bindings apply properly.
+        function stripTextNodes(aNode) {
+          var text = '';
+          for (var i = 0; i < aNode.childNodes.length; i++) {
+            if (aNode.childNodes[i].nodeType != document.ELEMENT_NODE) {
+              text += aNode.childNodes[i].textContent;
+              aNode.removeChild(aNode.childNodes[i--]);
+            } else {
+              text += stripTextNodes(aNode.childNodes[i]);
+            }
+          }
+          return text;
         }
 
         // Only allow <setting> for now
-        let prefs = xhr.responseXML.querySelectorAll(":root > setting");
-        for (let i = 0; i < prefs.length; i++)
-          box.appendChild(prefs.item(i));
+        let settings = xhr.responseXML.querySelectorAll(":root > setting");
+        for (let i = 0; i < settings.length; i++) {
+          var setting = settings[i];
+          var desc = stripTextNodes(setting).trim();
+          if (!setting.hasAttribute("desc"))
+            setting.setAttribute("desc", desc);
+          box.appendChild(setting);
+        }
 /*
         // Send an event so add-ons can prepopulate any non-preference based
         // settings

mobile/xul/chrome/content/bindings/extensions.xml

@@ -117,21 +117,31 @@
             if (!xhr.responseXML)
               return;
 
-            let currentNode;
-            let nodeIterator = xhr.responseXML.createNodeIterator(xhr.responseXML,
-                                                              NodeFilter.SHOW_TEXT,
-                                                              null,
-                                                              false);
-            while (currentNode = nodeIterator.nextNode()) {
-              let trimmed = currentNode.nodeValue.replace(/^\s\s*/, "").replace(/\s\s*$/, "");
-              if (!trimmed.length)
-                currentNode.parentNode.removeChild(currentNode);
+            // This function removes and returns the text content of aNode without
+            // removing any child elements. Removing the text nodes ensures any XBL
+            // bindings apply properly.
+            function stripTextNodes(aNode) {
+              var text = '';
+              for (var i = 0; i < aNode.childNodes.length; i++) {
+                if (aNode.childNodes[i].nodeType != document.ELEMENT_NODE) {
+                  text += aNode.childNodes[i].textContent;
+                  aNode.removeChild(aNode.childNodes[i--]);
+                } else {
+                  text += stripTextNodes(aNode.childNodes[i]);
+                }
+              }
+              return text;
             }
 
             // Only allow <setting> for now
-            let prefs = xhr.responseXML.querySelectorAll(":root > setting");
-            for (let i = 0; i < prefs.length; i++)
-              box.appendChild(prefs.item(i));
+            let settings = xhr.responseXML.querySelectorAll(":root > setting");
+            for (let i = 0; i < settings.length; i++) {
+              var setting = settings[i];
+              var desc = stripTextNodes(setting).trim();
+              if (!setting.hasAttribute("desc"))
+                setting.setAttribute("desc", desc);
+              box.appendChild(setting);
+            }
 
             // Send an event so add-ons can prepopulate any non-preference based
             // settings

mobile/xul/chrome/content/browser.css

@@ -30,41 +30,54 @@ settings {
   -moz-binding: url("chrome://mozapps/content/extensions/setting.xml#settings");
 }
 
+setting {
+  display: none;
+}
+
 setting[type="bool"] {
+  display: -moz-box;
   -moz-binding: url("chrome://browser/content/bindings.xml#setting-fulltoggle-bool");
 }
 
 setting[type="bool"][localized="true"] {
+  display: -moz-box;
   -moz-binding: url("chrome://browser/content/bindings.xml#setting-fulltoggle-localized-bool");
 }
 
 setting[type="boolint"] {
+  display: -moz-box;
   -moz-binding: url("chrome://browser/content/bindings.xml#setting-fulltoggle-boolint");
 }
 
 setting[type="integer"] {
+  display: -moz-box;
   -moz-binding: url("chrome://mozapps/content/extensions/setting.xml#setting-integer");
 }
 
 setting[type="control"] {
+  display: -moz-box;
   -moz-binding: url("chrome://mozapps/content/extensions/setting.xml#setting-control");
 }
 
 setting[type="string"] {
+  display: -moz-box;
   -moz-binding: url("chrome://mozapps/content/extensions/setting.xml#setting-string");
 }
 
 setting[type="color"] {
+  display: -moz-box;
   -moz-binding: url("chrome://mozapps/content/extensions/setting.xml#setting-color");
 }
 
 setting[type="file"],
 setting[type="directory"] {
+  display: -moz-box;
   -moz-binding: url("chrome://mozapps/content/extensions/setting.xml#setting-path");
 }
 
 setting[type="radio"],
 setting[type="menulist"] {
+  display: -moz-box;
   -moz-binding: url("chrome://mozapps/content/extensions/setting.xml#setting-multi");
 }
 

mobile/xul/themes/core/browser.css

@@ -1273,10 +1273,14 @@ setting {
   -moz-box-orient: horizontal;
 }
 
-.setting-label {
+setting > vbox {
   -moz-box-flex: 1;
 }
 
+.preferences-description:empty {
+  display: none;
+}
+
 .setting-group > setting {
   border-bottom: none;
 }
@@ -1291,20 +1295,24 @@ setting {
 }
 
 /* Put setting textboxes on a separate row in portrait */
-@media (@orientation@: portrait) {
+@media (@orientation@: portrait) and (max-width: 600px) {
   setting[type="integer"],
   setting[type="string"],
   setting[type="file"],
   setting[type="directory"] {
-    -moz-box-align: start;
+    -moz-box-align: stretch;
     -moz-box-orient: vertical;
   }
+}
 
-  setting[type="integer"] > .setting-input > textbox,
-  setting[type="string"] > .setting-input > textbox {
-    width: 499px; /* textboxes seem to need a width in order to flex */
-    -moz-box-flex: 1;
-  }
+setting[type="integer"] > .preferences-alignment,
+setting[type="string"] > .preferences-alignment {
+  -moz-box-flex: 3;
+}
+
+setting[type="file"] > .preferences-alignment,
+setting[type="directory"] > .preferences-alignment {
+  -moz-box-align: center;
 }
 
 .options-box {

mobile/xul/themes/core/gingerbread/browser.css

@@ -1264,10 +1264,14 @@ setting:hover:active {
   background-color: @color_background_highlight@;
 }
 
-.setting-label {
+setting > vbox {
   -moz-box-flex: 1;
 }
 
+.preferences-description:empty {
+  display: none;
+}
+
 .setting-group > setting {
   border-bottom: none;
 }
@@ -1282,18 +1286,22 @@ setting:hover:active {
 }
 
 /* Put setting textboxes on a separate row in portrait */
-@media (@orientation@: portrait) {
+@media (@orientation@: portrait) and (max-width: 600px) {
   setting[type="integer"],
   setting[type="string"] {
-    -moz-box-align: start;
+    -moz-box-align: stretch;
     -moz-box-orient: vertical;
   }
+}
 
-  setting[type="integer"] > .setting-input > textbox,
-  setting[type="string"] > .setting-input > textbox {
-    width: 499px; /* textboxes seem to need a width in order to flex */
-    -moz-box-flex: 1;
-  }
+setting[type="integer"] > .preferences-alignment,
+setting[type="string"] > .preferences-alignment {
+  -moz-box-flex: 3;
+}
+
+setting[type="file"] > .preferences-alignment,
+setting[type="directory"] > .preferences-alignment {
+  -moz-box-align: center;
 }
 
 .options-box {

mobile/xul/themes/core/honeycomb/browser.css

@@ -1482,10 +1482,14 @@ setting[type="bool"]:hover:active .setting-input > checkbox[checked="true"] > .c
   background-image: url("chrome://browser/skin/images/check-selected-tap-hdpi.png");
 }
  
-.setting-label {
+setting > vbox {
   -moz-box-flex: 1;
 }
 
+.preferences-description:empty {
+  display: none;
+}
+
 .setting-group > setting {
   border-bottom: none;
 }
@@ -1500,18 +1504,22 @@ setting[type="bool"]:hover:active .setting-input > checkbox[checked="true"] > .c
 }
 
 /* Put setting textboxes on a separate row in portrait */
-@media (@orientation@: portrait) {
+@media (@orientation@: portrait) and (max-width: 600px) {
   setting[type="integer"],
   setting[type="string"] {
-    -moz-box-align: start;
+    -moz-box-align: stretch;
     -moz-box-orient: vertical;
   }
+}
 
-  setting[type="integer"] > .setting-input > textbox,
-  setting[type="string"] > .setting-input > textbox {
-    width: 499px; /* textboxes seem to need a width in order to flex */
-    -moz-box-flex: 1;
-  }
+setting[type="integer"] > .preferences-alignment,
+setting[type="string"] > .preferences-alignment {
+  -moz-box-flex: 3;
+}
+
+setting[type="file"] > .preferences-alignment,
+setting[type="directory"] > .preferences-alignment {
+  -moz-box-align: center;
 }
 
 .options-box {