1 | dojo.provide("dojox.widget.Loader"); |
---|
2 | dojo.deprecated("dojox.widget.Loader", "", "2.0"); |
---|
3 | |
---|
4 | dojo.require("dijit._Widget"); |
---|
5 | dojo.require("dijit._Templated"); |
---|
6 | |
---|
7 | dojo.declare("dojox.widget.Loader", [dijit._Widget,dijit._Templated], { |
---|
8 | // summary: |
---|
9 | // a configurable global xhr-listener to display |
---|
10 | // a loading message during running xhr's or to simply provide |
---|
11 | // base-level topic to subscribe to for custom loading messages |
---|
12 | |
---|
13 | // loadIcon: String |
---|
14 | // location to the icon used. |
---|
15 | loadIcon: dojo.moduleUrl("dojox.widget.Loader","icons/loading.gif"), |
---|
16 | |
---|
17 | // loadMessage: String |
---|
18 | // string to use for progress loading |
---|
19 | loadMessage: 'Loading ...', |
---|
20 | |
---|
21 | // hasVisuals: Boolean |
---|
22 | // true to display a fixed loading message in TR cornder, false to unly provide |
---|
23 | // "Loader" topic to subscribe to for your own custom loading message. |
---|
24 | hasVisuals: true, |
---|
25 | |
---|
26 | // attachToPointer |
---|
27 | // true to use visual indicator where cursor is |
---|
28 | attachToPointer: true, |
---|
29 | |
---|
30 | // duration: Integer |
---|
31 | // time in ms to toggle in/out the visual load indicator |
---|
32 | duration: 125, |
---|
33 | |
---|
34 | // _offset: Integer |
---|
35 | // distance in px from the mouse pointer to show attachToPointer avatar |
---|
36 | _offset: 16, |
---|
37 | |
---|
38 | // holder for mousemove connection |
---|
39 | _pointerConnect: null, |
---|
40 | _xhrStart: null, |
---|
41 | _xhrEnd: null, |
---|
42 | |
---|
43 | templateString: '<div dojoAttachPoint="loadNode" class="dojoxLoader">' |
---|
44 | +'<img src="${loadIcon}" class="dojoxLoaderIcon"> <span dojoAttachPoint="loadMessageNode" class="dojoxLoaderMessage"></span>' |
---|
45 | +'</div>', |
---|
46 | |
---|
47 | postCreate: function(){ |
---|
48 | // summary: |
---|
49 | // setup the loader |
---|
50 | |
---|
51 | if(!this.hasVisuals){ |
---|
52 | this.loadNode.style.display = "none"; // _destroy()? |
---|
53 | }else{ |
---|
54 | if(this.attachToPointer){ |
---|
55 | dojo.removeClass(this.loadNode,"dojoxLoader"); |
---|
56 | dojo.addClass(this.loadNode,"dojoxLoaderPointer"); |
---|
57 | } |
---|
58 | this._hide(); |
---|
59 | } |
---|
60 | this._setMessage(this.loadMessage); |
---|
61 | |
---|
62 | // FIXME: create our connections. would be easier, and this might be redundant |
---|
63 | // if Deferred published something. XHR published stuff. FIXME to use that. |
---|
64 | this._xhrStart = this.connect(dojo,"_ioSetArgs","_show"); |
---|
65 | this._xhrEnd = this.connect(dojo.Deferred.prototype,"_fire","_hide"); |
---|
66 | |
---|
67 | }, |
---|
68 | |
---|
69 | _setMessage: function(/* String */ message){ |
---|
70 | // summary: |
---|
71 | // set's the message in the loader |
---|
72 | this.loadMessageNode.innerHTML = message; |
---|
73 | }, |
---|
74 | |
---|
75 | _putLoader: function(/* Event */ e){ |
---|
76 | // summary: |
---|
77 | // place the floating loading element based on mousemove connection position |
---|
78 | dijit.placeOnScreen(this.loadNode,{ x: e.clientX+this._offset, y:e.clientY+this._offset }, ["TL","BR"]); |
---|
79 | }, |
---|
80 | |
---|
81 | _show: function(){ |
---|
82 | // summary: |
---|
83 | // publish and show progress indicator |
---|
84 | dojo.publish("Loader",[{ message: 'started' }]); |
---|
85 | if(this.hasVisuals){ |
---|
86 | if(this.attachToPointer){ |
---|
87 | this._pointerConnect = this.connect(document,"onmousemove","_putLoader"); |
---|
88 | } |
---|
89 | dojo.style(this.loadNode, { |
---|
90 | opacity:0, display:"" |
---|
91 | }); |
---|
92 | dojo.fadeIn({ node: this.loadNode, duration:this.duration }).play(); |
---|
93 | } |
---|
94 | }, |
---|
95 | |
---|
96 | _hide: function(){ |
---|
97 | // summary: |
---|
98 | // publish "xhr ended" and hide progress indicator |
---|
99 | dojo.publish("Loader",[{ message: 'ended' }]); |
---|
100 | if(this.hasVisuals){ |
---|
101 | if(this.attachToPointer){ |
---|
102 | this.disconnect(this._pointerConnect); |
---|
103 | } |
---|
104 | dojo.fadeOut({ |
---|
105 | node: this.loadNode, |
---|
106 | duration:this.duration, |
---|
107 | onEnd: dojo.partial(dojo.style, this.loadNode, "display", "none") |
---|
108 | }).play(); |
---|
109 | } |
---|
110 | } |
---|
111 | |
---|
112 | }); |
---|