$(document).ready(function () {
	$(document).pngFix();
	if($.browser.safari) {
		window.setTimeout(function(){
			pageStart();
		}, 10);
	}
	else {
		pageStart();
	}

	$('#thumbs,#names')
		.mouseover(function(){$('#thumbs').addClass('dohover');})
		.mouseout(function(){$('.dohover').removeClass('dohover');});

	$('.stills').hide();

	$('#project_link a').click( function()
	{
		if ($(this).hasClass("stills"))
		{
			$('#movie').css('visibility','');
			// stop realmovie
			stopMovie();
			$('#realmovie').hide();
			// stop makingof
			stopMovie('makingof');
			$('#makingof').hide();

			cancelRotate = false;
			rotateImage();

			$('.movie').removeClass('project_link_hilite');
			$('.makingof').removeClass('project_link_hilite');
			$('.stills').addClass('project_link_hilite');

			$('.movie').show();
			$('.makingof').show();
			$('.stills').hide();

			// can't upgrade jquery without breaking scrollers so can't use switchClass
			$('#moviecontrols').addClass('moviecontrols_stripes');
			$('#moviecontrols').removeClass('moviecontrols_blank');

		}
		else if ($(this).hasClass("makingof"))
		{
			// stop realmovie
			stopMovie();
			$('#realmovie').hide();

			$('#movie').css('visibility','hidden');
			$('#makingof').show();

			$('.stills').removeClass('project_link_hilite');
			$('.movie').removeClass('project_link_hilite');
			$('.makingof').addClass('project_link_hilite');

			$('.movie').show();
			$('.makingof').show();
			$('.stills').hide();

			// can't upgrade jquery without breaking scrollers so can't use switchClass
			$('#moviecontrols').addClass('moviecontrols_blank');
			$('#moviecontrols').removeClass('moviecontrols_stripes');

			playMovie('makingofmovie');
		}
		else
		{
			// stop makingofmovie
			stopMovie('makingofmovie');
			$('#makingof').hide();

			//$('#project_link a.stills').text('> view stills');
			//$('#project_link a.movie').text('play movie');
			$('#movie').css('visibility','hidden');
			$('#realmovie').show();

			$('.stills').removeClass('project_link_hilite');
			$('.makingof').removeClass('project_link_hilite');
			$('.movie').addClass('project_link_hilite');

			$('.movie').hide();
			$('.stills').show();

			// can't upgrade jquery without breaking scrollers so can't use switchClass
			$('#moviecontrols').addClass('moviecontrols_blank');
			$('#moviecontrols').removeClass('moviecontrols_stripes');

			playMovie();
			//window.setTimeout(playMovie, 500);
		}
		return false;
	});

	$('#overlay').click(function(){$(this).hide();$('#project_link').show();$('#movie').css('visibility','');stopMovie();rotateImage();});
	$('#realmovie').click(function(){return false;});

	if($.browser.msie) {
		$('.still').css({top: '0px', left: '0px'});
	}



	// director project pages only: play movie immediately instead of showing slideshow
	if(  $('body').attr('class') == 'pg_director_proj'  )
		$('a.movie').click();
	else
		rotateImage();


	$('a[href=#map]').click(function(){
		if($(this).text() == 'Show directions') {
			if($('#map').size() > 0) {
				if($('#map iframe').size() > 0) {
					$('#map').show();
					$('.map_photo').hide();
				}
				else {
					w = $('.map_photo').width();
					h = $('.map_photo').height();
					$('#map').css({width: w, height: h, marginBottom: '1.5em'}).show();
					$('.map_photo').hide();
					addr = $('#map').html();
					$('#map').html('<iframe width="' + w + '" height="' + h + '" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="' + addr + '&amp;output=embed"></iframe>');
				}
			}
			//$(this).remove();
			$(this).text('Go back');
		}
		else {
			$(this).text('Show directions');
			$('#map').hide();
			$('.map_photo').show();
		}
 		$(this).css('color', '#dcbd92');
// 		$('#map').css('margin-bottom', '0px');
		return false;
	});

	$('.bar.bottom').css({position: 'absolute',top: '640px', left: '55px', height: '1px', margin: '0px', width: '881px', color: 'red'});
});

