(function() {
	
	var zIndex = 500;
	var currentIndex = 0;
    var layerDefaultStyle = {
        width : "100%",
        height : "100%",
        borderStyle : "none",
        display : "none",
//        position : 'absolute',
        position : 'fixed',
        overflow : 'hidden',
        filter : 'alpha(opacity=50)',
        '-moz-opacity' : .8,
        opacity : .8,
        margin : 0,
        backgroundColor : 'black'
    };
    /*@cc_on if (@_jscript_version < 5.7) layerDefaultStyle.position = 'absolute'; 
    @*/
    
	var layers = [document.createElement ('DIV')/*@cc_on, document.createElement ('IFRAME')@*/];

	Logi.each (layers, function (layer, i) {
        var layerStyle = layer.style;
        for (var prop in layerDefaultStyle) {
            layerStyle[prop] = layerDefaultStyle[prop];
        }
        layer.className = 'logi_layer_fog';
	    layer.id = 'logi_layer_' + i;
	});
    
    var isInitialized = false;

    var clickHandler = function() {
		Logi.each (handlers[zIndex] || [], function (handler, i) {
			handler();
		});    	
    }
    
    function init() {
    	if (!isInitialized) {
    		/*@cc_on 
    		document.body.insertBefore (layers[1], document.body.firstChild);
    		@*/
    		document.body.insertBefore (layers[0], document.body.firstChild);
    		
    		Logi.DOM.Element.compatNode (layers[0]).addEventListener ('click', clickHandler, true);     		
    		isInitialized = true;
    	}
    }

    var handlers = {};
    
	Logi.UI.LayerManager = {

		handleLayerClick : function (zIndex, handler) {
			handlers[zIndex] = handlers[zIndex] || [];
			handlers[zIndex].push (handler);
		},
			
		//return the zIndex 
		requestLayer : function() {
			init();
			var needsShow = currentIndex == 0;
			currentIndex++;
			zIndex += 3;
			Logi.each (layers, function (layer, i) {
				//layer.style.zIndex = zIndex - 2 + i;
				layer.style.zIndex = zIndex - 1 - i;
				if (needsShow) {
					layer.style.display = 'block';
				}
			});
			return zIndex;
		},
		
		disposeLayer : function() {
			init();
			delete handlers[zIndex];
			zIndex -= 3;
			currentIndex --;
			Logi.each (layers, function (layer, i) {
				if (currentIndex == 0) {
					layer.style.display = 'none';
					layer.style.zIndex = 0;
				} else {
					//layer.style.zIndex = zIndex - 2 + i;
					layer.style.zIndex = zIndex - 1 - i;
				}
			});
			return zIndex;
		},
		
		getLayersCount : function() {
			return zIndex;
		}
		
		
	}
	
})();