//  ********************************************************
//  **    JavaScript For Showing Large Images on Pages    **
//  ********************************************************


//  PreLoad large images once the page is loaded
function PreLoadImages() {
	imageObj = new Image();  // create image object
	for(i=0; i<arrImages.length; i++)     {
		imageObj.src = "http://strida.co.uk/media/galleries/bike_new/" + arrImages[i];
	}
}

//  Current Image Variable
var CurrentImg = 0;


//  Show the Images
function ShowImgDiv(whichpic) {
	/* Master Layer Opacity */
	FullPage = document.getElementById('PageWrapper');
	FullPage.style.opacity = 0.3; /* Mozilla */
	FullPage.style.filter = 'alpha(opacity=30)'; /* IE */
	
	/* Show the layer */
	ThisObj = document.getElementById('PictureDiv');
	ThisObj.style.display = 'block';
	ThisObj2 = document.getElementById('PicArrow');
	ThisObj2.style.display = 'block';
	
	/* Load the image */
	if (document.getElementById) {
		document.getElementById('placeholder').src = "http://strida.co.uk/media/galleries/loading.gif";
		document.getElementById('placeholder').src = "http://strida.co.uk/media/galleries/bike_new/" + arrImages[whichpic];
	}
	
	/* Write the image caption */
	document.getElementById('ImgCaption').innerHTML = arrCaption[whichpic];
	
	/* Change the image dots of the menu */
	document.getElementById('ImgDot'+CurrentImg).src = "http://strida.co.uk/media/galleries/dot.gif";
	document.getElementById('ImgDot'+whichpic).src = "http://strida.co.uk/media/galleries/dot_on.gif";
	
	/* Store the current image number */
	CurrentImg = whichpic;
	
	// Stop the link working
	return false;
}

function ShowNext() {
	if (CurrentImg < arrImages.length-1 ) { ShowImgDiv(CurrentImg+1); }
}

function ShowPrevious() {
	if (CurrentImg != 0) { ShowImgDiv(CurrentImg-1); }
}

function JumpToImg(ImgNum) {
	ShowImgDiv(ImgNum);
}

function HideImgDiv() {
	/* Master Layer Opacity */
	FullPage = document.getElementById('PageWrapper');
	FullPage.style.opacity = 1; /* Mozilla */
	FullPage.style.filter = 'alpha(opacity=100)'; /* IE */
	
	/* Hide Image Div */
	ThisObj = document.getElementById('PictureDiv');
	ThisObj.style.display = 'none';
	ThisObj2 = document.getElementById('PicArrow');
	ThisObj2.style.display = 'none';
}


//  Hide the img div when clicked outside
//  Odd way to do this, but in some ways easier than others
//  That awful IE check
var IE = document.all?true:false

// Listen for the click
if (!IE) document.captureEvents(Event.MOUSEDOWN)
document.onmousedown = getMouseXY;

// Variables to hold mouse x & y 
var tempX = 0
var tempY = 0

// Main function to retrieve mouse x & y 
function getMouseXY(e) {
	if (IE) { // grab the x-y pos.s if browser is IE
		tempX = event.clientX + document.body.scrollLeft
		tempY = event.clientY + document.body.scrollTop
	} else {  // grab the x-y pos.s if browser is NS
		tempX = e.pageX
		tempY = e.pageY
	}  
	// catch possible negative values in NS4
	if (tempX < 0){tempX = 0}
	if (tempY < 0){tempY = 0}  

	// Check to see if we're outside the div
	if ( (tempX<750 && tempX>30) && (tempY<560 && tempY>30) ) {
		// We're inside the box - do nothing
	} else {
		//  We're outside the box
		HideImgDiv();
	}
}