imgToView = new Array("anichkov.jpg", "emb.jpg", "isaak.jpg", "kazan_out.jpg", "peter.jpg",
                      "zimn.jpg", "emb.jpg", "office.jpg", "rus_mus.jpg", "petr_inside.jpg");
                      
startXScroll = [-120, -1100, -550, 500, 150, -250, -600, -250, 500, 280];

picWidths = [1115, 2449, 1075, 910, 1251, 1928, 2449, 1058, 995, 827];
var pictureHeight = 150;

imgObjects = new Array(imgToView.length);
for (var i=0; i<imgObjects.length; i++)
{
    imgObjects[i] = new Image(picWidths[i], pictureHeight);
}

imgPath = "/img/views/";
imgTemplate = "imgtemplate.html";

imgOffX = 100;
imgOffY = 100;

shadowOffset = 8;

maySelect = "false"

function changeImg(imgObj, newSrc)
{   //  changes image src
    imgObj.src = newSrc;
}

/*function closeWnd()
{
    document.all['picFrame'].style.visibility = 'hidden';
    document.all['picShadow'].style.visibility = 'hidden';
}
*/
//***********************************************************************
// Funtion (and vars) for picture scrolling

var picFrame = document.all.picFrame;
var picTable = document.all.picTable;
var pleaseWait = document.all.pleaseWait;
var picture01 = document.images.picture01;
var picture02 = document.images.picture02;

var picShadow = document.all.picShadow;
var cross = document.all.cross;
var slideBar = document.all.slideBar;
var thumb = document.all.thumb;
var actScroll = document.all.actScroll;

var frameWidth, frameHeight, frameLeft, frameTop;

var borderWidth = 2, scrollBarWidth = 16;
var thumbWidth = 16;

var docScrollWidth = 0;

var scrollIncr = 1, scrollRepeat = 20;
var scrollBarIncr = 5;
var scrollTimeOut;

var thumbMoving = 0;
var moveInterval = 0;
var moveRepeat = 50;
var clckX = 0;
var clckOffset = 0;

var minThumbLeft, maxThumbLeft, minThumbWidth = 10;

var imgNumber;

function move2Target(tX, tY, imgNum)
{   // moves all "window" parts (e.g. border, shadow, scrollbar to their targets)
    picShadow.style.left = tX + shadowOffset;
    picShadow.style.top = tY + shadowOffset;
    
    picFrame.style.left = tX;
    picFrame.style.top = tY;
    
    if (startXScroll[imgNum-1] < 0)
    {
        picTable.style.left = startXScroll[imgNum-1];
    }
    else
    {
        picTable.style.left = - picWidths[imgNum-1] + startXScroll[imgNum-1];
    }
    
    cross.style.left = tX + frameWidth - borderWidth - parseInt(cross.style.width, 10);
    cross.style.top = tY + borderWidth;
    slideBar.style.left = tX + borderWidth;
    slideBar.style.top =  tY + borderWidth + pictureHeight;
    actScroll.style.left = parseInt(thumb.style.left, 10) + thumbWidth;
    actScroll.style.top = slideBar.style.top;
    
    thumb.style.left = - parseInt(picTable.style.left, 10) * (maxThumbLeft-minThumbLeft)/(docScrollWidth-frameWidth) + minThumbLeft;
    thumb.style.top = slideBar.style.top
}

function loadImg(imgNum, linkX, linkY)
{   // loading new picture in the "window"
    showPicture("hidden");
    frameWidth = parseInt(picFrame.style.width, 10);
    frameHeight = parseInt(picFrame.style.height, 10);

    var targetX = linkX - imgOffX + shadowOffset;
    var targetY = linkY - imgOffY + shadowOffset;
    
    if (targetX + frameWidth > document.body.clientWidth)
    {
         targetX = document.body.clientWidth - frameWidth - shadowOffset;
    }
    if (targetX < 0) targetX = 0;
 
    if (targetY + frameHeight > document.body.clientHeight)
    {
        targetY = document.body.clientHeight - frameHeight - shadowOffset;
    }
    if (targetY < 0) targetY = 0;
    targetX += document.body.scrollLeft;
    targetY += document.body.scrollTop;
    frameLeft = targetX;
    frameTop = targetY;

    docScrollWidth = picWidths[imgNum-1] + frameWidth;
    scrollBarLength = frameWidth - 2 * (borderWidth + scrollBarWidth); 

    thumbWidth = parseInt(Math.max(((frameWidth-4)*scrollBarLength)/docScrollWidth, minThumbWidth));
    thumb.style.width = thumbWidth;
    
    minThumbLeft = frameLeft + borderWidth + scrollBarWidth;
    maxThumbLeft = minThumbLeft + scrollBarLength - thumbWidth + 1;
    
    move2Target(targetX, targetY, imgNum);
    showPicture("visible", imgNum);
}

function calcMouseX()
{   // calculating current mouse X coordinate of occured event (event.type isn't important)
    event.cancelBubble = true;
    return (document.body.scrollLeft + event.clientX);
}

