$(document).ready(function() {

	

	// Accommodation type image switching
	$('#accom-images .thumbs a').click(function(e){
		if( $(this).hasClass('active'))
			return false;
			
		var href = $(this).attr('href');
			
		$('#active-accom-image').fadeOut(250,function(){
			$(this).attr('src',href);
			$(this).fadeIn(500);
		});
		
		$('#accom-images .thumb').each(function(){
			if( $(this).hasClass('active') )
				$(this).removeClass('active');
		});
		
		$(this).addClass('active');
		
		e.preventDefault;
		return false;
	});
	
	
	

	/**
	 * Banner showcase transition object
	 * @param bool hasNav				Set false to disable manual navigation functionality (only transitions automatically)
	 * @param bool hasDescription		Set false to disable descriptions for images (descriptions are pulled from image ALT tags)
	 */
	function Showcase( hasNav, hasDescription, random ){
	
		this.debugging = false;
		this.hasNav = hasNav || false;
		this.hasDescription = hasDescription || false;
		this.random = random || false;
		
		// Options
		this.animationTime = 2000;			// Duration of fading animation
		this.autoTransitionTime = 5000; 	// Time between automatic transitions
		
		// Selectors
		this.imageSelector = '.showcase-image';
		this.showcaseSelector = '#showcase';
		this.prevSelector = '#showcase-prev';
		this.nextSelector = '#showcase-next';
		this.descriptionSelector = '#showcase-description';
		
		// Get showcase
		this.showcase = $(this.showcaseSelector);
		
		if( this.hasNav ){
			this.prev = $(this.prevSelector,this.showcase);
			this.next = $(this.nextSelector,this.showcase);
		}
		
		if( this.hasDescription )
			this.description = $(this.descriptionSelector,this.showcase);
		
		// Grab all the  and put into this.images array
		this.images = [];
		
		var self = this;
		
		$(this.imageSelector,this.showcase).each(function(i){
			self.images[i] = $(this);
		});
		
		if( !this.showcase.length || !this.images.length )
			return false;
		
		//
		// Initialises Showcase, selects first showcase image to display at random and begins transitions
		this.start = function(){		
			if ( this.random ){
				var random = Math.floor( Math.random() * self.images.length );
				this.load( random );
			}else{
				this.load(1);
			}
		};
		
		// If navigation is enabled bind navigation
		if( this.hasNav ){
		
			// Bind previous button
			this.prev.click(function(e){
			
				self.change.prev();
				
				e.preventDefault;
				return false;
			});
			
			// Bind next button
			this.next.click(function(e){		
				self.change.next();
					
				e.prevenDefault;
				return false;
			});
		}
		
		// Load function, fades old image out and new image in
		this.load = function( n ){
			
			// Clear auto transition time out
			if( typeof this.timer != 'undefined' )
				clearTimeout( this.timer );
			
			// If image request doesn't exist, throw exception
			if ( typeof self.images[n] == 'undefined' ){
			
				if( self.debugging )
					alert('Image not found');
					
				this.automate();
				return false;
			}
			
			// If not first image load
			if( typeof this.current != 'undefined' ) {
				this.loading = true;

				this.images[n].fadeIn(this.animationTime);
				this.images[this.current].fadeOut((this.animationTime / 2),function(){
					if( self.hasDescription )
						self.description.html(self.images[ n ].attr('alt'));
						
					self.loading = false;
				});
			}
			// If there is no existing images it means the showcase has been initialised and we can select our first image
			else{
				this.images[ n ].css('zIndex',15);
				if( this.hasDescription )
					this.description.html( this.images[n].attr('alt') );
			}		
			this.current = n;			
			this.automate();
		};

		// Calculates which image to load next
		this.change = {
			next : function(){
				if( typeof self.images[ self.current + 1 ] == 'undefined' )
					var next = 0;
				else
					var next = self.current + 1;
				
				self.loadQueue( next );
			},
			prev : function(){
				if( typeof self.images[ self.current - 1 ] == 'undefined' )
					var next = self.images.length - 1;
				else
					var next = self.current - 1;
				
				self.loadQueue( next );
			}
		};
		
		// Queues slide loading
		this.loadQueue = function( n ){
			$(self).queue( this.load( n ) );
		}
		
		// Automates transitions		
		this.automate = function(){
			this.timer = setTimeout( function(){
				self.change.next();
			}, (self.autoTransitionTime + self.animationTime) );
		};
	}
	
	// Start
	if( $('#showcase').length ){
		var owsShowcase = new Showcase( false, false, false );	
		owsShowcase.start();
	}
	
	
	
	/* Search field clearing */
	$('#search-query').focus(function(){
		$(this).removeClass('search-query-inactive');
		if ( $(this).val() == 'Search' )
			$(this).val('');
	});
	
	$('#search-query').blur( function() {
		$(this).addClass('search-query-inactive');
		if ( $( this ).val() == '' )
			$(this).val('Search');
	});
	
	// Open external pages in new window
	/*
	$('a[rel=external]').click(function(e){
		href = $(this).attr('href');
		external = window.open( href );
		e.preventDefault;
		return false;
	});
	*/
	
	$('#content a.virtualtour').click(function(e){
		var href = $(this).attr('href');
		displayBox('Virtual Tour',href,805,609,0);
		
		e.preventDefault;
		return false;

	});
	
	$('#translate-toggle').click(function(e){
		$(this).next('ul').toggle();
		e.preventDefault;
		return false;
	});


var box = $('<div></div>').attr('id','displayBox').html('<span id="displayBoxTitle"></span><a href="#" onclick="hideBox(\'displayBox\'); return false" style="float:right;">Close</a><img alt="" src="/images/clearpixel.gif" id="displayBoxImage" /><div id="displayBoxObject"><iframe id="displayBoxFrame" name="displayBoxFrame"></iframe></div>');
box.appendTo('body');
box.live();

});



function displayBox (title, source, width, height, image){

	var pos = new Array();
	
	pos[0] = document.body.clientWidth/2 - (width/2);
	pos[1] = ( $('body').scrollTop() + screen.height / 2 ) - (300/2);
	
	
	var box = document.getElementById('displayBox');
	
	box.style.width = width+'px';
	box.style.height = (height+20)+'px';
	
	box.style.left = pos[0] + 'px';
	box.style.top = pos[1] + 'px';
	
	document.getElementById('displayBoxTitle').innerHTML = title;		

	if (image)
	{
		var content = document.getElementById('displayBoxImage');
		document.getElementById('displayBoxObject').style.display = 'none';			

		content.src = source;
		content.height = height;
		content.width = width;
		content.style.display = 'block';
	}
	else
	{

		frames['displayBoxFrame'].location.href = source;
		document.getElementById('displayBoxFrame').style.width = width + 'px';
		document.getElementById('displayBoxFrame').style.height = height + 'px';
		
		document.getElementById('displayBoxImage').style.display = 'none';
		document.getElementById('displayBoxObject').style.display = 'block';
	}
	
	box.style.display = 'block';
}

function hideBox (box)
{
	document.getElementById(box).style.display = 'none';
}