var XHTMLNS = "http://www.w3.org/1999/xhtml";

var ie = false;

function createElement(element) {
	if(typeof document.createElementNS != 'undefined') {
		return document.createElementNS(XHTMLNS, element)
	}
	else if (typeof document.createElement != 'undefined') {
		return document.createElement(element)
	}
	else {
		return false;
	}
}

function addLoadEvent(func) {
	var oldonload = window.onload
	
	if(typeof window.onload != 'function') {
		window.onload = func
	}
	else {
		if(typeof func == 'function') {
			window.onload = function() {
				func()
				oldonload()
			}
		}
		else {
			window.onload = function() {
				eval(func)
				oldonload()
			}
		}
	}
}

function cancelDefault(e) {
	if(e.cancelable) {
		e.preventDefault()
	}
	else if(document.all) {
		event.returnValue = false
	}
	else {
		alert('not cancelable')
	}
}

function getTarget(e) {
	if(window.event && window.event.srcElement) {
		r = window.event.srcElement
	}
	else if (e && e.target) {
		r = e.target
	}

	return r
}

function addEvent(obj,evType,fn) {
	if (obj.addEventListener) {
		obj.addEventListener(evType,fn,false)
		return true
	}
	else if (obj.attachEvent) {
		var r = obj.attachEvent('on'+evType, fn)
		
		ie = true;
		
		if(!r) {
			alert('cannot add event!');
		}
		
		return r
	}
	else {
		alert('cannot add event!')
		return false
	}
}

function removeEvent(obj,evType,fn) {
	if (obj.removeEventListener) {
		obj.removeEventListener(evType,fn,false)
		return true
	}
	else if (obj.detachEvent) {
		var r = obj.detachEvent('on'+evType, fn)
		return r
	}
	else {
		return false
	}
}

document.getElementsByClassName = function(class_name) {
	var all_obj, ret_obj = new Array(), j = 0, strict = 0, a = 1

	if (document.getElementsByClassName.arguments.length > 1)
		strict = ( document.getElementsByClassName.arguments[1] ? 1 : 0 )

	if (document.all) {
		all_obj = document.all
	}
	else if (document.getElementsByTagName && !document.all) {
		all_obj = document.getElementsByTagName("*")
	}

	for (i = 0; i < all_obj.length; i++) {
		if (
			(' ' + all_obj[i].className + ' ').toLowerCase().match(
				new RegExp (( strict ? '^ ' + class_name + ' $' : '^.* ' + class_name + ' .*$').toLowerCase(),'g' )
			)
		 ) {
			ret_obj[j++] = all_obj[i]
		}
	}

	return ret_obj
}

function getParent(el, pTagName) {
	if(el == null) {
        	return null;
	}
	else if (el.nodeType == 1 && elementCompare(el.tagName,pTagName)) {
		return el;
	}
	else {
		return getParent(el.parentNode, pTagName);
	}
}

function elementCompare(a,b) {
	a = a.toLowerCase() // Gecko bug, supposed to be uppercase
	b = b.toLowerCase()

	if((a == b) || (a == "html:" + b)) { // opera has html: in front of elements
		return true
	}
	else {
		return false
	}
}

var position = 1;

var itemCount = 21;

var hold = false;

function previousPhotoSlide(e) {
	cancelDefault(e);
	
	if(hold) {
		return;
	}
	
	if(position > 1 && itemCount > 4) {
		position--;
		continueSlide();
		
		if(position > 1 && itemCount > 4) {
		}
		else {
			document.getElementById('photoSlidePrevious').style.background = 'transparent';
			// hide previous
		}
		
		if((itemCount - position + 1) > 4) {
			document.getElementById('photoSlideNext').style.background = 'url(http://huntervetscycling.ocoth.net/media/images/photoslide/right.gif) center center no-repeat';
			// show next
		}
	}
}
function nextPhotoSlide(e) {
	cancelDefault(e);
	
	if(hold) {
		return;
	}
	
	if(itemCount > 4 && (itemCount - position + 1) > 4) {
		position++;
		continueSlide();
		
		if((itemCount - position + 1) == 4) {
			// hide next
			document.getElementById('photoSlideNext').style.background = 'transparent';
		}
		
		if(position > 1 && itemCount > 4) {
			// show previous
			document.getElementById('photoSlidePrevious').style.background = 'url(http://huntervetscycling.ocoth.net/media/images/photoslide/left.gif) center center no-repeat';
		}
	}
}

