https://nagasaki-bunkanet.jp/js/jquery.skitter.js

1/**
2 * jQuery Skitter Slideshow
3 * @name jquery.skitter.js
4 * @description Slideshow
5 * @author Thiago Silva Ferreira - http://thiagosf.net
6 * @version 4.2.3
7 * @date August 04, 2010
8 * @update July 12, 2014
9 * @copyright (c) 2010 Thiago Silva Ferreira - http://thiagosf.net
10 * @license Dual licensed under the MIT or GPL Version 2 licenses
11 * @example http://thiagosf.net/projects/jquery/skitter/
12 */
13;(function($) {
14	
15	var number_skitter = 0,
16		skitters = [];
17	
18	$.fn.skitter = function(options) {
19		return this.each(function() {
20			if ( $(this).data('skitter_number') == undefined ) {
21				$(this).data('skitter_number', number_skitter);
22				skitters.push(new $sk(this, options, number_skitter));
23				++number_skitter;
24			}
25		});
26	};
27	
28	var defaults = {
29		// Animation velocity
30		velocity: 				1,
31
32		// Interval between transitions
33		interval: 				2500, 
34
35		// Default animation
36		animation: 				'',
37
38		// Numbers display
39		numbers: 				true,
40
41		// Navigation display
42		navigation:			 	true,
43
44		// Label display
45		label:					true,
46
47		// Easing default
48		easing_default: 		'',
49
50		// The skitters box (internal)
51		box_skitter: 			null,
52
53		// @deprecated
54		time_interval: 			null,
55
56		// Image link (internal)
57		images_links: 			null,
58
59		// Actual image (internal)
60		image_atual: 			null,
61
62		// Actual link (internal)
63		link_atual: 			null,
64
65		// Actual label (internal)
66		label_atual: 			null,
67
68		// Actual target (internal)
69		target_atual: 			'_self',
70
71		// Skitter width (internal)
72		width_skitter: 			null,
73
74		// Skitter height (internal)
75		height_skitter: 		null,
76
77		// Image number loop (internal)
78		image_i: 				1,
79
80		// Is animating (internal)
81		is_animating:  			false,
82
83		// Is hover box_skitter (internal)
84		is_hover_box_skitter: 	false,
85
86		// Smart randomly (internal)
87		random_ia: 				null,
88
89		// Randomly sliders
90		show_randomly: 			false,
91
92		// Navigation with thumbs
93		thumbs: 				false,
94
95		// Animation/style number/dot
96		animateNumberOut: 		false,
97
98		// Animation/style hover number/dot
99		animateNumberOver: 		false,
100
101		// Animation/style active number/dot
102		animateNumberActive: 	false,
103
104		// Hide numbers and navigation
105		hideTools: 				false,
106
107		// Fullscreen mode
108		fullscreen: 			false,
109
110		// Loading data from XML file
111		xml: 					false,
112
113		// Navigation with dots
114		dots: 					false,
115
116		// Width label
117		width_label: 			null,
118
119		// Final opacity of elements in hideTools
120		opacity_elements:		0.75,
121
122		// Interval animation hover elements hideTools 
123		interval_in_elements:	200, 
124
125		// Interval animation out elements hideTools
126		interval_out_elements:	300, 
127
128		// Onload Callback
129		onLoad:					null,
130
131		// Function call to change image
132		imageSwitched:			null,
133
134		// @deprecated
135		max_number_height: 		20,
136
137		// Alignment of numbers/dots/thumbs
138		numbers_align:			'left',
139
140		// Preview with dots
141		preview:				false,
142
143		// Focus slideshow
144		focus:					false,
145
146		// Focus active (internal)
147		foucs_active:			false,
148
149		// Position of button focus slideshow
150		focus_position:			'center',
151
152		// Option play/pause manually
153		controls:				false,
154
155		// Position of button controls
156		controls_position:		'center',
157
158		// Displays progress bar
159		progressbar:			false,
160
161		// CSS progress bar
162		progressbar_css:		{},
163
164		// Is paused (internal)
165		is_paused:				false,
166
167		// Is blur (internal)
168		is_blur:				false,
169
170		// Is paused time (internal)
171		is_paused_time:			false,
172
173		// Time start (internal)
174		timeStart:				0,
175
176		// Elapsed time (internal)
177		elapsedTime:			0,
178
179		// Stop animation to move mouse over it.
180		stop_over:				true,
181
182		// Enable navigation keys
183		enable_navigation_keys:	false,
184
185		// Specific animations
186		with_animations:		[],
187
188		// Function call to go over the navigation buttons
189		// mouseOverButton: 		function() { $(this).stop().animate({opacity:0.5}, 200); }, 
190		mouseOverButton: 		null, 
191
192		// Function call to go out the navigation buttons
193		// mouseOutButton: 		function() { $(this).stop().animate({opacity:1}, 200); }, 
194		mouseOutButton: 		null, 
195
196		// Sets whether the slideshow will start automatically
197		auto_play: 				true, 
198
199		// Label animation type
200		labelAnimation: 		'slideUp', 
201
202		// Theme
203		theme: null, 
204
205		// Structure (internal)
206		structure: 	 			  '<a href="#" class="prev_button">prev</a>'
207								+ '<a href="#" class="next_button">next</a>'
208								+ '<span class="info_slide"></span>'
209								+ '<div class="container_skitter">'
210									+ '<div class="image">'
211										+ '<a href=""><img class="image_main" /></a>'
212										+ '<div class="label_skitter"></div>'
213									+ '</div>'
214								+ '</div>'
215		
216	};
217	
218	$.skitter = function(obj, options, number) {
219		this.box_skitter = $(obj);
220		this.timer = null;
221		this.settings = $.extend({}, defaults, options || {});
222		this.number_skitter = number;
223		this.setup();
224	};
225	
226	// Shortcut
227	var $sk = $.skitter;
228	
229	$sk.fn = $sk.prototype = {};
230	
231	$sk.fn.extend = $.extend;
232	
233	$sk.fn.extend({
234		
235		/**
236		 * Init
237		 */
238		setup: function() 
239		{
240			var self = this;
241
242			// Fullscreen
243			if (this.settings.fullscreen) {
244				var width = $(window).width();
245				var height = $(window).height();
246				this.box_skitter.width(width).height(height);
247				this.box_skitter.css({'position':'absolute', 'top':0, 'left':0, 'z-index':1000});
248				this.settings.stop_over = false;

249				$('body').css({'overflown':'hidden'});
250			}
251			
252			this.settings.width_skitter 	= parseFloat(this.box_skitter.css('width'));
253			this.settings.height_skitter 	= parseFloat(this.box_skitter.css('height'));
254			
255			if (!this.settings.width_skitter || !this.settings.height_skitter) {
256				console.warn('Width or height size is null! - Skitter Slideshow');
257				return false;
258			}
259
260			// Theme
261			if ( this.settings.theme ) {
262				this.box_skitter.addClass('skitter-' + this.settings.theme);
263			}
264			
265			// Structure html
266			this.box_skitter.append(this.settings.structure);
267			
268			// Settings
269			this.settings.easing_default 	= this.getEasing(this.settings.easing);
270						
271			if (this.settings.velocity >= 2) this.settings.velocity = 1.3;
272			if (this.settings.velocity <= 0) this.settings.velocity = 1;
273			
274			this.box_skitter.find('.info_slide').hide();
275			this.box_skitter.find('.label_skitter').hide();
276			this.box_skitter.find('.prev_button').hide();
277			this.box_skitter.find('.next_button').hide();
278						
279			this.box_skitter.find('.container_skitter').width(this.settings.width_skitter);
280			this.box_skitter.find('.container_skitter').height(this.settings.height_skitter);
281			
282			var width_label = this.settings.width_label ? this.settings.width_label : this.settings.width_skitter;
283			this.box_skitter.find('.label_skitter').width(width_label);
284			
285			var initial_select_class = ' image_number_select', u = 0;
286			this.settings.images_links = new Array();
287			
288			// Add image, link, animation type and label
289			var addImageLink = function (link, src, animation_type, label, target) {
290				self.settings.images_links.push([src, link, animation_type, label, target]);
291				if (self.settings.thumbs) {
292					var dimension_thumb = '';
293					if (self.settings.width_skitter > self.settings.height_skitter) {
294						dimension_thumb = 'height="100"';
295					} 
296					else {
297						dimension_thumb = 'width="100"';
298					}
299					self.box_skitter.find('.info_slide').append(
300						'<span class="image_number'+initial_select_class+'" rel="'+(u - 1)+'" id="image_n_'+u+'_'+self.number_skitter+'">'
301							+'<img src="'+src+'" '+dimension_thumb+' />'
302							+'</span> '
303					);
304				}
305				else {
306					self.box_skitter.find('.info_slide').append(
307						'<span class="image_number'+initial_select_class+'" rel="'+(u - 1)+'" id="image_n_'+u+'_'+self.number_skitter+'">'+u+'</span> '
308					);
309				}
310				initial_select_class = '';
311			};
312
313			// Load from XML
314			if (this.settings.xml) {
315				$.ajax({
316					type: 'GET',
317					url: this.settings.xml,
318					async: false,
319					dataType: 'xml',
320					success: function(xml) {
321						var ul = $('<ul></ul>');
322						$(xml).find('skitter slide').each(function(){
323							++u;
324							var link 			= ($(this).find('link').text()) ? $(this).find('link').text() : '#';
325							var src 			= $(this).find('image').text();
326							var animation_type 	= $(this).find('image').attr('type');
327							var label 			= $(this).find('label').text();
328							var target 			= ($(this).find('target').text()) ? $(this).find('target').text() : '_self';
329							addImageLink(link, src, animation_type, label, target);
330						});
331					}
332				});
333			}
334			// Load from json
335			else if (this.settings.json) {
336				
337			}
338			// Load from HTML
339			else {
340				this.box_skitter.find('ul li').each(function(){
341					++u;
342					var link 			= ($(this).find('a').length) ? $(this).find('a').attr('href') : '#';
343					var src 			= $(this).find('img').attr('src');
344					var animation_type 	= $(this).find('img').attr('class');
345					var label 			= $(this).find('.label_text').html();
346					var target 			= ($(this).find('a').length && $(this).find('a').attr('target')) ? $(this).find('a').attr('target') : '_self';
347					addImageLink(link, src, animation_type, label, target);
348				});
349			}
350			
351			// Thumbs
352			if (self.settings.thumbs && !self.settings.fullscreen) 
353			{
354				// New animation
355				self.settings.animateNumberOut = {opacity:0.3};
356				self.settings.animateNumberOver = {opacity:0.5};
357				self.settings.animateNumberActive = {opacity:1};
358				
359				self.box_skitter.find('.info_slide').addClass('info_slide_thumb');
360				var width_info_slide = (u + 1) * self.box_skitter.find('.info_slide_thumb .image_number').width();
361				self.box_skitter.find('.info_slide_thumb').width(width_info_slide);
362				self.box_skitter.css({height:self.box_skitter.height() + self.box_skitter.find('.info_slide').height()});
363				
364				self.box_skitter.append('<div class="container_thumbs"></div>');
365				var copy_info_slide = self.box_skitter.find('.info_slide').clone();
366				self.box_skitter.find('.info_slide').remove();
367				self.box_skitter.find('.container_thumbs')
368					.width(self.settings.width_skitter)
369					.append(copy_info_slide);
370				
371				// Scrolling with mouse movement
372				var width_image = 0, 
373					width_skitter = this.settings.width_skitter,
374					height_skitter = this.settings.height_skitter, 
375					w_info_slide_thumb = 0,
376					info_slide_thumb = self.box_skitter.find('.info_slide_thumb'),
377					x_value = 0,
378					y_value = self.box_skitter.offset().top;
379					
380				info_slide_thumb.find('.image_number').each(function(){
381					width_image += $(this).outerWidth();
382				});
383				
384				info_slide_thumb.width(width_image+'px');
385				w_info_slide_thumb = info_slide_thumb.width();
386				width_value = this.settings.width_skitter;
387				
388				width_value = width_skitter - 100;
389				
390				if (width_info_slide > self.settings.width_skitter) {
391					self.box_skitter.mousemove(function(e){
392						x_value = self.box_skitter.offset().left + 90;
393						

394						var x = e.pageX, y = e.pageY, new_x = 0;
395						
396						x = x - x_value;
397						y = y - y_value;
398						novo_width = w_info_slide_thumb - width_value;
399						new_x = -((novo_width * x) / width_value);
400						
401						if (new_x > 0) new_x = 0;
402						if (new_x < -(w_info_slide_thumb - width_skitter)) new_x = -(w_info_slide_thumb - width_skitter);
403						
404						if (y > height_skitter) {
405							info_slide_thumb.css({left: new_x});
406						}
407					});
408				}
409				
410				self.box_skitter.find('.scroll_thumbs').css({'left':10});
411				
412				if (width_info_slide < self.settings.width_skitter) {
413					self.box_skitter.find('.info_slide').width('auto');
414					self.box_skitter.find('.box_scroll_thumbs').hide();
415					
416					var class_info = '.info_slide';
417					switch (self.settings.numbers_align) {
418						case 'center' : 
419							var _vleft = (self.settings.width_skitter - self.box_skitter.find(class_info).width()) / 2;
420							self.box_skitter.find(class_info).css({'left':_vleft});
421							break;
422							
423						case 'right' : 
424							self.box_skitter.find(class_info).css({'left':'auto', 'right':'-5px'});
425							break;
426							
427						case 'left' : 
428							self.box_skitter.find(class_info).css({'left':'0px'});
429							break;
430					}
431				}
432				
433			}
434			else 
435			{
436				var class_info = '.info_slide';
437				
438				if (self.settings.dots) {
439					self.box_skitter.find('.info_slide').addClass('info_slide_dots').removeClass('info_slide');
440					class_info = '.info_slide_dots';
441				}
442				
443				switch (self.settings.numbers_align) {
444					case 'center' : 
445						var _vleft = (self.settings.width_skitter - self.box_skitter.find(class_info).width()) / 2;
446						self.box_skitter.find(class_info).css({'left':_vleft});
447						break;
448						
449					case 'right' : 
450						self.box_skitter.find(class_info).css({'left':'auto', 'right':'15px'});
451						break;
452						
453					case 'left' : 
454						self.box_skitter.find(class_info).css({'left':'15px'});
455						break;
456				}
457				
458				if (!self.settings.dots) {
459					if (self.box_skitter.find('.info_slide').height() > 20) {
460						self.box_skitter.find('.info_slide').hide();
461					}
462				}
463			}
464			
465			this.box_skitter.find('ul').hide();
466			
467			if (this.settings.show_randomly)
468			this.settings.images_links.sort(function(a,b) {return Math.random() - 0.5;});
469			
470			this.settings.image_atual 	= this.settings.images_links[0][0];
471			this.settings.link_atual 	= this.settings.images_links[0][1];
472			this.settings.label_atual 	= this.settings.images_links[0][3];
473			this.settings.target_atual 	= this.settings.images_links[0][4];
474			
475			if (this.settings.images_links.length > 1) 
476			{
477				this.box_skitter.find('.prev_button').click(function() {
478					if (self.settings.is_animating == false) {
479						
480						self.settings.image_i -= 2;
481						
482						if (self.settings.image_i == -2) {
483							self.settings.image_i = self.settings.images_links.length - 2;
484						} 
485						else if (self.settings.image_i == -1) {
486							self.settings.image_i = self.settings.images_links.length - 1;
487						}
488						
489						self.jumpToImage(self.settings.image_i);
490					}
491					return false;
492				});
493				
494				this.box_skitter.find('.next_button').click(function() {
495					self.jumpToImage(self.settings.image_i);
496					return false;
497				});
498				
499				self.box_skitter.find('.next_button, .prev_button').bind('mouseover', self.settings.mouseOverButton);
500				self.box_skitter.find('.next_button, .prev_button').bind('mouseleave', self.settings.mouseOutButton);
501				
502				this.box_skitter.find('.image_number').hover(function() {
503					if ($(this).attr('class') != 'image_number image_number_select') {
504						if ( self.settings.animateNumberOver ) {
505							$(this).stop().animate(self.settings.animateNumberOver, 300);
506						}
507						// $(this).stop().animate(self.settings.animateNumberOver, 300);
508					}
509				}, function(){
510					if ($(this).attr('class') != 'image_number image_number_select') {
511						if ( self.settings.animateNumberOut ) {
512							$(this).stop().animate(self.settings.animateNumberOut, 500);
513						}
514						// $(this).stop().animate(self.settings.animateNumberOut, 500);
515					}
516				});
517				
518				this.box_skitter.find('.image_number').click(function(){
519					if ($(this).attr('class') != 'image_number image_number_select') {
520						var imageNumber = parseInt($(this).attr('rel'));
521						self.jumpToImage(imageNumber);
522					}
523					return false;

524				});
525				
526				if ( self.settings.animateNumberOut ) {
527					this.box_skitter.find('.image_number').css(self.settings.animateNumberOut);
528				}
529
530				if ( self.settings.animateNumberActive ) {
531					this.box_skitter.find('.image_number:eq(0)').css(self.settings.animateNumberActive);
532				}
533
534				// this.box_skitter.find('.image_number').css(self.settings.animateNumberOut);
535				// this.box_skitter.find('.image_number:eq(0)').css(self.settings.animateNumberActive);
536				
537				// Preview with dots
538				if (self.settings.preview && self.settings.dots) 
539				{
540					var preview = $('<div class="preview_slide"><ul></ul></div>');
541					
542					for (var i = 0; i < this.settings.images_links.length; i++) {
543						var li = $('<li></li>');
544						var img = $('<img />');
545						img.attr('src', this.settings.images_links[i][0]);
546						li.append(img);
547						preview.find('ul').append(li);
548					}
549					
550					var width_preview_ul = parseInt(this.settings.images_links.length * 100);
551					preview.find('ul').width(width_preview_ul);
552					$(class_info).append(preview);
553					
554					self.box_skitter.find(class_info).find('.image_number').mouseenter(function() {
555						var _left_info = parseFloat(self.box_skitter.find(class_info).offset().left);
556						var _left_image = parseFloat($(this).offset().left);
557						var _left_preview = (_left_image - _left_info) - 43;
558						
559						var rel = parseInt($(this).attr('rel'));
560						var image_current_preview = self.box_skitter.find('.preview_slide_current img').attr('src');
561						var _left_ul = -(rel * 100);
562						
563						self.box_skitter.find('.preview_slide').find('ul').animate({left: _left_ul}, {duration:200, queue: false, easing: 'easeOutSine'});
564						self.box_skitter.find('.preview_slide').fadeTo(1,1).animate({left: _left_preview}, {duration:200, queue: false});
565					});
566					
567					self.box_skitter.find(class_info).mouseleave(function() {
568						$('.preview_slide').animate({opacity: 'hide'}, {duration: 200, queue: false});
569					});
570				}
571			}
572			
573			// Focus
574			if (self.settings.focus) {
575				self.focusSkitter();
576			}
577			
578			// Constrols
579			if (self.settings.controls) {
580				self.setControls();
581			}
582			
583			// Progressbar
584			if (self.settings.progressbar && self.settings.auto_play) {
585				self.addProgressBar();
586			}
587
588			// hideTools
589			if (self.settings.hideTools) {
590				self.hideTools();
591			}
592
593			// Navigation keys
594			if (self.settings.enable_navigation_keys) {
595				self.enableNavigationKeys();
596			}
597			
598			this.loadImages();
599		},
600		
601		/**
602		 * Load images
603		 */
604		loadImages: function () 
605		{
606			var self = this;
607			
608			var loading = $('<div class="loading">Loading</div>');
609			this.box_skitter.append(loading);
610			var total = this.settings.images_links.length;
611			
612			var u = 0;
613			$.each(this.settings.images_links, function(i)
614			{
615				var self_il = this;
616				var loading = $('<span class="image_loading"></span>');
617				loading.css({position:'absolute', top:'-9999em'});
618				self.box_skitter.append(loading);
619				var img = new Image();
620				
621				$(img).load(function () {
622					++u;
623					if (u == total) {
624						self.box_skitter.find('.loading').remove();
625						self.box_skitter.find('.image_loading').remove();
626						self.start();
627					}
628				}).error(function () {
629					self.box_skitter.find('.loading, .image_loading, .image_number, .next_button, .prev_button').remove();
630					self.box_skitter.html('<p style="color:white;background:black;">Error loading images. One or more images were not found.</p>');
631				}).attr('src', self_il[0]);
632			});
633		}, 
634		
635		/**
636		 * Start skitter
637		 */
638		start: function()
639		{
640			var self = this;
641			var init_pause = false;
642
643			if (this.settings.numbers || this.settings.thumbs) this.box_skitter.find('.info_slide').fadeIn(500);
644			if (this.settings.dots) this.box_skitter.find('.info_slide_dots').fadeIn(500);
645			if (this.settings.label) this.box_skitter.find('.label_skitter').show();
646			if (this.settings.navigation) {
647				this.box_skitter.find('.prev_button').fadeIn(500);
648				this.box_skitter.find('.next_button').fadeIn(500);
649			}
650			
651			if (self.settings.auto_play) {
652				self.startTime();
653			}
654
655			self.windowFocusOut();
656			self.setLinkAtual();
657			
658			self.box_skitter.find('.image a img').attr({'src': self.settings.image_atual});
659			img_link = self.box_skitter.find('.image a');
660			img_link = self.resizeImage(img_link);
661			img_link.find('img').fadeIn(1500);
662			
663			self.setValueBoxText();
664			self.showBoxText();
665			
666			if (self.settings.auto_play) {
667				self.stopOnMouseOver();
668			}
669
670			var mouseOverInit = function() {
671				if (self.settings.stop_over) {
672					init_pause = true;
673					self.settings.is_hover_box_skitter = true;
674					self.clearTimer(true);
675					self.pauseProgressBar();
676				}
677			};
678
679			self.box_skitter.mouseover(mouseOverInit);
680			self.box_skitter.find('.next_button').mouseover(mouseOverInit);
681			
682			if (self.settings.images_links.length > 1 && !init_pause) {
683				if (self.settings.auto_play) {
684					self.timer = setTimeout(function() { self.nextImage(); }, self.settings.interval);
685				}
686			} 
687			else {
688				self.box_skitter.find('.loading, .image_loading, .image_number, .next_button, .prev_button').remove();
689			}
690			
691			if ($.isFunction(self.settings.onLoad)) self.settings.onLoad(self);
692		},
693		
694		/**
695		 * Jump to image
696		 */
697		jumpToImage: function(imageNumber) 
698		{
699			if (this.settings.is_animating == false) {
700				this.settings.elapsedTime = 0;
701				this.box_skitter.find('.box_clone').stop();
702				this.clearTimer(true);
703				this.settings.image_i = Math.floor(imageNumber);
704				
705				this.box_skitter.find('.image a').attr({'href': this.settings.link_atual});
706				this.box_skitter.find('.image_main').attr({'src': this.settings.image_atual});
707				this.box_skitter.find('.box_clone').remove();
708
709				this.nextImage();
710			}
711		},
712		
713		/**
714		 * Next image
715		 */
716		nextImage: function() 
717		{
718			var self = this;
719			
720			animations_functions = [
721				'cube', 
722				'cubeRandom', 
723				'block', 
724				'cubeStop', 
725				'cubeStopRandom', 
726				'cubeHide', 
727				'cubeSize', 
728				'horizontal', 
729				'showBars', 
730				'showBarsRandom', 
731				'tube',
732				'fade',
733				'fadeFour',
734				'paralell',
735				'blind',
736				'blindHeight',
737				'blindWidth',
738				'directionTop',
739				'directionBottom',
740				'directionRight',
741				'directionLeft',
742				'cubeSpread',
743				'glassCube',
744				'glassBlock',
745				'circles',
746				'circlesInside',
747				'circlesRotate',
748				'cubeShow',
749				'upBars', 
750				'downBars', 
751				'hideBars', 

752				'swapBars', 
753				'swapBarsBack', 
754				'swapBlocks',
755				'cut'
756			];
757						
758			if (self.settings.progressbar) self.hideProgressBar();
759			
760			animation_type = (this.settings.animation == '' && this.settings.images_links[this.settings.image_i][2]) ? 
761				this.settings.images_links[this.settings.image_i][2] : (this.settings.animation == '' ? 'default' : this.settings.animation);
762			
763			// RandomUnique
764			if (animation_type == 'randomSmart') 
765			{
766				if (!this.settings.random_ia) {
767					animations_functions.sort(function() {
768						return 0.5 - Math.random();
769					});
770					this.settings.random_ia = animations_functions;
771				}
772				animation_type = this.settings.random_ia[this.settings.image_i];
773			}
774			// Random
775			else if (animation_type == 'random') 
776			{
777				var random_id = parseInt(Math.random() * animations_functions.length);
778				animation_type = animations_functions[random_id];
779			}
780			// Specific animations
781			else if (self.settings.with_animations.length > 0)
782			{
783				var total_with_animations = self.settings.with_animations.length;
784				if (this.settings._i_animation == undefined) {
785					this.settings._i_animation = 0;
786				}
787				animation_type = self.settings.with_animations[this.settings._i_animation];
788				++this.settings._i_animation;
789				if (this.settings._i_animation >= total_with_animations) this.settings._i_animation = 0;
790			}
791			
792			switch (animation_type) 
793			{
794				case 'cube' : 
795					this.animationCube();
796					break;
797				case 'cubeRandom' : 
798					this.animationCube({random:true});
799					break;
800				case 'block' : 
801					this.animationBlock();
802					break;
803				case 'cubeStop' : 
804					this.animationCubeStop();
805					break;
806				case 'cubeStopRandom' : 
807					this.animationCubeStop({random:true});
808					break;
809				case 'cubeHide' : 
810					this.animationCubeHide();
811					break;
812				case 'cubeSize' : 
813					this.animationCubeSize();
814					break;
815				case 'horizontal' : 
816					this.animationHorizontal();
817					break;
818				case 'showBars' : 
819					this.animationShowBars();
820					break;
821				case 'showBarsRandom' : 
822					this.animationShowBars({random:true});
823					break;
824				case 'tube' : 
825					this.animationTube();
826					break;
827				case 'fade' : 
828					this.animationFade();
829					break;
830				case 'fadeFour' : 
831					this.animationFadeFour();
832					break;
833				case 'paralell' : 
834					this.animationParalell();
835					break;
836				case 'blind' : 
837					this.animationBlind();
838					break;
839				case 'blindHeight' : 
840					this.animationBlindDimension({height:true});
841					break;
842				case 'blindWidth' : 
843					this.animationBlindDimension({height:false, time_animate:400, delay:50});
844					break;
845				case 'directionTop' : 
846					this.animationDirection({direction:'top'});
847					break;
848				case 'directionBottom' : 
849					this.animationDirection({direction:'bottom'});
850					break;
851				case 'directionRight' : 
852					this.animationDirection({direction:'right', total:5});
853					break;
854				case 'directionLeft' : 
855					this.animationDirection({direction:'left', total:5});
856					break;
857				case 'cubeSpread' : 
858					this.animationCubeSpread();
859					break;
860				case 'cubeJelly' : 
861					this.animationCubeJelly();
862					break;
863				case 'glassCube' : 
864					this.animationGlassCube();
865					break;
866				case 'glassBlock' : 
867					this.animationGlassBlock();
868					break;
869				case 'circles' : 
870					this.animationCircles();
871					break;
872				case 'circlesInside' : 
873					this.animationCirclesInside();
874					break;
875				case 'circlesRotate' : 
876					this.animationCirclesRotate();
877					break;
878				case 'cubeShow' : 
879					this.animationCubeShow();
880					break;
881				case 'upBars' : 
882					this.animationDirectionBars({direction: 'top'});
883					break;
884				case 'downBars' : 
885					this.animationDirectionBars({direction: 'bottom'});
886					break;
887				case 'hideBars' : 
888					this.animationHideBars();
889					break;
890				case 'swapBars' : 
891					this.animationSwapBars();
892					break;
893				case 'swapBarsBack' : 
894					this.animationSwapBars({easing: 'easeOutBack'});
895					break;
896				case 'swapBlocks' : 
897					this.animationSwapBlocks();
898					break;
899				case 'cut' : 
900					this.animationCut();
901					break;
902				default : 
903					this.animationTube();
904					break;
905			}
906		},
907		
908		animationCube: function (options)
909		{
910			var self = this;
911			
912			var options = $.extend({}, {random: false}, options || {});
913			
914			this.settings.is_animating = true;
915			var easing = (this.settings.easing_default == '') ? 'easeOutExpo' : this.settings.easing_default;
916			var time_animate = 700 / this.settings.velocity;
917			
918			this.setActualLevel();
919			

920			var division_w 	= Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 8));
921			var division_h 	= Math.ceil(this.settings.height_skitter / (this.settings.height_skitter / 3));
922			var total		= division_w * division_h;
923			
924			var width_box 	= Math.ceil(this.settings.width_skitter / division_w);
925			var height_box 	= Math.ceil(this.settings.height_skitter / division_h);
926			
927			var init_top 	= this.settings.height_skitter + 200;
928			var init_left 	= this.settings.height_skitter + 200;
929			
930			var col_t = 0;
931			var col = 0;
932			
933			for (i = 0; i < total; i++) {
934				
935				init_top 			= (i % 2 == 0) ? init_top : -init_top;
936				init_left 			= (i % 2 == 0) ? init_left : -init_left;
937
938				var _vtop 			= init_top + (height_box * col_t) + (col_t * 150);
939				var _vleft 			= -self.settings.width_skitter;
940				//var _vleft 			= (init_left + (width_box * col)) + (col * 50);
941				
942				var _vtop_image 	= -(height_box * col_t);
943				
944				var _vleft_image 	= -(width_box * col);
945				var _btop 			= (height_box * col_t);
946				var _bleft 			= (width_box * col);
947				
948				var box_clone 		= this.getBoxClone();
949				box_clone.hide();
950				
951				var delay_time = 50 * (i);
952				
953				if (options.random) {
954					delay_time = 40 * (col);
955					box_clone.css({left:_vleft+'px', top:_vtop+'px', width:width_box, height:height_box});
956				} 
957				else {
958					time_animate = 500;
959					//box_clone.css({left:(this.settings.width_skitter / 2), top:this.settings.height_skitter + 50, width:width_box, height:height_box});
960					box_clone.css({left:(this.settings.width_skitter) + (width_box * i), top:this.settings.height_skitter + (height_box * i), width:width_box, height:height_box});
961				}
962				
963				//box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
964				//box_clone.find('img').css({left:_vleft_image+100, top:_vtop_image});
965				
966				this.addBoxClone(box_clone);
967				
968				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
969				box_clone.show().delay(delay_time).animate({top:_btop+'px', left:_bleft+'px'}, time_animate, easing, callback);
970				
971				if (options.random) {
972					box_clone.find('img').css({left:_vleft_image+100, top:_vtop_image+50});
973					box_clone.find('img').delay(delay_time+(time_animate/2)).animate({left:_vleft_image, top:_vtop_image}, 1000, 'easeOutBack');
974				}
975				else {
976					box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
977					box_clone.find('img').delay(delay_time+(time_animate/2)).fadeTo(100, 0.5).fadeTo(300, 1);
978				}
979				
980				col_t++;
981				if (col_t == division_h) {
982					col_t = 0;
983					col++;
984				}
985			}
986		},
987		
988		animationBlock: function(options)
989		{
990			var self = this;
991			
992			this.settings.is_animating = true;
993			var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default;
994			var time_animate = 500 / this.settings.velocity;
995			
996			this.setActualLevel();
997			
998			var total 		= Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 15));
999			var width_box 	= Math.ceil(this.settings.width_skitter / total);
1000			var height_box 	= (this.settings.height_skitter);
1001			
1002			for (i = 0; i < total; i++) {
1003				
1004				var _bleft = (width_box * (i));
1005				var _btop = 0;
1006				
1007				var box_clone = this.getBoxClone();
1008				box_clone.css({left: this.settings.width_skitter + 100, top:0, width:width_box, height:height_box});
1009				box_clone.find('img').css({left:-(width_box * i)});
1010				
1011				this.addBoxClone(box_clone);
1012				
1013				var delay_time = 80 * (i);
1014				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
1015				//box_clone.delay(delay_time).animate({top:_btop, left:_bleft, opacity:'show'}, time_animate, easing, callback);
1016				
1017				box_clone.show().delay(delay_time).animate({top:_btop, left:_bleft}, time_animate, easing);
1018				box_clone.find('img').hide().delay(delay_time+100).animate({opacity:'show'}, time_animate+300, easing, callback);
1019			}
1020			
1021		},
1022		
1023		animationCubeStop: function(options)
1024		{
1025			var self = this;
1026
1027			var options = $.extend({}, {random: false}, options || {});
1028
1029			this.settings.is_animating = true;
1030			var easing = (this.settings.easing_default == '') ? 'easeInQuad' : this.settings.easing_default;
1031			var time_animate = 300 / this.settings.velocity;
1032
1033			var image_old = this.box_skitter.find('.image_main').attr('src');
1034
1035			this.setActualLevel();
1036
1037			this.setLinkAtual();
1038			this.box_skitter.find('.image_main').attr({'src':this.settings.image_atual});
1039
1040			var division_w = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 8));
1041			var division_h = Math.ceil(this.settings.height_skitter / (this.settings.width_skitter / 8));
1042			var total = division_w * division_h;
1043
1044			var width_box = Math.ceil(this.settings.width_skitter / division_w);
1045			var height_box = Math.ceil(this.settings.height_skitter / division_h);
1046
1047			var init_top = 0;
1048			var init_left = 0;
1049
1050			var col_t = 0;
1051			var col = 0;
1052			var _ftop = this.settings.width_skitter / 16;
1053
1054			for (i = 0; i < total; i++) {
1055				init_top = (i % 2 == 0) ? init_top : -init_top;
1056				init_left = (i % 2 == 0) ? init_left : -init_left;
1057
1058				var _vtop = init_top + (height_box * col_t);
1059				var _vleft = (init_left + (width_box * col));
1060				var _vtop_image = -(height_box * col_t);
1061
1062				var _vleft_image = -(width_box * col);
1063				var _btop = _vtop - _ftop;
1064				var _bleft = _vleft - _ftop;
1065
1066				var box_clone = this.getBoxCloneImgOld(image_old);
1067				box_clone.css({left:_vleft+'px', top:_vtop+'px', width:width_box, height:height_box});
1068				box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
1069
1070				this.addBoxClone(box_clone);
1071				box_clone.show();
1072
1073				var delay_time = 50 * i;
1074
1075				if (options.random) {
1076					time_animate = (400 * (self.getRandom(2) + 1)) / this.settings.velocity;
1077					_btop = _vtop;
1078					_bleft = _vleft;

1079					delay_time = Math.ceil( 30 * self.getRandom(30) );
1080				}
1081				
1082				if (options.random && i == (total - 1)) {
1083					time_animate = 400 * 3;
1084					delay_time = 30 * 30;
1085				}
1086
1087				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
1088				box_clone.delay(delay_time).animate({opacity:'hide', top:_btop+'px', left:_bleft+'px'}, time_animate, easing, callback);
1089
1090				col_t++;
1091				if (col_t == division_h) {
1092					col_t = 0;
1093					col++;
1094				}
1095			}
1096		},
1097		
1098		animationCubeHide: function(options)
1099		{
1100			var self = this;
1101			
1102			this.settings.is_animating = true;
1103			var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default;
1104			var time_animate = 500 / this.settings.velocity;
1105			
1106			var image_old = this.box_skitter.find('.image_main').attr('src');
1107			
1108			this.setActualLevel();
1109			
1110			this.setLinkAtual();
1111			this.box_skitter.find('.image_main').attr({'src':this.settings.image_atual});
1112			
1113			var division_w 	= Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 8));

