Make it possible to quickly select "all", "none" or "safe" options.

diff --git a/index.html b/index.html
index b3988c4..3f91cdd 100644 (file)
--- a/index.html
+++ b/index.html
@@ -125,6 +125,12 @@
               </label>
             </li>
           </ul>
+          <div class="controls">
+            <span>Select:</span>
+            <a href="#" id="select-all">All</a>, 
+            <a href="#" id="select-none">None</a>,
+            <a href="#" id="select-safe">Safe</a>
+          </div>
         </div>
       </div>
       <p id="stats"></p>

diff --git a/master.css b/master.css
index b8705c1..00ba40e 100644 (file)
--- a/master.css
+++ b/master.css
@@ -25,5 +25,9 @@ button { font-weight: bold; width: 100px; }
 .quiet { font-size: 0.85em; color: #888; }
 .short { display: inline-block; width: 20em; margin-top: 0.25em; }
 
+.controls span { margin-right: 0.5em; margin-left: 1em; }
+.controls a { margin-left: 0.1em; }
+.controls a:focus, .controls a:hover { text-decoration: none; }
+
 .deprecated-element, .deprecated-attribute { color: red; }
 .presentational-element, .presentational-attribute, .inaccessible-attribute { color: #FF8C00; }
\ No newline at end of file

diff --git a/master.js b/master.js
index 322deb2..b1f657a 100644 (file)
--- a/master.js
+++ b/master.js
@@ -60,6 +60,29 @@
     }
   };
   
+  function setCheckedAttrOnCheckboxes(attrValue) {
+    var checkboxes = byId('options').getElementsByTagName('input');
+    for (var i = checkboxes.length; i--; ) {
+      checkboxes[i].checked = attrValue;
+    }
+  }
+  
+  byId('select-all').onclick = function() {
+    setCheckedAttrOnCheckboxes(true);
+    return false;
+  };
+  
+  byId('select-none').onclick = function() {
+    setCheckedAttrOnCheckboxes(false);
+    return false;
+  };
+  
+  byId('select-safe').onclick = function() {
+    setCheckedAttrOnCheckboxes(true);
+    byId('options').getElementsByTagName('input')[10].checked = false;
+    return false;
+  };
+  
 })();
 
 var _gaq = _gaq || [];