Loader.js 3.3 KB

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