var responses = new Object();
var extradata = new Object();
var responseimages = new Object();
var demographics = new Object();
var tStart  = new Date();
var modulename;
var pageImpressionsSent = new Array();
moduleStarted = false;

// VisualDNA cookie
var VDNA_setComplete = false;
function checkCookieComplete(url, userId)
{
	// if Safari, ignore cookie and redirect
	if (userId == null)
	{
		document.location.assign(url);
		return;
	}
	if (!VDNA_setComplete) setTimeout('checkCookieComplete("' + url + '");', 100);
		else document.location.assign(url);
}

// traverse the DOM
walkTheDOM = function(node, func){
    func(node); 
    node = node.firstChild; 
    while (node) { 
        walkTheDOM(node, func); 
        node = node.nextSibling; 
    } 
}; 

// standard elements by class
getElementsByClassName = function(className){ 
    var results = []; 
    walkTheDOM(document.body, function (node){ 
        var a, c = node.className, i; 
        if(c){ 
            a = c.split(' '); 
            for(i = 0; i < a.length; i += 1){ 
                if(a[i] === className){ 
                    results.push(node); 
                    break; 
                } 
            } 
        } 
    }); 
    return results; 
}; 

// add event handler
addEventHandler = function(node, type, f){
	if(node.addEventListener){
		node.addEventListener(type, f, false); 
    }else if(node.attachEvent){       
		node.attachEvent("on" + type, f); 
    }else{
		node["on" + type] = f;
    } 
};

// randomise an array	
randOrd = function(){
	return (Math.round(Math.random())-0.5); 
}; 

// choice array (for the 'ripple')
var nums = nums || [1,2,3,4,5,6,7,8];

// create ripple effect		
ripple = function(rippleSpeed, fadeSpeed){
	if(nums.length>0){
		var foo = nums.sort(randOrd);
		var num = foo.pop();
		toggleImage(num, fadeSpeed);
		setTimeout("ripple("+rippleSpeed+","+fadeSpeed+")", rippleSpeed);
	};
};

// (un/de)highlights an image
highlightImage = function(obj, type){
	var span = obj.parentNode.parentNode.firstChild; // get span from obj
	span.style.display = 'block';
	var spanimg = span.firstChild;
	var myWidthImg1 = new fx.Width(spanimg , {duration: 100}); // set up width change
	var myHeightImg1 = new fx.Height(spanimg , {duration: 100, onComplete: function(){
		if(type!='over'){
			span.style.display = 'none';
		}
	}}); // set up height change and hide when finished
	if(type=='over'){ 
		// do over effect
		myWidthImg1.custom(155, 158);
		myHeightImg1.custom(155, 158);
	}else{
		// do out effect
		myWidthImg1.custom(158, 155);
		myHeightImg1.custom(158, 155);
		//efx.custom(1,0);
	};
};

// fakes mouseover and mouseout events for ripple
toggleImage = function(num, speed){
	var uls = getElementsByClassName('q'),
	choices = uls[0].getElementsByTagName('img'),
	imgs = [],
	choice;
	for( var j = 0 ; j < choices.length ; j = j + 1 ){
		if(j%2){
			imgs.push(choices[j]);	
		}
	}
	choice = imgs[num-1];
	var span = choice.parentNode.parentNode.firstChild; // get span from obj
	span.style.display = 'block';
	var spanimg = span.firstChild;
	var myWidthImg1 = new fx.Width(spanimg , {duration: speed, onComplete: function(){
		var myWidthImg1 = new fx.Width(spanimg , {duration: speed});
		myWidthImg1.custom(158, 155);
	}}); // set up width change
	var myHeightImg1 = new fx.Height(spanimg , {duration: speed, onComplete: function(){
		var myHeightImg1 = new fx.Width(spanimg , {duration: speed});
		myHeightImg1.custom(158, 155);
		span.style.display = 'none';
	}}); // set up height change
	myWidthImg1.custom(155, 158);
	myHeightImg1.custom(155, 158);
};

