// Settings
var addHeight                       = -170;
var maxWidth                        = 1100;
var pboxWidth                       = 430;

// Function - Load Preview Box 
function loadPreviewBox() {

    // Vars
    var hrefEle                     = document.getElementsByTagName('a');
    
    // For - ImgBox Elements
    for(z=0; z < hrefEle.length; z++) {
    
        // Vars
        relAttribute                = String(hrefEle[z].getAttribute('rel'));

        // If - Rel -> imgBox
        if( relAttribute.match('imgBox') ) { 
        
        	// Element - On Mouse Over
            hrefEle[z].onmouseover   = new Function ("setPreviewBoxShow(this)");
        }
    }
}


// Function - Find Position Object
function findPos(obj) {

    // Vars
    var curleft                     = curtop = 0;
    
    // If - Do / While
    if(obj.offsetParent) {
        do {
            curleft                 += obj.offsetLeft;
            curtop                  += obj.offsetTop;
        } while (obj = obj.offsetParent);
    }
    
    // Return
    return [curleft,curtop];
}

// Function - Get Scroll XY
function getScrollXY() {

    // Vars
    var scrOfX = 0, scrOfY = 0;
    
    // If - Browser Type
    if( typeof( window.pageYOffset ) == 'number' ) {
    
        //Netscape compliant
        scrOfY = window.pageYOffset;
        scrOfX = window.pageXOffset;
    } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    
        //DOM compliant
        scrOfY = document.body.scrollTop;
        scrOfX = document.body.scrollLeft;
    } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    
        //IE6 standards compliant mode
        scrOfY = document.documentElement.scrollTop;
        scrOfX = document.documentElement.scrollLeft;
    }
    
    // Return
    return [scrOfX,scrOfY];
}

// Function - Get Image Size
function getImgSize(imgSrc)
{
    var newImg  = new Image();
    newImg.src  = imgSrc;

    var height  = newImg.height;
    var width   = newImg.width;

    return [width,height];
}

// Function - Set Preview Box Show
function setPreviewBoxShow(ele) {

    // Vars
    var prevBox                     = document.getElementById("previewBox");
    var prevBoxImg                  = document.getElementById("previewBoxImg");
    var prevBoxTxt                  = document.getElementById("previewBoxTxt");
    
    // Setting 
    prevBox.style.display           = "block";
    prevBoxImg.src                  = ele.getAttribute('href');
    
    // Title
    valTitle                        = ele.getAttribute('title')
    //if( valTitle ) {
        //prevBoxTxt.innerHTML        = valTitle;
    //}
    
    // Setting - Position
    elePosi                         = findPos(ele).toString();
    elePosiR                        = elePosi.split(",");
    
    // Scroll Height
    eleScrollPosi                   = getScrollXY().toString();
    eleScrollPosiR                  = eleScrollPosi.split(",");
    addScrollHeight                 = prevBoxImg.height - (elePosiR[1] - eleScrollPosiR[1]);
    if( addScrollHeight < 0 )       addScrollHeight = 0;
    else                            addScrollHeight = addScrollHeight / 1.4;

    // Img Width
    addImageWidth                   = pboxWidth;
    srcImageInfo                    = getImgSize(ele.getAttribute('href')).toString();
    srcImageInfoR                   = srcImageInfo.split(",");
    if( srcImageInfoR[0] > 0 ) {
      newImagePropo                 = (100 / srcImageInfoR[1]) * 260;
      newImageWidth                 = (srcImageInfoR[0] / 100) * newImagePropo;
      
      if( newImageWidth < pboxWidth ) {
        if( newImageWidth < 220 )   newImageWidth = 220;
        addImageWidth               = newImageWidth + 40;
      } 
    }

    // If - Get Ele Posi
    if( elePosiR ) {
        prevBox.style.top           = (parseInt(elePosiR[1])+addHeight)+addScrollHeight+"px";
        if( elePosiR[0] > (maxWidth * 0.5) ) {
            prevBox.style.left          = (parseInt(elePosiR[0])-addImageWidth)+"px";
        } else {
            prevBox.style.left          = (parseInt(elePosiR[0])+(addImageWidth / 1.1))+"px";
        }  
        
        // Set - Left x - Mark
        prevBox.style.left          = 735+"px"; 
    }
    
    // Element - On Mouse Out
    ele.onmouseout                  = setPreviewBoxHidden;
}

// Function - Set Preview Box Hidden
function setPreviewBoxHidden() {

    // Vars
    var prevBox                     = document.getElementById("previewBox");
    var prevBoxImg                  = document.getElementById("previewBoxImg");
    
    // Setting 
    prevBox.style.display           = "none";
    //prevBoxImg.src                  = "images/loading.jpg";
}