document.getElementsByTagName('html')[0].className += ' javascript-enabled';

base2.DOM.bind(document);
base2.DOM.EventTarget(window);

window.SGP = function()
{
	var publick = {};
	publick.config = {};
	publick.dom = function()
	{
		this.getEventDelegator = function(event, functor, container)
		{
			var delegator = event.target;
			if (!delegator) { return; }
			while (!functor(delegator))
			{
				if ((container) && (delegator == container)) { return; }
				if (delegator.nodeName.toLowerCase() == 'body') { return; }
				delegator = delegator.parentNode;
			}
			base2.DOM.bind(delegator);
			return delegator;
		};
		return this;
	}();
	publick.css = function()
	{
		this.setOpacity = function(element, opacity)
		{
			element.style.opacity = opacity;
			element.style.filter = 'alpha(opacity='+opacity*100+')';
		}
		return this;
	}();
	publick.layout = function()
	{
		this.getEmSize = function()
		{
			var emsizer = document.getElementById('emsizer');
			var multiplier = 10;
			if (!emsizer)
				{
				emsizer = document.createElement('div');
				emsizer.id = 'emsizer';
				emsizer.style.width = multiplier +'em';
				emsizer.style.left = '-3000px';
				emsizer.style.position = 'absolute';
				document.body.appendChild(emsizer);
				}
			var pixels = emsizer.offsetWidth / multiplier;
			return pixels;
		};
		this.setScale = function(scale)
		{
			var viewport_id = publick.config.viewport;
			if (!viewport_id) { return false; }
			var viewport = typeof viewport_id == 'string' ? document.getElementById(viewport_id) : viewport_id;
			if (viewport)
			{
				viewport.style.fontSize = scale + 'em';
			}
			else
			{
				var setScaleAgain = function() { publick.layout.setScale(scale); };
				setTimeout(setScaleAgain, 10);
			}
		};
		return this;
	}();
	publick.cookie = function()
	{
		this.write = function(name, value, days)
		{
			if (days)
			{
				var date = new Date();
				date.setTime(date.getTime()+(days*24*60*60*1000));
				var expires = "; expires="+date.toGMTString();
			}
			else
			{
				var expires = "";
			}
			document.cookie = name+"="+value+expires+"; path=/";
		};
		this.read = function(name)
		{
			var ca = document.cookie.split(';');
			var nameEQ = name + "=";
			for(var i=0; i < ca.length; i++)
			{
				var c = ca[i];
				while (c.charAt(0)==' ') c = c.substring(1, c.length); //delete spaces
				if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
			}
			return null;
		};
		publick.arrows = 
		{
			left: function() { return document.createTextNode('←'); },
			right: function() { return document.createTextNode('→'); },
			up: function() { return document.createTextNode('↑'); },
			down: function() { return document.createTextNode('↓'); }
		}
		publick.rollover = function(img)
		{
			img.mouseover = function()
			{
				if (this.src.match(/-disabled(\.[^.]+)/)) {return; }; this.src = this.src.replace(/(-hover)*(\.[^.]+)$/, "-hover$2");
			}
			img.mouseout = function()
				{
				if (this.src.match(/-disabled(\.[^.]+)/)) { return; }; this.src = this.src.replace(/-hover(\.[^.]+)$/, "$1");
			}
			img.addEventListener('mouseover', img.mouseover, false);
			img.addEventListener('mouseout', img.mouseout, false);
			img.attachToContainer = function(element)
			{
				element.addEventListener('mouseover', function() { img.mouseover(); }, false);
				element.addEventListener('mouseout', function() { img.mouseout(); }, false);
				// just in case IE has problems registering the click
				img.addEventListener('click', function() { setTimeout(function() {document.location.href = element.href;}, 0); }, false);
			};
			img.disable = function()
			{
				this.src = this.src.replace(/(-hover|-disabled)*(\.[^.]+)$/, "-disabled$2");
			};
			
			img.enable = function()
			{
				this.src = this.src.replace(/-disabled(\.[^.]+)$/, "$1");
			};
		}
		publick.counter = 0;
		return this;
	}();
	return publick;
}();

// help jQuery out of its sniffing hole
//if (document.body && document.body.attachEvent) { document.defaultView = undefined; }
jQuery.noConflict();

