aboutsummaryrefslogtreecommitdiff
path: root/js/code-editor/ui/code-editor-view-options.reel
diff options
context:
space:
mode:
authorPushkar Joshi2012-05-22 13:22:26 -0700
committerPushkar Joshi2012-05-22 13:22:26 -0700
commit01dbc1f329a95bc7e3b93224543d88ad5bdbd315 (patch)
treeceb527713554f506c537168e36a10452cd09ad10 /js/code-editor/ui/code-editor-view-options.reel
parentb9262c831952e77135b79c2de7c455d5e7ff0589 (diff)
parentc37a876b373ddc7cb19277aaeaa6bb2d2d5a50ac (diff)
downloadninja-01dbc1f329a95bc7e3b93224543d88ad5bdbd315.tar.gz
Merge branch 'master' into brushtool
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.css112
-rw-r--r--js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.html87
-rw-r--r--js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.js79
3 files changed, 278 insertions, 0 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
new file mode 100644
index 00000000..6130382b
--- /dev/null
+++ b/js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.css
@@ -0,0 +1,112 @@
1/* <copyright>
2 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3 No 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.viewOptions{
8 color:#F7F7F7;
9 font-size:12px;
10}
11
12.viewOptions div{
13 display:inline;
14}
15
16.viewOptions .autoCodeComplete{
17 float:left;
18 height: 20px;
19}
20
21.viewOptions .autoCodeComplete span{
22 vertical-align: middle;
23}
24
25.viewOptions .autoCodeComplete .disabled{
26 color:#515151;
27}
28
29.viewOptions .floatButtons{
30 float:left;
31 font-size:9px;
32 padding-left: 20px;
33}
34
35.viewOptions .format{
36 float:left;
37 margin-left:5px;
38 height: 20px;
39}
40
41.viewOptions .themeOptions{
42 float: right;
43 margin-right:5px;
44}
45
46.viewOptions .themeOptions select{
47 background-color: #616161;
48 color: white;
49 font-size:9px;
50 margin-top:2px;
51 border-color: #616161;
52}
53
54.viewOptions .themeOptions select option{
55 background-color: #616161;
56 color: white;
57 border-color: #616161;
58}
59
60.viewOptions .shortKeys{
61 float: right;
62 margin-right:30px;
63 border: 1px solid #616161;
64 border-radius: 6px;
65 padding-left: 5px;
66 padding-right: 5px;
67 cursor:pointer;
68 position:relative;
69}
70
71.viewOptions .shortKeys .dropdownArrow{
72 font-size: 0.7em;
73 color:#d1d1d1;
74}
75
76.viewOptions .shortKeys .list{
77 position:absolute;
78 border: 1px solid #616161;
79 bottom: 16px;
80 left: -2px;
81 opacity: 1;
82 white-space: nowrap;
83 padding:5px;
84 background-color: #313131;
85 width:200px;
86 cursor: text;
87}
88
89.viewOptions .shortKeys .list div{
90 display: block;
91}
92
93.viewOptions .shortKeys .hide{
94 visibility: hidden;
95}
96
97.viewOptions .shortKeys .show{
98 visibility: visible;
99}
100
101.viewOptions .shortKeys div{
102 padding:2px;
103}
104
105.viewOptions .shortKey{
106 font-style: italic;
107 color: #d1d1d1;
108}
109
110.viewOptions .shortKeyDesc{
111 float:right;
112} \ No newline at end of file
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
new file mode 100644
index 00000000..14d6cb55
--- /dev/null
+++ b/js/code-editor/ui/code-editor-view-options.reel/code-editor-view-options.html
@@ -0,0 +1,87 @@
1<!DOCTYPE HTML>
2<!-- <copyright>
3 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
4 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
5 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
6 </copyright> -->
7<html>
8<head>
9 <meta http-equiv="content-type" content="text/html; charset=utf-8" />
10 <link rel="stylesheet" type="text/css" href="code-editor-view-options.css">
11 <script type="text/montage-serialization">
12 {
13 "codeCompleteCheck":{
14 "prototype": "montage/ui/checkbox.reel",
15 "properties": {
16 "element": {"#": "codeComplete"}
17 }
18 },
19
20 "zoomHottext": {
21 "prototype": "js/components/hottextunit.reel[HotTextUnit]",
22 "properties": {
23 "element": {"#": "zoomFont"},
24 "minValue":100,
25 "maxValue" :200,
26 "stepSize" :10,
27 "acceptableUnits" : ["%"],
28 "units" : "%"
29 }
30 },
31
32 "owner":{
33 "prototype": "js/code-editor/ui/code-editor-view-options.reel[CodeEditorViewOptions]",
34 "properties": {
35 "element": {"#": "viewOptions"},
36 "codeCompleteCheck":{"@": "codeCompleteCheck"},
37 "zoomHottext":{"@":"zoomHottext"},
38 "comment":{"#":"comment"},
39 "uncomment":{"#":"uncomment"},
40 "themeSelect":{"#":"themeSelect"},
41 "shortKeys":{"#":"shortKeys"}
42 }
43 }
44 }
45 </script>
46</head>
47<body>
48<div data-montage-id="viewOptions" class="viewOptions">
49 <div>
50 <input class="zoomFont" data-montage-id="zoomFont"/>
51 <div class="autoCodeComplete" >
52 <input type="checkbox" data-montage-id="codeComplete" />
53 <span>Automatic Completion</span>
54 </div>
55 <div class="floatButtons">
56 <!--<button disabled="disabled" id="format" value="format" class="nj-skinned format">Format</button>-->
57 <button data-montage-id="comment" value="comment" class="nj-skinned format">comment</button>
58 <button data-montage-id="uncomment" value="uncomment" class="nj-skinned format">uncomment</button>
59 </div>
60 <div class="themeOptions">
61 <span>Theme :</span>
62 <select data-montage-id="themeSelect">
63 <option value="default" selected="">DEFAULT</option>
64 <option value="night">NIGHT</option>
65 <option value="monokai" >MONOKAI</option>
66 <option value="neat" >NEAT</option>
67 <option value="elegant" >ELEGANT</option>
68 <option value="cobalt" >COBALT</option>
69 <option value="eclipse" >ECLIPSE</option>
70 <option value="rubyblue" >RUBYBLUE</option>
71 <option value="lesser-dark" >LESSER-DARK</option>
72 <option value="xq-dark" >XQ-DARK</option>
73 </select>
74 </div>
75 <div data-montage-id="shortKeys" class="shortKeys">
76 <div class="list hide">
77 <div><span class="shortKey">ctrl+space :</span> <span class="shortKeyDesc">code hints</span></div>
78 <div><span class="shortKey">ctrl+/ :</span> <span class="shortKeyDesc">comment selection</span></div>
79 <div><span class="shortKey">ctrl+shift+/ :</span> <spa