// Global Variables
//var State, City;
var stateArray, cityArray, selectedState, selectedCity;
var browser = navigator.userAgent.toLowerCase();
var eTarget, eTargetParent, eRelatedTarget;





// Constructors

function address (street, zip) {
	this.length = 3;
	this.street = street;
	this.zip = zip;
}

function masterCity (city, address) {
	this.length = 3;
	this.city = city;
	this.address = address;
}

function navItem (str, url) {
	this.length = 3;
	this.str = str;
	this.url = url;
}





// Arrays

var supportedBrowsers = new Array ('msie', 'safari', 'firefox', 'opera');





// Runtime

for (var x = 0; x < supportedBrowsers.length; x++) {

	var platform = window.navigator.platform.toLowerCase();
	var isMac = new RegExp('mac');
	isMac = isMac.exec(platform);
	
	//alert(isMac);
	
	
	
	var eObj = new RegExp(supportedBrowsers[x]);
	var result = browser.search(eObj);
	
	if (result > -1) {
		
		if (supportedBrowsers[x] == 'msie') {

			var ieVersion = 0;
			
			
			/*  
			
			NOTE : we have not tested for IE 5.5. It may need it's own style sheets, but it is
			likely that the beginning of the IF statement can be modified to:
			
			if ((browser.search('msie 5.5') > -1) || (browser.search('msie 6') > -1)) {
			
				ieVersion = '6';
				
			} else ... ... ... 
			
			*/
			
			if (browser.search('msie 5.5') > -1) {
				
				ieVersion = '5_5';
				
			} else if (browser.search('msie 6') > -1) {
				
				ieVersion = '6';
									  
			} else if (browser.search('msie 7') > -1) {
				
				ieVersion = '7';
			}
			
			if (ieVersion > 0) {
				
				document.write('<link href="/styles/ie' + ieVersion + '_styles.css" rel="stylesheet" media="all">');
				
				/*if (ieVersion == 6) {
					
					document.write('<link href="css/entry/ie6_print_styles.css" rel="stylesheet" media="print" />');
					
					if (vNum == 0) {
						document.write('<link href="css/entry/ie6_home_styles.css" rel="stylesheet" media="all" />');
						document.write('<link href="css/entry/ie6_print_home_styles.css" rel="stylesheet" media="print" />');
					}
				}*/
			}
		}
		
		if (supportedBrowsers[x] == 'firefox') {
		
			//alert(browser);
		
			var pattern2 = new RegExp('firefox/3.0');
			var result2 = pattern2.exec(browser);
			
			if (result2) {
				document.write('<link href="/styles/firefox3.css" rel="stylesheet" media="all">');
				document.write('<link href="/styles/firefox3pc.css" rel="stylesheet" media="all">');
			}
			
			pattern2 = new RegExp ('firefox/2');
			result2 = pattern2.exec(browser);
			
			if (result2) {
				document.write('<link href="/styles/firefox2.css" rel="stylesheet" media="all">');
			}
		
			if (platform == 'win32') {
				document.write('<link href="/styles/firefox_pc.css" rel="stylesheet" media="all">');
			}
		
		
		}
		
		browser = supportedBrowsers[x];
		
		if (browser == 'opera' && platform == 'win32') {
			document.write('<link href="/styles/opera_pc.css" rel="stylesheet" media="all">');
		
		}
		
		//if (isMac) {
			//document.write('<link href="/styles/macPrint.css" rel="stylesheet" media="print">');
		//}
	} 
	
	document.write('<link href="/styles/seoFriendly.css" rel="stylesheet" media="all">');
	
}





// Functions

