$(document).ready(function() {

	// bind the homepage slideshow with plugin
	$('#feat-item').atrSlideshow();

	// the 'banners' variable is intialized at application\views\pages\home.php
	if (banners && banners.length > 0)
	{
		$('#featured_banners').bannerSlideshow();
	}

});

/**
 * Banner slideshow (featured)
 * @param settings
 */
jQuery.fn.bannerSlideshow = function (settings) {
	var config = {
		'fx': 'scrollHorz',
		'timeout': 0
	};
	if (settings) $.extend(config, settings);

	var $this = $(this);
	$this.cycle(config);

	var timer;
	var count = 0;
	var viewed_all = false;
	set_timeout();

	function set_timeout()
	{
		// Checks if user hasn't already viewed all the banners
		if ( ! viewed_all)
		{
			// Updates banners table in database - increses views field by one
			$.ajax({
				cache: false,
				dataType: 'json',
				url: base_url+'b/increment_views/' + banners[count].id
			});
		}

		if (banners.length > 1) {
			// Sets number of seconds that the banner will show (according to the settings from the banners admin center)
			timer = setTimeout(next_banner, banners[count].banner_seconds * 1000);
		}
	}

	function next_banner()
	{
		clearTimeout(timer);
		$this.cycle('next');

		count++;
		if (count == banners.length)
		{
			count = 0;
			viewed_all = true;
		}

		set_timeout();
	}

};

/**
 * Homepage featured properties slideshow
 *
 */
var slide_interval;
var slide_img_path;
var curr_slide = 1;

jQuery.fn.atrSlideshow = function(settings) {
	if ( ! this.length) return false;
	var config = {
		'picture_path': 'pix/properties/featured/',
		'fx': 'scrollHorz',
		'timeout': 0,
		'prev': '.prev.control',
		'next' : '.next.control'
	};
	if (settings) $.extend(config, settings);

	// setting up page cycle for number anchors
	$(this).find('.slideshow .slides').cycle({fx: config.fx, timeout: config.timeout, prev: config.prev, next: config.next});

	// setup slideshow movement on anchor click
	this.find('.slide a').click(function() {
		atrSlideshow_next($(this).attr('rel'));
		return false;
	});

	// show first item
	atrSlideshow_grid_view(0);

	// preload next image
	if (props[1])
	{
		$(document.createElement('img'))
			.attr('src', slide_img_path + props[1]['image']);
	}

	slide_img_path = config.picture_path;
	slide_interval = setInterval("atrSlideshow_next(0)", 4500);
	return this;
};

function atrSlideshow_next(index)
{
	if (index == 0)
	{
		++curr_slide;
		index = curr_slide;
	}
	if (index > props.length || index < 1) index = 1;

	var $a = $('.slide a[rel='+index+']');
	if (props[index-1] && props[index-1]['image'] && ! $a.hasClass('active'))
	{
		$a.parents('.slides').find('a').removeClass('active');
		$a.addClass('active');
		var parentEl = $a.parents('.slideshow').parent();

		// insert next image, hidden
		$(document.createElement('img'))
			.attr('src', slide_img_path + props[index-1]['image']).hide()
			.insertAfter(parentEl.find('img'));

		// fade out first image, fade in the 2nd one, and remove first
		parentEl.find('img:first').fadeOut()
			.next('img').fadeIn()
			.end().remove();

		curr_slide = index;
		atrSlideshow_grid_view(index - 1);
		// preload next image
		if (props[index])
		{
			$(document.createElement('img'))
				.attr('src', slide_img_path + props[index]['image']);
		}
	}
}

/**
 * repopulate info placeholders on slideshow movement
 *
 * @param  index  index of option in array
 * @return void
 */
function atrSlideshow_grid_view(index)
{
	var prop_link = base_url+'real-estate/'+props[index]['id'];
	$('#feat-item')
		.find('a.show').attr('href', prop_link)
		.end()
		.next('h4').html(props[index]['name']+'<span>...</span>')
		.nextAll('ul')
		.empty()
		.append( $(document.createElement('li')).html('Area: '+props[index]['area']) )
		.append( $(document.createElement('li')).html('City: '+props[index]['city']) )
		.append( $(document.createElement('li')).html('Location: ') )
		.append( $(document.createElement('li')).html('Bedrooms: '+props[index]['beds']) )
		.append( $(document.createElement('li')).html('Sq. meters.: '+props[index]['sqm']) )
		.append( $(document.createElement('li')).html('Price: '+props[index]['p1']) )
		.next('a').attr('href', prop_link);
}

