//++++++++++++++++++++++++++++++++++++++++++++
//used on home.html to fade in the Homepage image
function initialiseHomepageImg()
{
	var homepageImage = document.getElementById('img0').id;
	opacity(homepageImage, 0, 0, 500);
	document.getElementById('img0').style.visibility='visible';
	opacity(homepageImage, 0, 100, 500);
	document.getElementById('imgdivHomepage').style.backgroundImage='none';

}
//++++++++++++++++++++++++++++++++++++++++++++
// used on portfolio.html to fade in the images
function initialisePortfolio()
{
	var portfolioArray = new Array();
	portfolioArray[0] = document.getElementById('AllSaintsProjectImg').id;
	portfolioArray[1] = document.getElementById('BourneHallSeriesImg').id;
	portfolioArray[2] = document.getElementById('LandscapeAndArchitectureImg').id;
	portfolioArray[3] = document.getElementById('PortraitsImg').id;
	portfolioArray[4] = document.getElementById('MovingImageImg').id;
	portfolioArray[5] = document.getElementById('InstallationsImg').id;
	var i=0;
    for(i=0;i<portfolioArray.length;i++) {  
		opacity(portfolioArray[i], 0, 0, 1000);
		document.getElementById(portfolioArray[i]).style.visibility='visible';
		opacity(portfolioArray[i], 0, 100, 1000);
	}

}

//++++++++++++++++++++++++++++++++++++++++++++
//functions used on pages with slideshow

/*function retrieves length of array, sets the number of items on the page (slideshow-max),
and fades in the 1st image
*/
function initialise(imgArray)
{
	document.getElementById('slideshow-max').childNodes[0].nodeValue = imgArray[0].length;
	opacity('img0', 0, 0, 1500);
	document.getElementById('img0').style.display = 'inline';
	//document.getElementById('imgdiv0').style.display = 'block';
	document.getElementById('imgdiv0').style.backgroundImage= 'none'; 
	opacity('img0', 0, 100, 1500);
}

//Slideshow function to show the next/previous image
//modified, based on Jim Keogh, JavaScript Demystified, McGraw-Hill/Osborne, 2005, p.274
CurrentPicture = 0;
function RunSlideShow(ForwardBack,imgArray) {
	if (document.images) {
		CurrentPicture = CurrentPicture + ForwardBack;
		//if the CurrentPicture reaches the number of images, reset to 0
		if (CurrentPicture > (imgArray[0].length - 1)) {
			CurrentPicture = 0;
		}
		if (CurrentPicture < 0) {
			CurrentPicture = imgArray[0].length - 1;
		}
//		alert('CurrentPicture post if statement: '+CurrentPicture);
		document.getElementById('slideshow-cur').childNodes[0].nodeValue = CurrentPicture+1;
		var i=0;
    	for(i=0;i<imgArray[0].length;i++) { 
			if (i == CurrentPicture){
			var idShowDiv = 'imgdiv'+i;
			var idShowImg = 'img'+i;
			opacity(idShowImg, 0, 0, 1500);
			document.getElementById(idShowDiv).style.display = 'block';
//			document.getElementById('imgdiv0').style.backgroundImage= 'none'; 
			opacity(idShowImg, 0, 100, 1500);
			}
			else{
			var idRemove = 'imgdiv'+i;
			document.getElementById(idRemove).style.display = 'none';
			}
		}
	}
}


// modified, from http://brainerror.net/scripts/javascript/blendtrans/
function opacity(id, opacStart, opacEnd, millisec) {
    //speed for each frame
    var speed = Math.round(millisec / 100);
    var timer = 0;

    //determine the direction for the blending, if start and end are the same nothing happens
    if(opacStart > opacEnd) {
        for(i = opacStart; i >= opacEnd; i--) {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    } else if(opacStart < opacEnd) {
        for(i = opacStart; i <= opacEnd; i++)
            {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
	} 
// ej the next else if was added to set opacity to zero in one fell swoop
	else if (opacStart == opacEnd) {
		changeOpac(0,id);
	}
}

//set the opacity for different browsers
//modified, based on http://clagnut.com/sandbox/imagefades/ and http://brainerror.net/scripts/javascript/blendtrans/
function changeOpac(opacity, id) {
    var object = document.getElementById(id).style;
	// prevents a flicker in Firefox caused when opacity is set to 100%, by setting the value to 99.999% instead.
	opacity = (opacity == 100)?99.999:opacity;
	// Safari 1.2, newer Firefox and Mozilla, CSS3
	object.opacity = (opacity / 100);
	// Older Mozilla and Firefox
	object.MozOpacity = (opacity / 100);
	// Safari<1.2, Konqueror
    object.KhtmlOpacity = (opacity / 100);
	// IE/Win, the following line was commented out due to problem with white dots on images in IE	
	//object.filter = "alpha(opacity=" + opacity + ")";
}

/* function createimagedivas(imgArray) creates an image holder for each image of the array that is parsed 
to the function when calling it; an exception is the 1st image (index 0) for which the image holder is hard-coded on the html page.
the image holder for all images created by createimagedivas is set to display:none so that these divs are not displayed, until 
they are called by the slideshow facility
*/

function createimagedivas(imgArray) {
	var i=1;
    for(i=1;i<imgArray[1].length;i++) {  
	var imgdiva = 'imgdiv'+i;
	var captionspanid = 'caption-image'+i;
	var imageid = 'img'+i;
	//	document.write('value of imgArray[0][0] is '+imgArray[0][0]+'<br />');
		document.write('<div id="'+imgdiva+'" style="display:none"><img id="'+imageid+'" src="'+imgArray[0][i]+'" alt="'+imgArray[1][i]+'" width="'+imgArray[2][i]+'" height="'+imgArray[3][i]+'" /><br /><span id="'+captionspanid+'">'+imgArray[1][i]+'</span></div>');
	}
}