function preloadImages(slider) {
	var imgs = [];
	for (var i=0; i<slider.data.length; i++) {
		var effect = slider.data[i];
		if  (slider.data.start) {
			// 	alert(effect.start);
			var img = document.createElement('img');
			img.setAttribute('src', effect.start);
			effect._startImage = img;
			// imgs.push(img);
		}

		if  (effect.end) { 
			// alert(effect.end);
			var img = document.createElement('img');
			img.setAttribute('src', effect.end);
			effect._endImage = img;
			// imgs.push(img);
		}
	}
}

function initSlider(id, sliderData) {
	var container = document.getElementById(id);
	var effects   = [];

	for (var i=0; i<slider.data.length; i++) {
		var createEff = function (container, data) {
			if (data.effect) {
				if (data.effect == 'fadeIn') {
					return new EffectFadeIn(container, data);
				} else if (data.effect == 'showFromLeft') {
					return new EffectShowFromLeft(container, data);
				}
			}
		}

		var effect = createEff(container, slider.data[i]);
		effects.push(effect);
	}

	for (var i=0; i<effects.length-1; i++) {
		// effects[i].preload();
		effects[i].setNextEffect(effects[i+1]);
	}

	effects[effects.length-1].setNextEffect(effects[0]);
	effects[0].start(effects[0])();
}

function EffectFadeIn(container, data) {
	this._container  = container;
	this._data       = data;
	this._nextEffect = false;

	this.image		 = false;
	this.interval    = false;

	this.alpha		= 0;

	this.startImage = false;
	this.endImage   = false;
	
	this.setNextEffect = function (effect) {
		this._nextEffect = effect;
	}
	
	this.preload = function () {
		this.startImage = document.createElement('img');
		this.endImage   = document.createElement('img');
		this.startImage.src = this._container.start;
		this.endImage.src   = this._container.end;
		
	}

	this.start = function (obj) {
		return function() {
			if (obj._data.start) {
				// obj._container.style.backgroundImage = 'url("' + obj._data.start + '")';
			}

			if (!obj._container.firstChild) {
				obj.image = document.createElement('img');
				obj.image.style.width  = '946px';
				obj.image.style.height = '410px';
				obj.image.style.left = '0px';
				obj.image.style.top = '0px';

				obj._container.appendChild(obj.image);
			} else {
				obj.image = obj._container.firstChild;
			}

			// obj.image = obj.endImage;
			
			obj.image.style.display = 'none';
			obj.image.style.position = 'absolute';
			obj.image.style.left = '0px';
			obj.image.style.top = '0px';

			obj.image.setAttribute('src', obj._data.end);	
			obj.alpha = 0;
			obj.setAlpha(obj.alpha);
			
			window.setTimeout(obj.tick(obj), 0);
			obj.interval = window.setInterval(obj.tick(obj), 20);
		}
	}

	this.tick = function (obj) {
		return function () {
			obj.image.style.display = 'block';
			obj.alpha += .03;
			obj.setAlpha(obj.alpha);

			if (obj.alpha >= 1) {
				obj.finish(obj)();
			}
		}
	}

	this.finish = function (obj) {
		return function () {
			obj._container.style.backgroundImage = 'url("' + obj._data.end + '")';
			// obj.setAlpha(1);
			// obj.image.setAttribute('style', '');
			window.clearInterval(obj.interval);
			window.setTimeout(obj._nextEffect.start(obj._nextEffect), obj._data.wait);
		}
	}

	this.setAlpha = function(newAlpha) {
		this.image.setAttribute('style', 'opacity: ' + newAlpha + '; -moz-opacity:' + newAlpha + ');');
		var val = 'Alpha(opacity=' + Math.floor(Math.min(newAlpha * 100, 100)) + ')';
		this.image.style.filter = val;
		
	}
}


function EffectShowFromLeft(container, data) {
	this._container  = container;
	this._data       = data;
	this._nextEffect = false;

	this.image		 = false;
	this.interval    = false;

	this.crop		= 0;
	
	this.startImage = false;
	this.endImage   = false;

	this.setNextEffect = function (effect) {
		this._nextEffect = effect;
	}
	
	this.preload = function () {
		this.startImage = document.createElement('img');
		this.endImage   = document.createElement('img');
		this.startImage.src = this._container.start;
		this.endImage.src   = this._container.end;
	}	

	this.start = function (obj) {
		return function() {
			if (obj._data.start) {
				/*
				if (obj._container.style.backgroundImage != 'url("' + obj._data.start + '")') {
					obj._container.style.backgroundImage = 'url("' + obj._data.start + '")';
				}
				*/
				
			}

			if (!obj._container.firstChild) {
				obj.image = obj.startImage;
				obj.image.style.position = 'absolute';
				
				obj.image.style.width  = '946px';
				obj.image.style.height = '410px';
				obj.image.style.left   = '0px';
				obj.image.style.top    = '0px';
				
				obj.image.style.display = 'none';
				obj._container.appendChild(obj.image);
			} else {
				obj.image = obj._container.firstChild;
			}

			// obj.image = obj.endImage;
			
			obj.image.style.display = 'none';
			
			// obj.image.setAttribute('style', 'position: absolute; opacity:1; -moz-opacity:1);');
			obj.image.style.position = 'absolute';
			obj.image.style.left = '0px';
			obj.image.style.top = '0px';

			obj.image.style.crop = '';
			obj.image.src = obj._data.end;
			obj.crop = 0;
			obj.setCrop(obj.crop);
			// obj._container.appendChild(obj.image);
			
			window.setTimeout(obj.tick(obj), 0);
			obj.interval = window.setInterval(obj.tick(obj), 20);
		}
	}

	this.tick = function (obj) {
		return function () {
			obj.crop += 75;
			obj.setCrop(obj.crop);

			if (obj.crop >= 946) {
				obj.finish(obj)();
			}
		}
	}

	this.finish = function (obj) {
		return function () {
			obj._container.style.backgroundImage = 'url("' + obj._data.end + '")';
			window.clearInterval(obj.interval);
			window.setTimeout(obj._nextEffect.start(obj._nextEffect), obj._data.wait);
		}
	}

	this.setCrop = function(newCrop) {
		var val = 'rect(0px, ' + this.crop + 'px, 410px, 0px)';
		this.image.style.clip = val;
		// this.image.setAttribute('style', 'clip:' + val);
		this.image.style.position = 'absolute';
		this.image.style.display = 'block';
	}
}