/****** Name: ZAW WIN TUN ********
 *      Date: 21 Sep 2005        *
 *    Points to static files,    *
 *   rather than through the     *
 *       plot.php wrapper        *
 *********************************/
var graph_dir = "graphs/";
var graphType = "-histogram.png";
var all_cat = Array("lookup", "travel", "actlunch", "techphone", "techmp3", "techconsole");

function drawByThreeOption(isActive){
    if ( isActive )
		activateBox(1, false);
	else{
		graphType = "-histogram.png";
		var img = document.getElementById("img");	
		var var_one = document.getElementById("lookatthree_first").value;		
		var val_one = document.getElementById("lookatthree_second").value;
		var val_two = document.getElementById("lookatthree_third").value;		
		var option;
		for (i=0; i<all_cat.length; i++){
    		if (var_one == all_cat[i])
        		graphType = "-barplot.png";    		   		
		}
		if (val_one.length > 3 && val_one != "all"){		
			var val_one = val_one.substring(4);				
			option = "year";
		}
		else{
			option = "age";
		}
		if (val_one == "all" && val_two == "all")
			img.src = graph_dir + var_one + graphType;		
		else if (val_one != "all" && val_two != "all")
			img.src = graph_dir + var_one + "_" + option + "_" + val_one + "_" + val_two + graphType;
		else if(val_one != "all")		
			img.src = graph_dir + var_one + "_" + option + "_" + val_one + graphType;
		else		
			img.src = graph_dir + var_one + "_" + val_two + graphType;				
	}
}	

function drawByCompare(isActive){
    
	if (isActive)
		activateBox(2, false);
	else{
		var graphType = "-histogram.png";		 
	    var img = document.getElementById("img");	
		var var_one = document.getElementById("cmp_first").value;		
		var value_one = document.getElementById("cmp_second").value;
		var gender = document.getElementById("cmp_third").value;	
		var cmpvalue = document.getElementById("cmp_forth").value;		
		var cmpgender = document.getElementById("cmp_fifth").value;		
	    var option, cmpoption, imgName;	
	    for (i=0; i<all_cat.length; i++){
    		if (var_one == all_cat[i]){
        		graphType = "-barplot.png";
    		}    		
		}
		imgName = var_one + "_";		
	    if (value_one.length > 3){
	        value_one = value_one.substring(4);	 //get the number for the value, "year5"
			option = "year";	
			imgName += option + "_" + value_one + "_" ;		
	    }    
	    else if(value_one != "all"){         
	        option = "age";	        
	        imgName += option + "_" + value_one + "_" ;
	    }	    
	    else	
	        imgName = var_one + "_";	   
	    if (gender != "all")
	        imgName += gender + "_";
        imgName += "with_";
        	        
		if (cmpvalue.length > 3){
	        cmpvalue = cmpvalue.substring(4);	 //get the number for the value, "year5"
			cmpoption = "year";  
			imgName += cmpoption + "_" + cmpvalue;      	
	    }  
	    else if(cmpvalue != "all"){
	        cmpoption = "age"; 
	        imgName += cmpoption + "_" + cmpvalue;  
        }
        if(cmpgender == 'all' && cmpvalue == 'all')
			imgName += 'all'; 
		else if(cmpvalue =='all')
			imgName += cmpgender;			
		else{			
	        if(cmpgender != "all")
	            imgName += "_" + cmpgender;     			           
		}	
		                  	
	    img.src = graph_dir + imgName + graphType;
	}	
}

function drawByFourOption(isActive){			
	
	if (isActive)
		activateBox(3, false);
	else{		
		var img = document.getElementById("img");	
		var var_one = document.getElementById("lookatfour_first").value;		
		var var_two = document.getElementById("lookatfour_second").value;
		var value_one = document.getElementById("lookatfour_third").value;		
		var gender = document.getElementById("lookatfour_forth").value;		
		var option, imgName;
		graphType = "-plot.png";
		imgName = var_one + "_" + var_two + "_";
		if (value_one.length > 3){		
			value_one = value_one.substring(4);				
			option = "year";
			imgName += option + "_" + value_one;
		}
		else if(value_one != "all"){
			option = "age";
			imgName += option + "_" + value_one;
		}
		else
		    imgName = var_one + "_" + var_two;	
		if (gender != "all")
		    imgName += "_" + gender;
		img.src = graph_dir + imgName + graphType;	
	}				
}
function activateBox(q, bubble){
	// makes a particular question active
	// change the class for the questions
	for ( var i = 1; i <= 3 ; i++ ){
		document.getElementById("question"+i).className = ((i == q)?"box boxactive":"box");
	}
	// if we need to bubble this, imitate an onClick action
	if ( bubble && (q == 1) )
		drawByThreeOption(false);
	if ( bubble && (q == 2) )
		drawByCompare(false);
	if ( bubble && (q == 3) )
		drawByFourOption(false);					
}