var PhotoViewer = new __PhotoViewer();

function __PhotoViewer() {}

(function()
{

    var CURRENT_PHOTO_POPUP = null;

    __PhotoViewer.prototype.Popup = function(thumbNail, cid, pid)
    {
        this.HidePopup();

        var panel = CURRENT_PHOTO_POPUP = CreatePopup();
        var img = document.createElement("img");

        thumbNail.onmousemove = function(e)
        {
            var x = 0, y = 0;
            
            if (window && window.event && window.event.clientX)
            {
                x = (window.event.clientX + document.documentElement.scrollLeft);
                y = (window.event.clientY + document.documentElement.scrollTop);
            }
            else
            {
                x = (e.pageX);
                y = (e.pageY);
            }
            
            if(x + 20 + panel.offsetWidth > document.body.offsetWidth)
            {
                //panel.childNodes[1].style.backgroundImage = "url(../App_Themes/" + SystemInfo.TemplateName + "/Images/Common/JobProfile/PhotoPopup/PhotoPopup_Middle2.gif)";
                panel.style.left = (x - panel.offsetWidth - 20) + "px";
            }
            else
            {
                //panel.childNodes[1].style.backgroundImage = "url(../App_Themes/" + SystemInfo.TemplateName + "/Images/Common/JobProfile/PhotoPopup/PhotoPopup_Middle.gif)";
                panel.style.left = (x + 20) + "px";
            }
            var top = (y - panel.offsetHeight / 2);
            if(top < 0) top = 0;
            panel.style.top = top + "px";
        }

        img.src = "../../Photos/" + cid + "/" + pid + ".png";
        img.alt = "";

        panel.childNodes[0].appendChild(img);
        
        if(thumbNail.title.length > 0)
        {
            panel.childNodes[1].innerHTML = thumbNail.title;
            panel.childNodes[1].style.padding = "5px";
        }
        document.body.appendChild(panel);
    }
    
    __PhotoViewer.prototype.HidePopup = function()
    {
        if(CURRENT_PHOTO_POPUP != null)
        {
            document.body.removeChild(CURRENT_PHOTO_POPUP);
            CURRENT_PHOTO_POPUP = null;
        }
    }
    
    function CreatePopup()
    {
        var panel = document.createElement("div");
        //var top = document.createElement("div");
        var middle = document.createElement("div");
        var bottom = document.createElement("div");
        
        //top.style.width = bottom.style.width = "434px";
        //top.style.fontSize = bottom.style.fontSize = "1px";

        //middle.style.backgroundImage = "url(../App_Themes/" + SystemInfo.TemplateName + "/Images/Common/JobProfile/PhotoPopup/PhotoPopup_Middle.gif)";
        middle.style.width = "385px";
        middle.style.textAlign = "center";
        middle.style.backgroundPosition = "center center";
        middle.style.backgroundRepeat = "repeat-y";
        
        bottom.style.textAlign = "center";
        
        panel.style.padding = "10px";
        panel.style.border = "dotted #ccc 1px";
        panel.style.backgroundColor = "#fff";

        //top.style.height = "16px";
        //bottom.style.height = "15px";
        
        //top.style.backgroundImage = "url(../App_Themes/" + SystemInfo.TemplateName + "/Images/Common/JobProfile/PhotoPopup/PhotoPopup_Top.gif)";
        //bottom.style.backgroundImage = "url(../App_Themes/" + SystemInfo.TemplateName + "/Images/Common/JobProfile/PhotoPopup/PhotoPopup_Bottom.gif)";
        
        //panel.appendChild(top);
        panel.appendChild(middle);
        panel.appendChild(bottom);
        
        panel.style.position = "absolute";
        
        return panel;
    }

})();