var animateMode = 1;
var refreshTime = 5000;
var req;

var points = new Array();
var sets = new Array();

function preloadImages()
{
    for(var i = 0; i <= 31; i++)
    {
         points[i] = new Image();
         points[i].src = 'img/point/' + i + '.gif';
    }
    for(var i = 0; i <= 5; i++)
    {
         sets[i] = new Image();
         sets[i].src = 'img/set/' + i + '.gif';
    }
}

preloadImages();

function nodeVal(element, nodeName)
{
	var nodeList = element.getElementsByTagName(nodeName);
	if(!nodeList || !nodeList.item(0) ||  !nodeList.item(0).firstChild)
		return "";
	return nodeList.item(0).firstChild.nodeValue;
}

function intVal(element, nodeName)
{
	var value =  parseInt(nodeVal(element, nodeName));
	if(isNaN(value))
		return 0;
	return value;
}

function wonderful()
{
	var url = location.protocol + "//" + location.host + 
    location.pathname.slice(0,location.pathname.lastIndexOf("/")) + "/results.php";

    if (window.XMLHttpRequest) 
        req = new XMLHttpRequest();
    else if (window.ActiveXObject)
        req = new ActiveXObject("Microsoft.XMLHTTP");
    
    if (req)
    {
        req.onreadystatechange = processReqChange;
        req.open("GET", url, true);
        req.send(null);
		setTimeout("wonderful()",refreshTime);
    }
}

