images = '';
activeId = '';
objId = '';

function gallery(obj) {
	numId = parseInt(obj.id.replace('l',''));
	activeId = numId;
	galId = 'lightbox'+numId;
	thumbIdStr = 'l'+numId+'thumb';
	thumbId = parseInt(obj.id.replace(thumbIdStr,''));
	eval('images = lightbox'+numId);
//	alert(images['width'][0]);
//	document.getElementById('oralrow'+activeId).style.visibility = 'hidden';
//	alert(obj.id);
	showImage(obj, images['width'][thumbId], images['height'][thumbId]);
	return false;
//	showImage(obj, images['width'][0], images['height'][0]);
}


function clearSlide() {
	document.getElementById('slideshade').style.display = 'none';
	document.getElementById('slide').style.display = 'none';
	document.getElementById('close').style.display = 'none';
	document.getElementById('arrownext').style.display = 'none';
	document.getElementById('arrowprev').style.display = 'none';
//	document.getElementById('slidecaption').style.display = 'none';
//	document.getElementById('oralrow'+activeId).style.visibility = 'visible';
	images = '';
}

function showImage(obj, w, h) {
	if (document.all && !document.documentElement) {
		wi = parseInt(document.body.clientHeight);
		ww = parseInt(document.body.clientWidth);
	}
	else if (document.documentElement && document.all) {
		wi = parseInt(document.documentElement.clientHeight);
		ww = parseInt(document.documentElement.clientWidth);
	}
	else {
		ww = window.innerWidth;
		wi = window.innerHeight;
	}
	ypos = (Math.round(wi / 2) - Math.round(h / 2)) -20;
	xpos = (Math.round(ww / 2) - Math.round(w / 2)) -20;
	document.getElementById('slideshade').style.display = 'block';
	if (document.getElementById('slide').style.display == 'block') {
		document.getElementById('slide').style.background = '#fff';
		closePosX = parseInt(document.getElementById('close').style.left);
		closePosY = parseInt(document.getElementById('close').style.top);
		aPrevPos = parseInt(document.getElementById('arrowprev').style.marginTop);
		aNextPos = parseInt(document.getElementById('arrownext').style.marginTop);
		slideW = parseInt(document.getElementById('slide').style.width);
		slideH = parseInt(document.getElementById('slide').style.height);
		slideX = parseInt(document.getElementById('slide').style.left);
		slideY = parseInt(document.getElementById('slide').style.top);
//		captionW = slideW;
//		captionX = slideX;
//		captionY = slideY + slideH;
		
		closePosDstX = (xpos - 15);
		closePosDstY = ((ypos -48) - 15);
		aPrevDst = h+10;
		aNextDst = h+10;
		slideDstW = w;
		slideDstH = h + 24;
		slideDstX = xpos;
		slideDstY = ypos - 50;
//		captionDstW = w;
//		captionDstX = xpos + 21;
//		captionDstY = ypos + slideDstH - 50;
		
		closeXT = new Tween(document.getElementById('close').style,'left',Tween.strongEaseOut,closePosX,closePosDstX,1,'px');
		closeYT = new Tween(document.getElementById('close').style,'top',Tween.strongEaseOut,closePosY,closePosDstY,1,'px');
		aPrevT = new Tween(document.getElementById('arrowprev').style,'marginTop',Tween.strongEaseOut,aPrevPos,aPrevDst,1,'px');
		aNextT = new Tween(document.getElementById('arrownext').style,'marginTop',Tween.strongEaseOut,aNextPos,aNextDst,1,'px');
		slideWT = new Tween(document.getElementById('slide').style,'width',Tween.strongEaseOut,slideW,slideDstW,1,'px');
		slideHT = new Tween(document.getElementById('slide').style,'height',Tween.strongEaseOut,slideH,slideDstH,1,'px');
		slideXT = new Tween(document.getElementById('slide').style,'left',Tween.strongEaseOut,slideX,slideDstX,1,'px');
		slideYT = new Tween(document.getElementById('slide').style,'top',Tween.strongEaseOut,slideY,slideDstY,1,'px');
//		captionWT = new Tween(document.getElementById('slidecaption').style,'width',Tween.strongEaseOut,captionW,captionDstW,1,'px');
//		captionXT = new Tween(document.getElementById('slidecaption').style,'left',Tween.strongEaseOut,captionX,captionDstX,1,'px');
//		captionYT = new Tween(document.getElementById('slidecaption').style,'top',Tween.strongEaseOut,captionY,captionDstY,1,'px');
		
		closeXT.start();
		closeYT.start();
		aPrevT.start();
		aNextT.start();
		slideWT.start();
		slideHT.start();
		slideXT.start();
		slideYT.start();
//		captionWT.start();
//		captionXT.start();
//		captionYT.start();
		
		slideYT.onMotionFinished = function() {
			document.getElementById('slide').style.background = '#fff url('+obj.href+') no-repeat 20px 20px';
		}
		
	}
	else {
		document.getElementById('close').style.left = (xpos - 15) +'px';
		document.getElementById('close').style.top = ((ypos -48) - 15) +'px';
		document.getElementById('close').style.display = 'block';
//		document.getElementById('arrowprev').style.height = h +'px';
//		document.getElementById('arrownext').style.height = h +'px';
		document.getElementById('arrowprev').style.marginTop = (h +10) +'px';
		document.getElementById('arrownext').style.marginTop = (h +10) +'px';
		document.getElementById('slide').style.width = w + 'px';
		document.getElementById('slide').style.height = (h+24) + 'px';
		document.getElementById('slide').style.left = xpos +'px';
		document.getElementById('slide').style.top = (ypos - 50) +'px';
		document.getElementById('slide').style.background = '#fff url('+obj.href+') no-repeat 20px 20px';
		document.getElementById('slideshade').style.display = 'block';
//		document.getElementById('slidecaption').style.left = (xpos+21) + 'px';
//		document.getElementById('slidecaption').style.top = (ypos - 50) + (h +24) + 'px';
//		document.getElementById('slidecaption').style.width = w + 'px';
//		document.getElementById('slidecaption').style.display = 'block';
		document.getElementById('slide').style.display = 'block';
	}
	if (typeof(images) == 'object') {
		objId = parseInt(obj.id.replace('l'+activeId,'').replace('thumb',''));
//		document.getElementById('slidecaption').innerHTML = images['caption'][objId];
//		alert('objId = '+objId);
//		alert("images['img'].length = "+ images['img'].length);

	if ((objId -1) < 0) {
			document.getElementById('arrowprev').style.display = 'none';
		}
		else {
			document.getElementById('arrowprev').style.display = 'block';
		}
		if ((objId +1) >= images['img'].length) {
			document.getElementById('arrownext').style.display = 'none';
		}
		else {
			document.getElementById('arrownext').style.display = 'block';
		}
	}
	return false;
}