1114			var division_h 	= Math.ceil(this.settings.height_skitter / (this.settings.height_skitter / 3));
1115			var total		= division_w * division_h;
1116			
1117			var width_box 	= Math.ceil(this.settings.width_skitter / division_w);
1118			var height_box 	= Math.ceil(this.settings.height_skitter / division_h);
1119			
1120			var init_top 	= 0;
1121			var init_left 	= 0;
1122			
1123			var col_t 		= 0;
1124			var col 		= 0;
1125			
1126			for (i = 0; i < total; i++) {
1127				
1128				init_top 			= (i % 2 == 0) ? init_top : -init_top;
1129				init_left 			= (i % 2 == 0) ? init_left : -init_left;
1130
1131				var _vtop 			= init_top + (height_box * col_t);
1132				var _vleft 			= (init_left + (width_box * col));
1133				var _vtop_image 	= -(height_box * col_t);
1134				
1135				var _vleft_image 	= -(width_box * col);
1136				var _btop 			= _vtop - 50;
1137				var _bleft 			= _vleft - 50;
1138				
1139				var box_clone = this.getBoxCloneImgOld(image_old);
1140				box_clone.css({left:_vleft+'px', top:_vtop+'px', width:width_box, height:height_box});
1141				box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
1142				
1143				this.addBoxClone(box_clone);
1144				box_clone.show();
1145				
1146				var delay_time = 50 * i;
1147				delay_time = (i == (total - 1)) ? (total * 50) : delay_time;
1148				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
1149				
1150				box_clone.delay(delay_time).animate({opacity:'hide'}, time_animate, easing, callback);
1151				
1152				col_t++;
1153				if (col_t == division_h) {
1154					col_t = 0;
1155					col++;
1156				}
1157			}
1158			
1159		},
1160		
1161		animationCubeJelly: function(options)
1162		{
1163			var self = this;
1164			
1165			this.settings.is_animating = true;
1166			var easing = (this.settings.easing_default == '') ? 'easeInBack' : this.settings.easing_default;
1167			var time_animate = 300 / this.settings.velocity;
1168			
1169			var image_old = this.box_skitter.find('.image_main').attr('src');
1170			
1171			this.setActualLevel();
1172			
1173			this.setLinkAtual();
1174			this.box_skitter.find('.image_main').attr({'src':this.settings.image_atual});
1175			
1176			var division_w 	= Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 8));

