var images = 49;
var speed = 4;
var pos1 = 1;
var shown = 7;
var busy = false;
var preloads = 3;
var size = 120;
var viewed = shown + preloads;
var slidetimer;
var zoomtimer;
var paused = false;
var zoomtimeout;

var image1 = new Image();
image1.src = 'common/main/scroll_left.jpg';
var image2 = new Image();
image2.src = 'common/main/scroll_right.jpg';
var image3 = new Image();
image3.src = 'common/main/scroll_left_hi.jpg';
var image4 = new Image();
image4.src = 'common/main/scroll_right_hi.jpg';
var image5 = new Image();
image5.src = 'common/main/media_pause.gif';
var image6 = new Image();
image6.src ='common/main/media_play.gif';
var image7 = new Image();
image7.src = 'common/main/menus/competitions_blue.gif';
var image8 = new Image();
image8.src ='common/main/menus/competitions_yellow.gif';
var image9 = new Image();
image9.src = 'common/main/menus/events_blue.gif';
var image10 = new Image();
image10.src ='common/main/menus/events_yellow.gif';
var image11 = new Image();
image11.src = 'common/main/menus/videos_blue.gif';
var image12 = new Image();
image12.src ='common/main/menus/videos_yellow.gif';
var image13 = new Image();
image13.src = 'common/main/menus/photos_blue.gif';
var image14 = new Image();
image14.src ='common/main/menus/photos_yellow.gif';
var image15 = new Image();
image15.src = 'common/main/menus/home_blue.gif';
var image16 = new Image();
image16.src ='common/main/menus/home_yellow.gif';
var image17 = new Image();
image17.src = 'common/main/menus/pocasts_blue.gif';
var image18 = new Image();
image18.src ='common/main/menus/pocasts_yellow.gif';

function nextpic(stop) {
    if (busy == false && (pos1 + shown) <= images) {
        if (stop) { stopslide(true); }
        busy = true;
        document.getElementById("pic"+(pos1 + shown)).style.width = size+"px";
        hidepic();
    }
}

function previouspic() {
    if (busy == false) {
        stopslide(true);
        pos1 = pos1 - 1;
        busy = true;
        showpic();
    }
}

function hidepic() {
    var divid;
    var obj = document.getElementById("pic"+(pos1-1)).style;
    var tmpwidth = parseInt(obj.width);
    if (tmpwidth > speed) {
        tmpwidth = tmpwidth - speed;
    } else if (tmpwidth == 0) {
        //document.getElementById("img"+pos1).style.width = "0px";
        if ((pos1 + shown )== images) { document.getElementById("divscrollright").style.display = "none"; }
        if (viewed < (pos1 + shown + preloads) && (viewed + 1) <= (images + 1)) {
            viewed = viewed + 1;
            content = document.getElementById("pics").innerHTML;
            document.getElementById("img"+viewed+"a").src = "http://images.supersport.co.za/"+pics[viewed][0];
            document.getElementById("img"+viewed).src = "http://images.supersport.co.za/"+pics[viewed][1];
            }
        pos1 = pos1 + 1;
        if (pos1 > 1) { document.getElementById("divscrollleft").style.display = "block"; }
        if (!paused && (pos1 + shown ) <= images) { slidetimer = setTimeout("nextpic(false)",6000); }
        busy = false;
    } else {
        tmpwidth = 0;
    }
    obj.width = tmpwidth + "px";
    if (busy) { setTimeout("hidepic()",10); }
}

function showpic() {
    var obj = document.getElementById("pic"+(pos1 - 1)).style;
    var tmpwidth = parseInt(obj.width);
    if (tmpwidth + speed <= size) {
        tmpwidth = tmpwidth + speed;
    } else if (tmpwidth == size) {
        busy = false;
        if (pos1 == 1) { document.getElementById("divscrollleft").style.display = "none"; }
        if ((pos1 - 1) < (images - shown)) { document.getElementById("divscrollright").style.display = "block"; }
    } else {
        tmpwidth = size;
    }
    obj.width = tmpwidth + "px";
    if (busy) { setTimeout("showpic()",10); }
}

function preview(id) {
    stopslide(paused);
    var pos = controlpos("picblock");
    var tmpleft; var tmptop;
    if (id <= pos1) { tmpleft = 0; } else if (id >= (pos1 + shown)) { tmpleft = (shown - 1); } else { tmpleft = (id - pos1); }
    tmpleft = (tmpleft * size) + pos[0];
    tmptop = pos[1] + 25;
    obj = document.getElementById("img"); obj.src = document.getElementById("img"+id).src; obj.style.width = "100px"; obj.style.height = "75px";
    obj = document.getElementById("imgdiv").style; obj.top = tmptop+"px"; obj.left = (tmpleft + 10)+"px"; obj.width = "100px"; obj.height = "75px"; obj.display = "block";
    zoom(id);
}

