$(document).ready(function (){ 
  
  //Usage
  $(".menu ul li").menu();
  
	
	//SHOW THE LOADER AND HIDE BACKGROUND IMAGE UNTIL IT IS LOADED
	$('#bg img').css('display', 'none');
	$('body').append('<span id="body_loader"></span>');	
	$('#body_loader').fadeIn();

	//RANDOM IMAGE ON PAGE LOAD 	
	$.randomImage = {
		defaults: {
//			
//			//you can change these defaults to your own preferences.
		path: $('#templateurl2js').val() + '/images/', //change this to the path of your images
 			myImages: ['background1.jpg', 'background2.jpg', 'background4.jpg' ] //put image names in this bracket. 
//		
		}			
	}
			
	$.fn.extend({
			randomImage:function(config) {	
				var config = $.extend({}, $.randomImage.defaults, config); 
				 return this.each(function() {		
						var imageNames = config.myImages;	
						//get size of array, randomize a number from this
						// use this number as the array index
						var imageNamesSize = imageNames.length;
						var lotteryNumber = Math.floor(Math.random()*imageNamesSize);
						var winnerImage = imageNames[lotteryNumber];
						var fullPath = config.path + winnerImage;
						//put this image into DOM at class of randomImage
						// alt tag will be image filename.
						$(this).attr( {
										src: fullPath,
										alt: winnerImage
									});	
				});	
			}
	});
	
		
	//run the random script
	$('.random').randomImage();
	
	//random image script ends here



    //GALLERY IMAGES HOVER SCRIPT
		
		//add span that will be shown on hover on gallery item
		$(".gallery li a.image").append('<span class="image_hover"></span>'); //add span to images
		$(".gallery  li a.video").append('<span class="video_hover"></span>'); //add span to videos

		$('.gallery  li a span').css('opacity', '0').css('display', 'block') //span opacity = 0 
		
		// show / hide span on hover
		$(".gallery li a").hover(
			 function () {
				 $(this).find('.image_hover, .video_hover').stop().fadeTo('slow', .7); }, 
			function () {
		  		  $('.image_hover, .video_hover').stop().fadeOut('slow', 0);
		});










}); //document.ready function ends here

//WAIT UNTIL CONTENT IS LOADED
$(window).load(function() {
	 
	//hide loader
	$('#body_loader').hide().remove();
	
	//append grid if not on the home page
	if (!$('body').hasClass('body_home')) {	
	$('.grid_overlay, #bg').fadeTo('fast', .8).append('<div class="grid"></div>');
	}
	
	//fade in the image
	$('#bg img').fadeIn('normal');
	   	
});