1177			var division_h 	= Math.ceil(this.settings.height_skitter / (this.settings.height_skitter / 3));
1178			var total		= division_w * division_h;
1179			
1180			var width_box 	= Math.ceil(this.settings.width_skitter / division_w);
1181			var height_box 	= Math.ceil(this.settings.height_skitter / division_h);
1182			
1183			var init_top 	= 0;
1184			var init_left 	= 0;
1185			
1186			var col_t 		= 0;
1187			var col 		= 0;
1188			var u			= -1;
1189			
1190			for (i = 0; i < total; i++) {
1191			
1192				if (col % 2 != 0) {
1193					if (col_t == 0) {
1194						u = u + division_h + 1;
1195					}
1196					u--;
1197				} 
1198				else {
1199					if (col > 0 && col_t == 0) {
1200						u = u + 2;
1201					}
1202					u++;
1203				}
1204			
1205				init_top 			= (i % 2 == 0) ? init_top : -init_top;
1206				init_left 			= (i % 2 == 0) ? init_left : -init_left;
1207
1208				var _vtop 			= init_top + (height_box * col_t);
1209				var _vleft 			= (init_left + (width_box * col));
1210				var _vtop_image 	= -(height_box * col_t);
1211				
1212				var _vleft_image 	= -(width_box * col);
1213				var _btop 			= _vtop - 50;
1214				var _bleft 			= _vleft - 50;
1215				
1216				var box_clone = this.getBoxCloneImgOld(image_old);
1217				box_clone.css({left:_vleft+'px', top:_vtop+'px', width:width_box, height:height_box});
1218				box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
1219				
1220				this.addBoxClone(box_clone);
1221				box_clone.show();
1222				
1223				var delay_time = (50 * i);
1224				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
1225				
1226				box_clone.delay(delay_time).animate({width:'+=100px', height:'+=100px', top:'-=20px',  left: '-=20px', opacity:'hide'}, time_animate, easing, callback);
1227				col_t++;
1228				
1229				if (col_t == division_h) {
1230					col_t = 0;
1231					col++;
1232				}
1233				
1234			}
1235		},
1236		
1237		animationCubeSize: function(options)
1238		{
1239			var self = this;
1240			
1241			this.settings.is_animating = true;
1242			var easing = (this.settings.easing_default == '') ? 'easeInOutQuad' : this.settings.easing_default;
1243			var time_animate = 600 / this.settings.velocity;
1244			
1245			var image_old = this.box_skitter.find('.image_main').attr('src');
1246			
1247			this.setActualLevel();
1248			
1249			this.setLinkAtual();
1250			this.box_skitter.find('.image_main').attr({'src':this.settings.image_atual});
1251			
1252			var division_w 	= Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 8));

