var imgBubbleQuest = quizimgpath+"b_client_bubble_question.png";
var imgBubbleAnswer = quizimgpath+"b_client_bubble_answer.png";
var imgBubbleResult = quizimgpath+"b_client_bubble_congratz.png";

var strTyping = "Welcome";
var aktiv = null;
var actualLayer = "header"; 
var li = 0; 
text = 1;
next = null;
var timer = null;
actualSlide = 1;

function resetQuiz(){
	strTyping = "Welcome";
	window.clearInterval(aktiv);
	aktiv = null;
	actualLayer = "header"; 
	li = 0; 
	text = 1;
	next = null;
	clearTimeout(timer);
	timer = null;
	document.getElementById("header").innerHTML = "";
	document.getElementById("questions").innerHTML = '';
	document.getElementById("header_bg_bubble").innerHTML = "";
	document.getElementById("bg_bubble").innerHTML = "";
	document.getElementById("questions").style.visibility = "hidden";
	document.getElementById("header").style.visibility = "hidden";
	document.getElementById("header_bg_bubble").style.visibility = "hidden";
	document.getElementById("bg_bubble").style.visibility = "hidden";
	document.getElementById("world_images").style.visibility = "hidden";
}

function Typing (){
	if ( strTyping ){
  	document.getElementById(actualLayer).innerHTML += strTyping.substr(li, 1);
  }

  if (li++ >= strTyping.length ){
    window.clearInterval(aktiv);
    li = 0;
    finishedTyping();
  }
}

function write( lay, word ){ 
	strTyping = word; 
	actualLayer = lay; 
	aktiv = window.setInterval("Typing()", 30); 
}

function addText ( lay, text ){
	document.getElementById(lay).innerHTML += text;
}
			
//ASSIGN TO 'NEXT' THE FUCTION CALL WHICH SHOULD BE EXECUTED AFTER THE ACTUAL SLIDE
function finishedTyping(){
	if ( next != null ){
		eval( next );
	}
	next = null;
}

function prepareQuestion( numQuest ){
	document.getElementById("bg_bubble").style.visibility = "hidden";
	document.getElementById("questions").style.visibility = "visible";
	document.getElementById("header").style.visibility = "visible";
	document.getElementById("header_bg_bubble").style.visibility = "visible";
	document.getElementById("world_images").style.visibility = "visible";
	
	document.getElementById("header").innerHTML = "";
	document.getElementById("next").innerHTML = '';
	document.getElementById("questions").innerHTML = '';
		
	clearTimeout(timer);
	//document.getElementById("bg_bubble").style.visibility = "visible";
	fadeIn( 'header_bg_bubble',getPNGImageTag( imgBubbleQuest, "bubble_quest") );
	fadeIn( 'world_images', getQuizPict( numQuest ) );
}

function showAnswer( answ1, answ2 ){		
	fadeIn( "bg_bubble", getPNGImageTag( imgBubbleAnswer, "bubble_answer") );
	addText( "questions", answ1 );
	addText( "questions", answ2 );
}
			
