1 | <?xml version="1.0" encoding="utf-8"?>
|
---|
2 | <mx:VBox
|
---|
3 | xmlns:mx="http://www.adobe.com/2006/mxml"
|
---|
4 | width="100%" height="100%"
|
---|
5 | show="addFilter()" hide="removeFilter()" xmlns:widget="gov.va.med.edp.widget.*">
|
---|
6 |
|
---|
7 | <mx:states>
|
---|
8 | <mx:State name="staff">
|
---|
9 | <mx:AddChild relativeTo="{actionArea}" >
|
---|
10 | <mx:Canvas width="100%" height="100%">
|
---|
11 | <widget:AccessibleLabel
|
---|
12 | text="Use the Staff view to set colors for individuals."
|
---|
13 | accessibleText="Info: Use the Staff view to set colors for individuals."
|
---|
14 | verticalCenter="0" horizontalCenter="0"
|
---|
15 | styleName="subTitle" tabIndex="1200"/>
|
---|
16 | </mx:Canvas>
|
---|
17 | </mx:AddChild>
|
---|
18 | </mx:State>
|
---|
19 | <mx:State name="bed">
|
---|
20 | <mx:AddChild relativeTo="{actionArea}" >
|
---|
21 | <mx:Canvas width="100%" height="100%" >
|
---|
22 | <widget:AccessibleLabel
|
---|
23 | text="Use the Room / Bed view to set colors for locations."
|
---|
24 | accessibleText="Info: Use the Room / Bed view to set colors for locations."
|
---|
25 | verticalCenter="0" horizontalCenter="0"
|
---|
26 | styleName="subTitle" tabIndex="1200"/>
|
---|
27 | </mx:Canvas>
|
---|
28 | </mx:AddChild>
|
---|
29 | </mx:State>
|
---|
30 | <mx:State name="values">
|
---|
31 | <mx:AddChild relativeTo="{actionArea}" >
|
---|
32 | <mx:DataGrid
|
---|
33 | id="valueGrid"
|
---|
34 | focusIn="{AccessibilityTools.accessComponentName(valueGrid, viewTitle.text)}"
|
---|
35 | editable="false"
|
---|
36 | height="100%"
|
---|
37 | tabIndex="1200">
|
---|
38 | <mx:columns>
|
---|
39 | <mx:DataGridColumn
|
---|
40 | dataField="name"
|
---|
41 | headerText="Value"
|
---|
42 | width="160" />
|
---|
43 | <mx:DataGridColumn
|
---|
44 | headerText="Color"
|
---|
45 | itemRenderer="gov.va.med.edp.widget.ColorSampleRenderer"
|
---|
46 | width="108" />
|
---|
47 | </mx:columns>
|
---|
48 | </mx:DataGrid>
|
---|
49 | </mx:AddChild>
|
---|
50 | <mx:AddChild relativeTo="{actionArea}" >
|
---|
51 | <mx:VBox
|
---|
52 | id="valuesColorSelectorFrm"
|
---|
53 | visible="{valueGrid.selectedItem != null}"
|
---|
54 | verticalGap="2"
|
---|
55 | height="100%" >
|
---|
56 | <mx:Label text="Change Color"/>
|
---|
57 | <widget:ColorSelector
|
---|
58 | id="valuesColorSelector"
|
---|
59 | tabIndex="1201"
|
---|
60 | color="{selectedColorMatch.color}"
|
---|
61 | colorChange="fireColorChange(event)"/>
|
---|
62 | </mx:VBox>
|
---|
63 | </mx:AddChild>
|
---|
64 | </mx:State>
|
---|
65 | <mx:State name="ranges">
|
---|
66 | <mx:AddChild relativeTo="{viewTitle}" position="before" >
|
---|
67 | <mx:Button label="Add" click="addRange()" tabIndex="1200" />
|
---|
68 | </mx:AddChild>
|
---|
69 | <mx:AddChild relativeTo="{actionArea}" >
|
---|
70 | <mx:DataGrid
|
---|
71 | id="rangeGrid"
|
---|
72 | focusIn="AccessibilityTools.accessComponentName(rangeGrid, viewTitle.text)"
|
---|
73 | editable="false"
|
---|
74 | keyDown="rangeKeyHandler(event)"
|
---|
75 | height="100%"
|
---|
76 | tabIndex="1202">
|
---|
77 | <mx:columns>
|
---|
78 | <mx:DataGridColumn
|
---|
79 | dataField="value"
|
---|
80 | headerText="Starting at Elapsed Minute"
|
---|
81 | itemRenderer="mx.controls.Label"
|
---|
82 | width="160" />
|
---|
83 | <mx:DataGridColumn
|
---|
84 | headerText="Color"
|
---|
85 | dataField="color"
|
---|
86 | itemRenderer="gov.va.med.edp.widget.ColorSampleRenderer"
|
---|
87 | width="108" />
|
---|
88 | </mx:columns>
|
---|
89 | </mx:DataGrid>
|
---|
90 | </mx:AddChild>
|
---|
91 | <mx:AddChild relativeTo="{actionArea}" >
|
---|
92 | <mx:Form height="100%" id="rangesColorSelectorFrm" visible="{rangeGrid.selectedItem != null}">
|
---|
93 | <mx:FormItem label="Starting at Elapsed Minute">
|
---|
94 | <mx:TextInput
|
---|
95 | id="numTextInput"
|
---|
96 | width="100%" height="100%"
|
---|
97 | tabIndex="1203"
|
---|
98 | text="{selectedColorMatch.value}"
|
---|
99 | restrict="0-9"
|
---|
100 | change="fireRangeChanged(event)"
|
---|
101 | styleName="formField"/>
|
---|
102 | </mx:FormItem>
|
---|
103 | <mx:FormItem label="Color">
|
---|
104 | <widget:ColorSelector
|
---|
105 | id="rangesColorSelector"
|
---|
106 | tabIndex="1204"
|
---|
107 | color="{selectedColorMatch.color}"
|
---|
108 | colorChange="fireColorChange(event)"
|
---|
109 | styleName="formField"/>
|
---|
110 | </mx:FormItem>
|
---|
111 | </mx:Form>
|
---|
112 | </mx:AddChild>
|
---|
113 | </mx:State>
|
---|
114 | </mx:states>
|
---|
115 |
|
---|
116 |
|
---|
117 | <mx:Script>
|
---|
118 | <![CDATA[
|
---|
119 | import gov.va.med.edp.control.config.ColorChangedEvent;
|
---|
120 | import gov.va.med.edp.widget.InfoDialog;
|
---|
121 | import mx.events.CollectionEvent;
|
---|
122 | import gov.va.med.edp.control.config.ConfigurationEvent;
|
---|
123 | import gov.va.med.edp.vo.ColorMatchVO;
|
---|
124 | import gov.va.med.edp.vo.ColorMapVO;
|
---|
125 | import mx.collections.ArrayCollection;
|
---|
126 | import gov.va.med.edp.vo.ColorSelectionVO;
|
---|
127 | import gov.va.med.edp.model.TrackingModelLocator;
|
---|
128 | import gov.va.med.edp.util.AccessibilityTools;
|
---|
129 | import gov.va.med.edp.util.KeyUtils;
|
---|
130 |
|
---|
131 | [Bindable]
|
---|
132 | private var model: TrackingModelLocator = TrackingModelLocator.getInstance();
|
---|
133 |
|
---|
134 | [Bindable]
|
---|
135 | private var selectedColorMatch: ColorMatchVO;
|
---|
136 |
|
---|
137 | private function setValueList(): void
|
---|
138 | {
|
---|
139 | if (colorMapList.selectedIndex < 0) return;
|
---|
140 | var colorMap: ColorMapVO = colorMapList.selectedItem as ColorMapVO;
|
---|
141 | colorMap.matches.addEventListener(CollectionEvent.COLLECTION_CHANGE, detectChanges);
|
---|
142 |
|
---|
143 | if (colorMap.type == "val") {
|
---|
144 | this.currentState = "values";
|
---|
145 | valueGrid.dataProvider = colorMap.matches;
|
---|
146 | viewTitle.text = "Colors for " + colorMap.name;
|
---|
147 | }
|
---|
148 | if (colorMap.type == "rng") {
|
---|
149 | this.currentState = "ranges";
|
---|
150 | rangeGrid.dataProvider = colorMap.matches;
|
---|
151 | viewTitle.text = "Colors for " + colorMap.name;
|
---|
152 | }
|
---|
153 | if (colorMap.type == "bed") {
|
---|
154 | this.currentState = "bed";
|
---|
155 | viewTitle.text = "";
|
---|
156 | }
|
---|
157 | if (colorMap.type == "staff") {
|
---|
158 | this.currentState = "staff";
|
---|
159 | viewTitle.text = ""
|
---|
160 | }
|
---|
161 | if (colorMap.type == "none") {
|
---|
162 | this.currentState = "";
|
---|
163 | viewTitle.text = "";
|
---|
164 | }
|
---|
165 | }
|
---|
166 |
|
---|
167 | private function detectChanges(event: CollectionEvent): void
|
---|
168 | {
|
---|
169 | new ConfigurationEvent(ConfigurationEvent.EVENT_COLOR_MODIFIED).dispatch();
|
---|
170 | }
|
---|
171 |
|
---|
172 | private function addRange(): void
|
---|
173 | {
|
---|
174 | // for now just update the model directly...
|
---|
175 | if (colorMapList.selectedIndex < 0) return;
|
---|
176 |
|
---|
177 | var colorMap: ColorMapVO = colorMapList.selectedItem as ColorMapVO;
|
---|
178 | var match: ColorMatchVO = new ColorMatchVO();
|
---|
179 | match.attribute = "@" + colorMap.id;
|
---|
180 | match.value = "0";
|
---|
181 | match.color = new ColorSelectionVO();
|
---|
182 | colorMap.matches.addItem(match);
|
---|
183 | if (AccessibilityTools.isAccessibilityActive()) InfoDialog.show("Added successfully", "Message", true);
|
---|
184 |
|
---|
185 | rangeGrid.selectedIndex = rangeGrid.dataProvider.length;
|
---|
186 | }
|
---|
187 |
|
---|
188 | private function removeRange(): void
|
---|
189 | {
|
---|
190 | // for now just update the model directly...
|
---|
191 | if (rangeGrid.selectedIndex < 0) return;
|
---|
192 | var map: ColorMapVO = colorMapList.selectedItem as ColorMapVO;
|
---|
193 | map.matches.removeItemAt(rangeGrid.selectedIndex);
|
---|
194 | if (AccessibilityTools.isAccessibilityActive()) InfoDialog.show("Removed successfully", "Message", true, rangeGrid);
|
---|
195 | }
|
---|
196 |
|
---|
197 | private function rangeKeyHandler(event:KeyboardEvent): void
|
---|
198 | {
|
---|
199 | if (!KeyUtils.isRemoveKey(event)) return;
|
---|
200 | removeRange();
|
---|
201 | }
|
---|
202 |
|
---|
203 | private function saveColors(): void
|
---|
204 | {
|
---|
205 | var saveEvent: ConfigurationEvent =
|
---|
206 | new ConfigurationEvent(ConfigurationEvent.EVENT_SAVE_COLOR_CONFIG);
|
---|
207 | saveEvent.dispatch();
|
---|
208 | }
|
---|
209 |
|
---|
210 | private function addFilter(): void
|
---|
211 | {
|
---|
212 | model.config.colorMaps.filterFunction = hideNone;
|
---|
213 | model.config.colorMaps.refresh();
|
---|
214 | }
|
---|
215 |
|
---|
216 | private function removeFilter(): void
|
---|
217 | {
|
---|
218 | model.config.colorMaps.filterFunction = null;
|
---|
219 | model.config.colorMaps.refresh();
|
---|
220 | }
|
---|
221 |
|
---|
222 | public function hideNone(item: Object): Boolean
|
---|
223 | {
|
---|
224 | return (item.type != "none");
|
---|
225 | }
|
---|
226 |
|
---|
227 | private function fireColorChange(event:ColorChangedEvent):void {
|
---|
228 | var colorMatch:ColorMatchVO = selectedColorMatch;
|
---|
229 |
|
---|
230 | if (event.currentTarget === valuesColorSelector) {
|
---|
231 | if (colorMatch.color != valuesColorSelector.color) {
|
---|
232 | colorMatch.color.ignore = valuesColorSelector.color.ignore;
|
---|
233 | colorMatch.color.text = valuesColorSelector.color.text;
|
---|
234 | colorMatch.color.back = valuesColorSelector.color.back;
|
---|
235 | new ConfigurationEvent(ConfigurationEvent.EVENT_COLOR_MODIFIED).dispatch();
|
---|
236 | }
|
---|
237 | } else if (event.currentTarget === rangesColorSelector) {
|
---|
238 | if (colorMatch.color != rangesColorSelector.color) {
|
---|
239 | colorMatch.color.ignore = rangesColorSelector.color.ignore;
|
---|
240 | colorMatch.color.text = rangesColorSelector.color.text;
|
---|
241 | colorMatch.color.back = rangesColorSelector.color.back;
|
---|
242 | new ConfigurationEvent(ConfigurationEvent.EVENT_COLOR_MODIFIED).dispatch();
|
---|
243 | }
|
---|
244 |
|
---|
245 | }
|
---|
246 |
|
---|
247 | var colorMap: ColorMapVO = colorMapList.selectedItem as ColorMapVO;
|
---|
248 | if (colorMap != null) colorMap.matches.refresh();
|
---|
249 | }
|
---|
250 |
|
---|
251 | private function fireRangeChanged(event:Event):void {
|
---|
252 | if (event.currentTarget === numTextInput) {
|
---|
253 | if (selectedColorMatch.value != numTextInput.text) {
|
---|
254 | selectedColorMatch.value = numTextInput.text;
|
---|
255 | new ConfigurationEvent(ConfigurationEvent.EVENT_COLOR_MODIFIED).dispatch();
|
---|
256 | }
|
---|
257 | }
|
---|
258 | }
|
---|
259 |
|
---|
260 | ]]>
|
---|
261 | </mx:Script>
|
---|
262 |
|
---|
263 | <mx:HBox
|
---|
264 | width="100%" height="100%" >
|
---|
265 | <mx:VBox
|
---|
266 | verticalGap="0"
|
---|
267 | height="100%" width="23%">
|
---|
268 | <mx:Label
|
---|
269 | text="Available Color Maps"
|
---|
270 | styleName="controlLabel" />
|
---|
271 | <mx:List
|
---|
272 | id="colorMapList"
|
---|
273 | initialize="{AccessibilityTools.accessComponentName(colorMapList,'Available Color Maps')}"
|
---|
274 | dataProvider="{model.config.colorMaps}"
|
---|
275 | labelField="name"
|
---|
276 | backgroundColor="0xe7e7e7" cornerRadius="4"
|
---|
277 | rowCount="{model.config.colorMaps.length}"
|
---|
278 | width="172"
|
---|
279 | change="setValueList()"
|
---|
280 | tabIndex="1100" />
|
---|
281 | </mx:VBox>
|
---|
282 | <mx:VBox verticalGap="0" height="100%" width="100%">
|
---|
283 | <mx:HBox id="titleArea" width="100%" paddingBottom="2" >
|
---|
284 | <mx:Label id="viewTitle" styleName="controlLabel" />
|
---|
285 | </mx:HBox>
|
---|
286 | <mx:HBox id="actionArea" width="100%" height="100%" />
|
---|
287 | </mx:VBox>
|
---|
288 | </mx:HBox>
|
---|
289 |
|
---|
290 | <mx:Canvas width="100%" >
|
---|
291 | <mx:Button
|
---|
292 | id = "btnSaveColor"
|
---|
293 | label="Save Color Changes"
|
---|
294 | enabled="{(model.config.colorMods && model.config.colorLoaded)}"
|
---|
295 | horizontalCenter="0" top="6" bottom="6"
|
---|
296 | click="saveColors()"
|
---|
297 | tabIndex="1900" />
|
---|
298 | </mx:Canvas>
|
---|
299 |
|
---|
300 | <mx:Resize id="resize" duration="300"/>
|
---|
301 | <mx:Binding source="ColorMatchVO(valueGrid.selectedItem)" destination="selectedColorMatch"/>
|
---|
302 | <mx:Binding source="ColorMatchVO(rangeGrid.selectedItem)" destination="selectedColorMatch"/>
|
---|
303 | </mx:VBox>
|
---|