/* UI Functions */
function initUI() {
	$("#global_menu li:not('.separator') a").mouseover(function(){
		$(this).addClass('hover');
	}).mouseout(function() {
		$(this).removeClass('hover');
	}).click(function() {
		if ( !$(this).hasClass('dropdown') ) {
			$("#global_menu li:not('.separator') a, #park_info_btn").removeClass('hover').removeClass('selected');
			hideInfo();
			$(this).addClass('selected');
		}
	});
	
	$("#park_subhead").mouseover(function() { 
		$("#park_info_btn, #caption_text").addClass('caption_hover'); 
	}).mouseout(function() {
		$("#park_info_btn, #caption_text").removeClass('caption_hover'); 
	}).click(function() {
		$("#global_menu li:not('.separator') a").removeClass('hover').removeClass('selected');
		if ( $("#park_info_btn").hasClass('selected') )
			$("#park_info_btn").removeClass('selected');
		else
			$("#park_info_btn").addClass('selected');
		
		if ( $("#story_wrapper").is(":visible") )
			hideInfo();
		else
			showInfo();
	});
	
	$("#story_wrapper").hide().css('left', '10px');
		
	$("#forward").mouseover( function() {
		if ( currentIndex < 69 ) {
			$("#forward .arrow_btn").show();
		}
	}).mouseout( function() {
		$("#forward .arrow_btn").hide();
	});
	
	$("#forward .arrow_btn").click( function() {
		if ( $("#parks").queue("fx").length > 0 ) 	
			$("#parks").stop();
		if ( index + 1 < 70 ) {
			loadPark(index + 1);			
		}
	});
	
	$("#back").mouseover( function() {
		if ( currentIndex > 0 ) {
			$("#back .arrow_btn").show();
		}
	}).mouseout( function() {
		$("#back .arrow_btn").hide();
	});
	
	$("#back .arrow_btn").click( function() {
		if ( $("#parks").queue("fx").length > 0 ) 	
			$("#parks").stop();
		if ( index - 1 >= 0 ) {
			loadPark(index - 1);
		}	
	});
	
	$("#parks img").tooltip();
	
	$("#global_menu #links li a:contains('VIDEO')").click( function() { showGlobal("VIDEO", video_content); } );
	$("#global_menu #links li a:contains('OVERVIEW')").click( function() { showGlobal("OVERVIEW", overview_content); } );
	$("#global_menu #links li:contains('SAVE OUR PARKS')").mouseenter( function() {
		$("#external_links").slideDown();
	}).mouseleave( function() { 
		$("#external_links").slideUp(); 
	});
	
	$("#global_menu #links li a:contains('CLOSURE LIST')").click( function() { 
		showGlobal("CLOSURE LIST", closure_list_content);
		$('.thumb_row').each(function(i) {
			$(this).mouseover( function() {
				$(this).addClass('row_hover');
			}).mouseout( function() {
				$(this).removeClass('row_hover');
			}).click( function(){
				index = i;
				loadPark(i);
			});
		});
	});
	
	$("#global_menu #links li a:contains('SEARCH')").click( function() { 
		if ( $("#searchbar").is(":visible") ) {
			$("#searchbar").hide();
			$(this).removeClass('.selected');
		}
		else {
			$("#searchbar").show();
			$("#search").focus();
		}
	});
	$("#copyright, #parks_wrapper, #park_heading, #thumbs").animate({opacity: 0}, 1);
}



function listClosures() {
	showGlobal("CLOSURE LIST", closure_list_content);
	$('.thumb_row').each(function(i) {
		$(this).mouseover( function() {
			$(this).addClass('row_hover');
		}).mouseout( function() {
			$(this).removeClass('row_hover');
		}).click( function(){
			index = i;
			loadPark(i);
			hideGlobalWindow();
		});
	});
}

function mapClosures() {
	if ( closures == null ) {
		closure_map_content = $("<div id='map_canvas' />");
		
		api_global.getContentPane().html(closure_map_content);
		
		map = new google.maps.Map(document.getElementById('map_canvas'), myOptions);
		
		$(closures).find("marker").each(function(n) {
			var marker = new google.maps.Marker( {
				id: n,
				park_id: $(this).find('park_id').text(), 
				title: $(this).find("name").text(),
				draggable: false,
				position: new google.maps.LatLng($(this).find("lat").text(), $(this).find("lon").text()),
				icon: new google.maps.MarkerImage("http://my.calparks.org/parkclosures/xmark.png"),
				image: $(this).find("image").text(), 
				description: $(this).find('description').text(),
			});
			
			var park_index;
			$(parks).find("node > title").each(function(i) {
				if ( $(this).text() == marker.title ) {
					marker.park_index = i;
				}
			});
			
			google.maps.event.addListener(marker, 'mouseup', function(event) { 
				var id = $(this).attr('park_index');
				loadPark(id);
				$("#map_canvas").css( 'right', '-302px' );
			});
			markers.push(marker);
			marker.setMap(map);
		});
	}
	else {
		// reveal pre-loaded map, reinit	
	}
}