function pageStart() {


	// Initialize iScroll if it exists
	if (typeof iScroll == 'function') {
		if ($('#thumbs').length) {
			var scroller_left;
			var scroller_thumbs;
			
			// Add scrolling to the left list
			scroller_left = new iScroll('projects', {onScrollEnd: function() { scroller_thumbs.scrollTo(0, this.y); }});
	
			// Add scrolling to the main content section
			scroller_thumbs = new iScroll('project_content', {onScrollEnd: function() { scroller_left.scrollTo(0, this.y); }});
			
			document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
		}
		else if ($('#projects').length) {
			// Add scrolling to the left list
			var scroller_left = new iScroll('projects');
			document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
			
		}
		return;
	}
	
	$('.scroller').parent().mousewheel(function(event, delta) {
		
		if ($('.archive_scroller').length)
			mouseScroll(event, $('.scrollbar', this), $('.thumb', this), $('.archive_scroller'), 1, -delta);
		else
			mouseScroll(event, $('.scrollbar', this), $('.thumb', this), $('.scrollbar', this).siblings('.scroller'), 1, -delta);
		return false;
	});
	/*
	$('#scroller').parent().mousewheel(function(event, delta) {
		mouseScroll(event, $('#scroller', this), $('#thumb'), $('.archive_scroller'), 1, -delta);
		return false;
	});
	*/

	$('.scroller').each(function(){
		if($(this).height() > $(this).parent().height()) {
			$(this).before($('<div class="scrollbar"><div class="thumb"></div></div>'));
		}
		else {
			$('#projects.hascontent ul,#projects.hascontent ul li a').css('width', '190px');
		}
	});
	$('.scrollbar').each(function(){$(this).css('height', $(this).parent().height())});

	$('.thumb').draggable({axis: 'y', containment: 'parent', drag: function(e,ui){
		var soffset = $(this).parent('.scrollbar').offset();
		var one_range = ($(this).parent('.scrollbar').height() - ($(this).height()*2) );
		var off = Math.floor((ui.position.top - soffset.top ) / one_range * ($(this).parent().siblings('.scroller').height() - $(this).parent('.scrollbar').height()));
		$(this).parent().siblings('.scroller').css('margin-top', '-' + (off) + 'px');
		
		// Scroll right column on drag if set
		if ($('.archive_scroller').length) {
			var soffset = $(this).parent('.scrollbar').offset();
			var one_range = ($(this).parent('.scrollbar').height() - ($(this).height()*2) );
			var off = Math.floor((ui.position.top - soffset.top ) / one_range * ($('.archive_scroller').height() - $(this).parent('.scrollbar').height()));
			$('.archive_scroller').css('margin-top', '-' + (off) + 'px');
		}
	}});

	$('.scroller .selected').each(function(){
		if($(this).parents('.scroller').height() > $(this).parents('.scroller').parent().height()) {
			var offset = $(this).offset();
			var scrolleroff = $(this).parents('.scroller').offset();
			var targetOffset = - (offset.top - scrolleroff.top);
			targetOffset = Math.max(targetOffset, -($(this).parents('.scroller').height() - $(this).parents('.scroller').parent().height()));
			$(this).parents('.scroller').css('margin-top', (targetOffset+200) + 'px');
			$(this).parents('.scroller').animate({marginTop: targetOffset}, 1000);
			if($.browser.msie) {
				var scrolloffset = scrolleroff.top + (-targetOffset) / $(this).parents('.scroller').height() * ($(this).parents('.scroller').parent().height() - $('.scroller').siblings('.scrollbar').children('.thumb').height()) - scrolleroff.top;
				$(this).parents('.scroller').siblings('.scrollbar').children('.thumb').css({position: 'absolute', top: 0});
			}
			else {
				var scrolloffset = scrolleroff.top + (-targetOffset) / $(this).parents('.scroller').height() * ($(this).parents('.scroller').parent().height() - $('.scroller').siblings('.scrollbar').children('.thumb').height());
				$(this).parents('.scroller').siblings('.scrollbar').children('.thumb').css({position: 'absolute', top: scrolleroff.top});
			}

			$(this).parents('.scroller').siblings('.scrollbar').children('.thumb').animate({top: scrolloffset}, 1000);
		}
	});

	$('.scrollbar').mousedown(function(e){
		clickScroll(e, $(this), $('.thumb', this), $(this).siblings('.scroller'), 1);
	});
	/*
	$('#scroller').mousedown(function(e){
		clickScroll(e, $(this), $('#thumb'), $('.archive_scroller'), 1);
	});
	*/

	//$('#thumbs').wrap('<div id="foo" class="archive_scroller" style="border:1px solid black;"></div>');
	/*
	$('#thumb').draggable({axis: 'y', containment: 'parent', drag: function(e,ui){
		var soffset = $('#scroller').offset();
		var one_range = ($('#scroller').height() - ($(this).height()*2) );
		var off = Math.floor((ui.position.top - soffset.top ) / one_range * ($('.archive_scroller').height() - $('#scroller').height()));
		$('.archive_scroller').css('margin-top', '-' + (off) + 'px');
	}});
	*/
	formActivate();
}

