//
//	Assitant.js - supports the popup help that appears after
//	a period of inactivity when the front page is opened.
//	
//	Should cause a popup to appear if:
//		No blue dot has been clicked for several seconds.
//		No dot has been rolled over.
//		No location selected by the dropdown box.
//

// a var to let other parts of the page know that the assitant is available
assistantOn=true;		// used to detect if the assistant is present
var assistTimer=0;		// the handle to the appearance timer
var appearanceCount=60;	// No. of seconds until assistant appears
var waitCount=60;		// No. of seconds to wait until assistant auto disappears
var assistNode=null;	// holds the assistant 
var textNode=null;		// holds the assistant 
var mainNode=null;		// holds the central DIV area of the popup 
var inDemo=false;		// determines functionality of startMouseDown() function
var doFlash=true;		// flash the background while waiting for the auto-disappear

// timer constants
var waitAutoEnd=10;			// How much time before help auto disappears after the help demo has finished
var waitAutoEndStart=20;	// How long before help auto-disappears after auto-appear if no yes/no button is pressed
var waitInactivity=5;		// How much time before inactivity triggers help appearance

var colours = new Array("#FFFFFF","#fcfcfc","#f8f8f8","#fcfcfc","#FFFFFF");  // colours to oscillate the background
var bgColour = 0; // index into the colours array for oscillating the background..
var bgStep = 1;

// Holds the innerHTML to create the assitant window
var assistantHTML = "<div id='assistTL'> <div id='assistTR'> <div id='assistT'></div></div></div>" + 
					 "<div id='assistL'> <div id='assistR'>" + 
					 "<div id='assistMain'><img src='"+thmPath+"images/assistant/assist.png' id='assistIcon' name='assistIcon'><div id='assistInfo' name='assistInfo'>Welcome to the Outpost web site, would you like some help using the site?</div><a href='javascript:startMouseDown();' id='startBtn' name='startBtn'>yes</a><a href='javascript:showAssistant(false);' id='stopBtn' name='stopBtn'>no</a>" +
					 "</div></div></div>" + 
					 "<div id='assistBL'> <div id='assistBR'> <div id='assistB'></div></div></div>";  

// simple scripting instructions for the interactive help..
// each element is a delimited set of control params..
// assistant position,text,wait time,image src
var demoStep = new Array();
demoStep[0]="290,122|The blue dots each represent a location where we have an Outpost.|10|bluedots.gif";
demoStep[1]="290,122|Roll your mouse over the dot and the name of the location will appear above it.|10|rollover.gif";
demoStep[2]="500,122|In areas where there are a lot of offices close together an enlarged map of the area will show when you roll over it.|10|arrowright.gif";
demoStep[3]="290,200|Click on any of the dots and information about the location appears in the information area above the map.|10|dotclick.gif";
demoStep[4]="210,220|You can also select a location by choosing it's name from this drop-down list, including GOS and the AC.|10|arrowdown.gif";
demoStep[5]="500,22|Information about the location appears in this area, such as their opening times. Roll over the area to expand it where possible.|10|arrowup.gif";
demoStep[6]="500,22|This area also shows the name of the focal point and contact details for the local Outpost, as well as any other information that they have made available.|15|arrowup.gif";
demoStep[7]="100,22|The large clock shows the current time in the location, while the smaller clocks show the times at the three global Shell centres.|15|arrowup.gif";

demoStep[8]="400,200|I hope this has helped you to find your way around the web site.|0|assist.png";

var currStep=0;
var demoControl = new Array(4);

// the timer needs to be started on page load
startAssistant();


// interval handler to start the assistant
function assistantTimer(){
	
	appearanceCount--;
	
	if (appearanceCount<=0){
		// stop the timer
		clearTimeout(assistTimer);
		
		// build and show the asssitant
		showAssistant(true);
	}else{
		assistTimer = setTimeout("assistantTimer()",1000);
	}
		
}

// interval handler to wait open before auto shutting..
function waitTimer(){
	// this will oscillate the background to attract attention and 
	// and close after 60s
	waitCount--;
	
	if (waitCount <= 0){
		clearTimeout(assistTimer);
	
		stopAssistant();
	}else{
		// now oscillate the background
		if (assistNode && doFlash){
			// move the colour index along depending on the sign of bgStep
			bgColour += bgStep;
			
			// check to see if the index is out of bounds and if so adjust the step and the index
			if (bgColour >= colours.length) {
				bgStep = -1;
				
				bgColour = colours.length-1;
			}
			
			if (bgColour < 0) {
				bgStep = 1;
				
				bgColour = 0;
			}
			
			// change the colour of the background
			if ((mainNode) && (mainNode.style)) mainNode.style.backgroundColor=colours[bgColour];
		}
		
		assistTimer = setTimeout("waitTimer()",100);
	}
}

function restoreBackground(){
	if ((mainNode)&&(mainNode.style)) mainNode.style.backgroundColor=colours[0];
}

function startWait(jsWait){
	// multiply by 10 to get seconds ..
	waitCount=jsWait * 10;
	
	waitTimer();
}

function stopWait(){
	clearTimeout(assistTimer);
	
	restoreBackground();
}

function startAssistant(){
	// start the auto disappear count
	doFlash=true;

	appearanceCount=appearanceCount;
	
	assistantTimer();
}

// stop the timer, called by functions that show the user knows how to use the web site..
function stopAssistant(){
	clearTimeout(assistTimer);
	
	appearanceCount=60;
	
	showAssistant(false);
}

