/**
 * @author fomelchanko
 * 
 * @version 0.1.0
 */

jQuery.fn.AtalanSsInit = function(data){
	this.ssData = jQuery.extend({
		images : [],
		thumbnails : true,
		captions : true,
		width : 600,
		height : 400,
		curItemStyle : { opacity : 1 },
		nextItemStyle : { opacity : 0 },
		prevItemStyle : { opacity : 0 }
	}, data);
	
	ss = this;
	
	this.append('<div class="atalan-ss-canvas"></div>');

	this.css({
		width : this.ssData.width,
		position : 'relative'
	})
	
	this.ssCanvas = this.children('div.atalan-ss-canvas');
	this.ssCanvas.css({
		position : 'relative',
		width : this.ssData.width,
		height : this.ssData.height,
		textAlign : 'left',
		overflow : 'hidden'
	});
	
	if(this.ssData.captions) this.AtalanSsPrepareCaptions();
	if(this.ssData.thumbnails) this.AtalanSsPrepareTumbnails();
	
	this.AtalanSsShowImage(0);
}

jQuery.fn.AtalanSsPrepareCaptions = function(){
	this.ssCanvas.append('<div class="atalan-ss-caption"></div>');
	this.ssCaption = this.ssCanvas.children('div.atalan-ss-caption');
	this.ssCaption.css({
		position : 'absolute',
		bottom : 0,
		background : '#000',
		opacity : '0.6',
		textAlign : 'center',
		color: '#fff',
		zIndex : '99'
	});
}

jQuery.fn.AtalanSsPrepareTumbnails = function() {
	this.append('<div class="atalan-ss-thumbnails"><ul></ul></div>');
	this.ssThumbnails = this.find('div.atalan-ss-thumbnails > ul');

	for (i = 0; i < this.ssData.images.length; i++) {
		this.ssThumbnails.append('<li><img src="'+this.ssData.images[i].thmb+'" rel="'+i+'" /></li>');
		image = this.ssThumbnails.find('img[rel='+i+']');
		image.hover(
			function(){
				jQuery(this).parent().toggleClass('ss-hover', true);
			},
			function(){
				jQuery(this).parent().toggleClass('ss-hover', false);
			}
		);

		image.click(function(){
			ss.AtalanSsShowImage(jQuery(this).attr('rel'));
		});
	}
	
	thmb = this.ssThumbnails.parent();
	
	this.sliderHandler = function(){
		thumbMaxOffset = 0;
		thumbsWidth = 0;
		ss.ssThumbnails.children().each(function(){
			thumbsWidth = thumbsWidth + jQuery(this).outerWidth(true);
		});
		thumbMinOffset = thmb.innerWidth() - thumbsWidth;
		
		if(thumbMinOffset >= 0) return;
		
		if(x < workableOffset) {
			muliplier = (1 - (x / workableOffset));
		} else {
			muliplier = ((x - (thmb.width() - workableOffset)) / workableOffset);
		}
		
		offset = (muliplier*muliplier)*10;
		
		left = (thmb.children('ul').css('left').split('px').join(''))*1;
		newLeft = x < workableOffset ? left + offset : left - offset;
		if(newLeft > thumbMaxOffset) newLeft = thumbMaxOffset;
		else if(newLeft < thumbMinOffset) newLeft = thumbMinOffset;
		thmb.children('ul').css({left : newLeft});
	}
	
	this.ssThumbnails.parent().mousemove(function(e){
		x = e.pageX - jQuery(this).offset().left;
		workableOffset = 100;
		
		if(x < workableOffset || x > (jQuery(this).width() - workableOffset)) {
			if(!ss.sliderIntervalHID) {
				ss.sliderHandler();
				ss.sliderIntervalHID = window.setInterval(ss.sliderHandler, 10);
			}
		} else {
			if(ss.sliderIntervalHID != null && ss.sliderIntervalHID != undefined) {
				window.clearInterval(ss.sliderIntervalHID);
				ss.sliderIntervalHID = null;
			}
		}
	});
	
	this.ssThumbnails.parent().mouseleave(function(){
		if(ss.sliderIntervalHID != null && ss.sliderIntervalHID != undefined) {
			window.clearInterval(ss.sliderIntervalHID);
			ss.sliderIntervalHID = null;
		}
	});
}

jQuery.fn.AtalanSsShowImage = function(id){
	if (this.ssData.thumbnails) {
		ob = this.ssThumbnails.children(':eq(' + id + ')');
		ob.parent().children().toggleClass('ss-active', false);
		ob.toggleClass('ss-active', true);
	}

	curImgContainer = this.ssCanvas.children('div.current');
	
	image = this.ssData.images[id];
	nextImgContainer = jQuery(document.createElement('div'));
	nextImgContainer.css(jQuery.extend(this.ssData.nextItemStyle, { position : 'absolute', width : ss.ssData.width, textAlign: 'center' }));
	nextImg = jQuery(document.createElement('img'));
	nextImg.attr('src', image.src);
	this.ssCanvas.append(nextImgContainer);
	nextImgContainer.append(nextImg);
	
	curImgContainer.attr('class', 'prev');
	curImgContainer.animate(this.ssData.prevItemStyle, 1000, function(){
		jQuery(this).remove();
	});
	
	nextImgContainer.attr('class', 'current');
	nextImgContainer.animate(this.ssData.curItemStyle, 1000, function(){
		if(jQuery(this).css('opacity') == 1 && !jQuery.support.opacity) {
			this.style.filter = '';
		}
	});
	
	this.AtalanSsShowCaption(id);
}

jQuery.fn.AtalanSsShowCaption = function(id){
	curImgContainer = this.ssCanvas.children('div.current');
	if(this.ssData.captions) {
		this.ssCaption.animate({ height : 0 }, 150, function(){
			jQuery(this).hide();
			image = ss.ssData.images[id];
			if (image.caption && image.caption.length > 0) {
				ss.ssCaption.html(image.caption).show().animate({ height: 18 }, 150);
			}
		});
	}
}