]>
Commit | Line | Data |
---|---|---|
1354d172 AD |
1 | define("dijit/DialogUnderlay", [ |
2 | "dojo/_base/declare", // declare | |
3 | "dojo/dom-attr", // domAttr.set | |
4 | "dojo/_base/window", // win.body | |
5 | "dojo/window", // winUtils.getBox | |
6 | "./_Widget", | |
7 | "./_TemplatedMixin", | |
8 | "./BackgroundIframe" | |
9 | ], function(declare, domAttr, win, winUtils, _Widget, _TemplatedMixin, BackgroundIframe){ | |
10 | ||
11 | /*===== | |
12 | var _Widget = dijit._Widget; | |
13 | var _TemplatedMixin = dijit._TemplatedMixin; | |
14 | =====*/ | |
15 | ||
16 | // module: | |
17 | // dijit/DialogUnderlay | |
18 | // summary: | |
19 | // The component that blocks the screen behind a `dijit.Dialog` | |
20 | ||
21 | return declare("dijit.DialogUnderlay", [_Widget, _TemplatedMixin], { | |
22 | // summary: | |
23 | // The component that blocks the screen behind a `dijit.Dialog` | |
24 | // | |
25 | // description: | |
26 | // A component used to block input behind a `dijit.Dialog`. Only a single | |
27 | // instance of this widget is created by `dijit.Dialog`, and saved as | |
28 | // a reference to be shared between all Dialogs as `dijit._underlay` | |
29 | // | |
30 | // The underlay itself can be styled based on and id: | |
31 | // | #myDialog_underlay { background-color:red; } | |
32 | // | |
33 | // In the case of `dijit.Dialog`, this id is based on the id of the Dialog, | |
34 | // suffixed with _underlay. | |
35 | ||
36 | // Template has two divs; outer div is used for fade-in/fade-out, and also to hold background iframe. | |
37 | // Inner div has opacity specified in CSS file. | |
38 | templateString: "<div class='dijitDialogUnderlayWrapper'><div class='dijitDialogUnderlay' data-dojo-attach-point='node'></div></div>", | |
39 | ||
40 | // Parameters on creation or updatable later | |
41 | ||
42 | // dialogId: String | |
43 | // Id of the dialog.... DialogUnderlay's id is based on this id | |
44 | dialogId: "", | |
45 | ||
46 | // class: String | |
47 | // This class name is used on the DialogUnderlay node, in addition to dijitDialogUnderlay | |
48 | "class": "", | |
49 | ||
50 | _setDialogIdAttr: function(id){ | |
51 | domAttr.set(this.node, "id", id + "_underlay"); | |
52 | this._set("dialogId", id); | |
53 | }, | |
54 | ||
55 | _setClassAttr: function(clazz){ | |
56 | this.node.className = "dijitDialogUnderlay " + clazz; | |
57 | this._set("class", clazz); | |
58 | }, | |
59 | ||
60 | postCreate: function(){ | |
61 | // summary: | |
62 | // Append the underlay to the body | |
63 | win.body().appendChild(this.domNode); | |
64 | }, | |
65 | ||
66 | layout: function(){ | |
67 | // summary: | |
68 | // Sets the background to the size of the viewport | |
69 | // | |
70 | // description: | |
71 | // Sets the background to the size of the viewport (rather than the size | |
72 | // of the document) since we need to cover the whole browser window, even | |
73 | // if the document is only a few lines long. | |
74 | // tags: | |
75 | // private | |
76 | ||
77 | var is = this.node.style, | |
78 | os = this.domNode.style; | |
79 | ||
80 | // hide the background temporarily, so that the background itself isn't | |
81 | // causing scrollbars to appear (might happen when user shrinks browser | |
82 | // window and then we are called to resize) | |
83 | os.display = "none"; | |
84 | ||
85 | // then resize and show | |
86 | var viewport = winUtils.getBox(); | |
87 | os.top = viewport.t + "px"; | |
88 | os.left = viewport.l + "px"; | |
89 | is.width = viewport.w + "px"; | |
90 | is.height = viewport.h + "px"; | |
91 | os.display = "block"; | |
92 | }, | |
93 | ||
94 | show: function(){ | |
95 | // summary: | |
96 | // Show the dialog underlay | |
97 | this.domNode.style.display = "block"; | |
98 | this.layout(); | |
99 | this.bgIframe = new BackgroundIframe(this.domNode); | |
100 | }, | |
101 | ||
102 | hide: function(){ | |
103 | // summary: | |
104 | // Hides the dialog underlay | |
105 | this.bgIframe.destroy(); | |
106 | delete this.bgIframe; | |
107 | this.domNode.style.display = "none"; | |
108 | } | |
109 | }); | |
110 | }); |