function imageNext(l) {
	nextImg = objId + 1;
	if (images['img'][nextImg]) {
//		alert('l'+activeId+'thumb'+nextImg);
		theObj = document.getElementById('l'+activeId+'thumb'+nextImg);
		w = images['width'][nextImg];
		h = images['height'][nextImg];
		showImage(theObj, w, h);
	}
}

function imagePrev(l) {
	prevImg = objId -1;
//	alert(prevImg);
	if (prevImg >= 0) {
		theObj = document.getElementById('l'+activeId+'thumb'+prevImg);
		w = images['width'][prevImg];
		h = images['height'][prevImg];
		showImage(theObj, w, h);
	}
}

if (document.all) {
	window.attachEvent("onload", function() { initSlide(); });
}
else {
	addEventListener("load", function() { initSlide(); }, false);
}


function initSlide() {
	if (document.all) {
		document.getElementById('content').style.backgroundImage = 'none';
		document.getElementById('content').style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/tranny.png,sizingMethod='scale');";

	}
	db = document.getElementsByTagName('body')[0];
	
	slideshade = document.createElement('div');
	slideshade.setAttribute('id','slideshade');
	slideshade.onclick = function() {
		clearSlide();
	}
	
	slide = document.createElement('div');
	slide.setAttribute('id','slide');
	
