source: EDIS/trunk/java/tracking-ui-core/src/main/flex/gov/va/med/edp/view/config/ConfigBoard.mxml@ 1227

Last change on this file since 1227 was 1227, checked in by George Lilly, 13 years ago

initial load of EDIS 1.0
File size: 29.8 KB
Line 
1<?xml version="1.0" encoding="utf-8"?>
2<mx:VBox
3 xmlns:mx="http://www.adobe.com/2006/mxml"
4 xmlns:widget="gov.va.med.edp.widget.*"
5 xmlns:acc="flash.accessibility.*"
6 horizontalScrollPolicy="off" verticalScrollPolicy="off"
7 width="100%" height="100%" creationComplete="loadBoardSpec()">
8
9 <mx:Script>
10 <![CDATA[
11 import gov.va.med.edp.util.AccessibilityTools;
12 import mx.controls.DataGrid;
13 import mx.events.MenuEvent;
14 import mx.collections.ICollectionView;
15 import gov.va.med.edp.widget.InfoDialog;
16 import gov.va.med.edp.widget.YesNoDialog;
17 import mx.events.CloseEvent;
18 import gov.va.med.edp.vo.LookupVO;
19 import gov.va.med.edp.vo.DisplaySizeVO;
20 import gov.va.med.edp.control.config.ConfigChangeDisplayBoardPropertiesEvent;
21 import mx.collections.IList;
22 import mx.managers.DragManager;
23 import mx.events.DragEvent;
24 import gov.va.med.edp.control.config.ConfigurationEvent;
25 import gov.va.med.edp.vo.ColorMapVO;
26 import mx.events.DataGridEvent;
27 import mx.events.CollectionEvent;
28 import mx.controls.dataGridClasses.DataGridColumn;
29 import mx.events.IndexChangedEvent;
30 import gov.va.med.edp.control.config.BoardConfigEvent;
31 import gov.va.med.edp.control.config.ConfigChangeColumnEvent;
32 import gov.va.med.edp.control.config.ConfigRemoveColumnEvent;
33 import gov.va.med.edp.control.config.ConfigAddColumnEvent;
34 import gov.va.med.edp.model.TrackingModelLocator;
35 import gov.va.med.edp.vo.ColumnSpecVO;
36 import gov.va.med.edp.util.KeyUtils;
37
38 [Bindable]
39 private var model: TrackingModelLocator = TrackingModelLocator.getInstance();
40
41 private var dragInitiator: String;
42 private var switchMode: String;
43
44 private var _boardColumns:ICollectionView;
45
46 [Bindable]
47 private function get boardColumns():ICollectionView {
48 return _boardColumns;
49 }
50
51 private function set boardColumns(cols:ICollectionView):void {
52 if (_boardColumns != null && model.config.availableColumns.filterFunction === availableColumnsFilterFunction) {
53 model.config.availableColumns.filterFunction = null;
54 }
55 _boardColumns = cols;
56 if (_boardColumns != null) {
57 model.config.availableColumns.filterFunction = availableColumnsFilterFunction;
58 model.config.availableColumns.refresh();
59 }
60 }
61
62 private function set readyToListen(value: Boolean): void
63 {
64 if (value == false) return;
65 model.config.columns.addEventListener(CollectionEvent.COLLECTION_CHANGE, rebuildPreview);
66 rebuildPreview(null);
67 boardList.selectedIndex = model.config.boardIndex;
68 }
69
70 private function set keepSelectedBoardVisible(value: int): void
71 {
72 callLater(boardList.scrollToIndex, [value]);
73 }
74
75 private function loadBoardSpec(): void
76 {
77 var e: BoardConfigEvent =
78 new BoardConfigEvent(BoardConfigEvent.EVENT_LOAD_CONFIG_BOARD);
79 e.boardID = (boardList.selectedItem == null) ? 0 : (boardList.selectedItem as LookupVO).data;
80 e.dispatch();
81 }
82
83 private function saveConfig(): void
84 {
85 var saveEvent: BoardConfigEvent =
86 new BoardConfigEvent(BoardConfigEvent.EVENT_SAVE_CONFIG_BOARD);
87 var selectedBoard: LookupVO = boardList.selectedItem as LookupVO;
88 saveEvent.boardID = selectedBoard.data;
89 saveEvent.boardName = selectedBoard.label;
90 saveEvent.dispatch();
91 }
92
93 private function cancelChanges():void {
94 loadBoardSpec();
95 boardList.setFocus();
96 }
97
98 private function addNewBoard(): void
99 {
100 new BoardConfigEvent(BoardConfigEvent.EVENT_ADD_CONFIG_BOARD).dispatch();
101 callLater(boardNameInput.setFocus);
102 }
103
104 private function attemptBoardSwitch(eventName: String): void
105 {
106 switchMode = eventName;
107 if (model.config.boardMods) {
108 YesNoDialog.show("You have unsaved changes to the currently selected board.\n\n" +
109 "Do you want to abandon these changes?\n\n" +
110 "Yes=Lose Changes\nNo=Return & Save Changes", "Unsaved Changes", handleSwitch, addBoardBtn);
111 } else {
112 switchBoard();
113 }
114 }
115
116 private function handleSwitch(event: CloseEvent): void
117 {
118 if (event.detail == YesNoDialog.YES) {
119 switchBoard();
120 } else {
121 boardList.selectedIndex = model.config.boardIndex;
122 }
123 }
124
125 private function switchBoard(): void
126 {
127 if (switchMode == BoardConfigEvent.EVENT_ADD_CONFIG_BOARD) addNewBoard();
128 if (switchMode == BoardConfigEvent.EVENT_LOAD_CONFIG_BOARD) loadBoardSpec();
129 switchMode = "";
130 }
131
132 private function rebuildPreview(event:CollectionEvent): void
133 {
134 var newCols:Array = new Array();
135 var newCol: DataGridColumn;
136 for each (var colInfo: ColumnSpecVO in model.config.columns) {
137 newCol = new DataGridColumn(colInfo.attribute);
138 newCol.headerText = colInfo.header;
139 newCol.dataField = colInfo.attribute;
140 newCol.width = colInfo.width;
141 newCol.setStyle("fontSize", model.config.displayBoardProperties.fontSize);
142 newCols.push(newCol);
143 }
144 preview.columns = newCols;
145
146 if (event != null) {
147 new ConfigurationEvent(ConfigurationEvent.EVENT_BOARD_MODIFIED).dispatch();
148 }
149 }
150
151 public function addColumnItemClickHandler(event:MenuEvent):void {
152 var selectedColumn:ColumnSpecVO = event.item as ColumnSpecVO;
153 addColumn(selectedColumn);
154 }
155
156 // drag/drop ------------------------------------------------------
157
158 private function setDragInitator(event:MouseEvent, id:String):void
159 {
160 dragInitiator = id;
161 }
162
163 private function doDragOver(event:DragEvent):void
164 {
165 var dropTarget:DataGrid = DataGrid(event.currentTarget);
166 // add the DataGrid drop feedback
167 dropTarget.showDropFeedback(event);
168 }
169
170 private function doDragEnter(event:DragEvent):void
171 {
172 var dropTarget:DataGrid = DataGrid(event.currentTarget);
173
174 if (dragInitiator == dropTarget.id) {
175 DragManager.showFeedback(DragManager.MOVE);
176 DragManager.acceptDragDrop(dropTarget);
177 }
178 }
179
180
181 private function doDragDrop(event:DragEvent):void
182 {
183 var dropTarget:DataGrid = DataGrid(event.currentTarget);
184 doDragExit(event);
185
186 var items:Array = event.dragSource.dataForFormat("items") as Array;
187 var dropLoc:int = dropTarget.calculateDropIndex(event);
188 for (var i:int = 0; i < items.length; i++)
189 {
190 if (dragInitiator == dropTarget.id) {
191 // moving within list
192 if (dropLoc > DataGrid(dropTarget).selectedIndex)
193 dropLoc = dropLoc - 1;
194 if (dropLoc > IList(dropTarget.dataProvider).length - 1)
195 dropLoc = dropLoc - 1;
196 IList(dropTarget.dataProvider).removeItemAt(dropTarget.selectedIndex);
197 IList(dropTarget.dataProvider).addItemAt(items[i], dropLoc);
198 callLater(updateSelection, [dropLoc]);
199 } else {
200 IList(dropTarget.dataProvider).addItemAt(items[i], dropLoc);
201 }
202 }
203 }
204
205 private function updateSelection(index : int) : void
206 {
207 boardColumnsGrid.selectedIndex = index;
208 }
209
210
211 private function doDragExit(event:DragEvent):void
212 {
213 var dropTarget:DataGrid = DataGrid(event.currentTarget);
214 dropTarget.hideDropFeedback(event);
215 }
216
217 private function keyHandler(event:KeyboardEvent): void
218 {
219 if (!KeyUtils.isRemoveKey(event)) return;
220 if (boardColumnsGrid.editable && boardColumnsGrid.editedItemPosition != null) return;
221 if (KeyUtils.isRemoveKey(event)) removeSelectedColumnsFromGrid();
222
223 if (event.keyCode == Keyboard.ESCAPE) {
224 boardColumnsGrid.selectedIndex = -1;
225 btnSaveBoard.setFocus();
226 }
227 }
228
229
230 private function removeSelectedColumnsFromGrid(): void
231 {
232 if (boardColumnsGrid.selectedItems != null && boardColumnsGrid.selectedItems.length > 0) {
233 for each (var item:ColumnSpecVO in boardColumnsGrid.selectedItems) {
234 removeColumn(item);
235 }
236
237 }
238 }
239
240
241 // update columns -------------------------------------------------
242
243 private function addColumn(selectedItem: ColumnSpecVO): void
244 {
245 if (selectedItem == null) return;
246
247 var addEvent: ConfigAddColumnEvent =
248 new ConfigAddColumnEvent(ConfigAddColumnEvent.EVENT_CONFIG_ADD_COLUMN);
249 addEvent.data = selectedItem;
250 addEvent.dispatch();
251
252 model.config.availableColumns.refresh();
253
254 if (AccessibilityTools.isAccessibilityActive()) InfoDialog.show("Added successfully", "Message", true, addColumnSelector);
255 }
256
257 private function removeColumn(selectedItem: ColumnSpecVO): void
258 {
259 if (selectedItem == null) return;
260
261 var removeEvent: ConfigRemoveColumnEvent =
262 new ConfigRemoveColumnEvent(ConfigRemoveColumnEvent.EVENT_CONFIG_REMOVE_COLUMN);
263 removeEvent.data = selectedItem;
264 removeEvent.dispatch();
265
266 model.config.availableColumns.refresh();
267
268 if (AccessibilityTools.isAccessibilityActive()) InfoDialog.show("Removed successfully", "Message", true, boardColumnsGrid);
269 }
270
271 private function changeBoardName():void {
272 var newBoardName: String = boardNameInput.text;
273 if (newBoardName != model.config.boards[model.config.boardIndex].label) {
274 boardList.selectedItem.label = newBoardName;
275 new ConfigurationEvent(ConfigurationEvent.EVENT_BOARD_MODIFIED).dispatch()
276 }
277 }
278
279 private function changeColumnSequence(event: IndexChangedEvent): void
280 {
281 var changeEvent: ConfigChangeColumnEvent =
282 new ConfigChangeColumnEvent(ConfigChangeColumnEvent.EVENT_CONFIG_CHANGE_COLUMN_SEQ);
283 changeEvent.oldIndex = event.oldIndex;
284 changeEvent.newIndex = event.newIndex;
285 changeEvent.dispatch();
286 }
287
288 private function changeColumnWidth(event: DataGridEvent): void
289 {
290 var changeEvent: ConfigChangeColumnEvent =
291 new ConfigChangeColumnEvent(ConfigChangeColumnEvent.EVENT_CONFIG_CHANGE_COLUMN_WIDTH);
292 changeEvent.widths = [];
293 for (var i: int = 0; i < preview.columns.length; i++) {
294 changeEvent.widths.push(DataGridColumn(preview.columns[i]).width);
295 }
296 changeEvent.dispatch();
297 }
298
299 private function changeRowColor(): void
300 {
301 var changeEvent: ConfigChangeColumnEvent =
302 new ConfigChangeColumnEvent(ConfigChangeColumnEvent.EVENT_CONFIG_CHANGE_ROW_COLOR);
303 var colorMap: ColorMapVO = rowColor.selectedItem as ColorMapVO;
304 changeEvent.rowColor = (colorMap != null) ? colorMap.id : "";
305 changeEvent.dispatch();
306 }
307
308 // update display properties --------------------------------------
309
310
311 private function changeDisplayBoardWidth(): void
312 {
313 var changeEvent: ConfigChangeDisplayBoardPropertiesEvent =
314 new ConfigChangeDisplayBoardPropertiesEvent(ConfigChangeDisplayBoardPropertiesEvent.EVENT_CONFIG_CHANGE_DISPLAY_WIDTH);
315 var displayWidth: DisplaySizeVO = displaySizeCmb.selectedItem as DisplaySizeVO;
316 changeEvent.displaySize = displayWidth;
317 changeEvent.dispatch();
318 }
319
320 private function changeDisplayBoardFontSize(): void
321 {
322 var changeEvent: ConfigChangeDisplayBoardPropertiesEvent =
323 new ConfigChangeDisplayBoardPropertiesEvent(ConfigChangeDisplayBoardPropertiesEvent.EVENT_CONFIG_CHANGE_FONT_SIZE);
324 var fontSize: int = fntSizeNmStepper.value;
325 changeEvent.fontSize = fontSize;
326 changeEvent.dispatch();
327
328 for each (var gridColumn:DataGridColumn in preview.columns) {
329 gridColumn.setStyle("fontSize", fontSize);
330 }
331 }
332
333 private function changeDisplayBoardScrollDelay(): void
334 {
335 var changeEvent: ConfigChangeDisplayBoardPropertiesEvent =
336 new ConfigChangeDisplayBoardPropertiesEvent(ConfigChangeDisplayBoardPropertiesEvent.EVENT_CONFIG_CHANGE_SCROLL_DELAY);
337 var scrollDelay: int = ScrollDlyNmStepper.value;
338 changeEvent.scrollDelay = scrollDelay;
339 changeEvent.dispatch();
340 }
341
342 private function changeDisplayBoardSquish(): void
343 {
344 // prevent setting boardMods during initialization of checkbox
345 if (model.config.boardLoaded == false) return;
346
347 var changeEvent: ConfigChangeDisplayBoardPropertiesEvent =
348 new ConfigChangeDisplayBoardPropertiesEvent(ConfigChangeDisplayBoardPropertiesEvent.EVENT_CONFIG_CHANGE_SQUISH);
349 changeEvent.squish = squishChkBox.selected;
350 changeEvent.dispatch();
351 }
352
353 // label function for color maps
354 private function showColorMapName(item: Object, column: DataGridColumn): String
355 {
356 var c: ColumnSpecVO = item as ColumnSpecVO;
357 if ((c != null) && (c.colorMap != null)) {
358 return c.colorMap.name;
359 } else {
360 return "";
361 }
362 }
363
364 private function changeColumnHeader(): void {
365 if (headerInput.text != boardColumnsGrid.selectedItem.header) {
366 boardColumnsGrid.selectedItem.header = headerInput.text;
367 }
368 }
369
370 private function changeColumnColor(): void {
371 if (boardColumnsGrid.selectedItem.colorMap != columnColor.selectedItem) {
372 boardColumnsGrid.selectedItem.colorMap = columnColor.selectedItem;
373 }
374 }
375
376 private function changeColumnSequenceText(): void {
377 var currentIndex:int = boardColumnsGrid.selectedIndex;
378 var newIndex:int = int(columnOrderInput.text) - 1;
379 if (newIndex < 0 || newIndex >= boardColumns.length) return;
380 if (newIndex != currentIndex) {
381 boardColumnsGrid.selectedIndex = -1;
382 var changeEvent: ConfigChangeColumnEvent =
383 new ConfigChangeColumnEvent(ConfigChangeColumnEvent.EVENT_CONFIG_CHANGE_COLUMN_SEQ);
384 changeEvent.oldIndex = currentIndex;
385 changeEvent.newIndex = newIndex;
386 changeEvent.dispatch();
387 callLater(updateSelection, [newIndex]);
388 callLater(columnOrderInput.setFocus);
389 }
390 }
391
392 private function changeColumnWidthText(): void {
393 var currentWidth:int = 0;
394 var newWidth:int = int(widthInput.text);
395
396 resizeColumn(preview, boardColumnsGrid.selectedIndex, newWidth);
397 }
398
399 /**
400 * @private
401 * If there is no horizontal scroll bar, changes the display width of other columns when
402 * one column's width is changed.
403 * @param col column whose width is changed
404 * @param w width of column
405 */
406 private function resizeColumn(grid:DataGrid, col:int, w:Number):void
407 {
408 if (col < 0 || col >= grid.columns.length - 1) // no resize of right most column
409 return;
410
411 if (w < grid.columns[col].minWidth)
412 w = grid.columns[col].minWidth;
413
414 // find the columns in the set of visible columns;
415 var n:int = grid.columns.length;
416 var i:int = col;
417
418 // we want all cols's new widths to the right of this to be in proportion
419 // to what they were before the stretch.
420
421 // get the original space to the right not taken up by the column
422 var totalSpace:Number = 0;
423 var lastColumn:DataGridColumn;
424 var newWidth:Number;
425 //non-resizable columns don't count though
426 for (i = col + 1; i < n; i++)
427 {
428 if (grid.columns[i].visible)
429 if (grid.columns[i].resizable)
430 totalSpace += grid.columns[i].width;
431 }
432
433 var newTotalSpace:Number = grid.columns[col].width - w + totalSpace;
434 if (totalSpace)
435 {
436 grid.columns[col].width = w;
437 }
438
439 var totX:Number = 0;
440 // resize the columns to the right proportionally to what they were
441 for (i = col + 1; i < n; i++)
442 {
443 if (grid.columns[i].visible)
444 if (grid.columns[i].resizable)
445 {
446 newWidth = Math.floor(grid.columns[i].width
447 * newTotalSpace / totalSpace);
448 if (newWidth < grid.columns[i].minWidth)
449 newWidth = grid.columns[i].minWidth;
450 grid.columns[i].width = newWidth;
451 totX += grid.columns[i].width;
452 lastColumn = grid.columns[i];
453 }
454 }
455
456 if (totX > newTotalSpace)
457 {
458 // if excess then should be taken out only from changing column
459 // cause others would have already gone to their minimum
460 newWidth = grid.columns[col].width - totX + newTotalSpace;
461 if (newWidth < grid.columns[col].minWidth)
462 newWidth = grid.columns[col].minWidth;
463 grid.columns[col].width = newWidth;
464 }
465 else if (lastColumn)
466 {
467 // if less then should be added in last column
468 // dont need to check for minWidth as we are adding
469 lastColumn.width = lastColumn.width - totX + newTotalSpace;
470 }
471
472 invalidateDisplayList();
473 }
474
475 private static function availableColumnsFilterFunction(item:Object):Boolean {
476 var availableColumn:ColumnSpecVO = item as ColumnSpecVO;
477 for each (var col:ColumnSpecVO in TrackingModelLocator.getInstance().config.columns) {
478 if (availableColumn.label == col.label) return false;
479 }
480 return true;
481 }
482 ]]>
483 </mx:Script>
484
485 <mx:HBox height="100%" width="100%">
486 <mx:VBox height="100%">
487 <mx:Button label="Add Board"
488 click="attemptBoardSwitch(BoardConfigEvent.EVENT_ADD_CONFIG_BOARD)"
489 id="addBoardBtn"
490 tabIndex="1101"/>
491 <mx:List
492 id="boardList"
493 dataProvider="{model.config.boards}"
494 selectedIndex="{model.config.boardIndex}"
495 change="attemptBoardSwitch(BoardConfigEvent.EVENT_LOAD_CONFIG_BOARD)"
496 rowCount="{model.config.boards.length}"
497 backgroundColor="0xe7e7e7" cornerRadius="4" width="96"
498 labelField="label"
499 tabIndex="1102" />
500 </mx:VBox>
501
502 <mx:VBox height="100%" paddingLeft="12">
503 <widget:OpenAlwaysPopUpMenuButton id="addColumnSelector" dataProvider="{model.config.availableColumns}"
504 label="Add Column" itemClick="addColumnItemClickHandler(event)"
505 tabIndex="1103"/>
506 <mx:DataGrid
507 id="boardColumnsGrid"
508 dataProvider="{boardColumns}"
509 accessibilityProperties="{boardColumnsGridAcc}"
510 height="100%" width="100%"
511 dragEnabled="true"
512 dragEnter="doDragEnter(event);"
513 dragExit="doDragExit(event)"
514 dragDrop="doDragDrop(event)"
515 dragOver="doDragOver(event)"
516 allowMultipleSelection="true"
517 dragMoveEnabled="false"
518 mouseDown="setDragInitator(event, 'boardColumnsGrid')"
519 keyDown="keyHandler(event)"
520 sortableColumns="false"
521 tabIndex="1104">
522 <mx:columns>
523 <mx:DataGridColumn
524 headerText="Column"
525 dataField="label"
526 width="160"/>
527 <mx:DataGridColumn
528 headerText="Header"
529 dataField="header"
530 width="84"/>
531 <mx:DataGridColumn
532 headerText="Color Based On"
533 dataField="colorMap"
534 editorDataField="colorMap"
535 labelFunction="showColorMapName"
536 width="160"/>
537 </mx:columns>
538 </mx:DataGrid>
539 </mx:VBox>
540 <mx:VBox height="100%" width="100%">
541 <mx:Form id="boardPropertyForm">
542 <mx:FormHeading label="Board Properties"/>
543 <mx:FormItem label="Board Name">
544 <mx:TextInput id="boardNameInput" styleName="formField" text="{boardList.selectedItem.label}"
545 editable="{boardList.selectedItem.label != 'Main (default)'}"
546 change="changeBoardName()" tabIndex="1200"/>
547 </mx:FormItem>
548 <mx:FormItem label="Row Color Based On">
549 <mx:ComboBox
550 id="rowColor"
551 dataProvider="{model.config.colorMaps}"
552 selectedIndex="{model.config.rowColorMapIndex}"
553 labelField="name"
554 rowCount="{model.config.colorMaps.length}"
555 change="changeRowColor()"
556 styleName="formField"
557 tabIndex="1201"/>
558 </mx:FormItem>
559 <mx:FormItem label="Display Size">
560 <widget:ValueComboBox
561 id="displaySizeCmb"
562 styleName="formField"
563 dataProvider="{model.config.displaySizes}"
564 labelField="label"
565 value="{model.config.displayBoardProperties.displaySize.label}"
566 rowCount="{model.config.displaySizes.length}"
567 change="changeDisplayBoardWidth()"
568 tabIndex="1202"/>
569 </mx:FormItem>
570 <mx:FormItem label="Font Size">
571 <widget:AccessibleNumericStepper
572 id="fntSizeNmStepper"
573 name=" "
574 stepSize="1" minimum="6" maximum="36"
575 change="changeDisplayBoardFontSize()"
576 value="{model.config.displayBoardProperties.fontSize}"
577 styleName="formField"
578 tabIndex="1203"/>
579 </mx:FormItem>
580 <mx:FormItem label="Squish Rows To Fit">
581 <mx:CheckBox
582 id="squishChkBox"
583 label="(if possible)"
584 toolTip="squish will try to squish the Display Board rows so as to display the data on one screen as long as the font size is greater than 9. If the number of rows grows and the rows start getting too small, normal auto scrolling functionality will return."
585 change="changeDisplayBoardSquish()"
586 selected="{model.config.displayBoardProperties.squish}"
587 paddingLeft="0" paddingTop="2"
588 styleName="formField"
589 tabIndex="1204"/>
590 </mx:FormItem>
591 <mx:FormItem label="Scroll Delay">
592 <widget:AccessibleNumericStepper
593 id="ScrollDlyNmStepper"
594 name=" in Seconds"
595 stepSize="1" minimum="1" maximum="120"
596 change="changeDisplayBoardScrollDelay()"
597 value="{model.config.displayBoardProperties.scrollDelay}"
598 styleName="formField"
599 tabIndex="1205"/>
600 </mx:FormItem>
601
602 <mx:Form id="columnProperties" visible="{boardColumnsGrid.selectedItem != null}">
603 <mx:FormHeading label="Column Properties" paddingTop="6"/>
604 <mx:FormItem label="Header">
605 <mx:TextInput id="headerInput" styleName="formField"
606 text="{boardColumnsGrid.selectedItem.header}" tabIndex="1207"
607 change="changeColumnHeader()"/>
608 </mx:FormItem>
609 <mx:FormItem label="Color Based On" toolTip="Overrides row color setting.">
610 <mx:ComboBox
611 id="columnColor"
612 dataProvider="{model.config.colorMaps}"
613 selectedIndex="{model.config.colorMaps.getItemIndex(boardColumnsGrid.selectedItem.colorMap)}"
614 labelField="name"
615 rowCount="{model.config.colorMaps.length}"
616 change="changeColumnColor()"
617 styleName="formField"
618 tabIndex="1208"/>
619 </mx:FormItem>
620 <mx:FormItem label="Column Order" visible="{AccessibilityTools.isAccessibilityActive()}" >
621 <mx:TextInput id="columnOrderInput" styleName="formField"
622 text="{boardColumnsGrid.selectedIndex + 1}" tabIndex="1209"
623 change="changeColumnSequenceText()"/>
624 </mx:FormItem>
625 <mx:FormItem label="Width" visible="{AccessibilityTools.isAccessibilityActive()}" >
626 <mx:TextInput id="widthInput" styleName="formField" text="{boardColumnsGrid.selectedItem.width}"
627 tabIndex="1210" change="changeColumnWidthText()"/>
628 </mx:FormItem>
629 </mx:Form>
630 </mx:Form>
631
632 <mx:HBox
633 id="boxButton"
634 height="100%" width="100%"
635 horizontalAlign="center" verticalAlign="bottom" >
636<!-- <mx:Button id="btnCancelBoardChanges"
637 label="Cancel" enabled="{model.config.boardMods}" tabIndex="1300"
638 click="cancelChanges()"/>-->
639 <mx:Button id="btnSaveBoard"
640 label="Save Display Board Changes"
641 enabled="{(model.config.boardMods &amp;&amp; model.config.boardLoaded)}"
642 click="saveConfig()" tabIndex="1301"/>
643 </mx:HBox>
644 </mx:VBox>
645
646 </mx:HBox>
647 <mx:Spacer height="12"/>
648 <mx:HRule width="100%" strokeColor="0xcccccc" shadowColor="0x777777" />
649 <mx:Label
650 text="Preview Display Board (drag to move and size columns)"
651 styleName="controlLabel"/>
652 <mx:Canvas width="100%" horizontalScrollPolicy="auto" verticalScrollPolicy="off">
653 <mx:DataGrid
654 id="preview"
655 accessibilityProperties="{previewAcc}"
656 columnStretch="changeColumnWidth(event)"
657 headerShift="changeColumnSequence(event)"
658 width="{model.config.displayBoardProperties.displaySize.width}"
659 rowCount="3"
660 focusEnabled="false">
661 <mx:columns>
662 <mx:DataGridColumn headerText="Selected columns appear here, drag column splitters to set widths."/>
663 </mx:columns>
664 </mx:DataGrid>
665 </mx:Canvas>
666
667 <mx:NumberValidator id="columnOrderValidator" source="{columnOrderInput}" property="text" minValue="1"
668 maxValue="{boardColumns.length}"/>
669
670 <acc:AccessibilityProperties id="boardColumnsGridAcc" name="Board Columns"/>
671 <acc:AccessibilityProperties id="previewAcc" name="Preview Display Board (drag to move and size columns)"/>
672 <acc:AccessibilityProperties id="availableColumnsAcc" name="Available Columns"/>
673
674 <mx:Binding source="model.config.boardLoaded" destination="readyToListen"/>
675 <mx:Binding source="model.config.columns" destination="boardColumns"/>
676 <mx:Binding source="model.config.boardIndex" destination="keepSelectedBoardVisible"/>
677</mx:VBox>
Note: See TracBrowser for help on using the repository browser.