/*	Zegelin.com
	Javascript to view a big version of a picture

	NOTE: Uses the jQuery library

	This code is part of the jQuery ideas library. It has been modified
	by me to fix some minor problems related to 'view_big_note'.
	
	Source code - copyright 2011, Chris Zegelin, all rights reserved
*/

$(document).ready(
	function(){
	
		$("body").append(
			"<table id='view_big_background'><tr><td align='center'>Loading...</td></tr></table>"+
			"<table id='view_big_img'><tr><td align='center'>Click to close<br/><br/>"+
			"<img src='' /><br/><br/><span id='view_big_desc'></span></td></tr></table>"+
			"<span id='view_big_note' style='display:none'>Click for larger view</span>"
		);
		
		// The cursor changes to the little hand
		$( ".view_big" ).css( {cursor:"pointer"} );
		
		// The 'click me' note is visible with mouse over
		$( ".view_big" ).mouseover(
			function( e ){
				$( "#view_big_note" ).show();
				$( "#view_big_note" ).css( {left:e.pageX+10, top:e.pageY+10} );
			}
		);
		
		// The 'click me' note follows the cursor
		$( ".view_big" ).mousemove(
			function( e ){
				$( "#view_big_note" ).css( {left:e.pageX+10, top:e.pageY+10} );
			}
		);
		
		// The 'click me' note is hidden after mouse out
		$( ".view_big" ).mouseout(
			function(){
				$( "#view_big_note" ).hide();
			}
		);
		
		// Click on the small image to see large image
		$( ".view_big" ).click(
			function(){
				$( "#view_big_background" ).css( {opacity:0.75} ).fadeIn(100);
				$( "#view_big_img, #view_big_background" ).css( {height:$(window).height()} );
				$( "#view_big_img img" ).attr("src", $(this).attr( "src" ).replace( "-S", "" ));
				$( "#view_big_img img" ).load(
					function(){
						$( "#view_big_img" ).fadeIn(500);	// fast,slow,normal or time in miliseconds
					}
				)
				document.getElementById("view_big_desc").innerHTML = $(this).attr( "desc" );
			}
		);

		// Click on the large image to close
		$( "#view_big_img" ).click(
			function(){
				$( "#view_big_background" ).hide();
				$( "#view_big_img" ).fadeOut(500);
			}
		);
		
	}
)

