-styled the autocomplete dropdown

- trigger autocomplete automatically

Signed-off-by: Ananya Sen <Ananya.Sen@motorola.com>

2 files changed, 14 insertions, 4 deletions

diff --git a/index.html b/index.html
index fe52167d..86348459 100755
--- a/index.html
+++ b/index.html
@@ -212,6 +212,7 @@
           .activeline {background: #e8f2ff !important;}
           div.CodeMirror span.CodeMirror-matchingbracket {color: #000;background-color: #ffd500;}
           .CodeMirror-scroll {height: auto; overflow-y: hidden; overflow-x: auto; width: 100%;}
+          .CodeMirror-completions select {background-color:#e8f2ff;border:1px solid #c1c1c1;box-shadow: 8px 8px 8px rgba(0, 0, 0, 0.8);}
         </style>
         
         </head>
diff --git a/js/stage/stage-view.reel/stage-view.js b/js/stage/stage-view.reel/stage-view.js
index 28a66396..43751559 100755
--- a/js/stage/stage-view.reel/stage-view.js
+++ b/js/stage/stage-view.reel/stage-view.js
@@ -110,10 +110,19 @@ exports.StageView = Montage.create(Component, {
                        doc.editor.setLineClass(doc.editor.hline, null);
                        doc.editor.hline = doc.editor.setLineClass(doc.editor.getCursor().line, "activeline");
                    },
-                   extraKeys: {"Ctrl-Space": function(cm) {
-                                        CodeMirror.simpleHint(cm, CodeMirror.javascriptHint);
-                                    }
-                              }
+                   //extraKeys: {"Ctrl-Space": function(cm) {CodeMirror.simpleHint(cm, CodeMirror.javascriptHint);}}
+                   onKeyEvent: function(cm, keyEvent) {
+                        if((keyEvent.type === "keyup")//need seperate keycode set per mode
+                            && ((keyEvent.keyCode > 47 && keyEvent.keyCode < 57)//numbers
+                                || (keyEvent.keyCode > 64 && keyEvent.keyCode <91)//letters
+                                || (keyEvent.keyCode === 190)//period
+                                || (keyEvent.keyCode === 189)//underscore, dash
+                            )
+                        ){
+
+                            CodeMirror.simpleHint(cm, CodeMirror.javascriptHint);
+                        }
+                   }
            });
 
             doc.editor.hline = doc.editor.setLineClass(0, "activeline");