function processReqChange() {
	
	// only if req shows "loaded"
    if (req.readyState == 4) {
    	
        // only if "OK"
        if (req.status == 200) {

			//alert(req.responseText);

            var xmlData = req.responseXML;
			var player1 = xmlData.getElementsByTagName("player1").item(0);
			var player2 = xmlData.getElementsByTagName("player2").item(0);
			
			var describe = xmlData.getElementsByTagName("describe").item(0).firstChild;
			describe = (describe == null) ? "" : describe.nodeValue.replace(/\n/g,"<br>");
			
			animateMode = intVal(xmlData,"effect-type");
			refreshTime = intVal(xmlData,"refresh") * 1000;
			
			// replace imgaes
			animation( intVal(player1,"points"),"pl1point","point");
            document.getElementById('pl1point').title = 'zdobyte punkty w tym secie: ' + intVal(player1,"points");
            
            animation( intVal(player2,"points"),"pl2point","point");
            document.getElementById('pl2point').title = 'zdobyte punkty w tym secie: ' + intVal(player2,"points");
            
            animation( intVal(player1,"sets"),"pl1set","set");
            document.getElementById('pl1set').title = 'wygrane sety: ' + intVal(player1,"sets");
            
            animation( intVal(player2,"sets"),"pl2set","set");
            document.getElementById('pl2set').title = 'wygrane sety: ' +  intVal(player2,"sets");
            
            if(intVal(player1,"timeout") == 1)
            {
                document.getElementById('pl1timeout').title='Czas został wykorzystany';
            }
            if(intVal(player2,"timeout") == 1)
            {
                document.getElementById('pl2timeout').title='Czas został wykorzystany';
            }
            
            if(intVal(player1,"cards") == 1)
            {
                document.getElementById('pl1card').title='Żółta kartka dla zawodnika';
            }
            else if(intVal(player1,"cards") == 2)
            {
                document.getElementById('pl1card').title='Czerwona kartka dla zawodnika';
            }
            
            if(intVal(player2,"cards") == 1)
            {
                document.getElementById('pl2card').title='Żółta kartka dla zawodnika';
            }
            else if(intVal(player2,"cards") == 2)
            {
                document.getElementById('pl2card').title='Czerwona kartka dla zawodnika';
            }
            
            document.getElementById('pl1timeout').src = 'img/cards/t' + intVal(player1,"timeout") + '.gif';
            document.getElementById('pl2timeout').src = 'img/cards/t' + intVal(player2,"timeout") + '.gif';
            document.getElementById('pl1card').src = 'img/cards/c' +intVal(player1,"cards") + '.gif';
            document.getElementById('pl2card').src = 'img/cards/c' +intVal(player2,"cards") + '.gif';
            
            document.getElementById('pl1name').innerHTML = nodeVal(player1,"name") + ( nodeVal(player1,"club") != '' ? ( " <span>" + nodeVal(player1,"club") + "</span>" ) : '' );
            document.getElementById('pl2name').innerHTML = nodeVal(player2,"name") + ( nodeVal(player2,"club") != '' ? ( " <span>" + nodeVal(player2,"club") + "</span>" ) : '' );
            
            //  player 1 photo
			var img = document.getElementById("pl1photo");
			var imgSrc = nodeVal(player1,"photo");
            if(imgSrc != '')
            {
            	img.src = 'imgconverter.php?w=85&h=85&cut=1&image=' + imgSrc + (imgSrc==img.src?"":"&random="+Math.random());
            	img.className = img.className.replace(/hide/g,"");
            }
            else
            {
	            img.src = 'img/empty.gif';
            	img.className += " hide";
            }
            
            // player 2 photo
            img = document.getElementById("pl2photo");
			imgSrc = nodeVal(player2,"photo");
            if(imgSrc != '')
            {
            	img.src = 'imgconverter.php?w=85&h=85&cut=1&image=' + imgSrc + (imgSrc==img.src?"":"&random="+Math.random());
            	img.className = img.className.replace(/hide/g,"");
            }
            else
            {
	            img.src = 'img/empty.gif';
            	img.className += " hide";
            }
            
            // sponsor
            setImage("sponsor_image", "reklama", xmlData, "link-sponsor",
             "image-sponsor", 240, 35);
            // left image
            setImage("left_logo_image", "left_logo_link", xmlData, "link-logo-left",
             "image-logo-left", 42, 42);
            // right image
            setImage("right_logo_image", "right_logo_link", xmlData, "link-logo-right",
             "image-logo-right", 42, 42);
             
			var headImage = '';
			
			var headLinkSrc = nodeVal(xmlData,"link-logo-top");
			headLinkSrc = ( headLinkSrc.slice(0,7) == 'http://' ? '' : 'http://' ) + headLinkSrc;
			var headImgSrc = nodeVal(xmlData,"image-logo-top");

			if(headImgSrc != '')
			{
				var tmp = '<img id="top_logo_image" src="imgconverter.php?w=290&h=100&image='+ headImgSrc + '" alt="" />';
				if(headLinkSrc != '' && headLinkSrc != 'http://' )
					headImage = '<a id="top_logo_link" href="' + headLinkSrc + '">' + tmp + '</a>';
				else
					headImage = tmp;
			}
//			alert(headImage); 
            
            document.getElementById('head').innerHTML = headImage + describe;
            
        } else {
            alert("There was a problem retrieving the XML data:\n" +
                req.statusText);
        }
    }
}

function setImage(imgId, linkId, xmlData, linkNode, imgNode, w, h)
{
	var link = document.getElementById(linkId);
    var img = document.getElementById(imgId);

    var linkSrc = nodeVal(xmlData,linkNode);
	var imgSrc = nodeVal(xmlData,imgNode);
    if(imgSrc != '')
    {
    	img.src = 'imgconverter.php?w='+w+'&h='+h+'&image=' + imgSrc + (imgSrc==img.src?"":"&random="+Math.random());
    	link.href = ( linkSrc.slice(0,7) == 'http://' ? '' : 'http://' ) + linkSrc;
    	link.className = img.className.replace(/hide/g,"");
    }
    else
    {
        img.src = 'img/empty.gif';
    	link.className += " hide";
    }
}

