﻿var loadingOverSpread = function(option){
    this.$setOption(option);
    this.init();
};
loadingOverSpread.prototype = {
    $setOption : function(option) {
        this._option = jQuery.extend({
            loadImgSrc : "images/loading.gif",
            backgroundColor : "black",
            speed : 500
        }, option);
    },

    show : function(){
        if(this._isHidden == true){
            this._hideOverflow();
            var body = $("body")[0];
            this._overSpread.css({"position" : "absolute",
                              "left" : "0",
                              "display" : "block",
                              "opacity" : "0.8",
                              "height" : body.clientHeight + "px",
                              "width" : body.clientWidth + "px",
                              "top" : body.scrollTop + "px"});
            this._loadImgCenter();
            this._isHidden = false;
        }
    },
    
    hide : function(){
        if(this._isHidden != true){
            this._showOverflow();
            this._overSpread.fadeOut(this._option.speed);
            this._isHidden = true;
        }
    },
    
    _loadImgCenter : function(){
        var top = this._overSpread[0].scrollTop + this._overSpread[0].offsetHeight / 2 - this._loadImg[0].offsetHeight / 2 ;
        if (this._loadImg[0].style.top != top)
            this._loadImg[0].style.top = top;
        var left = $("body")[0].clientWidth / 2 - this._loadImg[0].offsetWidth / 2;
        if (this._loadImg[0].style.left != left)
            this._loadImg[0].style.left = left
    },
    _hideOverflow : function(){
        //$("body").css("overflowY" , "hidden");
    },
    
    _showOverflow : function(){
        //$("body").css("overflowY" , "auto");
    },
    
    init : function(){
        this._isHidden = true;
        var body = $("body");
        this._overSpread = $("<div style='background-color:"+ this._option.backgroundColor +";display:none'></div>");
        this._loadImg = $("<img src=\""+ this._option.loadImgSrc +"\" style='position:absolute'>");
        this._loadImg.appendTo(this._overSpread);
        this._overSpread.appendTo("body");
    }
};

