/**
* jquery skitter slideshow
* @name jquery.skitter.js
* @description slideshow
* @author thiago silva ferreira - http://thiagosf.net
* @version 5.1.8
* @created august 04, 2010
* @updated apr 6, 2020
* @copyright (c) 2010 thiago silva ferreira - http://thiagosf.net
* @license dual licensed under the mit or gpl version 2 licenses
* @example http://thiagosf.net/projects/jquery/skitter/
*/
;(function (factory) {
if (typeof define === "function" && define.amd) {
define(['jquery'], function ($) {
return factory($);
});
} else if (typeof module === "object" && typeof module.exports === "object") {
exports = factory(require('jquery'));
} else {
factory(jquery);
}
})(function($) {
var number_skitter = 0;
var skitters = [];
$.fn.skitter = function(options) {
if (typeof options == 'string') {
var current_skitter = skitters[$(this).data('skitter_number')];
return current_skitter[arguments[0]].call(current_skitter, arguments[1]);
} else {
return this.each(function() {
if ( $(this).data('skitter_number') == undefined ) {
$(this).data('skitter_number', number_skitter);
skitters.push(new $sk(this, options, number_skitter));
++number_skitter;
}
});
}
};
var defaults = {
// animation velocity
velocity: 1,
// interval between transitions
interval: 2500,
// default animation
animation: '',
// numbers display
numbers: false,
// navigation display
navigation: false,
// label display
label: true,
// easing default
easing_default: '',
// the skitters box (internal)
skitter_box: null,
// @deprecated
time_interval: null,
// image link (internal)
images_links: null,
// actual image (internal)
image_atual: null,
// actual link (internal)
link_atual: null,
// actual label (internal)
label_atual: null,
// actual target (internal)
target_atual: '_self',
// skitter width (internal)
width_skitter: null,
// skitter height (internal)
height_skitter: null,
// image number loop (internal)
image_i: 1,
// is animating (internal)
is_animating: false,
// is hover skitter_box (internal)
is_hover_skitter_box: false,
// smart randomly (internal)
random_ia: null,
// randomly sliders
show_randomly: false,
// navigation with thumbs
thumbs: false,
// hide numbers and navigation
hide_tools: false,
// fullscreen mode
fullscreen: false,
// loading data from xml file
xml: false,
// navigation with dots
dots: true,
// final opacity of elements in hide_tools
opacity_elements: 0.75,
// interval animation hover elements hide_tools
interval_in_elements: 200,
// interval animation out elements hide_tools
interval_out_elements: 300,
// onload callback
onload: null,
// function call to change image
imageswitched: null,
// @deprecated
max_number_height: 20,
// alignment of numbers/dots/thumbs
numbers_align: 'center',
// preview with dots
preview: false,
// focus slideshow
focus: false,
// focus active (internal)
foucs_active: false,
// option play/pause manually
controls: false,
// displays progress bar
progressbar: false,
// css progress bar
progressbar_css: {},
// is paused (internal)
is_paused: false,
// is blur (internal)
is_blur: false,
// is paused time (internal)
is_paused_time: false,
// time start (internal)
time_start: 0,
// elapsed time (internal)
elapsedtime: 0,
// stop animation to move mouse over it.
stop_over: true,
// enable navigation keys
enable_navigation_keys: false,
// specific animations
with_animations: [],
// function call to go over the navigation buttons
// mouseoverbutton: function() { $(this).stop().animate({opacity:0.5}, 200); },
mouseoverbutton: null,
// function call to go out the navigation buttons
// mouseoutbutton: function() { $(this).stop().animate({opacity:1}, 200); },
mouseoutbutton: null,
// sets whether the slideshow will start automatically
auto_play: true,
// label animation type
label_animation: 'slideup',
// theme
theme: null,
// structure (internal)
structure: 'prev'
+ 'next'
+ ''
+ '
'
+ '
'
+ '
'
+ '
'
+ '
'
+ '
',
// responsive
// example:
// responsive: {
// small: {
// animation: 'fade',
// max_width: 768,
// suffix: '-small'
// },
// medium: {
// animation: 'fadefour',
// max_width: 1024,
// suffix: '-medium'
// }
// }
responsive: {
small: {
animation: 'fade',
max_width: 768
},
medium: {
max_width: 1024
}
}
};
$.skitter = function(obj, options, number) {
this.skitter_box = $(obj);
this.timer = null;
this.settings = $.extend({}, defaults, options || {});
this.number_skitter = number;
this.setup();
};
// shortcut
var $sk = $.skitter;
$sk.fn = $sk.prototype = {};
$sk.fn.extend = $.extend;
$sk.fn.extend({
// available animations
animations: [
'cube',
'cuberandom',
'block',
'cubestop',
'cubestoprandom',
'cubehide',
'cubesize',
'horizontal',
'showbars',
'showbarsrandom',
'tube',
'fade',
'fadefour',
'paralell',
'blind',
'blindheight',
'blindwidth',
'directiontop',
'directionbottom',
'directionright',
'directionleft',
'cubespread',
'glasscube',
'glassblock',
'circles',
'circlesinside',
'circlesrotate',
'cubeshow',
'upbars',
'downbars',
'hidebars',
'swapbars',
'swapbarsback',
'swapblocks',
'cut'
],
/**
* init
*/
setup: function()
{
var self = this;
// fullscreen
if (this.settings.fullscreen) {
var width = $(window).width();
var height = $(window).height();
this.skitter_box.width(width).height(height);
this.skitter_box.css({'position':'absolute', 'top':0, 'left':0, 'z-index':1000});
this.settings.stop_over = false;
$('body').css({'overflown':'hidden'});
}
this.settings.width_skitter = parsefloat(this.skitter_box.css('width'));
this.settings.height_skitter = parsefloat(this.skitter_box.css('height'));
this.settings.original_width_skitter = this.settings.width_skitter;
this.settings.original_height_skitter = this.settings.height_skitter;
if (!this.settings.width_skitter || !this.settings.height_skitter) {
console.warn('width or height size is null! - skitter slideshow');
return false;
}
// theme
if ( this.settings.theme ) {
this.skitter_box.addclass('skitter-' + this.settings.theme);
}
// structure html
this.skitter_box.append(this.settings.structure);
// settings
this.settings.easing_default = this.geteasing(this.settings.easing);
if (this.settings.velocity >= 2) this.settings.velocity = 1.3;
if (this.settings.velocity <= 0) this.settings.velocity = 1;
this.skitter_box.find('.info_slide').hide();
this.skitter_box.find('.label_skitter').hide();
this.skitter_box.find('.prev_button').hide();
this.skitter_box.find('.next_button').hide();
this.skitter_box.find('.container_skitter').width(this.settings.width_skitter);
this.skitter_box.find('.container_skitter').height(this.settings.height_skitter);
var initial_select_class = ' image_number_select', u = 0;
this.settings.images_links = [];
// add image, link, animation type and label
var addimagelink = function (link, src, animation_type, label, target) {
self.settings.images_links.push([src, link, animation_type, label, target]);
if (self.settings.thumbs) {
var dimension_thumb = '';
if (self.settings.width_skitter > self.settings.height_skitter) {
dimension_thumb = 'height="100"';
}
else {
dimension_thumb = 'width="100"';
}
self.skitter_box.find('.info_slide').append(
' '
);
}
else {
self.skitter_box.find('.info_slide').append(
''+u+' '
);
}
initial_select_class = '';
};
// load from xml
if (this.settings.xml) {
$.ajax({
type: 'get',
url: this.settings.xml,
async: false,
datatype: 'xml',
success: function(xml) {
var ul = $('');
$(xml).find('skitter slide').each(function(){
++u;
var link = ($(this).find('link').text()) ? $(this).find('link').text() : '#';
var src = $(this).find('image').text();
var animation_type = $(this).find('image').attr('type');
var label = $(this).find('label').text();
var target = ($(this).find('target').text()) ? $(this).find('target').text() : '_self';
addimagelink(link, src, animation_type, label, target);
});
}
});
}
// load from json
else if (this.settings.json) {
}
// load from html
else {
this.skitter_box.find('ul li').each(function(){
++u;
var link = ($(this).find('a').length) ? $(this).find('a').attr('href') : '#';
var src = $(this).find('img').attr('src');
var animation_type = $(this).find('img').attr('class');
var label = $(this).find('.label_text').html();
var target = ($(this).find('a').length && $(this).find('a').attr('target')) ? $(this).find('a').attr('target') : '_self';
addimagelink(link, src, animation_type, label, target);
});
}
// thumbs
if (self.settings.thumbs && !self.settings.fullscreen)
{
self.skitter_box.find('.info_slide').addclass('info_slide_thumb');
var width_info_slide = (u + 1) * self.skitter_box.find('.info_slide_thumb .image_number').outerwidth();
self.skitter_box.find('.info_slide_thumb').width(width_info_slide);
self.skitter_box.css({height:self.skitter_box.height() + self.skitter_box.find('.info_slide').outerheight()});
self.skitter_box.append('');
var copy_info_slide = self.skitter_box.find('.info_slide').clone();
self.skitter_box.find('.info_slide').remove();
self.skitter_box.find('.container_thumbs')
.width(self.settings.width_skitter)
.append(copy_info_slide);
// scrolling with mouse movement
var width_image = 0,
width_skitter = this.settings.width_skitter,
height_skitter = this.settings.height_skitter,
w_info_slide_thumb = 0,
info_slide_thumb = self.skitter_box.find('.info_slide_thumb'),
x_value = 0,
y_value = self.skitter_box.offset().top;
info_slide_thumb.find('.image_number').each(function(){
width_image += $(this).outerwidth();
});
info_slide_thumb.width(width_image+'px');
w_info_slide_thumb = info_slide_thumb.outerwidth();
width_value = this.settings.width_skitter;
width_value = width_skitter - 100;
if (width_info_slide > self.settings.width_skitter) {
self.skitter_box.mousemove(function(e){
x_value = self.skitter_box.offset().left + 90;
var x = e.pagex, y = e.pagey, new_x = 0;
x = x - x_value;
y = y - y_value;
novo_width = w_info_slide_thumb - width_value;
new_x = -((novo_width * x) / width_value);
if (new_x > 0) new_x = 0;
if (new_x < -(w_info_slide_thumb - width_skitter)) new_x = -(w_info_slide_thumb - width_skitter);
if (y > height_skitter) {
info_slide_thumb.css({left: new_x});
}
});
}
self.skitter_box.find('.scroll_thumbs').css({'left':10});
if (width_info_slide < self.settings.width_skitter) {
self.skitter_box.find('.box_scroll_thumbs').hide();
var class_info = '.info_slide';
switch (self.settings.numbers_align) {
case 'center' :
var _vleft = (self.settings.width_skitter - self.skitter_box.find(class_info).outerwidth()) / 2;
self.skitter_box.find(class_info).css({'left': '50%', 'transform': 'translatex(-50%)'});
break;
case 'right' :
self.skitter_box.find(class_info).css({'left':'auto', 'right':'-5px'});
break;
case 'left' :
self.skitter_box.find(class_info).css({'left':'0px'});
break;
}
}
}
else
{
var class_info = '.info_slide';
if (self.settings.dots) {
self.skitter_box.find('.info_slide').addclass('info_slide_dots').removeclass('info_slide');
class_info = '.info_slide_dots';
}
switch (self.settings.numbers_align) {
case 'center' :
var _vleft = (self.settings.width_skitter - self.skitter_box.find(class_info).outerwidth()) / 2;
self.skitter_box.find(class_info).css({'left': '50%', 'transform': 'translatex(-50%)'});
break;
case 'right' :
self.skitter_box.find(class_info).css({'left':'auto', 'right':'15px'});
break;
case 'left' :
self.skitter_box.find(class_info).css({'left':'15px'});
break;
}
if (!self.settings.dots) {
if (self.skitter_box.find('.info_slide').outerheight() > 20) {
self.skitter_box.find('.info_slide').hide();
}
}
}
this.skitter_box.find('ul').hide();
if (this.settings.show_randomly)
this.settings.images_links.sort(function(a,b) {return math.random() - 0.5;});
this.settings.image_atual = this.settings.images_links[0][0];
this.settings.link_atual = this.settings.images_links[0][1];
this.settings.label_atual = this.settings.images_links[0][3];
this.settings.target_atual = this.settings.images_links[0][4];
if (this.settings.images_links.length > 1)
{
this.skitter_box.find('.prev_button').click(function() {
if (self.settings.is_animating == false) {
self.settings.image_i -= 2;
if (self.settings.image_i == -2) {
self.settings.image_i = self.settings.images_links.length - 2;
}
else if (self.settings.image_i == -1) {
self.settings.image_i = self.settings.images_links.length - 1;
}
self.jumptoimage(self.settings.image_i);
}
return false;
});
this.skitter_box.find('.next_button').click(function() {
self.jumptoimage(self.settings.image_i);
return false;
});
self.skitter_box.find('.next_button, .prev_button').bind('mouseover', self.settings.mouseoverbutton);
self.skitter_box.find('.next_button, .prev_button').bind('mouseleave', self.settings.mouseoutbutton);
this.skitter_box.find('.image_number').click(function(){
if ($(this).attr('class') != 'image_number image_number_select') {
var imagenumber = parseint($(this).attr('rel'));
self.jumptoimage(imagenumber);
}
return false;
});
// preview with dots
if (self.settings.preview && self.settings.dots)
{
var preview = $('');
for (var i = 0; i < this.settings.images_links.length; i++) {
var li = $('');
var img = $('');
img.attr('src', this.settings.images_links[i][0]);
li.append(img);
preview.find('ul').append(li);
}
var width_preview_ul = parseint(this.settings.images_links.length * 100);
preview.find('ul').width(width_preview_ul);
$(class_info).append(preview);
self.skitter_box.find(class_info).find('.image_number').mouseenter(function() {
if (self.islargedevice()) {
var _left_info = parsefloat(self.skitter_box.find(class_info).offset().left);
var _left_image = parsefloat($(this).offset().left);
var _left_preview = (_left_image - _left_info) - 43;
var rel = parseint($(this).attr('rel'));
var image_current_preview = self.skitter_box.find('.preview_slide_current img').attr('src');
var _left_ul = -(rel * 100);
self.skitter_box.find('.preview_slide').find('ul').animate({left: _left_ul}, {duration:200, queue: false, easing: 'easeoutsine'});
self.skitter_box.find('.preview_slide').fadeto(1,1).animate({left: _left_preview}, {duration:200, queue: false});
}
});
self.skitter_box.find(class_info).mouseleave(function() {
if (self.islargedevice()) {
$('.preview_slide').animate({opacity: 'hide'}, {duration: 200, queue: false});
}
});
}
}
// focus
if (self.settings.focus) {
self.focusskitter();
}
// constrols
if (self.settings.controls) {
self.setcontrols();
}
// progressbar
if (self.settings.progressbar && self.settings.auto_play) {
self.addprogressbar();
}
// hide_tools
if (self.settings.hide_tools) {
self.hidetools();
}
// navigation keys
if (self.settings.enable_navigation_keys) {
self.enablenavigationkeys();
}
this.loadimages();
this.setresponsive();
this.settouchsupport();
},
/**
* load images
*/
loadimages: function ()
{
var self = this;
var loading = $('');
var total = this.settings.images_links.length;
var u = 0;
this.skitter_box.append(loading);
for (var i in this.settings.images_links) {
var self_il = this.settings.images_links[i];
var src = self.getimagename(self_il[0]);
var img = new image();
$(img).on('load', function () {
++u;
if (u == total) {
self.skitter_box.find('.skitter-spinner').remove();
self.start();
}
}).on('error', function () {
self.skitter_box.find('.skitter-spinner, .image_number, .next_button, .prev_button').remove();
self.skitter_box.html('error loading images. one or more images were not found.
');
}).attr('src', src);
}
},
/**
* start skitter
*/
start: function()
{
var self = this;
var init_pause = false;
if (this.settings.numbers || this.settings.thumbs) this.skitter_box.find('.info_slide').fadein(500);
if (this.settings.dots) this.skitter_box.find('.info_slide_dots').fadein(500);
if (this.settings.label) this.skitter_box.find('.label_skitter').show();
if (this.settings.navigation) {
this.skitter_box.find('.prev_button').fadein(500);
this.skitter_box.find('.next_button').fadein(500);
}
if (self.settings.auto_play) {
self.starttime();
}
self.windowfocusout();
self.setlinkatual();
self.skitter_box.find('.image > a img').attr({'src': self.getcurrentimage()});
img_link = self.skitter_box.find('.image > a');
img_link = self.resizeimage(img_link);
img_link.find('img').fadein(1500);
self.setvalueboxtext();
self.showboxtext();
if (self.settings.auto_play) {
self.stoponmouseover();
}
var mouseoverinit = function() {
if (self.settings.stop_over) {
init_pause = true;
self.settings.is_hover_skitter_box = true;
self.cleartimer(true);
self.pauseprogressbar();
}
};
self.skitter_box.mouseover(mouseoverinit);
self.skitter_box.find('.next_button').mouseover(mouseoverinit);
if (self.settings.images_links.length > 1 && !init_pause) {
if (self.settings.auto_play) {
self.timer = settimeout(function() { self.nextimage(); }, self.settings.interval);
}
}
else {
self.skitter_box.find('.skitter-spinner, .image_number, .next_button, .prev_button').remove();
}
if ($.isfunction(self.settings.onload)) self.settings.onload(self);
this.setdimensions();
},
/**
* jump to image
*/
jumptoimage: function(imagenumber)
{
if (this.settings.is_animating == false) {
this.settings.elapsedtime = 0;
this.skitter_box.find('.box_clone').stop();
this.cleartimer(true);
this.settings.image_i = math.floor(imagenumber);
this.skitter_box.find('.image > a').attr({'href': this.settings.link_atual});
this.skitter_box.find('.image_main').attr({'src': this.getcurrentimage()});
this.skitter_box.find('.box_clone').remove();
this.nextimage();
}
},
/**
* next image
*/
nextimage: function()
{
var self = this;
animations_functions = this.animations;
if (self.settings.progressbar) self.hideprogressbar();
var animation_type;
if (this.settings.animation == '' && this.settings.images_links[this.settings.image_i][2]) {
animation_type = this.settings.images_links[this.settings.image_i][2];
} else if (this.settings.animation == '') {
animation_type = 'default';
} else {
animation_type = this.settings.animation;
}
// animation fixed by window size
if (self.settings.responsive) {
var window_width = $(window).width();
for (var name in self.settings.responsive) {
var item = self.settings.responsive[name];
if (window_width < item.max_width && item.animation) {
animation_type = item.animation;
break;
}
}
}
// randomunique
if (animation_type == 'randomsmart')
{
if (!this.settings.random_ia) {
animations_functions.sort(function() {
return 0.5 - math.random();
});
this.settings.random_ia = animations_functions;
}
animation_type = this.settings.random_ia[this.settings.image_i];
}
// random
else if (animation_type == 'random')
{
var random_id = parseint(math.random() * animations_functions.length);
animation_type = animations_functions[random_id];
}
// specific animations
else if (self.settings.with_animations.length > 0)
{
var total_with_animations = self.settings.with_animations.length;
if (this.settings._i_animation == undefined) {
this.settings._i_animation = 0;
}
animation_type = self.settings.with_animations[this.settings._i_animation];
++this.settings._i_animation;
if (this.settings._i_animation >= total_with_animations) this.settings._i_animation = 0;
}
switch (animation_type)
{
case 'cube' :
this.animationcube();
break;
case 'cuberandom' :
this.animationcube({random:true});
break;
case 'block' :
this.animationblock();
break;
case 'cubestop' :
this.animationcubestop();
break;
case 'cubestoprandom' :
this.animationcubestop({random:true});
break;
case 'cubehide' :
this.animationcubehide();
break;
case 'cubesize' :
this.animationcubesize();
break;
case 'horizontal' :
this.animationhorizontal();
break;
case 'showbars' :
this.animationshowbars();
break;
case 'showbarsrandom' :
this.animationshowbars({random:true});
break;
case 'tube' :
this.animationtube();
break;
case 'fade' :
this.animationfade();
break;
case 'fadefour' :
this.animationfadefour();
break;
case 'paralell' :
this.animationparalell();
break;
case 'blind' :
this.animationblind();
break;
case 'blindheight' :
this.animationblinddimension({height:true});
break;
case 'blindwidth' :
this.animationblinddimension({height:false, time_animate:400, delay:50});
break;
case 'directiontop' :
this.animationdirection({direction:'top'});
break;
case 'directionbottom' :
this.animationdirection({direction:'bottom'});
break;
case 'directionright' :
this.animationdirection({direction:'right', total:5});
break;
case 'directionleft' :
this.animationdirection({direction:'left', total:5});
break;
case 'cubespread' :
this.animationcubespread();
break;
case 'cubejelly' :
this.animationcubejelly();
break;
case 'glasscube' :
this.animationglasscube();
break;
case 'glassblock' :
this.animationglassblock();
break;
case 'circles' :
this.animationcircles();
break;
case 'circlesinside' :
this.animationcirclesinside();
break;
case 'circlesrotate' :
this.animationcirclesrotate();
break;
case 'cubeshow' :
this.animationcubeshow();
break;
case 'upbars' :
this.animationdirectionbars({direction: 'top'});
break;
case 'downbars' :
this.animationdirectionbars({direction: 'bottom'});
break;
case 'hidebars' :
this.animationhidebars();
break;
case 'swapbars' :
this.animationswapbars();
break;
case 'swapbarsback' :
this.animationswapbars({easing: 'easeoutback'});
break;
case 'swapblocks' :
this.animationswapblocks();
break;
case 'cut' :
this.animationcut();
break;
default :
this.animationtube();
break;
}
},
animationcube: function (options)
{
var self = this;
var options = $.extend({}, {random: false}, options || {});
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeoutexpo' : this.settings.easing_default;
var time_animate = 700 / this.settings.velocity;
this.setactuallevel();
var max_w = self.getmaxw(8);
var division_w = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w));
var division_h = math.ceil(this.settings.height_skitter / (this.settings.height_skitter / 3));
var total = division_w * division_h;
var width_box = math.ceil(this.settings.width_skitter / division_w);
var height_box = math.ceil(this.settings.height_skitter / division_h);
var init_top = this.settings.height_skitter + 200;
var init_left = this.settings.height_skitter + 200;
var col_t = 0;
var col = 0;
for (i = 0; i < total; i++) {
init_top = (i % 2 == 0) ? init_top : -init_top;
init_left = (i % 2 == 0) ? init_left : -init_left;
var _vtop = init_top + (height_box * col_t) + (col_t * 150);
var _vleft = -self.settings.width_skitter;
var _vtop_image = -(height_box * col_t);
var _vleft_image = -(width_box * col);
var _btop = (height_box * col_t);
var _bleft = (width_box * col);
var box_clone = this.getboxclone();
box_clone.hide();
var delay_time = 50 * (i);
if (options.random) {
delay_time = 40 * (col);
box_clone.css({left:_vleft+'px', top:_vtop+'px', width:width_box, height:height_box});
}
else {
time_animate = 500;
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});
}
this.addboxclone(box_clone);
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
box_clone.show().delay(delay_time).animate({top:_btop+'px', left:_bleft+'px'}, time_animate, easing, callback);
if (options.random) {
box_clone.find('img').css({left:_vleft_image+100, top:_vtop_image+50});
box_clone.find('img').delay(delay_time+(time_animate/2)).animate({left:_vleft_image, top:_vtop_image}, 1000, 'easeoutback');
}
else {
box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
box_clone.find('img').delay(delay_time+(time_animate/2)).fadeto(100, 0.5).fadeto(300, 1);
}
col_t++;
if (col_t == division_h) {
col_t = 0;
col++;
}
}
},
animationblock: function(options)
{
var self = this;
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeoutquad' : this.settings.easing_default;
var time_animate = 500 / this.settings.velocity;
this.setactuallevel();
var max_w = self.getmaxw(15);
var total = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w));
var width_box = math.ceil(this.settings.width_skitter / total);
var height_box = (this.settings.height_skitter);
for (i = 0; i < total; i++) {
var _bleft = (width_box * (i));
var _btop = 0;
var box_clone = this.getboxclone();
box_clone.css({left: this.settings.width_skitter + 100, top:0, width:width_box, height:height_box});
box_clone.find('img').css({left:-(width_box * i)});
this.addboxclone(box_clone);
var delay_time = 80 * (i);
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
box_clone.show().delay(delay_time).animate({top:_btop, left:_bleft}, time_animate, easing);
box_clone.find('img').hide().delay(delay_time+100).animate({opacity:'show'}, time_animate+300, easing, callback);
}
},
animationcubestop: function(options)
{
var self = this;
var options = $.extend({}, {random: false}, options || {});
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeinquad' : this.settings.easing_default;
var time_animate = 300 / this.settings.velocity;
var image_old = this.getoldimage();
this.setactuallevel();
this.setlinkatual();
this.skitter_box.find('.image_main').attr({'src':this.getcurrentimage()});
var max_w = self.getmaxw(8);
var max_h = self.getmaxh(8);
var division_w = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w));
var division_h = math.ceil(this.settings.height_skitter / (this.settings.width_skitter / max_h));
var total = division_w * division_h;
var width_box = math.ceil(this.settings.width_skitter / division_w);
var height_box = math.ceil(this.settings.height_skitter / division_h);
var init_top = 0;
var init_left = 0;
var col_t = 0;
var col = 0;
var _ftop = this.settings.width_skitter / 16;
for (i = 0; i < total; i++) {
init_top = (i % 2 == 0) ? init_top : -init_top;
init_left = (i % 2 == 0) ? init_left : -init_left;
var _vtop = init_top + (height_box * col_t);
var _vleft = (init_left + (width_box * col));
var _vtop_image = -(height_box * col_t);
var _vleft_image = -(width_box * col);
var _btop = _vtop - _ftop;
var _bleft = _vleft - _ftop;
var box_clone = this.getboxcloneimgold(image_old);
box_clone.css({left:_vleft+'px', top:_vtop+'px', width:width_box, height:height_box});
box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
this.addboxclone(box_clone);
box_clone.show();
var delay_time = 50 * i;
if (options.random) {
time_animate = (400 * (self.getrandom(2) + 1)) / this.settings.velocity;
_btop = _vtop;
_bleft = _vleft;
delay_time = math.ceil( 30 * self.getrandom(30) );
}
if (options.random && i == (total - 1)) {
time_animate = 400 * 3;
delay_time = 30 * 30;
}
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
box_clone.delay(delay_time).animate({opacity:'hide', top:_btop+'px', left:_bleft+'px'}, time_animate, easing, callback);
col_t++;
if (col_t == division_h) {
col_t = 0;
col++;
}
}
},
animationcubehide: function(options)
{
var self = this;
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeoutquad' : this.settings.easing_default;
var time_animate = 500 / this.settings.velocity;
var image_old = this.getoldimage();
this.setactuallevel();
this.setlinkatual();
this.skitter_box.find('.image_main').attr({'src':this.getcurrentimage()});
var max_w = self.getmaxw(8);
var division_w = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w));
var division_h = math.ceil(this.settings.height_skitter / (this.settings.height_skitter / 3));
var total = division_w * division_h;
var width_box = math.ceil(this.settings.width_skitter / division_w);
var height_box = math.ceil(this.settings.height_skitter / division_h);
var init_top = 0;
var init_left = 0;
var col_t = 0;
var col = 0;
for (i = 0; i < total; i++) {
init_top = (i % 2 == 0) ? init_top : -init_top;
init_left = (i % 2 == 0) ? init_left : -init_left;
var _vtop = init_top + (height_box * col_t);
var _vleft = (init_left + (width_box * col));
var _vtop_image = -(height_box * col_t);
var _vleft_image = -(width_box * col);
var _btop = _vtop - 50;
var _bleft = _vleft - 50;
var box_clone = this.getboxcloneimgold(image_old);
box_clone.css({left:_vleft+'px', top:_vtop+'px', width:width_box, height:height_box});
box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
this.addboxclone(box_clone);
box_clone.show();
var delay_time = 50 * i;
delay_time = (i == (total - 1)) ? (total * 50) : delay_time;
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
box_clone.delay(delay_time).animate({opacity:'hide'}, time_animate, easing, callback);
col_t++;
if (col_t == division_h) {
col_t = 0;
col++;
}
}
},
animationcubejelly: function(options)
{
var self = this;
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeinback' : this.settings.easing_default;
var time_animate = 300 / this.settings.velocity;
var image_old = this.getoldimage();
this.setactuallevel();
this.setlinkatual();
this.skitter_box.find('.image_main').attr({'src':this.getcurrentimage()});
var max_w = self.getmaxw(8);
var division_w = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w));
var division_h = math.ceil(this.settings.height_skitter / (this.settings.height_skitter / 3));
var total = division_w * division_h;
var width_box = math.ceil(this.settings.width_skitter / division_w);
var height_box = math.ceil(this.settings.height_skitter / division_h);
var init_top = 0;
var init_left = 0;
var col_t = 0;
var col = 0;
var u = -1;
for (i = 0; i < total; i++) {
if (col % 2 != 0) {
if (col_t == 0) {
u = u + division_h + 1;
}
u--;
}
else {
if (col > 0 && col_t == 0) {
u = u + 2;
}
u++;
}
init_top = (i % 2 == 0) ? init_top : -init_top;
init_left = (i % 2 == 0) ? init_left : -init_left;
var _vtop = init_top + (height_box * col_t);
var _vleft = (init_left + (width_box * col));
var _vtop_image = -(height_box * col_t);
var _vleft_image = -(width_box * col);
var _btop = _vtop - 50;
var _bleft = _vleft - 50;
var box_clone = this.getboxcloneimgold(image_old);
box_clone.css({left:_vleft+'px', top:_vtop+'px', width:width_box, height:height_box});
box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
this.addboxclone(box_clone);
box_clone.show();
var delay_time = (50 * i);
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
box_clone.delay(delay_time).animate({width:'+=100px', height:'+=100px', top:'-=20px', left: '-=20px', opacity:'hide'}, time_animate, easing, callback);
col_t++;
if (col_t == division_h) {
col_t = 0;
col++;
}
}
},
animationcubesize: function(options)
{
var self = this;
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeinoutquad' : this.settings.easing_default;
var time_animate = 600 / this.settings.velocity;
var image_old = this.getoldimage();
this.setactuallevel();
this.setlinkatual();
this.skitter_box.find('.image_main').attr({'src':this.getcurrentimage()});
var max_w = self.getmaxw(8);
var division_w = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w));
var division_h = math.ceil(this.settings.height_skitter / (this.settings.height_skitter / 3));
var total = division_w * division_h;
var width_box = math.ceil(this.settings.width_skitter / division_w);
var height_box = math.ceil(this.settings.height_skitter / division_h);
var init_top = 0;
var init_left = 0;
var col_t = 0;
var col = 0;
var _ftop = math.ceil(this.settings.width_skitter / 6);
for (i = 0; i < total; i++) {
init_top = (i % 2 == 0) ? init_top : -init_top;
init_left = (i % 2 == 0) ? init_left : -init_left;
var _vtop = init_top + (height_box * col_t);
var _vleft = (init_left + (width_box * col));
var _vtop_image = -(height_box * col_t);
var _vleft_image = -(width_box * col);
var _btop = _vtop - _ftop;
var _bleft = _vleft - _ftop;
var box_clone = this.getboxcloneimgold(image_old);
box_clone.css({left:_vleft, top:_vtop, width:width_box, height:height_box});
box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
this.addboxclone(box_clone);
box_clone.show();
var delay_time = 50 * i;
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
box_clone.delay(delay_time).animate({
opacity:'hide',width:'hide',height:'hide',top:_vtop+(width_box*1.5),left:_vleft+(height_box*1.5)
}, time_animate, easing, callback);
col_t++;
if (col_t == division_h) {
col_t = 0;
col++;
}
}
},
animationhorizontal: function(options)
{
var self = this;
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeoutexpo' : this.settings.easing_default;
var time_animate = 700 / this.settings.velocity;
this.setactuallevel();
var total = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 7));
var width_box = (this.settings.width_skitter);
var height_box = math.ceil(this.settings.height_skitter / total);
for (i = 0; i < total; i++) {
var _bleft = (i % 2 == 0 ? '' : '') + width_box;
var _btop = (i * height_box);
var box_clone = this.getboxclone();
box_clone.css({left:_bleft+'px', top:_btop+'px', width:width_box, height:height_box});
box_clone.find('img').css({left:0, top:-_btop});
this.addboxclone(box_clone);
var delay_time = 90 * i;
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
box_clone.delay(delay_time).animate({opacity:'show', top:_btop, left:0}, time_animate, easing, callback);
}
},
animationshowbars: function(options)
{
var self = this;
var options = $.extend({}, {random: false}, options || {});
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeoutquad' : this.settings.easing_default;
var time_animate = 400 / this.settings.velocity;
this.setactuallevel();
var max_w = self.getmaxw(10);
var total = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w));
var width_box = math.ceil(this.settings.width_skitter / total);
var height_box = (this.settings.height_skitter);
for (i = 0; i < total; i++) {
var _bleft = (width_box * (i));
var _btop = 0;
var box_clone = this.getboxclone();
box_clone.css({left:_bleft, top:_btop - 50, width:width_box, height:height_box});
box_clone.find('img').css({left:-(width_box * i), top:0});
this.addboxclone(box_clone);
if (options.random) {
var random = this.getrandom(total);
var delay_time = 50 * random;
delay_time = (i == (total - 1)) ? (50 * total) : delay_time;
}
else {
var delay_time = 70 * (i);
time_animate = time_animate - (i * 2);
}
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
box_clone.delay(delay_time).animate({
opacity:'show', top:_btop+'px', left:_bleft+'px'
}, time_animate, easing, callback);
}
},
animationtube: function(options)
{
var self = this;
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeoutelastic' : this.settings.easing_default;
var time_animate = 600 / this.settings.velocity;
this.setactuallevel();
var max_w = self.getmaxw(10);
var total = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w));
var width_box = math.ceil(this.settings.width_skitter / total);
var height_box = this.settings.height_skitter;
for (i = 0;i ((total / 2) - 1)) {
delay_time = ((i - (total / 2)) * 200);
}
delay_time = delay_time / 2.5;
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
box_clone.delay(delay_time).animate({
top:_btop+'px', left:_bleft+'px', opacity: 'show'
}, time_animate, easing, callback);
}
},
animationblind: function(options)
{
var self = this;
var options = $.extend({}, {height: false}, options || {});
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeoutquad' : this.settings.easing_default;
var time_animate = 400 / this.settings.velocity;
this.setactuallevel();
var max_w = 16; // self.getmaxw(16); // @todo complex
var total = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w));
var width_box = math.ceil(this.settings.width_skitter / total);
var height_box = this.settings.height_skitter;
for (i = 0; i < total; i++) {
var _bleft = (width_box * (i));
var _btop = 0;
var box_clone = this.getboxclone();
box_clone.css({left:_bleft, top:_btop, width:width_box, height:height_box});
box_clone.find('img').css({left:-(width_box * i), top:0});
this.addboxclone(box_clone);
var delay_time;
if (!options.height) {
if (i <= ((total / 2) - 1)) {
delay_time = 1400 - (i * 200);
}
else if (i > ((total / 2) - 1)) {
delay_time = ((i - (total / 2)) * 200);
}
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
}
else {
if (i <= ((total / 2) - 1)) {
delay_time = 200 + (i * 200);
}
else if (i > ((total / 2) - 1)) {
delay_time = (((total / 2) - i) * 200) + (total * 100);
}
var callback = (i == (total / 2)) ? function() { self.finishanimation(); } : '';
}
delay_time = delay_time / 2.5;
if (!options.height) {
box_clone.delay(delay_time).animate({
opacity:'show',top:_btop+'px', left:_bleft+'px', width:'show'
}, time_animate, easing, callback);
}
else {
time_animate = time_animate + (i * 2);
var easing = 'easeoutquad';
box_clone.delay(delay_time).animate({
opacity:'show',top:_btop+'px', left:_bleft+'px', height:'show'
}, time_animate, easing, callback);
}
}
},
animationblinddimension: function(options)
{
var self = this;
var options = $.extend({}, {height: true, time_animate: 500, delay: 100}, options || {});
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeoutquad' : this.settings.easing_default;
var time_animate = options.time_animate / this.settings.velocity;
this.setactuallevel();
var max_w = self.getmaxw(16);
var total = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w));
var width_box = math.ceil(this.settings.width_skitter / total);
var height_box = this.settings.height_skitter;
for (i = 0; i < total; i++) {
var _bleft = (width_box * (i));
var _btop = 0;
var box_clone = this.getboxclone();
box_clone.css({left:_bleft, top:_btop, width:width_box, height:height_box});
box_clone.find('img').css({left:-(width_box * i), top:0});
this.addboxclone(box_clone);
var delay_time = options.delay * i;
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
if (!options.height) {
box_clone.delay(delay_time).animate({
opacity:'show',top:_btop+'px', left:_bleft+'px', width:'show'
}, time_animate, easing, callback);
}
else {
var easing = 'easeoutquad';
box_clone.delay(delay_time).animate({
opacity:'show',top:_btop+'px', left:_bleft+'px', height:'show'
}, time_animate, easing, callback);
}
}
},
animationdirection: function(options)
{
var self = this;
var max_w = self.getmaxw(7);
var options = $.extend({}, {direction: 'top', delay_type: 'sequence', total: max_w}, options || {});
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeinoutexpo' : this.settings.easing_default;
var time_animate = 1200 / this.settings.velocity;
var image_old = this.getoldimage();
this.setactuallevel();
this.setlinkatual();
this.skitter_box.find('.image_main').attr({'src':this.getcurrentimage()});
this.skitter_box.find('.image_main').hide();
var total = options.total;
for (i = 0; i < total; i++) {
switch (options.direction)
{
default : case 'top' :
var width_box = math.ceil(this.settings.width_skitter / total);
var height_box = this.settings.height_skitter;
var _itopc = 0;
var _ileftc = (width_box * i);
var _ftopc = -height_box;
var _fleftc = _ileftc;
var _itopn = height_box;
var _ileftn = _ileftc;
var _ftopn = 0;
var _fleftn = _ileftc;
var _vtop_image = 0;
var _vleft_image = -_ileftc;
break;
case 'bottom' :
var width_box = math.ceil(this.settings.width_skitter / total);
var height_box = this.settings.height_skitter;
var _itopc = 0;
var _ileftc = (width_box * i);
var _ftopc = height_box;
var _fleftc = _ileftc;
var _itopn = -height_box;
var _ileftn = _ileftc;
var _ftopn = 0;
var _fleftn = _ileftc;
var _vtop_image = 0;
var _vleft_image = -_ileftc;
break;
case 'right' :
var width_box = this.settings.width_skitter;
var height_box = math.ceil(this.settings.height_skitter / total);
var _itopc = (height_box * i);
var _ileftc = 0;
var _ftopc = _itopc;
var _fleftc = width_box;
var _itopn = _itopc;
var _ileftn = -_fleftc;
var _ftopn = _itopc;
var _fleftn = 0;
var _vtop_image = -_itopc;
var _vleft_image = 0;
break;
case 'left' :
var width_box = this.settings.width_skitter;
var height_box = math.ceil(this.settings.height_skitter / total);
var _itopc = (height_box * i);
var _ileftc = 0;
var _ftopc = _itopc;
var _fleftc = -width_box;
var _itopn = _itopc;
var _ileftn = -_fleftc;
var _ftopn = _itopc;
var _fleftn = 0;
var _vtop_image = -_itopc;
var _vleft_image = 0;
break;
}
switch (options.delay_type)
{
case 'zebra' : default : var delay_time = (i % 2 == 0) ? 0 : 150; break;
case 'random' : var delay_time = 30 * (math.random() * 30); break;
case 'sequence' : var delay_time = i * 100; break;
}
var box_clone = this.getboxcloneimgold(image_old);
box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
box_clone.css({top:_itopc, left:_ileftc, width:width_box, height:height_box});
this.addboxclone(box_clone);
box_clone.show();
box_clone.delay(delay_time).animate({ top:_ftopc, left:_fleftc }, time_animate, easing);
// next image
var box_clone_next = this.getboxclone();
box_clone_next.find('img').css({left:_vleft_image, top:_vtop_image});
box_clone_next.css({top:_itopn, left:_ileftn, width:width_box, height:height_box});
this.addboxclone(box_clone_next);
box_clone_next.show();
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
box_clone_next.delay(delay_time).animate({ top:_ftopn, left:_fleftn }, time_animate, easing, callback);
}
},
animationcubespread: function(options)
{
var self = this;
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeoutquad' : this.settings.easing_default;
var time_animate = 700 / this.settings.velocity;
this.setactuallevel();
var max_w = self.getmaxw(8);
var max_h = self.getmaxh(8);
var division_w = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w));
var division_h = math.ceil(this.settings.height_skitter / (this.settings.width_skitter / max_h));
var total = division_w * division_h;
var width_box = math.ceil(this.settings.width_skitter / division_w);
var height_box = math.ceil(this.settings.height_skitter / division_h);
var init_top = 0;
var init_left = 0;
var col_t = 0;
var col = 0;
var order = new array;
var spread = new array;
// make order
for (i = 0; i < total; i++) {
init_top = (i % 2 == 0) ? init_top : -init_top;
init_left = (i % 2 == 0) ? init_left : -init_left;
var _vtop = init_top + (height_box * col_t);
var _vleft = (init_left + (width_box * col));
order[i] = [_vtop, _vleft];
col_t++;
if (col_t == division_h) {
col_t = 0;
col++;
}
}
// reset col and col_t
col_t = 0;
col = 0;
// make array for spread
for (i = 0; i < total; i++) {
spread[i] = i;
};
// shuffle array
var spread = self.shufflearray(spread);
for (i = 0; i < total; i++) {
init_top = (i % 2 == 0) ? init_top : -init_top;
init_left = (i % 2 == 0) ? init_left : -init_left;
var _vtop = init_top + (height_box * col_t);
var _vleft = (init_left + (width_box * col));
var _vtop_image = -(height_box * col_t);
var _vleft_image = -(width_box * col);
var _btop = _vtop;
var _bleft = _vleft;
_vtop = order[spread[i]][0];
_vleft = order[spread[i]][1];
var box_clone = this.getboxclone();
box_clone.css({left:_vleft+'px', top:_vtop+'px', width:width_box, height:height_box});
box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
this.addboxclone(box_clone);
var delay_time = 30 * (math.random() * 30);
if (i == (total-1)) delay_time = 30 * 30;
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
box_clone.delay(delay_time).animate({opacity:'show',top:_btop+'px', left:_bleft+'px'}, time_animate, easing, callback);
col_t++;
if (col_t == division_h) {
col_t = 0;
col++;
}
}
},
animationglasscube: function(options)
{
var self = this;
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeoutexpo' : this.settings.easing_default;
var time_animate = 500 / this.settings.velocity;
this.setactuallevel();
var max_w = self.getmaxw(10);
var total = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w)) * 2;
var width_box = math.ceil(this.settings.width_skitter / total) * 2;
var height_box = (this.settings.height_skitter) / 2;
var col = 0;
for (i = 0; i < total; i++) {
mod = (i % 2) == 0 ? true : false;
var _ileft = (width_box * (col));
var _itop = (mod) ? -self.settings.height_skitter : self.settings.height_skitter;
var _fleft = (width_box * (col));
var _ftop = (mod) ? 0 : (height_box);
var _bleft = -(width_box * col);
var _btop = (mod) ? 0 : -(height_box);
var delay_time = 120 * col;
var box_clone = this.getboxclone();
box_clone.css({left: _ileft, top:_itop, width:width_box, height:height_box});
box_clone
.find('img')
.css({left: _bleft + (width_box / 1.5), top: _btop})
.delay(delay_time)
.animate({left: _bleft, top: _btop}, (time_animate * 1.9), 'easeoutquad');
this.addboxclone(box_clone);
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
box_clone.show().delay(delay_time).animate({top:_ftop, left:_fleft}, time_animate, easing, callback);
if ((i % 2) != 0) col++;
}
},
animationglassblock: function(options)
{
var self = this;
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeoutexpo' : this.settings.easing_default;
var time_animate = 700 / this.settings.velocity;
this.setactuallevel();
var max_w = self.getmaxw(10);
var total = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w));
var width_box = math.ceil(this.settings.width_skitter / total);
var height_box = (this.settings.height_skitter);
for (i = 0; i < total; i++) {
var _ileft = (width_box * (i));
var _itop = 0;
var _fleft = (width_box * (i));
var _ftop = 0;
var _bleft = -(width_box * (i));
var _btop = 0;
var delay_time = 100 * i;
var box_clone = this.getboxclone();
box_clone.css({left: _ileft, top:_itop, width:width_box, height:height_box});
box_clone
.find('img')
.css({left: _bleft + (width_box / 1.5), top: _btop})
.delay(delay_time)
.animate({left: _bleft, top: _btop}, (time_animate * 1.1), 'easeinoutquad');
this.addboxclone(box_clone);
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
box_clone.delay(delay_time).animate({top:_ftop, left:_fleft, opacity: 'show'}, time_animate, easing, callback);
}
},
animationcircles: function(options)
{
var self = this;
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeinquad' : this.settings.easing_default;
var time_animate = 500 / this.settings.velocity;
this.setactuallevel();
var total = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 10));
var size_box = this.settings.height_skitter;
var radius = math.sqrt(math.pow((this.settings.width_skitter), 2) + math.pow((this.settings.height_skitter), 2));
var radius = math.ceil(radius);
var callbackfn = function () {
self.skitter_box.find('.box_clone').remove();
self.finishanimation();
}
for (i = 0; i < total; i++) {
var _ileft = (self.settings.width_skitter / 2) - (size_box / 2);
var _itop = (self.settings.height_skitter / 2) - (size_box / 2);
var _fleft = _ileft;
var _ftop = _itop;
var box_clone = null;
box_clone = this.getboxclonebackground({
image: self.getcurrentimage(),
left: _ileft,
top: _itop,
width: size_box,
height: size_box,
position: {
top: -_itop,
left: -_ileft
}
}).skittercss3({
'border-radius': radius+'px'
});
size_box += 200;
this.addboxclone(box_clone);
var delay_time = 70 * i;
var callback = (i == (total - 1)) ? callbackfn : '';
box_clone.delay(delay_time).animate({top: _ftop, left: _fleft, opacity: 'show'}, time_animate, easing, callback);
}
},
animationcirclesinside: function(options)
{
var self = this;
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeinquad' : this.settings.easing_default;
var time_animate = 500 / this.settings.velocity;
var image_old = this.getoldimage();
this.setactuallevel();
this.setlinkatual();
this.skitter_box.find('.image_main').attr({'src':this.getcurrentimage()});
var total = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 10));
var radius = math.sqrt(math.pow((this.settings.width_skitter), 2) + math.pow((this.settings.height_skitter), 2));
var radius = math.ceil(radius);
var size_box = radius;
for (i = 0; i < total; i++) {
var _ileft = (self.settings.width_skitter / 2) - (size_box / 2);
var _itop = (self.settings.height_skitter / 2) - (size_box / 2);
var _fleft = _ileft;
var _ftop = _itop;
var box_clone = null;
box_clone = this.getboxclonebackground({
image: image_old,
left: _ileft,
top: _itop,
width: size_box,
height: size_box,
position: {
top: -_itop,
left: -_ileft
}
}).skittercss3({
'border-radius': radius+'px'
});
size_box -= 200;
this.addboxclone(box_clone);
box_clone.show();
var delay_time = 70 * i;
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
box_clone.delay(delay_time).animate({top: _ftop, left: _fleft, opacity: 'hide'}, time_animate, easing, callback);
}
},
// obs.: animacao com problemas, igual ao animationcirclesinside
// @todo usar css3 para rotate
animationcirclesrotate: function(options)
{
var self = this;
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeinquad' : this.settings.easing_default;
var time_animate = 500 / this.settings.velocity;
var image_old = this.getoldimage();
this.setactuallevel();
this.setlinkatual();
this.skitter_box.find('.image_main').attr({'src':this.getcurrentimage()});
var total = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 10));
var radius = math.sqrt(math.pow((this.settings.width_skitter), 2) + math.pow((this.settings.height_skitter), 2));
var radius = math.ceil(radius);
var size_box = radius;
for (i = 0; i < total; i++) {
var _ileft = (self.settings.width_skitter / 2) - (size_box / 2);
var _itop = (self.settings.height_skitter / 2) - (size_box / 2);
var _fleft = _ileft;
var _ftop = _itop;
var box_clone = null;
box_clone = this.getboxcloneimgold(image_old);
box_clone.css({left: _ileft, top:_itop, width:size_box, height:size_box}).skittercss3({
'border-radius': radius+'px'
});
box_clone.find('img').css({left: -_ileft, top: -_itop});
size_box -= 300;
this.addboxclone(box_clone);
box_clone.show();
var delay_time = 200 * i;
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
var _rotate = (i % 2 == 0) ? '+=2deg' : '+=2deg';
box_clone.delay(delay_time).animate({ top: _ftop, left: _fleft, opacity: 'hide' }, time_animate, easing, callback);
}
},
animationcubeshow: function(options)
{
var self = this;
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeoutquad' : this.settings.easing_default;
var time_animate = 400 / this.settings.velocity;
this.setactuallevel();
var max_w = self.getmaxw(8);
var max_h = 4;
var division_w = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w));
var division_h = math.ceil(this.settings.height_skitter / (this.settings.height_skitter / max_h));
var total = division_w * division_h;
var width_box = math.ceil(this.settings.width_skitter / division_w);
var height_box = math.ceil(this.settings.height_skitter / division_h);
var last = false;
var _btop = 0;
var _bleft = 0;
var line = 0;
var col = 0;
for (i = 0; i < total; i++) {
_btop = height_box * line;
_bleft = width_box * col;
var delay_time = 30 * (i);
var box_clone = this.getboxclone();
box_clone.css({left:_bleft, top:_btop, width:width_box, height:height_box}).hide();
box_clone.find('img').css({left:-_bleft, top:-_btop});
this.addboxclone(box_clone);
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
box_clone.delay(delay_time).animate({width:'show', height:'show'}, time_animate, easing, callback);
line++;
if (line == division_h) {
line = 0;
col++;
}
}
},
animationdirectionbars: function(options)
{
var self = this;
var options = $.extend({}, {direction: 'top'}, options || {});
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeinoutquad' : this.settings.easing_default;
var time_animate = 400 / this.settings.velocity;
var image_old = this.getoldimage();
this.setactuallevel();
this.setlinkatual();
this.skitter_box.find('.image_main').attr({'src':this.getcurrentimage()});
var max_w = self.getmaxw(12);
var total = max_w;
var width_box = math.ceil(this.settings.width_skitter / total);
var height_box = this.settings.height_skitter;
var _ftop = (options.direction == 'top') ? -height_box : height_box;
for (i = 0; i < total; i++) {
var _vtop = 0;
var _vleft = (width_box * i);
var _vtop_image = 0;
var _vleft_image = -(width_box * i);
var box_clone = this.getboxcloneimgold(image_old);
box_clone.css({left:_vleft+'px', top:_vtop+'px', width:width_box, height:height_box});
box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
this.addboxclone(box_clone);
box_clone.show();
var delay_time = 70 * i;
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
box_clone.delay(delay_time).animate({top:_ftop}, time_animate, easing, callback);
}
},
animationhidebars: function(options)
{
var self = this;
var options = $.extend({}, {random: false}, options || {});
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? 'easeoutcirc' : this.settings.easing_default;
var time_animate = 700 / this.settings.velocity;
var image_old = this.getoldimage();
this.setactuallevel();
this.setlinkatual();
this.skitter_box.find('.image_main').attr({'src':this.getcurrentimage()});
var max_w = self.getmaxw(10);
var division_w = math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w));
var total = division_w;
var width_box = math.ceil(this.settings.width_skitter / division_w);
var height_box = this.settings.height_skitter;
var callbackfn = function () {
self.skitter_box.find('.box_clone').remove();
self.finishanimation();
}
for (i = 0; i < total; i++) {
var _vtop = 0;
var _vleft = width_box * i;
var _vtop_image = 0;
var _vleft_image = -(width_box * i);
var _fleft = '+='+width_box;
var box_clone = this.getboxcloneimgold(image_old);
box_clone.css({left:0, top:0, width:width_box, height:height_box});
box_clone.find('img').css({left:_vleft_image, top:_vtop_image});
var box_clone_main = this.getboxcloneimgold(image_old);
box_clone_main.css({left:_vleft+'px', top:_vtop+'px', width:width_box, height:height_box});
box_clone_main.html(box_clone);
this.addboxclone(box_clone_main);
box_clone.show();
box_clone_main.show();
var delay_time = 50 * i;
var callback = (i == (total - 1)) ? callbackfn : '';
box_clone.delay(delay_time).animate({left:_fleft}, time_animate, easing, callback);
}
},
animationswapbars: function(options)
{
var self = this;
var max_w = self.getmaxw(7);
var options = $.extend({}, {direction: 'top', delay_type: 'sequence', total: max_w, easing: 'easeoutcirc'}, options || {});
this.settings.is_animating = true;
var easing = (this.settings.easing_default == '') ? options.easing : this.settings.easing_default;
var time_animate = 500 / this.settings.velocity;
var image_old = this.getoldimage();
this.setactuallevel();
this.setlinkatual();
this.skitter_box.find('.image_main').attr({'src':this.getcurrentimage()});
this.skitter_box.find('.image_main').hide();
var total = options.total;
for (i = 0; i < total; i++) {
var width_box = math.ceil(this.settings.width_skitter / total);
var height_box = this.settings.height_skitter;
var _itopc = 0;
var _ileftc = (width_box * i);
var _ftopc = -height_box;
var _fleftc = _ileftc + width_box ;
var _itopn = height_box;
var _ileftn = _ileftc;
var _ftopn = 0;
var _fleftn = _ileftc;
var _vtop_image = 0;
var _vleft_image = -_ileftc;
switch (options.delay_type)
{
case 'zebra' : default : var delay_time = (i % 2 == 0) ? 0 : 150; break;
case 'random' : var delay_time = 30 * (math.random() * 30); break;
case 'sequence' : var delay_time = i * 100; break;
}
// old image
var box_clone = this.getboxcloneimgold(image_old);
box_clone.find('img').css({left:_vleft_image, top:0});
box_clone.css({top:0, left:0, width:width_box, height:height_box});
// next image
var box_clone_next = this.getboxclone();
box_clone_next.find('img').css({left:_vleft_image, top:0});
box_clone_next.css({top:0, left:-width_box, width:width_box, height:height_box});
// container box images
var box_clone_container = this.getboxclone();
box_clone_container.html('').append(box_clone).append(box_clone_next);
box_clone_container.css({top:0, left:_ileftc, width:width_box, height:height_box});
// add containuer
this.addboxclone(box_clone_container);
// show boxes
box_clone_container.show();
box_clone.show();
box_clone_next.show();
// callback
var callback = (i == (total - 1)) ? function() { self.finishanimation(); } : '';
// animations
box_clone.delay(delay_time).animate({ left: width_box }, time_animate, easing);
box_clone_next.delay(delay_time).animate({ left:0 }, time_animate, easing, callback);
}
},
animationswapblocks: function(options)
{
var self = this;
var options = $.extend({}, {easing_old: 'easeinoutquad', easing_new: 'easeoutquad'}, options || {});
this.settings.is_animating = true;
var easing_old = (this.settings.easing_default == '') ? options.easing_old : this.settings.easing_default;
var easing_new = (this.settings.easing_default == '') ? options.easing_new : this.settings.easing_default;
var time_animate = 800 / this.settings.velocity;
var image_old = this.getoldimage();
this.setactuallevel();
this.setlinkatual();
this.skitter_box.find('.image_main').attr({'src':this.getcurrentimage()});
this.skitter_box.find('.image_main').hide();
var total = 2;
var width_box = this.settings.width_skitter;
var height_box = math.ceil(this.settings.height_skitter / total);
// old image
var box_clone1 = this.getboxcloneimgold(image_old), box_clone2 = this.getboxcloneimgold(image_old);
box_clone1.find('img').css({left:0, top:0});
box_clone1.css({top:0, left:0, width:width_box, height:height_box});
box_clone2.find('img').css({left:0, top:-height_box});
box_clone2.css({top:height_box, left:0, width:width_box, height:height_box});
// next image
var box_clone_next1 = this.getboxclone(), box_clone_next2 = this.getboxclone();
box_clone_next1.find('img').css({left:0, top:height_box});
box_clone_next1.css({top:0, left:0, width:width_box, height:height_box});
box_clone_next2.find('img').css({left:0, top: -(height_box * total) });
box_clone_next2.css({top:height_box, left:0, width:width_box, height:height_box});
// add boxes
this.addboxclone(box_clone_next1);
this.addboxclone(box_clone_next2);
this.addboxclone(box_clone1);
this.addboxclone(box_clone2);
// show boxes
box_clone1.show();
box_clone2.show();
box_clone_next1.show();
box_clone_next2.show();
// callback
var callback = function() { self.finishanimation(); };
// animations
box_clone1.find('img').animate({ top: height_box }, time_animate, easing_old, function() {
box_clone1.remove();
});
box_clone2.find('img').animate({ top: -(height_box * total) }, time_animate, easing_old, function() {
box_clone2.remove();
});
box_clone_next1.find('img').animate({ top: 0 }, time_animate, easing_new);
box_clone_next2.find('img').animate({ top: -height_box }, time_animate, easing_new, callback);
},
animationcut: function(options)
{
var self = this;
var options = $.extend({}, {easing_old: 'easeinoutexpo', easing_new: 'easeinoutexpo'}, options || {});
this.settings.is_animating = true;
var easing_old = (this.settings.easing_default == '') ? options.easing_old : this.settings.easing_default;
var easing_new = (this.settings.easing_default == '') ? options.easing_new : this.settings.easing_default;
var time_animate = 900 / this.settings.velocity;
var image_old = this.getoldimage();
this.setactuallevel();
this.setlinkatual();
this.skitter_box.find('.image_main').attr({'src':this.getcurrentimage()});
this.skitter_box.find('.image_main').hide();
var total = 2;
var width_box = this.settings.width_skitter;
var height_box = math.ceil(this.settings.height_skitter / total);
// old image
var box_clone1 = this.getboxcloneimgold(image_old), box_clone2 = this.getboxcloneimgold(image_old);
box_clone1.find('img').css({left:0, top:0});
box_clone1.css({top:0, left:0, width:width_box, height:height_box});
box_clone2.find('img').css({left:0, top:-height_box});
box_clone2.css({top:height_box, left:0, width:width_box, height:height_box});
// next image
var box_clone_next1 = this.getboxclone(), box_clone_next2 = this.getboxclone();
//box_clone_next1.find('img').css({left:0, top:height_box});
box_clone_next1.find('img').css({left:0, top:0});
box_clone_next1.css({top:0, left:width_box, width:width_box, height:height_box});
//box_clone_next2.find('img').css({left:0, top: -(height_box * total) });
box_clone_next2.find('img').css({left:0, top: -height_box });
box_clone_next2.css({top:height_box, left:-width_box, width:width_box, height:height_box});
// add boxes
this.addboxclone(box_clone_next1);
this.addboxclone(box_clone_next2);
this.addboxclone(box_clone1);
this.addboxclone(box_clone2);
// show boxes
box_clone1.show();
box_clone2.show();
box_clone_next1.show();
box_clone_next2.show();
// callback
var callback = function() { self.finishanimation(); };
// animations
box_clone1.animate({ left: -width_box }, time_animate, easing_old, function() {
box_clone1.remove();
});
box_clone2.animate({ left: width_box }, time_animate, easing_old, function() {
box_clone2.remove();
});
box_clone_next1.animate({ left: 0 }, time_animate, easing_new);
box_clone_next2.animate({ left: 0 }, time_animate, easing_new, callback);
},
// end animations ----------------------
// finish animation
finishanimation: function (options)
{
var self = this;
this.skitter_box.find('.image_main').show();
this.showboxtext();
this.settings.is_animating = false;
this.skitter_box.find('.image_main').attr({'src': this.getcurrentimage()});
this.skitter_box.find('.image > a').attr({'href': this.settings.link_atual});
if (!this.settings.is_hover_skitter_box && !this.settings.is_paused && !this.settings.is_blur) {
this.timer = settimeout(function() { self.completemove(); }, this.settings.interval);
}
self.starttime();
},
// complete move
completemove: function ()
{
this.cleartimer(true);
this.skitter_box.find('.box_clone').remove();
if (!this.settings.is_paused && !this.settings.is_blur) this.nextimage();
},
// actual config for animation
setactuallevel: function() {
if ($.isfunction(this.settings.imageswitched)) this.settings.imageswitched(this.settings.image_i, this);
this.setimagelink();
this.addclassnumber();
this.hideboxtext();
this.increasingimage();
},
// set image and link
setimagelink: function()
{
var name_image = this.settings.images_links[this.settings.image_i][0];
var link_image = this.settings.images_links[this.settings.image_i][1];
var label_image = this.settings.images_links[this.settings.image_i][3];
var target_link = this.settings.images_links[this.settings.image_i][4];
this.settings.image_atual = name_image;
this.settings.link_atual = link_image;
this.settings.label_atual = label_image;
this.settings.target_atual = target_link;
},
// add class for number
addclassnumber: function ()
{
var self = this;
this.skitter_box.find('.image_number_select').removeclass('image_number_select');
$('#image_n_'+(this.settings.image_i+1)+'_'+self.number_skitter).addclass('image_number_select');
},
// increment image_i
increasingimage: function()
{
this.settings.image_i++;
if (this.settings.image_i == this.settings.images_links.length) {
this.settings.image_i = 0;
}
},
// get box clone
getboxclone: function()
{
if (this.settings.link_atual != '#') {
var img_clone = $('');
img_clone.attr({ 'target': this.settings.target_atual });
}
else {
var img_clone = $('');
}
img_clone = this.resizeimage(img_clone);
var box_clone = $('');
box_clone.append(img_clone);
return box_clone;
},
// get box clone
getboxcloneimgold: function(image_old)
{
if (this.settings.link_atual != '#') {
var img_clone = $('');
img_clone.attr({ 'target': this.settings.target_atual });
}
else {
var img_clone = $('');
}
img_clone = this.resizeimage(img_clone);
var box_clone = $('');
box_clone.append(img_clone);
return box_clone;
},
// redimensiona imagem
resizeimage: function(img_clone)
{
img_clone.find('img').width(this.settings.width_skitter);
img_clone.find('img').height(this.settings.height_skitter);
return img_clone;
},
// add box clone in skitter_box
addboxclone: function(box_clone)
{
this.skitter_box.find('.container_skitter').append(box_clone);
},
// get accepts easing
geteasing: function(easing)
{
var easing_accepts = [
'easeinquad', 'easeoutquad', 'easeinoutquad',
'easeincubic', 'easeoutcubic', 'easeinoutcubic',
'easeinquart', 'easeoutquart', 'easeinoutquart',
'easeinquint', 'easeoutquint', 'easeinoutquint',
'easeinsine', 'easeoutsine', 'easeinoutsine',
'easeinexpo', 'easeoutexpo', 'easeinoutexpo',
'easeincirc', 'easeoutcirc', 'easeinoutcirc',
'easeinelastic', 'easeoutelastic', 'easeinoutelastic',
'easeinback', 'easeoutback', 'easeinoutback',
'easeinbounce', 'easeoutbounce', 'easeinoutbounce',
];
if (jquery.inarray(easing, easing_accepts) > 0) {
return easing;
}
else {
return '';
}
},
// get random number
getrandom: function (i)
{
return math.floor(math.random() * i);
},
// set value for text
setvalueboxtext: function ()
{
this.skitter_box.find('.label_skitter').html(this.settings.label_atual);
},
// show box text
showboxtext: function ()
{
var self = this;
if ( this.settings.label_atual != undefined && this.settings.label_atual != '' && self.settings.label ) {
switch ( self.settings.label_animation ) {
case 'slideup' : default :
self.skitter_box.find('.label_skitter').slidedown(400);
break;
case 'left' : case 'right' :
self.skitter_box.find('.label_skitter').animate({ left: 0 }, 400, 'easeinoutquad');
break;
case 'fixed' :
// null
break;
}
}
},
// hide box text
hideboxtext: function ()
{
var self = this;
switch ( self.settings.label_animation ) {
case 'slideup' : default :
this.skitter_box.find('.label_skitter').slideup(200, function() {
self.setvalueboxtext();
});
break;
case 'left' : case 'right' :
var _left = ( self.settings.label_animation == 'left' ) ? -(self.skitter_box.find('.label_skitter').outerwidth()) : (self.skitter_box.find('.label_skitter').outerwidth());
self.skitter_box.find('.label_skitter').animate({ left: _left }, 400, 'easeinoutquad', function() {
self.setvalueboxtext();
});
break;
case 'fixed' :
self.setvalueboxtext();
break;
}
},
// stop time to get over skitter_box
stoponmouseover: function ()
{
var self = this;
if ( self.settings.stop_over )
{
self.skitter_box.hover(function() {
if (self.settings.stop_over) self.settings.is_hover_skitter_box = true;
if (!self.settings.is_paused_time) {
self.pausetime();
}
self.sethidetools('hover');
self.cleartimer(true);
}, function() {
if (self.settings.stop_over) self.settings.is_hover_skitter_box = false;
if (self.settings.elapsedtime == 0 && !self.settings.is_animating && !self.settings.is_paused) {
self.starttime();
}
else if (!self.settings.is_paused) {
self.resumetime();
}
self.sethidetools('out');
self.cleartimer(true);
if (!self.settings.is_animating && self.settings.images_links.length > 1) {
self.timer = settimeout(function() { self.completemove(); }, self.settings.interval - self.settings.elapsedtime);
self.skitter_box.find('.image_main').attr({'src': self.getcurrentimage()});
self.skitter_box.find('.image > a').attr({'href': self.settings.link_atual});
}
});
}
else
{
self.skitter_box.hover(function() {
self.sethidetools('hover');
}, function() {
self.sethidetools('out');
});
}
},
// hover/out hidetools
sethidetools: function( type ) {
var self = this;
var opacity_elements = self.settings.opacity_elements;
var interval_in_elements = self.settings.interval_in_elements;
var interval_out_elements = self.settings.interval_out_elements;
if ( type == 'hover' ) {
if (self.settings.hide_tools) {
if (self.settings.numbers) {
self.skitter_box
.find('.info_slide')
.show()
.css({opacity:0})
.animate({opacity: opacity_elements}, interval_in_elements);
}
if (self.settings.navigation) {
self.skitter_box
.find('.prev_button, .next_button')
.show()
.css({opacity:0})
.animate({opacity: opacity_elements}, interval_in_elements);
}
if (self.settings.focus && !self.settings.foucs_active) {
self.skitter_box
.find('.focus_button')
.stop()
.show().css({opacity:0})
.animate({opacity:opacity_elements}, interval_in_elements);
}
if (self.settings.controls) {
self.skitter_box
.find('.play_pause_button')
.stop()
.show().css({opacity:0})
.animate({opacity:opacity_elements}, interval_in_elements);
}
}
if (self.settings.focus && !self.settings.foucs_active && !self.settings.hide_tools) {
self.skitter_box
.find('.focus_button')
.stop()
.animate({opacity:1}, interval_in_elements);
}
if (self.settings.controls && !self.settings.hide_tools) {
self.skitter_box
.find('.play_pause_button')
.stop()
.animate({opacity:1}, interval_in_elements);
}
}
else {
if (self.settings.hide_tools) {
if (self.settings.numbers) {
self.skitter_box
.find('.info_slide')
.queue("fx", [])
.show()
.css({opacity: opacity_elements})
.animate({opacity:0}, interval_out_elements);
}
if (self.settings.navigation) {
self.skitter_box
.find('.prev_button, .next_button')
.queue("fx", [])
.show()
.css({opacity: opacity_elements})
.animate({opacity:0}, interval_out_elements);
}
if (self.settings.focus && !self.settings.foucs_active) {
self.skitter_box
.find('.focus_button')
.stop()
.css({opacity: opacity_elements})
.animate({opacity:0}, interval_out_elements);
}
if (self.settings.controls) {
self.skitter_box
.find('.play_pause_button')
.stop()
.css({opacity: opacity_elements})
.animate({opacity:0}, interval_out_elements);
}
}
if (self.settings.focus && !self.settings.foucs_active && !self.settings.hide_tools) {
self.skitter_box
.find('.focus_button')
.stop()
.animate({opacity:0.3}, interval_out_elements);
}
if (self.settings.controls && !self.settings.hide_tools) {
self.skitter_box
.find('.play_pause_button')
.stop()
.animate({opacity:0.3}, interval_out_elements);
}
}
},
// stop timer
cleartimer: function (force) {
var self = this;
clearinterval(self.timer);
},
// set link atual
setlinkatual: function() {
if (this.settings.link_atual != '#' && this.settings.link_atual != '') {
this.skitter_box.find('.image > a').attr({'href': this.settings.link_atual, 'target': this.settings.target_atual});
}
else {
this.skitter_box.find('.image > a').removeattr('href');
}
},
// hide tools
hidetools: function() {
this.skitter_box.find('.info_slide').fadeto(0, 0);
this.skitter_box.find('.prev_button').fadeto(0, 0);
this.skitter_box.find('.next_button').fadeto(0, 0);
this.skitter_box.find('.focus_button').fadeto(0, 0);
this.skitter_box.find('.play_pause_button').fadeto(0, 0);
},
// focus skitter
focusskitter: function() {
var self = this;
var focus_button = $('focus');
self.skitter_box.append(focus_button);
focus_button
.animate({opacity:0.3}, self.settings.interval_in_elements);
$(document).keypress(function(e) {
var code = (e.keycode ? e.keycode : e.which);
if (code == 27) $('#overlay_skitter').trigger('click');
});
var _top = self.skitter_box.offset().top;
var _left = self.skitter_box.offset().left;
self.skitter_box.find('.focus_button').click(function() {
if ( self.settings.foucs_active ) return false;
self.settings.foucs_active = true;
$(this).stop().animate({opacity:0}, self.settings.interval_out_elements);
var div = $('')
.height( $(document).height() )
.hide()
.fadeto(self.settings.interval_in_elements, 0.98);
var _topfinal = (($(window).height() - self.skitter_box.height()) / 2) + $(document).scrolltop();
var _leftfinal = ($(window).width() - self.skitter_box.width()) / 2;
self.skitter_box.before('');
$('body').prepend(div);
$('body').prepend(self.skitter_box);
self.skitter_box
.css({'top':_top, 'left':_left, 'position':'absolute', 'z-index':9999})
.animate({'top':_topfinal, 'left':_leftfinal}, 2000, 'easeoutexpo');
$('#mark_position')
.width(self.skitter_box.width())
.height(self.skitter_box.height())
.css({'background':'none'})
.fadeto(300,0.3);
return false;
});
$(document).on('click', '#overlay_skitter', function() {
if ( $(this).hasclass('finish_overlay_skitter') ) return false;
self.settings.foucs_active = false;
$(this).addclass('finish_overlay_skitter');
if (!self.settings.hide_tools) self.skitter_box.find('.focus_button').animate({opacity:0.3}, 200);
self.skitter_box
.stop()
.animate({'top':_top, 'left':_left}, 200, 'easeoutexpo', function() {
$('#mark_position').before(self.skitter_box);
$(this).css({'position':'relative', 'top':0, 'left': 0});
$('#mark_position').remove();
});
$('#overlay_skitter').fadeto(self.settings.interval_out_elements, 0, function() {
$(this).remove();
});
return false;
});
},
/**
* controls: play and stop
*/
setcontrols: function() {
var self = this;
var play_pause_button = $('pause');
self.skitter_box.append(play_pause_button);
play_pause_button
.animate({opacity:0.3}, self.settings.interval_in_elements);
play_pause_button.click(function() {
if (!self.settings.is_paused) {
$(this).html('play');
$(this).fadeto(100, 0.5).fadeto(100, 1);
$(this).addclass('play_button');
self.pausetime();
self.settings.is_paused = true;
self.cleartimer(true);
}
else {
if (!self.settings.is_animating && !self.skitter_box.find('.progressbar').is(':visible')) {
self.settings.elapsedtime = 0;
}
else {
self.resumetime();
}
if (!self.settings.progressbar) self.resumetime();
self.settings.is_paused = false;
$(this).html('pause');
$(this).fadeto(100, 0.5).fadeto(100, 1);
$(this).removeclass('play_button');
if (!self.settings.stop_over) {
self.cleartimer(true);
if (!self.settings.is_animating && self.settings.images_links.length > 1) {
self.timer = settimeout(function() { self.completemove(); }, self.settings.interval - self.settings.elapsedtime);
self.skitter_box.find('.image_main').attr({'src': self.getcurrentimage()});
self.skitter_box.find('.image > a').attr({'href': self.settings.link_atual});
}
}
}
return false;
});
},
/**
* object size
*/
objectsize: function(obj) {
var size = 0, key;
for (key in obj) { if (obj.hasownproperty(key)) size++; }
return size;
},
/**
* add progress bar
*/
addprogressbar: function() {
var self = this;
var progressbar = $('');
self.skitter_box.append(progressbar);
if (self.objectsize(self.settings.progressbar_css) == 0) {
if (parseint(progressbar.css('width')) > 0) {
self.settings.progressbar_css.width = parseint(progressbar.css('width'));
}
else {
self.settings.progressbar_css = {width: self.settings.width_skitter, height:5};
}
}
if (self.objectsize(self.settings.progressbar_css) > 0 && self.settings.progressbar_css.width == undefined) {
self.settings.progressbar_css.width = self.settings.width_skitter;
}
progressbar.css(self.settings.progressbar_css).hide();
},
/**
* start progress bar
*/
startprogressbar: function() {
var self = this;
if (self.settings.is_hover_skitter_box || self.settings.is_paused || self.settings.is_blur || !self.settings.progressbar) return false;
self.skitter_box.find('.progressbar')
.hide()
.dequeue()
.width(self.settings.progressbar_css.width)
.animate({width:'show'}, self.settings.interval, 'linear');
},
/**
* pause progress bar
*/
pauseprogressbar: function() {
var self = this;
if (!self.settings.is_animating) {
self.skitter_box.find('.progressbar').stop();
}
},
/**
* resume progress bar
*/
resumeprogressbar: function() {
var self = this;
if (self.settings.is_hover_skitter_box || self.settings.is_paused || !self.settings.progressbar) return false;
self.skitter_box.find('.progressbar').dequeue().animate({width: self.settings.progressbar_css.width}, (self.settings.interval - self.settings.elapsedtime), 'linear');
},
/**
* hide progress bar
*/
hideprogressbar: function() {
var self = this;
if (!self.settings.progressbar) return false;
self.skitter_box.find('.progressbar').stop().fadeout(300, function() {
$(this).width(self.settings.progressbar_css.width);
});
},
/**
* start time
*/
starttime: function() {
var self = this;
self.settings.is_paused_time = false;
var date = new date();
self.settings.elapsedtime = 0;
self.settings.time_start = date.gettime();
// start progress bar
self.startprogressbar();
},
/**
* pause time
*/
pausetime: function() {
var self = this;
if (self.settings.is_paused_time) return false;
self.settings.is_paused_time = true;
var date = new date();
self.settings.elapsedtime += date.gettime() - self.settings.time_start;
// pause progress bar
self.pauseprogressbar();
},
/**
* resume time
*/
resumetime: function() {
var self = this;
self.settings.is_paused_time = false;
var date = new date();
self.settings.time_start = date.gettime();
// resume progress bar
self.resumeprogressbar();
},
/**
* enable navigation keys
*/
enablenavigationkeys: function() {
var self = this;
$(window).keydown(function(e) {
// next
if (e.keycode == 39 || e.keycode == 40) {
self.skitter_box.find('.next_button').trigger('click');
}
// prev
else if (e.keycode == 37 || e.keycode == 38) {
self.skitter_box.find('.prev_button').trigger('click');
}
});
},
/**
* get box clone with background image
*/
getboxclonebackground: function(options)
{
var box_clone = $('');
var background_size = this.settings.width_skitter + 'px ' + this.settings.height_skitter + 'px';
box_clone.css({
'left': options.left,
'top': options.top,
'width': options.width,
'height': options.height,
'background-image': 'url('+options.image+')',
'background-size': background_size,
'background-position': options.position.left+'px '+options.position.top+'px'
});
return box_clone;
},
/**
* shuffle array
* @author daniel castro machado
*/
shufflearray: function (arrayorigem) {
var self = this;
var arraydestino = [];
var indice;
while (arrayorigem.length > 0) {
indice = self.randomunique(0, arrayorigem.length - 1);
arraydestino[arraydestino.length] = arrayorigem[indice];
arrayorigem.splice(indice, 1);
}
return arraydestino;
},
/**
* gera números aleatórios inteiros entre um intervalo
* @author daniel castro machado
*/
randomunique: function (valorini, valorfim) {
var numrandom;
do numrandom = math.random(); while (numrandom == 1); // evita gerar o número valorfim + 1
return (numrandom * (valorfim - valorini + 1) + valorini) | 0;
},
/**
* stop on window focus out
* @author dan partac (http://thiagosf.net/projects/jquery/skitter/#comment-355473307)
*/
windowfocusout: function () {
var self = this;
$(window).bind('blur', function(){
self.settings.is_blur = true;
self.pausetime();
self.cleartimer(true);
});
$(window).bind('focus', function(){
if ( self.settings.images_links.length > 1 ) {
self.settings.is_blur = false;
if (self.settings.elapsedtime == 0) {
self.starttime();
}
else {
self.resumetime();
}
if (self.settings.elapsedtime <= self.settings.interval) {
self.cleartimer(true); // fix bug ie: double next
self.timer = settimeout(function() { self.completemove(); }, self.settings.interval - self.settings.elapsedtime);
self.skitter_box.find('.image_main').attr({'src': self.getcurrentimage()});
self.skitter_box.find('.image > a').attr({'href': self.settings.link_atual});
}
}
});
},
/**
* responsive
*/
setresponsive: function() {
if (this.settings.responsive) {
var self = this;
var timeout = null;
$(window).on('resize', function() {
cleartimeout(timeout);
timeout = settimeout(function() {
self.setdimensions();
}, 200);
}).trigger('resize');
}
},
/**
* set skitter dimensions
*/
setdimensions: function() {
var self = this;
var was_set = false;
this.skitter_box.css('width', '100%');
this.skitter_box.find('.image_main')
.attr({ src: this.getcurrentimage() })
.css({ 'width': '100%', 'height': 'auto' })
.on('load', function() {
if (!was_set) {
was_set = true;
_setdimensions();
}
});
// fallback
settimeout(function() {
if (!was_set) {
was_set = true;
_setdimensions();
}
}, 3000);
var _setdimensions = function() {
var image = self.skitter_box.find('.image_main');
var width_box = self.skitter_box.width();
var height_box = self.skitter_box.height();
var width_image = image.width();
var height_image = image.height();
var width = width_box;
var height = (height_image * width_box) / width_image;
if (self.settings.fullscreen) {
width = $(window).width();
height = $(window).height();
}
self.settings.width_skitter = width;
self.settings.height_skitter = height;
self.skitter_box
.width(width)
.height(height)
.find('.container_skitter')
.width(width)
.height(height)
.find('> a img, > img')
.width(width)
.height(height);
};
},
/**
* check is large device
*/
islargedevice: function() {
return $(window).width() >= 1024;
},
/**
* max width splits (responsive friendly)
*/
getmaxw: function(max_w) {
// 8 == 1024px
// x == 768px
// y == 480px
// z == 320px
if (this.settings.responsive) {
var window_width = $(window).width();
if (window_width <= 320) {
max_w = parseint(max_w / 4);
} else if (window_width <= 480) {
max_w = parseint(max_w / 3);
} else if (window_width <= 768) {
max_w = parseint(max_w / 1.5);
}
}
return max_w;
},
/**
* max height splits (responsive friendly)
*/
getmaxh: function(max_h) {
return this.getmaxw(max_h);
},
/**
* get current image
*/
getcurrentimage: function() {
var image = this.settings.image_atual;
return this.getimagename(image);
},
/**
* get old image
*/
getoldimage: function() {
var image = this.skitter_box.find('.image_main').attr('src');
return image;
},
/**
* get image name for responsive (if enabled)
*/
getimagename: function(image) {
var window_width = $(window).width();
if (this.settings.responsive) {
for (var name in this.settings.responsive) {
var item = this.settings.responsive[name];
if (window_width < item.max_width && item.suffix) {
var extension = image.split('.').reverse()[0];
image = image.replace('.' + extension, item.suffix + '.' + extension);
break;
}
}
}
return image;
},
/**
* touches support
*/
settouchsupport: function() {
var self = this;
var last_position_x = 0;
var last_position_x_move = 0;
var istouch = (('ontouchstart' in window) || (navigator.msmaxtouchpoints > 0));
if (istouch) {
this.skitter_box.on('touchstart', function(e) {
if (e.originalevent.touches.length > 0) {
last_position_x = e.originalevent.touches[0].pagex;
}
});
this.skitter_box.on('touchmove', function(e) {
if (e.originalevent.touches.length > 0) {
last_position_x_move = e.originalevent.touches[0].pagex;
}
});
this.skitter_box.on('touchend', function(e) {
if (last_position_x < last_position_x_move) {
self.skitter_box.find('.prev_button').trigger('click');
} else {
self.skitter_box.find('.next_button').trigger('click');
}
});
}
},
/**
* get available animations (public api)
*/
getanimations: function() {
return this.animations;
},
/**
* set animation (public api)
*/
setanimation: function(animation) {
this.settings.animation = animation;
},
/**
* next (public api)
*/
next: function() {
this.skitter_box.find('.next_button').trigger('click');
},
/**
* prev (public api)
*/
prev: function() {
this.skitter_box.find('.prev_button').trigger('click');
}
});
/**
* helper function for cross-browser css3 support, prepends
* all possible prefixes to all properties passed in
* @param {object} props ker/value pairs of css3 properties
*/
$.fn.skittercss3 = function(props) {
var css = {};
var prefixes = ['moz', 'ms', 'o', 'webkit'];
for(var prop in props) {
for(var i=0; i