- Highlight Matching bracket

- Highlight selection matched
-Highlight current line

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

2 files changed, 30 insertions, 14 deletions

diff --git a/index.html b/index.html
index d385e4ba..37daee4b 100755
--- a/index.html
+++ b/index.html
@@ -183,6 +183,8 @@
         <script type="text/javascript" src="imports/codemirror/mode/xml/xml.js"></script>
         <script type="text/javascript" src="imports/codemirror/mode/javascript/javascript.js"></script>
         <script type="text/javascript" src="imports/codemirror/mode/css/css.js"></script>
+        <script type="text/javascript" src="imports/codemirror/lib/util/searchcursor.js"></script>
+        <script type="text/javascript" src="imports/codemirror/lib/util/match-highlighter.js"></script>
 
         <script type="text/javascript" src="node_modules/montage/montage.js"></script>
 
@@ -199,6 +201,16 @@
                     }
                 }
         </script>
+
+        <style type="text/css">
+          .CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}
+          span.CodeMirror-matchhighlight { background: #e9e9e9 }
+          .CodeMirror-focused span.CodeMirror-matchhighlight { background: #e7e4ff; !important }
+          .CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}
+          .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%;}
+        </style>
         
         </head>
 
diff --git a/js/stage/stage-view.reel/stage-view.js b/js/stage/stage-view.reel/stage-view.js
index ad67cada..66a18964 100755
--- a/js/stage/stage-view.reel/stage-view.js
+++ b/js/stage/stage-view.reel/stage-view.js
@@ -93,23 +93,27 @@ exports.StageView = Montage.create(Component, {
 
             var documentController = this.application.ninja.documentController;
             doc.editor = CodeMirror.fromTextArea(doc.textArea, {
-                lineNumbers: true,
-                       mode: type,
-                       onChange: function(){
-                           var historySize = doc.editor.historySize();
-                           if(historySize.undo>0){
-                                doc.needsSave = true;
-                           }else if(historySize.undo===0 && historySize.redo>0){
-                               doc.needsSave = false;
-                           }
-                       },
-                       onCursorActivity: function() {
-                           //documentController._codeEditor.editor.setLineClass(documentController._codeEditor.hline, null);
-                           //documentController._codeEditor.hline = documentController._codeEditor.editor.setLineClass(documentController._codeEditor.editor.getCursor().line, "activeline");
+                   lineNumbers: true,
+                   lineWrapping: true,
+                   matchBrackets:true,
+                   mode: type,
+                   onChange: function(){
+                       var historySize = doc.editor.historySize();
+                       if(historySize.undo>0){
+                            doc.needsSave = true;
+                       }else if(historySize.undo===0 && historySize.redo>0){
+                           doc.needsSave = false;
                        }
+                   },
+                   onCursorActivity: function() {
+                       doc.editor.matchHighlight("CodeMirror-matchhighlight");
+                       doc.editor.setLineClass(doc.editor.hline, null);
+                       doc.editor.hline = doc.editor.setLineClass(doc.editor.getCursor().line, "activeline");
+                   }
            });
 
-           //this.application.ninja.documentController._codeEditor.hline = this.application.ninja.documentController._codeEditor.editor.setLineClass(0, "activeline");
+            doc.editor.hline = doc.editor.setLineClass(0, "activeline");
+
             this.application.ninja.stage._scrollFlag = false;    // TODO HACK to prevent type error on Hide/Show Iframe
             this.application.ninja.documentController.activeDocument = doc;
             this.application.ninja.stage.hideCanvas(true);