//utility functions
var BrowserDetect = {
	init: function () {
		this.browser = this.searchString(this.dataBrowser) || "An unknown browser";
		this.version = this.searchVersion(navigator.userAgent)
			|| this.searchVersion(navigator.appVersion)
			|| "an unknown version";
		this.OS = this.searchString(this.dataOS) || "an unknown OS";
	},
	searchString: function (data) {
		for (var i=0;i<data.length;i++)	{
			var dataString = data[i].string;
			var dataProp = data[i].prop;
			this.versionSearchString = data[i].versionSearch || data[i].identity;
			if (dataString) {
				if (dataString.indexOf(data[i].subString) != -1)
					return data[i].identity;
			}
			else if (dataProp)
				return data[i].identity;
		}
	},
	searchVersion: function (dataString) {
		var index = dataString.indexOf(this.versionSearchString);
		if (index == -1) return;
		return parseFloat(dataString.substring(index+this.versionSearchString.length+1));
	},
	dataBrowser: [{
			string: navigator.userAgent,
			subString: "OmniWeb",
			versionSearch: "OmniWeb/",
			identity: "OmniWeb"
		},{
			string: navigator.vendor,
			subString: "Apple",
			identity: "Safari"
		},{
			prop: window.opera,
			identity: "Opera"
		},{
			string: navigator.vendor,
			subString: "iCab",
			identity: "iCab"
		},{
			string: navigator.vendor,
			subString: "KDE",
			identity: "Konqueror"
		},{
			string: navigator.userAgent,
			subString: "Firefox",
			identity: "Firefox"
		},{
			string: navigator.vendor,
			subString: "Camino",
			identity: "Camino"
		},
		{		// for newer Netscapes (6+)
			string: navigator.userAgent,
			subString: "Netscape",
			identity: "Netscape"
		},{
			string: navigator.userAgent,
			subString: "MSIE",
			identity: "Explorer",
			versionSearch: "MSIE"
		},{
			string: navigator.userAgent,
			subString: "Gecko",
			identity: "Mozilla",
			versionSearch: "rv"
		},{ // for older Netscapes (4-)
			string: navigator.userAgent,
			subString: "Mozilla",
			identity: "Netscape",
			versionSearch: "Mozilla"
		}],
	dataOS : [{
			string: navigator.platform,
			subString: "Win",
			identity: "Windows"
		},{
			string: navigator.platform,
			subString: "Mac",
			identity: "Mac"
		},{
			string: navigator.platform,
			subString: "Linux",
			identity: "Linux"
		}]
};

function fileExt(str) {
	return str.substring(str.lastIndexOf('.')+1,str.length)
}

function fileName(str) {
	return str.substring(str.lastIndexOf('/')+1,str.length)
}

function getViewport() {
	if (typeof window.innerWidth != 'undefined') {
		 // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
		return {
			x: window.innerWidth,
			y: window.innerHeight
		};
	} else if (typeof document.documentElement != 'undefined' && typeof document.documentElement.clientWidth !=	'undefined' && document.documentElement.clientWidth != 0) {
		// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
		return {
			x: document.documentElement.clientWidth,
			y: document.documentElement.clientHeight
		};
	} else {
		return {
			x: document.getElementsByTagName('body')[0].clientWidth,
			y: document.getElementsByTagName('body')[0].clientHeight
		};
	}
}

