aboutsummaryrefslogtreecommitdiff
path: root/js/code-editor/ui/code-editor-view-options.reel
diff options
context:
space:
mode:
Diffstat (limited to 'js/code-editor/ui/code-editor-view-options.reel')
-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
3 files changed, 58 insertions, 6 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