diff options
Diffstat (limited to 'js/components')
29 files changed, 1424 insertions, 51 deletions
diff --git a/js/components/combobox.reel/combobox.js b/js/components/combobox.reel/combobox.js index a68a7d6b..bc433f52 100644 --- a/js/components/combobox.reel/combobox.js +++ b/js/components/combobox.reel/combobox.js | |||
@@ -15,7 +15,7 @@ exports.Combobox = Montage.create(Component, { | |||
15 | }, | 15 | }, |
16 | 16 | ||
17 | _wasSetByCode: { | 17 | _wasSetByCode: { |
18 | enumerable: false, | 18 | enumerable: true, |
19 | value: true | 19 | value: true |
20 | }, | 20 | }, |
21 | 21 | ||
@@ -27,6 +27,14 @@ exports.Combobox = Montage.create(Component, { | |||
27 | value: null | 27 | value: null |
28 | }, | 28 | }, |
29 | 29 | ||
30 | dataField: { | ||
31 | value: null | ||
32 | }, | ||
33 | |||
34 | dataFunction: { | ||
35 | value: null | ||
36 | }, | ||
37 | |||
30 | _items: { | 38 | _items: { |
31 | value: [] | 39 | value: [] |
32 | }, | 40 | }, |
@@ -71,7 +79,47 @@ exports.Combobox = Montage.create(Component, { | |||
71 | e.value = this._value; | 79 | e.value = this._value; |
72 | this.dispatchEvent(e); | 80 | this.dispatchEvent(e); |
73 | 81 | ||
74 | this._wasSetByCode = false; | 82 | this._wasSetByCode = true; |
83 | } | ||
84 | } | ||
85 | }, | ||
86 | |||
87 | _enabled: { | ||
88 | enumerable: false, | ||
89 | value: true | ||
90 | }, | ||
91 | |||
92 | enabled: { | ||
93 | enumerable: true, | ||
94 | serializable: true, | ||
95 | get: function() { | ||
96 | return this._enabled; | ||
97 | }, | ||
98 | set: function(value) { | ||
99 | if(value !== this._enabled) | ||
100 | { | ||
101 | this._enabled = value; | ||
102 | this.needsDraw = true; | ||
103 | } | ||
104 | } | ||
105 | }, | ||
106 | |||
107 | _visible: { | ||
108 | enumerable: false, | ||
109 | value: true | ||
110 | }, | ||
111 | |||
112 | visible: { | ||
113 | enumerable: true, | ||
114 | serializable: true, | ||
115 | get: function() { | ||
116 | return this._visible; | ||
117 | }, | ||
118 | set: function(value) { | ||
119 | if(value !== this._visible) | ||
120 | { | ||
121 | this._visible = value; | ||
122 | this.needsDraw = true; | ||
75 | } | 123 | } |
76 | } | 124 | } |
77 | }, | 125 | }, |
@@ -102,7 +150,19 @@ exports.Combobox = Montage.create(Component, { | |||
102 | { | 150 | { |
103 | var current = items[i]; | 151 | var current = items[i]; |
104 | optionItem = document.createElement("option"); | 152 | optionItem = document.createElement("option"); |
105 | optionItem.value = current; | 153 | if(this.dataFunction) |
154 | { | ||
155 | optionItem.value = this.dataFunction(current); | ||
156 | } | ||
157 | else if(this.dataField) | ||
158 | { | ||
159 | optionItem.value = current[this.dataField]; | ||
160 | } | ||
161 | else | ||
162 | { | ||
163 | optionItem.value = current; | ||
164 | } | ||
165 | |||
106 | if(this.labelFunction) | 166 | if(this.labelFunction) |
107 | { | 167 | { |
108 | optionItem.innerText = this.labelFunction(current); | 168 | optionItem.innerText = this.labelFunction(current); |
@@ -117,6 +177,15 @@ exports.Combobox = Montage.create(Component, { | |||
117 | } | 177 | } |
118 | this.element.appendChild(optionItem); | 178 | this.element.appendChild(optionItem); |
119 | } | 179 | } |
180 | this.element.disabled = !this._enabled; | ||
181 | if(this._visible) | ||
182 | { | ||
183 | this.element.style.visibility = "visible"; | ||
184 | } | ||
185 | else | ||
186 | { | ||
187 | this.element.style.visibility = "hidden"; | ||
188 | } | ||
120 | } | 189 | } |
121 | } | 190 | } |
122 | }, | 191 | }, |
@@ -133,6 +202,22 @@ exports.Combobox = Montage.create(Component, { | |||
133 | 202 | ||
134 | prepareForDraw: { | 203 | prepareForDraw: { |
135 | value: function() { | 204 | value: function() { |
205 | if( (this._value === null) && this._items.length ) | ||
206 | { | ||
207 | var current = this._items[0]; | ||
208 | if(this.dataFunction) | ||
209 | { | ||
210 | this.value = this.dataFunction(current); | ||
211 | } | ||
212 | else if(this.dataField) | ||
213 | { | ||
214 | this.value = current[this.dataField]; | ||
215 | } | ||
216 | else | ||
217 | { | ||
218 | this.value = current; | ||
219 | } | ||
220 | } | ||
136 | this.element.addEventListener("change", this, false); | 221 | this.element.addEventListener("change", this, false); |
137 | } | 222 | } |
138 | } | 223 | } |
diff --git a/js/components/controllers/tree-controller.js b/js/components/controllers/tree-controller.js new file mode 100644 index 00000000..03ef7b9e --- /dev/null +++ b/js/components/controllers/tree-controller.js | |||
@@ -0,0 +1,185 @@ | |||
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 | @module montage/ui/controller/tree-controller | ||
8 | @requires montage/core/core | ||
9 | @requires montage/ui/controller/object-controller | ||
10 | @requires montage/core/event/mutable-event | ||
11 | */ | ||
12 | var Montage = require("montage").Montage, | ||
13 | ObjectController = require("montage/ui/controller/object-controller").ObjectController, | ||
14 | ArrayController = require("montage/ui/controller/array-controller").ArrayController, | ||
15 | MutableEvent = require("montage/core/event/mutable-event").MutableEvent; | ||
16 | /** | ||
17 | TODO: Write description like the array controllers: The ArrayController helps with organizing a hierarchical | ||
18 | collection of objects, and managing user selection within that collection. | ||
19 | You can assign a TreeController instance as the <code>contentProvider</code> property for a TreeView object. | ||
20 | @class module:montage/ui/controller/tree-controller.TreeController | ||
21 | @classdesc | ||
22 | @extends module:montage/ui/controller/object-controller.ObjectController | ||
23 | */ | ||
24 | var TreeController = exports.TreeController = Montage.create(ObjectController, /** @lends module:montage/ui/controller/tree-controller.TreeController# */ { | ||
25 | |||
26 | rootKey : { | ||
27 | value: null | ||
28 | }, | ||
29 | |||
30 | branchKey : { | ||
31 | value: 'children' | ||