//portfolio viewer
var portfolio = {
	curItem: 0,
	load: function() {
		BrowserDetect.init();
		window['portItems'] = [];
		var itemCount = 0;
		
		$ES('#portViewer ul').each(function(ul, i) {
			ul.i = i;
			var items = $$(ul.getElementsByTagName('li'));
			items.each(function(el, j) {
				el.i = itemCount++;
				try {
					if (portfolioViewer) el.cat = portfolioViewer.categories[i].i;
				} catch(e) {};
				el.addEvent('click', function(evt) {
					//info.setStyle('opacity',0);
					portfolio.show(this.i);
					new Event(evt).stop();
				});
				el.addEvent('mouseover', function() {
					infoBox.hover(this);
				});
				el.addEvent('mouseout', infoBox.exit);
				portItems.push(el);
			});
		});

		//create veil
		var veilDiv = document.createElement('div');
		veilDiv.id = 'veil';
		document.body.appendChild(veilDiv);
		window['veilEl'] = $('veil');
		veilEl.setStyle('opacity',0);
		veilFx = new Fx.Styles(veilEl, {duration:400, wait: false, onComplete : function() {
			if (this.element.getStyle('visibility') == 'visible') {
			}
		}});
		
		//create arrows & close
		var div = document.createElement('div');
		div.appendChild(document.createTextNode('Next Item'));
		div.id = 'arrowR';
		veilEl.appendChild(div);

		var div = document.createElement('div');
		div.appendChild(document.createTextNode('Previous Item'));
		div.id = 'arrowL';
		veilEl.appendChild(div);

		var div = document.createElement('div');
		div.appendChild(document.createTextNode('Back to Page'));
		div.id = 'portExit';
		veilEl.appendChild(div);

		window['arrowL'] = $('arrowL');
		window['arrowR'] = $('arrowR');	

		arrowL.addEvent('click', function() {
			if (portfolio.curItem>0) {
				portfolio.curItem--;
				portfolio.show(portfolio.curItem);
			}
		});
		arrowR.addEvent('click', function() {
			if (portfolio.curItem<portItems.length-1) {
				portfolio.curItem++;
				portfolio.show(portfolio.curItem);
			}
		});
		$('portExit').addEvent('click',portfolio.hide);
		$('veil').addEvent('click',portfolio.hide);

		//create h2,p
		veilEl.appendChild(document.createElement('h2'));
		veilEl.appendChild(document.createElement('p'));
		
		//done, make active for alt CSS
		$('portViewer').addClass('active');

	},
	delay: 0,
	show: function(i) {
		veilEl.addClass('loading');
		portfolio.curItem = i;
		var currentEl = portItems[portfolio.curItem];

		if ($('portImg')) $('portImg').parentNode.removeChild($('portImg'));
		if ($('flashItem')) swfobject.removeSWF('flashItem');

		var portLink = currentEl.getElementsByTagName('a')[0].href;
		veilEl.getElementsByTagName('h2')[0].innerHTML = currentEl.getElementsByTagName('h3')[0].innerHTML;
		veilEl.getElementsByTagName('p')[0].innerHTML = currentEl.getElementsByTagName('p')[0].innerHTML;

		if (veilEl.getStyle('visibility') == 'hidden') {
			veilFx.start({
				'opacity': .9
			});
			portfolio.delay = 500;
			infoBox.el.setStyle('opacity',0);
		} else {
			portfolio.delay = 0;
		}

		switch (fileExt(portLink)) {
			case "jpg": case "png":
				mpiEl = document.createElement('img');
				mpiEl.id = 'portImg';
				mpiEl.onerror = function() {
					veilEl.addClass('error');
				}
				mpiEl.onload = function() {
					veilEl.removeClass('loading');

					origH = this.height;
					origW = this.width;

					startO = 0;
					endO = 1;

					endH = getViewport().y - 140;
					if (endH > origH) endH = origH;
					endW = origW * endH /origH;
					
					endTop = (getViewport().y/2)-(endH/2)+5;
					endLeft = (getViewport().x/2)-(endW/2);

					startH = endH*.85;
					startW = endW*.85;

					if (BrowserDetect.browser == 'Firefox' && BrowserDetect.version < 6 && BrowserDetect.OS == 'Windows') {
						startW = endW;
						startH = endH;
					}

					startTop = (getViewport().y-startH)/2;
					startLeft = (getViewport().x-startW)/2;

					if (BrowserDetect.browser == 'Explorer' && BrowserDetect.version < 7) {
						veilEl.setStyles({
							'height': getViewport().y+'px'
						});
					}

					this.setStyles({
						'visibility': 'hidden',
						'top': startTop,
						'left': startLeft,
						'width': startW,
						'height': startH,
						'opacity': startO
					})

					portImgFx.start({
						'top': endTop,
						'left':endLeft,
						'width': endW,
						'height': endH,
						'opacity': endO
					});
		
				}
				document.body.appendChild(mpiEl);
				window['portImgFx'] = new Fx.Styles($('portImg'), {duration:400, wait: false, onComplete: function() {
					if (this.element.getStyle('visibility') == 'hidden') {
						this.element.parentNode.removeChild(this.element);
					}
				}});
				setTimeout(function() {
						$('portImg').src = portLink;
						$('portImg').onclick = portfolio.hide;				
					}, portfolio.delay
				)
			break;
	
			default:

				var flashvars = {};
				var params = {
					bgcolor: '#000'
				};
				var attributes = {
					id: 'flashItem',
					name: 'flashItem'
				};
				
				portFlashDiv = document.createElement('div');
				portFlashDiv.id = 'flashItem';
				portFlashDiv.appendChild(document.createTextNode('You Need Flash v8.0 to view this video'));
				document.body.appendChild(portFlashDiv);

				setTimeout(function() {
					if (BrowserDetect.browser == 'Firefox' && parseInt(BrowserDetect.version) == 2 && BrowserDetect.OS == 'Mac') {
						window.location = portLink;
					} else {
						swfobject.embedSWF(portLink, 'flashItem', '400', '300', '8.0.0', false, flashvars, params, attributes);
						$('flashItem').style.top = (getViewport().y/2)-(300/2)+5 + 'px';
						$('flashItem').style.left = (getViewport().x/2)-(400/2) + 'px';
					}
					}, portfolio.delay
				)				
		}
		try {
			if (portfolioViewer) {
				if ((currentEl.cat > portfolioViewer.activeH2) || (currentEl.cat < portfolioViewer.activeH2)) {
					portfolioViewer.changeCat(currentEl.cat,false);
				}
			}
		} catch(e) {};
	},
	hide: function(evt) {

		var e = new Event(evt);
		if (e.target != arrowL && e.target != arrowR && e.target != $('media')) {
			veilFx.start({
				'opacity': 0
			});

			if ($('portImg')) {
				portImgFx.start({
					'opacity': 0
				});
			}

			if ($('flashItem')) swfobject.removeSWF('flashItem');

		} else {
			e.stop();
		}


	}
}

window.addEvent('domready', portfolio.load);