

	var speed = 0.3;
	var navhash = new Hash();



	document.observe("dom:loaded", function() {
		
		//	tag all a.enlarge elements the proper function
		$$('a.enlarge').each( function(item) {
			item.observe('click', enlarge);
		});



		//	setup any colapsibles
		$$('.collapsable').each( function(item) {

			//	pull the head out (first element)
			var head = item.down().remove();
			
			//	check wether default to collapsed
			var collapsed = item.hasClassName('collapsed');
			
			//	set the nav status hash
			navhash.set(item.identify(), (collapsed?'collapsed':'expanded'));

			//	pull the rest of the guts out
			var container = new Element('div', {'class': 'container', style: 'display: '+(collapsed?'none':'block')+';'});
			container.innerHTML = item.innerHTML;
			
			//	put the head back in
			item.update(head);


			//	wrap the head in anchor tag to call colapse
			var a = new Element('a', { href: '#'+item.identify() });
			a.observe('click', toggle_sidebar);
			item.down().wrap(a);
			
			item.insert(container);
		
			
		});
		
		

		//	preload images
		var d = document;
		if(d.images){
			if(!d.preloaded_images) d.preloaded_images = new Array();
			['/layout/overlay/black.png', '/layout/overlay/black.png'].each(
				function(img){
					var i = d.preloaded_images.length;
					d.preloaded_images[i] = new Image();
					d.preloaded_images[i].src = img;
				});
		}
		


	});





	function toggle_sidebar(e){
		
		e.stop(); //	stop the links click event (don't load page)
		
		var key = Event.element(e).up('.collapsable').identify();
		var sidebar = Event.element(e).up('.collapsable').down('div.container');
				
		//	reset nav status for this sidebar
		navhash.set(key, (sidebar.visible()?'collapsed':'expanded'));
		


		//	close or open the sidebar
		if( ! Prototype.Browser.IE) {
			if(sidebar.visible())
				 new Effect.BlindUp(sidebar, {duration:speed});
			else new Effect.BlindDown(sidebar, {duration:speed});
			}
		else sidebar.toggle();
		
		
		
		//	save nav state to session
		var data = 'id='+key;
		navhash.each(function(pair) {
			data += '&'+pair.key+'='+pair.value;
			});
		new Ajax.Request('/ajax/save_nav/', {
			method: 'post',
			parameters: data
			});
		
		}






	function enlarge(e){
		
		//	get this event's calling anchor tag
		var a = Event.element(e);
		if(!a.match('a.enlarge')){
			if(!(a = a.up('a.enlarge'))) return false;
		}
		
		e.stop(); //	stop the links click event (don't load page)
		
		//	get the calling anchor's href
		var href = a.href;
	//	if(href.startsWith('http://')){ href = href.substr(href.indexOf('/',8)); }
				
		//	find img element with source matching href
		var image = a.up(1).getElementsBySelector('img[src="'+href+'"]').first();
		
		//	enlarge it now...
		show_full_size(image.identify());
		
		}


	function show_full_size(thumb){

		var img = Element.extend(new Image());
		img.onload = function(){
			
			$(thumb).setStyle({display:'block'});
			
			var top			= ($(thumb).cumulativeScrollOffset().top + 50),
				left		= 72;
			
			var outline = new Element('div', {	'id': thumb+'_outline',
												'style':  'top: '+top+'px;'
														+ 'left: '+left+'px;'
														+ 'position: absolute;'
														+ 'z-index: 200;'
														+ 'border: 2px solid #333;'
												//		+ 'background: #ffffff;'
														+ 'line-height: 0;'
											 });
			var container = new Element('div', { 'id': thumb+'_container',
												 'style': 'width: '+img.width+'px;'
														+ 'height: '+img.height+'px;'
												//		+ 'overflow: hidden;'
														+ 'display: none;'
											   });
			img.setStyle({zIndex: '210', display: 'none'});
			img.writeAttribute({'id': thumb+'_fullsize'});
			
			container.appendChild(img);
			outline.appendChild(container);
			$('wrap').insert(outline);
			
			
			toggle_overlay('white');
			new Effect.Grow(thumb+'_container', {direction:'top-right', duration:speed});
			new Effect.Appear(thumb+'_fullsize', {delay:speed*.9, duration:speed*.75});
			
			
			
			
			var obj = {
				close_handler: function(e) {
					if(e.element().identify() != thumb) {
						Event.stopObserving(document, 'click', obj.bind_handler);
						close_img(thumb);
					}
				}
			};
			obj.bind_handler = obj.close_handler.bindAsEventListener(obj);
			

			Event.observe(document, "click", obj.bind_handler);
		
		}
		img.src = $(thumb).src;
		
		return false;
	}
	
	
	
	function close_img(thumb){
		toggle_overlay();
		new Effect.Fade(thumb+'_fullsize', {duration:speed});
		new Effect.Fade(thumb+'_container', {duration:speed});
		new Effect.Fade(thumb+'_outline', {duration:speed, afterFinish:function(){ $(thumb+'_outline').remove(); }});
	}
	




	
	function toggle_overlay(type){
		
		if($('overlay')!=null) {
			$('overlay').remove();
			return true;
		}
		
		if(!type) type = 'black';
		
		var width	= $('wrap').getWidth(),
			height	= $('wrap').getHeight(),
			top		= $('content').cumulativeOffset().top,
			margin	= $('content').getStyle('margin-top');
				
		if(margin.endsWith('px')) margin = margin.substr(0,margin.length-2);		
		top -= margin;
		
		var overlay = new Element('div', { 'id': 'overlay',
											'class': 'overlay_'+type,
											'style': 'top: 0;'
												   + 'left: 0;'
												   + 'position:absolute;'
												   + 'z-index: 100;'
												   + 'height: '+(height)+'px;'
												   + 'width: '+width+'px;'
												   + 'display: none;'
										   });
		$('wrap').insert(overlay);
	
		$('overlay').show();
		//new Effect.Appear('overlay', {delay:speed, duration:speed*3});
		
	}