function catchClickX()
{   // Catches click on scroll bar
    clckX = calcMouseX();
    var thumbLeft = parseInt(thumb.style.left);
    if (clckX >= thumbLeft && clckX <= thumbLeft + thumbWidth)
    {
        setMove(1);
        clckOffset = clckX - thumbLeft;
    }
    else
    {
        if (clckX < thumbLeft)
        {
            startScrollBar(-1);
        }
        else if (clckX > thumbLeft + thumbWidth)
        {
            startScrollBar(1);
        }
    }
}

function setMove(num)
{   // setting moving on or off
    thumbMoving = num;
}

function thumbMove()
{   //  moving thumbnail
    if (thumbMoving) 
    {   
        var currentMouseX = calcMouseX();
        var targetThumbX = currentMouseX - clckOffset;
        if (targetThumbX > maxThumbLeft)
            targetThumbX = maxThumbLeft;
        else if (targetThumbX < minThumbLeft)
            targetThumbX = minThumbLeft;
        thumb.style.left = targetThumbX;
        picTable.style.left = - ( (targetThumbX - minThumbLeft) * (docScrollWidth-frameWidth)/(maxThumbLeft-minThumbLeft) );
    }
}

function startScroll(dir)
{// start scrolling (dir must be -1(left)  or 1(right) )
    targetThumbX = parseInt(thumb.style.left) + dir * scrollIncr ;
    if (targetThumbX > maxThumbLeft)
        targetThumbX = minThumbLeft;
    else if (targetThumbX < minThumbLeft)
        targetThumbX = maxThumbLeft;
    thumb.style.left = targetThumbX; 
    picTable.style.left = -( (targetThumbX - minThumbLeft) * (docScrollWidth-frameWidth)/(maxThumbLeft-minThumbLeft) );
    scrollTimeOut = setTimeout("startScroll("+ dir+");", scrollRepeat);
}

function mkActScroll(targThmbX, clX)
{   //  make active scroll bar
    targThmbX = parseInt(targThmbX, 10);
    clX = parseInt(clX, 10)
    if (targThmbX > clX)
    {
        actScroll.style.left = minThumbLeft;
        actScroll.style.width = targThmbX - minThumbLeft;
        actScroll.style.visibility = "visible";
    }
    else if (targThmbX + thumbWidth < clX)
    {
        actScroll.style.left = targThmbX + thumbWidth;
        actScroll.style.width = maxThumbLeft - targThmbX;
        actScroll.style.visibility = "visible";
    }
    else
    {
        actScroll.style.visibility = "hidden";
    }
}

function startScrollBar(dir)
{   // dir must be -1(left)  or 1(right) 
    mkActScroll(thumb.style.left, clckX)
    targetThumbX = parseInt(thumb.style.left) + dir * scrollBarIncr;
    if (targetThumbX > maxThumbLeft)
        targetThumbX = maxThumbLeft;
    else if (targetThumbX < minThumbLeft)
        targetThumbX = minThumbLeft;
    
    thumb.style.left = targetThumbX;
    picTable.style.left = -((targetThumbX - minThumbLeft) * (docScrollWidth-frameWidth)/(maxThumbLeft-minThumbLeft));
    if (targetThumbX > clckX || targetThumbX + thumbWidth < clckX )
    {
        mkActScroll(targetThumbX, clckX);
        scrollTimeOut = setTimeout("startScrollBar("+ dir+");", scrollRepeat);
    }
    else
    {
        clearTimers()
    }
}

function showPic()
{
    if (picFrame.style.visibility = "visible") 
    {
        if (imgObjects[imgNumber - 1].complete)
        {
            showPicture("visible", imgNumber);
        }
        else 
        {
            setTimeout("showPic()", 200);
        }
    }
}


function showPicture(visible, imgNum)
{   // showing "picture window" exept picture itself (picture itself is showing when it loaded)
    picFrame.style.visibility = visible;
//    alert(imgNum);
    if (imgNum)
    {
        if ( !imgObjects[imgNum-1].complete )
        {
            pleaseWait.style.visibility = visible;
            preloadImg(imgObjects[imgNum-1], imgPath + imgToView[imgNum-1]);
            imgNumber = imgNum;
            showPic();
        }
        else
        {
            changeImg(picture01, imgPath + imgToView[imgNum-1]);
            changeImg(picture02, imgPath + imgToView[imgNum-1]);
            picture01.width = picWidths[imgNum-1];
            picture02.width = picWidths[imgNum-1];
//            alert(picture01.width + "|" + picture01.width);
            pleaseWait.style.visibility = "hidden";
            picTable.style.visibility = visible;
        }
    }
    else 
    {
        picTable.style.visibility = visible;
        pleaseWait.style.visibility = "hidden";
    }
    picShadow.style.visibility = visible;
    cross.style.visibility = visible;
    slideBar.style.visibility = visible;
    thumb.style.visibility = visible;
}

function preloadImg(imgObj, imgSrc)
{
    imgObj.src = imgSrc;
}

function closePicture()
{    // closing picture window
    picTable.style.visibility = "hidden";
    showPicture('hidden')
}


function clearTimers()
{   // clears all timeouts and intervals of scrolling function calls
    if (scrollTimeOut) 
    {
        actScroll.style.visibility = "hidden";
        clearTimeout(scrollTimeOut);
        scrollTimeOut = null;
    }
}