//SLIDES			
function slide ( num ){
	//alert( "SLIDE: "+ num );
	actualSlide = num;				
//WELCOME
	if ( num == 1 ){
		track( "/playquiz" );
		//alert( document.getElementById("header_bg_bubble").style.visibility );
		document.getElementById("header_bg_bubble").style.visibility = "visible";
		fadeIn( 'header_bg_bubble',getPNGImageTag( imgBubbleQuest, "bubble_quest") );
		
		document.getElementById("header").innerHTML = "";
		document.getElementById("header").style.visibility = "visible";
		
		var t = "<a href='#' onClick='slide(2)'><img src='"+quizimgpath+"b_client_button_weiter.gif' border='1' name='nextbutton' onmouseover='changeImage(\"nextbutton\",\""+quizimgpath+"b_client_button_weiter_om.gif\")' onmouseout='changeImage(\"nextbutton\",\""+quizimgpath+"b_client_button_weiter.gif\")' align='right' valign='bottom'></a>";
		
		addText( "header", t+'"'+messages[browserlang]["WELCOME"]+'"' );		
//Quest: Is loading cool?			
	}else if ( num == 2 ){
		track( "/playquiz?q=1" );
		
		prepareQuestion( 0 );	
		
		var question = '"1. '+messages[browserlang]["QUESTION0"]+'"';
		
		setTimeout('addText( "header", messages[browserlang]["QUESTION0"] )',500);
		timer = setTimeout('showAnswer( messages[browserlang]["QUESTION0_A"], messages[browserlang]["QUESTION0_B"] )',2000);
		
		
//QUESTIONS
	}else if ( num > 4 && num < 18){		
		var q = num - 4;
		track( "/playquiz?q="+q);
		prepareQuestion( q );	
		
		addText( "header", messages[browserlang]["QUESTION"+q]);
		//setTimeout('addText( "header", messages[browserlang]["QUESTION"'+q+'] )',500);
		
		timer = setTimeout('fadeIn( "bg_bubble", getPNGImageTag( imgBubbleAnswer, "bubble_quest"))',2000);
		timer = setTimeout('showAnswer( messages[browserlang]["QUESTION'+q+'_A"], messages[browserlang]["QUESTION'+q+'_B"] )',2000);
		
	}else if ( num == 'ready' ){
		document.getElementById("questions").innerHTML = '';
		document.getElementById("bg_bubble").innerHTML = getPNGImageTag( imgBubbleAnswer, "bubble_quest");
		write( "questions", messages[browserlang]["STARTQUIZ_READY"] );
		next = 'timer = setTimeout("slide(5);",2000)';
	}else if ( num == 'notready' ){
		document.getElementById("questions").innerHTML = '';
		document.getElementById("bg_bubble").innerHTML = getPNGImageTag( imgBubbleAnswer, "bubble_quest");
		write( "questions", messages[browserlang]["STARTQUIZ_NOTREADY"] );
		next = 'timer = setTimeout("slide(5);",2000)';
	}else if ( num == 'right' ){
		
		addText( "questions", messages[browserlang]["ANSWER_RIGHT"] );
		finishedTyping();
		
	}else if ( num == 'wrong' ){
		addText( "questions", messages[browserlang]["ANSWER_WRONG"] );
		
		finishedTyping();
	}else{
		
		prepareQuestion( 14 );	
		
		var t =  messages[browserlang]["BYE"];
		//t += "<a href='#' onClick='slide(3)'><img src='"+quizimgpath+"b_client_button_weiter.gif' border='0' name='nextbutton' onmouseover='changeImage(\"nextbutton\",\""+quizimgpath+"b_client_button_weiter_om.gif\")' onmouseout='changeImage(\"nextbutton\",\""+quizimgpath+"b_client_button_weiter.gif\")' align='right' valign='top'></a>
		
		addText( "header", t );
		
		actualslide=1;
		track( "/playquiz?q=finished" );
	}
}

var nextslide;
var success;
var explanation;
function answer( question, answer ){
	clearTimeout(timer);
	
	nextslide = parseInt(question)+5;
	success = "true";
	if ( question == 0 ) success = "true";
	if ( question == 1 && answer == "a" ) success = "false";
	if ( question == 2 && answer == "a" ) success = "false";
	if ( question == 3 && answer == "b" ) success = "false";
	if ( question == 4 && answer == "b" ) success = "false";
	if ( question == 5 && answer == "a" ) success = "false";
	if ( question == 6 && answer != "d" ) success = "false";
	if ( question == 7 && answer == "b" ) success = "false";
	if ( question == 8 && answer == "b" ) success = "false";
	if ( question == 9 && answer == "b" ) success = "false";
	if ( question == 10 && answer == "b" ) success = "false";
	if ( question == 11 && answer == "a" ) success = "false";
	if ( question == 12 && answer == "a" ) success = "false";
	if ( question == 13 && answer == "a" ) success = "false";
	
	if ( success == "true" ){
		timer = setTimeout("slide('right');",300);
	}else{
		timer = setTimeout("slide('wrong');",300);
	}
	document.getElementById("questions").innerHTML = '';
	document.getElementById("bg_bubble").innerHTML = getPNGImageTag( imgBubbleResult, "bubble_quest");
	fadeIn( 'world_images', getAnswerPict( question ) );
	explanation = "<i>"+messages[browserlang]["QUESTION"+question+"_EXP"]+"</i>";		
	timer = setTimeout("addText('questions',explanation);",2000);
	
	document.getElementById("next").innerHTML = "<a href='#' onClick='slide("+nextslide+")'><img src='"+quizimgpath+"b_client_button_weiter.gif' border='0' name='nextbutton' onmouseover='changeImage(\"nextbutton\",\""+quizimgpath+"b_client_button_weiter_om.gif\")' onmouseout='changeImage(\"nextbutton\",\""+quizimgpath+"b_client_button_weiter.gif\")'></a>";
	
	//next = 'timer = setTimeout("slide(nextslide);",12000)';
}

