Fixed a bug where typing the letter h in a string field would hide the gui

demo/demo.css

@@ -9,7 +9,7 @@ body {
 }
 
 #container {
-max-width: 530px;
+  max-width: 530px;
 }
 
 h1, h2, h3, h4, h5, h6 {
@@ -18,9 +18,9 @@ h1, h2, h3, h4, h5, h6 {
 }
 
 hr {
-border: 0;
+  border: 0;
-height: 0;
+  height: 0;
-border-top: 1px dotted #ccc;
+  border-top: 1px dotted #ccc;
 }
 
 h1 {
@@ -55,6 +55,7 @@ h2.section {
   border-top: 1px dotted #ccc;
   -webkit-transition: color 0.15s linear;
 }
+
 h2.section:hover {
   color: #00aeff;
 }
@@ -67,23 +68,32 @@ div.collapsed h2, div.expanded h2 {
   cursor: pointer;
 }
 
-.last { margin-bottom: 0px !important; }
+.last {
-.first { margin-top: 0px; }
+  margin-bottom: 0px !important;
+}
+
+.first {
+  margin-top: 0px;
+}
 
 div.trans {
   border-top: 1px dotted #ccc;
   margin: 0px 0px 20px 0px;
 }
+
 ol#secrets {
   padding: 0px;
   margin: 0px;
 }
+
 div.expanded h2:before {
   content: '-';
 }
+
 div.collapsed h2:before {
   content: '+';
 }
+
 div.expanded h2:before, div.collapsed h2:before {
   font-weight: normal;
   line-height: 2px;
@@ -97,6 +107,7 @@ div.expanded h2:before, div.collapsed h2:before {
 div.collapsable>div {
   padding-bottom: 10px;
 }
+
 div.collapsable {
   overflow: hidden;
   clear: both;
@@ -117,7 +128,9 @@ div.collapsed .collapsable {
   height: 0;
 }
 
-div.expanded { cursor: pointer; }
+div.expanded {
+  cursor: pointer;
+}
 
 #helvetica-demo {
   position: absolute;
@@ -131,7 +144,7 @@ div.expanded { cursor: pointer; }
 #notifier {
   position: fixed;
   right: 0;
-    top: 0;
+  top: 300px;
   width: 271px;
   height: 142px;
   background: url("assets/itgivesyouthis.jpg") center 0 no-repeat;
@@ -182,7 +195,7 @@ a:active {
 }
 
 footer {
-margin-top: 20px;
+  margin-top: 20px;
   background-color: #eee;
   width: 510px;
   padding: 10px;
@@ -207,15 +220,46 @@ code strong {
   color: #e61d5f;
 }
 
-/* SPAN elements with the classes below are added by prettyprint. */
+.str {
-.str { color: #0fa954; }
+  color: #0fa954;
-.kwd { color: #e61d5f; }
+}
-.com { color: #555; }
+
-.typ { color: #ccc; }
+.kwd {
-.lit { color: #00aeff; }
+  color: #e61d5f;
-.pun, .opn, .clo { color: #777; }
+}
-.pln { color: #ccc; }
+
-.tag { color: #555; }
+.com {
-.atn { color: #555; }
+  color: #555;
-.atv { color: #777; }
+}
-.dec { color: #606; }
+
+.typ {
+  color: #ccc;
+}
+
+.lit {
+  color: #00aeff;
+}
+
+.pun, .opn, .clo {
+  color: #777;
+}
+
+.pln {
+  color: #ccc;
+}
+
+.tag {
+  color: #555;
+}
+
+.atn {
+  color: #555;
+}
+
+.atv {
+  color: #777;
+}
+
+.dec {
+  color: #606;
+}

src/DAT/GUI/ControllerString.js

@@ -26,11 +26,16 @@ DAT.GUI.ControllerString = function() {
   }, false);
 
   input.addEventListener('blur', function() {
+    DAT.GUI.supressHotKeys = false;
     if (_this.finishChangeFunction != null) {
       _this.finishChangeFunction.call(this, _this.getValue());
     }
   }, false);
 
+  input.addEventListener('focus', function() {
+    DAT.GUI.supressHotKeys = true;
+  }, false);
+
   this.updateDisplay = function() {
     input.value = _this.getValue();
   };

src/DAT/GUI/GUI.js

@@ -20,6 +20,9 @@ DAT.GUI = function(parameters) {
 
   var listenInterval;
 
+  // Set this to minified css if you don't want to attach style sheets
+  var inlineCSS = '';
+
   // Sum total of heights of controllers in this gui
   var controllerHeight;
 
@@ -453,12 +456,21 @@ DAT.GUI = function(parameters) {
 
   // Add hide listener if this is the first DAT.GUI. 
   if (DAT.GUI.allGuis.length == 1) {
+
     window.addEventListener('keyup', function(e) {
       // Hide on 'H'
-      if (e.keyCode == 72) {
+      if (!DAT.GUI.supressHotKeys && e.keyCode == 72) {
         DAT.GUI.toggleHide();
       }
     }, false);
+
+    if (inlineCSS != '') {
+      var styleSheet = document.createElement('style');
+      styleSheet.setAttribute('type', 'text/css');
+      styleSheet.innerHTML = inlineCSS;
+      document.head.appendChild(styleSheet);
+    }
+
   }
 
 };
@@ -473,6 +485,7 @@ DAT.GUI.autoPlaceContainer = null;
 DAT.GUI.allControllers = [];
 DAT.GUI.allGuis = [];
 
+DAT.GUI.supressHotKeys = false;
 
 DAT.GUI.toggleHide = function() {
   if (DAT.GUI.hidden) {