// send message to screen
say = function(str){
	try{
		window.loadFirebugConsole();
		console.log(str);
	}catch(e){
		alert(str);
	}
};

window.onload = function(){

	var uls = getElementsByClassName('q'); // get all statements
	for( var i = 0 ; i < uls.length ; i = i + 1 ){ // loop through all statements
		var choices = uls[i].getElementsByTagName('img');
		for( var j = 0 ; j < choices.length ; j = j + 1 ){ // loop through all choices
			if(j%2){
				var obj = choices[j];
				// add click event
				addEventHandler(obj, 'click', function(e){
					// CLICKED
				});
				// add mouseover event
				addEventHandler(obj, 'mouseover', function(e){
					e = e || event; 
					var target = e.target || e.srcElement; 
					highlightImage(target, 'over');
				});
				// add mouseout event
				addEventHandler(obj, 'mouseout', function(e){
					e = e || event; 
					var target = e.target || e.srcElement; 
					highlightImage(target, 'out');
				});
			};
		};
	};
	
	var message = document.getElementById('flash-message');
	message.parentNode.removeChild(message);
	ripple(125, 150);
	
	sendImpressionEvent('QUIZ_WINDOW_ONLOAD');
};

function nextpage(el,subq,page)
{
	var key;
	var i;
	
	// hide current page
	if(page!=""){
		$("page"+page).style.display="none";
	}
	
	// find next page
	if(page!=""){
		page = pages[page];
	}
	else{// find first page
		for (key in pages) {
		   page=key;
	   	   loadImages(page);
		   sendGAEventAfterAllImgLoad(page);
		   break;
		}
	}
	
	// send statement impression where all images are loaded
	if(page.toLowerCase()!=='finish')
	{
		sendEventAfterAllImgLoad(page);
	}
	
	$("page"+page).style.display="block";
	if(page.toLowerCase()==='finish'){
		finishUp();
		return;
	}
	
	inner=$("page"+page).getElementsByTagName("div")[1];

	if (window.ActiveXObject) // for ie
		efx = new fx.Opacity(inner,{onComplete: function()
		{
		this.el.style.filter = "";
		}});
	else
		efx = new fx.Opacity(inner);
	efx.setOpacity(0.01);
	

	randomizeImages(page);

	efx.custom(0,0.999);
	
	// display 3 choice images in a row, if only 6 images instead of default 8
	if (jQuery("#page" + page + " ul.ql li").size() == 6)
	{
		jQuery("#page" + page + " ul.ql").css({"padding-left": "70px", "width": "500px"});
	}
	// display 2 choice images centered, if only 2 images instead of default 8
	if (jQuery("#page" + page + " ul.ql li").size() == 2)
	{
		jQuery("#page" + page + " ul.ql").css({"padding-left": "150px"});
	}
	
	
	// load next page's images
	npage = pages[page];
	if(npage!=""){
		loadImages(npage);
	}
}

function sendEventAfterAllImgLoad(page)
{
	if (checkImagesFullLoad(page))
	{
		sendStatementEvent (page,"IMPRESSION");
	}
	else
	{
		setTimeout("sendEventAfterAllImgLoad('" + page + "')", "500");
	}
}

function sendGAEventAfterAllImgLoad(page)
{
	if (checkImagesFullLoad(page))
	{
		VDNA_GAET.track(trackingData.Ba4, "First statement completely loaded (" + page + ")", trackingData.Ba24, "");
	}
	else
	{
		setTimeout("sendGAEventAfterAllImgLoad('" + page + "')", "500");
	}
}

function loadImages(page)
{

	ims = $("page"+page).getElementsByTagName("img");
	
	for(i=0;i<ims.length;i++){
	
		if(ims[i].src.indexOf("/images/quiz/t.gif")!=-1){
			ims[i].src = ims[i].parentNode.rel;
		}
	}
}