function init() {

	if (document.getElementById('mainNav')) {
		addListener(document.getElementById('mainNav'), 'mouseover', showMenu, false);
		addListener(document.getElementById('mainNav'), 'mouseout', removeMenu, false);
	}
	
	if (document.getElementById('productAltViews')) {
		addListener(document.getElementById('productAltViews'), 'click', changeMainImage, false);
	}
	
	if (document.getElementById('findStoreButton')) {
		addListener(document.getElementById('findStoreButton'), 'click', findStore, false);
	}
	
	if (document.getElementById('swatchColors')) {
		addListener(document.getElementById('swatchColors'), 'click', showSKUinfo, false);
	}
	
	if (document.getElementById('arrow_left')) {
		addListener(document.getElementById('arrow_left'), 'mousedown', initializeSlider, false);
		addListener(document.getElementById('arrow_left'), 'mouseover', changeArrow, false);
		addListener(document.getElementById('arrow_left'), 'mouseout', changeArrow, false);
	}
	
	if (document.getElementById('arrow_right')) {
		addListener(document.getElementById('arrow_right'), 'mousedown', initializeSlider, false);
		addListener(document.getElementById('arrow_right'), 'mouseover', changeArrow, false);
		addListener(document.getElementById('arrow_right'), 'mouseout', changeArrow, false);

	}
}




function addListener(obj, triggerEvent, callFunction, capture) {
	obj.addEventListener ? obj.addEventListener(triggerEvent, callFunction, capture) : obj.attachEvent('on' + triggerEvent, callFunction);
}

function removeListener(obj, triggerEvent, callFunction, capture) {
	obj.removeEventListener ? obj.removeEventListener(triggerEvent, callFunction, capture) : obj.detachEvent('on' + triggerEvent, callFunction);
}

function setEventTargets(event) {
	event.target ? eTarget = event.target : eTarget = event.srcElement;
	eTargetParent = eTarget.parentNode;
	event.relatedTarget ? eRelatedTarget = event.relatedTarget : eRelatedTarget = event.toElement;
}

function showMenu(event) {

	var dropDown, isChild;
	setEventTargets(event);
	
	if (eTarget.nodeName == 'A') {
	
		/* This IF blanket removes the drop down for all of the top level LI  */
		
		if (document.getElementById('dropMenu')) {
		
			dropDown = document.getElementById('dropMenu');
			dropDownParent = dropDown.parentNode;
			isChild = findRelationship(eTarget, dropDownParent);
			
			if (!isChild && dropDownParent != eTargetParent) {
				dropDownParent.removeChild(dropDown);
			}
			
			
		}
		
		if (!isChild) {

			eTargetParent.hasAttribute ? eTargetParent.setAttribute('class', 'active') : eTargetParent.setAttribute('className', 'active');
		}
	
		if (window[eTarget.getAttribute('id')] && !document.getElementById('dropMenu')) {

			var tempArray = window[eTarget.getAttribute('id')];
		
			if (tempArray.length) {
			
				var dropDown = document.createElement('UL');
				dropDown.setAttribute('id', 'dropMenu');
				
				if (dropDown.hasAttribute) {
				
					var styleArg = 'left: ' + eTargetParent.offsetLeft + 'px;';
					
					if (eTarget.getAttribute('id') != 'nav_3') {
					
						styleArg += 'width: ' + eTargetParent.offsetWidth + 'px;';
					}
				
					dropDown.setAttribute('style', styleArg);
				
				} else {
				
					dropDown.style.left = eTargetParent.offsetLeft + 'px';
					
					
					if (eTarget.getAttribute('id') != 'nav_3') {
					
						dropDown.style.width = eTargetParent.offsetWidth + 'px';
						
					} else {
					
						
						if (browser == 'msie' && parseInt(ieVersion) < 7) {
							
						//alert(browser + ' - ' + ieVersion);
							dropDown.style.width = '110px';
						}
					}
				}
				
				writeUL(dropDown, tempArray);
				eTargetParent.appendChild(dropDown);
			}
		}
	}
}


function removeMenu (event) {

	var mainNav = document.getElementById('mainNav');
	
	function clearClass() {
	
		for (var x = 0, y = 1; x < mainNav.childNodes.length; x++, y++) {
		
			if (y == category) {
				mainNav.childNodes[x].hasAttribute ? mainNav.childNodes[x].setAttribute('class', 'selected') : mainNav.childNodes[x].setAttribute('className', 'selected');
			
			} else {
				mainNav.childNodes[x].hasAttribute ? mainNav.childNodes[x].removeAttribute('class') : mainNav.childNodes[x].removeAttribute('className');
			
			}
		}
	}
	
	setEventTargets(event);
	
	if (!document.getElementById('dropMenu')) {
		clearClass();
	}
	
	if (document.getElementById('dropMenu')) {
		event.relatedTarget ? eNextSource = event.relatedTarget : eNextSource = event.toElement;
		
		eDropDown = document.getElementById('dropMenu');
		eDropDownParent = eDropDown.parentNode;
		
		if (eNextSource != eDropDownParent) {
			
			var isChild = findRelationship(eNextSource, eDropDownParent)
			
			if (isChild == false) {
				eDropDownParent.removeChild(eDropDown);
				clearClass();
			}
		}
	}
}

