$().ready(function(){
	$(document).pngFix(); 	// fix ie 6 png issue

	// CONTROL VARIABLES
	var elements_per_screen = 3;	// number of elements on screen at same time (rows, if you will)
	var speed = 400;				// scroll speed in milliseconds (smaller value = faster)


	/***********************************************************************************/
	/**  INSERT FUNCTIONALITY FOR FLASH BELOW                                         **/
	/***********************************************************************************/

	/***********************************************************************************/
	/***********************************************************************************/
	/***********************************************************************************/
		

	/** DO NOT CHANGE BELOW THIS LINE **************************************************/
	/** DO NOT CHANGE BELOW THIS LINE **************************************************/
	/** DO NOT CHANGE BELOW THIS LINE **************************************************/
	
	// declare variables
	var current_pos, increment, num_elements, max_scroll_position;
	
	// correct ie 6 png hack for other browsers
	if($.browser.msie && parseInt($.browser.version) <= 6){
		$(".overlay").css({
			'display' : 'none',
			'visibility' : 'visible'
		})
	}

	// main function to call
	// pos = position of item you'd like to open TO.  default = 0.
	function open_overlay(pos){
		init_scroll();
		toggle_button();
		if(!pos && pos != 0) return;
		if(pos > max_scroll_position){}		
		current_pos = pos;
		newpos = -(current_pos * increment);
		scrollTo(newpos);
		var selected_element = $("#thumbnails .item:eq(" + pos + ")");
		video_click( selected_element );
	}
	
	// initialize - runs once 
	var initialized = false;

		$(".overlay").show(); // must be done to count elements and initialize object
		if(initialized) return;
		current_pos = 0;
		increment = $("#thumbnails .item:first").outerWidth(true);
		num_elements = $("#thumbnails .item").size();
		max_scroll_position = num_elements - elements_per_screen;	// number of scrolling elements
		$("#thumbnails .item:last").css({"margin" : 0});
		$("#scrollContainer").width( ($("#thumbnails .item:first").outerWidth(true) * (elements_per_screen - 1)) + $("#thumbnails .item:first").width());
		$("span.numberVideos").text($("#thumbnails .item").size());
		$("#thumbscroll").css({'visibility' : 'visible'});
		initialized = true;
	
	
	// close button
	$(".overlay a.close").click(function(){
		$(".overlay").hide();
		return false;
	});

	//open button
	$("#showoverlay").click(function(){
		var pos = $("#showoverlay").attr("href").substring(1);
		open_overlay(parseInt(pos));
		return false;
	});
	
	// click handler for thumbnail items
	$("#thumbnails .item")
	.click(
		function(){
			video_click($(this));
		}		
	)
	// add overlay image for selected state
	.append(
		'<div class="highlight"><img src="../images/video/video_overlay.png" width="69" height="48" /></div>'
	)
	

	// previous and next buttons
	$("#prev").click(function(){
		if (!(goto_value = get_prev_position())) return false;		
		scrollTo(goto_value);
		return false;
	});	
	$("#next").click(function(){
		if (!(goto_value = get_next_position())) return false;
		scrollTo(goto_value);
		return false;	
	});
	
	// scroller helper functions
	function scrollTo(pos){	// scroll to specified coordinates
		$("#thumbnails").stop().animate({
			marginLeft: pos
		},speed);
		toggle_button();
	}
	function get_prev_position(){ // returns next position to animate to, making appropriate changes as necessary
		if(current_pos == 0){
			return false;
		}
		newpos = -(current_pos * increment) + increment;
		current_pos--;
		return newpos + 'px';
	}
	function get_next_position(){ // returns next position to animate to, making appropriate changes as necessary
		if(current_pos >= max_scroll_position){ 
			return false;
		}
		newpos = -(current_pos * increment) - increment;
		current_pos++;
		return newpos + 'px';
	}
	function toggle_button(which, status){ // hides prev/next arrows if there is no prev/next
		$("#thumbscroll a.button").css({'visibility':'visible'})
		
		if(current_pos >= max_scroll_position){
			$("#next").css({'visibility':'hidden'})
		}	
		if(current_pos == 0){
			$("#prev").css({'visibility':'hidden'})
		}
	}
	function video_click(item){
		// highlight selected item
		$("#thumbnails .item").removeClass('highlighted');
		item.addClass("highlighted");

		// change image for patient videos, adjust header image if found
		if(item.attr("patient")){
			
			$(".overlay h1 img:eq(0)").attr({
				src: "../images/video/hdr_patient_video.gif",
				width: 174
			});
			
			if($(".overlay h1 img").size() < 2) {
				$(".overlay h1").append('<img />');	
			}
			
			
			$("h1 img:eq(1)").attr({
				src: "../images/video/hdr_patient_" + item.attr("patient") + '.gif'
			});
		}else{
			$(".overlay h1 img:eq(0)").attr({
				src: "../images/video/hdr_dr_crim.gif",
				width: 331
			});
			
			$(".overlay h1 img:eq(1)").attr({
				src: "../images/video/hdr_patient_null.gif"
				
			});
		}
		
		// convey flv info to flash file
		var flv = item.attr("flv"); // grab flv attribute from div.item tag in page
		var isit = item.attr("isit"); // grab flv attribute from div.item tag in page  //nu!
		var index = 10; // grab index of this element (starts with 0, useful if you prefer to automate the flv file by using a numbered naming convention)
		goFlashVideo(index, flv);
		
	}

});