var judah =
{
	panel_settings:
	{
		width: 60,
		height: 34,
		margin: 3,
		maxwidth: 1000,
		minwidth: 600
	},
	arrows:
	{
		helper: function(direction)
			{
				var arrow = document.createElement('img');
				arrow.src = '/images/site/arrows/'+direction+'.gif';
				base2.DOM.bind(arrow);
				SGP.rollover(arrow);
				return arrow;
			},
		left: function() { return judah.arrows.helper('left'); },
		right: function() { return judah.arrows.helper('right'); },
		down: function() { return judah.arrows.helper('down'); },
		up: function() { return judah.arrows.helper('up'); }
	},
	scaleContents: function()
	{
		var actual = {};
		actual.height = document.body.offsetHeight;
		actual.width = document.body.offsetWidth;
		
		var panel = judah.panel_settings;

		var panel_ratio = (panel.width + (2 * panel.margin)) / (panel.height + (2 * panel.margin));

		if (panel.maxwidth)
		{
			if (actual.width > panel.maxwidth) { actual.width = panel.maxwidth; }
		}
		if (panel.minwidth)
		{
			var body = document.querySelector('body');
			panel.minheight = panel.minwidth / panel_ratio;
			var axes = ['width', 'height'];
			for (var i = 0; i < axes.length; i++)
			{
				var axis = axes[i];
				var toosmallklass = 'toosmall-'+axis;
				if (actual[axis] < panel['min'+axis])
				{
					actual[axis] = panel['min'+axis];
					body.classList.add(toosmallklass);
				}
				else
				{
					body.classList.remove(toosmallklass);
				}
			}
		}

		var actual_ratio = actual.width / actual.height;
		
		var scale_axis = panel_ratio < actual_ratio ? 'height' : 'width';
		
		var scale = (actual[scale_axis] / (panel[scale_axis]+ (2 * panel.margin))) / SGP.layout.getEmSize();
		SGP.cookie.write('scale', scale);
		SGP.layout.setScale(scale);
	}
};

SGP.arrows = judah.arrows;

judah.createScrollbars = function(elements)
{
	for (var i = 0; i < elements.length; i++)
	{
		var element = document.querySelector(elements[i]);
		if (!element) { continue; }
		if (element.scrollHeight > element.offsetHeight)
		{
			element.addEventListener('mouseover', function(){ judah.focused = '#'+this.id; }, false);
			element.addEventListener('mouseout', function(){ judah.focused = judah.default_focused; }, false);
			var list = document.createElement('ul');
			// these bindings only needed by Safari 2
			base2.DOM.bind(list);
			if (!element.id)
			{
				if(!judah.scrollcount) { judah.scrollcount = 0; }
				judah.scrollcount++;
				element.id = 'scrollblock-'+judah.scrollcount;
			}
			list.id = element.id + '-scrollbar';
			list.classList.add('scrollbar');
			list.addEventListener('mouseover', function(){ judah.focused = '#'+this.id; }, false);
			list.addEventListener('mouseout', function(){ judah.focused = judah.default_focused; }, false);
			var li_up = document.createElement('li');
			// these bindings only needed by Safari 2
			base2.DOM.bind(li_up);
			var li_up_content = SGP.arrows.up();
			if (li_up_content.disable) { li_up_content.disable(); }
			li_up.appendChild(li_up_content);
			li_up.classList.add('scroll-up');
			li_up.classList.add('scroll-disabled');
			var scrollHelper = function(e, scrollDir)
			{
				var scroller = function() { judah[scrollDir](1); };
				scroller();
				var timer_id = setInterval(scroller, 100);
				e.target.addEventListener('mouseup', function() { clearInterval(timer_id); }, false);
				e.target.addEventListener('mouseout', function() { clearInterval(timer_id); }, false);
			};
			li_up.addEventListener('mousedown', function(e) { scrollHelper(e, 'scrollUp'); }, false);
			var li_down = document.createElement('li');
			// these bindings only needed by Safari 2
			base2.DOM.bind(li_down);
			var li_down_content = SGP.arrows.down();
			li_down.appendChild(li_down_content);
			li_down.classList.add('scroll-down');
			li_down.addEventListener('mousedown', function(e) { scrollHelper(e, 'scrollDown'); }, false);
			list.appendChild(li_up);
			list.appendChild(li_down);
			element.parentNode.appendChild(list);
			//alert('id is '+element.parentNode.id);
		}
	}
};