function findRelationship(child, ancestor) {

	var isChild = false;
	
	var childList = ancestor.getElementsByTagName(child.nodeName);
	
	//alert(childList.length);
	
	if (childList.length > 0) {
		
		for (var x = 0; x < childList.length; x++) {
			
			if (childList[x] == child) {
				isChild = true;
				break;
			}
		}
	}
	
	return isChild;
	
}

function writeUL (eUL, array) {
	
	for (var x = 0; x < array.length; x++) {
		
		var newLI = document.createElement('LI');		
		var newA = document.createElement('A');

		newA.setAttribute('href', array[x].url);
		
		/*
		if (x == array.length - 1 && eUL.getAttribute('id') == 'dropDownMenu') {
			newA.setAttribute('style', 'border-bottom: none;');	
		}
		*/
		var newText = document.createTextNode(array[x].str);
	
		newA.appendChild(newText);
		newLI.appendChild(newA);
		eUL.appendChild(newLI);

	}
}

function showSKUinfo(event) {
	

	event.preventDefault ? event.preventDefault() : window.event.returnValue = false;
	
	setEventTargets(event);
	var str = eTarget.getAttribute('id').replace('sku', '');
	
	var classProperty;
	eTarget.hasAttribute ? classProperty = 'class' : classProperty = 'className';
	
	var ajaxResponse = makeRequest('/ajax/getSnumbersForSku_RO.php', '?sku=' + str);
		
	if (ajaxResponse.getElementsByTagName('status')[0].firstChild.nodeValue == 'ok') {
	
	
		// Get information
		
		var primarySwatchSnumber = ajaxResponse.getElementsByTagName('snumbers')[0].firstChild.nodeValue.split('|')[0];
		changeMainImage('', primarySwatchSnumber);
		
		var swatchNodeList = document.getElementById('swatchColors').getElementsByTagName('IMG');
		
		for (var x = 0; x < swatchNodeList.length; x++) {
			if (swatchNodeList[x] == eTarget) {
				eTarget.setAttribute(classProperty, 'active');
			
			} else {
				swatchNodeList[x].removeAttribute(classProperty);
			}
		
		}
		
		var onlineAvailability = ajaxResponse.getElementsByTagName('avail')[0].firstChild.nodeValue;
		var findStoreButton = document.getElementById('findStoreButton');
		var buttonParent = findStoreButton.parentNode;
		var onlineButton;
		
		
		// Add or remove Online Button
		
		if (onlineAvailability == 1) {
			
			if (!document.getElementById('buyOnline')) {
			
				onlineButton = document.createElement('A');
				onlineButton.setAttribute('id', 'buyOnline');
				buttonParent.appendChild(onlineButton);
				
				var eText = document.createTextNode('Buy online');
				onlineButton.appendChild(eText);
				
			} else {
				onlineButton = document.getElementById('buyOnline');
			
			}
			
			if (str == '814026' || str == '814028') {
				onlineButton.setAttribute('href', 'http://www.staples.com/M-by-Staples-Gold-Series-Writing-Pads/product_SS1049752');
			} else {
				onlineButton.setAttribute('href', 'http://www.staples.com/webapp/wcs/stores/servlet/StaplesProductDisplay?storeId=10001&langId=-1&catalogId=2&partNumber=' + str);
			}
		
		} else {
		
			if (document.getElementById('buyOnline')) {
				buttonParent.removeChild(buttonParent.lastChild);
			
			}
		}
		
		
		// Remove any prior search results
		
		if (document.getElementById('storeFinder')) {
		
			var storeFinder = document.getElementById('storeFinder');
			var storeFinderParent = storeFinder.parentNode;
			
			storeFinderParent.removeChild(storeFinder);
		
		}
		
		// Change the sku number on the page
		
		var skuNumberP = document.getElementById('skuNumber');
		skuNumberP.firstChild.nodeValue = 'sku number ' + str;
		
		
	}
}


