Subversion Repositories Applications.papyrus

Rev

Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
2150 mathias 1
if(!dojo._hasResource["dijit.Dialog"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
2
dojo._hasResource["dijit.Dialog"] = true;
3
dojo.provide("dijit.Dialog");
4
 
5
dojo.require("dojo.dnd.move");
6
dojo.require("dojo.fx");
7
 
8
dojo.require("dijit._Widget");
9
dojo.require("dijit._Templated");
10
dojo.require("dijit.layout.ContentPane");
11
dojo.require("dijit.form.Form");
12
 
13
dojo.declare(
14
	"dijit.DialogUnderlay",
15
	[dijit._Widget, dijit._Templated],
16
	{
17
		// summary: the thing that grays out the screen behind the dialog
18
 
19
		// Template has two divs; outer div is used for fade-in/fade-out, and also to hold background iframe.
20
		// Inner div has opacity specified in CSS file.
21
		templateString: "<div class=dijitDialogUnderlayWrapper id='${id}_underlay'><div class=dijitDialogUnderlay dojoAttachPoint='node'></div></div>",
22
 
23
		postCreate: function(){
24
			dojo.body().appendChild(this.domNode);
25
			this.bgIframe = new dijit.BackgroundIframe(this.domNode);
26
		},
27
 
28
		layout: function(){
29
			// summary
30
			//		Sets the background to the size of the viewport (rather than the size
31
			//		of the document) since we need to cover the whole browser window, even
32
			//		if the document is only a few lines long.
33
 
34
			var viewport = dijit.getViewport();
35
			var is = this.node.style,
36
				os = this.domNode.style;
37
 
38
			os.top = viewport.t + "px";
39
			os.left = viewport.l + "px";
40
			is.width = viewport.w + "px";
41
			is.height = viewport.h + "px";
42
 
43
			// process twice since the scroll bar may have been removed
44
			// by the previous resizing
45
			var viewport2 = dijit.getViewport();
46
			if(viewport.w != viewport2.w){ is.width = viewport2.w + "px"; }
47
			if(viewport.h != viewport2.h){ is.height = viewport2.h + "px"; }
48
		},
49
 
50
		show: function(){
51
			this.domNode.style.display = "block";
52
			this.layout();
53
			if(this.bgIframe.iframe){
54
				this.bgIframe.iframe.style.display = "block";
55
			}
56
			this._resizeHandler = this.connect(window, "onresize", "layout");
57
		},
58
 
59
		hide: function(){
60
			this.domNode.style.display = "none";
61
			if(this.bgIframe.iframe){
62
				this.bgIframe.iframe.style.display = "none";
63
			}
64
			this.disconnect(this._resizeHandler);
65
		},
66
 
67
		uninitialize: function(){
68
			if(this.bgIframe){
69
				this.bgIframe.destroy();
70
			}
71
		}
72
	}
73
);
74
 
75
dojo.declare(
76
	"dijit.Dialog",
77
	[dijit.layout.ContentPane, dijit._Templated, dijit.form._FormMixin],
78
	{
79
		// summary:
80
		//		Pops up a modal dialog window, blocking access to the screen
81
		//		and also graying out the screen Dialog is extended from
82
		//		ContentPane so it supports all the same parameters (href, etc.)
83
 
84
		templateString: null,
85
		templateString:"<div class=\"dijitDialog\">\n\t<div dojoAttachPoint=\"titleBar\" class=\"dijitDialogTitleBar\" tabindex=\"0\" waiRole=\"dialog\">\n\t<span dojoAttachPoint=\"titleNode\" class=\"dijitDialogTitle\">${title}</span>\n\t<span dojoAttachPoint=\"closeButtonNode\" class=\"dijitDialogCloseIcon\" dojoAttachEvent=\"onclick: hide\">\n\t\t<span dojoAttachPoint=\"closeText\" class=\"closeText\">x</span>\n\t</span>\n\t</div>\n\t\t<div dojoAttachPoint=\"containerNode\" class=\"dijitDialogPaneContent\"></div>\n\t<span dojoAttachPoint=\"tabEnd\" dojoAttachEvent=\"onfocus:_cycleFocus\" tabindex=\"0\"></span>\n</div>\n",
86
 
87
		// open: Boolean
88
		//		is True or False depending on state of dialog
89
		open: false,
90
 
91
		// duration: Integer
92
		//		The time in milliseconds it takes the dialog to fade in and out
93
		duration: 400,
94
 
95
		_lastFocusItem:null,
96
 
97
		attributeMap: dojo.mixin(dojo.clone(dijit._Widget.prototype.attributeMap),
98
			{title: "titleBar"}),
99
 
100
		postCreate: function(){
101
			dojo.body().appendChild(this.domNode);
102
			this.inherited("postCreate",arguments);
103
			this.domNode.style.display="none";
104
			this.connect(this, "onExecute", "hide");
105
			this.connect(this, "onCancel", "hide");
106
		},
107
 
108
		onLoad: function(){
109
			// summary:
110
			//		when href is specified we need to reposition the dialog after the data is loaded
111
			this._position();
112
			this.inherited("onLoad",arguments);
113
		},
114
 
115
		_setup: function(){
116
			// summary:
117
			//		stuff we need to do before showing the Dialog for the first
118
			//		time (but we defer it until right beforehand, for
119
			//		performance reasons)
120
 
121
			this._modalconnects = [];
122
 
123
			if(this.titleBar){
124
				this._moveable = new dojo.dnd.Moveable(this.domNode, { handle: this.titleBar });
125
			}
126
 
127
			this._underlay = new dijit.DialogUnderlay();
128
 
129
			var node = this.domNode;
130
			this._fadeIn = dojo.fx.combine(
131
				[dojo.fadeIn({
132
					node: node,
133
					duration: this.duration
134
				 }),
135
				 dojo.fadeIn({
136
					node: this._underlay.domNode,
137
					duration: this.duration,
138
					onBegin: dojo.hitch(this._underlay, "show")
139
				 })
140
				]
141
			);
142
 
143
			this._fadeOut = dojo.fx.combine(
144
				[dojo.fadeOut({
145
					node: node,
146
					duration: this.duration,
147
					onEnd: function(){
148
						node.style.display="none";
149
					}
150
				 }),
151
				 dojo.fadeOut({
152
					node: this._underlay.domNode,
153
					duration: this.duration,
154
					onEnd: dojo.hitch(this._underlay, "hide")
155
				 })
156
				]
157
			);
158
		},
159
 
160
		uninitialize: function(){
161
			if(this._underlay){
162
				this._underlay.destroy();
163
			}
164
		},
165
 
166
		_position: function(){
167
			// summary: position modal dialog in center of screen
168
 
169
			if(dojo.hasClass(dojo.body(),"dojoMove")){ return; }
170
			var viewport = dijit.getViewport();
171
			var mb = dojo.marginBox(this.domNode);
172
 
173
			var style = this.domNode.style;
174
			style.left = Math.floor((viewport.l + (viewport.w - mb.w)/2)) + "px";
175
			style.top = Math.floor((viewport.t + (viewport.h - mb.h)/2)) + "px";
176
		},
177
 
178
		_findLastFocus: function(/*Event*/ evt){
179
			// summary:  called from onblur of dialog container to determine the last focusable item
180
			this._lastFocused = evt.target;
181
		},
182
 
183
		_cycleFocus: function(/*Event*/ evt){
184
			// summary: when tabEnd receives focus, advance focus around to titleBar
185
 
186
			// on first focus to tabEnd, store the last focused item in dialog
187
			if(!this._lastFocusItem){
188
				this._lastFocusItem = this._lastFocused;
189
			}
190
			this.titleBar.focus();
191
		},
192
 
193
		_onKey: function(/*Event*/ evt){
194
			if(evt.keyCode){
195
				var node = evt.target;
196
				// see if we are shift-tabbing from titleBar
197
				if(node == this.titleBar && evt.shiftKey && evt.keyCode == dojo.keys.TAB){
198
					if(this._lastFocusItem){
199
						this._lastFocusItem.focus(); // send focus to last item in dialog if known
200
					}
201
					dojo.stopEvent(evt);
202
				}else{
203
					// see if the key is for the dialog
204
					while(node){
205
						if(node == this.domNode){
206
							if(evt.keyCode == dojo.keys.ESCAPE){
207
								this.hide();
208
							}else{
209
								return; // just let it go
210
							}
211
						}
212
						node = node.parentNode;
213
					}
214
					// this key is for the disabled document window
215
					if(evt.keyCode != dojo.keys.TAB){ // allow tabbing into the dialog for a11y
216
						dojo.stopEvent(evt);
217
					// opera won't tab to a div
218
					}else if (!dojo.isOpera){
219
						try{
220
							this.titleBar.focus();
221
						}catch(e){/*squelch*/}
222
					}
223
				}
224
			}
225
		},
226
 
227
		show: function(){
228
			// summary: display the dialog
229
 
230
			// first time we show the dialog, there's some initialization stuff to do
231
			if(!this._alreadyInitialized){
232
				this._setup();
233
				this._alreadyInitialized=true;
234
			}
235
 
236
			if(this._fadeOut.status() == "playing"){
237
				this._fadeOut.stop();
238
			}
239
 
240
			this._modalconnects.push(dojo.connect(window, "onscroll", this, "layout"));
241
			this._modalconnects.push(dojo.connect(document.documentElement, "onkeypress", this, "_onKey"));
242
 
243
			// IE doesn't bubble onblur events - use ondeactivate instead
244
			var ev = typeof(document.ondeactivate) == "object" ? "ondeactivate" : "onblur";
245
			this._modalconnects.push(dojo.connect(this.containerNode, ev, this, "_findLastFocus"));
246
 
247
			dojo.style(this.domNode, "opacity", 0);
248
			this.domNode.style.display="block";
249
			this.open = true;
250
			this._loadCheck(); // lazy load trigger
251
 
252
			this._position();
253
 
254
			this._fadeIn.play();
255
 
256
			this._savedFocus = dijit.getFocus(this);
257
 
258
			// set timeout to allow the browser to render dialog
259
			setTimeout(dojo.hitch(this, function(){
260
				dijit.focus(this.titleBar);
261
			}), 50);
262
		},
263
 
264
		hide: function(){
265
			// summary
266
			//		Hide the dialog
267
 
268
			// if we haven't been initialized yet then we aren't showing and we can just return
269
			if(!this._alreadyInitialized){
270
				return;
271
			}
272
 
273
			if(this._fadeIn.status() == "playing"){
274
				this._fadeIn.stop();
275
			}
276
			this._fadeOut.play();
277
 
278
			if (this._scrollConnected){
279
				this._scrollConnected = false;
280
			}
281
			dojo.forEach(this._modalconnects, dojo.disconnect);
282
			this._modalconnects = [];
283
 
284
			this.connect(this._fadeOut,"onEnd",dojo.hitch(this,function(){
285
				dijit.focus(this._savedFocus);
286
			}));
287
			this.open = false;
288
		},
289
 
290
		layout: function() {
291
			// summary: position the Dialog and the underlay
292
			if(this.domNode.style.display == "block"){
293
				this._underlay.layout();
294
				this._position();
295
			}
296
		}
297
	}
298
);
299
 
300
dojo.declare(
301
	"dijit.TooltipDialog",
302
	[dijit.layout.ContentPane, dijit._Templated, dijit.form._FormMixin],
303
	{
304
		// summary:
305
		//		Pops up a dialog that appears like a Tooltip
306
		// title: String
307
		// 		Description of tooltip dialog (required for a11Y)
308
		title: "",
309
 
310
		_lastFocusItem: null,
311
 
312
		templateString: null,
313
		templateString:"<div class=\"dijitTooltipDialog\" >\n\t<div class=\"dijitTooltipContainer\">\n\t\t<div class =\"dijitTooltipContents dijitTooltipFocusNode\" dojoAttachPoint=\"containerNode\" tabindex=\"0\" waiRole=\"dialog\"></div>\n\t</div>\n\t<span dojoAttachPoint=\"tabEnd\" tabindex=\"0\" dojoAttachEvent=\"focus:_cycleFocus\"></span>\n\t<div class=\"dijitTooltipConnector\" ></div>\n</div>\n",
314
 
315
		postCreate: function(){
316
			this.inherited("postCreate",arguments);
317
			this.connect(this.containerNode, "onkeypress", "_onKey");
318
 
319
			// IE doesn't bubble onblur events - use ondeactivate instead
320
			var ev = typeof(document.ondeactivate) == "object" ? "ondeactivate" : "onblur";
321
			this.connect(this.containerNode, ev, "_findLastFocus");
322
			this.containerNode.title=this.title;
323
		},
324
 
325
		orient: function(/*Object*/ corner){
326
			// summary: configure widget to be displayed in given position relative to the button
327
			this.domNode.className="dijitTooltipDialog " +" dijitTooltipAB"+(corner.charAt(1)=='L'?"Left":"Right")+" dijitTooltip"+(corner.charAt(0)=='T' ? "Below" : "Above");
328
		},
329
 
330
		onOpen: function(/*Object*/ pos){
331
			// summary: called when dialog is displayed
332
			this.orient(pos.corner);
333
			this._loadCheck(); // lazy load trigger
334
			this.containerNode.focus();
335
		},
336
 
337
		_onKey: function(/*Event*/ evt){
338
			// summary: keep keyboard focus in dialog; close dialog on escape key
339
			if(evt.keyCode == dojo.keys.ESCAPE){
340
				this.onCancel();
341
			}else if(evt.target == this.containerNode && evt.shiftKey && evt.keyCode == dojo.keys.TAB){
342
				if (this._lastFocusItem){
343
					this._lastFocusItem.focus();
344
				}
345
				dojo.stopEvent(evt);
346
			}else if(evt.keyCode == dojo.keys.TAB){
347
				// we want the browser's default tab handling to move focus
348
				// but we don't want the tab to propagate upwards
349
				evt.stopPropagation();
350
			}
351
		},
352
 
353
		_findLastFocus: function(/*Event*/ evt){
354
			// summary: called from onblur of dialog container to determine the last focusable item
355
			this._lastFocused = evt.target;
356
		},
357
 
358
		_cycleFocus: function(/*Event*/ evt){
359
			// summary: when tabEnd receives focus, advance focus around to containerNode
360
 
361
			// on first focus to tabEnd, store the last focused item in dialog
362
			if(!this._lastFocusItem){
363
				this._lastFocusItem = this._lastFocused;
364
			}
365
			this.containerNode.focus();
366
		}
367
	}
368
);
369
 
370
 
371
}