diff options
author | Armen Kesablyan | 2012-05-08 16:43:43 -0700 |
---|---|---|
committer | Armen Kesablyan | 2012-05-08 16:43:43 -0700 |
commit | dc075ffcc6dd03c090d90fad999eee9b924d56ee (patch) | |
tree | 867f8bdd588c8f9076979233ca46a688ff70523e /js/stage | |
parent | 5d7e470351fd150d5e70a97332fa2f2553797499 (diff) | |
parent | 4d949f141247215b5f2a6ec0cfc7d2d31cf2bb1f (diff) | |
download | ninja-dc075ffcc6dd03c090d90fad999eee9b924d56ee.tar.gz |
Merge branch 'refs/heads/dom-architecture' into binding
Conflicts:
js/components/layout/tools-properties.reel/tools-properties.html
Signed-off-by: Armen Kesablyan <armen@motorola.com>
Diffstat (limited to 'js/stage')
-rwxr-xr-x | js/stage/layout.js | 2 | ||||
-rwxr-xr-x | js/stage/stage-view.reel/stage-view.css | 46 | ||||
-rwxr-xr-x | js/stage/stage-view.reel/stage-view.js | 192 | ||||
-rwxr-xr-x | js/stage/stage.reel/stage.html | 14 | ||||
-rwxr-xr-x | js/stage/stage.reel/stage.js | 15 |
5 files changed, 139 insertions, 130 deletions
diff --git a/js/stage/layout.js b/js/stage/layout.js index 0a76dbe5..9c5e2167 100755 --- a/js/stage/layout.js +++ b/js/stage/layout.js | |||
@@ -156,7 +156,7 @@ exports.Layout = Montage.create(Component, { | |||
156 | drawTagOutline: { | 156 | drawTagOutline: { |
157 | value: function (item) { | 157 | value: function (item) { |
158 | 158 | ||
159 | if(!item || (item.nodeType !== 1)) return; | 159 | if(!item || !this.application.ninja.selectionController.isNodeTraversable(item)) return; |
160 | 160 | ||
161 | // TODO Bind the layoutview mode to the current document | 161 | // TODO Bind the layoutview mode to the current document |
162 | // var mode = this.application.ninja.currentDocument.layoutMode; | 162 | // var mode = this.application.ninja.currentDocument.layoutMode; |
diff --git a/js/stage/stage-view.reel/stage-view.css b/js/stage/stage-view.reel/stage-view.css index ce7072c7..e2c4bb0e 100755 --- a/js/stage/stage-view.reel/stage-view.css +++ b/js/stage/stage-view.reel/stage-view.css | |||
@@ -14,7 +14,11 @@ | |||
14 | width: 100%; | 14 | width: 100%; |
15 | height: 100%; | 15 | height: 100%; |
16 | overflow:auto; | 16 | overflow:auto; |
17 | /*display: none;*/ | 17 | cursor:text; |
18 | } | ||
19 | |||
20 | .codeViewContainer>div{ | ||
21 | width:2500px;/*to prevent scrolling of editor container in the middle of the page for short files*/ | ||
18 | } | 22 | } |
19 | 23 | ||
20 | /* OLD CSS for reference | 24 | /* OLD CSS for reference |
@@ -23,15 +27,33 @@ | |||
23 | } | 27 | } |
24 | */ | 28 | */ |
25 | 29 | ||
26 | .CodeMirror { | 30 | /*.CodeMirror {*/ |
27 | width: 100%; | 31 | /*width: 100%;*/ |
28 | height: 100%; | 32 | /*height: 100%;*/ |
29 | background: white; | 33 | /*background: white;*/ |
30 | } | 34 | /*}*/ |
31 | 35 | ||
32 | .CodeMirror .CodeMirror-scroll { | 36 | /*.CodeMirror .CodeMirror-scroll {*/ |
33 | height: 100%; | 37 | /*height: 100%;*/ |
34 | overflow: scroll; | 38 | /*overflow: scroll;*/ |
35 | overflow-x: auto; | 39 | /*overflow-x: auto;*/ |
36 | overflow-y: auto; | 40 | /*overflow-y: auto;*/ |
37 | } | 41 | /*}*/ |
42 | |||
43 | |||
44 | span.CodeMirror-matchhighlight { background: #e9e9e9 } | ||
45 | .CodeMirror-focused span.CodeMirror-matchhighlight { background: #e7e4ff; !important } | ||
46 | div.CodeMirror span.CodeMirror-matchingbracket {color: #000 !important;background-color: #ffd500;} | ||
47 | .CodeMirror-completions select {background-color:#e8f2ff;border:1px solid #c1c1c1;box-shadow: 8px 8px 8px rgba(0, 0, 0, 0.8);} | ||
48 | .CodeMirror-completions {z-index:6001 !important;} | ||
49 | |||
50 | .cm-s-default .activeline {background: #e8f2ff; !important} | ||
51 | .cm-s-eclipse .activeline {background: #e8f2ff; !important} | ||
52 | .cm-s-elegant .activeline {background: #e8f2ff; !important} | ||
53 | .cm-s-neat .activeline {background: #e8f2ff; !important} | ||
54 | .cm-s-night .activeline {background: #8da6ce; !important} | ||
55 | .cm-s-cobalt .activeline {background: #8da6ce; !important} | ||
56 | .cm-s-monokai .activeline {background: #8da6ce; !important} | ||
57 | .cm-s-rubyblue .activeline {background: #3E7087; !important} | ||
58 | .cm-s-lesser-dark .activeline {background: #8da6ce; !important} | ||
59 | .cm-s-xq-dark .activeline {background: #8da6ce; !important} \ No newline at end of file | ||
diff --git a/js/stage/stage-view.reel/stage-view.js b/js/stage/stage-view.reel/stage-view.js index 1f471431..518c3bdd 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 | } |
74 | }, | 72 | }, |
75 | 73 | ||
76 | // Temporary function to create a Codemirror text view | 74 | /** |
75 | * Public method | ||
76 | * Creates a new instance of a code editor | ||
77 | */ | ||
77 | createTextView: { | 78 | createTextView: { |
78 | value: function(doc) { | 79 | value: function(doc) { |
80 | var type; | ||
79 | this.application.ninja.documentController._hideCurrentDocument(); | 81 | this.application.ninja.documentController._hideCurrentDocument(); |
80 | this.hideOtherDocuments(doc.uuid); | 82 | this.hideOtherDocuments(doc.uuid); |
81 | var type; | 83 | |
82 | switch(doc.documentType) { | 84 | switch(doc.documentType) { |
83 | case "css" : | 85 | case "css" : |
84 | type = "css"; | 86 | type = "css"; |
@@ -86,43 +88,51 @@ exports.StageView = Montage.create(Component, { | |||
86 | case "js" : | 88 | case "js" : |
87 | type = "javascript"; | 89 | type = "javascript"; |
88 | break; | 90 | break; |
91 | case "html" : | ||
92 | type = "htmlmixed"; | ||
93 | break; | ||
94 | case "json" : | ||
95 | type = "javascript"; | ||
96 | break; | ||
97 | case "php" : | ||
98 | type = "php"; | ||
99 | break; | ||
100 | case "pl" : | ||
101 | type = "perl"; | ||
102 | break; | ||
103 | case "py" : | ||
104 | type = "python"; | ||
105 | break; | ||
106 | case "rb" : | ||
107 | type = "ruby"; | ||
108 | break; | ||
109 | case "xml" : | ||
110 | type = "xml"; | ||
111 | break; | ||
89 | } | 112 | } |
90 | |||
91 | //fix hack | ||
92 | document.getElementById("codeMirror_"+doc.uuid).style.display="block"; | 113 | document.getElementById("codeMirror_"+doc.uuid).style.display="block"; |
93 | 114 | ||
94 | var documentController = this.application.ninja.documentController; | 115 | doc.editor = this.application.ninja.codeEditorController.createEditor(doc, type, doc.documentType); |
95 | doc.editor = CodeMirror.fromTextArea(doc.textArea, { | 116 | doc.editor.hline = doc.editor.setLineClass(0, "activeline"); |
96 | lineNumbers: true, | 117 | |
97 | mode: type, | ||
98 | onChange: function(){ | ||
99 | var historySize = doc.editor.historySize(); | ||
100 | if(historySize.undo>0){ | ||
101 | doc.needsSave = true; | ||
102 | }else if(historySize.undo===0 && historySize.redo>0){ | ||
103 | doc.needsSave = false; | ||
104 | } | ||
105 | }, | ||
106 | onCursorActivity: function() { | ||
107 | //documentController._codeEditor.editor.setLineClass(documentController._codeEditor.hline, null); | ||
108 | //documentController._codeEditor.hline = documentController._codeEditor.editor.setLineClass(documentController._codeEditor.editor.getCursor().line, "activeline"); | ||
109 | } | ||
110 | }); | ||
111 | |||
112 | //this.application.ninja.documentController._codeEditor.hline = this.application.ninja.documentController._codeEditor.editor.setLineClass(0, "activeline"); | ||
113 | this.application.ninja.stage._scrollFlag = false; // TODO HACK to prevent type error on Hide/Show Iframe | 118 | this.application.ninja.stage._scrollFlag = false; // TODO HACK to prevent type error on Hide/Show Iframe |
114 | this.application.ninja.documentController.activeDocument = doc; | 119 | this.application.ninja.documentController.activeDocument = doc; |
115 | this.application.ninja.stage.hideCanvas(true); | 120 | this.application.ninja.stage.hideCanvas(true); |
116 | |||
117 | document.getElementById("iframeContainer").style.display="none";//hide the iframe when switching to code view | 121 | document.getElementById("iframeContainer").style.display="none";//hide the iframe when switching to code view |
122 | |||
123 | this.showCodeViewBar(true); | ||
124 | this.application.ninja.codeEditorController.applySettings(); | ||
125 | this.collapseAllPanels(); | ||
118 | } | 126 | } |
119 | }, | 127 | }, |
120 | 128 | ||
121 | //called for switching between html documents | 129 | /** |
130 | * Public method | ||
131 | * Switches between documents. Document state data is saved and restored whereever applicable | ||
132 | */ | ||
122 | switchDocument:{ | 133 | switchDocument:{ |
123 | value: function(doc){ | 134 | value: function(doc){ |
124 | this.application.ninja.documentController._hideCurrentDocument(); | 135 | this.application.ninja.documentController._hideCurrentDocument(); |
125 | |||
126 | this.application.ninja.documentController.activeDocument = doc; | 136 | this.application.ninja.documentController.activeDocument = doc; |
127 | 137 | ||
128 | if(this.application.ninja.documentController.activeDocument.currentView === "design") { | 138 | if(this.application.ninja.documentController.activeDocument.currentView === "design") { |
@@ -131,62 +141,37 @@ exports.StageView = Montage.create(Component, { | |||
131 | 141 | ||
132 | this.application.ninja.stage._scrollFlag = false; // TODO HACK to prevent type error on Hide/Show Iframe | 142 | this.application.ninja.stage._scrollFlag = false; // TODO HACK to prevent type error on Hide/Show Iframe |
133 | this.application.ninja.documentController._showCurrentDocument(); | 143 | this.application.ninja.documentController._showCurrentDocument(); |
134 | 144 | //focus editor | |