function changeMainImage2 (event, sNumber) {

	

}

function changeMainImage(event, sNumber) {
	
	var tempObj = document.getElementById('productImgPrimary');
	var altViews = document.getElementById('productAltViews');
	var classProperty, newSource, thumbTarget;
	
	tempObj.hasAttribute ? classProperty = 'class' : classProperty = 'className';
	

	if (event) {
		setEventTargets(event);		
		newSource = eTarget.getAttribute('src').replace('?$thb$', '?$enl$')
		
	} else {
		eTargetParent = altViews;
		newSource = 'http://s7d5.scene7.com/is/image/Staples/' + sNumber + '_sc7?$enl$';
		thumbTarget = 'http://s7d5.scene7.com/is/image/Staples/' + sNumber + '_sc7?$thb$'
	}
	
	tempObj.setAttribute('src', tempObj.getAttribute('src').replace(tempObj.getAttribute('src'), newSource));
	
	for (var x = 0; x < altViews.childNodes.length; x++) {
	
		var iseTarget = false;
		
		
		if (altViews.childNodes[x] == eTarget || altViews.childNodes[x].getAttribute('src') == thumbTarget) {
			iseTarget = true;
		}
		
		var hasClass;
		
		altViews.childNodes[x].hasAttribute ? hasClass = altViews.childNodes[x].hasAttribute(classProperty) : hasClass = altViews.childNodes[x].className;
		
		// branch for IE7 and older;
		
		if (hasClass == 'active') {
			hasClass = true;
		} else if (hasClass == '') {
			hasClass = false;	
		}
		
		if (!iseTarget && hasClass) {
			altViews.childNodes[x].removeAttribute(classProperty);

		} else if (iseTarget) {
			altViews.childNodes[x].setAttribute(classProperty, 'active');

		}
	}
}

function findStore(event) {

	if (event) {
		event.preventDefault ? event.preventDefault() : window.event.returnValue = false;
	
	} else {
		// we are calling the function at runtime on the Find a Store page
		
		sku = 0;
	
	}
	
	if (!document.getElementById('storeFinder')) {
	
		var ajaxResponse = makeRequest('/ajax/getStoreInfo_RO.php', '?sku=' + sku, '');
		
		if (ajaxResponse.getElementsByTagName('status')[0].firstChild.nodeValue == 'ok') {
		
			stateArray = ajaxResponse.getElementsByTagName('states')[0].firstChild.nodeValue;
			stateArray = stateArray.split('|');
		
			var eDiv = document.createElement('DIV');
			eDiv.setAttribute('id', 'storeFinder');
			
			eSelect = document.createElement('SELECT');
			eSelect.setAttribute('id', 'state');
			addListener(eSelect, 'change', writeSelects, false);
			
			var newOption = document.createElement('OPTION');
			var newOptionText = document.createTextNode('Please select a State');
			newOption.appendChild(newOptionText);
			eSelect.appendChild(newOption);
			
			writeOptions(stateArray, eSelect);
			
			eDiv.appendChild(eSelect);
			document.getElementById('info').appendChild(eDiv);
			
		} else {
			
			alert('We appologize for the inconvenience, but this product is no longer available in store');
		
		}
	}
}



