/* Enabling support for new HTML5 tags for IE6, IE7 and IE8 */
if(navigator.appName == 'Microsoft Internet Explorer' ){
	if( ( navigator.userAgent.indexOf('MSIE 6.0') >= 0 ) || ( navigator.userAgent.indexOf('MSIE 7.0') >= 0 ) || ( navigator.userAgent.indexOf('MSIE 8.0') >= 0 ) ){
		document.createElement('header')
		document.createElement('nav')
		document.createElement('section')
		document.createElement('aside')
		document.createElement('footer')
		
		document.createElement('hgroup')
		document.createElement('figure')
		document.createElement('figcaption')
	}
}

/* GLOBAL VARIABLES */

var	$thepopUpBox 				= ''
var $overlay					= ''
var animationSpeed				= 500

//var $bigPicItems				= false
var $lightBoxlargeImages		= false
var $lightBoxPagination			= false
var $thumbItems					= false
var $pageLinksLeftArrow			= false
var $pageLinksRightArrow		= false


var currentlyRunning			= true
var slidingDelay				= 5000// This sets the sliding delay to 5 seconds
var autoSlidingPointer			= false

/* GLOBAL VARIABLES */


;(function($){
	$(function(){

		/************* CODE FOR INPUT EFFECTS  ********/
		$('input:text').focus(function(){
			if(this.value==this.defaultValue){this.value=''}
		})
		$('input:text').blur(function(){
			if(!this.value){this.value=this.defaultValue;}
		})
		$('input:password').focus(function(){
			if(this.value==this.defaultValue){this.value=''}
		})
		$('input:password').blur(function(){
			if(!this.value){this.value=this.defaultValue;}
		})
		$('textarea').focus(function(){
			if(this.value==this.defaultValue){this.value=''}
		})
		$('textarea').blur(function(){
			if(!this.value){this.value=this.defaultValue;}
		})
		/************* END CODE FOR INPUT EFFECTS  ********/
		
		/* CONDITIONAL CODE FOR IE */
		$('head').append('<!--[if IE 6]><script type="text/javascript" src="scripts/pngfix.js"></script><![endif]-->');
		
		if (window.PIE) {
			$('.gradient, .rounded, .shadow').each(function() {
				PIE.attach(this);
			});
		}
		/* END CONDITIONAL CODE FOR IE */
		
		/* BOX ROLLOVER */
		$('#gallery-wrap div.gallery-box').mouseenter(function(){
			$(this).addClass('rollover')
		})
		$('#gallery-wrap div.gallery-box').mouseleave(function(){
			$(this).removeClass('rollover')
		})
		/* BOX ROLLOVER */
		
		$('#slider-overlay').text(jQuery('#slider > div.active').find('p').text())
		if($('#slider').length){
			iindevSlideShowinIt()
		}// SLIDESHOW
		
		
		/* BEGIN POPUP IMAGES AND CLICKING FUNCTION */
		
		/* PopUp box show hide Begin */
		jQuery('body').append('<div id="overlay_layer"></div>')// Creat the overlay_layer div
		$overlay = $('#overlay_layer')
		$overlay.animate({opacity:'hide'}, 0)// Initialy hiding the mask
		
		$('#popup-box').css({'left' : 0}).animate({opacity:'hide'}, 0)// Initialy hiding the popup box		
		
		$('#cerrar').click(function(e){
			e.preventDefault()
			$('#overlay_layer').animate( {opacity:'hide'}, animationSpeed )
			$('#popup-box').animate( {opacity:'hide'}, animationSpeed )
		})// END CERRAR BTN CLICK
		
		
		// Crate the page links
		$pageLinksLeftArrow			= $('#previous-slide')
		$pageLinksRightArrow		= $('#next-slide')
		
		var imageCount	= $('#thumb-container').find('img').length
		
		if(!imageCount) $('#thumb-container').remove()
		
		imageCount++
		
		var pageLinksHTML	= '<div id="pageLinksContainer" style="float:left">'
		for(i=1; i<=imageCount; i++){
			pageLinksHTML+='<a href="#">'+i+'</a>'
		}
		pageLinksHTML+='</div>'
		
		$pageLinksLeftArrow.after(pageLinksHTML)
		
		
		/* pointer and variable initialization */
		
		$lightBoxlargeImages		= $('#light-box-large > div.lightbox-images')
		$lightBoxPagination			= $('#pageLinksContainer a')
		$thumbItems					= $('#thumb-container > div.thumb-wrap')
		
		/* pointer and variable initialization */
		
		//$bigPicItems.hide()// hide all the big picture 
		$lightBoxlargeImages.hide()// hide all the large picture of lightbox
		
		
		//$('#big-pic > div.big-images:first').fadeIn(0).addClass('active')// set first big image showing initially
		//$('#thumb-container > div.thumb-wrap:first').addClass('active')// set first thumb active initially
		$('#light-box-large > div.lightbox-images:first').fadeIn(0)// set first lightbox large image showing initially
		$('#lightbox-pagination > div a:first').addClass('active')// set first lightbox pagination item active initially
		
		$('#main-image img').click(function(){
			
			$lightBoxlargeImages.hide()
			$lightBoxlargeImages.eq(0).show()
			
			$lightBoxPagination.removeClass('active')
			$lightBoxPagination.eq(0).addClass('active')
			
			showAndHidepopupBox('#popup-box')

		})
		
		/*$thumbItems.click(function(){
			showAndHidepopupBox('#popup-box')
		})// END PAY BTN CLICK*/
		
		
		
		/* THUMB ITEM EACH BEGIN */
		$thumbItems.each(function(i){
			$(this).click(function(){
				
				
				$thumbItems.removeClass('active')
				$(this).addClass('active')
				
				$lightBoxlargeImages.hide()
				$lightBoxlargeImages.eq(i+1).show()
				
				$lightBoxPagination.removeClass('active')
				$lightBoxPagination.eq(i+1).addClass('active')
			
				
				showAndHidepopupBox('#popup-box')
			})
		})
		/* THUMB ITEM EACH END */
		
		/* LIGHTBOX PAGINATION EACH BEGIN */
		$lightBoxPagination.each(function(i){
			$(this).click(function(e){
				e.preventDefault()
				
				$lightBoxlargeImages.fadeOut(200)
				$lightBoxlargeImages.eq(i).fadeIn(250)
				
				$lightBoxPagination.removeClass('active')
				$(this).addClass('active')
				
				/*
				if(i != 0){
					$thumbItems.removeClass('active')
					$thumbItems.eq(i).addClass('active')
				}
				*/
				
			})
		})
		/* LIGHTBOX PAGINATION EACH END */
		$('#previous-slide').click(function(e){
			e.preventDefault()
			if( $('#lightbox-pagination > div a:first').hasClass('active') ) return false
			else{
				var activePos 	= parseInt( ( $('#lightbox-pagination > div').find('.active').text() ) - 1 )
				var prevItemPos	= activePos - 1
				
				$lightBoxPagination.removeClass('active')
				$lightBoxPagination.eq(prevItemPos).addClass('active')
				
				$lightBoxlargeImages.fadeOut(200)
				$lightBoxlargeImages.eq(prevItemPos).fadeIn(250)
				
				/*
				$thumbItems.removeClass('active')
				$thumbItems.eq(prevItemPos).addClass('active')
				*/
				
			}
			
		})
		$('#next-slide').click(function(e){
			e.preventDefault()
			if( $('#lightbox-pagination > div a:last').hasClass('active') ) return false
			else{
				var activePos 	= parseInt( ( $('#lightbox-pagination > div').find('.active').text() ) - 1 )
				var nextItemPos	= activePos + 1
				
				$lightBoxPagination.removeClass('active')
				$lightBoxPagination.eq(nextItemPos).addClass('active')
				
				$lightBoxlargeImages.fadeOut(200)
				$lightBoxlargeImages.eq(nextItemPos).fadeIn(250)
				
				/*
				$thumbItems.removeClass('active')
				$thumbItems.eq(nextItemPos).addClass('active')
				*/
				
			}
			
		})
		/* END POPUP IMAGES AND CLICKING FUNCTION */
		
		
			
	})// END OF DOCUMENT READY FUNCTION
	

})(jQuery)