1253			var division_h 	= Math.ceil(this.settings.height_skitter / (this.settings.height_skitter / 3));
1254			var total		= division_w * division_h;
1255			
1256			var width_box 	= Math.ceil(this.settings.width_skitter / division_w);
1257			var height_box 	= Math.ceil(this.settings.height_skitter / division_h);
1258			
1259			var init_top 	= 0;
1260			var init_left 	= 0;
1261			
1262			var col_t 		= 0;
1263			var col 		= 0;
1264			var _ftop		= Math.ceil(this.settings.width_skitter / 6);
1265			
1266			for (i = 0; i < total; i++) {
1267				
1268				init_top 			= (i % 2 == 0) ? init_top : -init_top;
1269				init_left 			= (i % 2 == 0) ? init_left : -init_left;
1270
1271				var _vtop 			= init_top + (height_box * col_t);
1272				var _vleft 			= (init_left + (width_box * col));
1273				var _vtop_image 	= -(height_box * col_t);
1274				
1275				var _vleft_image 	= -(width_box * col);
1276				var _btop 			= _vtop - _ftop;
1277				var _bleft 			= _vleft - _ftop;
1278				
1279				var box_clone = this.getBoxCloneImgOld(image_old);
1280				box_clone.css({left:_vleft, top:_vtop, width:width_box, height:height_box});
1281				box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
1282				
1283				this.addBoxClone(box_clone);
1284				box_clone.show();
1285				
1286				var delay_time = 50 * i;
1287				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
1288				box_clone.delay(delay_time).animate({
1289					opacity:'hide',width:'hide',height:'hide',top:_vtop+(width_box*1.5),left:_vleft+(height_box*1.5)
1290				}, time_animate, easing, callback);
1291				
1292				col_t++;
1293				if (col_t == division_h) {
1294					col_t = 0;
1295					col++;
1296				}
1297			}
1298			
1299		},
1300		
1301		animationHorizontal: function(options)
1302		{
1303			var self = this;
1304			
1305			this.settings.is_animating = true;
1306			var easing = (this.settings.easing_default == '') ? 'easeOutExpo' : this.settings.easing_default;
1307			var time_animate = 700 / this.settings.velocity;
1308			
1309			this.setActualLevel();
1310			
1311			var total 		= Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 7));
1312			var width_box 	= (this.settings.width_skitter);
1313			var height_box 	= Math.ceil(this.settings.height_skitter / total);
1314			
1315			for (i = 0; i < total; i++) {
1316				var _bleft = (i % 2 == 0 ? '' : '') + width_box;
1317				var _btop = (i * height_box);
1318				
1319				var box_clone = this.getBoxClone();
1320				
1321				box_clone.css({left:_bleft+'px', top:_btop+'px', width:width_box, height:height_box});
1322				box_clone.find('img').css({left:0, top:-_btop});
1323				
1324				this.addBoxClone(box_clone);
1325				
1326				var delay_time = 90 * i;
1327				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
1328				box_clone.delay(delay_time).animate({opacity:'show', top:_btop, left:0}, time_animate, easing, callback);
1329			}
1330		},
1331		
1332		animationShowBars: function(options)
1333		{
1334			var self = this;
1335			
1336			var options = $.extend({}, {random: false}, options || {});
1337			
1338			this.settings.is_animating = true;
1339			var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default;
1340			var time_animate = 400 / this.settings.velocity;
1341			
1342			this.setActualLevel();
1343			
1344			var total 		= Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 10));
1345			var width_box 	= Math.ceil(this.settings.width_skitter / total);
1346			var height_box 	= (this.settings.height_skitter);
1347			
1348			for (i = 0; i < total; i++) {
1349				
1350				var _bleft = (width_box * (i));
1351				var _btop = 0;
1352				
1353				var box_clone = this.getBoxClone();
1354				
1355				box_clone.css({left:_bleft, top:_btop - 50, width:width_box, height:height_box});
1356				box_clone.find('img').css({left:-(width_box * i), top:0});
1357				
1358				this.addBoxClone(box_clone);
1359				
1360				if (options.random) {
1361					var random = this.getRandom(total);
1362					var delay_time = 50 * random;
1363					delay_time = (i == (total - 1)) ? (50 * total) : delay_time;
1364				}
1365				else {
1366					var delay_time = 70 * (i);
1367					time_animate = time_animate - (i * 2);
1368				}
1369				
1370				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
1371				box_clone.delay(delay_time).animate({
1372					opacity:'show', top:_btop+'px', left:_bleft+'px'
1373				}, time_animate, easing, callback);
1374			}
1375			
1376		},
1377		
1378		animationTube: function(options)
1379		{
1380			var self = this;
1381			
1382			this.settings.is_animating = true;
1383			var easing = (this.settings.easing_default == '') ? 'easeOutElastic' : this.settings.easing_default;
1384			var time_animate = 600 / this.settings.velocity;
1385			
1386			this.setActualLevel();
1387			

1388			var total 		= Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 10));
1389			var width_box 	= Math.ceil(this.settings.width_skitter / total);
1390			var height_box 	= this.settings.height_skitter;
1391			
1392			for (i = 0;i<total;i++) {
1393				var _btop = 0;
1394				var _vtop = height_box;
1395				var vleft = width_box * i;
1396			
1397				var box_clone = this.getBoxClone();
1398				
1399				box_clone.css({left:vleft,top: _vtop, height:height_box, width: width_box});
1400				box_clone.find('img').css({left:-(vleft)});
1401				
1402				this.addBoxClone(box_clone);
1403				
1404				var random = this.getRandom(total);
1405				var delay_time = 30 * random;
1406				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
1407				box_clone.show().delay(delay_time).animate({top:_btop}, time_animate, easing, callback);
1408			}
1409		},
1410		
1411		animationFade: function(options)
1412		{
1413			var self = this;
1414			
1415			this.settings.is_animating = true;
1416			var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default;
1417			var time_animate = 800 / this.settings.velocity;
1418			
1419			this.setActualLevel();
1420			
1421			var width_box 	= this.settings.width_skitter;
1422			var height_box 	= this.settings.height_skitter;
1423			var total 		= 2;
1424			
1425			for (i = 0;i<total;i++) {
1426				var _vtop = 0;
1427				var _vleft = 0;
1428			
1429				var box_clone = this.getBoxClone();
1430				box_clone.css({left:_vleft, top:_vtop, width:width_box, height:height_box});
1431				this.addBoxClone(box_clone);
1432
1433				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
1434				box_clone.animate({opacity:'show', left:0, top:0}, time_animate, easing, callback);
1435			}
1436		},
1437		
1438		animationFadeFour: function(options)
1439		{
1440			var self = this;
1441			
1442			this.settings.is_animating = true;
1443			var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default;
1444			var time_animate = 500 / this.settings.velocity;
1445			
1446			this.setActualLevel();
1447			
1448			var width_box 	= this.settings.width_skitter;
1449			var height_box 	= this.settings.height_skitter;
1450			var total 		= 4;
1451			
1452			for (i = 0;i<total;i++) {
1453				
1454				if (i == 0) {
1455					var _vtop = '-100px';
1456					var _vleft = '-100px';
1457				} else if (i == 1) {
1458					var _vtop = '-100px';
1459					var _vleft = '100px';
1460				} else if (i == 2) {
1461					var _vtop = '100px';
1462					var _vleft = '-100px';
1463				} else if (i == 3) {
1464					var _vtop = '100px';
1465					var _vleft = '100px';
1466				}
1467			
1468				var box_clone = this.getBoxClone();
1469				box_clone.css({left:_vleft, top:_vtop, width:width_box, height:height_box});
1470				this.addBoxClone(box_clone);
1471				
1472				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
1473				box_clone.animate({opacity:'show', left:0, top:0}, time_animate, easing, callback);
1474			}
1475		},
1476		
1477		animationParalell: function(options)
1478		{
1479			var self = this;
1480			
1481			this.settings.is_animating = true;
1482			var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default;
1483			var time_animate = 400 / this.settings.velocity;
1484			
1485			this.setActualLevel();
1486			
1487			var total 		= Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 16));
1488			var width_box 	= Math.ceil(this.settings.width_skitter / total);
1489			var height_box 	= this.settings.height_skitter;
1490			
1491			for (i = 0; i < total; i++) {
1492				
1493				var _bleft = (width_box * (i));
1494				var _btop = 0;
1495				
1496				var box_clone = this.getBoxClone();
1497				
1498				box_clone.css({left:_bleft, top:_btop - this.settings.height_skitter, width:width_box, height:height_box});
1499				box_clone.find('img').css({left:-(width_box * i), top:0});
1500				
1501				this.addBoxClone(box_clone);
1502				
1503				var delay_time;
1504				if (i <= ((total / 2) - 1)) {
1505					delay_time = 1400 - (i * 200);
1506				}
1507				else if (i > ((total / 2) - 1)) {
1508					delay_time = ((i - (total / 2)) * 200);
1509				}
1510				delay_time = delay_time / 2.5;
1511				
1512				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
1513				box_clone.delay(delay_time).animate({
1514					top:_btop+'px', left:_bleft+'px', opacity: 'show'
1515				}, time_animate, easing, callback);
1516			}
1517			
1518		},
1519		
1520		animationBlind: function(options)
1521		{
1522			var self = this;
1523			
1524			var options = $.extend({}, {height: false}, options || {});
1525			
1526			this.settings.is_animating = true;
1527			var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default;
1528			var time_animate = 400 / this.settings.velocity;
1529			
1530			this.setActualLevel();
1531			

1532			var total 		= Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 16));
1533			var width_box 	= Math.ceil(this.settings.width_skitter / total);
1534			var height_box 	= this.settings.height_skitter;
1535			
1536			for (i = 0; i < total; i++) {
1537				
1538				var _bleft = (width_box * (i));
1539				var _btop = 0;
1540				
1541				var box_clone = this.getBoxClone();
1542				
1543				box_clone.css({left:_bleft, top:_btop, width:width_box, height:height_box});
1544				box_clone.find('img').css({left:-(width_box * i), top:0});
1545				
1546				this.addBoxClone(box_clone);
1547				
1548				var delay_time;
1549				
1550				if (!options.height) {
1551					if (i <= ((total / 2) - 1)) {
1552						delay_time = 1400 - (i * 200);
1553					}
1554					else if (i > ((total / 2) - 1)) {
1555						delay_time = ((i - (total / 2)) * 200);
1556					}
1557					var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
1558				}
1559				else {
1560					if (i <= ((total / 2) - 1)) {
1561						delay_time = 200 + (i * 200);
1562					}
1563					else if (i > ((total / 2) - 1)) {
1564						delay_time = (((total / 2) - i) * 200) + (total * 100);
1565					}
1566					var callback = (i == (total / 2)) ? function() { self.finishAnimation(); } : '';
1567				}
1568				
1569				delay_time = delay_time / 2.5;
1570				
1571				if (!options.height) {
1572					box_clone.delay(delay_time).animate({
1573						opacity:'show',top:_btop+'px', left:_bleft+'px', width:'show'
1574					}, time_animate, easing, callback);
1575				}
1576				else {
1577					time_animate = time_animate + (i * 2);
1578					var easing = 'easeOutQuad';
1579					box_clone.delay(delay_time).animate({
1580						opacity:'show',top:_btop+'px', left:_bleft+'px', height:'show'
1581					}, time_animate, easing, callback);
1582				}
1583			}
1584			
1585		},
1586		
1587		animationBlindDimension: function(options)
1588		{
1589			var self = this;
1590			
1591			var options = $.extend({}, {height: true, time_animate: 500, delay: 100}, options || {});
1592			
1593			this.settings.is_animating = true;
1594			var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default;
1595			var time_animate = options.time_animate / this.settings.velocity;
1596			
1597			this.setActualLevel();
1598			
1599			var total 		= Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 16));
1600			var width_box 	= Math.ceil(this.settings.width_skitter / total);
1601			var height_box 	= this.settings.height_skitter;
1602			
1603			for (i = 0; i < total; i++) {
1604				
1605				var _bleft = (width_box * (i));
1606				var _btop = 0;
1607				
1608				var box_clone = this.getBoxClone();
1609				
1610				box_clone.css({left:_bleft, top:_btop, width:width_box, height:height_box});
1611				box_clone.find('img').css({left:-(width_box * i), top:0});
1612				
1613				this.addBoxClone(box_clone);
1614				
1615				var delay_time = options.delay * i;
1616				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
1617				
1618				if (!options.height) {
1619					box_clone.delay(delay_time).animate({
1620						opacity:'show',top:_btop+'px', left:_bleft+'px', width:'show'
1621					}, time_animate, easing, callback);
1622				}
1623				else {
1624					var easing = 'easeOutQuad';
1625					box_clone.delay(delay_time).animate({
1626						opacity:'show',top:_btop+'px', left:_bleft+'px', height:'show'
1627					}, time_animate, easing, callback);
1628				}
1629			}
1630			
1631		},
1632		
1633		animationDirection: function(options)
1634		{
1635			var self = this;
1636			
1637			var options = $.extend({}, {direction: 'top', delay_type: 'sequence', total: 7}, options || {});
1638			
1639			this.settings.is_animating = true;
1640			var easing = (this.settings.easing_default == '') ? 'easeInOutExpo' : this.settings.easing_default;
1641			var time_animate = 1200 / this.settings.velocity;
1642			
1643			var image_old = this.box_skitter.find('.image_main').attr('src');
1644			
1645			this.setActualLevel();
1646			
1647			this.setLinkAtual();
1648			this.box_skitter.find('.image_main').attr({'src':this.settings.image_atual});
1649			this.box_skitter.find('.image_main').hide();
1650			
1651			var total 		= options.total;
1652			
1653			for (i = 0; i < total; i++) {
1654				
1655				switch (options.direction)
1656				{
1657					default : case 'top' : 
1658						
1659						var width_box 		= Math.ceil(this.settings.width_skitter / total);
1660						var height_box 		= this.settings.height_skitter;
1661						
1662						var _itopc 			= 0;
1663						var _ileftc 		= (width_box * i);
1664						var _ftopc 			= -height_box;
1665						var _fleftc 		= _ileftc;
1666						
1667						var _itopn			= height_box;
1668						var _ileftn			= _ileftc;
1669						var _ftopn			= 0;
1670						var _fleftn			= _ileftc;
1671						
1672						var _vtop_image 	= 0;
1673						var _vleft_image 	= -_ileftc;
1674						
1675						break;
1676						
1677					case 'bottom' : 
1678					

1679						var width_box 		= Math.ceil(this.settings.width_skitter / total);
1680						var height_box 		= this.settings.height_skitter;
1681						
1682						var _itopc 			= 0;
1683						var _ileftc 		= (width_box * i);
1684						var _ftopc 			= height_box;
1685						var _fleftc 		= _ileftc;
1686						
1687						var _itopn			= -height_box;
1688						var _ileftn			= _ileftc;
1689						var _ftopn			= 0;
1690						var _fleftn			= _ileftc;
1691						
1692						var _vtop_image 	= 0;
1693						var _vleft_image 	= -_ileftc;
1694						
1695						break;
1696						
1697					case 'right' : 
1698					
1699						var width_box 		= this.settings.width_skitter;
1700						var height_box 		= Math.ceil(this.settings.height_skitter / total);
1701						
1702						var _itopc 			= (height_box * i);
1703						var _ileftc 		= 0;
1704						var _ftopc 			= _itopc;
1705						var _fleftc 		= width_box;
1706						
1707						var _itopn			= _itopc;
1708						var _ileftn			= -_fleftc;
1709						var _ftopn			= _itopc;
1710						var _fleftn			= 0;
1711						
1712						var _vtop_image 	= -_itopc;
1713						var _vleft_image 	= 0;
1714						
1715						break;
1716						
1717					case 'left' : 
1718					
1719						var width_box 		= this.settings.width_skitter;
1720						var height_box 		= Math.ceil(this.settings.height_skitter / total);
1721						
1722						var _itopc 			= (height_box * i);
1723						var _ileftc 		= 0;
1724						var _ftopc 			= _itopc;
1725						var _fleftc 		= -width_box;
1726						
1727						var _itopn			= _itopc;
1728						var _ileftn			= -_fleftc;
1729						var _ftopn			= _itopc;
1730						var _fleftn			= 0;
1731						
1732						var _vtop_image 	= -_itopc;
1733						var _vleft_image 	= 0;
1734						
1735						break;
1736						
1737				}
1738				
1739				switch (options.delay_type) 
1740				{
1741					case 'zebra' : default : var delay_time = (i % 2 == 0) ? 0 : 150; break;
1742					case 'random' : var delay_time = 30 * (Math.random() * 30); break;
1743					case 'sequence' : var delay_time = i * 100; break;
1744				}
1745				
1746				var box_clone = this.getBoxCloneImgOld(image_old);
1747				box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
1748				
1749				box_clone.css({top:_itopc, left:_ileftc, width:width_box, height:height_box});
1750				
1751				this.addBoxClone(box_clone);
1752				box_clone.show();
1753				box_clone.delay(delay_time).animate({ top:_ftopc, left:_fleftc }, time_animate, easing);
1754				
1755				// Next image
1756				var box_clone_next = this.getBoxClone();
1757				box_clone_next.find('img').css({left:_vleft_image, top:_vtop_image});
1758				
1759				box_clone_next.css({top:_itopn, left:_ileftn, width:width_box, height:height_box});
1760				
1761				this.addBoxClone(box_clone_next);
1762				box_clone_next.show();
1763				
1764				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';

1765				box_clone_next.delay(delay_time).animate({ top:_ftopn, left:_fleftn }, time_animate, easing, callback);
1766				
1767			}
1768		},
1769		
1770		animationCubeSpread: function(options)
1771		{
1772			var self = this;
1773			
1774			this.settings.is_animating = true;
1775			var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default;
1776			var time_animate = 700 / this.settings.velocity;
1777			
1778			this.setActualLevel();
1779			
1780			var division_w 	= Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 8));
1781			var division_h 	= Math.ceil(this.settings.height_skitter / (this.settings.width_skitter / 8));
1782			var total		= division_w * division_h;
1783			
1784			var width_box 	= Math.ceil(this.settings.width_skitter / division_w);
1785			var height_box 	= Math.ceil(this.settings.height_skitter / division_h);
1786			
1787			var init_top 	= 0;
1788			var init_left 	= 0;
1789			
1790			var col_t 		= 0;
1791			var col 		= 0;
1792			var order 		= new Array;
1793			var spread 		= new Array;
1794			
1795			// Make order
1796			for (i = 0; i < total; i++) {
1797				init_top 			= (i % 2 == 0) ? init_top : -init_top;
1798				init_left 			= (i % 2 == 0) ? init_left : -init_left;
1799
1800				var _vtop 			= init_top + (height_box * col_t);
1801				var _vleft 			= (init_left + (width_box * col));
1802				
1803				order[i] = [_vtop, _vleft];
1804				
1805				col_t++;
1806				if (col_t == division_h) {
1807					col_t = 0;
1808					col++;
1809				}
1810			}
1811			
1812			// Reset col and col_t
1813			col_t = 0;
1814			col = 0;
1815			
1816			// Make array for spread
1817			for (i = 0; i < total; i++) {
1818				spread[i] = i;
1819			};
1820			
1821			// Shuffle array
1822			var spread = self.shuffleArray(spread);
1823			
1824			for (i = 0; i < total; i++) {
1825				init_top 			= (i % 2 == 0) ? init_top : -init_top;
1826				init_left 			= (i % 2 == 0) ? init_left : -init_left;
1827
1828				var _vtop 			= init_top + (height_box * col_t);
1829				var _vleft 			= (init_left + (width_box * col));
1830				var _vtop_image 	= -(height_box * col_t);
1831				
1832				var _vleft_image 	= -(width_box * col);
1833				var _btop 			= _vtop;
1834				var _bleft 			= _vleft;
1835				
1836				_vtop 				= order[spread[i]][0];
1837				_vleft 				= order[spread[i]][1];
1838				
1839				var box_clone 		= this.getBoxClone();
1840				
1841				box_clone.css({left:_vleft+'px', top:_vtop+'px', width:width_box, height:height_box});
1842				box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
1843				
1844				this.addBoxClone(box_clone);
1845				
1846				var delay_time = 30 * (Math.random() * 30);
1847				if (i == (total-1)) delay_time = 30 * 30;
1848				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
1849				box_clone.delay(delay_time).animate({opacity:'show',top:_btop+'px', left:_bleft+'px'}, time_animate, easing, callback);
1850				
1851				col_t++;
1852				if (col_t == division_h) {
1853					col_t = 0;
1854					col++;
1855				}
1856			}
1857		}, 
1858		
1859		animationGlassCube: function(options)
1860		{
1861			var self = this;
1862			
1863			this.settings.is_animating = true;
1864			var easing = (this.settings.easing_default == '') ? 'easeOutExpo' : this.settings.easing_default;
1865			var time_animate = 500 / this.settings.velocity;
1866			
1867			this.setActualLevel();
1868			
1869			var total 		= Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 10)) * 2;
1870			var width_box 	= Math.ceil(this.settings.width_skitter / total) * 2;
1871			var height_box 	= (this.settings.height_skitter) / 2;
1872			var col			= 0;
1873			
1874			for (i = 0; i < total; i++) {
1875				mod = (i % 2) == 0 ? true : false;
1876				
1877				var _ileft = (width_box * (col));
1878				var _itop = (mod) ? -self.settings.height_skitter : self.settings.height_skitter;
1879				
1880				var _fleft = (width_box * (col));
1881				var _ftop = (mod) ? 0 : (height_box);
1882				
1883				var _bleft = -(width_box * col);
1884				var _btop = (mod) ? 0 : -(height_box);
1885				
1886				var delay_time = 120 * col;
1887				
1888				var box_clone = this.getBoxClone();
1889				box_clone.css({left: _ileft, top:_itop, width:width_box, height:height_box});
1890				
1891				box_clone
1892					.find('img')
1893					.css({left: _bleft + (width_box / 1.5), top: _btop})
1894					.delay(delay_time)
1895					.animate({left: _bleft, top: _btop}, (time_animate * 1.9), 'easeOutQuad');
1896				
1897				this.addBoxClone(box_clone);
1898				
1899				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
1900				box_clone.show().delay(delay_time).animate({top:_ftop, left:_fleft}, time_animate, easing, callback);
1901				
1902				if ((i % 2) != 0) col++;
1903			}
1904		},
1905		
1906		animationGlassBlock: function(options)
1907		{
1908			var self = this;
1909			
1910			this.settings.is_animating = true;
1911			var easing = (this.settings.easing_default == '') ? 'easeOutExpo' : this.settings.easing_default;
1912			var time_animate = 700 / this.settings.velocity;
1913			
1914			this.setActualLevel();
1915			

1916			var total 		= Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 10));
1917			var width_box 	= Math.ceil(this.settings.width_skitter / total);
1918			var height_box 	= (this.settings.height_skitter);
1919			
1920			for (i = 0; i < total; i++) {
1921				var _ileft = (width_box * (i));
1922				var _itop = 0;
1923				
1924				var _fleft = (width_box * (i));
1925				var _ftop = 0;
1926				
1927				var _bleft = -(width_box * (i));
1928				var _btop = 0;
1929				
1930				var delay_time = 100 * i;
1931				
1932				var box_clone = this.getBoxClone();
1933				box_clone.css({left: _ileft, top:_itop, width:width_box, height:height_box});
1934				
1935				box_clone
1936					.find('img')
1937					.css({left: _bleft + (width_box / 1.5), top: _btop})
1938					.delay(delay_time)
1939					.animate({left: _bleft, top: _btop}, (time_animate * 1.1), 'easeInOutQuad');
1940				
1941				this.addBoxClone(box_clone);
1942				
1943				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
1944				box_clone.delay(delay_time).animate({top:_ftop, left:_fleft, opacity: 'show'}, time_animate, easing, callback);
1945				
1946			}
1947		},
1948		
1949		animationCircles: function(options)
1950		{
1951			var self = this;
1952			
1953			this.settings.is_animating = true;
1954			var easing = (this.settings.easing_default == '') ? 'easeInQuad' : this.settings.easing_default;
1955			var time_animate = 500 / this.settings.velocity;
1956			
1957			this.setActualLevel();
1958			
1959			var total 		= Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 10));
1960			var size_box	= 100;
1961			
1962			var radius		= Math.sqrt(Math.pow((this.settings.width_skitter), 2) + Math.pow((this.settings.height_skitter), 2));
1963			var radius		= Math.ceil(radius);
1964			
1965			for (i = 0; i < total; i++) {
1966				var _ileft = (self.settings.width_skitter / 2) - (size_box / 2);
1967				var _itop = (self.settings.height_skitter / 2) - (size_box / 2);
1968				
1969				var _fleft = _ileft; 
1970				var _ftop = _itop; 
1971				var box_clone = null;
1972
1973				box_clone = this.getBoxCloneBackground({
1974					image: 		self.settings.image_atual,
1975					left: 		_ileft, 
1976					top: 		_itop, 
1977					width: 		size_box, 
1978					height: 	size_box,
1979					position: {
1980						top:  	-_itop, 
1981						left:  	-_ileft
1982					}
1983				}).css3({
1984					'border-radius': radius+'px'
1985				});
1986				
1987				size_box += 100;
1988				
1989				this.addBoxClone(box_clone);
1990				
1991				var delay_time = 70 * i;
1992				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
1993				box_clone.delay(delay_time).animate({top: _ftop, left: _fleft, opacity: 'show'}, time_animate, easing, callback);
1994				
1995			}
1996		},
1997		
1998		animationCirclesInside: function(options)
1999		{
2000			var self = this;
2001			
2002			this.settings.is_animating = true;
2003			var easing = (this.settings.easing_default == '') ? 'easeInQuad' : this.settings.easing_default;
2004			var time_animate = 500 / this.settings.velocity;
2005			
2006			var image_old = this.box_skitter.find('.image_main').attr('src');
2007			
2008			this.setActualLevel();
2009			
2010			this.setLinkAtual();
2011			this.box_skitter.find('.image_main').attr({'src':this.settings.image_atual});
2012			
2013			var total 		= Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 10));
2014			
2015			var radius		= Math.sqrt(Math.pow((this.settings.width_skitter), 2) + Math.pow((this.settings.height_skitter), 2));
2016			var radius		= Math.ceil(radius);
2017			var size_box	= radius;
2018			
2019			for (i = 0; i < total; i++) {
2020				var _ileft = (self.settings.width_skitter / 2) - (size_box / 2);
2021				var _itop = (self.settings.height_skitter / 2) - (size_box / 2);
2022				
2023				var _fleft = _ileft; 
2024				var _ftop = _itop; 
2025				var box_clone = null;
2026
2027				box_clone = this.getBoxCloneBackground({
2028					image: 		image_old,
2029					left: 		_ileft, 
2030					top: 		_itop, 
2031					width: 		size_box, 
2032					height: 	size_box,
2033					position: {
2034						top:  	-_itop, 
2035						left:  	-_ileft
2036					}
2037				}).css3({
2038					'border-radius': radius+'px'
2039				});
2040				
2041				size_box -= 100;
2042				
2043				this.addBoxClone(box_clone);
2044				box_clone.show();
2045				
2046				var delay_time = 70 * i;
2047				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
2048				box_clone.delay(delay_time).animate({top: _ftop, left: _fleft, opacity: 'hide'}, time_animate, easing, callback);
2049				
2050			}
2051		},
2052
2053		animationCirclesRotate: function(options)
2054		{
2055			var self = this;
2056			
2057			this.settings.is_animating = true;
2058			var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default;
2059			var time_animate = 500 / this.settings.velocity;
2060			
2061			var image_old = this.box_skitter.find('.image_main').attr('src');
2062			
2063			this.setActualLevel();
2064			
2065			this.setLinkAtual();
2066			this.box_skitter.find('.image_main').attr({'src':this.settings.image_atual});
2067			

2068			var total 		= Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 10));
2069			
2070			var radius		= Math.sqrt(Math.pow((this.settings.width_skitter), 2) + Math.pow((this.settings.height_skitter), 2));
2071			var radius		= Math.ceil(radius);
2072			var size_box	= radius;
2073			
2074			for (i = 0; i < total; i++) {
2075				var _ileft = (self.settings.width_skitter / 2) - (size_box / 2);
2076				var _itop = (self.settings.height_skitter / 2) - (size_box / 2);
2077				
2078				var _fleft = _ileft; 
2079				var _ftop = _itop; 
2080				var box_clone = null;
2081
2082				box_clone = this.getBoxCloneBackground({
2083					image: 		image_old,
2084					left: 		_ileft, 
2085					top: 		_itop, 
2086					width: 		size_box, 
2087					height: 	size_box,
2088					position: {
2089						top:  	-_itop, 
2090						left:  	-_ileft
2091					}
2092				}).css3({
2093					'border-radius': radius+'px'
2094				});
2095				
2096				size_box -= 200;
2097				
2098				this.addBoxClone(box_clone);
2099				box_clone.show();
2100				
2101				var delay_time = 100 * i;
2102				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
2103				var _rotate = (i % 2 == 0) ? 45 : -45;
2104				// box_clone.delay(delay_time).animate({top: _ftop, left: _fleft, opacity: 'hide', rotate: _rotate}, time_animate, easing, callback);
2105
2106				box_clone
2107					.delay(delay_time)
2108					.animate({
2109						top: _ftop, 
2110						left: _fleft,
2111						opacity: 'hide'
2112					}, time_animate, easing, callback);
2113
2114				box_clone.delay(delay_time).animateRotate(_rotate, time_animate + 600, 'easeInQuad');
2115			}
2116		},
2117		
2118		animationCubeShow: function(options)
2119		{
2120			var self = this;
2121			
2122			this.settings.is_animating = true;
2123			var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default;
2124			var time_animate = 400 / this.settings.velocity;
2125			
2126			this.setActualLevel();
2127			
2128			var division_w 		= Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 8));
2129			var division_h 		= Math.ceil(this.settings.height_skitter / (this.settings.height_skitter / 4));
2130			var total			= division_w * division_h;
2131			
2132			var width_box 		= Math.ceil(this.settings.width_skitter / division_w);
2133			var height_box 		= Math.ceil(this.settings.height_skitter / division_h);
2134			
2135			var last 			= false;
2136			
2137			var _btop 			= 0;
2138			var _bleft 			= 0;
2139			var line			= 0;
2140			var col				= 0;
2141			
2142			for (i = 0; i < total; i++) {
2143				
2144				_btop = height_box * line;
2145				_bleft = width_box * col;
2146				
2147				var delay_time = 30 * (i);
2148				
2149				var box_clone 		= this.getBoxClone();
2150				box_clone.css({left:_bleft, top:_btop, width:width_box, height:height_box}).hide();
2151				box_clone.find('img').css({left:-_bleft, top:-_btop});
2152				this.addBoxClone(box_clone);
2153				
2154				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
2155				box_clone.delay(delay_time).animate({width:'show', height:'show'}, time_animate, easing, callback);
2156				
2157				line++;
2158				if (line == division_h) {
2159					line = 0;
2160					col++;
2161				}
2162			}
2163		},
2164		
2165		animationDirectionBars: function(options)
2166		{
2167			var self = this;
2168			
2169			var options = $.extend({}, {direction: 'top'}, options || {});
2170			
2171			this.settings.is_animating = true;
2172			var easing = (this.settings.easing_default == '') ? 'easeInOutQuad' : this.settings.easing_default;
2173			var time_animate = 400 / this.settings.velocity;
2174			
2175			var image_old = this.box_skitter.find('.image_main').attr('src');
2176			
2177			this.setActualLevel();
2178			
2179			this.setLinkAtual();
2180			this.box_skitter.find('.image_main').attr({'src':this.settings.image_atual});
2181			
2182			var total		= 12;
2183			var width_box 	= Math.ceil(this.settings.width_skitter / total);
2184			var height_box 	= this.settings.height_skitter;
2185			var _ftop		= (options.direction == 'top') ? -height_box : height_box;
2186			
2187			for (i = 0; i < total; i++) {
2188				var _vtop 			= 0;
2189				var _vleft 			= (width_box * i);
2190				var _vtop_image 	= 0;
2191				var _vleft_image 	= -(width_box * i);
2192
2193				var box_clone = this.getBoxCloneImgOld(image_old);
2194				box_clone.css({left:_vleft+'px', top:_vtop+'px', width:width_box, height:height_box});
2195				box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
2196				
2197				this.addBoxClone(box_clone);
2198				box_clone.show();
2199				
2200				var delay_time = 70 * i;
2201				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
2202				
2203				box_clone.delay(delay_time).animate({top:_ftop}, time_animate, easing, callback);
2204			}
2205			
2206		},
2207
2208		animationHideBars: function(options)
2209		{
2210			var self = this;
2211
2212			var options = $.extend({}, {random: false}, options || {});
2213
2214			this.settings.is_animating = true;
2215			var easing = (this.settings.easing_default == '') ? 'easeOutCirc' : this.settings.easing_default;
2216			var time_animate = 700 / this.settings.velocity;
2217
2218			var image_old = this.box_skitter.find('.image_main').attr('src');
2219
2220			this.setActualLevel();
2221
2222			this.setLinkAtual();
2223			this.box_skitter.find('.image_main').attr({'src':this.settings.image_atual});
2224
2225			var division_w = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 10));
2226			var total = division_w;
2227
2228			var width_box = Math.ceil(this.settings.width_skitter / division_w);
2229			var height_box = this.settings.height_skitter;
2230
2231			for (i = 0; i < total; i++) {
2232				var _vtop = 0;
2233				var _vleft = width_box * i;
2234
2235				var _vtop_image = 0;
2236				var _vleft_image = -(width_box * i);
2237
2238				var _fleft = '+='+width_box;
2239
2240				var box_clone = this.getBoxCloneImgOld(image_old);
2241				box_clone.css({left:0, top:0, width:width_box, height:height_box});
2242				box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
2243
2244				var box_clone_main = this.getBoxCloneImgOld(image_old);
2245				box_clone_main.css({left:_vleft+'px', top:_vtop+'px', width:width_box, height:height_box});
2246				box_clone_main.html(box_clone);
2247
2248				this.addBoxClone(box_clone_main);
2249				box_clone.show();
2250				box_clone_main.show();
2251
2252				var delay_time = 50 * i;
2253				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
2254				
2255				box_clone.delay(delay_time).animate({left:_fleft}, time_animate, easing, callback);
2256			}
2257		},
2258
2259		animationSwapBars: function(options)
2260		{
2261			var self = this;
2262			
2263			var options = $.extend({}

2263, {direction: 'top', delay_type: 'sequence', total: 7, easing: 'easeOutCirc'}, options || {});
2264			
2265			this.settings.is_animating = true;
2266			var easing = (this.settings.easing_default == '') ? options.easing : this.settings.easing_default;
2267			var time_animate = 500 / this.settings.velocity;
2268			
2269			var image_old = this.box_skitter.find('.image_main').attr('src');
2270			
2271			this.setActualLevel();
2272			
2273			this.setLinkAtual();
2274			this.box_skitter.find('.image_main').attr({'src':this.settings.image_atual});
2275			this.box_skitter.find('.image_main').hide();
2276			
2277			var total 		= options.total;
2278			
2279			for (i = 0; i < total; i++) {
2280
2281				var width_box 		= Math.ceil(this.settings.width_skitter / total);
2282				var height_box 		= this.settings.height_skitter;
2283				
2284				var _itopc 			= 0;
2285				var _ileftc 		= (width_box * i);
2286				var _ftopc 			= -height_box;
2287				var _fleftc 		= _ileftc + width_box ;
2288				
2289				var _itopn			= height_box;
2290				var _ileftn			= _ileftc;
2291				var _ftopn			= 0;
2292				var _fleftn			= _ileftc;
2293				
2294				var _vtop_image 	= 0;
2295				var _vleft_image 	= -_ileftc;
2296				
2297				switch (options.delay_type) 
2298				{
2299					case 'zebra' : default : var delay_time = (i % 2 == 0) ? 0 : 150; break;
2300					case 'random' : var delay_time = 30 * (Math.random() * 30); break;
2301					case 'sequence' : var delay_time = i * 100; break;
2302				}
2303
2304				// Old image
2305				var box_clone = this.getBoxCloneImgOld(image_old);
2306				box_clone.find('img').css({left:_vleft_image, top:0});
2307				box_clone.css({top:0, left:0, width:width_box, height:height_box});
2308
2309				// Next image
2310				var box_clone_next = this.getBoxClone();
2311				box_clone_next.find('img').css({left:_vleft_image, top:0});
2312				box_clone_next.css({top:0, left:-width_box, width:width_box, height:height_box});
2313				
2314				// Container box images
2315				var box_clone_container = this.getBoxClone();
2316				box_clone_container.html('').append(box_clone).append(box_clone_next);
2317				box_clone_container.css({top:0, left:_ileftc, width:width_box, height:height_box});
2318				
2319				// Add containuer
2320				this.addBoxClone(box_clone_container);
2321
2322				// Show boxes
2323				box_clone_container.show();
2324				box_clone.show();
2325				box_clone_next.show();
2326				
2327				// Callback
2328				var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : '';
2329
2330				// Animations
2331				box_clone.delay(delay_time).animate({ left: width_box }, time_animate, easing);
2332				box_clone_next.delay(delay_time).animate({ left:0 }, time_animate, easing, callback);
2333			}
2334		},
2335
2336		animationSwapBlocks: function(options)
2337		{
2338			var self = this;
2339			
2340			var options = $.extend({}, {easing_old: 'easeInOutQuad', easing_new: 'easeOutQuad'}, options || {});
2341			
2342			this.settings.is_animating = true;
2343			var easing_old = (this.settings.easing_default == '') ? options.easing_old : this.settings.easing_default;
2344			var easing_new = (this.settings.easing_default == '') ? options.easing_new : this.settings.easing_default;
2345			var time_animate = 800 / this.settings.velocity;
2346			
2347			var image_old = this.box_skitter.find('.image_main').attr('src');
2348			
2349			this.setActualLevel();
2350			
2351			this.setLinkAtual();
2352			this.box_skitter.find('.image_main').attr({'src':this.settings.image_atual});
2353			this.box_skitter.find('.image_main').hide();
2354			
2355			var total 			= 2;
2356			var width_box 		= this.settings.width_skitter;
2357			var height_box 		= Math.ceil(this.settings.height_skitter / total);
2358
2359			// Old image
2360			var box_clone1 = this.getBoxCloneImgOld(image_old), box_clone2 = this.getBoxCloneImgOld(image_old);
2361			box_clone1.find('img').css({left:0, top:0});
2362			box_clone1.css({top:0, left:0, width:width_box, height:height_box});
2363
2364			box_clone2.find('img').css({left:0, top:-height_box});
2365			box_clone2.css({top:height_box, left:0, width:width_box, height:height_box});
2366
2367			// Next image
2368			var box_clone_next1 = this.getBoxClone(), box_clone_next2 = this.getBoxClone();
2369			box_clone_next1.find('img').css({left:0, top:height_box});
2370			box_clone_next1.css({top:0, left:0, width:width_box, height:height_box});
2371
2372			box_clone_next2.find('img').css({left:0, top: -(height_box * total) });
2373			box_clone_next2.css({top:height_box, left:0, width:width_box, height:height_box});
2374
2375			// Add boxes
2376			this.addBoxClone(box_clone_next1);
2377			this.addBoxClone(box_clone_next2);
2378			this.addBoxClone(box_clone1);
2379			this.addBoxClone(box_clone2);
2380
2381			// Show boxes
2382			box_clone1.show();
2383			box_clone2.show();
2384			box_clone_next1.show();
2385			box_clone_next2.show();
2386
2387			// Callback
2388			var callback = function() { self.finishAnimation(); };
2389
2390			// Animations
2391			box_clone1.find('img').animate({ top: height_box }, time_animate, easing_old, function() {
2392				box_clone1.remove();
2393			});
2394			box_clone2.find('img').animate({ top: -(height_box * total) }, time_animate, easing_old, function() {
2395				box_clone2.remove();
2396			});
2397			box_clone_next1.find('img').animate({ top: 0 }, time_animate, easing_new);
2398			box_clone_next2.find('img').animate({ top: -height_box }, time_animate, easing_new, callback);
2399		},
2400
2401		animationCut: function(options)
2402		{
2403			var self = this;
2404			
2405			var options = $.extend({}, {easing_old: 'easeInOutExpo', easing_new: 'easeInOutExpo'}, options || {});
2406			
2407			this.settings.is_animating = true;
2408			var easing_old = (this.settings.easing_default == '') ? options.easing_old 

2408: this.settings.easing_default;
2409			var easing_new = (this.settings.easing_default == '') ? options.easing_new : this.settings.easing_default;
2410			var time_animate = 900 / this.settings.velocity;
2411			
2412			var image_old = this.box_skitter.find('.image_main').attr('src');
2413			
2414			this.setActualLevel();
2415			
2416			this.setLinkAtual();
2417			this.box_skitter.find('.image_main').attr({'src':this.settings.image_atual});
2418			this.box_skitter.find('.image_main').hide();
2419			
2420			var total 			= 2;
2421			var width_box 		= this.settings.width_skitter;
2422			var height_box 		= Math.ceil(this.settings.height_skitter / total);
2423
2424			// Old image
2425			var box_clone1 = this.getBoxCloneImgOld(image_old), box_clone2 = this.getBoxCloneImgOld(image_old);
2426			box_clone1.find('img').css({left:0, top:0});
2427			box_clone1.css({top:0, left:0, width:width_box, height:height_box});
2428
2429			box_clone2.find('img').css({left:0, top:-height_box});
2430			box_clone2.css({top:height_box, left:0, width:width_box, height:height_box});
2431
2432			// Next image
2433			var box_clone_next1 = this.getBoxClone(), box_clone_next2 = this.getBoxClone();
2434			//box_clone_next1.find('img').css({left:0, top:height_box});
2435			box_clone_next1.find('img').css({left:0, top:0});
2436			box_clone_next1.css({top:0, left:width_box, width:width_box, height:height_box});
2437
2438			//box_clone_next2.find('img').css({left:0, top: -(height_box * total) });
2439			box_clone_next2.find('img').css({left:0, top: -height_box });
2440			box_clone_next2.css({top:height_box, left:-width_box, width:width_box, height:height_box});
2441
2442			// Add boxes
2443			this.addBoxClone(box_clone_next1);
2444			this.addBoxClone(box_clone_next2);
2445			this.addBoxClone(box_clone1);
2446			this.addBoxClone(box_clone2);
2447
2448			// Show boxes
2449			box_clone1.show();
2450			box_clone2.show();
2451			box_clone_next1.show();
2452			box_clone_next2.show();
2453
2454			// Callback
2455			var callback = function() { self.finishAnimation(); };
2456
2457			// Animations
2458			box_clone1.animate({ left: -width_box }, time_animate, easing_old, function() {
2459				box_clone1.remove();
2460			});
2461			box_clone2.animate({ left: width_box }, time_animate, easing_old, function() {
2462				box_clone2.remove();
2463			});
2464			box_clone_next1.animate({ left: 0 }, time_animate, easing_new);
2465			box_clone_next2.animate({ left: 0 }, time_animate, easing_new, callback);
2466		},
2467		
2468		// End animations ----------------------
2469		
2470		// Finish animation
2471		finishAnimation: function (options) 
2472		{
2473			var self = this;
2474			this.box_skitter.find('.image_main').show();
2475			this.showBoxText();
2476			this.settings.is_animating = false;
2477			this.box_skitter.find('.image_main').attr({'src': this.settings.image_atual});
2478			this.box_skitter.find('.image a').attr({'href': this.settings.link_atual});
2479			
2480			if (!this.settings.is_hover_box_skitter && !this.settings.is_paused && !this.settings.is_blur) {
2481				this.timer = setTimeout(function() { self.completeMove(); }, this.settings.interval);
2482			}
2483			
2484			self.startTime();
2485		},
2486
2487		// Complete move
2488		completeMove: function () 
2489		{
2490			this.clearTimer(true);
2491			this.box_skitter.find('.box_clone').remove();
2492			if (!this.settings.is_paused && !this.settings.is_blur) this.nextImage();
2493		},
2494
2495		// Actual config for animation
2496		setActualLevel: function() {
2497			if ($.isFunction(this.settings.imageSwitched)) this.settings.imageSwitched(this.settings.image_i, this);
2498			this.setImageLink();
2499			this.addClassNumber();
2500			this.hideBoxText();
2501			this.increasingImage();
2502		},
2503
2504		// Set image and link
2505		setImageLink: function()
2506		{
2507			var name_image = this.settings.images_links[this.settings.image_i][0];
2508			var link_image = this.settings.images_links[this.settings.image_i][1];
2509			var label_image = this.settings.images_links[this.settings.image_i][3];
2510			var target_link = this.settings.images_links[this.settings.image_i][4];
2511			
2512			this.settings.image_atual = name_image;
2513			this.settings.link_atual = link_image;
2514			this.settings.label_atual = label_image;
2515			this.settings.target_atual = target_link;
2516		},
2517
2518		// Add class for number
2519		addClassNumber: function () 
2520		{
2521			var self = this;
2522			// this.box_skitter.find('.image_number_select').animate(self.settings.animateNumberOut, 500).removeClass('image_number_select');
2523			// $('#image_n_'+(this.settings.image_i+1)+'_'+self.number_skitter).animate(self.settings.animateNumberActive, 700).addClass('image_number_select');
2524			this.box_skitter.find('.image_number_select').removeClass('image_number_select');
2525			$('#image_n_'+(this.settings.image_i+1)+'_'+self.number_skitter).addClass('image_number_select');
2526		},
2527
2528		// Increment image_i
2529		increasingImage: function()
2530		{
2531			this.settings.image_i++;
2532			if (this.settings.image_i == this.settings.images_links.length) {
2533				this.settings.image_i = 0;
2534			}
2535		},
2536		
2537		// Get box clone
2538		getBoxClone: function()
2539		{
2540			if (this.settings.link_atual != '#') {
2541				var img_clone = $('<a href="'+this.settings.link_atual+'"><img src="'+this.settings.image_atual+'" /></a>');
2542				img_clone.attr({ 'target': this.settings.target_atual });
2543			} 
2544			else {
2545				var img_clone = $('<img src="'+this.settings.image_atual+'" />');
2546			}
2547			
2548			img_clone = this.resizeImage(img_clone);

2549			var box_clone = $('<div class="box_clone"></div>');
2550			box_clone.append(img_clone);
2551			return box_clone;
2552		},
2553		
2554		// Get box clone
2555		getBoxCloneImgOld: function(image_old)
2556		{
2557			if (this.settings.link_atual != '#') {
2558				var img_clone = $('<a href="'+this.settings.link_atual+'"><img src="'+image_old+'" /></a>');
2559				img_clone.attr({ 'target': this.settings.target_atual });
2560			} 
2561			else {
2562				var img_clone = $('<img src="'+image_old+'" />');
2563			}
2564			
2565			img_clone = this.resizeImage(img_clone);
2566			var box_clone = $('<div class="box_clone"></div>');
2567			box_clone.append(img_clone);
2568			return box_clone;
2569		},
2570		
2571		// Redimensiona imagem
2572		resizeImage: function(img_clone) 
2573		{
2574			if (this.settings.fullscreen) {
2575				img_clone.find('img').height(this.settings.height_skitter);
2576			}
2577			return img_clone;
2578		}, 
2579
2580		// Add box clone in box_skitter
2581		addBoxClone: function(box_clone)
2582		{
2583			this.box_skitter.find('.container_skitter').append(box_clone);
2584		},
2585		
2586		// Get accepts easing 
2587		getEasing: function(easing)
2588		{
2589			var easing_accepts = [
2590				'easeInQuad', 		'easeOutQuad', 		'easeInOutQuad', 
2591				'easeInCubic', 		'easeOutCubic', 	'easeInOutCubic', 
2592				'easeInQuart', 		'easeOutQuart', 	'easeInOutQuart', 
2593				'easeInQuint', 		'easeOutQuint', 	'easeInOutQuint', 
2594				'easeInSine', 		'easeOutSine', 		'easeInOutSine', 
2595				'easeInExpo',		'easeOutExpo', 		'easeInOutExpo', 
2596				'easeInCirc', 		'easeOutCirc', 		'easeInOutCirc', 
2597				'easeInElastic', 	'easeOutElastic', 	'easeInOutElastic', 
2598				'easeInBack', 		'easeOutBack', 		'easeInOutBack', 
2599				'easeInBounce', 	'easeOutBounce', 	'easeInOutBounce', 
2600			];
2601			
2602			if (jQuery.inArray(easing, easing_accepts) > 0) {
2603				return easing;
2604			}
2605			else {
2606				return '';
2607			}
2608		},
2609		
2610		// Get random number
2611		getRandom: function (i) 
2612		{
2613			return Math.floor(Math.random() * i);
2614		},
2615
2616		// Set value for text
2617		setValueBoxText: function () 
2618		{
2619			this.box_skitter.find('.label_skitter').html(this.settings.label_atual);
2620		},
2621		
2622		// Show box text
2623		showBoxText: function () 
2624		{
2625			var self = this;
2626
2627			if ( this.settings.label_atual != undefined && this.settings.label_atual != '' && self.settings.label ) {
2628
2629				switch ( self.settings.labelAnimation ) {
2630
2631					case 'slideUp' : default : 
2632						self.box_skitter.find('.label_skitter').slideDown(400);
2633						break;
2634
2635					case 'left' : case 'right' : 
2636						self.box_skitter.find('.label_skitter').animate({ left: 0 }, 400, 'easeInOutQuad');
2637						break;
2638
2639					case 'fixed' : 
2640						// null
2641						break;
2642				}
2643			}
2644		},
2645		
2646		// Hide box text
2647		hideBoxText: function () 
2648		{
2649			var self = this;
2650
2651			switch ( self.settings.labelAnimation ) {
2652
2653				case 'slideUp' : default : 
2654					this.box_skitter.find('.label_skitter').slideUp(200, function() {
2655						self.setValueBoxText();
2656					});
2657					break;
2658
2659				case 'left' : case 'right' : 
2660					var _left = ( self.settings.labelAnimation == 'left' ) ? -(self.box_skitter.find('.label_skitter').width()) : (self.box_skitter.find('.label_skitter').width());
2661					self.box_skitter.find('.label_skitter').animate({ left: _left }, 400, 'easeInOutQuad', function() {
2662						self.setValueBoxText();
2663					});
2664					break;
2665
2666				case 'fixed' : 
2667					self.setValueBoxText();
2668					break;
2669			}
2670		},
2671		
2672		// Stop time to get over box_skitter
2673		stopOnMouseOver: function () 
2674		{
2675			var self = this;
2676
2677			if ( self.settings.stop_over ) 
2678			{
2679				self.box_skitter.hover(function() {
2680					
2681					if (self.settings.stop_over) self.settings.is_hover_box_skitter = true;
2682					
2683					if (!self.settings.is_paused_time) {
2684						self.pauseTime();
2685					}
2686					
2687					self.setHideTools('hover');
2688					self.clearTimer(true);
2689					
2690				}, function() {
2691					if (self.settings.stop_over) self.settings.is_hover_box_skitter = false;
2692					
2693					if (self.settings.elapsedTime == 0 && !self.settings.is_animating && !self.settings.is_paused) {
2694						self.startTime();
2695					}
2696					else if (!self.settings.is_paused) {
2697						self.resumeTime();
2698					}
2699					
2700					self.setHideTools('out');
2701					self.clearTimer(true);
2702					
2703					if (!self.settings.is_animating && self.settings.images_links.length > 1) {
2704						self.timer = setTimeout(function() { self.completeMove(); }, self.settings.interval - self.settings.elapsedTime);
2705						self.box_skitter.find('.image_main').attr({'src': self.settings.image_atual});
2706						self.box_skitter.find('.image a').attr({'href': self.settings.link_atual});
2707					}
2708				});
2709			}
2710			else
2711			{