1 files changed, 40 insertions, 21 deletions

diff --git a/options.html b/options.html
index 8be47f4c..f752abcd 100644
--- a/options.html
+++ b/options.html
@@ -70,7 +70,10 @@
       tr.advancedOption {
         display:none;
       }
-
+      input:read-only {
+        background-color: #eee;
+        color: #666;
+      }
     </style>
 
   <script type="text/javascript">
@@ -93,9 +96,13 @@
 
   function initializeOptions() {
     populateOptions();
-    for (var i = 0; i < editableFields.length; i++)
+
+    for (var i = 0; i < editableFields.length; i++) {
       $(editableFields[i]).addEventListener("keyup", onOptionKeyup, false);
-    $("filterLinkHints").addEventListener("click", onOptionKeyup, false);
+      $(editableFields[i]).addEventListener("change", enableSaveButton, false);
+      $(editableFields[i]).addEventListener("change", onDataLoaded, false);
+    }
+
     $("advancedOptions").addEventListener("click", openAdvancedOptions, false);
     $("showCommands").addEventListener("click", function () {
       showDialog("vimiumCommandListingContainer",
@@ -104,11 +111,14 @@
   }
 
   function onOptionKeyup(event) {
-    var isCheckbox = event.target.getAttribute("type") == "checkbox";
-    if (isCheckbox || event.target.getAttribute("savedValue") != event.target.value)
+    if (event.target.getAttribute("savedValue") != event.target.value)
       enableSaveButton();
   }
 
+  function onDataLoaded() {
+    $("linkHintCharacters").readOnly = $("filterLinkHints").checked;
+  }
+
   function enableSaveButton() { $("saveOptions").removeAttribute("disabled"); }
 
   // Saves options to localStorage.
@@ -118,19 +128,23 @@
     for (var i = 0; i < editableFields.length; i++) {
       var fieldName = editableFields[i];
       var field = $(fieldName);
-      var fieldValue = field.value.trim();
-      var defaultFieldValue = (defaultSettings[fieldName] != null) ?
-        defaultSettings[fieldName].toString() : "";
 
-      if (field.getAttribute("type") == "checkbox")
+      var fieldValue;
+      if (field.getAttribute("type") == "checkbox") {
         fieldValue = field.checked ? "true" : "false";
+      } else {
+        fieldValue = field.value.trim();
+        field.value = fieldValue;
+      }
+
+      var defaultFieldValue = (defaultSettings[fieldName] != null) ?
+        defaultSettings[fieldName].toString() : "";
 
       if (fieldValue == defaultFieldValue)
         delete localStorage[fieldName];
       else
         localStorage[fieldName] = fieldValue;
 
-      field.value = fieldValue;
       field.setAttribute("savedValue", fieldValue);
 
       if (postSaveHooks[fieldName]) { postSaveHooks[fieldName](fieldValue); }
@@ -143,24 +157,29 @@
     for (var i = 0; i < editableFields.length; i++) {
       var val = localStorage[editableFields[i]] || defaultSettings[editableFields[i]] || "";
       var field = $(editableFields[i]);
-
-      // if a true or false is stored, assume we're working with a checkbox
-      if (val == "true")
-        field.checked = true;
-      if (val == "false")
-        field.checked = false;
-
-      field.value = val;
-      field.setAttribute("savedValue", field.value);
+      setFieldValue($(editableFields[i]), val);
     }
+    onDataLoaded();
   }
 
   function restoreToDefaults() {
-    for (var i = 0; i < editableFields.length; i++)
-      $(editableFields[i]).value = defaultSettings[editableFields[i]] || "";
+    for (var i = 0; i < editableFields.length; i++) {
+      var val = defaultSettings[editableFields[i]] || "";
+      setFieldValue($(editableFields[i]), val);
+    }
+    onDataLoaded();
     enableSaveButton();
   }
 
+  function setFieldValue(field, value) {
+    if (field.getAttribute('type') == 'checkbox')
+      field.checked = value == "true";
+    else
+      field.value = value;
+
+    field.setAttribute("savedValue", value);
+  }
+
   function openAdvancedOptions(event) {
     var elements = document.getElementsByClassName("advancedOption");
     for (var i = 0; i < elements.length; i++)