function highlight(el, id){
	$('#thumbs').addClass('dohover');
	$('.project_' + id).addClass('ishover');
}

function unhighlight(el, id){
	$('.dohover').removeClass('dohover');
	$('.ishover').removeClass('ishover');
}

function clickScroll(e, bar, thumb, scrollthing, scrolltype){
	y = e.clientY;
	offset = $(thumb).offset();
	soffset = $(bar).offset();
	top = offset.top - soffset.top;
	y = y - soffset.top;
	thumbpos = top + $(thumb).height();
	var newtop = false;
	if(y > thumbpos) {
		// move down a bit
		if(parseInt($(thumb).css('top'))) {
			newtop = parseInt($(thumb).css('top')) + 50;
		}
		else {
			newtop = soffset.top + 50;
		}
	}
	if(y < top) {
		// move up a bit
		if(parseInt($(thumb).css('top'))) {
			newtop = parseInt($(thumb).css('top')) - 50;
		}
		else {
			newtop = soffset.top + $(bar).height() - 50;
		}
	}
	if(newtop) {
		newtop = Math.min(newtop, soffset.top + $(bar).height() - $(thumb).height());
		newtop = Math.max(newtop, soffset.top);
		$(thumb).css('top', newtop + 'px');
		$(thumb).css('position', 'absolute');
	}
	else {
		$(thumb).css('top', newtop + 'px');
		$(thumb).css('position', 'absolute');
	}

	offset = $(thumb).offset();
	if(scrolltype ==1 ) {
		var one_range = ($(bar).height() - $(thumb).height());
		var off = Math.floor((offset.top - soffset.top ) / one_range * ($(bar).siblings('.scroller').height() - $(bar).height()));
		$(scrollthing).css('margin-top', '-' + Math.abs(off) + 'px');
	}
	else {
		var soffset = $('#scroller').offset();
		var one_range = ($('#scroller').height() - $('#thumb').height()) / (Math.ceil($('.archive_scroller img').size() / 4) - 5);
		var off = Math.floor((offset.top - soffset.top)/ one_range);
		$('.archive_scroller').css('margin-top', '-' + (76 * off) + 'px');
	}
}

