-
Notifications
You must be signed in to change notification settings - Fork 5
/
Copy pathblock.js
159 lines (136 loc) · 4.29 KB
/
block.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
define(["dojo"], function(dojo){
var d = dojo;
d.declare("dojo._Blocker", null, {
// summary: The blocker instance used by dojo.block to overlay a node
//
// duration: Integer
// The duration of the fadeIn/fadeOut for the overlay
duration: 400,
// opacity: Float
// The final opacity of the overlay. A number from 0 to 1
opacity: 0.6,
// backgroundColor: String
// The color to set the overlay
backgroundColor: "#fff",
// zIndex: Integer
// The z-index to apply to the overlay, should you need to adjust for higher elements
zIndex: 999,
constructor: function(node, args){
// the constructor function is always called by dojo.declare.
// first, mixin any passed args into this instance to override defaults, or hook in custom stuff
d.mixin(this, args);
// in-case someone passed node:"something", force this.node to be the first param
this.node = d.byId(node);
// create a node for our overlay.
this.overlay = d.doc.createElement('div');
// do some chained magic nonsense
d.query(this.overlay)
// make it the last-child of <body>
.place(d.body(),"last")
// give it a common class
.addClass("dojoBlockOverlay")
// mixin our styles. I'd prefer to do this purly in CSS, but that would
// require external css somehow, and is an extra file. ;)
.style({
// FIXME: can't we do all of this except opacity in .dojoBlockOverlay ?
backgroundColor: this.backgroundColor,
position: "absolute",
zIndex: this.zIndex,
display: "none",
opacity: this.opacity
});
},
_position: function(){
var pos = d.position(this.node, true);
// adjust for margins/padding: (edge case, may only be this demo's styles)
pos = d.mixin(d.marginBox(this.node), {
l: pos.x, t: pos.y
});
d.style(this.overlay,{
position:"absolute",
left: pos.x + "px",
width: pos.w + "px",
height: pos.h + "px",
top: pos.y + "px"
});
},
show: function(){
// summary: Show this overlay
if(this._showing){ return; }
var ov = this.overlay;
this._position();
if(this.keepPosition){
this.positionConnect = d.connect(window, "onresize", this, "_position");
}
d.style(ov, { opacity:0, display:"block" });
d.anim(ov, { opacity: this.opacity }, this.duration);
this._showing = true;
},
hide: function(){
// summary: Hide this overlay
d.fadeOut({
node: this.overlay,
duration: this.duration,
// when the fadeout is done, set the overlay to display:none
onEnd: d.hitch(this, function(){
d.style(this.overlay, "display", "none");
if(this.keepPosition){
d.disconnect(this.positionConnect);
}
this._showing = false;
})
}).play();
}
});
// Generates a unique id for a node
// FIXME: plugd base has dojo.generateId, but block has no other base deps than this:
var id_count = 0,
_uniqueId = function(){
var id_base = "dojo_blocked", id;
do{
id = id_base + "_" + (++id_count);
}while(d.byId(id));
return id;
},
// hash of all blockers
blockers = {}
;
d.mixin(d, {
block: function(/* String|DomNode */node, /* dojo.block._blockArgs */args){
// summary: Overlay the passed node to prevent further input, creates an
// instance of `dojo._Blocker` attached to this node byId, or generates a
// unique id if the node doesn't have one already.
//
// node: The node to overlay
// args: An object hash of configuration options. See `dojo._Blocker` for
// a list of parameters mixed in.
//
// returns: The `dojo._Blocker` instance created for the passed node for convenience.
// You can call var thing = dojo.block("someNode"); thing.hide(); or simply call
// dojo.unblock("someNode"), whichever you prefer.
var n = d.byId(node), id = d.attr(n, "id");
if(!id){
id = _uniqueId();
d.attr(n, "id", id);
}
if(!blockers[id]){
blockers[id] = new d._Blocker(node, args);
}
blockers[id].show();
return blockers[id]; // dojo._Blocker
},
unblock: function(node, args){
// summary: Unblock the passed node
var id = d.attr(node, "id");
if(id && blockers[id]){
blockers[id].hide();
}
}
});
var _each = d.NodeList._adaptAsForEach;
d.extend(d.NodeList, {
block: _each(d.block),
unblock: _each(d.unblock)
});
return d;
});