/* SlideShow for Sensement
 *
 * This library requires the JavaScript Framework "JQuery"
 * For details, see http://jquery.com/
/*--------------------------------------------------------------------------------*/

// new SlideShow({images:array_with_urls, container: $("promo"), interval: 3000});

var SlideShow = function(options) {
  this.initialize(options);
}

$.extend(SlideShow.prototype, {
  initialize: function(options) {
  	this.images = options.images;
  	this.container = options.container;
  	this.interval = options.interval;
	this.defaultImage = options.defaultimage;
	this.defaultLink = options.defaultlink;
  	this.i = 1;
  	this.c = 0;
  },
  run: function() {
  	this.container.css('position', "relative");
  	this.container.css('zoom', "1");
	this.container.attr('class', 'slider-div');
  	this.container.html('\
		<div class="first" style="text-align:center;position:absolute;width:100%;top:0px;left:0px;"><a id="ss_first_a"><img id="ss_first"></a></div>\
		<div class="second" style="text-align:center;position:absolute;width:100%;top:0px;left:0px;"><a id="ss_second_a"><img id="ss_second"></a></div>\
  	');
  	this.first = $("#ss_first");
	this.first_a = $("#ss_first_a");
  	this.second = $("#ss_second");
	this.second_a = $("#ss_second_a");
	var _this = this;

	this.first.bind('load', function() {		
  		this.loaded = true;
  	});
  	this.second.bind('load',function() {
  		this.loaded = true;
  	});
  	this.first.attr('loaded', false);
  	this.second.attr('loaded', false);
	this.second.hide();
  	//this.second.css('opacity', 0);
  	//this.second.css('filter', "alpha(opacity=0)");

	if(this.images.length <=1)
	{
  		this.first.attr('src',(this.images.length == 0)?this.defaultImage:this.images[0]['url']);
		this.first_a.attr('href', (this.images.length == 0)?this.defaultLink:this.images[0]['link']);
		return;
	}
  	this.first.attr('src',this.images[0]['url']);
	this.first_a.attr('href', this.images[0]['link']);
  	this.second.attr('src', this.images[1]['url']);
	this.second_a.attr('href', this.images[1]['link']);
  	setInterval(function(){_this.switchimages();}, this.interval);
  },  
  switchimages: function() {
    var _this = this;
    if(this.c % 2) {
	  	// launch effect only if new image fully loaded
	  	if(this.first.attr('loaded')) {
			this.first.fadeIn("slow");
			this.second.fadeOut("slow", function(){_this.changeimages();});
		}
	}
	else {
	  	// launch effect only if new image fully loaded
	  	if(this.second.attr('loaded')) {
		  	this.first.fadeOut("slow");
			this.second.fadeIn("slow", function(){_this.changeimages();});
		}
	}
  },
  changeimages: function() {
	if(++this.i >= this.images.length)
		this.i=0;
    if(this.c % 2) {
	  	this.second.attr('loaded', false);
		this.second.attr('src',this.images[this.i]['url']);
		this.second_a.attr('href', this.images[this.i]['link']);
	}
	else {
	  	this.first.attr('loaded', false);
		this.first.attr('src', this.images[this.i]['url']);
		this.first_a.attr('href', this.images[this.i]['link']);
	}
	this.c++;
  }
});