function iindevSlideShowinIt() {
	
	jQuery('#left-scroller').click(function(e){
		e.preventDefault()
		if( !currentlyRunning ){
			clearTimeout(autoSlidingPointer)
			showPrevSlide()
		}
		
	})// END LEFT BUTTON CLICK FUNCTION*/ 
	
	jQuery('#right-scroller').click(function(e){
		e.preventDefault()
		if( !currentlyRunning ){
			clearTimeout(autoSlidingPointer)
			showNextSlide()
		}
		
	})// END RIGHT BUTTON CLICK FUNCTION 
	
	showNextSlide()
	
}// ENDING OF SLIDING IMAGES FUNCTION

function showNextSlide(){

	var activeItem			= jQuery('#slider > div.active')
	var nextActiveItem		= activeItem.next().length ? activeItem.next(): jQuery('#slider > div:first')
	
	currentlyRunning = true
	activeItem.addClass('last-active')
	nextActiveItem.css({opacity: 0.0}).addClass('active')
	.animate({opacity: 1.0}, animationSpeed , function(){
		jQuery('#slider-overlay').text(nextActiveItem.find('p').text())
		activeItem.removeClass('active last-active')
		currentlyRunning = false
	})
	
	autoSlidingPointer = setTimeout( 'showNextSlide()', slidingDelay )
}
function showPrevSlide(){

	var activeItem			= jQuery('#slider > div.active')
	var prevActiveItem		= activeItem.prev().length ? activeItem.prev(): jQuery('#slider > div:last')
	
	currentlyRunning = true
	activeItem.addClass('last-active')
	prevActiveItem.css({opacity: 0.0}).addClass('active')
	.animate({opacity: 1.0}, animationSpeed , function(){
		jQuery('#slider-overlay').text(prevActiveItem.find('p').text())
		activeItem.removeClass('active last-active')
		currentlyRunning = false
	})
	
	autoSlidingPointer = setTimeout( 'showNextSlide()', slidingDelay )
}