function mouseScroll(e, bar, thumb, scrollthing, scrolltype, delta){

	var distance = ($(bar).height() * delta * 50) / $(scrollthing).height();

	offset = $(thumb).offset();
	if (!offset)
		return;

	soffset = $(bar).offset();
	top = offset.top - soffset.top;
	thumbpos = top + $(thumb).height();
	offset = $(thumb).offset();


	y = (delta > 0 ? thumbpos + 1 : 0);

	var newtop = false;
	if(y > thumbpos) {
		// move down a bit
		if(parseInt($(thumb).css('top'))) {
			newtop = parseInt($(thumb).css('top')) + distance;
		}
		else {
			newtop = soffset.top + distance;
		}
	}
	if(y < top) {
		// move up a bit
		if(parseInt($(thumb).css('top'))) {
			newtop = parseInt($(thumb).css('top')) + distance;
		}
		else {
			newtop = soffset.top + $(bar).height() + distance;
		}
	}
	if(newtop) {
		newtop = Math.min(newtop, soffset.top + $(bar).height() - $(thumb).height());
		newtop = Math.max(newtop, soffset.top);
		$(thumb).css('top', newtop + 'px');
		$(thumb).css('position', 'absolute');
	}

	if(scrolltype ==1 ) {

		var one_range = ($(bar).height() - $(thumb).height());
		var off = Math.floor((offset.top - soffset.top ) / one_range * ($(bar).siblings('#scroller').height() - $(bar).height()));

		off = (off * $(scrollthing).height()) / $(bar).height();

		$(scrollthing).css('margin-top', '-' + Math.abs(off) + 'px');
		//$(scrollthing).css('margin-top', '-' + Math.abs(off) + 'px');
	}
	else {
		var soffset = $('#scroller').offset();
		var one_range = ($('#scroller').height() - $('#thumb').height()) / (Math.ceil($('.archive_scroller img').size() / 4) - 5);
		var off = Math.floor((offset.top - soffset.top)/ one_range);
		$('.archive_scroller').css('margin-top', '-' + (76 * off) + 'px');
	}
}

var cancelRotate = false;

function rotateImage(){
	if(cancelRotate) return;


	//$('.stills').addClass('project_link_hilite');


	if($('.still:visible').size() == 0) {
		$('.still:first').show();
	}
	var img = $('.still:visible:first');
	if(img.next().size() > 0) {
		next = img.next();
	}
	else {
		next = $('.still:first');
	}

	$(img).css('z-index', 10);
	$(next).css('z-index', 9);
	$(next).show();

	$(img).hide();

	if($('.still:visible').size() == 0) {
		$('.still:first').show();
	}

	$('a[href=#' + $(next).attr('id') + ']').addClass('selected');
	if(!cancelRotate){
		rotator = window.setTimeout(rotateImage, 3000);
	}
}

var logintimeout = null;

function formActivate() {
	$('#tKeyword')
		.focus(function(){
			labeltext = $('label[for="tKeyword"]').html();
			if($('#tKeyword').val() == labeltext) {
				$('#tKeyword').val('').css('font-weight', 'normal');
				$('#tKeyword').val('').css('color', '#fff');
			}
			$(this).parents('form').find('.submitbutton').show();
		})
		.blur(function(){
			labeltext = $('label[for="tKeyword"]').html();
			if($('#tKeyword').val() == '') {
				$('#tKeyword').val(labeltext).css('font-weight', 'bold');
				$('#tKeyword').val(labeltext).css('color', '#fff');
				$(this).parents('form').find('.submitbutton').hide();
			}
		});

	$('#tUser')
		.focus(function(){
			window.clearTimeout(logintimeout);
			$('.loginhidden').show();
			$('label[for="tUser"]').html('username');
		})
		.blur(function(){
			if($(this).val() == '') {
				logintimeout = window.setTimeout(hidelogin, 500);
			}
		});

	$('#tPass')
		.focus(function(){
			window.clearTimeout(logintimeout);
			$('.loginhidden').show();
		})
		.blur(function(){
			if($(this).val() == '') {
				logintimeout = window.setTimeout(hidelogin, 500);
			}
		});

	$('#loginsubmit')
		.focus(function(){
			window.clearTimeout(logintimeout);
			$('.loginhidden').show();
		})
		.blur(function(){
			logintimeout = window.setTimeout(hidelogin, 500);
		});

	hidelogin();
}

function hidelogin() {
	$('.loginhidden').hide();
	$('label[for="tUser"]').html('&nbsp; client login');
}