function zoom(id) {
    var tmpwidth; var tmpheight; var tmptop; var tmpleft;
    var tmpcontinue = 0;
    obj = document.getElementById("imgdiv").style; tmpwidth = parseInt(obj.width); tmpheight = parseInt(obj.height); tmptop = parseInt(obj.top); tmpleft = parseInt(obj.left);
    if (tmpwidth < 320) {
        tmpwidth = tmpwidth + 10;
        tmpcontinue = tmpcontinue + 1;
        if (tmpwidth > 320) { tmpwidth = 320; }
        document.getElementById("img").style.width = (tmpwidth) + "px";
        obj.width = tmpwidth + "px";
        if (id > pos1 && id < (pos1 + shown - 1)) { obj.left = tmpleft - 5+"px"; }
        if (id >= (pos1 + shown) - 1) { obj.left = tmpleft - 10+"px"; }
    }
    if (tmpheight < 272) {
        tmpheight = tmpheight + 7.5;
        if (tmpheight > 240) { tmpheight = 272; document.getElementById("text").innerHTML = pics[id][2]; document.getElementById("text").style.display = "block"; document.getElementById("imgdiv").style.border = "1px solid #bbbbbb"; }
        if (tmpheight < 241) { document.getElementById("img").style.height = (tmpheight) + "px"; obj.top = (tmptop - 3.75) + "px"; }
        obj.height = (tmpheight) + "px";
        tmpcontinue = tmpcontinue + 1;
    }
    if (tmpcontinue > 0) { zoomtimer = setTimeout("zoom('"+id+"')",10); }
}

function stopslide(pause) { clearTimeout(slidetimer); if(pause) { paused = true; document.getElementById("control").src = image6.src; } }
function startslide() { clearTimeout(slidetimer); paused = false; document.getElementById("control").src = image5.src; slidetimer = setTimeout("nextpic(false)",6000); }
function controls() { if (document.getElementById("control").src == image5.src) { stopslide(true); } else { startslide(); }}
function hide() { obj = document.getElementById("imgdiv").style; obj.display = "none"; obj.top = "0px"; obj.left = "0px"; obj.width = "0px"; obj.height = "0px"; obj = document.getElementById("img").style; obj.width = "0px"; obj.height = "0px"; document.getElementById("text").style.display = "none"; clearTimeout(zoomtimer); if (!paused) { startslide(); } }

function controlpos(controlid) {
    var obj = document.getElementById(controlid);
    var posX = obj.offsetLeft; var posY = obj.offsetTop;
    while(obj.offsetParent){
        posX=posX+obj.offsetParent.offsetLeft;
        posY=posY+obj.offsetParent.offsetTop;
        if(obj==document.getElementsByTagName('body')[0]){break}
        else{obj=obj.offsetParent;}
    }
    return [posX, posY]
}

function startup() { if (document.getElementById("control").src == image5.src) { slidetimer = setTimeout('nextpic(false)',6000); } }

function match_over(id) {
    if (document.getElementById("match"+id+"_button").className == 'match_button_plain') { document.getElementById("match"+id+"_button").className = 'match_button_over'; }
}

function match_out(id) {
    if (document.getElementById("match"+id+"_button").className == 'match_button_over') { document.getElementById("match"+id+"_button").className = 'match_button_plain'; }
}

function match_change(id) {
    for (var i = 1; i<= 5; i++) {
        document.getElementById("match"+i).style.display = 'none';
        document.getElementById("match"+i+"_button").className = 'match_button_plain';
    }
    document.getElementById("match"+id).style.display = 'block';
    document.getElementById("match"+id+"_button").className = 'match_button_highlight';
}

function infoPop(div1, div2, sub) {
    for (var i = 1; i<= 2; i++) {
    
    }
    var pos = controlpos(div2);
    var obj = document.getElementById(div1).style
    obj.top = (pos[1] - sub) + "px";
    obj.left = (pos[0] + 100)+"px";
    obj.display = "block";
}

function infoPopHide(div) {
    document.getElementById(div).style.display = "none";
}

var cur = 0;
var opacStart = 100;
var opacEnd = 1;
var opacity;
var id = "powimage";
var timer = 0;
var millisec = 1200;
var blending = false;
		
function picRotator(start) {
	if (start == true) {
		cur = cur + 1;
		setTimeout('picRotator(false)', 3000);
	} else {
		cur = cur + 1
		if (cur > pictures .length) {
			cur = 1;
		}
		document.getElementById("powimages").style.backgroundImage = "url(" + pictures [cur - 1] + ")";
		var object = document.getElementById(id).style;
		object.display = "none";
		object.opacity = (1.0); 
    	object.MozOpacity = (1.0); 
    	object.KhtmlOpacity = (1.0); 
    	object.filter = "alpha(opacity=100)";
		object.display = "block";
		opacity = opacStart;
		timer = 0;
		blending = true;
		changeOpac();
	}
}

function changeOpac() {
	if (opacity > opacEnd) {
		var speed = Math.round(millisec / 100); 
		var object = document.getElementById(id).style;
		opacity = opacity  - 3;
		if (opacity < 2) {
			opacity = 1;
		}
		timer++;
		object.MozOpacity = (opacity / 100);
		object.opacity = (opacity / 100); 
		object.KhtmlOpacity = (opacity / 100); 
		object.filter = "alpha(opacity=" + opacity + ")";
		setTimeout("changeOpac()",20);
	} else if (blending == true) {
		blending = false;
		document.getElementById(id).src = pictures [cur - 1];
		setTimeout('picRotator(false)', 3000);
	}
}