/*
 * Javascript that manages the list view of the calendar.
 * Scrolling works similarly to the news scroll on the home page, except it works on 
 * table size (px) rather than number of rows, as row height may vary greatly.
 */
$(document).ready(function()
{
	//Make sure we are at the top of the scroll to start with - so it still works 
	//on the back button
	$('#calendarTableContainer').animate({scrollTop: 0}, 0);
	
	//Disable browser div scroll bars and show the scroll arrows instead
	$('#calendarTableContainer').css({"overflow":"hidden"});
	
	img_scroll_up = '/i/social/club-events-scroll-up.png';
	img_scroll_up_ghost = '/i/social/club-events-scroll-up-ghost.png';
	
	img_scroll_down = '/i/social/club-events-scroll-down.png';
	img_scroll_down_ghost = '/i/social/club-events-scroll-down-ghost.png';
		
	$('#calendar-upcoming').show();
	
	$('#calendarContainer .scrollButtons').html('<a href="#" class="listScrollUp" title="Scroll up"></a> <a href="#" class="listScrollDown" title="Scroll down"></a>');
	

		
	//Initiate parameters
	// - position where the table starts
	var int_list_min = $('#calendarList').offset().top;	

	// - position where the table ends
	var int_list_max = int_list_min + $('#calendarList').height();
	
	// - the length of the table
	var int_list_size = $('#calendarList').height();	

	// - size of the viewable area
	var int_view_size = $('#calendarTableContainer').height();

	// - the position where the viewable area ends
	var int_view_max = int_list_min + int_view_size;

	// - the amount of px to scroll on each click
	var int_amount_scroll = 300;

	// - the current table position selected to appear at the top of viewable area
	var int_list_cur = int_list_min;	
	
	var int_row_offset = 0;
 
	//Scroll to the next upcoming event
	go_to_upcoming();
	
	//IE6/7 Bug - absolute position elements don't get moved after new element insert
	//The only work around is to hide and re-show the absolute position elements, in
	//this case the background image
	$('#group-section > .background-image').css("display","none");
	$('#group-section > .background-image').css("display","block");		

	//User clicked on "upcoming" link
	$('#calendar-upcoming').click(function()
	{		
		//Go back to the top of the list
		$('#calendarTableContainer').animate({scrollTop: + '0px'}, 0);
		int_list_cur = int_list_min;			
				
		//Scroll to next upcoming event
		go_to_upcoming();
		return false;
	});										   

	//Go the the next upcoming event
	function go_to_upcoming() {

		if ($('#modified_tr').length > 0)
		{
			//A row has been modified so navigate to this rather than the upcoming events
			var int_first_row_offset = $("#calendarList > tbody > tr:first").offset().top;	
			var int_modified_row_offset = $('#modified_tr').offset().top;				
			
			//Modified record is after the upcoming row
			var int_offset_difference = int_modified_row_offset - int_first_row_offset;
			var int_number_scrolls = Math.floor(int_offset_difference / int_amount_scroll);
			if (int_number_scrolls < 1)
			{					
				int_row_offset = int_first_row_offset;						
			}
			else
			{
				int_row_offset = int_first_row_offset + (int_amount_scroll * int_number_scrolls);
			}
			
			//Remove the id so next time the user is navigated to the upcoming events
			$('#modified_tr').attr("id", "modified_tr_done");
		}		
		else if ($('#viewed_tr').length > 0)
		{
			//A row has been viewed so navigate to this rather than the upcoming events
			var int_first_row_offset = $("#calendarList > tbody > tr:first").offset().top;	
			var int_viewed_row_offset = $('#viewed_tr').offset().top;				
			
			//Viewed record is after the upcoming row
			var int_offset_difference = int_viewed_row_offset - int_first_row_offset;
			var int_number_scrolls = Math.floor(int_offset_difference / int_amount_scroll);
			if (int_number_scrolls < 1)
			{					
				int_row_offset = int_first_row_offset;						
			}
			else
			{
				int_row_offset = int_first_row_offset + (int_amount_scroll * int_number_scrolls);
			}
			
			//Remove the id so next time the user is navigated to the upcoming events
			$('#viewed_tr').attr("id", "viewed_tr_done");
		}				
		else if ($('#upcoming_tr').length)
		{
			int_row_offset = $('#upcoming_tr').offset().top;	
		}

		if (int_row_offset > int_list_cur)
		{		
			//There is a row flagged as upcoming, so scroll to it
			var int_scroll = int_row_offset - int_list_min;
			int_list_cur = int_row_offset;										
			$('#calendarTableContainer').animate({scrollTop: '+=' + int_scroll + 'px'}, 500);
		}
		
		//Grey out scroll arrows if no where to scroll to
		toggle_scroll_icons();
	};

	//Scroll list up
	$('.listScrollUp').click(function()
	{
		if(int_list_cur > int_list_min)
		{		
			int_list_cur = int_list_cur - int_amount_scroll;
			$('#calendarTableContainer').animate({scrollTop: '+=' + -int_amount_scroll + 'px'}, 500 );						
		}
		toggle_scroll_icons();
		return false;
	});

	//Scroll list down
	$('.listScrollDown').click(function()
	{
		if((int_list_cur + int_view_size) < int_list_max && int_list_max > int_view_max)				
		{
			int_list_cur = int_list_cur + int_amount_scroll;
			$('#calendarTableContainer').animate({scrollTop: '+=' + int_amount_scroll + 'px'}, 500 );						
		}
		toggle_scroll_icons();
		return false;
	});
	
	//Enables and disables scroll icons as required
	function toggle_scroll_icons()
	{
		// Disable up scrolls if:
		// - the position of the top of the viewable part of the list less or equal to the start list position (the start of the list is already being displayed)
		if(int_list_cur <= int_list_min)
		{
			$('.listScrollUp').css("background-image", "url("+img_scroll_up_ghost+")"); 
		}
		else
		{
			$('.listScrollUp').css("background-image", "url("+img_scroll_up+")"); 		
		}

		// Disable down scrolls if:
		// - the list size is smaller than the view size so it all fits on without scrolling, or
		// - the position of the bottom of the viewable part of the list greater or equal to the list size (the end of the list is already being displayed)
		if (int_list_size < int_view_size ||
			int_list_cur + int_view_size >= int_list_max)
		{
			$('.listScrollDown').css("background-image", "url("+img_scroll_down_ghost+")"); 			
		}
		else
		{
			$('.listScrollDown').css("background-image", "url("+img_scroll_down+")"); 						
		}
	}	
});