source: EDIS/trunk/java/tracking-ui-core/src/main/flex/gov/va/med/edp/widget/DateTimeChooser.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: 10.5 KB
Line 
1<?xml version="1.0" encoding="utf-8"?>
2<mx:Canvas
3 xmlns:mx="http://www.adobe.com/2006/mxml"
4 xmlns:widget="gov.va.med.edp.widget.*"
5 width="195"
6 horizontalScrollPolicy="off" verticalScrollPolicy="off" tabChildren="true" focusEnabled="false" creationComplete="layoutControls()">
7
8 <mx:Metadata>
9 [Event(name="change", type="mx.events.CalendarLayoutChangeEvent")]
10 [Event(name=DateTimeEvent.EVENT_DATE_TIME, type="gov.va.med.edp.control.DateTimeEvent")]
11 </mx:Metadata>
12
13 <mx:Script>
14 <![CDATA[
15 import mx.events.CalendarLayoutChangeEvent;
16 import gov.va.med.edp.control.DateTimeEvent;
17 import gov.va.med.edp.control.DateTimeEvent;
18 import gov.va.med.edp.control.DateTimeEvent;
19 import mx.binding.utils.BindingUtils;
20 import gov.va.med.edp.control.DateTimeEvent;
21 import gov.va.med.edp.model.TrackingModelLocator;
22 import gov.va.med.edp.util.AccessibilityTools;
23
24 [Bindable]
25 public var _selectedDate: Date;
26
27 [Bindable]
28 private var _tabIndexBase:int = -1;
29
30 [Bindable]
31 private var _dateType:String = "";
32
33 [Bindable]
34 public function set selectedDate(date:Date):void
35 {
36 dateInput.text = "";
37 timeInput.text = "";
38 if (date != null){
39 dateChooser.selectedDate = date;
40 timeChooser.hour = date.getHours();
41 timeChooser.minute = date.getMinutes();
42 dateInput.text = dateFormatter.format(date);
43 timeInput.text = get2DigitTime(date.getHours().toString()) + ":" + get2DigitTime(date.getMinutes().toString());
44 } else {
45 dateChooser.selectedDate = null;
46 timeChooser.hour = 00;
47 timeChooser.minute = 00;
48 }
49 }
50 public function get selectedDate():Date
51 {
52 return this._selectedDate;
53 }
54
55 private function get2DigitTime(time:String):String {
56 if (time.length == 1) return "0" + time;
57 return time;
58 }
59
60 private function layoutControls():void {
61 if (AccessibilityTools.isAccessibilityActive()){
62 textControlsBox.visible = true;
63 calendarControlsBox.visible = false;
64 } else {
65 textControlsBox.visible = false;
66 calendarControlsBox.visible = true;
67 }
68 }
69
70 private function fireEventFromCalendarControls(event: Event): void
71 {
72 if (dateChooser.selectedDate == null){
73 this._selectedDate = null;
74 return;
75 }
76
77 var hours:int = timeChooser.hour;
78 var minutes:int = timeChooser.minute;
79 var year:int = dateChooser.selectedDate.fullYear;
80 var month:int = dateChooser.selectedDate.month;
81 var date:int = dateChooser.selectedDate.date;
82
83 var dateTime:Date = new Date(year,month, date,hours,minutes);
84 this._selectedDate = dateTime;
85
86 var dateTimeEvent:DateTimeEvent = new DateTimeEvent(DateTimeEvent.EVENT_DATE_TIME);
87 dateTimeEvent.dateTime = dateTime;
88 dispatchEvent(dateTimeEvent);
89
90 var chgEvent: CalendarLayoutChangeEvent =
91 new CalendarLayoutChangeEvent(CalendarLayoutChangeEvent.CHANGE);
92 chgEvent.newDate = dateTime;
93 dispatchEvent(chgEvent);
94 }
95
96 private function fireEventFromTextControls(event: Event): void
97 {
98 var isValid:Boolean = false;
99
100 if (event.currentTarget.id == "dateInput"){
101 isValid = isDateValid(dateInput.text);
102 }
103
104 if (event.currentTarget.id == "timeInput"){
105 isValid = isTimeValid(timeInput.text);
106 }
107
108 if (!isValid){
109 this._selectedDate = null;
110 return;
111 }
112
113 var date:Array = dateInput.text.split("/");
114 var time:Array = timeInput.text.split(":");
115 var hours:int = parseInt(time[0]);
116 var minutes:int = parseInt(time[1]);
117 //var year:int = parseInt(date[2]);
118 var year:int = formatYear(date[2]);
119 var month:int = parseInt(date[0]);
120 var day:int = parseInt(date[1]);
121 var dateTime:Date = new Date(year,month-1,day,hours,minutes);
122
123 this._selectedDate = dateTime;
124 dateInput.text = DateField.dateToString(dateTime, "MM/DD/YYYY");
125
126 var dateTimeEvent:DateTimeEvent = new DateTimeEvent(DateTimeEvent.EVENT_DATE_TIME);
127 dateTimeEvent.dateTime = dateTime;
128 dispatchEvent(dateTimeEvent);
129
130 var chgEvent: CalendarLayoutChangeEvent =
131 new CalendarLayoutChangeEvent(CalendarLayoutChangeEvent.CHANGE);
132 chgEvent.newDate = dateTime;
133 dispatchEvent(chgEvent);
134
135 }
136
137 // added by jtorreno 08/17/2008
138 // formats year according to the length of the string and its value
139 // Formatting is based on the autoformatting algorithm of the datechooser field in flex
140 // This is implemented if accessibility is enabled
141 private function formatYear(yearStr: String): int
142 {
143 var newYear:int = 1900;
144 var yearLen:int = 0;
145 var year:int = 0;
146
147 if (yearStr != null)
148 {
149 yearLen = yearStr.length;
150 year = parseInt(yearStr);
151 }
152
153 if ((yearLen > 0) && (yearLen <=3))
154 {
155 if ((year > 0) && (year < 70) && (yearLen == 2))
156 {
157 newYear = year + 2000;
158 } else {
159 if (((year >= 70) && (year <= 99) && (yearLen == 1)) ||
160 ((year <= 99) && (yearLen == 3)))
161 {
162 newYear = year + 1900;
163 } else {
164 newYear = year;
165 }
166 }
167 } else {
168 newYear = year;
169 }
170
171 return newYear
172 }
173
174 // modified by jtorreno 8/17/2008
175 // changed some rules to allow date formatting
176 private function isDateValid(dateString: String): Boolean
177 {
178 var isValid:Boolean = false;
179
180 // minimum and maximum length of string that can be entered
181 if ((dateString.length >= 5) && (dateString.length <= 10))
182 {
183 var date:Array = dateString.split("/");
184 // checks if array is composed of 3 fields ( Month, Day , Year)
185 if (date.length == 3)
186 {
187 var monthStr:String = date[0];
188 var dayStr:String = date[1];
189 var yearStr:String = date[2];
190
191 // checks string length of month, day, year for validity
192 if ((monthStr.length > 0) && (monthStr.length <= 2)
193 && (dayStr.length > 0) && (dayStr.length <= 2)
194 && (yearStr.length > 0) && (yearStr.length <= 4))
195 {
196 var year:Number = parseInt(yearStr);
197 var month:Number = parseInt(monthStr);
198 var day:Number = parseInt(dayStr);
199
200 if (isNaN(year) || isNaN(month) || isNaN(day)){
201 isValid = false;
202 } else
203 {
204 if (month > 0 && month < 13){
205 if (day > 0 && day < 32){
206 isValid = true;
207 }
208 }
209 }
210 }
211 }
212 }
213
214 return isValid;
215 }
216
217 //added by jtorreno 08/17/2008
218 // resets time text if it is left blank
219 private function resetTimeText(event:Event):void
220 {
221 if (event.currentTarget.id == "timeInput"){
222 if ((timeInput.text == null) || (timeInput.text.length == 0))
223 {
224 timeInput.text = "00:00"
225 }
226
227 }
228 }
229
230 private function isTimeValid(timeString: String): Boolean
231 {
232 var isValid:Boolean = false;
233 if (timeString.length == 5){
234 var time:Array = timeString.split(":");
235 var hourStr:String = time[0];
236 var minStr:String = time[1];
237 if (hourStr.length == 2 && minStr.length == 2){
238 var hour:Number = parseInt(hourStr);
239 var min:Number = parseInt(minStr);
240 if (isNaN(hour) || isNaN(min)){
241 isValid = false;
242 } else {
243 if (hour > -1 && hour < 24){
244 if (min > -1 && min < 60){
245 isValid = true;
246 }
247 }
248 }
249 }
250 }
251 return isValid;
252 }
253
254 private function setAccessibilityPropertiesForDateInput(): void {
255 AccessibilityTools.accessComponentName(dateInput, "Date");
256 AccessibilityTools.accessComponentDescription(dateInput, "Enter " + _dateType + "date as MM/DD/YYYY.");
257
258 }
259
260 private function setAccessibilityPropertiesForTimeInput(): void {
261 AccessibilityTools.accessComponentName(timeInput,"Time");
262 AccessibilityTools.accessComponentDescription(timeInput,"Enter " + _dateType + "time in military time format as HH:MM");
263 }
264
265 public function set tabIndexBase(value:int):void {
266 _tabIndexBase = value;
267 }
268
269 public function get tabIndexBase():int {
270 return _tabIndexBase;
271 }
272
273 public function set dateType(value:String):void {
274 _dateType = value;
275 }
276
277 public function get dateType():String {
278 return _dateType;
279 }
280 ]]>
281
282 </mx:Script>
283
284
285 <mx:HBox id="calendarControlsBox" width="100%" height="100%" x="0" y="0" visible="true">
286 <mx:DateField
287 id="dateChooser"
288 initialize="{AccessibilityTools.accessComponentName(dateChooser,'Date Chooser')}"
289 yearNavigationEnabled="true"
290 editable="{AccessibilityTools.setToFalseIfAccessToolIsActive()}"
291 change="{fireEventFromCalendarControls(event)}"
292 width="110"
293 tabIndex="{_tabIndexBase}"/>
294 <widget:TimeEntry
295 id="timeChooser"
296 initialize="{AccessibilityTools.accessComponentName(timeChooser,'Time Chooser')}"
297 showSeconds="false"
298 is24Hour="true"
299 backgroundColor="white"
300 borderThickness="1"
301 borderStyle="solid"
302 cornerRadius="5"
303 keyDown="{fireEventFromCalendarControls(event)}"
304 click="{fireEventFromCalendarControls(event)}"
305 tabIndexBase="{_tabIndexBase + 1}"/>
306 </mx:HBox>
307
308 <mx:HBox id="textControlsBox" width="100%" height="100%" x="0" y="0">
309 <mx:TextInput id="dateInput"
310 restrict="0123456789/"
311 toolTip="date (MM/DD/YYYY)"
312 tabIndex="{_tabIndexBase}"
313 focusOut="fireEventFromTextControls(event)"
314 initialize="setAccessibilityPropertiesForDateInput()"
315 width="90"/>
316 <mx:TextInput id="timeInput"
317 text="00:00"
318 toolTip="time (HH:MM)"
319 restrict="0123456789:"
320 tabIndex="{_tabIndexBase + 1}"
321 change="fireEventFromTextControls(event)"
322 initialize="setAccessibilityPropertiesForTimeInput()"
323 width="60"/>
324 </mx:HBox>
325
326 <mx:DateValidator source="{dateChooser}" property="text" required="true" />
327 <mx:DateValidator source="{dateInput}" property="text" required="true" />
328 <mx:StringValidator source="{timeInput}" property="text" required="true" />
329 <mx:DateFormatter id="dateFormatter" formatString="MM/DD/YYYY" />
330 </mx:Canvas>
Note: See TracBrowser for help on using the repository browser.