diff options
author | Ananya Sen | 2012-07-23 17:01:14 -0700 |
---|---|---|
committer | Ananya Sen | 2012-07-23 17:01:14 -0700 |
commit | 48d9ed19573a07c68da305d14ca6ab3a04d31d64 (patch) | |
tree | b4bf6c48c7fdade2cf531d84cac3359489d38405 /js/ui/menu/menu-item.reel/menu-item.js | |
parent | c07a7a9d11bc8299fa9686544b18840cc8e640c2 (diff) | |
parent | afc7ad4f240fdf7890a79c2d4d7f8eb2e7c30a34 (diff) | |
download | ninja-48d9ed19573a07c68da305d14ca6ab3a04d31d64.tar.gz |
Merge branch 'refs/heads/Jose-Document' into Document
Diffstat (limited to 'js/ui/menu/menu-item.reel/menu-item.js')
-rwxr-xr-x | js/ui/menu/menu-item.reel/menu-item.js | 208 |
1 files changed, 208 insertions, 0 deletions
diff --git a/js/ui/menu/menu-item.reel/menu-item.js b/js/ui/menu/menu-item.reel/menu-item.js new file mode 100755 index 00000000..97f13d13 --- /dev/null +++ b/js/ui/menu/menu-item.reel/menu-item.js | |||
@@ -0,0 +1,208 @@ | |||
1 | /* <copyright> | ||
2 | Copyright (c) 2012, Motorola Mobility LLC. | ||
3 | All Rights Reserved. | ||
4 | |||
5 | Redistribution and use in source and binary forms, with or without | ||
6 | modification, are permitted provided that the following conditions are met: | ||
7 | |||
8 | * Redistributions of source code must retain the above copyright notice, | ||
9 | this list of conditions and the following disclaimer. | ||
10 | |||
11 | * Redistributions in binary form must reproduce the above copyright notice, | ||
12 | this list of conditions and the following disclaimer in the documentation | ||
13 | and/or other materials provided with the distribution. | ||
14 | |||
15 | * Neither the name of Motorola Mobility LLC nor the names of its | ||
16 | contributors may be used to endorse or promote products derived from this | ||
17 | software without specific prior written permission. | ||
18 | |||
19 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" | ||
20 | AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE | ||
21 | IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE | ||
22 | ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE | ||
23 | LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR | ||
24 | CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF | ||
25 | SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS | ||
26 | INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN | ||
27 | CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) | ||
28 | ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE | ||
29 | POSSIBILITY OF SUCH DAMAGE. | ||
30 | </copyright> */ | ||
31 | |||
32 | var Montage = require("montage/core/core").Montage; | ||
33 | var Component = require("montage/ui/component").Component; | ||
34 | |||
35 | exports.MenuItem = Montage.create(Component, { | ||
36 | |||
37 | _enabled: { | ||
38 | value: false | ||
39 | }, | ||
40 | |||
41 | enabled: { | ||
42 | get: function() { | ||
43 | return this._enabled; | ||
44 | }, | ||
45 | set: function(value) { | ||
46 | if(value !== this._enabled) { | ||
47 | this._enabled = value; | ||
48 | this.needsDraw = true; | ||
49 | } | ||
50 | } | ||
51 | }, | ||
52 | |||
53 | _label: { | ||
54 | value: null | ||
55 | }, | ||
56 | |||
57 | label: { | ||
58 | get: function() { | ||
59 | return this._label; | ||
60 | }, | ||
61 | set: function(value) { | ||
62 | if(this._label !== value) { | ||
63 | this._label = value; | ||
64 | } | ||
65 | } | ||
66 | }, | ||
67 | |||
68 | _submenu: { | ||
69 | value: false | ||
70 | }, | ||
71 | |||
72 | submenu: { | ||
73 | get: function() { | ||
74 | return this._submenu; | ||
75 | }, | ||
76 | set: function(value) { | ||
77 | if(this._submenu !== value) { | ||
78 | this._submenu = value; | ||
79 | } | ||
80 | } | ||
81 | }, | ||
82 | |||
83 | _entries: { | ||
84 | value: null | ||
85 | }, | ||
86 | |||
87 | entries: { | ||
88 | get: function() { | ||
89 | return this._entries; | ||
90 | }, | ||
91 | set: function(value) { | ||
92 | if(this._entries !== value) { | ||
93 | this._entries = value; | ||
94 | } | ||
95 | } | ||
96 | }, | ||
97 | |||
98 | submenuElement: { | ||
99 | value: null | ||
100 | }, | ||
101 | |||
102 | checkMark: { | ||
103 | value: null | ||
104 | }, | ||
105 | |||
106 | _checked: { | ||
107 | value: null | ||
108 | }, | ||
109 | |||
110 | checked: { | ||
111 | get: function() { | ||
112 | return this._checked; | ||
113 | }, | ||
114 | set: function(value) { | ||
115 | if(this._checked !== value) { | ||
116 | this._checked = value; | ||
117 | this.needsDraw = true; | ||
118 | } | ||
119 | } | ||
120 | }, | ||
121 | |||
122 | _action: { | ||
123 | value: "" | ||
124 | }, | ||
125 | |||
126 | action: { | ||
127 | get: function() { | ||
128 | return this._action; | ||
129 | }, | ||
130 | set: function(value) { | ||
131 | if(this._action !== value) { | ||
132 | this._action = value; | ||
133 | } | ||
134 | } | ||
135 | }, | ||
136 | |||
137 | prepareForDraw: { | ||
138 | value: function() { | ||
139 | // Don't add mouse event if this is a separator | ||
140 | if(this.label === "" ) { | ||
141 | return; | ||
142 | } | ||
143 | |||
144 | this.element.addEventListener("mouseover", this, false); | ||
145 | this.element.addEventListener("mouseout", this, false); | ||
146 | this.element.addEventListener("mouseup", this, true); | ||
147 | } | ||
148 | }, | ||
149 | |||
150 | draw: { | ||
151 | value: function() { | ||
152 | if(this.label === "") { | ||
153 | this.element.classList.add("separatorContainer"); | ||
154 | this.element.innerHTML = "<div class='separator'></div>"; | ||
155 | } | ||
156 | |||
157 | if(this.enabled) { | ||
158 | this.element.classList.remove("disabled"); | ||
159 | } else { | ||
160 | this.element.classList.add("disabled"); | ||
161 | } | ||
162 | |||
163 | |||
164 | if(this.checked) { | ||
165 | this.checkMark.classList.add("checked"); | ||
166 | } else { | ||
167 | this.checkMark.classList.remove("checked"); | ||
168 | } | ||
169 | |||
170 | } | ||
171 | }, | ||
172 | |||
173 | captureMouseup: { | ||
174 | value: function(event) { | ||
175 | if( this.enabled === true && this.submenu === false ) { | ||
176 | if(this.action !== "") { | ||
177 | |||
178 | var menuItemClick = document.createEvent("CustomEvent"); | ||
179 | menuItemClick.initCustomEvent("menuItemClick", true, true, this.action); | ||
180 | this.dispatchEvent(menuItemClick); | ||
181 | |||
182 | } | ||
183 | } | ||
184 | } | ||
185 | }, | ||
186 | |||
187 | handleMouseover: { | ||
188 | value: function() { | ||
189 | if(this.enabled){ | ||
190 | this.element.style.backgroundColor = "#7f7f7f"; | ||
191 | if(this.submenu) { | ||
192 | this.submenuElement.classList.add("show"); | ||
193 | } | ||
194 | } | ||
195 | } | ||
196 | }, | ||
197 | |||
198 | handleMouseout: { | ||
199 | value: function() { | ||
200 | this.element.style.backgroundColor = "#474747"; | ||
201 | |||
202 | if(this.submenu) { | ||
203 | this.submenuElement.classList.remove("show"); | ||
204 | } | ||
205 | } | ||
206 | } | ||
207 | |||
208 | }); | ||