/**
 * Geck image box viewer
 */
 
//on ready
$(function() {
	//get all thumb-nail images in link to large image
  //var reqexp = new RegExp('(jpg,jpeg,png,gif)$','i'); 
	var $images = $('a[href$=jpg] img, a[href$=jpeg] img, a[href$=png] img, a[href$=gif] img');   
	//var $images = $('a img').filter(function (index) {
	//	return $(this).parent().attr('href').search(reqexp);
	//});
	
	//create image boxes from image links 
	$images.each( function() {
		//objects
		var $image = $(this);
		var $link  = $(this).parent();
		//image sources
		var srcView  = $link.attr('href');
		var srcThumb = $image.attr('src');
		
		$link.attr('href','#');
		$link.click( function() {
			if (geckImgBox.isUsed) { return false; }
			
			geckImgBox.isUsed = true;
			//img object
			var img = new Image();
			//on img load
			$(img).load(function() {
				//turn off progress bar
				geckImgBox.progressOff( $link );
				geckImgBox.showImage( $link, img);
				geckImgBox.isUsed = false;
			});
			//on error
			$(img).error(function () {
				geckImgBox.progressOff( $link );
				geckImgBox.isUsed = false;
			});
			
			//set image view source, and switch progress-bar on 
			img.src = srcView;
			//geckImgBox.progressOn( $link );
			return false;
		});
	});
});

geckImgBox = {

	isUsed : false,
	
	// Swith On progress loader on image link
	progressOn : function( linkObject ) {
		$(linkObject)
			.css({position: 'relative'})
		$('<div/>')
			.attr('id','geckImageBoxProgress')
			.css({opacity: 0})
			.appendTo(linkObject)
			.animate({opacity:0.8},100);
	},
	
	// Swith Off progress loader on image link
	progressOff : function( linkObject ) {
		$('#geckImageBoxProgress',linkObject)
			.animate({opacity:0},500,'',function() { 
				$(this).remove(); 
			});
	},
	
	
	
	// Create image frame and show it
	showImage : function( link, imgView ) {
		//variables
		var docHeight = $(document).height();
		var docWidth  = $(document).width();
		var winHeight = $(window).height();
		var winWidth  = $(window).width();
		var scrollTop = $(window).scrollTop();
		
		//main wrap
		var $mainWrap = $('<div/>');
		$mainWrap.attr('id','geckImageBoxView');
		$mainWrap.css({
			position: 'absolute',
			top:    0,
			left:   0,
			width:  '100%',
			height: docHeight,
			zIndex: 1000000
		});
		$mainWrap.click( function() {
			geckImgBox.hideImage();
		});
		$mainWrap.appendTo('body');
		
		//background
		var $background = $('<div/>');
		$background.addClass('background');
		$background.css({
			position: 'absolute',
			top: 0,
			left: 0,
			width:  '100%',
			height: docHeight,
			display: 'none',
			opacity: 0.6
		});
		$background.appendTo($mainWrap);
		$background.fadeIn(1000);
		
		
		//image frame
		var $imgFrame = $('<div/>')
		$imgFrame.addClass('imgFrame');
		$imgFrame.append(imgView);
		$imgFrame.appendTo($mainWrap);
		
		var imgHeight = $(imgView).height();
		var imgWidth  = $(imgView).width();
    var possTop   = ((winHeight - imgHeight)  / 2) + scrollTop;
    var possLeft  = ((winWidth  - imgWidth) / 2);
    
		$imgFrame.css({
			position: 'absolute',
			top:  ((possTop < 2) ? 5 : possTop),
			left: possLeft,
			display: 'none'
		});
		$imgFrame.fadeIn(400);
	},
	
	hideImage : function() {
		$('#geckImageBoxView')
			.animate({opacity:0},400,'',function() { 
				$(this).remove(); 
			});
	}
}