judah.scroll = function(delta)
{
	judah.focused = judah.focused.replace(/-scrollbar/, '');
	var element = document.querySelector(judah.focused);
	var scrollbar = document.querySelector(judah.focused + '-scrollbar');
	if (!scrollbar) { return; }
	var scroll_amount = typeof delta == 'string' ? element.offsetHeight - SGP.layout.getEmSize() : parseInt(delta * SGP.layout.getEmSize());
	if (delta == 'down') { scroll_amount *= -1; }
	var deepest_scroll = element.scrollHeight - element.offsetHeight;
	var scroll_to = element.scrollTop - scroll_amount;
	if (delta == "top") { scroll_to = 0; }
	if (delta == "bottom") { scroll_to = deepest_scroll; }
	var scrollup = scrollbar.querySelector('.scroll-up');
	var scrolldown = scrollbar.querySelector('.scroll-down');
	scrollup.classList.remove('scroll-disabled');
	scrolldown.classList.remove('scroll-disabled');
	var scrollupimg = scrollup.querySelector('img');
	var scrolldownimg = scrolldown.querySelector('img');
	if (scrollupimg)
	{
		scrollupimg.enable();
		scrolldownimg.enable();
	}
	if (scroll_to >= deepest_scroll )
	{
		scroll_to = deepest_scroll;
		scrolldown.classList.add('scroll-disabled');
		if (scrolldownimg)
		{
			scrolldownimg.disable();
		}
	}
	if (scroll_to <= 0)
	{
		scroll_to = 0;
		scrollup.classList.add('scroll-disabled');
		if (scrollupimg)
		{
			scrollupimg.disable();
		}
	}
	element.scrollTop = scroll_to;;
};

judah.scrollDown = function(delta)
{
	if (delta == 'page') { delta = 'down'; }
	else
	{
		if (!delta) { delta = 1; }
		delta *= -1;
	}
	judah.scroll(delta);
};
judah.scrollUp = function(delta)
{
	if (delta == 'page') { delta = 'up'; }
	else
	{
		if (!delta) { delta = 1; }
	}
	judah.scroll(delta);
};
judah.normaliseMouseDelta = function(event)
{
	// http://adomas.org/javascript-mouse-wheel/
	var delta = 0;
	if (!event) /* For IE. */
	event = window.event;
	if (event.wheelDelta)
	{ /* IE/Opera. */
		delta = event.wheelDelta/120;
		/** In Opera 9, delta differs in sign as compared to IE. */
		// Does it? I'm getting thi the othe way around!
		//if (window.opera) { delta = -delta; }
	}
	else if (event.detail)
	{ /** Mozilla case. */
		/** In Mozilla, sign of delta is different than in IE.
		* Also, delta is multiple of 3.
		*/
		delta = -event.detail/3;
	}
	/** If delta is nonzero, handle it.
	* Basically, delta is now positive if wheel was scrolled up,
	* and negative, if wheel was scrolled down.
	*/
	/** Prevent default actions caused by mouse wheel.
	* That might be ugly, but we handle scrolls somehow
	* anyway, so don't bother here..
	*/
	//if (event.preventDefault)
	event.preventDefault();
	//event.returnValue = false;
	return delta
}
judah.scrollMouse = function(event)
{
	judah.scroll(judah.normaliseMouseDelta(event));
};




window.onerror = function(a,b,c)
{
//	alert(a + '\n' + b + '\n' + c);
}

judah.default_focused = '#content';




var checkScroll = function(e)
{
	if (e.keyCode == 33) { judah.scrollUp('page'); } // page up
	if (e.keyCode == 34) { judah.scrollDown('page'); } // page down
	if (e.keyCode == 35) { judah.scroll('bottom'); } // end
	if (e.keyCode == 36) { judah.scroll('top'); } // home
	if (e.keyCode == 38) { judah.scrollUp(1); } // up arrow
	if (e.keyCode == 40) { judah.scrollDown(1); } // down arrow
	if (e.keyCode == 37) { changeContentPage('previous'); } // left arrow
	if (e.keyCode == 39) { changeContentPage('next'); } // right arrow
}

