//
// Copyright (c) Microsoft | http://www.microsoft.com/rus/
// Author - kompot | kompot@design.ru
//

// инициируем массив, в котором будем хранить состояние нашей красоты
// если undefined - значит hidden, иначе - порядковый номер картинки открытого уровня
var boxStates = new Array();

// в этом массиве лежат ID уровней (ID берутся из XML'ных аттрибутов)
// если undefined - значит нет такого уровня
var boxIDs = new Array();

// кол-во иконов в каждом ряду (чтобы бегать менять opacity)
var boxTotalIcons = new Array();

function findPosX(obj)
{
        var curleft = 0;
        if (obj.offsetParent)
        {
                while (obj.offsetParent)
                {
                        curleft += obj.offsetLeft
                        obj = obj.offsetParent;
                }
        }
        else if (obj.x)
                curleft += obj.x;
        return curleft;
}

function findPosY(obj)
{
        var curtop = 0;
        if (obj.offsetParent)
        {
                while (obj.offsetParent)
                {
                        curtop += obj.offsetTop
                        obj = obj.offsetParent;
                }
        }
        else if (obj.y)
                curtop += obj.y;
        return curtop;
}

// высота угловой картинки
var cbrHeight = 10;
// расстояние между блоками
var spaceBetweenBoxes = 20;

// высота блока, как я понимаю
var boxContentHeight = 150;

var widthIncrement = 12;
var widthDecrement = 12;
var heightIncrement = 4;
var heightDecrement = 4;
var leftIncrement = 40;
var leftDecrement = 40;
var topIncrement = 10;
var topDecrement = 10;
var timeOutPeriod = 1;

function getYdelta(levelDepth) {
        if (levelDepth != 0)
        {
                delta = 0;
                for (i = levelDepth; i >= 1; i--) {
                        delta += document.getElementById("contents" + boxIDs[i]).offsetHeight
                }
                delta += levelDepth * spaceBetweenBoxes;
                return delta;
        }
        else
        {
                return 0;
        }
}

