var buffer;
var counter;
var bufferTop;
var bufferWidth;
var widthValue = 200;
var widthSmaller = 50;
var topValue = 250;
var moveValue = 35;
var heightHeader = 60;
var headerCounter = 20;
var headCounter = 30;
var heightScreen = 400;
var screenCounter = 30;
colors = new Array ("#FF8C00","#FFFF00","#00FFFF","#7FFF00","#1E90FF",
                    "#FFD700","#DAA520","#ADFF2F","gray","#FF4500");
var number = Math.round(Math.random() * (colors.length-1));
var number2 = Math.round(Math.random() * (colors.length-1));

while (number == number2) {
    number2 = Math.round(Math.random() * (colors.length-1));
}

function bgColor(onOff) {
    if (onOff == 1) {
        document.getElementById('backScreen').style.backgroundColor = colors[number2];
    }
    else {
        document.getElementById('body').style.backgroundColor = colors[number];
    }
}

function showBlase() {
    document.getElementById("headFriendly").style.visibility="hidden";    
    document.getElementById("headEvil").style.visibility="visible";    
    document.getElementById("sprechBlase").style.visibility="visible";
    number = Math.round(Math.random() * 11);
    for (var i=0;i<12;i++) {
        buffer = "text" + String(i);
        if (i!=number) {
            buffer = "text" + String(i);
            document.getElementById(buffer).style.visibility="hidden";
        }
        else {
            document.getElementById(buffer).style.visibility="visible";
        }
    }
}

function hideBlase() {
    document.getElementById("sprechBlase").style.visibility="hidden";
    document.getElementById("headFriendly").style.visibility="visible";    
    document.getElementById("headEvil").style.visibility="hidden";    
    for (var i=0;i<12;i++) {
        buffer = "text" + String(i);
        document.getElementById(buffer).style.visibility="hidden";
    }
}

function main() {
    document.getElementById("map").style.visibility="hidden";
    document.getElementById("headFriendly").style.visibility="visible";
    document.getElementById("headEvil").style.visibility="hidden";
    document.getElementById("map").style.visibility="hidden";
    moveBlock("mainBlock", moveValue);
    setTimeout("document.getElementById('infoHeader').style.visibility='visible'",800);
    setTimeout("showInfoHeader(headerCounter)",800);
    setTimeout("document.getElementById('infoScreen').style.visibility='visible'",1300);
    setTimeout("showInfoScreen(screenCounter)",1300);
}

function moveBlock(ID, counter) {
    if (counter>1) {
        bufferTop = (topValue/moveValue) * counter;
        document.getElementById(ID).style.top=bufferTop+"px";
        counter--;
        setTimeout("moveBlock('"+ID+"',"+counter+")",1);
    }
    else {
            cutHeadBottom(headCounter);

    }
}

function cutHeadBottom(counter) {
    if (counter>0) {
        bufferWidth = ((widthValue - widthSmaller) + ((widthSmaller/moveValue)*counter));
        document.getElementById("headFriendly").style.width=bufferWidth+"px";
        counter--;
        setTimeout("cutHeadBottom("+counter+")",1);
    }
    else {
        document.getElementById("headFriendly").style.width=widthValue - widthSmaller+"px";         
    }
}

function cutHeadRight(counter) {
    if (counter>0) {
        bufferWidth = ((widthValue - widthSmaller) + ((widthSmaller/moveValue)*counter));
        document.getElementById("headFriendly").style.width=bufferWidth+"px";
        counter--;
        setTimeout("cutHeadRight("+counter+")",1);
    }
    else {
        document.getElementById("headFriendly").style.width=widthValue - widthSmaller+"px";
    }
}

function showInfoHeader(counter) {
    if (counter>0) {
        bufferWidth = ((widthValue - widthSmaller) + ((widthSmaller/moveValue)*counter));
        document.getElementById("headFriendly").style.height=bufferWidth+"px";
        buffer = (heightHeader - (heightHeader/headerCounter)*counter);
        document.getElementById("infoHeader").style.height=buffer+"px";
        counter--;
        setTimeout("showInfoHeader("+counter+")",1);
    }
    else {
        document.getElementById("headFriendly").style.height=widthValue - widthSmaller+"px";
        document.getElementById("backScreen").style.border="3px solid ";
        bgColor(1);
        document.getElementById("infoHeader").style.height=heightHeader+"px";
    }
}

function showInfoScreen(counter) {
    if (counter>0) {
        buffer = (heightScreen - (heightScreen/screenCounter)*counter);
        document.getElementById("infoScreen").style.height=buffer+"px";
        counter--;
        setTimeout("showInfoScreen("+counter+")",1);
    }
    else {
        document.getElementById("infoScreen").style.height=heightScreen+"px";
        document.getElementById("mainFrame").style.visibility="visible";
    }
}