var slideInterval = null;

function continueSlide() {
	destination = calculateEndPoint();
	
	current = parseInt(document.getElementById('photoSlide').getElementsByTagName('ul')[0].style.marginLeft);
	
	//alert('c' + current + ', d' + destination);
	
	if(slideInterval) {
		if(destination == current) {
			clearInterval(slideInterval);
			
			slideInterval = null;
			//alert('stop!');
			hold = false;
		}
		else {
			difference = current - destination;
			
			otherDifference = (-5 + -121 * (position - 2)) - current;
			
			if(difference >= -2 && difference <= 2) {
				changeRate = 1
			}
			else if(difference >= -8 && difference <= 8) {
				changeRate = 2
			}
			else if(difference >= -20 && difference <= 20) {
				changeRate = 3
			}
			else {
				changeRate = 4
			}
			
			if(otherDifference >= -2 && otherDifference <= 2) {
				changeRate = 1
			}
			else if(otherDifference >= -8 && otherDifference <= 8) {
				changeRate = 2
			}
			else if(otherDifference >= -20 && otherDifference <= 20) {
				changeRate = 3
			}
			
			if(current > destination) {
				document.getElementById('photoSlide').getElementsByTagName('ul')[0].style.marginLeft = (current - changeRate) + 'px';
			}
			else {
				document.getElementById('photoSlide').getElementsByTagName('ul')[0].style.marginLeft = (current + changeRate) + 'px';
			}
		}
	}
	else {
		hold = true;
		slideInterval = window.setInterval("continueSlide()", 25);
	}
}

function showPhotograph(e) {
	triggerer = getTarget(e);
	
	locationToOpen = triggerer.src.replace(/width=105&height=70/, "wrap=true");
	
	widthOfOpen = 680;
	heightOfOpen =  680;
	
	topDimension = ((window.screen.height - heightOfOpen) / 2);
	
	if(topDimension < 0) {
		topDimension = 0;
	}
	
	leftDimension = ((window.screen.width - widthOfOpen) / 2);
	
	if(leftDimension < 0) {
		leftDimension = 0;
	}
	
	window.open(locationToOpen, 'viewPhotograph', "top=" + topDimension + ",left=" + leftDimension + ",width=" + widthOfOpen + ",height=" + heightOfOpen + ",menubar=no,location=no,resizable=yes,scrollbars=no,status=yes");
}

