﻿

function ImgWin(params)
{
    var _this = this;
    this.params = new Object();
    var win = false;
    var viewer = false;
    var loading = false;
    var progress = false;
    var wheel = false;
    this.params.winCss = "winStyle";
    this.params.viewerCss = "viewerStyle";
    this.params.loadingCss = "loadingStyle";
    this.params.progressCss = "progressStyle";
    this.params.wheelCss = "wheelStyle";
    this.params.loadingContent = "";
    this.params.imgUrl = "";
    this.params.element = false;
    this.params.mouseOffset = 0;
    var loadingImg = false;
    var winRect = false;
    var viewerRect = false;
    var loadingRect = false;
    var progressRect = false;
    var wheelRect = false;
    var srcMousePos = false;
    var progressPosition = 0;
    var timer = false;
    var progressTime = 10;
    var progressOffset = 2;
    this.onMouseOver = function(e)
    {
        if(!win)
        {
            _this.createWin(); 
            _this.loadImg(); 
        }
        e = Event.getEvent(e);
        var mousePos = Event.getClientXY(e);
        srcMousePos = Event.getXY(e);
        _this.setShowPosition(mousePos); 
        _this.show();
        if(loading) _this.showLoading();
        document.addEvent("onmousemove",_this.onMouseMove);
    };
    this.onMouseOut = function()
    {
        document.removeEvent("onmousemove",_this.onMouseMove);
        _this.hide();
        if(loading)  _this.hideLoading();
    };
    this.onMouseMove = function(e)
    {
        e = Event.getEvent(e);
        var mousePos = Event.getXY(e);
        var ox = mousePos.x - srcMousePos.x;
        var oy = mousePos.y - srcMousePos.y;
        var position = 
        {
            "left":winRect.left + ox,
            "top":winRect.top + oy
        };
        if(position.left < 0) position.left = 0;
        if(position.right < 0) position.right = 0;
        Dom.setPosition(win,position);
    };
    this.setShowPosition = function(mouseXY)
    {
        var documentRect = Dom.getDocumentRect();
        var halfWidth = Math.floor(documentRect.width/2);
        if(mouseXY.x > halfWidth)
        {
            winRect.left = mouseXY.x - winRect.width - _this.params.mouseOffset;
            if(winRect.left < 0) winRect.left = 0;
        }
        else
        {
            winRect.left = mouseXY.x + _this.params.mouseOffset;
            if((winRect.left + winRect.width) > documentRect.width) winRect.left = documentRect.width - winRect.width;
        }
        winRect.top = Math.floor((documentRect.height - winRect.height)/2);
		if((mouseXY.y + _this.params.mouseOffset) < winRect.top)
		{
			winRect.top = mouseXY.y + _this.params.mouseOffset;
		}
		else
		{
			if((mouseXY.y - _this.params.mouseOffset) > (winRect.top + winRect.height))
			{
				winRect.top = mouseXY.y - _this.params.mouseOffset - winRect.height;
				if(winRect.top < documentRect.top) winRect.top = documentRect.top;
			}
		}
        winRect.left = winRect.left + documentRect.left;
        winRect.top = winRect.top + documentRect.top;
        Dom.setPosition(win,winRect);
    };
    this.loadImg = function()
    {
        loadingImg = new Image();
        loadingImg.onload = _this.hasGetImg;
        loadingImg.src = _this.params.imgUrl;
    };
    this.hasGetImg = function()
    {
        viewer.style.backgroundImage = "url(" + loadingImg.src + ")";
        _this.hideLoading();
        _this.removeLoading();
    };
    this.createWin = function()
    {
        win = Dom.create("div",false,{className:_this.params.winCss});
        viewer = Dom.create("div",win,{className:_this.params.viewerCss});
        loading = Dom.create("div",viewer,{className:_this.params.loadingCss});
        loading.innerHTML = _this.params.loadingContent;
        progress = Dom.create("div",loading,{className:_this.params.progressCss});
        wheel = Dom.create("div",progress,{className:_this.params.wheelCss});
        viewerRect = Dom.getOffsetRect(viewer);
        loadingRect = Dom.getOffsetRect(loading);
        loadingRect.left = Math.floor((viewerRect.width - loadingRect.width)/2);
        loadingRect.top = Math.floor((viewerRect.height - loadingRect.height)/2);
        Dom.setPosition(loading,loadingRect);
        progressRect = Dom.getOffsetRect(progress);
        progressRect.left = Math.floor((loadingRect.width - progressRect.width)/2);
        Dom.setPosition(progress,progressRect);
        wheelRect = Dom.getOffsetRect(wheel);
        winRect = Dom.getAbsoluteRect(win);
    };
    this.removeLoading = function()
    {
        viewer.removeChild(loading);
        loading = false;
        progress = false;
        wheel = false;
    };
    this.show = function()
    {
        Dom.show(win);
    };
    
    this.hide = function()
    {
        Dom.hide(win);
    };
    this.showLoading = function()
    {
        Dom.show(loading);
        _this.startProgress();
    };
    this.startProgress = function()
    {
        timer = window.setTimeout(_this.progressing,progressTime);
    };
    this.progressing = function()
    {
        progressPosition += progressOffset;
        if(progressPosition > progress.offsetWidth) progressPosition = progress.offsetWidth - progressPosition;
        wheel.style.left = progressPosition + "px";
        _this.startProgress();
    };
    this.endProgress = function()
    {
        if(timer)
        {
            window.clearTimeout(timer);
            timer = false;
        }
    };
    this.hideLoading = function()
    {
        _this.endProgress();
        Dom.hide(loading);
    };
    this.bindBaseEvent = function()
    {
        _this.params.element.addEvent("onmouseover",_this.onMouseOver);
        _this.params.element.addEvent("onmouseout",_this.onMouseOut);
    };
    this.initParams = function(params)
    {
        if(typeof(params) == "object")
        {
            for(var item in params) _this.params[item] = params[item];
        }
    };
    this.init = function()
    {
        _this.initParams(params);
        
        Event.pack(_this.params.element);
        _this.bindBaseEvent();
    };
    window.addEvent("onload",this.init);
}
