﻿var $ = jQuery;
(function( $ ){
  $.fn.imagekarussell = function( options ) {
	//options
	var settings = {
		'speed'		: 500,
		'interval'	: 5000,
		'autoplay'	: true,
		'width'		: 100,
		'height'	: 100,
		'active'	: 0,
		'zoom'		: 12,
		'opacity'	: 100
	};
	return this.each(function() {        
		if ( options ) { 
			$.extend( settings, options );
		}
		var activeMe = 0;
		var container = $(this);
		container.css('height','auto');
		var list = container.children('ul');
		var tempcount = container.find('a').length;
		var items = container.find('a');
		var itemWidth = (settings.width + parseInt(items.eq(0).css('marginLeft')) + parseInt(items.eq(0).css('marginRight')));
		items.css({'width':settings.width,'height':settings.height});
		items.children('img').css({'opacity':(settings.opacity / 100),'width':settings.width,'height':settings.height});
		items.each(function(){
			$(this).append('<figcaption>' + $(this).attr('title') + '</figcaption>');
			
		});
		var tempHtml = list.html();
		for(var i = 0;i<(parseInt((container.width()*2)/(items.length*itemWidth)));i++){
			list.append(tempHtml);
		}
		tempHtml = null;
		list.css('width',container.find('a').length * itemWidth);
		function showMe(item){
			item.addClass('active');
			item.find('figcaption').css({
				'marginTop':(1 + (settings.zoom /100)) + 15 + "px"
			}).slideDown(100);
			item.children('img').animate({
				'opacity':'1',
				'width':settings.width*(1 + (settings.zoom /100))+"px",
				'height':settings.height*(1 + (settings.zoom /100))+"px",
				'marginTop':"-"+settings.height*(settings.zoom /100)/2+"px",
				'marginLeft':"-"+settings.width*(settings.zoom /100)/2+"px"
			})
		}
		function aniMe(){
			container.find('a').removeClass('active');
			container.find('a').find('figcaption').slideUp(100);
			container.find('a').children('img').animate({
				'opacity'	:(settings.opacity / 100),
				'width'		:settings.width+"px",
				'height'	:settings.height+"px",
				'marginTop'	:0,
				'marginLeft':0
			})
			list.animate({
				'marginLeft':parseInt(list.css('marginLeft')) - itemWidth + "px"
			},function(){
				activeMe++;
				if((tempcount * itemWidth) <= (parseInt(list.css('marginLeft')) * -1)){
					list.css('marginLeft',0);
					activeMe = 0;
				}
				showMe(container.find('a').eq(activeMe + settings.active));
			});
		}
		if(settings.autoplay){
			var timerId = setInterval(function(){aniMe()},settings.interval);
		}
		showMe(container.find('a').eq(activeMe + settings.active));
    });
	
  };
})( jQuery );
