// Scroll effect mod
	Effect.ScrollTo = function(element, options) 
		{
	  	var options = arguments[1] || { },
	    scrollOffsets = document.viewport.getScrollOffsets(),
	    elementOffsets = $(element).cumulativeOffset(),
	    max = window.innerHeight ?
			  window.height - window.innerHeight :
			  document.documentElement.scrollHeight -
				(document.documentElement.clientHeight ?
				  document.documentElement.clientHeight :
					document.body.clientHeight);    

	  	if (options.offset) elementOffsets[1] += options.offset;
		options.duration = .4

		return new Effect.Tween(null,
	   							scrollOffsets.top,
	   							elementOffsets[1] > max ? max : elementOffsets[1],
	   							options,
	  							function(p){ scrollTo(scrollOffsets.left, p.round()) }
							);
		};		
		
	function setupItem(i)
		{
		if(i == null)
			return false;
			
		i.related = [];
		i.category = '';
		
		classes = i.classNames();	
		classes.each(function(n)
			{
			// We're only looking for related items
			if(n.substr(0,2) == 'ID' && n.length > 3)
				i.related.push(n);
			else if(this.categories.find(function(e) { return n == e }))
				i.category = n;
			})
		}
		
	// Highlight connected items
	function connectItems(e,item)
		{
		i=(item==1) ? e : e.element();
		if(i.hasClassName('content')==true || 
			i.hasClassName('bg')==true ||
			i.hasClassName('title')==true)
			i = i.up();
		if(i.hasClassName('image')==true ||
			i.hasClassName('item')==true)
			i = e.findElement('.litem')

		// If a project is open, and the moused over item is not open
		if(document.project != undefined && (i.open == undefined || i.open == 0))
			return;
		if(document.project != undefined && i.open == 1)
			this.clearConnected(0,1);	
			
		if(i.down('.bg') == undefined)
			return;
			
		if(i.related == undefined)
			{
			c = this.setupItem(i);
			if(c == false)
				return false
			}
			
		i.down('.bg').style.backgroundColor = this.colors[i.category];			
		i.down('.bg').style.opacity = .5;
		i.down('.bg').style.filter = "alpha(opacity="+50+")";
			
		count = i.related.length;
		i.related.each(function(r,k)
			{
			// If related item is not configured, 
			if(r.related == undefined)
				{
				c = this.setupItem($(r));
				if(c == false)
					return false;
				}
			// Then set its background color
			$(r).down('.bg').style.backgroundColor = this.colors[$(r).category];
			
			// Opacity
			iet = Math.round(((count-k) / count)*90);			
			t = iet/100
			t = t*.5;
			$(r).down('.bg').style.opacity =  String(t);
			$(r).down('.bg').style.filter =  "alpha(opacity="+String(iet)+")";			
			}, this)
		}
		
	// Clear connected items
	function clearConnected(e,item)
		{
		// If a project is open, and the mode is 0 
		if(document.project != undefined && item == undefined)
			{
			if(document.focus != undefined)
				{
				this.connectItems(document.focus,1)
				}
			return;
			}
			
		$$('li').each(function(i) 
			{ 
			if(i.hasClassName('h1'))
				return;
				 
			i.down('.bg').style.backgroundColor = 'transparent' 
			})
		}
	
	function toggleNav(i,n)
		{
		if(n==0)
			{
			i.active = 0;
			i.style.color = "#cfcfcf";
			}
		else
			{
			i.active = 1;
			i.style.color = i.color;
			}
		}
		
	// Add sort category
	function selectCategory(e, opt)
		{
		if(opt == undefined)
			i = e.element();
		else
			i = $(e+"_link")
		
		// If they're all active: limit it to one.
		// If less than all are active: add to it.
		
		// Check how many are active
		navs = $$('.nav');
		a=0;
		navs.each(function(p)
			{
			if(p.active == 1)
				a+=1
			}, this)
		// If they are all active: deactivate the others
		if(a==navs.length)
			{
			navs.each(function(p)
				{
				if(p.innerHTML != i.innerHTML)
					this.toggleNav(p,0)
				else
					this.toggleNav(p,1)
				}, this)
			}
		// Otherwise add the clicked item to the set
		else
			this.toggleNav(i,1)
		
		
		$$('li').each(function(li)
			{
			// Not the nav
			if(li.hasClassName('h1'))
				return;
				
			if(li.related == undefined)
				this.setupItem(li);
				
			navs.each(function(n)
				{
				if(li.hasClassName(n.innerHTML))
					action = (n.active == 1) ? li.show() : li.hide();					
				}, this)
			/*
			else
				action = (i.active == 0) ? li.show() : li.hide();
			*/
			}, this)
		}
		
	// Open / close a project
	function toggleItem(e,item)
		{
		i=(item!=undefined)?e:e.element(); 
		if(i.hasClassName('content')==true || 
			i.hasClassName('bg')==true ||
			i.hasClassName('title')==true)
			i = i.up();
			
		if(i.down('.content') == undefined)
			return;
		
		// Close	
		if(i.down('.content').showing == 1)
			{
			i.down('.content').hide(); 
			i.style.width = '160px';	
			i.style.height = '120px';						
			i.down('.content').showing = 0;											
			i.style.backgroundColor = 'transparent';						
			
			i.down('.title').style.padding = '10px';
			i.down('.title').style.color = this.colors[i.category];
			i.style.padding = '0px';
			i.down('.bg').style.height = i.down('.bg').style.oheight
			i.down('.bg').style.backgroundColor = i.down('.bg').style.obackgroundColor;						
			
			i.style.border = ""
			
			i.open = 0;
			
			// Remove from the index, and select the last one
			document.project.each(function(_i,k)
				{
				if(_i == i)
					_k = k
				})
			document.project.splice(_k,1)
			if(document.project.length == 0)
				document.project = undefined;
			else
				{
				if(document.project.length>_k-1)
					go = document.project[0]
				else
					go = document.project[_k-1]
				this.selectItem(go)
				return
				}
			// Reset URL
			document.location = "#HOME";	
			new Effect.ScrollTo($('h1'))
			}
		// Open
		else
			{
			if(i.related == undefined)
				this.setupItem(i);				
			
			if(document.project == undefined)
			 	document.project = [i];
			else
				document.project.push(i)
				
			i.open = 1;
			
			i.down('.content').show(); 
			i.style.height = '600px';	
			i.style.width = '632px';
			
			i.style.backgroundColor = '#fff';	
			i.down('.content').showing = 1;
			
			i.down('.title').style.padding = '0px';
			i.down('.title').style.color = "#333"
			i.style.padding = '10px';
			i.style.backgroundColor = this.colors[i.category];
			i.down('.bg').style.obackgroundColor = i.down('.bg').style.backgroundColor = 'transparent';
			i.down('.bg').style.backgroundColor = 'transparent';
			i.down('.bg').style.oheight = i.down('.bg').style.height;
			i.down('.bg').style.height = i.down('.title').getHeight()+"px";
			
			i.down('.content').observe('click', blindAcross.bind(this))
			
			if(i.imageSequence == undefined)
				{
				i.down('.content').down('.container').childElements().each(function(_i)
					{
					if(_i.hasClassName('text') === false)
						{
						var inp = _i.down('input').value.split("##")
						var src = inp[0];
						var img = new Element('img', {'src':src,'width':600,'class':inp[1]})
							img.observe('load', function(e)
								{
								e.element().up().down('.loading').remove();
								})
						_i.insert(img);
						}
					},this)
				
				i.imageSequence = 1;
				}

			this.selectItem(i)
			}			
		}
	function selectItem(i)
		{
		document.focus = i;
		
		//update url
		document.location = "#"+i.down('.title').down('.href').innerHTML;
		
		pos = i.cumulativeOffset();
		new Effect.ScrollTo(i, {offset: -20})			
		}
	
	function toggleNext(e)
		{	
		i = e.element()
		e.stop();
		related = i.up().up().related;
		for(q=0;q<related.length;q++)
		    {
		    p = related[q]
		    // If it doesn't exist, skip it
		    if($(p) == undefined)
		        continue;
		    // If it's not open, use it.
		    if($(p).down('.content').showing == undefined || $(p).down('.content').showing == 0)
	      		{
	      		title = $(p).down('.title').down('.href').innerHTML;
	      		obj = $(p)
	      		break;
	      		}
		    }
		if(title == undefined)
		    return;
		
		if(obj.style.display == 'none')
			{
			this.selectCategory(obj.category, 1)
			}
		
		document.location = "#"+title;
		this.toggleItem(obj,1)
		}
		
	// Image cycle
	function blindAcross(e)
		{
		i = e.element();
		u = e.findElement('.container')
		li = u.up().up()
		
		document.focus = li
		
		if(u == undefined)
			return;
			
		if(u.tweening == 1)
			return;

		u.tweening = 1;			
						
		if(u.offset == undefined)
			u.offset = 0;
			
		target = -600; //-i.getWidth();
		u.offset -= target;
		if(i.hasClassName('last'))
			{
			target = u.offset-i.getWidth();
			u.offset = 0;
			}
			
		new Effect.Move(u, {x:target, y:0, mode: 'relative', duration: .2, afterFinish: this.tweenCleanBind})
		}
		
	function tweenClean(item)
		{
		item.element.tweening = 0;
		}
		
	// Setup
	Event.observe(window,'load', function(e)
		{
		this.tweenCleanBind = this.tweenClean.bind(this);
			
		// Contact
		$('contact_link').observe('click', function(e) 
			{ 
			off = $('contact_link').cumulativeOffset();
			$('contact').style.top = (off.top-31)+"px";
			//$('contact_blind').toggle(); 
			if($('contact_blind').open == undefined || $('contact_blind').open == 1)
				{
				start = 400
				end = 0
				$('contact_blind').open	= 0
				}
			else
				{
				start = 0
				end = 400
				$('contact_blind').open	= 1				
				}				
				
			if($('contact_blind').tweening == undefined || $('contact_blind').tweening != 1)
				{
				var opt = {duration: .2, afterFinish: function() { $('contact_blind').tweening = 0} }
				new Effect.Tween('contact_blind', start, end, opt, function(p) { $('contact_blind').style.width = p+"px" })
				$('contact_blind').tweening = 1					
				}
			})
		
		dims = $('nav').getDimensions();
		this.categories = Object.keys(this.colors);
		
		// Lookup item from url
		if(document.location.hash != '')
			{
			href = document.location.hash.substr(1);
			$$('.href').each(function(i)
				{
				if(i.innerHTML == href)
					this.toggleItem(i.up().up(), 1)
				})
			}
		
		$$('.nav').each(function(i)
			{
			i.active = 1;
			i.color = i.style.color;
			
			i.observe('click', selectCategory.bind(this));
			}, this);
		
		$$('li').each(function(i) 
			{ 
			// Not the nav
			if(i.hasClassName('h1'))
				return;
				
			i.observe('mouseover', connectItems.bind(this)) 
			i.observe('mouseout', clearConnected.bind(this)) 
			i.observe('click', toggleItem.bind(this))
			}, this);
		
		$$('.next_s').each(function(i)
		    {
		    i.observe('click', toggleNext.bind(this))
		    }, this)
		})