4 * Copyright(c) 2006-2007, Ext JS, LLC.
6 * Originally Released Under LGPL - original licence link has changed is not relivant.
9 * <script type="text/javascript">
14 * A simple utility class for generically masking elements while loading data. If the element being masked has
15 * an underlying {@link Roo.data.Store}, the masking will be automatically synchronized with the store's loading
16 * process and the mask element will be cached for reuse. For all other elements, this mask will replace the
17 * element's UpdateManager load indicator and will be destroyed after the initial load.
19 * Create a new LoadMask
20 * @param {String/HTMLElement/Roo.Element} el The element or DOM node, or its id
21 * @param {Object} config The config object
23 Roo.LoadMask = function(el, config){
24 this.el = Roo.get(el);
25 Roo.apply(this, config);
27 this.store.on('beforeload', this.onBeforeLoad, this);
28 this.store.on('load', this.onLoad, this);
29 this.store.on('loadexception', this.onLoadException, this);
30 this.removeMask = false;
32 var um = this.el.getUpdateManager();
33 um.showLoadIndicator = false; // disable the default indicator
34 um.on('beforeupdate', this.onBeforeLoad, this);
35 um.on('update', this.onLoad, this);
36 um.on('failure', this.onLoad, this);
37 this.removeMask = true;
41 Roo.LoadMask.prototype = {
43 * @cfg {Boolean} removeMask
44 * True to create a single-use mask that is automatically destroyed after loading (useful for page loads),
45 * False to persist the mask element reference for multiple uses (e.g., for paged data widgets). Defaults to false.
50 * The text to display in a centered loading message box (defaults to 'Loading...')
54 * @cfg {String} msgCls
55 * The CSS class to apply to the loading message element (defaults to "x-mask-loading")
57 msgCls : 'x-mask-loading',
60 * Read-only. True if the mask is currently disabled so that it will not be displayed (defaults to false)
66 * Disables the mask to prevent it from being displayed
73 * Enables the mask so that it can be displayed
76 this.disabled = false;
79 onLoadException : function()
83 if (typeof(arguments[3]) != 'undefined') {
84 Roo.MessageBox.alert("Error loading",arguments[3]);
88 if (this.store && typeof(this.store.reader.jsonData.errorMsg) != 'undefined') {
89 Roo.MessageBox.alert("Error loading",this.store.reader.jsonData.errorMsg);
96 (function() { this.el.unmask(this.removeMask); }).defer(50, this);
101 (function() { this.el.unmask(this.removeMask); }).defer(50, this);
105 onBeforeLoad : function(){
107 (function() { this.el.mask(this.msg, this.msgCls); }).defer(50, this);
112 destroy : function(){
114 this.store.un('beforeload', this.onBeforeLoad, this);
115 this.store.un('load', this.onLoad, this);
116 this.store.un('loadexception', this.onLoadException, this);
118 var um = this.el.getUpdateManager();
119 um.un('beforeupdate', this.onBeforeLoad, this);
120 um.un('update', this.onLoad, this);
121 um.un('failure', this.onLoad, this);