﻿var _prefix = "ctl00_PageContent_";
var _realImageWidth = 0;
var _realImageHeight = 0;

function sizeImage()
{
    var img = document.getElementById(_prefix + "CurrentImage");
    var width = document.getElementById("contentInner").offsetWidth - 40; //document.documentElement.clientWidth - 40;
    var height = (window.innerHeight ? window.innerHeight : 
                  (document.documentElement.clientHeight ? document.documentElement.clientHeight : 
                  (document.body.clientHeight ? document.body.clientHeight : -1))) - 30;
    //alert(height);
    if( width < _realImageWidth )
    {
        document.getElementById("ScaleMessage").className = "";
        img.style.width = width + "px";
        img.style.height = '';
        if( height < document.getElementById(_prefix + "CurrentImage").height )
        {
            img.style.width = '';
            img.style.height = height + "px";
        }
    }
    else if( height < _realImageHeight )
    {
        document.getElementById("ScaleMessage").className = "";
        img.style.width = '';
        img.style.height = height + "px";
    }
    else
    {
        resetImage();
    }
}

function toggleAutoScale()
{
    if( document.getElementById("AutoScale").checked )
    {
        window.onresize = sizeImage;
        sizeImage();
    }
    else
    {
        window.onresize = null;
        resetImage();
    }
}

function resetImage()
{
    document.getElementById(_prefix + "CurrentImage").style.width = '';
    document.getElementById(_prefix + "CurrentImage").style.height = '';
    document.getElementById("ScaleMessage").className = "hidden";
}

function setUpAutoScale()
{
    _realImageWidth = document.getElementById(_prefix + "CurrentImage").width;
    _realImageHeight = document.getElementById(_prefix + "CurrentImage").height;
    sizeImage();
    toggleAutoScale();
}

window.onload = function()
{
    scrollImageIntoView(document.getElementById("SelectedImage"));
    setUpAutoScale();
}

function showImage(sender, src, alt, desc, isVideo)
{
    var img = document.getElementById(_prefix + "CurrentImage");
    var video = document.getElementById(_prefix + "CurrentVideo");
    var title = document.getElementById(_prefix + "ImageTitle");
    if( img.src.indexOf(_imagePath + src) == -1 || isVideo )
    {
        document.getElementById("SelectedImage").id = null;
        sender.parentNode.id = "SelectedImage";
        document.getElementById(_prefix + "ImageDescription").className = "hidden";
        updatePrevNext();
        resetImage();
        window.onresize = null;
        document.getElementById("AutoScale").disabled = true;
        if( isVideo )
        {
            img.src = "";
            video.className = "";
            img.className = "hidden";
            document.getElementById(_prefix + "ImageTitle").firstChild.nodeValue = alt;
            document.title = alt + " - ookii.org"
            if( desc.length > 0 )
            {
                var descElt = document.getElementById(_prefix + "ImageDescription");
                descElt.className = "";
                descElt.firstChild.nodeValue = desc;
            }
            video.innerHTML = '<object type="application/x-shockwave-flash" data="http://www.youtube.com/v/' + src + '&amp;rel=1" width="425" height="355"><param name="movie" value="http://www.youtube.com/v/' + src + '&amp;rel=1" /><param name="wmode" value="transparent" /></object>';
        }
        else
        {
            video.innerHTML = "";
            video.className = "hidden";
            img.className = "";
            img.style.visibility = "hidden";
            img.alt = alt;
            title.firstChild.nodeValue = "Loading...";
            img.onload = function()
            {
                img.style.visibility = "";
                img.className = "";                
                document.getElementById(_prefix + "ImageTitle").firstChild.nodeValue = alt;
                document.title = alt + " - ookii.org";
                if( desc.length > 0 )
                {
                    var descElt = document.getElementById(_prefix + "ImageDescription");
                    descElt.className = "";
                    descElt.firstChild.nodeValue = desc;
                }
                document.getElementById(_prefix + "CurrentImage").onload = null;
                document.getElementById("AutoScale").disabled = false;
                setUpAutoScale();
            }
            img.src = _imagePath + src;
        }
    }
    
    return false;
}

function nextImg()
{
    var selected = document.getElementById("SelectedImage");    
    var nextImg = selected.nextSibling;
    if( !(nextImg && nextImg.nodeType == 1) )
    {
        nextImg = selected.parentNode.getElementsByTagName("li")[0];
    }
    if( nextImg && nextImg.nodeType == 1 )
    {
        scrollImageIntoView(nextImg);
        nextImg.firstChild.onclick();
        return false;
    }
}

function scrollImageIntoView(img)
{
    var realOffset;
    if( navigator.userAgent.indexOf("Gecko") != -1 )
    {
        realOffset = img.offsetLeft - img.parentNode.offsetLeft;
    }
    else if( navigator.userAgent.indexOf("Opera") != -1 )
    {
        realOffset = img.offsetLeft - img.parentNode.offsetLeft + img.parentNode.scrollLeft;
    }
    else
        realOffset = img.offsetLeft;
    
    document.getElementById(_prefix + "PostImages").scrollLeft = realOffset - 125;
}

function prevImg()
{
    var selected = document.getElementById("SelectedImage");    
    var prevImg = selected.previousSibling;
    if( prevImg && prevImg.nodeType == 1 )
    {
        scrollImageIntoView(prevImg);
        prevImg.firstChild.onclick();
        return false;
    }
}

function updatePrevNext()
{
    var selected = document.getElementById("SelectedImage");
    var prev = document.getElementById(_prefix + "PreviousLink");
    var next = document.getElementById(_prefix + "NextLink");
    var prevImg = selected.previousSibling;
    var nextImg = selected.nextSibling;
    if( prevImg && prevImg.nodeType == 1 )
    {
        prev.className = "";
        prev.href = prevImg.firstChild.href;
    }
    else
        prev.className = "hidden";
    if( nextImg && nextImg.nodeType == 1 )
    {
        next.className = "";
        next.href = nextImg.firstChild.href;
    }
    else
        next.className = "hidden";
}