aboutsummaryrefslogtreecommitdiff
path: root/js
diff options
context:
space:
mode:
authorAnanya Sen2012-04-17 18:10:39 -0700
committerAnanya Sen2012-04-17 18:10:39 -0700
commit1f891c58bad0b7746659aa4138001b5ee76d9a0e (patch)
tree758357769219036daed4797f6474b1a57063c410 /js
parent2449fc403e8a8a22f092c87e3268a69a2be67e43 (diff)
downloadninja-1f891c58bad0b7746659aa4138001b5ee76d9a0e.tar.gz
added theme choices for editor
Signed-off-by: Ananya Sen <Ananya.Sen@motorola.com>
Diffstat (limited to 'js')
-rw-r--r--js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.css30
-rw-r--r--js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.html20
-rw-r--r--js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.js14
-rw-r--r--js/controllers/code-editor-controller.js12
4 files changed, 69 insertions, 7 deletions
diff --git a/js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.css b/js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.css
index 90cf88d3..91054fb9 100644
--- a/js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.css
+++ b/js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.css
@@ -7,8 +7,36 @@
7 display:inline; 7 display:inline;
8} 8}
9 9
10.viewOptions .autoCodeComplete{
11 float:left;
12}
13
14.viewOptions .floatButtons{
15 float:left;
16 font-size:9px;
17 padding-left: 20px;
18}
19
10.viewOptions .format{ 20.viewOptions .format{
11 float:right; 21 float:left;
22 margin-left:5px;
23}
24
25.viewOptions .themeOptions{
26 float: right;
27}
28
29.viewOptions .themeOptions select{
30 background-color: #616161;
31 color: white;
12 font-size:9px; 32 font-size:9px;
33 margin-top:2px;
34 border-color: #616161;
35}
36
37.viewOptions .themeOptions select option{
38 background-color: #616161;
39 color: white;
40 border-color: #616161;
13} 41}
14 42
diff --git a/js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.html b/js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.html
index 6698baa9..4a6cfa59 100644
--- a/js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.html
+++ b/js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.html
@@ -39,7 +39,8 @@
39 "zoomHottext":{"@":"zoomHottext"}, 39 "zoomHottext":{"@":"zoomHottext"},
40 "format":{"#": "format"}, 40 "format":{"#": "format"},
41 "comment":{"#":"comment"}, 41 "comment":{"#":"comment"},
42 "uncomment":{"#":"uncomment"} 42 "uncomment":{"#":"uncomment"},
43 "themeSelect":{"#":"themeSelect"}
43 } 44 }
44 } 45 }
45 } 46 }
@@ -54,10 +55,25 @@
54 <span>Automatic Completion</span> 55 <span>Automatic Completion</span>
55 </div> 56 </div>
56 <div class="floatButtons"> 57 <div class="floatButtons">
57 <!--<button id="format" value="format" class="nj-skinned format">Format</button>--> 58 <button id="format" value="format" class="nj-skinned format">Format</button>
58 <button id="comment" value="comment" class="nj-skinned format">comment</button> 59 <button id="comment" value="comment" class="nj-skinned format">comment</button>
59 <button id="uncomment" value="uncomment" class="nj-skinned format">uncomment</button> 60 <button id="uncomment" value="uncomment" class="nj-skinned format">uncomment</button>
60 </div> 61 </div>
62 <div class="themeOptions">
63 <span>Theme</span>
64 <select id="themeSelect">
65 <option value="default" selected="">DEFAULT</option>
66 <option value="night">NIGHT</option>
67 <option value="monokai" >MONOKAI</option>
68 <option value="neat" >NEAT</option>
69 <option value="elegant" >ELEGANT</option>
70 <option value="cobalt" >COBALT</option>
71 <option value="eclipse" >ECLIPSE</option>
72 <option value="rubyblue" >RUBYBLUE</option>
73 <option value="lesser-dark" >LESSER-DARK</option>
74 <option value="xq-dark" >XQ-DARK</option>
75 </select>
76 </div>
61 </div> 77 </div>
62</div> 78</div>
63</body> 79</body>
diff --git a/js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.js b/js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.js
index a381ae2a..0625dad9 100644
--- a/js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.js
+++ b/js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.js
@@ -45,24 +45,32 @@ var CodeEditorViewOptions = exports.CodeEditorViewOptions = Montage.create(Compo
45 this.format.addEventListener("click", this.handleFormat.bind(this), false); 45 this.format.addEventListener("click", this.handleFormat.bind(this), false);
46 this.comment.addEventListener("click", this.handleComment.bind(this), false); 46 this.comment.addEventListener("click", this.handleComment.bind(this), false);
47 this.uncomment.addEventListener("click", this.handleUncomment.bind(this), false); 47 this.uncomment.addEventListener("click", this.handleUncomment.bind(this), false);
48 this.themeSelect.addEventListener("change", this.handleThemeSelection.bind(this), false);
48 } 49 }
49 }, 50 },
50 51
51 handleFormat:{ 52 handleFormat:{
52 value: function(){ 53 value: function(evt){
53 this.application.ninja.codeEditorController.autoFormatSelection(); 54 this.application.ninja.codeEditorController.autoFormatSelection();
54 } 55 }
55 }, 56 },
56 handleComment:{ 57 handleComment:{
57 value: function(){ 58 value: function(evt){
58 this.application.ninja.codeEditorController.commentSelection(true); 59 this.application.ninja.codeEditorController.commentSelection(true);
59 } 60 }
60 }, 61 },
61 62
62 handleUncomment:{ 63 handleUncomment:{
63 value: function(){ 64 value: function(evt){
64 this.application.ninja.codeEditorController.commentSelection(false); 65 this.application.ninja.codeEditorController.commentSelection(false);
65 } 66 }
67 },
68
69 handleThemeSelection:{
70 value: function(evt){
71 var theme = this.themeSelect.options[this.themeSelect.selectedIndex].value;
72 this.application.ninja.codeEditorController.handleThemeSelection(theme);
73 }
66 } 74 }
67 75
68}); \ No newline at end of file 76}); \ No newline at end of file
diff --git a/js/controllers/code-editor-controller.js b/js/controllers/code-editor-controller.js
index 52eb47eb..cf0503a0 100644
--- a/js/controllers/code-editor-controller.js
+++ b/js/controllers/code-editor-controller.js
@@ -49,9 +49,13 @@ var CodeEditorController = exports.CodeEditorController = Montage.create(Compone
49 editorFont:{ 49 editorFont:{
50 get: function(){return this._editorFont;}, 50 get: function(){return this._editorFont;},
51 set: function(value){//gets a zoom % 51 set: function(value){//gets a zoom %
52 var codeLineElems = null, i=0;
52 this._editorFont = (value/100) * CodeEditorController.originalEditorFont; 53 this._editorFont = (value/100) * CodeEditorController.originalEditorFont;
53 //set the font size 54 //set the font size
54 document.getElementsByClassName("codeViewContainer")[0].style.fontSize = ""+this._editorFont+"px"; 55 codeLineElems = document.getElementsByClassName("CodeMirror-lines");
56 for(i=0;i<codeLineElems.length;i++){
57 codeLineElems[i].style.fontSize = ""+this._editorFont+"px";
58 }
55 } 59 }
56 }, 60 },
57 61
@@ -182,6 +186,12 @@ var CodeEditorController = exports.CodeEditorController = Montage.create(Compone
182 var range = this.getSelectedRange(this.application.ninja.documentController.activeDocument.editor); 186 var range = this.getSelectedRange(this.application.ninja.documentController.activeDocument.editor);
183 this.application.ninja.documentController.activeDocument.editor.commentRange(isComment, range.from, range.to); 187 this.application.ninja.documentController.activeDocument.editor.commentRange(isComment, range.from, range.to);
184 } 188 }
189 },
190
191 handleThemeSelection:{
192 value: function(theme){
193 this.application.ninja.documentController.activeDocument.editor.setOption("theme", theme);
194 }
185 } 195 }
186 196
187}); \ No newline at end of file 197}); \ No newline at end of file