function initScrollBars() {
	var story_scroll = $("#story");
	story_scroll.jScrollPane({contentWidth: 370, showArrows: true });
	api_story = story_scroll.data('jsp');
	
	var thumb_scroll = $("#related_thumbs");
	thumb_scroll.jScrollPane({contentWidth: 200, showArrows: true });
	api_thumbs = thumb_scroll.data('jsp');
	
	var global_scroll = $("#global_scroll_pane");
	global_scroll.jScrollPane({showArrows: true });
	api_global = global_scroll.data('jsp');
}
function refreshScrollbars() {
	var story_height = $(document).height() - 200 - parseInt($("#story_wrapper").css('top').replace('px',''));
	$("#story_wrapper, #related_content").height( story_height );
	$("#related_thumbs").height( story_height - $("#park_links").height() - 60 );	
	$("#story").height( story_height - 30);
	$("#global_content").height( story_height - 70);
	$("#global_scroll_pane").height( story_height - 110 );
	api_global.reinitialise();
	api_thumbs.reinitialise();
	api_story.reinitialise();
	$(".jspScrollable").removeAttr("tabindex");
}

function showGlobal(title, content) {
	hideInfo();
	global_header = "<h1>" + title + "<div style='float:right'><a href='javascript:hideGlobalWindow();'>CLOSE</a></div></h1>";
	$("#global_header").html( global_header );
	
	api_global.getContentPane().html(content);
	$("#global_content").show();
	refreshScrollbars()	
	$("#searchbar").hide();
}

function hideGlobalWindow() {
	api_global.getContentPane().html("");
	// remove embeds:
	$(".video_thumb").remove();
	
	$("#global_content").hide();
	refreshScrollbars();
	$("#global_menu li:not('.separator')").removeClass('hover').removeClass('selected');
}

function hideInfo() {
	$("#story_wrapper").slideUp();
	$("#park_info_btn").removeClass('selected');
	$("#searchbar").hide();
}

function showInfo() {
	hideGlobalWindow();
	$("#story_wrapper").slideDown('fast', function() {
		refreshScrollbars();
	});
	
	$("#background").click(function() {
		$(this).unbind('click');
		hideInfo();
	});
}

/* ANIMATION */
function render(velocity) {
	var t = Math.abs(Math.floor(velocity / f));
	var dir = ( velocity < 0 ) ? -1 : 1;
	
	var x = Math.floor(	$("#parks").css('left').replace('px','')) + (t*velocity) + dir * (.5*f*t*t);
	x = Math.min( Math.max( x, -$("#parks").width() + 110 ), 0 );
	x = Math.floor(x);
	
	var dx = (velocity * 10);
	$("#parks").stop().animate( {
		left : x
	}, 10*t, function() {
		// find snap point, adjust
		var r = Math.abs(x % 110);
		var target = x + r;
		if ( r >= 55 ) target -= 110;		
		$("#parks").animate({ left: target}, 250);
		/* auto select based on left corner thumb position:
		index = -target / 110;		
		loadPark(index);		
		*/
	});
}

function transition( src, fx, author, caption) {
	
	nextTransition = fx;
	
	$("#copyright").html( caption + " <div style='text-align: right;'><em>&copy; " + author + "</em></div>"); 	
	
	var img = $("<img class='background_image' src='" + src + "' />").load(function() { 
		$(currentImage).stop(true, false);
		$(nextImage).stop(true, false);
		$("#loading").hide();	
		if ( current == 0 ) {
			currentImage = $("<div style='position: absolute; left: 0;' />");	
			if ( !$.browser.msie ) {
				currentImage.animate( { opacity: 0 } , 0  ).html(this);
				$("#background").html(this);
				currentImage.animate( { opacity: 1 }, 2000);
			}
			else {
				$("#background").html(this);
			}
			current = 1;
			
			$("#copyright, #parks_wrapper, #park_heading, #thumbs").show().animate({opacity: 1}, 2000);
			
			$("#parks").draggable({
				axis: 'x',
				containment: [ -$("#parks").width() + 110, $(document).height() - 110, 0, $(document).height() - 100 ]
			}).mousedown(function(e) {
				$(this).addClass('parks_down');
				px = e.pageX;
				v = 0;
				if ( $("#parks").queue("fx").length > 0 ) 	
					$("#parks").stop();				
				$(document).mouseup(documentMouseUp).mousemove(draggingMouseMove);
			});
			init = true;
			dataComplete = true;
			waitHideMenu();
						
		}	
		else {
			nextImage = $("<div style='position: absolute;' />").html(this);
			if ( !$.browser.msie ) {
				$(nextImage).animate( { opacity: 0 } , 0  ).html(this);
				$("#background").append(nextImage);
				$(nextImage).animate( { opacity: 1 }, 2000, function() {
					$(currentImage).remove();
					currentImage = nextImage;
				});
			}
			else {
				$("#background").append(nextImage);
				$(currentImage).remove();
				currentImage = nextImage;
			}
		}	
		adjustImage(this);
	});
		
}

