// From Book/Course: Dynamic HTML Web Magic by Jeff Rouyer, ISBN 1-56830-421-8
// STEP 5

//Random Background Image choice RGES 25 Jan. 2003
var BgImage = new Array();
BgImage[0] = "Img/FOREST06c.JPG"			//
BgImage[1] = "Img/Field03f.JPG"
BgImage[2] = "Img/RocksOnShore.jpg"
BgImage[3] = "Img/VerticalCoast.jpg"
BgImage[4] = "Img/RoughCoast.jpg"
BgImage[5] = "Img/CoastBetween2Hills.jpg"
BgImage[6] = "Img/TreeAboveSharpSeaRocks.jpg"
BgImage[7] = "Img/TrunkAboveCost.jpg"
BgImage[8] = "Img/ZebrasAtWaterhole.jpg"
BgImage[9] = "Img/GnusOnSteppe.jpg"
BgImage[10] = "Img/RedRock.jpg"
var rImg = Math.random()*10;				// set step variables
var sImg = parseInt(rImg);
//alert(sImg);

function Is() {
	var agent = navigator.userAgent.toLowerCase();
	this.major = parseInt(navigator.appVersion);
	this.minor = parseFloat(navigator.appVersion);
	this.ns  = ((agent.indexOf('mozilla')!=-1) && ((agent.indexOf('spoofer')==-1) && (agent.indexOf('compatible') == -1)));
	this.ns2 = (this.ns && (this.major == 3));
	this.ns3 = (this.ns && (this.major == 3));
	this.ns4 = (this.ns && (this.major >= 4));
	this.ie   = (agent.indexOf("msie") != -1);
	this.ie3  = (this.ie && (this.major == 2));
	this.ie4  = (this.ie && (this.major >= 4));
	this.op3 = (agent.indexOf("opera") != -1);
}

var is = new Is()

if(is.ns4) {
	doc = "document";
	sty = "";
	htm = ".document"
} else if(is.ie4) {
	doc = "document.all";
	sty = ".style";
	htm = ""
}

// STEP 6

var count = 0;

function preLoad() {
	earth = new Image();
	earth.onload = loadCheck;
	earth.src = "img/gate/brk1real.jpg";

	horizon = new Image();
	horizon.onload = loadCheck;
	horizon.src = BgImage[sImg];
	//horizon.src = "Img/FOREST06c.JPG";

	right_hand = new Image();
	right_hand.onload = loadCheck;
	right_hand.src = "img/gate/right_hand.gif";

	bottom_hand = new Image();
	bottom_hand.onload = loadCheck;
	bottom_hand.src = "img/gate/bottom_hand.gif";

	left_hand = new Image();
	left_hand.onload = loadCheck;
	left_hand.src = "img/gate/left_hand.gif";

	top_hand = new Image();
	top_hand.onload = loadCheck;
	top_hand.src = "img/gate/top_hand.gif";

	magic = new Image();
	magic.onload = loadCheck;
	magic.src = "img/gate/Logo-FlowerBorder8.jpg";
}

function loadCheck() {
	count++;
	if(count == 7) {
		layerSetup();
	}
}

// STEP 7

function layerSetup() {
	backLyr = eval(doc + '["backLayer"]' + sty);
	backLyr.left = 0;
	backLyr.top = 0;

	foreLyr = eval(doc + '["foreLayer"]' + sty);
	foreLyr.left = 0;
	foreLyr.top = 0;

	rightHandLyr = eval(doc + '["rightHandLayer"]' + sty);
	rightHandLyr.left = (available_width+98)/2;
	rightHandLyr.top = (available_height-128)/2;

	bottomHandLyr = eval(doc + '["bottomHandLayer"]' + sty);
	bottomHandLyr.left = (available_width-128)/2;
	bottomHandLyr.top = (available_height+98)/2;

	leftHandLyr = eval(doc + '["leftHandLayer"]' + sty);
	leftHandLyr.left = (available_width-237)/2;
	leftHandLyr.top = (available_height-128)/2;

	topHandLyr = eval(doc + '["topHandLayer"]' + sty);
	topHandLyr.left = (available_width-128)/2;
	topHandLyr.top = (available_height-237)/2;

	magicLyr = eval(doc + '["magicLayer"]' + sty);
	magicLyr.left = (available_width-165)/2;
	magicLyr.top = (available_height-133)/2;

	htmlSetup();
}

// STEP 8

