$(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() {
	$('.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', '165px');
		}
	});
	$('.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');
	}});

	$('.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');
	}

	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');
	}
}

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();
	$('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');
}