var Planeffect = window.Planeffect || {};

Planeffect.Bg = function(){
	var ie8 = false;
	var images = [];
	var $wrapper, $image_div, $indicator_container, $indicator_glow, $next_button, $prev_button;
	var icons = [];
	var $icon;
	var $icon_img;
	var nb_images = 0;
	var current_image = 0;
	var $current_indicator;
	var new_speed = 8000;
	var anim_speed = 1500;
	var timeout;
	
	var getImages = function(id){
		images = [];
		icons = [];
		$(id+' img').each(function(){
			$el = $(this);
			images.push($el.attr('src'))
			icons.push($.parseJSON($el.attr('alt')));
		});
		nb_images = images.length;
	};
	
	var initImageDiv = function() {
		$wrapper = $('#wrapper');
		$image_div = $('<div id="cycle-images" />').css({
			position: 'absolute',
			left: '0px',
			top: '0px',
			width: '100%',
			height: '100%',
			background: 'url(/images/bg/1.jpg) center center fixed no-repeat',
			'filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/bg/1.jpg', sizingMethod='scale')",
			'-ms-filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/bg/1.jpg', sizingMethod='scale')",
			'-moz-background-size': 'cover',
			backgroundSize: 'cover',
			display: 'none',
			zIndex: 1
		});
		$wrapper.append($image_div);
	};
	
	var newImage = function(index) {
		stopShow();

		if (index >= nb_images) {
			current_image = 0;
		} else if (index < 0) {
			current_image = nb_images - 1;
		} else {
			current_image = index;
		}
		
		hideIndicatorGlow();
		
		$current_indicator.removeClass('active');
		
		$current_indicator = $('.slideshow-indicator[data-index="'+current_image+'"]');
		$current_indicator.addClass('active');
		
		$image_div
			.css({
				'background-image': 'url('+images[current_image]+')',
				'filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+images[current_image]+"', sizingMethod='scale')",
				'-ms-filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+images[current_image]+"', sizingMethod='scale')"
			})
			.fadeIn(anim_speed, function(){
				$wrapper.css({
					'background-image': 'url('+images[current_image]+')',
					'filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+images[current_image]+"', sizingMethod='scale')",
					'-ms-filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+images[current_image]+"', sizingMethod='scale')"
				});
				$image_div.hide();
				setIndicatorGlow();
			});
		
		if (typeof icons[current_image][0] != 'undefined') {
			$icon.attr('href', icons[current_image][0]);
			$icon_img.attr('src', icons[current_image][1]);
			$icon.show();
		} else {
			$icon.hide();
		}
		
		startShow();
	};
	
	var setIndicators = function() {
		$indicator_container = $('#slideshow-indicator-container');

		$indicator_glow = $('<div id="indicator-glow"></div>').css({position: 'absolute', bottom: -29})
		$indicator_container.append($indicator_glow);
		
		$indicator = $('<a class="slideshow-indicator" href="#" />');
		for (i=0; i<nb_images; i++) {
			var $ir = $indicator.clone().click(indicatorClick).attr('data-index', i);
			if (i == current_image) {
				$ir.addClass('active');
				$current_indicator = $ir;
			}
			$indicator_container.append($ir);
		}
		
		setIndicatorGlow();
	};
	
	var indicatorClick = function(e) {
		e.preventDefault();

		newImage($(this).attr('data-index'));
	};
	
	var hideIndicatorGlow = function() {
		if ($.browser.msie) {
			$indicator_glow.hide();
		} else {
			$indicator_glow.stop(true, true).fadeOut(500);
		}
	};
	
	var setIndicatorGlow = function() {
		$indicator_glow.css({left: -19 + (25*current_image)});
		if ($.browser.msie) {
			$indicator_glow.show();
		} else {
			$indicator_glow.stop(true, true).fadeIn(500);
		}
	};
	
	var setNavButtons = function() {
//		$next_button = $('<a id="slideshow-next" />').click(next);
//		$prev_button = $('<a id="slideshow-prev" />').click(prev);
//		$wrapper.append($next_button, $prev_button);
		$next_button = $('#slideshow-next').click(next);
		$prev_button = $('#slideshow-prev').click(prev);
	}
	
	var prev = function() {
		newImage(--current_image);
	};
	
	var next = function() {
		newImage(++current_image);
	};
	
	var startShow = function() {
		timeout = setTimeout(next, new_speed);
	};
	
	var stopShow = function() {
		clearTimeout(timeout);
	};
	
	return {
		init: function(cycle_images){
			if (typeof window.lte_ie8 != 'undefined') {
				ie8 = true;
			} else {
				getImages(cycle_images);
				if (nb_images < 2) {
					return;
				}
				
				initImageDiv();
				setIndicators();
				setNavButtons();
				
				startShow();
			}
			$icon = $('#pe-light');
			$icon_img = $icon.find('img');
		},
		
		destroy: function() {
			stopShow();
			$indicator_container.remove();
			$next_button.remove();
			$prev_button.remove();
			$image_div.remove();
		}
	}
}();