function createPhotoSlide() {
	if(document.getElementById('photoSlide')) {
		previousLink = createElement('a');
		previousLink.setAttribute('href', '#');
		previousLink.setAttribute('id','photoSlidePrevious');
		addEvent(previousLink, 'click', previousPhotoSlide);
		
		document.getElementById('photoSlide').appendChild(previousLink);
		
		viewPort = createElement('div');
		viewPort.className = 'viewPort';
		
		album = createElement('ul');
		album.className = 'album';
		
				item19 = createElement('li');
		image19 = createElement('img');
			image19.setAttribute('width', '105');
			image19.setAttribute('height', '70');
			image19.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/19?width=105&height=70');
			image19.setAttribute('alt', '');
		item19.appendChild(image19);
		addEvent(image19, 'click', showPhotograph);
		album.appendChild(item19);
				item24 = createElement('li');
		image24 = createElement('img');
			image24.setAttribute('width', '105');
			image24.setAttribute('height', '70');
			image24.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/24?width=105&height=70');
			image24.setAttribute('alt', 'Sunday Handicap');
		item24.appendChild(image24);
		addEvent(image24, 'click', showPhotograph);
		album.appendChild(item24);
				item25 = createElement('li');
		image25 = createElement('img');
			image25.setAttribute('width', '105');
			image25.setAttribute('height', '70');
			image25.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/25?width=105&height=70');
			image25.setAttribute('alt', 'Back Markers');
		item25.appendChild(image25);
		addEvent(image25, 'click', showPhotograph);
		album.appendChild(item25);
				item26 = createElement('li');
		image26 = createElement('img');
			image26.setAttribute('width', '105');
			image26.setAttribute('height', '70');
			image26.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/26?width=105&height=70');
			image26.setAttribute('alt', 'At the roundabout');
		item26.appendChild(image26);
		addEvent(image26, 'click', showPhotograph);
		album.appendChild(item26);
				item27 = createElement('li');
		image27 = createElement('img');
			image27.setAttribute('width', '105');
			image27.setAttribute('height', '70');
			image27.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/27?width=105&height=70');
			image27.setAttribute('alt', '');
		item27.appendChild(image27);
		addEvent(image27, 'click', showPhotograph);
		album.appendChild(item27);
				item29 = createElement('li');
		image29 = createElement('img');
			image29.setAttribute('width', '105');
			image29.setAttribute('height', '70');
			image29.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/29?width=105&height=70');
			image29.setAttribute('alt', '');
		item29.appendChild(image29);
		addEvent(image29, 'click', showPhotograph);
		album.appendChild(item29);
				item30 = createElement('li');
		image30 = createElement('img');
			image30.setAttribute('width', '105');
			image30.setAttribute('height', '70');
			image30.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/30?width=105&height=70');
			image30.setAttribute('alt', '');
		item30.appendChild(image30);
		addEvent(image30, 'click', showPhotograph);
		album.appendChild(item30);
				item34 = createElement('li');
		image34 = createElement('img');
			image34.setAttribute('width', '105');
			image34.setAttribute('height', '70');
			image34.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/34?width=105&height=70');
			image34.setAttribute('alt', 'A cold 8:00am start to the Wellness Centre Women\'s Handicap');
		item34.appendChild(image34);
		addEvent(image34, 'click', showPhotograph);
		album.appendChild(item34);
				item35 = createElement('li');
		image35 = createElement('img');
			image35.setAttribute('width', '105');
			image35.setAttribute('height', '70');
			image35.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/35?width=105&height=70');
			image35.setAttribute('alt', 'Wellness Centre Women\'s Handicap - Racing');
		item35.appendChild(image35);
		addEvent(image35, 'click', showPhotograph);
		album.appendChild(item35);
				item36 = createElement('li');
		image36 = createElement('img');
			image36.setAttribute('width', '105');
			image36.setAttribute('height', '70');
			image36.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/36?width=105&height=70');
			image36.setAttribute('alt', 'Wellness Centre Women\'s Handicap - After the Race');
		item36.appendChild(image36);
		addEvent(image36, 'click', showPhotograph);
		album.appendChild(item36);
				item37 = createElement('li');
		image37 = createElement('img');
			image37.setAttribute('width', '105');
			image37.setAttribute('height', '70');
			image37.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/37?width=105&height=70');
			image37.setAttribute('alt', 'Wellness Centre Women\'s Handicap - Our Sponsors!');
		item37.appendChild(image37);
		addEvent(image37, 'click', showPhotograph);
		album.appendChild(item37);
				item38 = createElement('li');
		image38 = createElement('img');
			image38.setAttribute('width', '105');
			image38.setAttribute('height', '70');
			image38.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/38?width=105&height=70');
			image38.setAttribute('alt', 'Some well earned relief, courtesy of the Wellness Centre');
		item38.appendChild(image38);
		addEvent(image38, 'click', showPhotograph);
		album.appendChild(item38);
				item40 = createElement('li');
		image40 = createElement('img');
			image40.setAttribute('width', '105');
			image40.setAttribute('height', '70');
			image40.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/40?width=105&height=70');
			image40.setAttribute('alt', '');
		item40.appendChild(image40);
		addEvent(image40, 'click', showPhotograph);
		album.appendChild(item40);
				item41 = createElement('li');
		image41 = createElement('img');
			image41.setAttribute('width', '105');
			image41.setAttribute('height', '70');
			image41.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/41?width=105&height=70');
			image41.setAttribute('alt', '');
		item41.appendChild(image41);
		addEvent(image41, 'click', showPhotograph);
		album.appendChild(item41);
				item42 = createElement('li');
		image42 = createElement('img');
			image42.setAttribute('width', '105');
			image42.setAttribute('height', '70');
			image42.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/42?width=105&height=70');
			image42.setAttribute('alt', '');
		item42.appendChild(image42);
		addEvent(image42, 'click', showPhotograph);
		album.appendChild(item42);
				item43 = createElement('li');
		image43 = createElement('img');
			image43.setAttribute('width', '105');
			image43.setAttribute('height', '70');
			image43.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/43?width=105&height=70');
			image43.setAttribute('alt', '');
		item43.appendChild(image43);
		addEvent(image43, 'click', showPhotograph);
		album.appendChild(item43);
				item44 = createElement('li');
		image44 = createElement('img');
			image44.setAttribute('width', '105');
			image44.setAttribute('height', '70');
			image44.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/44?width=105&height=70');
			image44.setAttribute('alt', '');
		item44.appendChild(image44);
		addEvent(image44, 'click', showPhotograph);
		album.appendChild(item44);
				item45 = createElement('li');
		image45 = createElement('img');
			image45.setAttribute('width', '105');
			image45.setAttribute('height', '70');
			image45.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/45?width=105&height=70');
			image45.setAttribute('alt', '');
		item45.appendChild(image45);
		addEvent(image45, 'click', showPhotograph);
		album.appendChild(item45);
				item46 = createElement('li');
		image46 = createElement('img');
			image46.setAttribute('width', '105');
			image46.setAttribute('height', '70');
			image46.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/46?width=105&height=70');
			image46.setAttribute('alt', '');
		item46.appendChild(image46);
		addEvent(image46, 'click', showPhotograph);
		album.appendChild(item46);
				item47 = createElement('li');
		image47 = createElement('img');
			image47.setAttribute('width', '105');
			image47.setAttribute('height', '70');
			image47.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/47?width=105&height=70');
			image47.setAttribute('alt', '');
		item47.appendChild(image47);
		addEvent(image47, 'click', showPhotograph);
		album.appendChild(item47);
				item48 = createElement('li');
		image48 = createElement('img');
			image48.setAttribute('width', '105');
			image48.setAttribute('height', '70');
			image48.setAttribute('src', 'http://huntervetscycling.ocoth.net/media/photographs/48?width=105&height=70');
			image48.setAttribute('alt', '');
		item48.appendChild(image48);
		addEvent(image48, 'click', showPhotograph);
		album.appendChild(item48);
				
		viewPort.appendChild(album);
		
		document.getElementById('photoSlide').appendChild(viewPort);
		
		nextLink = createElement('a');
		nextLink.setAttribute('href', '#');
		nextLink.setAttribute('id','photoSlideNext');
		addEvent(nextLink, 'click', nextPhotoSlide);
		
		document.getElementById('photoSlide').appendChild(nextLink);
		
		document.getElementById('photoSlide').getElementsByTagName('ul')[0].style.marginLeft = '-5px';
		
		if(itemCount <= 4) {
			// hide next
			document.getElementById('photoSlideNext').style.background = 'transparent';
		}
	}
}

function calculateEndPoint() {
	return -5 + -121 * (position - 1);
}

addLoadEvent(createPhotoSlide);

//ON LOAD
	//get total item count


// scroll to: margin-left = -5 - 121(position - 1)

//ON SCROLLTO
// if initial, get position and check position and calculate scroll to point, start scrolling, trigger interval
// else check if scroll needed, scroll, else, cancel interval
// if last item, remove right arrow
// if first item, remove left arrow


/*
	CREATE:

	<a href="#" class="previous"></a>
	<div class="viewport">
		<ul class="album">
			<li><img src="" width="" height="" alt="" /></li>
			<li>Test 2</li>
			<li>Test 3</li>
			<li>Test 4</li>
			<li>Test 5</li>
			<li>Test 6</li>
			<li>Test 7</li>
			<li>Test 8</li>
			<li>Test 9</li>
			<li>Test 10</li>
		</ul>
	</div>
	<a href="#" class="next"></a>
*/