function writeSelects(event) {

	function getAjaxResponseTagValue(response, tag, modifier) {
	
		var value = response.getElementsByTagName(tag)[modifier].firstChild.nodeValue;
		return value;
	
	}

	if (event) {
	
		setEventTargets(event);
		
		if (eTarget.id == 'state') {
		
			if (!document.getElementById('city')) {
		
				var eSelect = document.createElement('SELECT');
				addListener(eSelect, 'change', writeSelects, false);
				eSelect.setAttribute('id', 'city');
				eTargetParent = eTarget.parentNode;
				eTargetParent.appendChild(eSelect);
				
			} else {
			
				var eSelect = document.getElementById('city');
				
				while (eSelect.hasChildNodes()) {
					eSelect.removeChild(eSelect.firstChild);
				}
				
				
				if (document.getElementById('results')) {
					
					var eResultDiv = document.getElementById('results');
					
					while(eResultDiv.hasChildNodes()) {
					
						eResultDiv.removeChild(eResultDiv.firstChild);
					
					}
				}
			}
			
			var newOption = document.createElement('OPTION');
			var newOptionText = document.createTextNode('Please select a city');
			newOption.appendChild(newOptionText);
			eSelect.appendChild(newOption);
			
			
			selectedState = eTarget.options[eTarget.options.selectedIndex].value;
			var ajaxResponse = makeRequest('/ajax/getStoreInfo_RO.php', '?sku=' + sku + '&state=' + selectedState, '');
			
			var status = getAjaxResponseTagValue(ajaxResponse, 'status', 0);
			
			if (status == 'ok') {
			
				cityArray = getAjaxResponseTagValue(ajaxResponse, 'cities', 0);
				cityArray = cityArray.split('|');
			}
			
			writeOptions(cityArray, eSelect);		
		
		
		} else {
		
			
			var eResultDiv;
			var storeArray;
			
			if (document.getElementById('results')) {
		
				eResultDiv = document.getElementById('results');
			
				while(eResultDiv.hasChildNodes()) {
				
					eResultDiv.removeChild(eResultDiv.firstChild);
				
				}
				
			} else {
			
				eResultDiv = document.createElement('DIV');
				eResultDiv.setAttribute('id', 'results');
				
				var storeFinderDiv = document.getElementById('storeFinder');
				storeFinderDiv.appendChild(eResultDiv);
				
			}
			
			selectedCity = eTarget.options[eTarget.options.selectedIndex].value;
			var ajaxResponse = makeRequest('/ajax/getStoreInfo_RO.php', '?sku=' + sku + '&state=' + selectedState + '&city=' + selectedCity, '');
			// http://scott-doxey.staples.com/ajax/getStoreInfo_RO.php?sku=689170&state=ma&city=framingham

			
			if (ajaxResponse.getElementsByTagName('status')[0].firstChild.nodeValue == 'ok') {
			
				storeArray = ajaxResponse.getElementsByTagName('store');
				//alert(storeArray.length);
			}

			var eH2 = document.createElement('P');
			var plural = '';
			var plural2 = 'ies';
			if (storeArray.length > 1) {
				plural = 's';
				plural2 = 'y';
			}
			eText = document.createTextNode('The following store' + plural + ' usually carr' + plural2 + ' this product.');
			eH2.appendChild(eText);

			var eBr = document.createElement('BR');
			eH2.appendChild(eBr);
			
			eText = document.createTextNode('Please call for availability.');
			eH2.appendChild(eText);
			
			eResultDiv.appendChild(eH2);
			
			for (var x = 0; x < storeArray.length; x++) {
			
				var eDiv = document.createElement('DIV');
			
				var str, eText, eP;
				var eAddress = document.createElement('ADDRESS');
				
				if (x == 0) {
					eAddress.hasAttribute ? eAddress.setAttribute('style','border-top: none;') : eAddress.style.borderTop = 'none';
				}
				
				if (ajaxResponse.getElementsByTagName('address1')[x] && ajaxResponse.getElementsByTagName('address1')[x].firstChild) {
					str = getAjaxResponseTagValue(ajaxResponse, 'address1', x)
				}
				
				//alert('address 1 ' + str);
				
				if (ajaxResponse.getElementsByTagName('address2')[x] && ajaxResponse.getElementsByTagName('address2')[x].firstChild) {
					str += ', ' + getAjaxResponseTagValue(ajaxResponse, 'address2', x);
				}
				
				//alert('address 1 & 2' + str);

				
				str += ', ' + selectedCity + ', ' + selectedState + ' ';
				
				//alert('address 1 & 2, State, City ' + str);

				
				if (ajaxResponse.getElementsByTagName('postalCode')[x]) {
					str += getAjaxResponseTagValue(ajaxResponse, 'postalCode', x);
				}
				
				//alert('address 1 & 2, State, City, zip ' + str);


				eText = document.createTextNode(str);
				eAddress.appendChild(eText);
				eDiv.appendChild(eAddress);
				
				
				if (ajaxResponse.getElementsByTagName('phoneNumber')[x]) {
					eP = document.createElement('P');
					str = getAjaxResponseTagValue(ajaxResponse, 'phoneNumber', x);
					eText = document.createTextNode('Phone number: ' + str);
					eP.appendChild(eText);
					eDiv.appendChild(eP);
				}
			
				
				if (ajaxResponse.getElementsByTagName('faxNumber')[x]) {
					eP = document.createElement('P');
					str = document.createTextNode('Fax number: ' + getAjaxResponseTagValue(ajaxResponse, 'faxNumber', x));
					eP.appendChild(str);
					eDiv.appendChild(eP);
				}
				
				if (ajaxResponse.getElementsByTagName('weekdayHours')[x]) {
					eP = document.createElement('P');
					str = document.createTextNode('Monday - Friday: ' + getAjaxResponseTagValue(ajaxResponse, 'weekdayHours', x));
					eP.appendChild(str);
					eDiv.appendChild(eP);
				}
				
				if (ajaxResponse.getElementsByTagName('saturdayHours')[x]) {
					eP = document.createElement('P');
					str = document.createTextNode('Saturday: ' + getAjaxResponseTagValue(ajaxResponse, 'saturdayHours', x));
					eP.appendChild(str);
					eDiv.appendChild(eP);
				}
				
				if (ajaxResponse.getElementsByTagName('sundayHours')[x]) {
					eP = document.createElement('P');
					str = document.createTextNode('Sunday: ' + getAjaxResponseTagValue(ajaxResponse, 'sundayHours', x));
					eP.appendChild(str);
					eDiv.appendChild(eP);
				}
				
				eResultDiv.appendChild(eDiv);
			}
		}
		
	} else {
	
		
		addListener(document.getElementById('state'), 'change', writeSelects, false);		
		var ajaxResponse = makeRequest('/ajax/getStoreInfo_RO.php', '?sku=' + sku, '');
		
		if (ajaxResponse.getElementsByTagName('status')[0].firstChild.nodeValue == 'ok') {
		
			stateArray = ajaxResponse.getElementsByTagName('states')[0].firstChild.nodeValue;
			stateArray = stateArray.split('|');
		}

		
		writeOptions(stateArray, document.getElementById('state'));
		sku = 0;
	
	}

}


