/*
 * ArtoonCart - E-Commerce system
 * Copyright © 2011 ARTOON STUDIO (http://artoon.hu) ALL RIGHTS RESERVED.
 * @author Gabor Sar - http://gaborsar.artoon.hu
 * @version 1.0
 * @date October 28, 2011
 */

(function($){
$.fn.slideIt=function(options){
	// Default attributes
	var defaults={
		tag:'img',
		steps:1,
		imgResize:true,			// Resize contained images as well.
		scrollSpeed:1000,			// Animation speed
		scrollDelay:5000,			// Time of the waiting between two animations.
		auto:true,					// Automata animation.
		bullets:true,				// Use the default bullet navigation.
		nav:true,					// Use the default (prev - next) navigation.
		nextButton:'',				// Alternative next button ID.
		prevButton:'',				// Alternative prev button ID.
		frameSize:0,				// The size of the frame of one element.
		background:'none',		// The background of the canvas.
		width:0,						// The width of the elements.
		height:0						// The height of the elements.
	};
	var options=$.extend(defaults,options);
	// System attributes
	var a={
		scrollNow:0,				// Actual position. = 0..n-1
		numberOfElements:0,		// The number of the contained elements.
		numberOfSubElements:0,	// The number of the contained sub elements.
		id:'',						// The ID of the slideshow.
		way:1,						// The way of the auto slideing.
		bulletsSize:25,			// The size of the bullets.		ONLY IF THE DESIGN CHANGED
		navHeight:80				// The size of the navigation. 	ONLY IF THE DESIGN CHANGED
	};
	if (this.attr('id')) a.id=this.attr('id');
	else {
		var newId='slideItNew'+Math.floor(Math.random()*101);
		this.attr('id',newId);
		a.id=this.attr('id');
	}
	a.numberOfElements=parseInt($('#'+this.attr('id')+' > '+options.tag).size())-1;
	a.numberOfSubElements=parseInt($('#'+this.attr('id')+' > '+options.subtag).size())-1;
	// Auto slide function
	var autoslideit=function(){
		if (a.scrollNow>=Math.floor(a.numberOfElements/options.steps)) a.way=-1;
		if (a.scrollNow<=0) a.way=1;
		var bullet='#'+a.id+'-slideit-bullet-'+a.scrollNow;
		$(bullet).removeClass('active');
		a.scrollNow=parseInt(a.scrollNow)+parseInt(a.way);
		bullet='#'+a.id+'-slideit-bullet-'+a.scrollNow;
		$(bullet).addClass('active');
		var targetId='#'+a.id+'-slideit-'+parseInt(a.scrollNow*options.steps);
		$('#'+a.id+' .slideit-canvas').scrollTo(targetId,options.scrollSpeed,{queue:true,axis:'x'});
		t_autoslideit=setTimeout(function(){autoslideit();},options.scrollDelay);
	}
	// Auto slide restart function
	function autoslideit_restart(){
		clearTimeout(t_autoslideit);
		t_autoslideit=setTimeout(function(){autoslideit();},options.scrollDelay);
	}
	// Create Canvas and Slide-Strip
	var navHtml='';
	if (options.nav==true) navHtml='<div class="slideit-nav"><button class="slideit-prev">previous image</button><button class="slideit-next">next image</button></div>';
	this.html(navHtml+'<div class="slideit-canvas"><div class="slideit-slide-strip">'+this.html()+'</div></div>');
	// Bullets
	if (options.bullets==true){
		// Create Bullets
		var bulletsWidth=a.bulletsSize*(Math.floor(a.numberOfElements/options.steps)+1);
		var bulletsHtml='<div class="slideit-bullets" style="padding:'+parseInt(parseInt(options.frameSize))+'px 0px 0px 0px;"><ul style="width:'+bulletsWidth+'px;">';
		var i=0;
		for (i=0; i<(Math.floor(a.numberOfElements/options.steps)+1); i++){
			if (i==0) bulletsHtml+='<li class="active" id="'+a.id+'-slideit-bullet-'+i+'">'+i+'</li>';
			else bulletsHtml+='<li class="" id="'+a.id+'-slideit-bullet-'+i+'">'+i+'</li>';
		}
		bulletsHtml+='</ul></div>';
		this.html(this.html()+bulletsHtml);
		// Bullet click
		$('#'+a.id+' .slideit-bullets li').each(function(){
			$(this).click(function(){
				if (a.scrollNow!=parseInt($(this).html())){
					var bullet='#'+a.id+'-slideit-bullet-'+a.scrollNow;
					$(bullet).removeClass('active');
					$(this).addClass('active');
					var targetId='#'+a.id+'-slideit-'+parseInt($(this).html()*options.steps);
					// RESTART
					$('#'+a.id+' .slideit-canvas').scrollTo(targetId,options.scrollSpeed,{queue:true,axis:'x'});
					a.scrollNow=parseInt($(this).html());
					if (options.auto==true) autoslideit_restart();
				}
			});
		});
	}
	// Set the ID-s and the CLASS-es of the element
	var n=0;
	$('#'+this.attr('id')+' '+options.tag).each(function(){
		$(this).attr('id',a.id+'-slideit-'+n);
		$(this).addClass('slideit-tag');
		n+=1;
	});
	// Set CSS WIDTH HEIGHT
	$('#'+a.id).addClass('slideit');
	$('#'+a.id).css('padding',options.frameSize+'px '+options.frameSize+'px 0px '+options.frameSize+'px');
	if (options.background!='none') $('#'+a.id).css('background-image','url("'+options.background+'")');
	$('#'+a.id).css('width',parseInt(options.width*options.steps)+'px');
	if (options.bullets==true) $('#'+a.id).css('height',parseInt(options.height+options.frameSize+a.bulletsSize)+'px');
	else $('#'+a.id).css('height',options.height+'px');
	if (options.nav==true){
		$('#'+a.id+' .slideit-nav').css('width',parseInt(options.width*options.steps)+'px');
		$('#'+a.id+' .slideit-nav').css('margin-top',parseInt((options.height-a.navHeight)/2)+'px');
	}
	$('#'+a.id+' .slideit-canvas').css('width',parseInt(options.width*options.steps)+'px');
	$('#'+a.id+' .slideit-canvas').css('height',options.height+'px');
	$('#'+a.id+' .slideit-slide-strip').css('width',(options.width*(a.numberOfElements+1))+'px');
	$('#'+a.id+' .slideit-slide-strip').css('height',options.height+'px');
	$('#'+a.id+' .slideit-slide-strip '+options.tag).css('max-width',options.width+'px');
	$('#'+a.id+' .slideit-slide-strip '+options.tag).css('max-height',options.height+'px');
	if (options.tag!='img' && options.imgResize==true){
		$('#'+a.id+' .slideit-slide-strip img').css('max-width',options.width+'px');
		$('#'+a.id+' .slideit-slide-strip img').css('max-height',options.height+'px');
	}
	$('#'+a.id+' .slideit-bullets').css('width',parseInt(options.width*options.steps)+'px');
	// Next-Prev page functions
	function nextPage(){
		var bullet='#'+a.id+'-slideit-bullet-'+a.scrollNow;
		if (options.bullets==true) $(bullet).removeClass('active');
		if (a.scrollNow<Math.floor(a.numberOfElements/options.steps)) a.scrollNow+=1;
		else a.scrollNow=0;
		bullet='#'+a.id+'-slideit-bullet-'+a.scrollNow;
		if (options.bullets==true) $(bullet).addClass('active');
		var targetId='#'+a.id+'-slideit-'+parseInt(a.scrollNow*options.steps);
		// RESTART
		$('#'+a.id+' .slideit-canvas').scrollTo(targetId,options.scrollSpeed,{queue:true,axis:'x'});
		if (options.auto==true) autoslideit_restart();
	}
	function prevPage(){
		var bullet='#'+a.id+'-slideit-bullet-'+a.scrollNow;
		if (options.bullets==true) $(bullet).removeClass('active');
		if (a.scrollNow>0) a.scrollNow-=1;
		else a.scrollNow=Math.floor(a.numberOfElements/options.steps);
		bullet='#'+a.id+'-slideit-bullet-'+a.scrollNow;
		if (options.bullets==true) $(bullet).addClass('active');
		var targetId='#'+a.id+'-slideit-'+parseInt(a.scrollNow*options.steps);
		// RESTART
		$('#'+a.id+' .slideit-canvas').scrollTo(targetId,options.scrollSpeed,{queue:true,axis:'x'});
		if (options.auto==true) autoslideit_restart();
	}
	// Next page
	$('#'+options.nextButton).click(function(){
		nextPage();
	});
	$('#'+a.id+' .slideit-nav .slideit-next').click(function(){
		nextPage();
	});
	// Previous page
	$('#'+options.prevButton).click(function(){
		prevPage();
	});
	$('#'+a.id+' .slideit-nav .slideit-prev').click(function(){
		prevPage();
	});
	// Start autoslide function
	if (options.auto==true) t_autoslideit=setTimeout(function(){autoslideit();},options.scrollDelay);
}
})(jQuery);