function animation(number, image, folder )
{
	var img = folder == "point" ? points[number] : sets[number] ;
	
	var o = document.getElementById(image);
	if(o.src.indexOf(img.src) != -1) // the same image
		return;

	if(animateMode == 1) // no animation
	{
		document.getElementById(image).src = img.src;
		return;
	}
	
	var n = document.createElement("img");
	n = img;
	n.style.top = o.offsetTop + "px";
	n.style.left = o.offsetLeft + "px";
	n.style.visibility = "hidden";
	//n.onload = run;
	run();
	o.parentNode.appendChild(n);
	
	return;

	function run()
	{
		if(animateMode == 2)
    		animateAlpha(5,10);
    	else if(animateMode == 3)
    		animateRoll(5,10);
    	else if(animateMode == 4)
    		squish(2,10);
    	else if(animateMode == 5)
    		grow(2,10);
    	else if(animateMode == 6)
    		animateRollBottom(5,10);
    	else if(animateMode == 7)
    		animateSlideTop(5,10);
    	else if(animateMode == 8)
    		animateSlideBottom(5,10);
	}
	
	function animateAlpha(step,speed)
	{
		var opacity = 0;
		
		n.style.opacity = opacity / 100;
		n.style.visibility = "visible";
		n.style.filter="alpha(opacity=" + opacity + ")";
		n.zIndex = 10;
		o.zIndex = 0;

		var animation = setInterval(function ()
		{
			opacity += step;
			n.style.opacity = opacity / 100;
			n.style.filter="alpha(opacity=" + opacity + ")";	
			o.style.opacity = (100-opacity) / 100;
			o.style.filter="alpha(opacity=" + ( 100 - opacity ) + ")";	
			if(opacity >= 100)
			{
				clearInterval(animation);
				o.src = n.src;
				o.style.opacity = 100;
				o.style.filter = n.style.filter;
				setTimeout(function()
				{
					n.style.display = "none";
					if(n.parentNode)
						n.parentNode.removeChild(n);
				},500);
			}
		} , speed );
	}	
	
	function animateRoll(step,speed)
	{
		var nHeight = o.offsetHeight;
		var tmpHeight = 21;
		n.style.clip = "rect(0 auto 0 0)";
		n.style.visibility = "visible";		
		n.zIndex = 10;
		o.zIndex = 0;

		var animation = setInterval(function ()
		{
			if(tmpHeight + step < nHeight)
			{
				tmpHeight += step;
				n.style.clip = "rect(0px auto " + tmpHeight + "px 0)";
			}
			else
			{
				clearInterval(animation);
				n.style.clip = "rect(0px auto " + nHeight + "px 0)";
				o.src = n.src;
				if(n.parentNode)
					n.parentNode.removeChild(n);
			}
		} , speed );
	}
	
	function squish(step,speed)
	{
		speed = 300;
		
		var tmp = o.parentNode.cloneNode(o);
		
		tmp.style.border = "1px red solid;"
		tmp.zIndex = 11;
		tmp.src = "img/cards/c1.gif";
		
		var s = step;
		var ofset = (76 - 58) / (58 / s);
		var nHeight = o.offsetHeight / 2;
		var t = 0,r = 115,b = 151,l = 0;
		tmp.style.clip = "rect(" + Math.round(t) + "px " + Math.round(r) + "px " + Math.round(b) + "px " + Math.round(l) + "px)";
		
		var animation = setInterval(function ()
		{
			if(t + (s + ofset) < 76)
			{
				t += (s + ofset); r -= s; b -= (s + ofset); l += s;
				tmp.style.clip = "rect(" + Math.round(t) + "px " + Math.round(r) + "px " + Math.round(b) + "px " + Math.round(l) + "px)";
			}
			else
			{
				clearInterval(animation);
				o.src = n.src;
				if(n.parentNode)
					n.parentNode.removeChild(n);
				if(tmp.parentNode)
					tmp.parentNode.removeChild(tmp);
			}
		} , speed );
	}
	
	function grow(step,speed)
	{
		var s = step;
		var ofset = (76 - 58) / (58 / s);
		var nHeight = o.offsetHeight / 2;
		var t = 76,r = 57,b = 75,l = 58;
		n.style.clip = "rect(" + Math.round(t) + "px " + Math.round(r) + "px " + Math.round(b) + "px " + Math.round(l) + "px)";
		n.style.visibility = "visible";
		n.zIndex = 10;
		o.zIndex = 0;
		
		var animation = setInterval(function ()
		{
			if(t - (s + ofset) > 0)
			{
				t -= (s + ofset); r += s; b += (s + ofset); l -= s;
				n.style.clip = "rect(" + Math.round(t) + "px " + Math.round(r) + "px " + Math.round(b) + "px " + Math.round(l) + "px)";
			}
			else
			{
				clearInterval(animation);
				n.style.clip = "rect(0px 115px 151px 0px)";
				o.src = n.src;
				if(n.parentNode)
					n.parentNode.removeChild(n);
			}
		} , speed );
	}
	
	function animateRollBottom(step, speed)
	{
		var nHeight = o.offsetHeight;
		var nWidth = o.offsetWidth;
		var tmpHeight = nHeight;
		n.style.clip = "rect(" + nHeight + "px "+nWidth+"px "+nHeight+"px 0)";
		n.style.visibility = "visible";		
		n.zIndex = 10;
		o.zIndex = 0;

		var animation = setInterval(function ()
		{
			if(tmpHeight - step > 0)
			{
				tmpHeight -= step;
				n.style.clip = "rect(" + tmpHeight + "px "+nWidth+"px "+nHeight+"px 0)";
				//document.getElementById("debug").innerHTML = "rect(" + tmpHeight + "px 115px 151px 0)";
			}
			else
			{
				clearInterval(animation);
				n.style.clip = "rect(0 "+nWidth+"px "+nHeight+"px 0)";
				o.src = n.src;
				if(n.parentNode)
					n.parentNode.removeChild(n);
			}
		} , speed );
	}
	
	function animateSlideTop(step,speed)
	{
		var nHeight = o.offsetHeight;
		var nWidth = o.offsetWidth;
		var tmpHeight = nHeight;
		n.style.clip = "rect(" + nHeight + "px "+nWidth+"px "+nHeight+"px 0)";
		n.style.visibility = "visible";		
		n.style.top = (parseInt(n.style.top) - nHeight) + "px";
		n.zIndex = 10;
		o.zIndex = 0;

		var animation = setInterval(function ()
		{
			if(tmpHeight - step > 0)
			{
				tmpHeight -= step;
				n.style.clip = "rect(" + tmpHeight + "px "+nWidth+"px "+nHeight+"px 0)";
				n.style.top = (parseInt(n.style.top) + step) + "px";
			}
			else
			{
				clearInterval(animation);
				n.style.clip = "rect(0 "+nWidth+"px "+nHeight+"px 0)";
				n.style.top = o.offsetTop;
				o.src = n.src;
				if(n.parentNode)
					n.parentNode.removeChild(n);
			}
		} , speed );
	}
	
	function animateSlideBottom(step,speed)
	{
		var nHeight = o.offsetHeight;
		var tmpHeight = 21;
		n.style.clip = "rect(0 auto 0 0)";
		n.style.visibility = "visible";
		n.style.top = (parseInt(n.style.top) + nHeight) + "px";	
		n.zIndex = 10;
		o.zIndex = 0;

		var animation = setInterval(function ()
		{
			if(tmpHeight + step < nHeight)
			{
				tmpHeight += step;
				n.style.clip = "rect(0px auto " + tmpHeight + "px 0)";
				n.style.top = (parseInt(n.style.top) - step) + "px";
			}
			else
			{
				clearInterval(animation);
				n.style.clip = "rect(0px auto " + nHeight + "px 0)";
				n.style.top = o.offsetTop;
				o.src = n.src;
				if(n.parentNode)
					n.parentNode.removeChild(n);
			}
		} , speed );
	}
	
	
}

window.onload = wonderful;