// Begining function showpopupBox
function showAndHidepopupBox(popupBoxId){
	/* Begin  Pointers and Varriables */
	$thepopUpBox			= jQuery(popupBoxId)
	var $body		 		= jQuery('body')
	var	$window		 		= jQuery(window)
	var $page		 		= jQuery('#page')
	
	var thepopUpboxHeight	= $thepopUpBox.outerHeight()
	var thepopUpboxWidth	= $thepopUpBox.outerWidth()
	var bodyHeight			= $body.height()
	var bodyWidth			= $body.width()
	var windowHeight		= $window.height()
	var windowWidth			= $window.width()
	var pageouterWidth		= $page.outerWidth()
	var pageouterHeight		= $page.outerHeight()
	var overlayHeight		= $overlay.height()
	var overlayWidth		= $overlay.width()
	var verticalPosition	= 0 
	var horizontalPosition	= 0
	/* End Pointers and Varriables */
		
	if(pageouterHeight>windowHeight){
		overlayHeight=pageouterHeight
	}
	else{
		overlayHeight=windowHeight
	}
	if(bodyWidth>pageouterWidth){
		overlayWidth=bodyWidth
	}
	else{
		overlayWidth=pageouterWidth
	}
	if(windowHeight>thepopUpboxHeight){
		verticalPosition = $window.scrollTop() + Math.round( (windowHeight-thepopUpboxHeight)/2 )
	}
	else{
		verticalPosition = $window.scrollTop()
	}
	if(windowWidth>thepopUpboxWidth){
		horizontalPosition = $window.scrollLeft() + Math.round( (windowWidth-thepopUpboxWidth)/2 )
	}
	else{
		horizontalPosition = $window.scrollLeft()
	}

	$overlay.css({ 
		'height'	: overlayHeight,
		'width'		: overlayWidth,
		'position'	: 'absolute',
		'left'		: 0,
		'top'		: 0,
		'z-index'	: 95,
		'opacity'	: 0.84,
		'background': '#000'
	})//Set the properties of the overlay div
	
	$overlay.animate( {opacity:'show'}, animationSpeed )//show the mask
	
	$thepopUpBox
		.css({ 
			 'display'	: 'block',
			 'top'		: verticalPosition,
			 'left'		: horizontalPosition
		})
		.animate( {opacity:'show'}, animationSpeed )
		// popup box position at the center of the window (verticaly and horizontaly)
		
	$overlay.click(function(){
		jQuery(this).animate( {opacity:'hide'}, animationSpeed )
		$thepopUpBox.animate( {opacity:'hide'}, animationSpeed )
	})
} // Ending function showpopupBox