function startAutoDisappear(jsSecs, jsFlash){
	// start the auto-disappear count
	doFlash=jsFlash;
	
	startWait(jsSecs);
}

// create the popup
function showAssistant(jsShow){
	// build the assistant element, and if that doesn't work then exit
	if (jsShow){ 
		// if the request is to show the assistant we need to try to build it first
		assistNode=buildAssistant(); 
	}else{
		// if asking to hide then only need to see if it exists so we can hide it
		assistNode=document.getElementById("assistant");
	}

	// if there is no assistant then we can't show/hide it anyway
	if (!assistNode) return;
	
	// make the assistant dis/appear..
	if (jsShow){
		if (assistNode.style){
			assistNode.style.display="block";
			assistNode.style.visibility="visible";
			// make sure the assistant is always on top..
			assistNode.style.position="absolute";
			assistNode.style.zIndex="99";
		}else{
			alert("Assistant has no style - show");
		}
		
		// start the auto disappear wait counter
		startWait(waitAutoEndStart);
		
	}else{
		if (assistNode.style){
			assistNode.style.display="none";
			assistNode.style.visibility="hidden";
		}else{
			alert("Assistant has no style - hide");
		}
	}
}

function activateAssistant(jsActivate){
	// start doing what the assistant does ..
	if (!jsActivate){
		// deactivate - so stop what it's doing
		
		// and hide
		showAssistant(false);
	}else{
		// show a series of text fragments describing the interface..
		restoreBackground();
		
		// change the Yes/No button to next and stop
		btn=document.getElementById("startBtn");
		btn.innerHTML="next";
		inDemo=true;
		
		btn=document.getElementById("stopBtn");
		btn.innerHTML="stop";
		
		// rewind to the beginning
		currStep=0;
		
		// possibly also moving around to highlight the described elements..
		startDemoInstruction();
	}
}


function buildAssistant(){
	var jsAssist=document.getElementById("assistant");

	// if it is present then we don't need to go any further
	if (jsAssist) return jsAssist;
	
	// if it isn't then we need to build it..
	// find the map container and parent the popup to that ..
	jsMapId=document.getElementById("MapContainer");
	
	if (!jsMapId) {alert("Can't find the map container.."); return null; }
	
	// build the assistant element
	jsAssist=document.createElement("div");
	
	// add the assistants attributes
	if (!jsAssist) {alert("Couldn't create the assistant element.."); return null;}
	jsMapId.appendChild(jsAssist);
	jsAssist.id="assistant";
	jsAssist.className="assistant";
	jsAssist.styleName="assistant";
	jsAssist.onMouseOver="javascript:mouseOver();";
	jsAssist.setAttribute("onMouseOver", "javascript:mouseOver();");
	
	jsAssist.innerHTML=assistantHTML;
	
	textNode=document.getElementById('assistInfo');
	mainNode=document.getElementById('assistMain');
	
	// it's built now so we're done
	return jsAssist;
}

// called when the mouse runs over the assistant box.
// this means it's been noticed so switch of the wait
function mouseOver(){
	stopWait();
	
	restoreBackground();	
}

// called when the mouse is clicked on start button.
// this means it's been noticed so switch of the wait
function startMouseDown(){
	if (inDemo){
		// for in demo clicks move to the next instruction
		nextDemoInstruction();
	}else{
		// otherwise restart the demo
		activateAssistant(true);
		
	}
}

// Functions to parse and control the demo
//
function demoWait(){
	waitCount--;
	if (waitCount <= 0){
		clearTimeout(assistantTimer);
		
		currStep++;
			
		// start the next instruction if there is one
		// otherwise wait for the user to close the window..
		if (currStep < demoStep.length){
			
			startDemoInstruction();
		
			// prepare for the end by renaming the stop button to close and the start button to restart
			if (currStep >= (demoStep.length - 1)){
				btn=document.getElementById("startBtn");
				btn.innerHTML="restart";
				inDemo=false;
				
				btn=document.getElementById("stopBtn");
				btn.innerHTML="close";
				
				// start the auto-disappear count
				startAutoDisappear(waitAutoEnd, false);
			}
		}
		
	}else{
		assistantTimer=setTimeout("demoWait()",1000);
	}
}

function startDemoInstruction(){
	// decode the instruction
	demoControl=demoStep[currStep].split("|");
	
	// start the move
	pos=demoControl[0].split(",") ;
	demoMoveTo(pos[0],pos[1]);
}

function demoMoveTo(jsLeft,jsTop){
	if ((assistNode)&&(assistNode.style)){
		
		assistNode.style.left=jsLeft+"px";
		assistNode.style.top=jsTop+"px";
		
		// because IE6 is misbehaving..
		assistNode.style.display="block";
		assistNode.style.visibility="visible";
		assistNode.style.zIndex="99";
		
	}
	
	// finished moving go to waitDemoInstruction for the reader to read the new text
	waitDemoInstruction();
}

function nextDemoInstruction(){
	// stop the waiting and move onto the next instruction ..
	waitCount=0;
	demoWait()	
}

function waitDemoInstruction(){
	// change the text..
	if(textNode){
		textNode.innerHTML=demoControl[1];

		// change the img..
		jsImg=document.getElementById("assistIcon");
		if (jsImg) jsImg.src=thmPath+"images/assistant/"+demoControl[3];
	}
	
	// wait for reader to read the text
	waitCount=demoControl[2];
	demoWait();
}