function startZoom(currentLevel, nextLevel, nextLevelResults, iconClicked, totalIconsInTheRow, totalIconsInTheNextRow, levelDepth)
{
        //alert(currentLevel);
        //alert(nextLevel);
        //alert(isNextLevelResults);
        //alert(iconClicked);
        //alert(totalIconsInTheRow);
        //alert(levelDepth);
        //alert(boxStates[levelDepth]);
        
        if (
                (document.getElementById && (navigator.userAgent.indexOf("Opera") == -1))
                ||
                (document.getElementById && (navigator.userAgent.indexOf("Opera 7") != -1))
        )
        {
                //alert('хоть что-то');
                if (!boxStates[levelDepth])
                {
                        //alert('еще ниже не проезжали, это хорошо');
                        changeSpacerHeight(levelDepth);
                        boxStates[levelDepth] = iconClicked;
                        boxIDs[levelDepth] = currentLevel;
                        boxIDs[levelDepth+1] = nextLevel;
                        boxTotalIcons[levelDepth] = totalIconsInTheRow;
                        boxTotalIcons[levelDepth+1] = totalIconsInTheNextRow;
                        currentX = findPosX(document.getElementById("box" + currentLevel + "pic" + iconClicked));
                        currentY = findPosY(document.getElementById("box" + currentLevel + "pic" + iconClicked));
                        // выбираем положение следующего блока
                        // работает только для фиксированной ширины
                        endX = findPosX(document.getElementById("box1ctl"));
                        
                        if (iconClicked == 1) {
                                endX = findPosX(document.getElementById("box1ctl"));
                        }
                        
                        if (((iconClicked == 2) || (iconClicked == 3)) && (totalIconsInTheNextRow == 2)) {
                                endX = findPosX(document.getElementById("box1ctl")) + 70;
                        }
                        
                        if ((iconClicked == 4) && (totalIconsInTheNextRow == 2)) {
                                endX = findPosX(document.getElementById("box1ctl")) + 140;
                        }
                        
                        if ((iconClicked == 4) && (totalIconsInTheNextRow == 3)) {
                                endX = findPosX(document.getElementById("box1ctl")) + 70;
                        }
                        endY = (findPosY(document.getElementById("box1cbr")) + cbrHeight + getYdelta(levelDepth) + spaceBetweenBoxes)
                        
                        endWidth = 70*totalIconsInTheNextRow;
                        
                        if (nextLevelResults != '')
                        {
                                endWidth = 200;
                        }
                        currentWidth = 0;
                        currentHeight = 0;
                        document.getElementById("contents" + nextLevel).style.display = 'block';
        
                        opacityRestore(nextLevel, totalIconsInTheNextRow);
                        opacityChange(currentLevel, iconClicked, totalIconsInTheRow);
                        drawConnector(currentLevel, iconClicked, nextLevel, levelDepth);
                        zoomIn(currentX, currentY, endX, endY, currentWidth, endWidth, currentHeight, nextLevel, nextLevelResults);
        
                }
                else
                {
                        if (boxStates[levelDepth] == iconClicked)
                        {
                                // do nothing
                        }
                        else
                        {
                                changeSpacerHeight(levelDepth);
                                var boxIDsLength = boxIDs.length;
                                for (i = boxIDsLength-1; i > levelDepth; i--)
                                {
                                        //alert(i)
                                        //alert(boxIDsLength-1)
                                        //alert(boxIDsLength)
                                        //alert(i)
                                        //alert(boxIDs[i])
                                        //alert(boxIDs[i-1])
                                        //alert(boxStates[i])
                                        if (i != 0)
                                        {
                                                document.getElementById("contents" + boxIDs[i] + "spacer").style.display = 'block';
                                                document.getElementById("contents" + boxIDs[i] + "pics").style.display = 'none';
                                                // этот if - чтобы реально сворачивалось только последнее окошко, иначе жуткие тормоза
                                                if (i == (levelDepth + 1))
                                                {
                                                        currentX = findPosX(document.getElementById("contents" + boxIDs[i]));
                                                        currentY = findPosY(document.getElementById("contents" + boxIDs[i]));
                                                        endX = findPosX(document.getElementById('box' + boxIDs[i-1] + 'pic' + boxStates[i-1]));
                                                        endY = findPosY(document.getElementById('box' + boxIDs[i-1] + 'pic' + boxStates[i-1]));
                                                        previousLevel = boxIDs[i];
                                                        currentWidth = 200;
                                                        endWidth = 0;
                                                        currentHeight = 80;
                                                        zoomOut(currentX, currentY, endX, endY, currentWidth, endWidth, currentHeight, previousLevel);
                                                }
                                                else
                                                {
                                                        document.getElementById("contents" + boxIDs[i]).style.display = 'none';
                                                }
                                                hideConnector(boxIDs[i]);
                                        }
                                        boxIDs.length = boxIDs.length - 1;
                                        boxStates.length = boxStates.length - 1;
                                        boxTotalIcons.length = boxTotalIcons.length - 1;
                                }
                                //startZoom(currentLevel, nextLevel, nextLevelResults, iconClicked, totalIconsInTheRow, totalIconsInTheNextRow, levelDepth);
                                setTimeout("startZoom('" + currentLevel + "', '" + nextLevel + "', '" + nextLevelResults + "', " + iconClicked + ", " + totalIconsInTheRow + ", " + totalIconsInTheNextRow + ", " + levelDepth + ")", 500);
                        }
                }
                return false;
        }
        else
        {
                //alert('кривой браузер');
                return true;
        }
}

function changeSpacerHeight(levelDepth)
{
        document.getElementById("globalSpacer").style.height = getYdelta(levelDepth) + 4*boxContentHeight;
}

function drawConnector(currentLevel, iconClicked, nextLevel, levelDepth)
{
        //alert(nextLevel);
        document.images["connector" + nextLevel + "pic"].height = spaceBetweenBoxes;
        document.images["connector" + nextLevel + "pic"].src = "/res/d-A5A2A2.gif";
        document.getElementById("connector" + nextLevel).style.display = 'block';
        document.getElementById("connector" + nextLevel).style.top = findPosY(document.getElementById("box1cbr")) + cbrHeight + getYdelta(levelDepth);
        document.getElementById("connector" + nextLevel).style.left = findPosX(document.getElementById("box" + currentLevel + "pic" + iconClicked)) + 24;
}

function hideConnector(nextLevel)
{
        document.getElementById("connector" + nextLevel).style.display = 'none';
}

function opacityChange(currentLevel, iconClicked, totalIconsInTheRow)
{
        for (n = 1; n <= totalIconsInTheRow; n++) {
                document.getElementById("pic" + currentLevel + n).className = "picActive";
                document.getElementById("title" + currentLevel + n).className = "picTitleActive";
                if (n != iconClicked) {
                        document.getElementById("pic" + currentLevel + n).className = "pic";
                        document.getElementById("title" + currentLevel + n).className = "picTitle";
                }
        }
}

