Subversion Repositories Applications.papyrus

Rev

Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
2150 mathias 1
if(!dojo._hasResource["dijit._TimePicker"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
2
dojo._hasResource["dijit._TimePicker"] = true;
3
dojo.provide("dijit._TimePicker");
4
 
5
dojo.require("dijit.form._FormWidget");
6
dojo.require("dojo.date.locale");
7
 
8
dojo.declare("dijit._TimePicker",
9
	[dijit._Widget, dijit._Templated],
10
	{
11
		// summary:
12
		// A graphical time picker that TimeTextBox pops up
13
		// It is functionally modeled after the Java applet at http://java.arcadevillage.com/applets/timepica.htm
14
		// See ticket #599
15
 
16
		templateString:"<div id=\"widget_${id}\" class=\"dijitMenu\"\n    ><div dojoAttachPoint=\"upArrow\" class=\"dijitButtonNode\"><span class=\"dijitTimePickerA11yText\">&#9650;</span></div\n    ><div dojoAttachPoint=\"timeMenu,focusNode\" dojoAttachEvent=\"onclick:_onOptionSelected,onmouseover,onmouseout\"></div\n    ><div dojoAttachPoint=\"downArrow\" class=\"dijitButtonNode\"><span class=\"dijitTimePickerA11yText\">&#9660;</span></div\n></div>\n",
17
		baseClass: "dijitTimePicker",
18
 
19
		// clickableIncrement: String
20
		//		ISO-8601 string representing the amount by which
21
		//		every clickable element in the time picker increases
22
		//		Set in non-Zulu time, without a time zone
23
		//		Example: "T00:15:00" creates 15 minute increments
24
		//		Must divide visibleIncrement evenly
25
		clickableIncrement: "T00:15:00",
26
 
27
		// visibleIncrement: String
28
		//		ISO-8601 string representing the amount by which
29
		//		every element with a visible time in the time picker increases
30
		//		Set in non Zulu time, without a time zone
31
		//		Example: "T01:00:00" creates text in every 1 hour increment
32
		visibleIncrement: "T01:00:00",
33
 
34
		// visibleRange: String
35
		//		ISO-8601 string representing the range of this TimePicker
36
		//		The TimePicker will only display times in this range
37
		//		Example: "T05:00:00" displays 5 hours of options
38
		visibleRange: "T05:00:00",
39
 
40
		// value: String
41
		//		Date to display.
42
		//		Defaults to current time and date.
43
		//		Can be a Date object or an ISO-8601 string
44
		//		If you specify the GMT time zone ("-01:00"),
45
		//		the time will be converted to the local time in the local time zone.
46
		//		Otherwise, the time is considered to be in the local time zone.
47
		//		If you specify the date and isDate is true, the date is used.
48
		//		Example: if your local time zone is GMT -05:00,
49
		//		"T10:00:00" becomes "T10:00:00-05:00" (considered to be local time),
50
		//		"T10:00:00-01:00" becomes "T06:00:00-05:00" (4 hour difference),
51
		//		"T10:00:00Z" becomes "T05:00:00-05:00" (5 hour difference between Zulu and local time)
52
		//		"yyyy-mm-ddThh:mm:ss" is the format to set the date and time
53
		//		Example: "2007-06-01T09:00:00"
54
		value: new Date(),
55
 
56
		_visibleIncrement:2,
57
		_clickableIncrement:1,
58
		_totalIncrements:10,
59
		constraints:{},
60
 
61
		serialize: dojo.date.stamp.toISOString,
62
 
63
		setValue:function(/*Date*/ date, /*Boolean*/ priority){
64
			// summary:
65
			//	Set the value of the TimePicker
66
			//	Redraws the TimePicker around the new date
67
 
68
			//dijit._TimePicker.superclass.setValue.apply(this, arguments);
69
			this.value=date;
70
			this._showText();
71
		},
72
 
73
		isDisabledDate: function(/*Date*/dateObject, /*String?*/locale){
74
			// summary:
75
			//	May be overridden to disable certain dates in the TimePicker e.g. isDisabledDate=dojo.date.locale.isWeekend
76
			return false; // Boolean
77
		},
78
 
79
		_showText:function(){
80
			this.timeMenu.innerHTML="";
81
			var fromIso = dojo.date.stamp.fromISOString;
82
			this._clickableIncrementDate=fromIso(this.clickableIncrement);
83
			this._visibleIncrementDate=fromIso(this.visibleIncrement);
84
			this._visibleRangeDate=fromIso(this.visibleRange);
85
			// get the value of the increments and the range in seconds (since 00:00:00) to find out how many divs to create
86
			var sinceMidnight = function(/*Date*/ date){
87
				return date.getHours()*60*60+date.getMinutes()*60+date.getSeconds();
88
			};
89
 
90
			var clickableIncrementSeconds = sinceMidnight(this._clickableIncrementDate);
91
			var visibleIncrementSeconds = sinceMidnight(this._visibleIncrementDate);
92
			var visibleRangeSeconds = sinceMidnight(this._visibleRangeDate);
93
 
94
			// round reference date to previous visible increment
95
			var time = this.value.getTime();
96
			this._refDate = new Date(time - time % (visibleIncrementSeconds*1000));
97
 
98
			// assume clickable increment is the smallest unit
99
			this._clickableIncrement=1;
100
			// divide the visible range by the clickable increment to get the number of divs to create
101
			// example: 10:00:00/00:15:00 -> display 40 divs
102
			this._totalIncrements=visibleRangeSeconds/clickableIncrementSeconds;
103
			// divide the visible increments by the clickable increments to get how often to display the time inline
104
			// example: 01:00:00/00:15:00 -> display the time every 4 divs
105
			this._visibleIncrement=visibleIncrementSeconds/clickableIncrementSeconds;
106
			for(var i=-this._totalIncrements/2; i<=this._totalIncrements/2; i+=this._clickableIncrement){
107
				var div=this._createOption(i);
108
				this.timeMenu.appendChild(div);
109
			}
110
 
111
			// TODO:
112
			// I commented this out because it
113
			// causes problems for a TimeTextBox in a Dialog, or as the editor of an InlineEditBox,
114
			// because the timeMenu node isn't visible yet. -- Bill (Bug #????)
115
			// dijit.focus(this.timeMenu);
116
		},
117
 
118
		postCreate:function(){
119
			// instantiate constraints
120
			if(this.constraints===dijit._TimePicker.prototype.constraints){
121
				this.constraints={};
122
			}
123
			// dojo.date.locale needs the lang in the constraints as locale
124
			if(!this.constraints.locale){
125
				this.constraints.locale=this.lang;
126
			}
127
 
128
			// assign typematic mouse listeners to the arrow buttons
129
			this.connect(this.timeMenu, dojo.isIE ? "onmousewheel" : 'DOMMouseScroll', "_mouseWheeled");
130
			dijit.typematic.addMouseListener(this.upArrow,this,this._onArrowUp, 0.8, 500);
131
			dijit.typematic.addMouseListener(this.downArrow,this,this._onArrowDown, 0.8, 500);
132
			//dijit.typematic.addListener(this.upArrow,this.timeMenu, {keyCode:dojo.keys.UP_ARROW,ctrlKey:false,altKey:false,shiftKey:false}, this, "_onArrowUp", 0.8, 500);
133
			//dijit.typematic.addListener(this.downArrow, this.timeMenu, {keyCode:dojo.keys.DOWN_ARROW,ctrlKey:false,altKey:false,shiftKey:false}, this, "_onArrowDown", 0.8,500);
134
 
135
			this.inherited("postCreate", arguments);
136
			this.setValue(this.value);
137
		},
138
 
139
		_createOption:function(/*Number*/ index){
140
			// summary: creates a clickable time option
141
			var div=document.createElement("div");
142
			var date = (div.date = new Date(this._refDate));
143
			div.index=index;
144
			var incrementDate = this._clickableIncrementDate;
145
			date.setHours(date.getHours()+incrementDate.getHours()*index,
146
				date.getMinutes()+incrementDate.getMinutes()*index,
147
				date.getSeconds()+incrementDate.getSeconds()*index);
148
 
149
			var innerDiv = document.createElement('div');
150
			dojo.addClass(div,this.baseClass+"Item");
151
			dojo.addClass(innerDiv,this.baseClass+"ItemInner");
152
			innerDiv.innerHTML=dojo.date.locale.format(date, this.constraints);
153
			div.appendChild(innerDiv);
154
 
155
			if(index%this._visibleIncrement<1 && index%this._visibleIncrement>-1){
156
				dojo.addClass(div, this.baseClass+"Marker");
157
			}else if(index%this._clickableIncrement==0){
158
				dojo.addClass(div, this.baseClass+"Tick");
159
			}
160
 
161
			if(this.isDisabledDate(date)){
162
				// set disabled
163
				dojo.addClass(div, this.baseClass+"ItemDisabled");
164
			}
165
			if(dojo.date.compare(this.value, date, this.constraints.selector)==0){
166
				div.selected=true;
167
				dojo.addClass(div, this.baseClass+"ItemSelected");
168
			}
169
			return div;
170
		},
171
 
172
		_onOptionSelected:function(/*Object*/ tgt){
173
			var tdate = tgt.target.date || tgt.target.parentNode.date;
174
			if(!tdate||this.isDisabledDate(tdate)){return;}
175
			this.setValue(tdate);
176
			this.onValueSelected(tdate);
177
		},
178
 
179
		onValueSelected:function(value){
180
		},
181
 
182
		onmouseover:function(/*Event*/ e){
183
			var tgr = (e.target.parentNode === this.timeMenu) ? e.target : e.target.parentNode;
184
			this._highlighted_option=tgr;
185
			dojo.addClass(tgr, this.baseClass+"ItemHover");
186
		},
187
 
188
		onmouseout:function(/*Event*/ e){
189
			var tgr = (e.target.parentNode === this.timeMenu) ? e.target : e.target.parentNode;
190
			if(this._highlighted_option===tgr){
191
				dojo.removeClass(tgr, this.baseClass+"ItemHover");
192
			}
193
		},
194
 
195
		_mouseWheeled:function(/*Event*/e){
196
			// summary: handle the mouse wheel listener
197
			dojo.stopEvent(e);
198
			// we're not _measuring_ the scroll amount, just direction
199
			var scrollAmount = (dojo.isIE ? e.wheelDelta : -e.detail);
200
			this[(scrollAmount>0 ? "_onArrowUp" : "_onArrowDown")](); // yes, we're making a new dom node every time you mousewheel, or click
201
		},
202
 
203
		_onArrowUp:function(){
204
			// summary: remove the bottom time and add one to the top
205
			var index=this.timeMenu.childNodes[0].index-1;
206
			var div=this._createOption(index);
207
			this.timeMenu.removeChild(this.timeMenu.childNodes[this.timeMenu.childNodes.length-1]);
208
			this.timeMenu.insertBefore(div, this.timeMenu.childNodes[0]);
209
		},
210
 
211
		_onArrowDown:function(){
212
			// summary: remove the top time and add one to the bottom
213
			var index=this.timeMenu.childNodes[this.timeMenu.childNodes.length-1].index+1;
214
			var div=this._createOption(index);
215
			this.timeMenu.removeChild(this.timeMenu.childNodes[0]);
216
			this.timeMenu.appendChild(div);
217
		}
218
	}
219
);
220
 
221
}