var checkFontSize = function()
{
	if (!this.fontsize || (this.fontsize != SGP.layout.getEmSize()))
	{
		this.fontsize = SGP.layout.getEmSize();
		judah.scaleContents();
	}
	setTimeout('checkFontSize()', 500);
}

var hideElement = function(element)
{
	element.style.display = 'none';
	return;
	jQuery(element).hide();
}
var showElement = function(element)
{
	jQuery(element).show();
}
var fadeInElement = function(element, turn)
{
	jQuery(element).fadeIn('normal');
};
var fadeOutElement = function(element, turn)
{
	jQuery(element).fadeOut('normal');
};

var pageifyContent = function()
{
	var current_block = 1;
	var nav_content = document.querySelector('#navigation-content');
	if (nav_content) { nav_content.parentNode.removeChild(nav_content); }
	var blocks = document.querySelectorAll('#content .block');
	if (blocks && blocks.item(0))
	{
		var blockslength = blocks.length;
		for (var i = 0; i < blockslength; i++)
		{
			var element = blocks.item(i);
			hideElement(element);
			if (SGP.isSafari2)
			{
				var img = element.querySelector('img');
				var height = img.offsetHeight;
				var width = img.offsetWidth;
				var view_ratio = 45/30;
				var ratio = width/height;
				var width_percentage = (ratio/view_ratio) * 100;
				img.style.width = width_percentage+'%';
				img.style.height = '100%';
			}
		}
		blocks.item(current_block - 1).classList.add('block-current');
		fadeInElement(blocks.item(current_block - 1));
		nav_content = document.createElement('div');
			// these bindings only needed by Safari 2
		base2.DOM.bind(nav_content);
		nav_content.id = 'navigation-content';
		var nav_content_ul = document.createElement('ul');
			// these bindings only needed by Safari 2
			base2.DOM.bind(nav_content_ul);
		nav_content.appendChild(nav_content_ul);
		nav_content_ul.addEventListener('click', function(e)
		{
			var elem = e.target;
			if (elem.tagName.toLowerCase() == 'img')
			{
				elem = elem.parentNode;
			}
			var command = elem.command;
			changeContentPage(command);
		}, false);
		var navContentItem = function(command, text, disabled)
		{
			var nav_content_li = document.createElement('li');
			// these bindings only needed by Safari 2
			base2.DOM.bind(nav_content_li);
			nav_content_li.command = command;
			if (command == current_block)
			{
				nav_content_li.className = 'selected';
			}
			if (disabled)
			{
				nav_content_li.className = 'disabled';
			}
			nav_content_li.id = 'nav-command-'+command;
			var nav_content_li_content = SGP.arrows[text] ? SGP.arrows[text]() : document.createTextNode(text);
			if ((command == 'previous' || command == 'next') && disabled)
			{
				if (nav_content_li_content.disable) { nav_content_li_content.disable(); }
			}

			nav_content_li.appendChild(nav_content_li_content);
			nav_content_ul.appendChild(nav_content_li);
		}
		navContentItem('previous', 'left', current_block == 1);
		for (var i = 0; i < blocks.length; i++)
		{
			blocks.item(i).id = 'block-'+(i+1);
			navContentItem(i+1, i+1);
		}
		navContentItem('next', 'right', current_block == blocks.length);

	document.querySelector('#viewport').appendChild(nav_content);
	}
};