function adjustImage(img) {
	if ( $(document).width() > $(document).height() ) {
		
		var img_w = $(document).width();
		var img_h = img_w * $(img).height() / $(img).width();

		// if img height < doc height, scale to height
		if ( img_h < $(document).height() ) 
			$(img).removeAttr( 'width' ).attr( 'height', $(document).height() );
		else
			$(img).removeAttr( 'height' ).attr( 'width', $(document).width() );
		
	}
	else {
		
		var img_h = $(document).height();
		var img_w = img_h * $(img).width() / $(img).height();

		// if img height < doc height, scale to height
		if ( img_w < $(document).width() ) 
			$(img).removeAttr( 'height' ).attr( 'width', $(document).width() );
		else
			$(img).removeAttr( 'width' ).attr( 'height', $(document).height() );
		
	}
	
	var dx = .5 * ($(document).width() - $(img).width());
	var dy = .5 * ($(document).height() - $(img).height());
	$(img).css('left', dx + 'px').css('top', dy + 'px');
	
	refreshScrollbars();
}

function adjustBackground() {
	$("#background img").each( function() {
		
		if ( $(document).width() > $(document).height() ) {
		
			var img_w = $(document).width();
			var img_h = img_w * $(this).height() / $(this).width();
	
			// if img height < doc height, scale to height
			if ( img_h < $(document).height() ) 
				$(this).removeAttr( 'width' ).attr( 'height', $(document).height() );
			else
				$(this).removeAttr( 'height' ).attr( 'width', $(document).width() );
			
		}
		else {
			
			var img_h = $(document).height();
			var img_w = img_h * $(this).width() / $(this).height();
	
			// if img height < doc height, scale to height
			if ( img_w < $(document).width() ) 
				$(this).removeAttr( 'height' ).attr( 'width', $(document).width() );
			else
				$(this).removeAttr( 'width' ).attr( 'height', $(document).height() );
			
		}
		var dx = .5 * ($(document).width() - $(this).width());
		var dy = .5 * ($(document).height() - $(this).height());
		$(this).css('left', dx + 'px').css('top', dy + 'px');
	});	
	
	refreshScrollbars();
	
}

function documentMouseUp(e) {
	if ( Math.abs(v) < .25 ) {
		index = Math.floor( (e.pageX - parseInt($("#parks").css('left').replace('px'))) / 110 );
		loadPark( index );
	}
	else render(v);
	$("#parks").removeClass('parks_down');
	$(document).unbind('mousemove', draggingMouseMove).unbind('mouseup', documentMouseUp);
}

function draggingMouseMove(e) {
	v = (e.pageX - px) / 4;
	px = e.pageX;
}

var wait_id;
var monitor_id;
function waitHideMenu() {	
	wait_id = setTimeout("hideParkMenu()", 2000);
	waiting = true;
	$(document).mousemove(checkMousePosition);
	$("#park_nav, #background, #story_wrapper, #global_content").click(forceHide);
		
}
function forceHide() {
	clearTimeout(wait_id);
	hideParkMenu();
	$("#park_nav, #background, #story_wrapper, #global_content").unbind('click', forceHide);
}
function hideParkMenu() {
	//$("#parks_wrapper").animate( { bottom: -110 }, 1000 );
	$("#parks_wrapper").animate({ bottom: -110 }, 500);
	$("#copyright").animate({ bottom: 5 }, 500);
	$("#thumbs").animate({ bottom: 0 }, 500);
	
	menuVisible = false;
}

var waiting = false;
var menuVisible = true;
function showParkMenu() {
	// var dt = 500 * (parseFloat($("#parks_wrapper").css('bottom').replace('px','')) / -110 );
	//$("#parks_wrapper").animate( { bottom: 0 }, dt );
	$("#parks_wrapper").animate({ bottom: 0 }, 500);
	$("#copyright").animate({ bottom: 115 }, 500);
	$("#thumbs").animate({ bottom: 105 }, 500);
	
	menuVisible = true;
}

function checkMousePosition(e) {
	var y = e.pageY;
	if ( menuVisible ) {
		if ( y > $(document).height() - 170 ) {
			clearTimeout(wait_id);
			waiting = false;
		}
		else if ( !waiting ) {
			waitHideMenu();
		}
	}
	else {
		if ( y > $(document).height() - 170 ) {
			clearTimeout(wait_id);
			showParkMenu();	
		}
	}
}




// MAP VISIBILITY
//$("#cspf").click( function() {
		
		/*// show mini map
		if ( $("#map_canvas").css( 'right' ) == '-302px' ) {
			$("#map_canvas").css( 'right', '0px' );
		}
		else
			$("#map_canvas").css( 'right', '-302px' );
		*/
	//});