//>>built require({cache:{ 'url:dijit/templates/Dialog.html':"
\n\t
\n\t\n\t\n\t\tx\n\t\n\t
\n\t\t
\n
\n"}}); define("dijit/Dialog", [ "require", "dojo/_base/array", // array.forEach array.indexOf array.map "dojo/_base/connect", // connect._keypress "dojo/_base/declare", // declare "dojo/_base/Deferred", // Deferred "dojo/dom", // dom.isDescendant "dojo/dom-class", // domClass.add domClass.contains "dojo/dom-geometry", // domGeometry.position "dojo/dom-style", // domStyle.set "dojo/_base/event", // event.stop "dojo/_base/fx", // fx.fadeIn fx.fadeOut "dojo/i18n", // i18n.getLocalization "dojo/_base/kernel", // kernel.isAsync "dojo/keys", "dojo/_base/lang", // lang.mixin lang.hitch "dojo/on", "dojo/ready", "dojo/_base/sniff", // has("ie") has("opera") "dojo/_base/window", // win.body "dojo/window", // winUtils.getBox "dojo/dnd/Moveable", // Moveable "dojo/dnd/TimedMoveable", // TimedMoveable "./focus", "./_base/manager", // manager.defaultDuration "./_Widget", "./_TemplatedMixin", "./_CssStateMixin", "./form/_FormMixin", "./_DialogMixin", "./DialogUnderlay", "./layout/ContentPane", "dojo/text!./templates/Dialog.html", ".", // for back-compat, exporting dijit._underlay (remove in 2.0) "dojo/i18n!./nls/common" ], function(require, array, connect, declare, Deferred, dom, domClass, domGeometry, domStyle, event, fx, i18n, kernel, keys, lang, on, ready, has, win, winUtils, Moveable, TimedMoveable, focus, manager, _Widget, _TemplatedMixin, _CssStateMixin, _FormMixin, _DialogMixin, DialogUnderlay, ContentPane, template, dijit){ /*===== var _Widget = dijit._Widget; var _TemplatedMixin = dijit._TemplatedMixin; var _CssStateMixin = dijit._CssStateMixin; var _FormMixin = dijit.form._FormMixin; var _DialogMixin = dijit._DialogMixin; =====*/ // module: // dijit/Dialog // summary: // A modal dialog Widget /*===== dijit._underlay = function(kwArgs){ // summary: // A shared instance of a `dijit.DialogUnderlay` // // description: // A shared instance of a `dijit.DialogUnderlay` created and // used by `dijit.Dialog`, though never created until some Dialog // or subclass thereof is shown. }; =====*/ var _DialogBase = declare("dijit._DialogBase", [_TemplatedMixin, _FormMixin, _DialogMixin, _CssStateMixin], { // summary: // A modal dialog Widget // // description: // Pops up a modal dialog window, blocking access to the screen // and also graying out the screen Dialog is extended from // ContentPane so it supports all the same parameters (href, etc.) // // example: // |
// // example: // | var foo = new dijit.Dialog({ title: "test dialog", content: "test content" }; // | dojo.body().appendChild(foo.domNode); // | foo.startup(); templateString: template, baseClass: "dijitDialog", cssStateNodes: { closeButtonNode: "dijitDialogCloseIcon" }, // Map widget attributes to DOMNode attributes. _setTitleAttr: [ { node: "titleNode", type: "innerHTML" }, { node: "titleBar", type: "attribute" } ], // open: [readonly] Boolean // True if Dialog is currently displayed on screen. open: false, // duration: Integer // The time in milliseconds it takes the dialog to fade in and out duration: manager.defaultDuration, // refocus: Boolean // A Toggle to modify the default focus behavior of a Dialog, which // is to re-focus the element which had focus before being opened. // False will disable refocusing. Default: true refocus: true, // autofocus: Boolean // A Toggle to modify the default focus behavior of a Dialog, which // is to focus on the first dialog element after opening the dialog. // False will disable autofocusing. Default: true autofocus: true, // _firstFocusItem: [private readonly] DomNode // The pointer to the first focusable node in the dialog. // Set by `dijit._DialogMixin._getFocusItems`. _firstFocusItem: null, // _lastFocusItem: [private readonly] DomNode // The pointer to which node has focus prior to our dialog. // Set by `dijit._DialogMixin._getFocusItems`. _lastFocusItem: null, // doLayout: [protected] Boolean // Don't change this parameter from the default value. // This ContentPane parameter doesn't make sense for Dialog, since Dialog // is never a child of a layout container, nor can you specify the size of // Dialog in order to control the size of an inner widget. doLayout: false, // draggable: Boolean // Toggles the moveable aspect of the Dialog. If true, Dialog // can be dragged by it's title. If false it will remain centered // in the viewport. draggable: true, //aria-describedby: String // Allows the user to add an aria-describedby attribute onto the dialog. The value should // be the id of the container element of text that describes the dialog purpose (usually // the first text in the dialog). //
//
Introductory text
//
rest of dialog contents
//
"aria-describedby":"", postMixInProperties: function(){ var _nlsResources = i18n.getLocalization("dijit", "common"); lang.mixin(this, _nlsResources); this.inherited(arguments); }, postCreate: function(){ domStyle.set(this.domNode, { display: "none", position:"absolute" }); win.body().appendChild(this.domNode); this.inherited(arguments); this.connect(this, "onExecute", "hide"); this.connect(this, "onCancel", "hide"); this._modalconnects = []; }, onLoad: function(){ // summary: // Called when data has been loaded from an href. // Unlike most other callbacks, this function can be connected to (via `dojo.connect`) // but should *not* be overridden. // tags: // callback // when href is specified we need to reposition the dialog after the data is loaded // and find the focusable elements this._position(); if(this.autofocus && DialogLevelManager.isTop(this)){ this._getFocusItems(this.domNode); focus.focus(this._firstFocusItem); } this.inherited(arguments); }, _endDrag: function(){ // summary: // Called after dragging the Dialog. Saves the position of the dialog in the viewport, // and also adjust position to be fully within the viewport, so user doesn't lose access to handle var nodePosition = domGeometry.position(this.domNode), viewport = winUtils.getBox(); nodePosition.y = Math.min(Math.max(nodePosition.y, 0), (viewport.h - nodePosition.h)); nodePosition.x = Math.min(Math.max(nodePosition.x, 0), (viewport.w - nodePosition.w)); this._relativePosition = nodePosition; this._position(); }, _setup: function(){ // summary: // Stuff we need to do before showing the Dialog for the first // time (but we defer it until right beforehand, for // performance reasons). // tags: // private var node = this.domNode; if(this.titleBar && this.draggable){ this._moveable = new ((has("ie") == 6) ? TimedMoveable // prevent overload, see #5285 : Moveable)(node, { handle: this.titleBar }); this.connect(this._moveable, "onMoveStop", "_endDrag"); }else{ domClass.add(node,"dijitDialogFixed"); } this.underlayAttrs = { dialogId: this.id, "class": array.map(this["class"].split(/\s/), function(s){ return s+"_underlay"; }).join(" ") }; }, _size: function(){ // summary: // If necessary, shrink dialog contents so dialog fits in viewport // tags: // private this._checkIfSingleChild(); // If we resized the dialog contents earlier, reset them back to original size, so // that if the user later increases the viewport size, the dialog can display w/out a scrollbar. // Need to do this before the domGeometry.position(this.domNode) call below. if(this._singleChild){ if(this._singleChildOriginalStyle){ this._singleChild.domNode.style.cssText = this._singleChildOriginalStyle; } delete this._singleChildOriginalStyle; }else{ domStyle.set(this.containerNode, { width:"auto", height:"auto" }); } var bb = domGeometry.position(this.domNode); var viewport = winUtils.getBox(); if(bb.w >= viewport.w || bb.h >= viewport.h){ // Reduce size of dialog contents so that dialog fits in viewport var w = Math.min(bb.w, Math.floor(viewport.w * 0.75)), h = Math.min(bb.h, Math.floor(viewport.h * 0.75)); if(this._singleChild && this._singleChild.resize){ this._singleChildOriginalStyle = this._singleChild.domNode.style.cssText; this._singleChild.resize({w: w, h: h}); }else{ domStyle.set(this.containerNode, { width: w + "px", height: h + "px", overflow: "auto", position: "relative" // workaround IE bug moving scrollbar or dragging dialog }); } }else{ if(this._singleChild && this._singleChild.resize){ this._singleChild.resize(); } } }, _position: function(){ // summary: // Position modal dialog in the viewport. If no relative offset // in the viewport has been determined (by dragging, for instance), // center the node. Otherwise, use the Dialog's stored relative offset, // and position the node to top: left: values based on the viewport. if(!domClass.contains(win.body(), "dojoMove")){ // don't do anything if called during auto-scroll var node = this.domNode, viewport = winUtils.getBox(), p = this._relativePosition, bb = p ? null : domGeometry.position(node), l = Math.floor(viewport.l + (p ? p.x : (viewport.w - bb.w) / 2)), t = Math.floor(viewport.t + (p ? p.y : (viewport.h - bb.h) / 2)) ; domStyle.set(node,{ left: l + "px", top: t + "px" }); } }, _onKey: function(/*Event*/ evt){ // summary: // Handles the keyboard events for accessibility reasons // tags: // private if(evt.charOrCode){ var node = evt.target; if(evt.charOrCode === keys.TAB){ this._getFocusItems(this.domNode); } var singleFocusItem = (this._firstFocusItem == this._lastFocusItem); // see if we are shift-tabbing from first focusable item on dialog if(node == this._firstFocusItem && evt.shiftKey && evt.charOrCode === keys.TAB){ if(!singleFocusItem){ focus.focus(this._lastFocusItem); // send focus to last item in dialog } event.stop(evt); }else if(node == this._lastFocusItem && evt.charOrCode === keys.TAB && !evt.shiftKey){ if(!singleFocusItem){ focus.focus(this._firstFocusItem); // send focus to first item in dialog } event.stop(evt); }else{ // see if the key is for the dialog while(node){ if(node == this.domNode || domClass.contains(node, "dijitPopup")){ if(evt.charOrCode == keys.ESCAPE){ this.onCancel(); }else{ return; // just let it go } } node = node.parentNode; } // this key is for the disabled document window if(evt.charOrCode !== keys.TAB){ // allow tabbing into the dialog for a11y event.stop(evt); // opera won't tab to a div }else if(!has("opera")){ try{ this._firstFocusItem.focus(); }catch(e){ /*squelch*/ } } } } }, show: function(){ // summary: // Display the dialog // returns: dojo.Deferred // Deferred object that resolves when the display animation is complete if(this.open){ return; } if(!this._started){ this.startup(); } // first time we show the dialog, there's some initialization stuff to do if(!this._alreadyInitialized){ this._setup(); this._alreadyInitialized=true; } if(this._fadeOutDeferred){ this._fadeOutDeferred.cancel(); } this._modalconnects.push(on(window, "scroll", lang.hitch(this, "layout"))); this._modalconnects.push(on(window, "resize", lang.hitch(this, function(){ // IE gives spurious resize events and can actually get stuck // in an infinite loop if we don't ignore them var viewport = winUtils.getBox(); if(!this._oldViewport || viewport.h != this._oldViewport.h || viewport.w != this._oldViewport.w){ this.layout(); this._oldViewport = viewport; } }))); this._modalconnects.push(on(this.domNode, connect._keypress, lang.hitch(this, "_onKey"))); domStyle.set(this.domNode, { opacity:0, display:"" }); this._set("open", true); this._onShow(); // lazy load trigger this._size(); this._position(); // fade-in Animation object, setup below var fadeIn; this._fadeInDeferred = new Deferred(lang.hitch(this, function(){ fadeIn.stop(); delete this._fadeInDeferred; })); fadeIn = fx.fadeIn({ node: this.domNode, duration: this.duration, beforeBegin: lang.hitch(this, function(){ DialogLevelManager.show(this, this.underlayAttrs); }), onEnd: lang.hitch(this, function(){ if(this.autofocus && DialogLevelManager.isTop(this)){ // find focusable items each time dialog is shown since if dialog contains a widget the // first focusable items can change this._getFocusItems(this.domNode); focus.focus(this._firstFocusItem); } this._fadeInDeferred.callback(true); delete this._fadeInDeferred; }) }).play(); return this._fadeInDeferred; }, hide: function(){ // summary: // Hide the dialog // returns: dojo.Deferred // Deferred object that resolves when the hide animation is complete // if we haven't been initialized yet then we aren't showing and we can just return if(!this._alreadyInitialized){ return; } if(this._fadeInDeferred){ this._fadeInDeferred.cancel(); } // fade-in Animation object, setup below var fadeOut; this._fadeOutDeferred = new Deferred(lang.hitch(this, function(){ fadeOut.stop(); delete this._fadeOutDeferred; })); // fire onHide when the promise resolves. this._fadeOutDeferred.then(lang.hitch(this, 'onHide')); fadeOut = fx.fadeOut({ node: this.domNode, duration: this.duration, onEnd: lang.hitch(this, function(){ this.domNode.style.display = "none"; DialogLevelManager.hide(this); this._fadeOutDeferred.callback(true); delete this._fadeOutDeferred; }) }).play(); if(this._scrollConnected){ this._scrollConnected = false; } var h; while(h = this._modalconnects.pop()){ h.remove(); } if(this._relativePosition){ delete this._relativePosition; } this._set("open", false); return this._fadeOutDeferred; }, layout: function(){ // summary: // Position the Dialog and the underlay // tags: // private if(this.domNode.style.display != "none"){ if(dijit._underlay){ // avoid race condition during show() dijit._underlay.layout(); } this._position(); } }, destroy: function(){ if(this._fadeInDeferred){ this._fadeInDeferred.cancel(); } if(this._fadeOutDeferred){ this._fadeOutDeferred.cancel(); } if(this._moveable){ this._moveable.destroy(); } var h; while(h = this._modalconnects.pop()){ h.remove(); } DialogLevelManager.hide(this); this.inherited(arguments); } }); var Dialog = declare("dijit.Dialog", [ContentPane, _DialogBase], {}); Dialog._DialogBase = _DialogBase; // for monkey patching var DialogLevelManager = Dialog._DialogLevelManager = { // summary: // Controls the various active "levels" on the page, starting with the // stuff initially visible on the page (at z-index 0), and then having an entry for // each Dialog shown. _beginZIndex: 950, show: function(/*dijit._Widget*/ dialog, /*Object*/ underlayAttrs){ // summary: // Call right before fade-in animation for new dialog. // Saves current focus, displays/adjusts underlay for new dialog, // and sets the z-index of the dialog itself. // // New dialog will be displayed on top of all currently displayed dialogs. // // Caller is responsible for setting focus in new dialog after the fade-in // animation completes. // Save current focus ds[ds.length-1].focus = focus.curNode; // Display the underlay, or if already displayed then adjust for this new dialog var underlay = dijit._underlay; if(!underlay || underlay._destroyed){ underlay = dijit._underlay = new DialogUnderlay(underlayAttrs); }else{ underlay.set(dialog.underlayAttrs); } // Set z-index a bit above previous dialog var zIndex = ds[ds.length-1].dialog ? ds[ds.length-1].zIndex + 2 : Dialog._DialogLevelManager._beginZIndex; if(ds.length == 1){ // first dialog underlay.show(); } domStyle.set(dijit._underlay.domNode, 'zIndex', zIndex - 1); // Dialog domStyle.set(dialog.domNode, 'zIndex', zIndex); ds.push({dialog: dialog, underlayAttrs: underlayAttrs, zIndex: zIndex}); }, hide: function(/*dijit._Widget*/ dialog){ // summary: // Called when the specified dialog is hidden/destroyed, after the fade-out // animation ends, in order to reset page focus, fix the underlay, etc. // If the specified dialog isn't open then does nothing. // // Caller is responsible for either setting display:none on the dialog domNode, // or calling dijit.popup.hide(), or removing it from the page DOM. if(ds[ds.length-1].dialog == dialog){ // Removing the top (or only) dialog in the stack, return focus // to previous dialog ds.pop(); var pd = ds[ds.length-1]; // the new active dialog (or the base page itself) // Adjust underlay if(ds.length == 1){ // Returning to original page. // Hide the underlay, unless the underlay widget has already been destroyed // because we are being called during page unload (when all widgets are destroyed) if(!dijit._underlay._destroyed){ dijit._underlay.hide(); } }else{ // Popping back to previous dialog, adjust underlay domStyle.set(dijit._underlay.domNode, 'zIndex', pd.zIndex - 1); dijit._underlay.set(pd.underlayAttrs); } // Adjust focus if(dialog.refocus){ // If we are returning control to a previous dialog but for some reason // that dialog didn't have a focused field, set focus to first focusable item. // This situation could happen if two dialogs appeared at nearly the same time, // since a dialog doesn't set it's focus until the fade-in is finished. var focus = pd.focus; if(pd.dialog && (!focus || !dom.isDescendant(focus, pd.dialog.domNode))){ pd.dialog._getFocusItems(pd.dialog.domNode); focus = pd.dialog._firstFocusItem; } if(focus){ focus.focus(); } } }else{ // Removing a dialog out of order (#9944, #10705). // Don't need to mess with underlay or z-index or anything. var idx = array.indexOf(array.map(ds, function(elem){return elem.dialog}), dialog); if(idx != -1){ ds.splice(idx, 1); } } }, isTop: function(/*dijit._Widget*/ dialog){ // summary: // Returns true if specified Dialog is the top in the task return ds[ds.length-1].dialog == dialog; } }; // Stack representing the various active "levels" on the page, starting with the // stuff initially visible on the page (at z-index 0), and then having an entry for // each Dialog shown. // Each element in stack has form { // dialog: dialogWidget, // focus: returnFromGetFocus(), // underlayAttrs: attributes to set on underlay (when this widget is active) // } var ds = Dialog._dialogStack = [ {dialog: null, focus: null, underlayAttrs: null} // entry for stuff at z-index: 0 ]; // Back compat w/1.6, remove for 2.0 if(!kernel.isAsync){ ready(0, function(){ var requires = ["dijit/TooltipDialog"]; require(requires); // use indirection so modules not rolled into a build }); } return Dialog; });