var changeContentPage = function(x)
{
	var current_page = document.querySelector('.block-current');
	if (!current_page) { return false; }
	var current_id = 1;
	if (current_page)
	{
		current_id = current_page.id;
		current_id = Math.floor(current_id.replace(/^block-/, ''));
		if (current_id == x) { return; }
	}
	if (typeof x == 'string')
	{
		if (x == 'next')
		{
		x = current_id + 1;
		
		}
		else if (x == 'previous')
		{
		x = current_id - 1;
		}
	}
	var blocks = document.querySelectorAll('#content .block');
	if (x < 1) { return; }
	if (x > blocks.length) { return; }
	var command_previous = document.querySelector('#nav-command-previous');
	var command_next = document.querySelector('#nav-command-next');
	command_previous.classList.remove('disabled');
	command_next.classList.remove('disabled');
	var command_previous_img = command_previous.querySelector('img');
	var command_next_img = command_next.querySelector('img');
	if (command_previous_img)
	{
		command_previous_img.enable();
		command_next_img.enable();
	}
	if (x == 1)
	{
		command_previous.classList.add('disabled');
		if (command_previous_img)
		{
			command_previous_img.disable();
		}
	}
	if (x == blocks.length)
	{
		command_next.classList.add('disabled');
		if (command_next_img)
		{
			command_next_img.disable();
		}
	}
	
	current_page.classList.remove('block-current');
	fadeOutElement(current_page);
	document.querySelector('#nav-command-'+current_id).classList.remove('selected');
	document.querySelector('#block-'+x).classList.add('block-current');
	fadeInElement(document.querySelector('#block-'+x));
	document.querySelector('#nav-command-'+x).classList.add('selected');
}; 


var init = function()
{
	base2.DOM.bind(document.body);
	
	if (SGP.isSafari2)
	{
		document.body.classList.add('safari2');
	}
	
	
	SGP.config.viewport = document.querySelector('#viewport');

	document.addEventListener('keydown', checkScroll, false);
	
	var meta = document.querySelector('#meta');
	if (meta)
	{
		meta.parentNode.removeChild(meta);
		document.querySelector('#viewport').appendChild(meta);
		var client = meta.querySelector('.client');
		if (client)
		{
			client.firstChild.nodeValue = 'Client: '+ client.firstChild.nodeValue;
		}
	}
	
	var filmstrap  = document.querySelector('#filmstrap');
	if (filmstrap)
	{
		filmstrap.addEventListener('mouseover', function(){this.classList.add('hover');}, false);
		filmstrap.addEventListener('mouseout', function(){this.classList.remove('hover');}, false);
	}


	var illustration = document.querySelector('#illustration');
	if (illustration)
	{
	hideElement(illustration);
	fadeInElement(illustration);
	}
	var filmlinks = document.querySelectorAll('#film .size p a');
	var filmlinkslength = filmlinks.length;
	for (var i = 0; i < filmlinkslength; i++)
	{
		var element = filmlinks.item(i);
		var span = document.createElement('span');
			// these bindings only needed by Safari 2
			base2.DOM.bind(span);
		span.className = 'play';
		var arrow = SGP.arrows.right();
		span.appendChild(arrow);
		element.appendChild(span);
		arrow.attachToContainer(element);
	};
	judah.focused = judah.default_focused;
	pageifyContent();
	judah.scaleContents();
	document.querySelector('html').classList.remove('cloaked');
	//checkFontSize();
	judah.createScrollbars(['#content']);
	judah.createScrollbars(['#navigation-section ul']);
	//window.addEventListener('resize', judah.scaleContents, false);
	window.onresize = judah.scaleContents;
	
/** IE/Opera. */
	//window.onmousewheel = document.onmousewheel = judah.scrollMouse;
	document.addEventListener('mousewheel', judah.scrollMouse, false);
	window.addEventListener('mousewheel', judah.scrollMouse, false);
	window.addEventListener('DOMMouseScroll', judah.scrollMouse, false);
	
	//setTimeout(function(){judah.scaleContents();}, 10);
};


function isSafari(version)
	{
	if ([document.frames].toString()) { return false; }
	var safari_3 = '';
	try { safari_3 = [document.all].toString(); }
	catch(e) {}
	var safari_v = 1;
	if ((document.body && [document.body].toString() == '[object BODY]') || (safari_3 == '[object Collection]') || (safari_3 == '[object HTMLCollection]'))
		{
		// it's safari
		}
	else { return false; }
	if (!version) { return true; }
	if (this.XMLHttpRequest) { safari_v = 2; }
	if (safari_3) { safari_v = 3; }
	if (typeof version == 'number') { return (version == safari_v); }
	return eval (safari_v + version + ';');
	}

if (isSafari())
{
	// Hilarious Safari2 timing issues
	SGP.isSafari2 = true;
	jQuery(document).ready(init);
	var previous_scale = SGP.cookie.read('scale');
	if (previous_scale)
	{
        	SGP.layout.setScale(previous_scale);
	}
}
else
{
	jQuery(document).ready(init);
}