function checkImagesFullLoad(page)
{
	var allImagesLoaded = true;
	var ims = $("page"+page).getElementsByTagName("img");
	for (i=0;i<ims.length;i++)
	{
		if(ims[i].src.indexOf("/images/quiz/shadow.png")==-1)
		{
			if (!ims[i].complete || ims[i].src.indexOf("/images/quiz/t.gif")!=-1)
			{
				allImagesLoaded = false;
				break;
			}

			if (typeof ims[i].naturalWidth != "undefined" && ims[i].naturalWidth == 0) 
			{
				allImagesLoaded = false;
				break;
			}
		}
	}
	return allImagesLoaded;
}

function randomizeImages(page)
{
	
	ims = $("page"+page).getElementsByTagName("li");
	
	for(i=0;i<ims.length*2;i++){
		el1=ims[Math.round(getRandomArbitary(0,ims.length-1))];
		el2=ims[Math.round(getRandomArbitary(0,ims.length-1))];
		el2.parentNode.insertBefore(el2,el1);	
	}

}

function getRandomArbitary(min, max) {
  return Math.random() * (max - min) + min;
}

function r(el, page, response,subq)
{
	if (!moduleStarted) {
		moduleStarted = true;
		sendModuleStartEvent();
	}
	
	img=el.childNodes[0];
	if(img.src=="") return false;
	if(isImageLoaded(img)==false) return false;
	
	
	responses[page]=response;
	responseimages[page]=img.src;
	sendStatementEvent(page,"CLICK");

	if (page=="age"){
		switch(response)
		{
		case "choice_72787":
		  trackingData.Ba15 = "18-24";
		  break;
		case "choice_72788":
		  trackingData.Ba15 = "25-34";
		  break;
		case "choice_72789":
		  trackingData.Ba15 = "35-44";
		  break;
		case "choice_72790":
		  trackingData.Ba15 = "45-54";
		  break;
		case "choice_72791":
		  trackingData.Ba15 = "55+";
		  break;
		}
		
	}
	
	if (page=="demog_gender"){
		switch(response)
		{
		case "choice_54204":
		  trackingData.Ba16 = "M";
		  break;
		case "choice_54205":
		  trackingData.Ba16 = "F";
		  break;
		}
		
	}
	if (page=="relationship"){
		switch(response)
		{
		case "choice_83970":
		  trackingData.Ba19 = "Y";
		  break;
		case "choice_83971":
		  trackingData.Ba19 = "N";
		  break;
		}
		
	}
	nextpage(el,subq,page);
	
	return false;
}

function cro(){var o=null;if(window.ActiveXObject){o=new ActiveXObject("Msxml2.XMLHTTP");if(!o)o=new ActiveXObject("Microsoft.XMLHTTP")}else if(window.XMLHttpRequest){o=new XMLHttpRequest()}return o;}
function rmp(u,f,a){var p=cro();p.open("GET","saveResponse.php?"+u,true);if(f){p.onreadystatechange=function(){if(p.readyState==4){a?f(a,p.responseText):f(p.responseText)}}}p.send(null)}


function finishUp()
{
	// record how long it took to complete surve
	var   tDate = new Date();
    var   tDiff = tDate.getTime() - tStart.getTime();
    tDate.setTime(tDiff);

	rrs = "";
	for (i in responses) {
		rrs += "&"+i+"="+responses[i];
	}
	
	for (i in extradata) {
		rrs += "&extra_"+i+"="+extradata[i];
	}		
	submitForm(rrs);
}

function submitForm(rrs)
{
	ourDate = new Date();
	cachebreak = ourDate.getMilliseconds() 
	rmp("ts="+cachebreak+rrs,formSubmitted);	
}

function formSubmitted(a){
	var responseId = null;
	var userId = null;
	eval(a);
	sendModuleCompleteEvent(responseId);
}


function loadJS(url)
{
	var headTag = document.getElementsByTagName("head").item(0);
	var scriptTag = document.createElement("script");
	scriptTag.src = url;
	headTag.appendChild( scriptTag );
}


function isImageLoaded(img) {
    if (typeof img.complete != "undefined" && !img.complete) {
        return false;
    }
    if (typeof img.naturalWidth != "undefined" && img.naturalWidth == 0) {
        return false;
    }
    return true;
}