function htmlSetup() {
	var backHTML = eval(doc + '["backLayer"]' + htm);
	var foreHTML = eval(doc + '["foreLayer"]' + htm);

	var table_a = '<TABLE BACKGROUND="Img/gate/brk1real.jpg" BORDER="0" CELLPADDING="0" CELLSPACING="0" WIDTH="' + available_width + '" HEIGHT="' + available_height + '"><TR><TD>.</TD></TR></TABLE>';
	var table_b = '<TABLE BACKGROUND="' + BgImage[sImg] + '" BORDER="0" CELLPADDING="0" CELLSPACING="0" WIDTH="' + available_width + '" HEIGHT="' + available_height + '"><TR><TD>.</TD></TR></TABLE>';

	if(is.ns4) {
		backHTML.write(table_a); backHTML.close();
		foreHTML.write(table_b); foreHTML.close();
	} else {
		backHTML.innerHTML = table_a;
		foreHTML.innerHTML = table_b;
}
//alert("backHTML.innerHTML=" + backHTML.innerHTML)
//alert("foreHTML.innerHTML=" + foreHTML.innerHTML)

	clippingSetup();
}

// STEP 9

function clippingSetup() {
	cTop = (available_height-150)/2;
	cRight = (available_width+150)/2;
	cBottom = (available_height+150)/2;
	cLeft = (available_width-150)/2;

	if(is.ns4) {
		foreLyr.clip.top = cTop;
		foreLyr.clip.right = cRight;
		foreLyr.clip.bottom = cBottom;
		foreLyr.clip.left =  cLeft;
	} else {
		foreLyr.clip = 'rect(' + cTop + ' ' + cRight + ' ' + cBottom + ' ' + cLeft + ')';
	}

	visibilitySetup();
}

// STEP 10

function visibilitySetup() {
	backLyr.visibility = "visible";
	foreLyr.visibility = "visible";
	rightHandLyr.visibility = "visible";
	bottomHandLyr.visibility = "visible";
	leftHandLyr.visibility = "visible";
	topHandLyr.visibility = "visible";

	setTimeout("clipRight()", 2500);
}

// STEP 11

function clipRight() {
	var hand_position = parseInt(rightHandLyr.left);
	cRight = (is.ns4) ? foreLyr.clip.right : parseInt(foreLyr.clip.substring(11, 16));

	//RGES 13 feb 05: if monitor width > 1000 px then table_b was hidden when clipBottom starts !?!
	var right_available_width = available_width
	if (available_width > 1000){
		right_available_width = 999
	}
	
	if(cRight < right_available_width-45) {
		if(is.ns4) {
			foreLyr.clip.right = cRight+4;
		} else {
			var ccRight = cRight+4;
			foreLyr.clip = 'rect(' + cTop + ' ' + ccRight + ' ' + cBottom + ' ' + cLeft + ')';
		}
		rightHandLyr.left = hand_position+4;
		setTimeout("clipRight()", 1);
	} else {
		clipBottom();
	}
}

function clipBottom() {
	var hand_position = parseInt(bottomHandLyr.top);
	cBottom = (is.ns4) ? foreLyr.clip.bottom : parseInt(foreLyr.clip.substring(17, 20));
	if(cBottom < available_height-45) {
		if(is.ns4) {
			foreLyr.clip.bottom = cBottom+4;
		} else {
			var ccBottom = cBottom+4;
			foreLyr.clip = 'rect(' + cTop + ' ' + cRight + ' ' + ccBottom + ' ' + cLeft + ')';
		}
		bottomHandLyr.top = hand_position+4;
		setTimeout("clipBottom()", 1);
	} else {
		clipLeft();
	}
}

function clipLeft() {
	var hand_position = parseInt(leftHandLyr.left);	
	cLeft = (is.ns4) ? foreLyr.clip.left : parseInt(foreLyr.clip.substring(23, 28));
	if(cLeft > 45) {
		if(is.ns4) {
			foreLyr.clip.left = cLeft-4;
		} else {
			var ccLeft = cLeft-4;
			foreLyr.clip = 'rect(' + cTop + ' ' + cRight + ' ' + cBottom + ' ' + ccLeft + ')';
		}
		leftHandLyr.left = hand_position-4;
		setTimeout("clipLeft()", 1);
	} else {
		clipTop();
	}
}

function clipTop() {
	var hand_position = parseInt(topHandLyr.top);
	cTop = (is.ns4) ? foreLyr.clip.top : parseInt(foreLyr.clip.substring(5, 10));
	if(cTop > 45) {
		if(is.ns4) {
			foreLyr.clip.top = cTop-4;
		} else {
			var ccTop = cTop-4;
			foreLyr.clip = 'rect(' + ccTop + ' ' + cRight + ' ' + cBottom + ' ' + cLeft + ')';				}
		topHandLyr.top = hand_position-4;
		setTimeout("clipTop()", 1);
	} else {
		magicLyr.visibility = "visible";
	}
}