function writeOptions (array, select) {

	for (var x = 0; x < array.length; x++) {
	
		var newOption = document.createElement('OPTION');
		var newOptionText;
		
		newOption.setAttribute('value', array[x]);
		newOptionText = document.createTextNode(array[x]);
			
		newOption.appendChild(newOptionText);
		select.appendChild(newOption);
	
	}
}

function makeRequest(url, parameters, alertString) {

	http_request = false;
	
	// For IE7 (IE8), Mozilla, Safari, and Opera
	
	if (window.XMLHttpRequest) { 
	
		http_request = new XMLHttpRequest();
		
	// proprietary IE DOM
	
	} else if (window.ActiveXObject) { 
		
		try {
			http_request = new ActiveXObject("Msxml2.XMLHTTP");
			
		} catch(e) {
			try {
				http_request = new ActiveXObject("Microsoft.XMLHTTP");
			} catch(e) {}
		}
	}
	
	if (!http_request) {
		alert('FAILED, Cannot create XMLHTTP instance');
		return false;
	}
	
	http_request.open('GET', url + parameters, false);
	http_request.send(null);

	if (http_request.readyState == 4) {
		
		if (http_request.status == 200) {

			var serverResponse = http_request.responseXML;

			if (alertString) {
				
				if (alertString == 'default') {
					
					alert('Your edits have been saved. Click OK to continue.');
					
				} else {
					
					alert(alertString);
				}
			}
			
			return serverResponse;
			
		} else {
			alert('There was a problem with the request. \n Request Status: ' + http_request.status);
		}
	}
}