//	caption = document.createElement('div');
//	caption.setAttribute('id','slidecaption');


	slide.onmouseover = function() {
		if (document.all) {
			document.getElementById('arrowprev').filters.alpha.opacity = 50;
			document.getElementById('arrownext').filters.alpha.opacity = 50;
		}
		else {
			document.getElementById('arrowprev').style.opacity = .5;
			document.getElementById('arrownext').style.opacity = .5;
		}
	}
	
	slide.onmouseout = function() {
		if (document.all) {
			document.getElementById('arrowprev').filters.alpha.opacity = 50;
			document.getElementById('arrownext').filters.alpha.opacity = 50;
		}
		else {
			document.getElementById('arrowprev').style.opacity = .5;
			document.getElementById('arrownext').style.opacity = .5;
		}
	}

	
	arrowprev = document.createElement('div');
	arrowprev.setAttribute('id','arrowprev');
	
	arrownext = document.createElement('div');
	arrownext.setAttribute('id','arrownext');
	
	closer = document.createElement('div');
	closer.setAttribute('id','close');
	closeicon = document.createElement('img');
	closeicon.setAttribute('src','images/closeicon.png');
	closeicon.setAttribute('width',30);
	closeicon.setAttribute('height',30);
	closeicon.setAttribute('alt','close');
	closeicon.onclick = function() { clearSlide(); }
	
	closer.appendChild(closeicon);
	
	slide.appendChild(arrowprev);
	slide.appendChild(arrownext);
	
	db.appendChild(slideshade);
	db.appendChild(slide);
//	db.appendChild(caption);
	db.appendChild(closer);
	
	if (document.getElementById('arrowprev')) {
		document.getElementById('arrowprev').style.display = 'block';
		document.getElementById('arrowprev').onmouseover = function() {
			if (document.all) {
				document.getElementById('arrowprev').filters.alpha.opacity = 100;
			}
			else{ 
				document.getElementById('arrowprev').style.opacity = 1;
			}
		}
		document.getElementById('arrowprev').onmouseout = function() {
			if (document.all) {
				document.getElementById('arrowprev').filters.alpha.opacity = 50;
			}
			else{ 
				document.getElementById('arrowprev').style.opacity = .5;
			}
		}
		document.getElementById('arrowprev').onclick = function() {
			imagePrev();
		}
	}
	if (document.getElementById('arrownext')) {
		document.getElementById('arrownext').style.display = 'block';
		document.getElementById('arrownext').onmouseover = function() {
			if (document.all) {
				document.getElementById('arrownext').filters.alpha.opacity = 100;
			}
			else{ 
				document.getElementById('arrownext').style.opacity = 1;
			}
		}
		document.getElementById('arrownext').onmouseout = function() {
			if (document.all) {
				document.getElementById('arrownext').filters.alpha.opacity = 50;
			}
			else{ 
				document.getElementById('arrownext').style.opacity = .5;
			}
		}
		document.getElementById('arrownext').onclick = function() {
			imageNext();
		}
	}
}

function openPopImgs(obj) {
	popWindow = window.open(obj.href, 'artwindow', 'width=550, height=510, resizable=no, status=no, left=100, top=100, menubar=no, location=no, scrollbars=no');
	return false;
}