function setDivHTMLContent( name, content ){
	document.getElementById(name).innerHTML = content;
}
function addDivHTMLContent( name, content ){
	document.getElementById(name).innerHTML += content;
}
	
//HELPER	

//ausblenden: opacity('bclient', 100, 0, 500) 
//einblenden: opacity('bclient', 0, 100, 500)

function blink( id ){
	opacity(id, 100, 20, 500);
	opacity(id, 20, 100, 500);
	opacity(id, 100, 50, 500);
	opacity(id, 50, 100, 500);
}

function opacity(id, opacStart, opacEnd, millisec) {
    //speed for each frame
    var speed = Math.round(millisec / 100);
    var timer = 0;

    //determine the direction for the blending, if start and end are the same nothing happens
    if(opacStart > opacEnd) {
        for(i = opacStart; i >= opacEnd; i--) {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    } else if(opacStart < opacEnd) {
        for(i = opacStart; i <= opacEnd; i++) {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    }
} 
					
function changeOpac(opacity, id) {
    var object = document.getElementById(id).style;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
}

function fadeIn( layerid, imgcode ){
		changeOpac(0,layerid);
		document.getElementById(layerid).style.visibility = "visible";
		document.getElementById(layerid).innerHTML = imgcode;
		opacity(layerid, 0, 100, 500);				
}

function getQuizPict( numquest ){
	return getPNGImageTag(quizimgpath+"quiz_quest_"+numquest+".png", "quest",670,600);
}

function getAnswerPict( numquest ){
	return getPNGImageTag(quizimgpath+"quiz_answer_"+numquest+".png", "quest",670,600);
}


<!-- Checkbox style -->
var d = document;
var safari = (navigator.userAgent.toLowerCase().indexOf('safari') != -1) ? true : false;
var gebtn = function(parEl,child) { return parEl.getElementsByTagName(child); };
function StyleCheckbox(){
	
    if(!d.getElementById || !d.createTextNode) return;
    var ls = gebtn(d,'label');
    for (var i = 0; i < ls.length; i++) {
        var l = ls[i];
    		//alert( l );
        if (l.className.indexOf('label_') == -1) continue;
        var inp = gebtn(l,'input')[0];
        if (l.className == 'label_check') {
            l.className = (safari && inp.checked == true || inp.checked) ? 'label_check c_on' : 'label_check c_off';
            l.onclick = check_it;
        };
        if (l.className == 'label_radio') {
            l.className = (safari && inp.checked == true || inp.checked) ? 'label_radio r_on' : 'label_radio r_off';
            l.onclick = turn_radio;
        };
    };
}
var check_it = function() {
    var inp = gebtn(this,'input')[0];
    if (this.className == 'label_check c_off' || (!safari && inp.checked)) {
        this.className = 'label_check c_on';
        if (safari) inp.checked = true;
    } else {
        this.className = 'label_check c_off';
        if (safari) inp.checked = false;
    };
};
var turn_radio = function() {
    var inp = gebtn(this,'input')[0];
    if (this.className == 'label_radio r_off' || inp.checked) {
        var ls = gebtn(this.parentNode,'label');
        for (var i = 0; i < ls.length; i++) {
            var l = ls[i];
            if (l.className.indexOf('label_radio') == -1)  continue;
            l.className = 'label_radio r_off';
        };
        this.className = 'label_radio r_on';
        if (safari) inp.checked = true;
    } else {
        this.className = 'label_radio r_off';
        if (safari) inp.checked = false;
    };
};