// JavaScript Document
/* keycodes:
<-| 13
<- 37
/\ 38
-> 39
\/ 40
*/

var nav_item = new Array(8);
nav_item[0] = null;
nav_item[1] = "back"; 
nav_item[2] = "cam_1"; 
nav_item[3] = "cam_2"; 
nav_item[4] = "cam_3"; 
nav_item[5] = "cam_4";
nav_item[6] = "cam_5";
nav_item[7] = "more";

var cam_server = 'http://82.45.131.197/axis-cgi/mjpg/';

var cam_location = new Array(5);
cam_location[0] = 'video.cgi?showlength=1';
cam_location[1] = 'video2.cgi?showlength=1';
cam_location[2] = 'video3.cgi?showlength=1';
cam_location[3] = 'video4.cgi?showlength=1';
cam_location[4] = 'video5.cgi?showlength=1';

var x_index = 0;
var last_x = 0;
var current_cam = 1;

document.onkeydown = navigate;

var aDOM = 0;
var stdDOM = document.getElementById;
if (stdDOM){
	aDOM = 1;
}else {
	alert('Error - browser does not support getElementById');
}
function xDOM(objectId, isStyle) {
	
	return isStyle ? document.getElementById(objectId).style : document.getElementById(objectId);
}
//style functions
function setBg (object, color) {
	var obj = xDOM(object, 1);
	obj.backgroundColor = color;
}
//property functions
function setSrc (object, source) {
	var obj = xDOM(object, 0);
	obj.src = source;
}

function highlight(target,last){
	setBg(nav_item[target],'#00FFFF');
	if (last != 0){
		if (last == 1){
			setBg(nav_item[last],'transparent');
		}else if (last == 7){
			setBg(nav_item[last],'transparent');
		}else{
			setBg(nav_item[last],'#FFFFFF');
		}
	}
}

function navigate(e){
	var keycode;
	
	if (window.event) {
		keycode = window.event.keyCode;
	}else if (e) {
		keycode = e.which;
	}
	
	//left cursor press
	if (keycode == 37){
		if(x_index == (0||1) ){
			x_index = 7;
			highlight(x_index, last_x);
			last_x = x_index;
		}else{
			x_index = x_index - 1;
			highlight(x_index, last_x);
			last_x = x_index;
		}
	}
	
	//right cursor press
	if (keycode == 39){
		if(x_index == (0||7) ){
			x_index=1;
			highlight(x_index, last_x);
			last_x = x_index;
		}else{
			x_index = x_index+1;
			highlight(x_index, last_x);
			last_x = x_index;
		}
	}
	
	//down cursor press
	if (keycode == 40){
		if (x_index == (0||7) ){
			x_index = 1;
			highlight(x_index, last_x);
			last_x = x_index;
		}else if(x_index == 1){
			x_index = 2;
			highlight(x_index, last_x);
			last_x = x_index;
		}else{
			x_index = 7;
			highlight(x_index, last_x);
			last_x = x_index;
		}
	}
	
	//up cursor press
	if (keycode == 38){
		if (x_index == (0||1) ){
			x_index = 7;
			highlight(x_index, last_x);
			last_x = x_index;
		}else if(x_index == 7){
			x_index = 6;
			highlight(x_index, last_x);
			last_x = x_index;
		}else{
			x_index = 1;
			highlight(x_index, last_x);
			last_x = x_index;
		}
	}
	
	//enter key press
	if (keycode == 13){
		if (x_index == 1){
			alert ("Go Back");
		}else if (x_index == 7){
			alert ("More Content");
		}else if (x_index != 0){
				setSrc('i_txt_cam', 'img/txt/cam_' + (x_index - 1) + '.gif');
				setSrc('i_cam_' + (x_index - 1), 'img/photos/th_over_cam_' + (x_index - 1) + '.jpg');
				setSrc('i_cam_' + current_cam, 'img/photos/th_cam_' + current_cam + '.jpg');
				var leftVal = 376 - document.getElementById('i_txt_cam').width;
				setSrc('i_bg', 'img/photos/bg_cam_' + (x_index - 1) + '.jpg');
				setSrc('camera', 'cams/' + nav_item[x_index] + '.htm');
				current_cam = x_index - 1;
		}
	}
}