aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rwxr-xr-xcss/ninja.css2
-rwxr-xr-xindex.html11
-rwxr-xr-xjs/components/layout/document-bar.reel/document-bar.js2
-rw-r--r--js/controllers/code-editor-controller.js79
-rwxr-xr-xjs/ninja.reel/ninja.html6
-rwxr-xr-xjs/stage/stage-view.reel/stage-view.css24
-rwxr-xr-xjs/stage/stage-view.reel/stage-view.js156
-rw-r--r--scss/imports/scss/_Stage.scss2
8 files changed, 129 insertions, 153 deletions
diff --git a/css/ninja.css b/css/ninja.css
index 650f3b08..6c198b8e 100755
--- a/css/ninja.css
+++ b/css/ninja.css
@@ -212,7 +212,7 @@ body { position: absolute; margin: 0px; width: 100%; height: 100%; background-co
212 212
213#mainContent .CodeMirror { width: 100%; height: 100%; background: white; } 213#mainContent .CodeMirror { width: 100%; height: 100%; background: white; }
214 214
215#mainContent .CodeMirror-scroll { height: 100%; overflow: scroll; overflow-x: auto; overflow-y: auto; } 215#mainContent .CodeMirror-scroll { height: 100%; overflow: scroll; overflow-x: auto; overflow-y: hidden; }
216 216
217.montage-editor-frame { position: absolute; z-index: 7; top: 0; left: 0; display: none; -webkit-user-select: initial; } 217.montage-editor-frame { position: absolute; z-index: 7; top: 0; left: 0; display: none; -webkit-user-select: initial; }
218 218
diff --git a/index.html b/index.html
index 86348459..ed24ccce 100755
--- a/index.html
+++ b/index.html
@@ -207,12 +207,11 @@
207 </script> 207 </script>
208 208
209 <style type="text/css"> 209 <style type="text/css">
210 span.CodeMirror-matchhighlight { background: #e9e9e9 } 210 span.CodeMirror-matchhighlight { background: #e9e9e9 }
211 .CodeMirror-focused span.CodeMirror-matchhighlight { background: #e7e4ff; !important } 211 .CodeMirror-focused span.CodeMirror-matchhighlight { background: #e7e4ff; !important }
212 .activeline {background: #e8f2ff !important;} 212 .activeline {background: #e8f2ff !important;}
213 div.CodeMirror span.CodeMirror-matchingbracket {color: #000;background-color: #ffd500;} 213 div.CodeMirror span.CodeMirror-matchingbracket {color: #000;background-color: #ffd500;}
214 .CodeMirror-scroll {height: auto; overflow-y: hidden; overflow-x: auto; width: 100%;} 214 .CodeMirror-completions select {background-color:#e8f2ff;border:1px solid #c1c1c1;box-shadow: 8px 8px 8px rgba(0, 0, 0, 0.8);}
215 .CodeMirror-completions select {background-color:#e8f2ff;border:1px solid #c1c1c1;box-shadow: 8px 8px 8px rgba(0, 0, 0, 0.8);}
216 </style> 215 </style>
217 216
218 </head> 217 </head>
diff --git a/js/components/layout/document-bar.reel/document-bar.js b/js/components/layout/document-bar.reel/document-bar.js
index 4dc39fd6..27402dff 100755
--- a/js/components/layout/document-bar.reel/document-bar.js
+++ b/js/components/layout/document-bar.reel/document-bar.js
@@ -100,7 +100,7 @@ exports.DocumentBar = Montage.create(Component, {
100 if(event._event.target.id === this.currentView) return; 100 if(event._event.target.id === this.currentView) return;
101 101
102 this.currentView = event._event.target.id; 102 this.currentView = event._event.target.id;
103 this.application.ninja.documentController.stage.stageView.switchViews(event._event.target.id);//switch between design view 103 this.application.ninja.documentController.stage.stageView.switchDesignDocViews(event._event.target.id);//switch between design view
104 } 104 }
105 }, 105 },
106 106
diff --git a/js/controllers/code-editor-controller.js b/js/controllers/code-editor-controller.js
new file mode 100644
index 00000000..23bd9279
--- /dev/null
+++ b/js/controllers/code-editor-controller.js
@@ -0,0 +1,79 @@
1/* <copyright>
2This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5</copyright> */
6
7////////////////////////////////////////////////////////////////////////
8//
9var Montage = require("montage/core/core").Montage,
10 Component = require("montage/ui/component").Component;
11
12var CodeEditorController = exports.CodeEditorController = Montage.create(Component, {
13 hasTemplate: {
14 value: false
15 },
16
17 _codeEditor : {
18 value:null
19 },
20
21 codeEditor:{
22 get: function(){return this._codeEditor;},
23 set: function(value){this._codeEditor = value;}
24 },
25
26 deserializedFromTemplate: {
27 value: function() {
28 //TODO:add logic to check some configuration file to load the right code editor
29 this.codeEditor = CodeMirror;
30 }
31 },
32
33 createEditor : {
34 value:function(doc, type){
35 var self = this;
36 var editor = self.codeEditor.fromTextArea(doc.textArea, {
37 lineNumbers: true,
38 matchBrackets:true,
39 mode: type,
40 onChange: function(){
41 var historySize = doc.editor.historySize();
42 if(historySize.undo>0){
43 doc.needsSave = true;
44 }else if(historySize.undo===0 && historySize.redo>0){
45 doc.needsSave = false;
46 }
47 },
48 onCursorActivity: function() {
49 doc.editor.matchHighlight("CodeMirror-matchhighlight");
50 doc.editor.setLineClass(doc.editor.hline, null, null);
51 doc.editor.hline = doc.editor.setLineClass(doc.editor.getCursor().line, null, "activeline");
52 },
53 //extraKeys: {"Ctrl-Space": function(cm) {CodeMirror.simpleHint(cm, CodeMirror.javascriptHint);}}
54 onKeyEvent: function(cm, keyEvent) {
55 if((keyEvent.type === "keyup")//need seperate keycode set per mode
56 && ((keyEvent.keyCode > 47 && keyEvent.keyCode < 57)//numbers
57 || (keyEvent.keyCode > 64 && keyEvent.keyCode <91)//letters
58 || (keyEvent.keyCode === 190)//period
59 || (keyEvent.keyCode === 189)//underscore, dash
60 )
61 && !( (keyEvent.keyCode === 219)//open bracket [
62 || (keyEvent.keyCode === 221)//close bracket ]
63 || (keyEvent.shiftKey && keyEvent.keyCode === 219)//open bracket {
64 || (keyEvent.shiftKey && keyEvent.keyCode === 221)//close bracket }
65 || (keyEvent.shiftKey && keyEvent.keyCode === 57)//open bracket (
66 || (keyEvent.shiftKey && keyEvent.keyCode === 48)//close bracket )
67 )
68 ){
69
70 self.codeEditor.simpleHint(cm, self.codeEditor.javascriptHint);
71 }
72 }
73 });
74
75 return editor;
76 }
77 }
78
79}); \ No newline at end of file
diff --git a/js/ninja.reel/ninja.html b/js/ninja.reel/ninja.html
index ead7f576..5862cf61 100755
--- a/js/ninja.reel/ninja.html
+++ b/js/ninja.reel/ninja.html
@@ -348,6 +348,11 @@
348 } 348 }
349 }, 349 },
350 350
351 "codeEditorController": {
352 "module": "js/controllers/code-editor-controller",
353 "name": "CodeEditorController"
354 },
355
351 "owner": { 356 "owner": {
352 "module": "js/ninja.reel", 357 "module": "js/ninja.reel",
353 "name": "Ninja", 358 "name": "Ninja",
@@ -377,6 +382,7 @@
377 "ioMediator": {"@": "ioMediator"}, 382 "ioMediator": {"@": "ioMediator"},
378 "timeline": {"@": "timeline"}, 383 "timeline": {"@": "timeline"},
379 "mainMenuController": {"@": "mainMenuController"}, 384 "mainMenuController": {"@": "mainMenuController"},
385 "codeEditorController": {"@": "codeEditorController"},
380 "rightPanelContainer": {"#": "rightPanelContainer" }, 386 "rightPanelContainer": {"#": "rightPanelContainer" },
381 "panelSplitter": {"@": "splitter3"}, 387 "panelSplitter": {"@": "splitter3"},
382 "timelineSplitter": {"@": "splitter4"} 388 "timelineSplitter": {"@": "splitter4"}
diff --git a/js/stage/stage-view.reel/stage-view.css b/js/stage/stage-view.reel/stage-view.css
index ce7072c7..372af144 100755
--- a/js/stage/stage-view.reel/stage-view.css
+++ b/js/stage/stage-view.reel/stage-view.css
@@ -23,15 +23,17 @@
23} 23}
24*/ 24*/
25 25
26.CodeMirror { 26/*.CodeMirror {*/
27 width: 100%; 27 /*width: 100%;*/
28 height: 100%; 28 /*height: 100%;*/
29 background: white; 29 /*background: white;*/
30} 30/*}*/
31
32/*.CodeMirror .CodeMirror-scroll {*/
33 /*height: 100%;*/
34 /*overflow: scroll;*/
35 /*overflow-x: auto;*/
36 /*overflow-y: auto;*/
37/*}*/
38
31 39
32.CodeMirror .CodeMirror-scroll {
33 height: 100%;
34 overflow: scroll;
35 overflow-x: auto;
36 overflow-y: auto;
37}
diff --git a/js/stage/stage-view.reel/stage-view.js b/js/stage/stage-view.reel/stage-view.js
index 917cbeb5..bfbee2b6 100755
--- a/js/stage/stage-view.reel/stage-view.js
+++ b/js/stage/stage-view.reel/stage-view.js
@@ -52,12 +52,11 @@ exports.StageView = Montage.create(Component, {
52 }, 52 },
53 53
54 /** 54 /**
55 * Creates a text area which will contain the content of the opened text document. 55 * Public method
56 * Creates a textarea element which will contain the content of the opened text document.
56 */ 57 */
57 createTextAreaElement: { 58 createTextAreaElement: {
58 value: function(uuid) { 59 value: function(uuid) {
59
60
61 var codeMirrorDiv = document.createElement("div"); 60 var codeMirrorDiv = document.createElement("div");
62 codeMirrorDiv.id = "codeMirror_" + uuid; 61 codeMirrorDiv.id = "codeMirror_" + uuid;
63 codeMirrorDiv.style.display = "block"; 62 codeMirrorDiv.style.display = "block";
@@ -66,19 +65,22 @@ exports.StageView = Montage.create(Component, {
66 var textArea = document.createElement("textarea"); 65 var textArea = document.createElement("textarea");
67 textArea.id = "code"; 66 textArea.id = "code";
68 textArea.name = "code"; 67 textArea.name = "code";
69
70 codeMirrorDiv.appendChild(textArea); 68 codeMirrorDiv.appendChild(textArea);
71 69
72 return textArea; 70 return textArea;
73 } 71 }