function opacityRestore(nextLevel, totalIconsInTheNextRow)
{
        
        for (n = 1; n <= totalIconsInTheNextRow; n++) {
                document.getElementById("pic" + nextLevel + n).className = "picDefault";
                document.getElementById("title" + nextLevel + n).className = "picTitle";
        }
}

function zoomIn(currentX, currentY, endX, endY, currentWidth, endWidth, currentHeight, nextLevel, nextLevelResults)
{
        // alert("currentX: " + currentX + "     endX: " + endX + "\r\n" + "currentY: " + currentY + "     endY: " + endY + "\r\n" + "currentWidth: " + currentWidth + "     endWidth: " + endWidth + "\r\n")
        if ((!(currentWidth >= endWidth)) || (currentY != endY) || (currentX != endX))
        {
                if (currentHeight < boxContentHeight)
                {
                        currentHeight += heightIncrement;
                        document.getElementById("contents" + nextLevel + "spacer").style.height = currentHeight;
                }
                if (!(currentWidth >= endWidth))
                {
                        if ((endWidth - currentWidth) >= widthIncrement)
                        {
                                currentWidth += widthIncrement;
                        }
                        else
                        {
                                currentWidth = endWidth;
                        }
                        document.getElementById("contents" + nextLevel).style.width= currentWidth;
                }
                if (currentX > endX)
                {
                        
                        if ((currentX - endX) >= leftIncrement) {
                                currentX += -leftIncrement;
                        } else {
                                currentX = endX;
                        }
                        document.getElementById("contents" + nextLevel).style.left = currentX;
                }
                if (currentY < endY)
                {
                        if ((endY - currentY) >= topIncrement)
                        {
                                currentY += topIncrement;
                        }
                        else
                        {
                                currentY = endY;
                        }
                        document.getElementById("contents" + nextLevel).style.top = currentY;
                }
                setTimeout("zoomIn(" + currentX + ", " + currentY + ", " + endX + ", " + endY + ", " + currentWidth + ", " + endWidth + ", " + currentHeight + ", '" + nextLevel + "', '" + nextLevelResults + "')", timeOutPeriod);
        }
        else
        {
                document.getElementById("contents" + nextLevel + "spacer").style.display = 'none';
                document.getElementById("contents" + nextLevel + "pics").style.display = 'block';
        }
}

function zoomOut(currentX, currentY, endX, endY, currentWidth, endWidth, currentHeight, previousLevel)
{
        // alert("currentX: " + currentX + "     endX: " + endX + "\r\n" + "currentY: " + currentY + "     endY: " + endY + "\r\n" + "currentWidth: " + currentWidth + "     endWidth: " + endWidth + "\r\n")
        if ((currentWidth > 0) || (currentY != endY) || (currentX != endX))
        {
                if (currentHeight > 1)
                {
                        currentHeight -= heightDecrement;
                        document.getElementById("contents" + previousLevel + "spacer").style.height = currentHeight;
                }
                if (currentWidth > 0)
                {
                        if ((currentWidth - endWidth) >= widthDecrement)
                        {
                                currentWidth -= widthDecrement;
                        }
                        else
                        {
                                currentWidth = 0;
                        }
                        document.getElementById("contents" + previousLevel).style.width= currentWidth;
                }
                if (endX > currentX)
                {
                        if ((endX - currentX) >= leftDecrement)
                        {
                                currentX += leftDecrement;
                        }
                        else
                        {
                                currentX = endX;
                        }
                        document.getElementById("contents" + previousLevel).style.left = currentX;
                }
                if (currentY > endY)
                {
                        if ((currentY - endY) >= topDecrement)
                        {
                                currentY -= topDecrement;
                        }
                        else
                        {
                                currentY = endY
                        }
                        document.getElementById("contents" + previousLevel).style.top = currentY;
                }
                setTimeout("zoomOut(" + currentX + ", " + currentY + ", " + endX + ", " + endY + ", " + currentWidth + ", " + endWidth + ", " + currentHeight + ", '" + previousLevel + "')", timeOutPeriod);
        }
        else
        {
                document.getElementById("contents" + previousLevel).style.display = 'none';
        }
}