function initializeSlider(event) {

	var direction;
	var moduleWidth = 172;
	var endModifier = 4;
	var moveSpeed = 5;
	var sliderDiv = document.getElementById('productsInner').getElementsByTagName('DIV')[0];
	
	var sliderKids = sliderDiv.childNodes.length;
	var slideTimes = parseInt(sliderKids)/4;
	
	if (slideTimes > 1) {
		
		if (!sliderDiv.style.width) {
			var sliderDivWidth = parseInt(sliderDiv.childNodes.length) * 172 - 2;
			sliderDiv.style.width = sliderDivWidth + 'px';
		}
		
		var startPosition = sliderDiv.hasAttribute ? sliderDiv.style.left : sliderDiv.style.marginLeft;

		if (!startPosition) {
			
			sliderDiv.hasAttribute ? sliderDiv.style.left = '0px' : sliderDiv.style.marginLeft = '0px';
			startPosition = sliderDiv.hasAttribute ? sliderDiv.style.left : sliderDiv.style.marginLeft;
		}
		
		setEventTargets(event);
		eTarget.getAttribute('id') == 'arrow_right' ? direction = 'right' : direction = 'left';
		
		startPosition = parseInt(startPosition.replace('px', ''));
		
		if (direction == 'right') {
		
			var num = startPosition;
			
			if (num < 0) {
				num = (-num)/moduleWidth;
			}
			
			var alreadySeen = num + endModifier;
			
			if (alreadySeen != sliderKids) {
			
				if ((alreadySeen + endModifier) > sliderKids) {
					endModifier = endModifier - ((alreadySeen + endModifier) - sliderKids);
				}
			
				var endPosition = startPosition - (endModifier * moduleWidth);
				move(sliderDiv, startPosition, endPosition, moveSpeed);
				
			}
			
			// once the div is moved reset the buttons if needed
			
			alreadySeen = alreadySeen + endModifier;
			
			if (alreadySeen == sliderKids) {

				var imgState;
				
				eTarget.getAttribute('src').match('on') ? imgState = 'on' : imgState = 'off';
				eTarget.setAttribute('src', eTarget.getAttribute('src').replace(imgState, 'null'));
				eTarget.removeAttribute('style');
				
				var rightImg = document.getElementById('arrow_left');
				if (rightImg.getAttribute('src').match('null')) {
					rightImg.setAttribute('src', rightImg.getAttribute('src').replace('null', 'off'));
				}
			}


		} else {
		
			var num = startPosition;
			
			if (num < 0) {
			
				num = (-num)/moduleWidth;
				
				if (num < endModifier) {
					endModifier = num;
				}
				
				var endPosition = startPosition + (endModifier * moduleWidth);
				move(sliderDiv, startPosition, endPosition, moveSpeed);
				
			} 
			
			// reset images if needed
			
			if (endPosition == '0') {
				var imgState;
				
				eTarget.getAttribute('src').match('on') ? imgState = 'on' : imgState = 'off';
				eTarget.setAttribute('src', eTarget.getAttribute('src').replace(imgState, 'null'));
				eTarget.removeAttribute('style');
				
				var leftImg = document.getElementById('arrow_right');

				if (leftImg.getAttribute('src').match('null')) {
					leftImg.setAttribute('src', leftImg.getAttribute('src').replace('null', 'off'));
				}

			}
		}
	}
}

function changeArrow(event) {

	setEventTargets(event);
		
	var pattern = new RegExp('null', 'g');
	var result = pattern.exec(eTarget.getAttribute('src'));
	
	if (!result) {
	
		if (event.type == 'mouseover' || event.type == 'onmouseover') {
			eTarget.setAttribute('src', eTarget.getAttribute('src').replace('off', 'on'));
			eTarget.setAttribute('style', 'cursor: pointer;');
			
		} else {
			eTarget.setAttribute('src', eTarget.getAttribute('src').replace('on', 'off'));
			eTarget.removeAttribute('style');

		}
	}
}

function move(object, start, end, speed) {

	if (object.interval) { clearInterval(object.interval); }

	object.interval = setInterval(function() {

		start += (end - start) * (speed / 100);

		object.hasAttribute ? object.style.left = start + 'px' : object.style.marginLeft = start + 'px';

		if (Math.round(start) == end) { 
		
			object.hasAttribute ? object.style.left = end + 'px' : object.style.marginLeft = end + 'px';
			clearInterval(object.interval); 
		}

	}, speed);
}

function cleanImage(imgString, ext) {
	var tempImg = imgString.split('/');
	tempImg = tempImg[tempImg.length - 1];
	tempImg = tempImg.split(ext)[0];
	return tempImg;
}