var move = false;
var scrollHeight = 0;
var firObj = null;
<!-- Stops right click -->
document.oncontextmenu=new Function("return false");

function scroll(id, dir){
	div = document.getElementById(id);
	children = div.childNodes;
	move = true;
	for(i=children.length-1;i>=0;i--){
		if(children[i].tagName=='img' || children[i].tagName=='IMG'){
			obj = children[i].id;
			moveObj(obj, dir);
		}
	}
}

function moveObj(objId, dir){
	firObjTop = Math.abs(parseInt(firObj.style.top));
	//document.getElementById('txtbx').value = Math.abs(firObjTop) +" "+scrollHeight;
	if((dir==1 && firObjTop<scrollHeight) || (dir==-1 && firObjTop>0)){
		obj = document.getElementById(objId);
		dist = parseInt(obj.style.top)-(dir*10);
		obj.style.top = dist+'px';
		//document.getElementById('txtbx').value = document.getElementById('thbNail0').style.top +" "+document.getElementById('thbNail1').style.top;
		if(move){
			setTimeout("moveObj('"+objId+"', "+dir+")", 75);
		}
	}
}

function getScrollHeight(divId){
	div = document.getElementById(divId);
	children = div.childNodes;
	height = 0;
	counter=0;
	for(j=0;j<children.length;j++){
		if(children[j].tagName=='img' || children[j].tagName=='IMG'){
			counter++
			if(counter==1){
				firObj = children[j];
			}
			//height stores the total height of the scrolling contents, including image height and any padding/margins images have
			height += children[j].height;
			if(children[j].style.marginTop!=""){
				height += parseInt(children[j].style.marginTop);
			}
			if(children[j].style.marginBottom!=""){
				height += parseInt(children[j].style.marginBottom);
			}
			if(children[j].style.paddingTop!=""){
				height += parseInt(children[j].style.paddingTop);
			}
			if(children[j].style.paddingBottom!=""){
				height += parseInt(children[j].style.paddingBottom);
			}
		}
	}
	
	return (height-(parseInt(div.style.height)-3))+200;
}

function changeImg(thbNail, mainImgSrc, mainID){
	var mainImg = document.getElementById(mainID);
	resizePic(thbNail.id, 'mainImg', '420', '500');
	mainImg.src = mainImgSrc;
}

function resizePic(picID, mainImgID, maxH, maxW){
	var pic = document.getElementById(picID);	
	var mainImg = document.getElementById(mainImgID);
	mainImg.style.display = 'inline';
	resizeToFit = true;
	if(resizeToFit){
		if(pic.height<pic.width){ //landscape
		//	alert("landscape");
		//	alert(pic.height+"/("+pic.width+"/"+maxW+")="+pic.height/(pic.width/maxW));
			newHeight = pic.height/(pic.width/maxW);
			newWidth= maxW;
			if(newHeight>maxH){// new height might be too big even though it has been rescaled. Therefore must rescale as though portrait
				newWidth = pic.width/(pic.height/maxH);
				newHeight = maxH;
			}
			//padding is required to vertically align portraits
			var padding = (maxH-newHeight)/2;
		}
		else{ //portrait OR square
			//alert("portrait");
			//alert(pic.width+"/("+pic.height+"/"+maxH+")="+pic.width/(pic.height/maxH))
			newWidth = pic.width/(pic.height/maxH);
			newHeight = maxH;
			//remove any padding
			var padding = 0;
		}
		//alert("newWidth="+newWidth+" newHeight="+newHeight);
		mainImg.width = newWidth;
		mainImg.height = newHeight;	
		mainImg.style.marginTop = padding+'px';
		mainImg.style.marginBottom = padding+'px';
	}
	mainImg.style.visibility = 'visible';
}

function resizeAlbumThbNails(id){
	wrapper = document.getElementById(id);
	imgs = wrapper.getElementsByTagName('img');
	for(i=0;i<imgs.length;i++){
		resizePic(imgs[i].id, imgs[i].id, '150', '180');
	}
}

function updateCost(){
	quantity = document.getElementById('quantity').value;
	priID = document.getElementById('price').value;
	price = prices[priID];
	mount = document.getElementById('mount').value;
	if(mount=="yes"){
		mountCost = quantity*1 //mount cost is £1. change value if need be
	}
	else{
		mountCost = 0
	}
	totalCost = ((quantity*price)+mountCost).toFixed(2)
	document.getElementById('costTxt').innerHTML = totalCost
}