function validateForm(formObj) { // Hello, I'll be your form validating script today.
var formElements = formObj.elements;

// Now I'll set a bunch of boolean variables that will help us validate your form.
var canSubmit = true; // This will ultimately decide if the form gets submitted or not, and is dependant on the other vars to do so.
var emailValid = true; // This checks if the user's email address is valid (string@string.string).
var fieldsComplete = true; // This checks that all the required text fields are not blank.
var anyChecked = true; // This makes sure all required checkbox/radio box arrays are valid.

// These arrays are used to validate the check/radio boxes.
var rcBoxes = new Array();
rcBoxes[0] = new Array();
rcBoxes[1] = new Array();
var rcArrays = new Array();
rcArrays[0] = new Array;
rcArrays[1] = new Array;

// Getting down to business now, we'll loop through all the elements of your form
for (i=0;i<formElements.length;i++) {
// We'll start with the text fields - making sure all the required ones are not blank.
	if (formElements[i].type == 'text' ||  formElements[i].type == 'textarea') {
		if (formElements[i].name.substring((formElements[i].name.length -4),(formElements[i].name.length)) == '_req' && (formElements[i].value == '' || formElements[i].value == 'undefined')) {
		formElements[i].className += ' highlight'; // Highlights a required field left blank.
		fieldsComplete = false;
			}
// Now we'll check if the user has provided you with a valid email address...
		if (formElements[i].name == 'email_req') {
			if (formElements[i].value.search('.+@.+\\.[A-Za-z]+') < 0) {
				formElements[i].className += ' highlight'; // Highlights the email field if blank or invalid.
				emailValid = false;
				}
			else { // Removes the highlight if email is valid.
				formElements[i].className = formElements[i].className.replace(' highlight','');
				}
			}
		else if (formElements[i].name.substring((formElements[i].name.length -4),(formElements[i].name.length)) == '_req' && formElements[i].value != '') {
			// Removes the highlight if fields are properly filled.
			formElements[i].className = formElements[i].className.replace(' highlight','');
			}
		}

// Finally, we go through the checkboxes and radio boxes, making sure each array of required check/radio boxes has at least one element checked.
	else if (formElements[i].type == 'radio' || formElements[i].type == 'checkbox') {
		if (formElements[i].name.substring((formElements[i].name.length -4),(formElements[i].name.length)) == '_req') {
			// Adds all checkboxes to an array which we'll be looping through later.
			rcBoxes[0].push(formElements[i].name);
			rcBoxes[1].push(formElements[i].checked);
			}
		}
	}

// After loading all the check/radio boxes into a separate array, we go through them again.
if (rcBoxes[0].length > 0) {
	for (i=0;i<rcBoxes[0].length;i++) {
		// The first thing we'll do is separate them into little arrays where they have a common name attribute.
		targetCheck = formObj[rcBoxes[0][i]];
		i += targetCheck.length;
		// Then we'll loop through that array.
		for (j=0;j<targetCheck.length;j++) {
			if (targetCheck[j].checked) {
				// If we find a checked box within a required array, add the element's name to rcArrays[0] and add true to rcArrays[1].
				rcArrays[1].push(true);
				rcArrays[0].push(targetCheck[j].name);
				// That's all we need, so we can break out of the loop.
				break;
				}
			else if (j == (targetCheck.length -1)) {
				// If nothing is checked, we only add the name of the element to rcArrays[0].
				rcArrays[0].push(targetCheck[j].name);
				}
			}
		}
	// So, with all the info we gathered up there, we'll check the length of rcArrays[0] against rcArrays[1].
	// If all the required check/radio arrays have at least one box checked, they're valid and the lengths should match.
	if (rcArrays[0].length != rcArrays[1].length) {
		// If the lengths of rcArrays[0] and rcArrays[1] don't match, it means something that should've been checked was left unchecked.
		anyChecked = false;
		}
	}

// Remember our boolean vars? This is where we check them and give the user an appropriate response.
if (!fieldsComplete || !anyChecked) {
	// This message will display if a required textfield was left blank or a checkbox was left un-checked.
	alert('Please fill out all required fields before submitting this form!');
	canSubmit = false; // Don't let the form submit.
	}
else if (!emailValid) {
	// This message will display if the user didn't enter a valid email address.
	alert('Please enter a valid email address in the highlighted field!');
	canSubmit = false; // Don't let the form submit.
	}
if (fieldsComplete && emailValid && anyChecked) {
	// If everything has been properly filled and a valid email address has been entered, the form can submit!
	canSubmit = true;
	}
return canSubmit;
}
//gallery
var beforeafter = new PhotoViewer();
beforeafter.add('/images/beforeafter/first_web.jpg',"Before");
beforeafter.add('/images/beforeafter/second_web.jpg',"During");
beforeafter.add('/images/beforeafter/third_web.jpg',"After");
beforeafter.enableAutoPlay();
beforeafter.enableLoop();
beforeafter.disablePhotoLink();
beforeafter.disableEmailLink();