/modules/mod_base/lib/js/modules/jquery.loadmask.js

  1/**
  2 * Copyright (c) 2009 Sergiy Kovalchuk (serg472@gmail.com)
  3 * 
  4 * Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php)
  5 * and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses.
  6 *  
  7 * Following code is based on Element.mask() implementation from ExtJS framework (http://extjs.com/)
  8 *
  9 */
 10;(function($){
 11	
 12	/**
 13	 * Displays loading mask over selected element(s). Accepts both single and multiple selectors.
 14	 *
 15	 * @param label Text message that will be displayed on top of the mask besides a spinner (optional). 
 16	 * 				If not provided only mask will be displayed without a label or a spinner.  	
 17	 * @param delay Delay in milliseconds before element is masked (optional). If unmask() is called 
 18	 *              before the delay times out, no mask is displayed. This can be used to prevent unnecessary 
 19	 *              mask display for quick processes.   	
 20	 */
 21	$.fn.mask = function(label, delay){
 22		$(this).each(function() {
 23			if(delay !== undefined && delay > 0) {
 24		        var element = $(this);
 25		        element.data("_mask_timeout", setTimeout(function() { $.maskElement(element, label)}, delay));
 26			} else {
 27				$.maskElement($(this), label);
 28			}
 29		});
 30	};
 31	
 32	/**
 33	 * Removes mask from the element(s). Accepts both single and multiple selectors.
 34	 */
 35	$.fn.unmask = function(){
 36		$(this).each(function() {
 37			$.unmaskElement($(this));
 38		});
 39	};
 40	
 41	/**
 42	 * Checks if a single element is masked. Returns false if mask is delayed or not displayed. 
 43	 */
 44	$.fn.isMasked = function(){
 45		return this.hasClass("masked");
 46	};
 47
 48	/**
 49	 * Show or update the upload progressbar
 50	 */
 51	$.fn.maskProgress = function(value){
 52		$(this).each(function() {
 53			$.maskProgress($(this), value);
 54		});
 55	};
 56
 57	$.maskElement = function(element, label){
 58	
 59		//if this element has delayed mask scheduled then remove it and display the new one
 60		if (element.data("_mask_timeout") !== undefined) {
 61			clearTimeout(element.data("_mask_timeout"));
 62			element.removeData("_mask_timeout");
 63		}
 64
 65		if(element.isMasked()) {
 66			$.unmaskElement(element);
 67		}
 68		
 69		if(element.css("position") == "static") {
 70			element.addClass("masked-relative");
 71		}
 72		
 73		element.addClass("masked");
 74		
 75		var maskDiv = $('<div class="loadmask"></div>');
 76		
 77		//auto height fix for IE
 78		if(navigator.userAgent.toLowerCase().indexOf("msie") > -1){
 79			maskDiv.height(element.height() + parseInt(element.css("padding-top")) + parseInt(element.css("padding-bottom")));
 80			maskDiv.width(element.width() + parseInt(element.css("padding-left")) + parseInt(element.css("padding-right")));
 81		}
 82		
 83		//fix for z-index bug with selects in IE6
 84		if(navigator.userAgent.toLowerCase().indexOf("msie 6") > -1){
 85			element.find("select").addClass("masked-hidden");
 86		}
 87		
 88		element.append(maskDiv);
 89		
 90		if ($(element).progressbar != undefined) {
 91			var maskProgressDiv = $('<div class="loadmask-progress" style="display:none;"></div>');
 92			element.append(maskProgressDiv);
 93			element.find(".loadmask-progress").progressbar({value: 0});
 94		}
 95		if(label !== undefined) {
 96			var maskMsgDiv = $('<div class="loadmask-msg" style="display:none;"></div>');
 97			maskMsgDiv.append('<div>' + label + '</div>');
 98			element.append(maskMsgDiv);
 99			
100			//calculate center position
101			maskMsgDiv.css("top", Math.round(element.height() / 2 - (maskMsgDiv.height() - parseInt(maskMsgDiv.css("padding-top")) - parseInt(maskMsgDiv.css("padding-bottom"))) / 2)+"px");
102			maskMsgDiv.css("left", Math.round(element.width() / 2 - (maskMsgDiv.width() - parseInt(maskMsgDiv.css("padding-left")) - parseInt(maskMsgDiv.css("padding-right"))) / 2)+"px");
103			
104			maskMsgDiv.show();
105		}
106	};
107	
108	$.maskProgress = function(element, value){
109		if ($(element).progressbar != undefined) {
110			element.find(".loadmask-progress").show().progressbar('option', 'value', value);
111			element.find(".loadmask-msg").hide();
112		}
113	};
114	
115	$.unmaskElement = function(element){
116		//if this element has delayed mask scheduled then remove it
117		if (element.data("_mask_timeout") !== undefined) {
118			clearTimeout(element.data("_mask_timeout"));
119			element.removeData("_mask_timeout");
120		}
121		
122		element.find(".loadmask-msg,.loadmask-progress,.loadmask").remove();
123		element.removeClass("masked");
124		element.removeClass("masked-relative");
125		element.find("select").removeClass("masked-hidden");
126	};
127 
128})(jQuery);