1/** 2 * jQuery Skitter Slideshow 3 * @name jquery.skitter.js 4 * @description Slideshow 5 * @author Thiago Silva Ferreira - http://thiagosf.net 6 * @version 5.0.0 7 * @created August 04, 2010 8 * @updated June 25, 2016 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 var number_skitter = 0; 15 var skitters = []; 16 17 $.fn.skitter = function(options) { 18 if (typeof options == 'string') { 19 var current_skitter = skitters[$(this).data('skitter_number')]; 20 return current_skitter[arguments[0]].call(current_skitter, arguments[1]); 21 } else { 22 return this.each(function() { 23 if ( $(this).data('skitter_number') == undefined ) { 24 $(this).data('skitter_number', number_skitter); 25 skitters.push(new $sk(this, options, number_skitter)); 26 ++number_skitter; 27 } 28 }); 29 } 30 }; 31 32 var defaults = { 33 // Animation velocity 34 velocity: 1, 35 36 // Interval between transitions 37 interval:5000, 38 39 // Default animation 40 animation: '', 41 42 // Numbers display 43 numbers: false, 44 45 // Navigation display 46 navigation: true, 47 48 // Label display 49 label: false, 50 51 // Easing default 52 easing_default: '', 53 54 // The skitters box (internal) 55 skitter_box: null, 56 57 // @deprecated 58 time_interval: null, 59 60 // Image link (internal) 61 images_links: null, 62 63 // Actual image (internal) 64 image_atual: null, 65 66 // Actual link (internal) 67 link_atual: null, 68 69 // Actual label (internal) 70 label_atual: null, 71 72 // Actual target (internal) 73 target_atual: '_self', 74 75 // Skitter width (internal) 76 width_skitter: null, 77 78 // Skitter height (internal) 79 height_skitter: null, 80 81 // Image number loop (internal) 82 image_i: 1, 83 84 // Is animating (internal) 85 is_animating: false, 86 87 // Is hover skitter_box (internal) 88 is_hover_skitter_box: false, 89 90 // Smart randomly (internal) 91 random_ia: null, 92 93 // Randomly sliders 94 show_randomly: false, 95 96 // Navigation with thumbs 97 thumbs: false, 98 99 // Hide numbers and navigation 100 hide_tools: false, 101 102 // Fullscreen mode 103 fullscreen: false, 104 105 // Loading data from XML file 106 xml: false, 107 108 // Navigation with dots 109 dots: true, 110 111 // Final opacity of elements in hide_tools 112 opacity_elements: 0.75, 113 114 // Interval animation hover elements hide_tools 115 interval_in_elements: 200, 116 117 // Interval animation out elements hide_tools 118 interval_out_elements: 300, 119 120 // Onload Callback 121 onLoad: null, 122 123 // Function call to change image 124 imageSwitched: null, 125 126 // @deprecated 127 max_number_height: 20, 128 129 // Alignment of numbers/dots/thumbs 130 numbers_align: 'center', 131 132 // Preview with dots 133 preview: false, 134 135 // Focus slideshow 136 focus: false, 137 138 // Focus active (internal) 139 foucs_active: false, 140 141 // Option play/pause manually 142 controls: false, 143 144 // Displays progress bar 145 progressbar: false, 146 147 // CSS progress bar 148 progressbar_css: {}, 149 150 // Is paused (internal) 151 is_paused: false, 152 153 // Is blur (internal) 154 is_blur: false, 155 156 // Is paused time (internal) 157 is_paused_time: false, 158 159 // Time start (internal) 160 time_start: 0, 161 162 // Elapsed time (internal) 163 elapsedTime: 0, 164 165 // Stop animation to move mouse over it. 166 stop_over: true, 167 168 // Enable navigation keys 169 enable_navigation_keys: false, 170 171 // Specific animations 172 with_animations: [], 173 174 // Function call to go over the navigation buttons 175 // mouseOverButton: function() { $(this).stop().animate({opacity:0.5}, 200); }, 176 mouseOverButton: null, 177 178 // Function call to go out the navigation buttons 179 // mouseOutButton: function() { $(this).stop().animate({opacity:1}, 200); }, 180 mouseOutButton: null, 181 182 // Sets whether the slideshow will start automatically 183 auto_play: true, 184 185 // Label animation type 186 label_animation: 'slideUp', 187 188 // Theme 189 theme: null, 190 191 // Structure (internal) 192 structure: '<a href="#" class="prev_button">prev</a>' 193 + '<a href="#" class="next_button">next</a>' 194 + '<span class="info_slide"></span>' 195 + '<div class="container_skitter">' 196 + '<div class="image">' 197 + '<a href=""><img class="image_main" /></a>' 198 + '<div class="label_skitter"></div>' 199 + '</div>' 200 + '</div>', 201 202 // Responsive 203 // Example: 204 // responsive: { 205 // small: { 206 // animation: 'fade', 207 // max_width: 768, 208 // suffix: '-small' 209 // }, 210 // medium: { 211 // animation: 'fadeFour', 212 // max_width: 1024, 213 // suffix: '-medium' 214 // } 215 // } 216 responsive: { 217 small: { 218 animation: 'fade', 219 max_width: 768 220 }, 221 medium: { 222 max_width: 1024 223 } 224 } 225 }; 226 227 $.skitter = function(obj, options, number) { 228 this.skitter_box = $(obj); 229 this.timer = null; 230 this.settings = $.extend({}, defaults, options || {}); 231 this.number_skitter = number; 232 this.setup(); 233 }; 234 235 // Shortcut 236 var $sk = $.skitter; 237 238 $sk.fn = $sk.prototype = {}; 239 240 $sk.fn.extend = $.extend; 241 242 $sk.fn.extend({ 243 // Available animations 244 animations: [ 245 'cube', 246 'cubeRandom', 247 'block', 248 'cubeStop', 249 'cubeStopRandom', 250 'cubeHide', 251 'cubeSize', 252 'horizontal', 253 'showBars', 254 'showBarsRandom', 255 'tube', 256 'fade', 257 'fadeFour', 258 'paralell', 259 'blind', 260 'blindHeight', 261 'blindWidth', 262 'directionTop', 263 'directionBottom', 264 'directionRight', 265 'directionLeft', 266 'cubeSpread', 267 'glassCube', 268 'glassBlock', 269 'circles', 270 'circlesInside', 271 'circlesRotate', 272 'cubeShow', 273 'upBars', 274 'downBars', 275 'hideBars',
276 'swapBars', 277 'swapBarsBack', 278 'swapBlocks', 279 'cut' 280 ], 281 282 /** 283 * Init 284 */ 285 setup: function() 286 { 287 var self = this; 288 289 // Fullscreen 290 if (this.settings.fullscreen) { 291 var width = $(window).width(); 292 var height = $(window).height(); 293 this.skitter_box.width(width).height(height); 294 this.skitter_box.css({'position':'absolute', 'top':0, 'left':0, 'z-index':1000}); 295 this.settings.stop_over = false; 296 $('body').css({'overflown':'hidden'}); 297 } 298 299 this.settings.width_skitter = parseFloat(this.skitter_box.css('width')); 300 this.settings.height_skitter = parseFloat(this.skitter_box.css('height')); 301 302 this.settings.original_width_skitter = this.settings.width_skitter; 303 this.settings.original_height_skitter = this.settings.height_skitter; 304 305 if (!this.settings.width_skitter || !this.settings.height_skitter) { 306 console.warn('Width or height size is null! - Skitter Slideshow'); 307 return false; 308 } 309 310 // Theme 311 if ( this.settings.theme ) { 312 this.skitter_box.addClass('skitter-' + this.settings.theme); 313 } 314 315 // Structure html 316 this.skitter_box.append(this.settings.structure); 317 318 // Settings 319 this.settings.easing_default = this.getEasing(this.settings.easing); 320 321 if (this.settings.velocity >= 2) this.settings.velocity = 1.3; 322 if (this.settings.velocity <= 0) this.settings.velocity = 1; 323 324 this.skitter_box.find('.info_slide').hide(); 325 this.skitter_box.find('.label_skitter').hide(); 326 this.skitter_box.find('.prev_button').hide(); 327 this.skitter_box.find('.next_button').hide(); 328 329 this.skitter_box.find('.container_skitter').width(this.settings.width_skitter); 330 this.skitter_box.find('.container_skitter').height(this.settings.height_skitter); 331 332 var initial_select_class = ' image_number_select', u = 0; 333 this.settings.images_links = []; 334 335 // Add image, link, animation type and label 336 var addImageLink = function (link, src, animation_type, label, target) { 337 self.settings.images_links.push([src, link, animation_type, label, target]); 338 if (self.settings.thumbs) { 339 var dimension_thumb = ''; 340 if (self.settings.width_skitter > self.settings.height_skitter) { 341 dimension_thumb = 'height="100"'; 342 } 343 else { 344 dimension_thumb = 'width="100"'; 345 } 346 self.skitter_box.find('.info_slide').append( 347 '<span class="image_number'+initial_select_class+'" rel="'+(u - 1)+'" id="image_n_'+u+'_'+self.number_skitter+'" style="background-image: url(' + src + ');"></span> ' 348 ); 349 } 350 else { 351 self.skitter_box.find('.info_slide').append( 352 '<span class="image_number'+initial_select_class+'" rel="'+(u - 1)+'" id="image_n_'+u+'_'+self.number_skitter+'">'+u+'</span> ' 353 ); 354 } 355 initial_select_class = ''; 356 }; 357 358 // Load from XML 359 if (this.settings.xml) { 360 $.ajax({ 361 type: 'GET', 362 url: this.settings.xml, 363 async: false, 364 dataType: 'xml', 365 success: function(xml) { 366 var ul = $('<ul></ul>'); 367 $(xml).find('skitter slide').each(function(){ 368 ++u; 369 var link = ($(this).find('link').text()) ? $(this).find('link').text() : '#'; 370 var src = $(this).find('image').text(); 371 var animation_type = $(this).find('image').attr('type'); 372 var label = $(this).find('label').text(); 373 var target = ($(this).find('target').text()) ? $(this).find('target').text() : '_self'; 374 addImageLink(link, src, animation_type, label, target); 375 }); 376 } 377 }); 378 } 379 // Load from json 380 else if (this.settings.json) { 381 382 } 383 // Load from HTML 384 else { 385 this.skitter_box.find('ul li').each(function(){ 386 ++u; 387 var link = ($(this).find('a').length) ? $(this).find('a').attr('href') : '#'; 388 var src = $(this).find('img').attr('src'); 389 var animation_type = $(this).find('img').attr('class'); 390 var label = $(this).find('.label_text').html(); 391 var target = ($(this).find('a').length && $(this).find('a').attr('target')) ? $(this).find('a').attr('target') : '_self'; 392 addImageLink(link, src, animation_type, label, target); 393 }); 394 } 395 396 // Thumbs 397 if (self.settings.thumbs && !self.settings.fullscreen) 398 { 399 self.skitter_box.find('.info_slide').addClass('info_slide_thumb'); 400 var width_info_slide = (u + 1) * self.skitter_box.find('.info_slide_thumb .image_number').width(); 401 self.skitter_box.find('.info_slide_thumb').width(width_info_slide); 402 self.skitter_box.css({height:self.skitter_box.height() + self.skitter_box.find('.info_slide').height()}); 403 404 self.skitter_box.append('<div class="container_thumbs"></div>'); 405 var copy_info_slide = self.skitter_box.find('.info_slide').clone(); 406 self.skitter_box.find('.info_slide').remove(); 407 self.skitter_box.find('.container_thumbs') 408 .width(self.settings.width_skitter) 409 .append(copy_info_slide); 410 411 // Scrolling with mouse movement 412 var width_image = 0, 413 width_skitter = this.settings.width_skitter, 414 height_skitter = this.settings.height_skitter, 415 w_info_slide_thumb = 0, 416 info_slide_thumb = self.skitter_box.find('.info_slide_thumb'), 417 x_value = 0, 418 y_value = self.skitter_box.offset().top; 419 420 info_slide_thumb.find('.image_number').each(function(){ 421 width_image += $(this).outerWidth(); 422 }); 423 424 info_slide_thumb.width(width_image+'px'); 425 w_info_slide_thumb = info_slide_thumb.width(); 426 width_value = this.settings.width_skitter; 427 428 width_value = width_skitter - 100; 429 430 if (width_info_slide > self.settings.width_skitter) { 431 self.skitter_box.mousemove(function(e){ 432 x_value = self.skitter_box.offset().left + 90; 433
434 var x = e.pageX, y = e.pageY, new_x = 0; 435 436 x = x - x_value; 437 y = y - y_value; 438 novo_width = w_info_slide_thumb - width_value; 439 new_x = -((novo_width * x) / width_value); 440 441 if (new_x > 0) new_x = 0; 442 if (new_x < -(w_info_slide_thumb - width_skitter)) new_x = -(w_info_slide_thumb - width_skitter); 443 444 if (y > height_skitter) { 445 info_slide_thumb.css({left: new_x}); 446 } 447 }); 448 } 449 450 self.skitter_box.find('.scroll_thumbs').css({'left':10}); 451 452 if (width_info_slide < self.settings.width_skitter) { 453 self.skitter_box.find('.info_slide').width('auto'); 454 self.skitter_box.find('.box_scroll_thumbs').hide(); 455 456 var class_info = '.info_slide'; 457 switch (self.settings.numbers_align) { 458 case 'center' : 459 var _vleft = (self.settings.width_skitter - self.skitter_box.find(class_info).width()) / 2; 460 self.skitter_box.find(class_info).css({'left': '50%', 'transform': 'translateX(-50%)'}); 461 break; 462 463 case 'right' : 464 self.skitter_box.find(class_info).css({'left':'auto', 'right':'-5px'}); 465 break; 466 467 case 'left' : 468 self.skitter_box.find(class_info).css({'left':'0px'}); 469 break; 470 } 471 } 472 473 } 474 else 475 { 476 var class_info = '.info_slide'; 477 478 if (self.settings.dots) { 479 self.skitter_box.find('.info_slide').addClass('info_slide_dots').removeClass('info_slide'); 480 class_info = '.info_slide_dots'; 481 } 482 483 switch (self.settings.numbers_align) { 484 case 'center' : 485 var _vleft = (self.settings.width_skitter - self.skitter_box.find(class_info).width()) / 2; 486 self.skitter_box.find(class_info).css({'left': '50%', 'transform': 'translateX(-50%)'}); 487 break; 488 489 case 'right' : 490 self.skitter_box.find(class_info).css({'left':'auto', 'right':'15px'}); 491 break; 492 493 case 'left' : 494 self.skitter_box.find(class_info).css({'left':'15px'}); 495 break; 496 } 497 498 if (!self.settings.dots) { 499 if (self.skitter_box.find('.info_slide').height() > 20) { 500 self.skitter_box.find('.info_slide').hide(); 501 } 502 } 503 } 504 505 this.skitter_box.find('ul').hide(); 506 507 if (this.settings.show_randomly) 508 this.settings.images_links.sort(function(a,b) {return Math.random() - 0.5;}); 509 510 this.settings.image_atual = this.settings.images_links[0][0]; 511 this.settings.link_atual = this.settings.images_links[0][1]; 512 this.settings.label_atual = this.settings.images_links[0][3]; 513 this.settings.target_atual = this.settings.images_links[0][4]; 514 515 if (this.settings.images_links.length > 1) 516 { 517 this.skitter_box.find('.prev_button').click(function() { 518 if (self.settings.is_animating == false) { 519 520 self.settings.image_i -= 2; 521 522 if (self.settings.image_i == -2) { 523 self.settings.image_i = self.settings.images_links.length - 2; 524 } 525 else if (self.settings.image_i == -1) { 526 self.settings.image_i = self.settings.images_links.length - 1; 527 } 528 529 self.jumpToImage(self.settings.image_i); 530 } 531 return false; 532 }); 533 534 this.skitter_box.find('.next_button').click(function() { 535 self.jumpToImage(self.settings.image_i); 536 return false; 537 }); 538 539 self.skitter_box.find('.next_button, .prev_button').bind('mouseover', self.settings.mouseOverButton); 540 self.skitter_box.find('.next_button, .prev_button').bind('mouseleave', self.settings.mouseOutButton); 541 542 this.skitter_box.find('.image_number').click(function(){ 543 if ($(this).attr('class') != 'image_number image_number_select') { 544 var imageNumber = parseInt($(this).attr('rel')); 545 self.jumpToImage(imageNumber); 546 } 547 return false;
548 }); 549 550 // Preview with dots 551 if (self.settings.preview && self.settings.dots) 552 { 553 var preview = $('<div class="preview_slide"><ul></ul></div>'); 554 555 for (var i = 0; i < this.settings.images_links.length; i++) { 556 var li = $('<li></li>'); 557 var img = $('<img />'); 558 img.attr('src', this.settings.images_links[i][0]); 559 li.append(img); 560 preview.find('ul').append(li); 561 } 562 563 var width_preview_ul = parseInt(this.settings.images_links.length * 100); 564 preview.find('ul').width(width_preview_ul); 565 $(class_info).append(preview); 566 567 self.skitter_box.find(class_info).find('.image_number').mouseenter(function() { 568 if (self.isLargeDevice()) { 569 var _left_info = parseFloat(self.skitter_box.find(class_info).offset().left); 570 var _left_image = parseFloat($(this).offset().left); 571 var _left_preview = (_left_image - _left_info) - 43; 572 573 var rel = parseInt($(this).attr('rel')); 574 var image_current_preview = self.skitter_box.find('.preview_slide_current img').attr('src'); 575 var _left_ul = -(rel * 100); 576 577 self.skitter_box.find('.preview_slide').find('ul').animate({left: _left_ul}, {duration:200, queue: false, easing: 'easeOutSine'}); 578 self.skitter_box.find('.preview_slide').fadeTo(1,1).animate({left: _left_preview}, {duration:200, queue: false}); 579 } 580 }); 581 582 self.skitter_box.find(class_info).mouseleave(function() { 583 if (self.isLargeDevice()) { 584 $('.preview_slide').animate({opacity: 'hide'}, {duration: 200, queue: false}); 585 } 586 }); 587 } 588 } 589 590 // Focus 591 if (self.settings.focus) { 592 self.focusSkitter(); 593 } 594 595 // Constrols 596 if (self.settings.controls) { 597 self.setControls(); 598 } 599 600 // Progressbar 601 if (self.settings.progressbar && self.settings.auto_play) { 602 self.addProgressBar(); 603 } 604 605 // hide_tools 606 if (self.settings.hide_tools) { 607 self.hideTools(); 608 } 609 610 // Navigation keys 611 if (self.settings.enable_navigation_keys) { 612 self.enableNavigationKeys(); 613 } 614 615 this.loadImages(); 616 617 this.setResponsive(); 618 this.setTouchSupport(); 619 }, 620 621 /** 622 * Load images 623 */ 624 loadImages: function () 625 { 626 var self = this; 627 var loading = $('<div class="skitter-spinner"><div class="icon-sending"></div></div>'); 628 var total = this.settings.images_links.length; 629 var u = 0; 630 631 this.skitter_box.append(loading); 632 633 for (var i in this.settings.images_links) { 634 var self_il = this.settings.images_links[i]; 635 var src = self.getImageName(self_il[0]); 636 var img = new Image(); 637 638 $(img).load(function () { 639 ++u; 640 if (u == total) { 641 self.skitter_box.find('.skitter-spinner').remove(); 642 self.start(); 643 } 644 }).error(function () { 645 self.skitter_box.find('.skitter-spinner, .image_number, .next_button, .prev_button').remove(); 646 self.skitter_box.html('<p style="color:white;background:black;text-align:center;padding:140px 0;">å è½½å¾ç失败ï¼è¯·æ£æ¥å¾çè·¯å¾æ¯å¦æ£ç¡®ã</p>'); 647 }).attr('src', src); 648 } 649 }, 650 651 /** 652 * Start skitter 653 */ 654 start: function() 655 { 656 var self = this; 657 var init_pause = false; 658 659 if (this.settings.numbers || this.settings.thumbs) this.skitter_box.find('.info_slide').fadeIn(500); 660 if (this.settings.dots) this.skitter_box.find('.info_slide_dots').fadeIn(500); 661 if (this.settings.label) this.skitter_box.find('.label_skitter').show(); 662 if (this.settings.navigation) { 663 this.skitter_box.find('.prev_button').fadeIn(500); 664 this.skitter_box.find('.next_button').fadeIn(500); 665 } 666 667 if (self.settings.auto_play) { 668 self.startTime(); 669 } 670 671 self.windowFocusOut(); 672 self.setLinkAtual(); 673 674 self.skitter_box.find('.image > a img').attr({'src': self.getCurrentImage()}); 675 img_link = self.skitter_box.find('.image > a'); 676 img_link = self.resizeImage(img_link); 677 img_link.find('img').fadeIn(1500); 678 679 self.setValueBoxText(); 680 self.showBoxText(); 681 682 if (self.settings.auto_play) { 683 self.stopOnMouseOver(); 684 } 685 686 var mouseOverInit = function() { 687 if (self.settings.stop_over) { 688 init_pause = true; 689 self.settings.is_hover_skitter_box = true; 690 self.clearTimer(true); 691 self.pauseProgressBar(); 692 } 693 }; 694 695 self.skitter_box.mouseover(mouseOverInit); 696 self.skitter_box.find('.next_button').mouseover(mouseOverInit); 697 698 if (self.settings.images_links.length > 1 && !init_pause) { 699 if (self.settings.auto_play) { 700 self.timer = setTimeout(function() { self.nextImage(); }, self.settings.interval); 701 } 702 } 703 else { 704 self.skitter_box.find('.skitter-spinner, .image_number, .next_button, .prev_button').remove(); 705 } 706 707 if ($.isFunction(self.settings.onLoad)) self.settings.onLoad(self); 708 709 this.setDimensions(); 710 }, 711 712 /** 713 * Jump to image 714 */ 715 jumpToImage: function(imageNumber) 716 { 717 if (this.settings.is_animating == false) { 718 this.settings.elapsedTime = 0; 719 this.skitter_box.find('.box_clone').stop(); 720 this.clearTimer(true); 721 this.settings.image_i = Math.floor(imageNumber); 722 723 this.skitter_box.find('.image > a').attr({'href': this.settings.link_atual}); 724 this.skitter_box.find('.image_main').attr({'src': this.getCurrentImage()}); 725 this.skitter_box.find('.box_clone').remove(); 726 727 this.nextImage(); 728 } 729 }, 730 731 /** 732 * Next image 733 */ 734 nextImage: function() 735 { 736 var self = this; 737 738 animations_functions = this.animations; 739 740 if (self.settings.progressbar) self.hideProgressBar(); 741 742 var animation_type; 743 if (this.settings.animation == '' && this.settings.images_links[this.settings.image_i][2]) { 744 animation_type = this.settings.images_links[this.settings.image_i][2]; 745 } else if (this.settings.animation == '') { 746 animation_type = 'default'; 747 } else { 748 animation_type = this.settings.animation; 749 } 750 751 // Animation fixed by window size 752 if (self.settings.responsive) { 753 var window_width = $(window).width(); 754 for (var name in self.settings.responsive) { 755 var item = self.settings.responsive[name]; 756 if (window_width < item.max_width && item.animation) { 757 animation_type = item.animation; 758 break; 759 } 760 } 761 } 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 max_w = self.getMaxW(8);
921 var division_w = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w)); 922 var division_h = Math.ceil(this.settings.height_skitter / (this.settings.height_skitter / 3)); 923 var total = division_w * division_h; 924 925 var width_box = Math.ceil(this.settings.width_skitter / division_w); 926 var height_box = Math.ceil(this.settings.height_skitter / division_h); 927 928 var init_top = this.settings.height_skitter + 200; 929 var init_left = this.settings.height_skitter + 200; 930 931 var col_t = 0; 932 var col = 0; 933 934 for (i = 0; i < total; i++) { 935 936 init_top = (i % 2 == 0) ? init_top : -init_top; 937 init_left = (i % 2 == 0) ? init_left : -init_left; 938 939 var _vtop = init_top + (height_box * col_t) + (col_t * 150); 940 var _vleft = -self.settings.width_skitter; 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) + (width_box * i), top:this.settings.height_skitter + (height_box * i), width:width_box, height:height_box}); 960 } 961 962 this.addBoxClone(box_clone); 963 964 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 965 box_clone.show().delay(delay_time).animate({top:_btop+'px', left:_bleft+'px'}, time_animate, easing, callback); 966 967 if (options.random) { 968 box_clone.find('img').css({left:_vleft_image+100, top:_vtop_image+50}); 969 box_clone.find('img').delay(delay_time+(time_animate/2)).animate({left:_vleft_image, top:_vtop_image}, 1000, 'easeOutBack'); 970 } 971 else { 972 box_clone.find('img').css({left:_vleft_image, top:_vtop_image}); 973 box_clone.find('img').delay(delay_time+(time_animate/2)).fadeTo(100, 0.5).fadeTo(300, 1); 974 } 975 976 col_t++; 977 if (col_t == division_h) { 978 col_t = 0; 979 col++; 980 } 981 } 982 }, 983 984 animationBlock: function(options) 985 { 986 var self = this; 987 988 this.settings.is_animating = true; 989 var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default; 990 var time_animate = 500 / this.settings.velocity; 991 992 this.setActualLevel(); 993 994 var max_w = self.getMaxW(15); 995 var total = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w)); 996 var width_box = Math.ceil(this.settings.width_skitter / total); 997 var height_box = (this.settings.height_skitter); 998 999 for (i = 0; i < total; i++) { 1000 1001 var _bleft = (width_box * (i)); 1002 var _btop = 0; 1003 1004 var box_clone = this.getBoxClone(); 1005 box_clone.css({left: this.settings.width_skitter + 100, top:0, width:width_box, height:height_box}); 1006 box_clone.find('img').css({left:-(width_box * i)}); 1007 1008 this.addBoxClone(box_clone); 1009 1010 var delay_time = 80 * (i); 1011 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 1012 1013 box_clone.show().delay(delay_time).animate({top:_btop, left:_bleft}, time_animate, easing); 1014 box_clone.find('img').hide().delay(delay_time+100).animate({opacity:'show'}, time_animate+300, easing, callback); 1015 } 1016 1017 }, 1018 1019 animationCubeStop: function(options) 1020 { 1021 var self = this; 1022 1023 var options = $.extend({}, {random: false}, options || {}); 1024 1025 this.settings.is_animating = true; 1026 var easing = (this.settings.easing_default == '') ? 'easeInQuad' : this.settings.easing_default; 1027 var time_animate = 300 / this.settings.velocity; 1028 1029 var image_old = this.getOldImage(); 1030 1031 this.setActualLevel(); 1032 1033 this.setLinkAtual(); 1034 this.skitter_box.find('.image_main').attr({'src':this.getCurrentImage()}); 1035 1036 var max_w = self.getMaxW(8); 1037 var max_h = self.getMaxH(8); 1038 var division_w = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w)); 1039 var division_h = Math.ceil(this.settings.height_skitter / (this.settings.width_skitter / max_h)); 1040 var total = division_w * division_h; 1041 1042 var width_box = Math.ceil(this.settings.width_skitter / division_w); 1043 var height_box = Math.ceil(this.settings.height_skitter / division_h); 1044 1045 var init_top = 0; 1046 var init_left = 0; 1047 1048 var col_t = 0; 1049 var col = 0; 1050 var _ftop = this.settings.width_skitter / 16; 1051 1052 for (i = 0; i < total; i++) { 1053 init_top = (i % 2 == 0) ? init_top : -init_top; 1054 init_left = (i % 2 == 0) ? init_left : -init_left; 1055 1056 var _vtop = init_top + (height_box * col_t); 1057 var _vleft = (init_left + (width_box * col)); 1058 var _vtop_image = -(height_box * col_t); 1059 1060 var _vleft_image = -(width_box * col); 1061 var _btop = _vtop - _ftop; 1062 var _bleft = _vleft - _ftop; 1063 1064 var box_clone = this.getBoxCloneImgOld(image_old); 1065 box_clone.css({left:_vleft+'px', top:_vtop+'px', width:width_box, height:height_box}); 1066 box_clone.find('img').css({left:_vleft_image, top:_vtop_image}); 1067 1068 this.addBoxClone(box_clone); 1069 box_clone.show(); 1070 1071 var delay_time = 50 * i; 1072 1073 if (options.random) { 1074 time_animate = (400 * (self.getRandom(2) + 1)) / this.settings.velocity; 1075 _btop = _vtop; 1076 _bleft = _vleft;
1077 delay_time = Math.ceil( 30 * self.getRandom(30) ); 1078 } 1079 1080 if (options.random && i == (total - 1)) { 1081 time_animate = 400 * 3; 1082 delay_time = 30 * 30; 1083 } 1084 1085 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 1086 box_clone.delay(delay_time).animate({opacity:'hide', top:_btop+'px', left:_bleft+'px'}, time_animate, easing, callback); 1087 1088 col_t++; 1089 if (col_t == division_h) { 1090 col_t = 0; 1091 col++; 1092 } 1093 } 1094 }, 1095 1096 animationCubeHide: function(options) 1097 { 1098 var self = this; 1099 1100 this.settings.is_animating = true; 1101 var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default; 1102 var time_animate = 500 / this.settings.velocity; 1103 1104 var image_old = this.getOldImage(); 1105 1106 this.setActualLevel(); 1107 1108 this.setLinkAtual(); 1109 this.skitter_box.find('.image_main').attr({'src':this.getCurrentImage()}); 1110 1111 var max_w = self.getMaxW(8); 1112 var division_w = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w)); 1113 var division_h = Math.ceil(this.settings.height_skitter / (this.settings.height_skitter / 3)); 1114 var total = division_w * division_h; 1115 1116 var width_box = Math.ceil(this.settings.width_skitter / division_w); 1117 var height_box = Math.ceil(this.settings.height_skitter / division_h); 1118 1119 var init_top = 0; 1120 var init_left = 0; 1121 1122 var col_t = 0; 1123 var col = 0; 1124 1125 for (i = 0; i < total; i++) { 1126 1127 init_top = (i % 2 == 0) ? init_top : -init_top; 1128 init_left = (i % 2 == 0) ? init_left : -init_left; 1129 1130 var _vtop = init_top + (height_box * col_t); 1131 var _vleft = (init_left + (width_box * col)); 1132 var _vtop_image = -(height_box * col_t); 1133 1134 var _vleft_image = -(width_box * col); 1135 var _btop = _vtop - 50; 1136 var _bleft = _vleft - 50; 1137 1138 var box_clone = this.getBoxCloneImgOld(image_old); 1139 box_clone.css({left:_vleft+'px', top:_vtop+'px', width:width_box, height:height_box}); 1140 box_clone.find('img').css({left:_vleft_image, top:_vtop_image}); 1141 1142 this.addBoxClone(box_clone); 1143 box_clone.show(); 1144 1145 var delay_time = 50 * i; 1146 delay_time = (i == (total - 1)) ? (total * 50) : delay_time; 1147 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 1148 1149 box_clone.delay(delay_time).animate({opacity:'hide'}, time_animate, easing, callback); 1150 1151 col_t++; 1152 if (col_t == division_h) { 1153 col_t = 0; 1154 col++; 1155 } 1156 } 1157 1158 }, 1159 1160 animationCubeJelly: function(options) 1161 { 1162 var self = this; 1163 1164 this.settings.is_animating = true; 1165 var easing = (this.settings.easing_default == '') ? 'easeInBack' : this.settings.easing_default; 1166 var time_animate = 300 / this.settings.velocity; 1167 1168 var image_old = this.getOldImage(); 1169 1170 this.setActualLevel(); 1171 1172 this.setLinkAtual(); 1173 this.skitter_box.find('.image_main').attr({'src':this.getCurrentImage()}); 1174 1175 var max_w = self.getMaxW(8); 1176 var division_w = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w)); 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.getOldImage(); 1246 1247 this.setActualLevel(); 1248 1249 this.setLinkAtual(); 1250 this.skitter_box.find('.image_main').attr({'src':this.getCurrentImage()}); 1251 1252 var max_w = self.getMaxW(8);
1253 var division_w = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w)); 1254 var division_h = Math.ceil(this.settings.height_skitter / (this.settings.height_skitter / 3)); 1255 var total = division_w * division_h; 1256 1257 var width_box = Math.ceil(this.settings.width_skitter / division_w); 1258 var height_box = Math.ceil(this.settings.height_skitter / division_h); 1259 1260 var init_top = 0; 1261 var init_left = 0; 1262 1263 var col_t = 0; 1264 var col = 0; 1265 var _ftop = Math.ceil(this.settings.width_skitter / 6); 1266 1267 for (i = 0; i < total; i++) { 1268 1269 init_top = (i % 2 == 0) ? init_top : -init_top; 1270 init_left = (i % 2 == 0) ? init_left : -init_left; 1271 1272 var _vtop = init_top + (height_box * col_t); 1273 var _vleft = (init_left + (width_box * col)); 1274 var _vtop_image = -(height_box * col_t); 1275 1276 var _vleft_image = -(width_box * col); 1277 var _btop = _vtop - _ftop; 1278 var _bleft = _vleft - _ftop; 1279 1280 var box_clone = this.getBoxCloneImgOld(image_old); 1281 box_clone.css({left:_vleft, top:_vtop, width:width_box, height:height_box}); 1282 box_clone.find('img').css({left:_vleft_image, top:_vtop_image}); 1283 1284 this.addBoxClone(box_clone); 1285 box_clone.show(); 1286 1287 var delay_time = 50 * i; 1288 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 1289 box_clone.delay(delay_time).animate({ 1290 opacity:'hide',width:'hide',height:'hide',top:_vtop+(width_box*1.5),left:_vleft+(height_box*1.5) 1291 }, time_animate, easing, callback); 1292 1293 col_t++; 1294 if (col_t == division_h) { 1295 col_t = 0; 1296 col++; 1297 } 1298 } 1299 1300 }, 1301 1302 animationHorizontal: function(options) 1303 { 1304 var self = this; 1305 1306 this.settings.is_animating = true; 1307 var easing = (this.settings.easing_default == '') ? 'easeOutExpo' : this.settings.easing_default; 1308 var time_animate = 700 / this.settings.velocity; 1309 1310 this.setActualLevel(); 1311 1312 var total = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 7)); 1313 var width_box = (this.settings.width_skitter); 1314 var height_box = Math.ceil(this.settings.height_skitter / total); 1315 1316 for (i = 0; i < total; i++) { 1317 var _bleft = (i % 2 == 0 ? '' : '') + width_box; 1318 var _btop = (i * height_box); 1319 1320 var box_clone = this.getBoxClone(); 1321 1322 box_clone.css({left:_bleft+'px', top:_btop+'px', width:width_box, height:height_box}); 1323 box_clone.find('img').css({left:0, top:-_btop}); 1324 1325 this.addBoxClone(box_clone); 1326 1327 var delay_time = 90 * i; 1328 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 1329 box_clone.delay(delay_time).animate({opacity:'show', top:_btop, left:0}, time_animate, easing, callback); 1330 } 1331 }, 1332 1333 animationShowBars: function(options) 1334 { 1335 var self = this; 1336 1337 var options = $.extend({}, {random: false}, options || {}); 1338 1339 this.settings.is_animating = true; 1340 var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default; 1341 var time_animate = 400 / this.settings.velocity; 1342 1343 this.setActualLevel(); 1344 1345 var max_w = self.getMaxW(10); 1346 var total = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w)); 1347 var width_box = Math.ceil(this.settings.width_skitter / total); 1348 var height_box = (this.settings.height_skitter); 1349 1350 for (i = 0; i < total; i++) { 1351 1352 var _bleft = (width_box * (i)); 1353 var _btop = 0; 1354 1355 var box_clone = this.getBoxClone(); 1356 1357 box_clone.css({left:_bleft, top:_btop - 50, width:width_box, height:height_box}); 1358 box_clone.find('img').css({left:-(width_box * i), top:0}); 1359 1360 this.addBoxClone(box_clone); 1361 1362 if (options.random) { 1363 var random = this.getRandom(total); 1364 var delay_time = 50 * random; 1365 delay_time = (i == (total - 1)) ? (50 * total) : delay_time; 1366 } 1367 else { 1368 var delay_time = 70 * (i); 1369 time_animate = time_animate - (i * 2); 1370 } 1371 1372 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 1373 box_clone.delay(delay_time).animate({ 1374 opacity:'show', top:_btop+'px', left:_bleft+'px' 1375 }, time_animate, easing, callback); 1376 } 1377 1378 }, 1379 1380 animationTube: function(options) 1381 { 1382 var self = this; 1383 1384 this.settings.is_animating = true; 1385 var easing = (this.settings.easing_default == '') ? 'easeOutElastic' : this.settings.easing_default; 1386 var time_animate = 600 / this.settings.velocity; 1387 1388 this.setActualLevel(); 1389 1390 var max_w = self.getMaxW(10);
1391 var total = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w)); 1392 var width_box = Math.ceil(this.settings.width_skitter / total); 1393 var height_box = this.settings.height_skitter; 1394 1395 for (i = 0;i<total;i++) { 1396 var _btop = 0; 1397 var _vtop = height_box; 1398 var vleft = width_box * i; 1399 1400 var box_clone = this.getBoxClone(); 1401 1402 box_clone.css({left:vleft,top: _vtop, height:height_box, width: width_box}); 1403 box_clone.find('img').css({left:-(vleft)}); 1404 1405 this.addBoxClone(box_clone); 1406 1407 var random = this.getRandom(total); 1408 var delay_time = 30 * random; 1409 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 1410 box_clone.show().delay(delay_time).animate({top:_btop}, time_animate, easing, callback); 1411 } 1412 }, 1413 1414 animationFade: function(options) 1415 { 1416 var self = this; 1417 1418 this.settings.is_animating = true; 1419 var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default; 1420 var time_animate = 800 / this.settings.velocity; 1421 1422 this.setActualLevel(); 1423 1424 var width_box = this.settings.width_skitter; 1425 var height_box = this.settings.height_skitter; 1426 var total = 2; 1427 1428 for (i = 0;i<total;i++) { 1429 var _vtop = 0; 1430 var _vleft = 0; 1431 1432 var box_clone = this.getBoxClone(); 1433 box_clone.css({left:_vleft, top:_vtop, width:width_box, height:height_box}); 1434 this.addBoxClone(box_clone); 1435 1436 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 1437 box_clone.animate({opacity:'show', left:0, top:0}, time_animate, easing, callback); 1438 } 1439 }, 1440 1441 animationFadeFour: function(options) 1442 { 1443 var self = this; 1444 1445 this.settings.is_animating = true; 1446 var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default; 1447 var time_animate = 500 / this.settings.velocity; 1448 1449 this.setActualLevel(); 1450 1451 var width_box = this.settings.width_skitter; 1452 var height_box = this.settings.height_skitter; 1453 var total = 4; 1454 1455 for (i = 0;i<total;i++) { 1456 1457 if (i == 0) { 1458 var _vtop = '-40px'; 1459 var _vleft = '-40px'; 1460 } else if (i == 1) { 1461 var _vtop = '-40px'; 1462 var _vleft = '40px'; 1463 } else if (i == 2) { 1464 var _vtop = '40px'; 1465 var _vleft = '-40px'; 1466 } else if (i == 3) { 1467 var _vtop = '40px'; 1468 var _vleft = '40px'; 1469 } 1470 1471 var box_clone = this.getBoxClone(); 1472 box_clone.css({left:_vleft, top:_vtop, width:width_box, height:height_box}); 1473 this.addBoxClone(box_clone); 1474 1475 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 1476 box_clone.animate({opacity:'show', left:0, top:0}, time_animate, easing, callback); 1477 } 1478 }, 1479 1480 animationParalell: function(options) 1481 { 1482 var self = this; 1483 1484 this.settings.is_animating = true; 1485 var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default; 1486 var time_animate = 400 / this.settings.velocity; 1487 1488 this.setActualLevel(); 1489 1490 var max_w = 16; //self.getMaxW(16); // @todo complex 1491 var total = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w)); 1492 var width_box = Math.ceil(this.settings.width_skitter / total); 1493 var height_box = this.settings.height_skitter; 1494 1495 for (i = 0; i < total; i++) { 1496 1497 var _bleft = (width_box * (i)); 1498 var _btop = 0; 1499 1500 var box_clone = this.getBoxClone(); 1501 1502 box_clone.css({left:_bleft, top:_btop - this.settings.height_skitter, width:width_box, height:height_box}); 1503 box_clone.find('img').css({left:-(width_box * i), top:0}); 1504 1505 this.addBoxClone(box_clone); 1506 1507 var delay_time; 1508 if (i <= ((total / 2) - 1)) { 1509 delay_time = 1400 - (i * 200); 1510 } 1511 else if (i > ((total / 2) - 1)) { 1512 delay_time = ((i - (total / 2)) * 200); 1513 } 1514 delay_time = delay_time / 2.5; 1515 1516 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 1517 box_clone.delay(delay_time).animate({ 1518 top:_btop+'px', left:_bleft+'px', opacity: 'show' 1519 }, time_animate, easing, callback); 1520 } 1521 1522 }, 1523 1524 animationBlind: function(options) 1525 { 1526 var self = this; 1527 1528 var options = $.extend({}, {height: false}, options || {}); 1529 1530 this.settings.is_animating = true; 1531 var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default; 1532 var time_animate = 400 / this.settings.velocity; 1533 1534 this.setActualLevel(); 1535 1536 var max_w = 16; // self.getMaxW(16); // @todo complex
1537 var total = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w)); 1538 var width_box = Math.ceil(this.settings.width_skitter / total); 1539 var height_box = this.settings.height_skitter; 1540 1541 for (i = 0; i < total; i++) { 1542 1543 var _bleft = (width_box * (i)); 1544 var _btop = 0; 1545 1546 var box_clone = this.getBoxClone(); 1547 1548 box_clone.css({left:_bleft, top:_btop, width:width_box, height:height_box}); 1549 box_clone.find('img').css({left:-(width_box * i), top:0}); 1550 1551 this.addBoxClone(box_clone); 1552 1553 var delay_time; 1554 1555 if (!options.height) { 1556 if (i <= ((total / 2) - 1)) { 1557 delay_time = 1400 - (i * 200); 1558 } 1559 else if (i > ((total / 2) - 1)) { 1560 delay_time = ((i - (total / 2)) * 200); 1561 } 1562 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 1563 } 1564 else { 1565 if (i <= ((total / 2) - 1)) { 1566 delay_time = 200 + (i * 200); 1567 } 1568 else if (i > ((total / 2) - 1)) { 1569 delay_time = (((total / 2) - i) * 200) + (total * 100); 1570 } 1571 var callback = (i == (total / 2)) ? function() { self.finishAnimation(); } : ''; 1572 } 1573 1574 delay_time = delay_time / 2.5; 1575 1576 if (!options.height) { 1577 box_clone.delay(delay_time).animate({ 1578 opacity:'show',top:_btop+'px', left:_bleft+'px', width:'show' 1579 }, time_animate, easing, callback); 1580 } 1581 else { 1582 time_animate = time_animate + (i * 2); 1583 var easing = 'easeOutQuad'; 1584 box_clone.delay(delay_time).animate({ 1585 opacity:'show',top:_btop+'px', left:_bleft+'px', height:'show' 1586 }, time_animate, easing, callback); 1587 } 1588 } 1589 1590 }, 1591 1592 animationBlindDimension: function(options) 1593 { 1594 var self = this; 1595 1596 var options = $.extend({}, {height: true, time_animate: 500, delay: 100}, options || {}); 1597 1598 this.settings.is_animating = true; 1599 var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default; 1600 var time_animate = options.time_animate / this.settings.velocity; 1601 1602 this.setActualLevel(); 1603 1604 var max_w = self.getMaxW(16); 1605 var total = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w)); 1606 var width_box = Math.ceil(this.settings.width_skitter / total); 1607 var height_box = this.settings.height_skitter; 1608 1609 for (i = 0; i < total; i++) { 1610 1611 var _bleft = (width_box * (i)); 1612 var _btop = 0; 1613 1614 var box_clone = this.getBoxClone(); 1615 1616 box_clone.css({left:_bleft, top:_btop, width:width_box, height:height_box}); 1617 box_clone.find('img').css({left:-(width_box * i), top:0}); 1618 1619 this.addBoxClone(box_clone); 1620 1621 var delay_time = options.delay * i; 1622 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 1623 1624 if (!options.height) { 1625 box_clone.delay(delay_time).animate({ 1626 opacity:'show',top:_btop+'px', left:_bleft+'px', width:'show' 1627 }, time_animate, easing, callback); 1628 } 1629 else { 1630 var easing = 'easeOutQuad'; 1631 box_clone.delay(delay_time).animate({ 1632 opacity:'show',top:_btop+'px', left:_bleft+'px', height:'show' 1633 }, time_animate, easing, callback); 1634 } 1635 } 1636 1637 }, 1638 1639 animationDirection: function(options) 1640 { 1641 var self = this; 1642 1643 var max_w = self.getMaxW(7); 1644 var options = $.extend({}, {direction: 'top', delay_type: 'sequence', total: max_w}, options || {}); 1645 1646 this.settings.is_animating = true; 1647 var easing = (this.settings.easing_default == '') ? 'easeInOutExpo' : this.settings.easing_default; 1648 var time_animate = 1200 / this.settings.velocity; 1649 1650 var image_old = this.getOldImage(); 1651 1652 this.setActualLevel(); 1653 1654 this.setLinkAtual(); 1655 this.skitter_box.find('.image_main').attr({'src':this.getCurrentImage()}); 1656 this.skitter_box.find('.image_main').hide(); 1657 1658 var total = options.total; 1659 1660 for (i = 0; i < total; i++) { 1661 1662 switch (options.direction) 1663 { 1664 default : case 'top' : 1665
1666 var width_box = Math.ceil(this.settings.width_skitter / total); 1667 var height_box = this.settings.height_skitter; 1668 1669 var _itopc = 0; 1670 var _ileftc = (width_box * i); 1671 var _ftopc = -height_box; 1672 var _fleftc = _ileftc; 1673 1674 var _itopn = height_box; 1675 var _ileftn = _ileftc; 1676 var _ftopn = 0; 1677 var _fleftn = _ileftc; 1678 1679 var _vtop_image = 0; 1680 var _vleft_image = -_ileftc; 1681 1682 break; 1683 1684 case 'bottom' : 1685 1686 var width_box = Math.ceil(this.settings.width_skitter / total); 1687 var height_box = this.settings.height_skitter; 1688 1689 var _itopc = 0; 1690 var _ileftc = (width_box * i); 1691 var _ftopc = height_box; 1692 var _fleftc = _ileftc; 1693 1694 var _itopn = -height_box; 1695 var _ileftn = _ileftc; 1696 var _ftopn = 0; 1697 var _fleftn = _ileftc; 1698 1699 var _vtop_image = 0; 1700 var _vleft_image = -_ileftc; 1701 1702 break; 1703 1704 case 'right' : 1705 1706 var width_box = this.settings.width_skitter; 1707 var height_box = Math.ceil(this.settings.height_skitter / total); 1708 1709 var _itopc = (height_box * i); 1710 var _ileftc = 0; 1711 var _ftopc = _itopc; 1712 var _fleftc = width_box; 1713 1714 var _itopn = _itopc; 1715 var _ileftn = -_fleftc; 1716 var _ftopn = _itopc; 1717 var _fleftn = 0; 1718 1719 var _vtop_image = -_itopc; 1720 var _vleft_image = 0; 1721 1722 break; 1723 1724 case 'left' : 1725 1726 var width_box = this.settings.width_skitter; 1727 var height_box = Math.ceil(this.settings.height_skitter / total); 1728 1729 var _itopc = (height_box * i); 1730 var _ileftc = 0; 1731 var _ftopc = _itopc; 1732 var _fleftc = -width_box; 1733 1734 var _itopn = _itopc; 1735 var _ileftn = -_fleftc; 1736 var _ftopn = _itopc; 1737 var _fleftn = 0; 1738 1739 var _vtop_image = -_itopc; 1740 var _vleft_image = 0; 1741 1742 break; 1743 1744 } 1745 1746 switch (options.delay_type) 1747 { 1748 case 'zebra' : default : var delay_time = (i % 2 == 0) ? 0 : 150; break; 1749 case 'random' : var delay_time = 30 * (Math.random() * 30); break; 1750 case 'sequence' : var delay_time = i * 100; break; 1751 } 1752 1753 var box_clone = this.getBoxCloneImgOld(image_old); 1754 box_clone.find('img').css({left:_vleft_image, top:_vtop_image}); 1755 1756 box_clone.css({top:_itopc, left:_ileftc, width:width_box, height:height_box}); 1757 1758 this.addBoxClone(box_clone); 1759 box_clone.show(); 1760 box_clone.delay(delay_time).animate({ top:_ftopc, left:_fleftc }, time_animate, easing); 1761 1762 // Next image 1763 var box_clone_next = this.getBoxClone(); 1764 box_clone_next.find('img').css({left:_vleft_image, top:_vtop_image}); 1765 1766 box_clone_next.css({top:_itopn, left:_ileftn, width:width_box, height:height_box}); 1767 1768 this.addBoxClone(box_clone_next); 1769 box_clone_next.show(); 1770 1771 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 1772 box_clone_next.delay(delay_time).animate({ top:_ftopn, left
1772:_fleftn }, time_animate, easing, callback); 1773 1774 } 1775 }, 1776 1777 animationCubeSpread: function(options) 1778 { 1779 var self = this; 1780 1781 this.settings.is_animating = true; 1782 var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default; 1783 var time_animate = 700 / this.settings.velocity; 1784 1785 this.setActualLevel(); 1786 1787 var max_w = self.getMaxW(8); 1788 var max_h = self.getMaxH(8); 1789 var division_w = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w)); 1790 var division_h = Math.ceil(this.settings.height_skitter / (this.settings.width_skitter / max_h)); 1791 var total = division_w * division_h; 1792 1793 var width_box = Math.ceil(this.settings.width_skitter / division_w); 1794 var height_box = Math.ceil(this.settings.height_skitter / division_h); 1795 1796 var init_top = 0; 1797 var init_left = 0; 1798 1799 var col_t = 0; 1800 var col = 0; 1801 var order = new Array; 1802 var spread = new Array; 1803 1804 // Make order 1805 for (i = 0; i < total; i++) { 1806 init_top = (i % 2 == 0) ? init_top : -init_top; 1807 init_left = (i % 2 == 0) ? init_left : -init_left; 1808 1809 var _vtop = init_top + (height_box * col_t); 1810 var _vleft = (init_left + (width_box * col)); 1811 1812 order[i] = [_vtop, _vleft]; 1813 1814 col_t++; 1815 if (col_t == division_h) { 1816 col_t = 0; 1817 col++; 1818 } 1819 } 1820 1821 // Reset col and col_t 1822 col_t = 0; 1823 col = 0; 1824 1825 // Make array for spread 1826 for (i = 0; i < total; i++) { 1827 spread[i] = i; 1828 }; 1829 1830 // Shuffle array 1831 var spread = self.shuffleArray(spread); 1832 1833 for (i = 0; i < total; i++) { 1834 init_top = (i % 2 == 0) ? init_top : -init_top; 1835 init_left = (i % 2 == 0) ? init_left : -init_left; 1836 1837 var _vtop = init_top + (height_box * col_t); 1838 var _vleft = (init_left + (width_box * col)); 1839 var _vtop_image = -(height_box * col_t); 1840 1841 var _vleft_image = -(width_box * col); 1842 var _btop = _vtop; 1843 var _bleft = _vleft; 1844 1845 _vtop = order[spread[i]][0]; 1846 _vleft = order[spread[i]][1]; 1847 1848 var box_clone = this.getBoxClone(); 1849 1850 box_clone.css({left:_vleft+'px', top:_vtop+'px', width:width_box, height:height_box}); 1851 box_clone.find('img').css({left:_vleft_image, top:_vtop_image}); 1852 1853 this.addBoxClone(box_clone); 1854 1855 var delay_time = 30 * (Math.random() * 30); 1856 if (i == (total-1)) delay_time = 30 * 30; 1857 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 1858 box_clone.delay(delay_time).animate({opacity:'show',top:_btop+'px', left:_bleft+'px'}, time_animate, easing, callback); 1859 1860 col_t++; 1861 if (col_t == division_h) { 1862 col_t = 0; 1863 col++; 1864 } 1865 } 1866 }, 1867 1868 animationGlassCube: function(options) 1869 { 1870 var self = this; 1871 1872 this.settings.is_animating = true; 1873 var easing = (this.settings.easing_default == '') ? 'easeOutExpo' : this.settings.easing_default; 1874 var time_animate = 500 / this.settings.velocity; 1875 1876 this.setActualLevel(); 1877 1878 var max_w = self.getMaxW(10); 1879 var total = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w)) * 2; 1880 var width_box = Math.ceil(this.settings.width_skitter / total) * 2; 1881 var height_box = (this.settings.height_skitter) / 2; 1882 var col = 0; 1883 1884 for (i = 0; i < total; i++) { 1885 mod = (i % 2) == 0 ? true : false; 1886 1887 var _ileft = (width_box * (col)); 1888 var _itop = (mod) ? -self.settings.height_skitter : self.settings.height_skitter; 1889 1890 var _fleft = (width_box * (col)); 1891 var _ftop = (mod) ? 0 : (height_box); 1892 1893 var _bleft = -(width_box * col); 1894 var _btop = (mod) ? 0 : -(height_box); 1895 1896 var delay_time = 120 * col; 1897 1898 var box_clone = this.getBoxClone(); 1899 box_clone.css({left: _ileft, top:_itop, width:width_box, height:height_box}); 1900 1901 box_clone 1902 .find('img') 1903 .css({left: _bleft + (width_box / 1.5), top: _btop}) 1904 .delay(delay_time) 1905 .animate({left: _bleft, top: _btop}, (time_animate * 1.9), 'easeOutQuad'); 1906 1907 this.addBoxClone(box_clone); 1908 1909 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 1910 box_clone.show().delay(delay_time).animate({top:_ftop, left:_fleft}, time_animate, easing, callback); 1911 1912 if ((i % 2) != 0) col++; 1913 } 1914 }, 1915 1916 animationGlassBlock: function(options) 1917 { 1918 var self = this; 1919 1920 this.settings.is_animating = true; 1921 var easing = (this.settings.easing_default == '') ? 'easeOutExpo' : this.settings.easing_default; 1922 var time_animate = 700 / this.settings.velocity; 1923 1924 this.setActualLevel(); 1925 1926 var max_w = self.getMaxW(10);
1927 var total = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w)); 1928 var width_box = Math.ceil(this.settings.width_skitter / total); 1929 var height_box = (this.settings.height_skitter); 1930 1931 for (i = 0; i < total; i++) { 1932 var _ileft = (width_box * (i)); 1933 var _itop = 0; 1934 1935 var _fleft = (width_box * (i)); 1936 var _ftop = 0; 1937 1938 var _bleft = -(width_box * (i)); 1939 var _btop = 0; 1940 1941 var delay_time = 100 * i; 1942 1943 var box_clone = this.getBoxClone(); 1944 box_clone.css({left: _ileft, top:_itop, width:width_box, height:height_box}); 1945 1946 box_clone 1947 .find('img') 1948 .css({left: _bleft + (width_box / 1.5), top: _btop}) 1949 .delay(delay_time) 1950 .animate({left: _bleft, top: _btop}, (time_animate * 1.1), 'easeInOutQuad'); 1951 1952 this.addBoxClone(box_clone); 1953 1954 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 1955 box_clone.delay(delay_time).animate({top:_ftop, left:_fleft, opacity: 'show'}, time_animate, easing, callback); 1956 1957 } 1958 }, 1959 1960 animationCircles: function(options) 1961 { 1962 var self = this; 1963 1964 this.settings.is_animating = true; 1965 var easing = (this.settings.easing_default == '') ? 'easeInQuad' : this.settings.easing_default; 1966 var time_animate = 500 / this.settings.velocity; 1967 1968 this.setActualLevel(); 1969 1970 var total = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 10)); 1971 var size_box = this.settings.height_skitter; 1972 1973 var radius = Math.sqrt(Math.pow((this.settings.width_skitter), 2) + Math.pow((this.settings.height_skitter), 2)); 1974 var radius = Math.ceil(radius); 1975 1976 for (i = 0; i < total; i++) { 1977 var _ileft = (self.settings.width_skitter / 2) - (size_box / 2); 1978 var _itop = (self.settings.height_skitter / 2) - (size_box / 2); 1979 1980 var _fleft = _ileft; 1981 var _ftop = _itop; 1982 var box_clone = null; 1983 1984 box_clone = this.getBoxCloneBackground({ 1985 image: self.getCurrentImage(), 1986 left: _ileft, 1987 top: _itop, 1988 width: size_box, 1989 height: size_box, 1990 position: { 1991 top: -_itop, 1992 left: -_ileft 1993 } 1994 }).skitterCss3({ 1995 'border-radius': radius+'px' 1996 }); 1997 1998 size_box += 200; 1999 2000 this.addBoxClone(box_clone); 2001 2002 var delay_time = 70 * i; 2003 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 2004 box_clone.delay(delay_time).animate({top: _ftop, left: _fleft, opacity: 'show'}, time_animate, easing, callback); 2005 2006 } 2007 }, 2008 2009 animationCirclesInside: function(options) 2010 { 2011 var self = this; 2012 2013 this.settings.is_animating = true; 2014 var easing = (this.settings.easing_default == '') ? 'easeInQuad' : this.settings.easing_default; 2015 var time_animate = 500 / this.settings.velocity; 2016 2017 var image_old = this.getOldImage(); 2018 2019 this.setActualLevel(); 2020 2021 this.setLinkAtual(); 2022 this.skitter_box.find('.image_main').attr({'src':this.getCurrentImage()}); 2023 2024 var total = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 10)); 2025 2026 var radius = Math.sqrt(Math.pow((this.settings.width_skitter), 2) + Math.pow((this.settings.height_skitter), 2)); 2027 2028 var radius = Math.ceil(radius); 2029 var size_box = radius; 2030 2031 for (i = 0; i < total; i++) { 2032 var _ileft = (self.settings.width_skitter / 2) - (size_box / 2); 2033 var _itop = (self.settings.height_skitter / 2) - (size_box / 2); 2034 2035 var _fleft = _ileft; 2036 var _ftop = _itop; 2037 var box_clone = null; 2038 2039 box_clone = this.getBoxCloneBackground({ 2040 image: image_old, 2041 left: _ileft, 2042 top: _itop, 2043 width: size_box, 2044 height: size_box, 2045 position: { 2046 top: -_itop, 2047 left: -_ileft 2048 } 2049 }).skitterCss3({ 2050 'border-radius': radius+'px' 2051 }); 2052 2053 size_box -= 200; 2054 2055 this.addBoxClone(box_clone); 2056 box_clone.show(); 2057 2058 var delay_time = 70 * i; 2059 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 2060 box_clone.delay(delay_time).animate({top: _ftop, left: _fleft, opacity: 'hide'}, time_animate, easing, callback); 2061 2062 } 2063 }, 2064 2065 // Obs.: animacao com problemas, igual ao animationCirclesInside 2066 // @todo Usar css3 para rotate 2067 animationCirclesRotate: function(options) 2068 { 2069 var self = this; 2070 2071 this.settings.is_animating = true; 2072 var easing = (this.settings.easing_default == '') ? 'easeInQuad' : this.settings.easing_default; 2073 var time_animate = 500 / this.settings.velocity; 2074 2075 var image_old = this.getOldImage(); 2076 2077 this.setActualLevel(); 2078 2079 this.setLinkAtual(); 2080 this.skitter_box.find('.image_main').attr({'src':this.getCurrentImage()}); 2081
2082 var total = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / 10)); 2083 2084 var radius = Math.sqrt(Math.pow((this.settings.width_skitter), 2) + Math.pow((this.settings.height_skitter), 2)); 2085 var radius = Math.ceil(radius); 2086 var size_box = radius; 2087 2088 for (i = 0; i < total; i++) { 2089 var _ileft = (self.settings.width_skitter / 2) - (size_box / 2); 2090 var _itop = (self.settings.height_skitter / 2) - (size_box / 2); 2091 2092 var _fleft = _ileft; 2093 var _ftop = _itop; 2094 var box_clone = null; 2095 2096 box_clone = this.getBoxCloneImgOld(image_old); 2097 box_clone.css({left: _ileft, top:_itop, width:size_box, height:size_box}).skitterCss3({ 2098 'border-radius': radius+'px' 2099 }); 2100 box_clone.find('img').css({left: -_ileft, top: -_itop}); 2101 2102 size_box -= 300; 2103 2104 this.addBoxClone(box_clone); 2105 box_clone.show(); 2106 2107 var delay_time = 200 * i; 2108 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 2109 var _rotate = (i % 2 == 0) ? '+=2deg' : '+=2deg'; 2110 box_clone.delay(delay_time).animate({ top: _ftop, left: _fleft, opacity: 'hide' }, time_animate, easing, callback); 2111 } 2112 }, 2113 2114 animationCubeShow: function(options) 2115 { 2116 var self = this; 2117 2118 this.settings.is_animating = true; 2119 var easing = (this.settings.easing_default == '') ? 'easeOutQuad' : this.settings.easing_default; 2120 var time_animate = 400 / this.settings.velocity; 2121 2122 this.setActualLevel(); 2123 2124 var max_w = self.getMaxW(8); 2125 var max_h = 4; 2126 2127 var division_w = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w)); 2128 var division_h = Math.ceil(this.settings.height_skitter / (this.settings.height_skitter / max_h)); 2129 var total = division_w * division_h; 2130 2131 var width_box = Math.ceil(this.settings.width_skitter / division_w); 2132 var height_box = Math.ceil(this.settings.height_skitter / division_h); 2133 2134 var last = false; 2135 2136 var _btop = 0; 2137 var _bleft = 0; 2138 var line = 0; 2139 var col = 0; 2140 2141 for (i = 0; i < total; i++) { 2142 2143 _btop = height_box * line; 2144 _bleft = width_box * col; 2145 2146 var delay_time = 30 * (i); 2147 2148 var box_clone = this.getBoxClone(); 2149 box_clone.css({left:_bleft, top:_btop, width:width_box, height:height_box}).hide(); 2150 box_clone.find('img').css({left:-_bleft, top:-_btop}); 2151 this.addBoxClone(box_clone); 2152 2153 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 2154 box_clone.delay(delay_time).animate({width:'show', height:'show'}, time_animate, easing, callback); 2155 2156 line++; 2157 if (line == division_h) { 2158 line = 0; 2159 col++; 2160 } 2161 } 2162 }, 2163 2164 animationDirectionBars: function(options) 2165 { 2166 var self = this; 2167 2168 var options = $.extend({}, {direction: 'top'}, options || {}); 2169 2170 this.settings.is_animating = true; 2171 var easing = (this.settings.easing_default == '') ? 'easeInOutQuad' : this.settings.easing_default; 2172 var time_animate = 400 / this.settings.velocity; 2173 2174 var image_old = this.getOldImage(); 2175 2176 this.setActualLevel(); 2177 2178 this.setLinkAtual(); 2179 this.skitter_box.find('.image_main').attr({'src':this.getCurrentImage()}); 2180 2181 var max_w = self.getMaxW(12); 2182 var total = max_w; 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.getOldImage(); 2219 2220 this.setActualLevel(); 2221 2222 this.setLinkAtual(); 2223 this.skitter_box.find('.image_main').attr({'src':this.getCurrentImage()}); 2224 2225 var max_w = self.getMaxW(10); 2226 var division_w = Math.ceil(this.settings.width_skitter / (this.settings.width_skitter / max_w)); 2227 var total = division_w; 2228 2229 var width_box = Math.ceil(this.settings.width_skitter / division_w); 2230 var height_box = this.settings.height_skitter; 2231 2232 for (i = 0; i < total; i++) { 2233 var _vtop = 0; 2234 var _vleft = width_box * i; 2235 2236 var _vtop_image = 0; 2237 var _vleft_image = -(width_box * i); 2238 2239 var _fleft = '+='+width_box; 2240 2241 var box_clone = this.getBoxCloneImgOld(image_old); 2242 box_clone.css({left:0, top:0, width:width_box, height:height_box}); 2243 box_clone.find('img').css({left:_vleft_image, top:_vtop_image}); 2244 2245 var box_clone_main = this.getBoxCloneImgOld(image_old); 2246 box_clone_main.css({left:_vleft+'px', top:_vtop+'px', width:width_box, height:height_box}); 2247 box_clone_main.html(box_clone); 2248 2249 this.addBoxClone(box_clone_main); 2250 box_clone.show(); 2251 box_clone_main.show(); 2252 2253 var delay_time = 50 * i; 2254 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 2255 2256 box_clone.delay(delay_time).animate({left:_fleft}, time_animate, easing, callback); 2257 } 2258 }, 2259 2260 animationSwapBars: function(options) 2261 { 2262 var self = this; 2263 2264 var max_w = self.getMaxW(7); 2265 var options = $.extend({}
2265, {direction: 'top', delay_type: 'sequence', total: max_w, easing: 'easeOutCirc'}, options || {}); 2266 2267 this.settings.is_animating = true; 2268 var easing = (this.settings.easing_default == '') ? options.easing : this.settings.easing_default; 2269 var time_animate = 500 / this.settings.velocity; 2270 2271 var image_old = this.getOldImage(); 2272 2273 this.setActualLevel(); 2274 2275 this.setLinkAtual(); 2276 this.skitter_box.find('.image_main').attr({'src':this.getCurrentImage()}); 2277 this.skitter_box.find('.image_main').hide(); 2278 2279 var total = options.total; 2280 2281 for (i = 0; i < total; i++) { 2282 2283 var width_box = Math.ceil(this.settings.width_skitter / total); 2284 var height_box = this.settings.height_skitter; 2285 2286 var _itopc = 0; 2287 var _ileftc = (width_box * i); 2288 var _ftopc = -height_box; 2289 var _fleftc = _ileftc + width_box ; 2290 2291 var _itopn = height_box; 2292 var _ileftn = _ileftc; 2293 var _ftopn = 0; 2294 var _fleftn = _ileftc; 2295 2296 var _vtop_image = 0; 2297 var _vleft_image = -_ileftc; 2298 2299 switch (options.delay_type) 2300 { 2301 case 'zebra' : default : var delay_time = (i % 2 == 0) ? 0 : 150; break; 2302 case 'random' : var delay_time = 30 * (Math.random() * 30); break; 2303 case 'sequence' : var delay_time = i * 100; break; 2304 } 2305 2306 // Old image 2307 var box_clone = this.getBoxCloneImgOld(image_old); 2308 box_clone.find('img').css({left:_vleft_image, top:0}); 2309 box_clone.css({top:0, left:0, width:width_box, height:height_box}); 2310 2311 // Next image 2312 var box_clone_next = this.getBoxClone(); 2313 box_clone_next.find('img').css({left:_vleft_image, top:0}); 2314 box_clone_next.css({top:0, left:-width_box, width:width_box, height:height_box}); 2315 2316 // Container box images 2317 var box_clone_container = this.getBoxClone(); 2318 box_clone_container.html('').append(box_clone).append(box_clone_next); 2319 box_clone_container.css({top:0, left:_ileftc, width:width_box, height:height_box}); 2320 2321 // Add containuer 2322 this.addBoxClone(box_clone_container); 2323 2324 // Show boxes 2325 box_clone_container.show(); 2326 box_clone.show(); 2327 box_clone_next.show(); 2328 2329 // Callback 2330 var callback = (i == (total - 1)) ? function() { self.finishAnimation(); } : ''; 2331 2332 // Animations 2333 box_clone.delay(delay_time).animate({ left: width_box }, time_animate, easing); 2334 box_clone_next.delay(delay_time).animate({ left:0 }, time_animate, easing, callback); 2335 } 2336 }, 2337 2338 animationSwapBlocks: function(options) 2339 { 2340 var self = this; 2341 2342 var options = $.extend({}, {easing_old: 'easeInOutQuad', easing_new: 'easeOutQuad'}, options || {}); 2343 2344 this.settings.is_animating = true; 2345 var easing_old = (this.settings.easing_default == '') ? options.easing_old : this.settings.easing_default; 2346 var easing_new = (this.settings.easing_default == '') ? options.easing_new : this.settings.easing_default; 2347 var time_animate = 800 / this.settings.velocity; 2348 2349 var image_old = this.getOldImage(); 2350 2351 this.setActualLevel(); 2352 2353 this.setLinkAtual(); 2354 this.skitter_box.find('.image_main').attr({'src':this.getCurrentImage()}); 2355 this.skitter_box.find('.image_main').hide(); 2356 2357 var total = 2; 2358 var width_box = this.settings.width_skitter; 2359 var height_box = Math.ceil(this.settings.height_skitter / total); 2360 2361 // Old image 2362 var box_clone1 = this.getBoxCloneImgOld(image_old), box_clone2 = this.getBoxCloneImgOld(image_old); 2363 box_clone1.find('img').css({left:0, top:0}); 2364 box_clone1.css({top:0, left:0, width:width_box, height:height_box}); 2365 2366 box_clone2.find('img').css({left:0, top:-height_box}); 2367 box_clone2.css({top:height_box, left:0, width:width_box, height:height_box}); 2368 2369 // Next image 2370 var box_clone_next1 = this.getBoxClone(), box_clone_next2 = this.getBoxClone(); 2371 box_clone_next1.find('img').css({left:0, top:height_box});
2372 box_clone_next1.css({top:0, left:0, width:width_box, height:height_box}); 2373 2374 box_clone_next2.find('img').css({left:0, top: -(height_box * total) }); 2375 box_clone_next2.css({top:height_box, left:0, width:width_box, height:height_box}); 2376 2377 // Add boxes 2378 this.addBoxClone(box_clone_next1); 2379 this.addBoxClone(box_clone_next2); 2380 this.addBoxClone(box_clone1); 2381 this.addBoxClone(box_clone2); 2382 2383 // Show boxes 2384 box_clone1.show(); 2385 box_clone2.show(); 2386 box_clone_next1.show(); 2387 box_clone_next2.show(); 2388 2389 // Callback 2390 var callback = function() { self.finishAnimation(); }; 2391 2392 // Animations 2393 box_clone1.find('img').animate({ top: height_box }, time_animate, easing_old, function() { 2394 box_clone1.remove(); 2395 }); 2396 box_clone2.find('img').animate({ top: -(height_box * total) }, time_animate, easing_old, function() { 2397 box_clone2.remove(); 2398 }); 2399 box_clone_next1.find('img').animate({ top: 0 }, time_animate, easing_new); 2400 box_clone_next2.find('img').animate({ top: -height_box }, time_animate, easing_new, callback); 2401 }, 2402 2403 animationCut: function(options) 2404 { 2405 var self = this; 2406 2407 var options = $.extend({}, {easing_old: 'easeInOutExpo', easing_new: 'easeInOutExpo'}, options || {}); 2408 2409 this.settings.is_animating = true; 2410 var easing_old = (this.settings.easing_default == '') ? options.easing_old : this.settings.easing_default; 2411 var easing_new = (this.settings.easing_default == '') ? options.easing_new : this.settings.easing_default; 2412 var time_animate = 900 / this.settings.velocity; 2413 2414 var image_old = this.getOldImage(); 2415 2416 this.setActualLevel(); 2417 2418 this.setLinkAtual(); 2419 this.skitter_box.find('.image_main').attr({'src':this.getCurrentImage()}); 2420 this.skitter_box.find('.image_main').hide(); 2421 2422 var total = 2; 2423 var width_box = this.settings.width_skitter; 2424 var height_box = Math.ceil(this.settings.height_skitter / total); 2425 2426 // Old image 2427 var box_clone1 = this.getBoxCloneImgOld(image_old), box_clone2 = this.getBoxCloneImgOld(image_old); 2428 box_clone1.find('img').css({left:0, top:0}); 2429 box_clone1.css({top:0, left:0, width:width_box, height:height_box}); 2430 2431 box_clone2.find('img').css({left:0, top:-height_box}); 2432 box_clone2.css({top:height_box, left:0, width:width_box, height:height_box}); 2433 2434 // Next image 2435 var box_clone_next1 = this.getBoxClone(), box_clone_next2 = this.getBoxClone(); 2436 //box_clone_next1.find('img').css({left:0, top:height_box}); 2437 box_clone_next1.find('img').css({left:0, top:0}); 2438 box_clone_next1.css({top:0, left:width_box, width:width_box, height:height_box}); 2439 2440 //box_clone_next2.find('img').css({left:0, top: -(height_box * total) }); 2441 box_clone_next2.find('img').css({left:0, top: -height_box }); 2442 box_clone_next2.css({top:height_box, left:-width_box, width:width_box, height:height_box}); 2443 2444 // Add boxes 2445 this.addBoxClone(box_clone_next1); 2446 this.addBoxClone(box_clone_next2); 2447 this.addBoxClone(box_clone1); 2448 this.addBoxClone(box_clone2); 2449 2450 // Show boxes 2451 box_clone1.show(); 2452 box_clone2.show(); 2453 box_clone_next1.show(); 2454 box_clone_next2.show(); 2455 2456 // Callback 2457 var callback = function() { self.finishAnimation(); }; 2458 2459 // Animations 2460 box_clone1.animate({ left: -width_box }, time_animate, easing_old, function() { 2461 box_clone1.remove(); 2462 }); 2463 box_clone2.animate({ left: width_box }, time_animate, easing_old, function() { 2464 box_clone2.remove(); 2465 }); 2466 box_clone_next1.animate({ left: 0 }, time_animate, easing_new); 2467 box_clone_next2.animate({ left: 0 }, time_animate, easing_new, callback); 2468 }, 2469 2470 // End animations ---------------------- 2471 2472 // Finish animation 2473 finishAnimation: function (options) 2474 { 2475 var self = this; 2476 this.skitter_box.find('.image_main').show(); 2477 this.showBoxText(); 2478 this.settings.is_animating = false; 2479 this.skitter_box.find('.image_main').attr({'src': this.getCurrentImage()}); 2480 this.skitter_box.find('.image > a').attr({'href': this.settings.link_atual}); 2481 2482 if (!this.settings.is_hover_skitter_box && !this.settings.is_paused && !this.settings.is_blur) { 2483 this.timer = setTimeout(function() { self.completeMove(); }, this.settings.interval); 2484 } 2485 2486 self.startTime(); 2487 }, 2488 2489 // Complete move 2490 completeMove: function () 2491 { 2492 this.clearTimer(true); 2493 this.skitter_box.find('.box_clone').remove(); 2494 if (!this.settings.is_paused && !this.settings.is_blur) this.nextImage(); 2495 }, 2496 2497 // Actual config for animation 2498 setActualLevel: function() { 2499 if ($.isFunction(this.settings.imageSwitched)) this.settings.imageSwitched(this.settings.image_i, this); 2500 this.setImageLink(); 2501 this.addClassNumber(); 2502 this.hideBoxText(); 2503 this.increasingImage(); 2504 }, 2505 2506 // Set image and link 2507 setImageLink: function() 2508 { 2509 var name_image = this.settings.images_links[this.settings.image_i][0]; 2510 var link_image = this.settings.images_links[this.settings.image_i][1]; 2511 var label_image = this.settings.images_links[this.settings.image_i][3]; 2512 var target_link = this.settings.images_links[this.settings.image_i][4]; 2513 2514 this.settings.image_atual = name_image; 2515 this.settings.link_atual = link_image; 2516 this.settings.label_atual = label_image; 2517 this.settings.target_atual = target_link; 2518 }, 2519 2520 // Add class for number 2521 addClassNumber: function () 2522 { 2523 var self = this; 2524 this.skitter_box.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.getCurrentImage()+'" /></a>'); 2542 img_clone.attr({ 'target': this.settings.target_atual }); 2543 } 2544 else { 2545 var img_clone = $('<img src="'+this.getCurrentImage()+'" />'); 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 img_clone.find('img').width(this.settings.width_skitter); 2575 img_clone.find('img').height(this.settings.height_skitter); 2576 return img_clone; 2577 2578 }, 2579 2580 // Add box clone in skitter_box 2581 addBoxClone: function(box_clone) 2582 { 2583 this.skitter_box.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.skitter_box.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.label_animation ) { 2630 2631 case 'slideUp' : default : 2632 self.skitter_box.find('.label_skitter').slideDown(400); 2633 break; 2634 2635 case 'left' : case 'right' : 2636 self.skitter_box.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.label_animation ) { 2652 2653 case 'slideUp' : default : 2654 this.skitter_box.find('.label_skitter').slideUp(200, function() { 2655 self.setValueBoxText(); 2656 }); 2657 break; 2658 2659 case 'left' : case 'right' : 2660 var _left = ( self.settings.label_animation == 'left' ) ? -(self.skitter_box.find('.label_skitter').width()) : (self.skitter_box.find('.label_skitter').width()); 2661 self.skitter_box.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 skitter_box 2673 stopOnMouseOver: function () 2674 { 2675 var self = this; 2676 2677 if ( self.settings.stop_over ) 2678 { 2679 self.skitter_box.hover(function() { 2680 2681 if (self.settings.stop_over) self.settings.is_hover_skitter_box = 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_skitter_box = 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.skitter_box.find('.image_main').attr({'src': self.getCurrentImage()}); 2706 self.skitter_box.find('.image > a').attr({'href': self.settings.link_atual}); 2707 } 2708 }); 2709 } 2710 else 2711 { 2712 self.skitter_box.hover(function() { 2713 self.setHideTools('hover'); 2714 }, function() { 2715 self.setHideTools('out'); 2716 }); 2717 } 2718 }, 2719 2720 // Hover/out hideTools 2721 setHideTools: function( type ) { 2722 var self = this; 2723 var opacity_elements = self.settings.opacity_elements; 2724 var interval_in_elements = self.settings.interval_in_elements; 2725 var interval_out_elements = self.settings.interval_out_elements; 2726 2727 if ( type == 'hover' ) { 2728 if (self.settings.hide_tools) { 2729 if (self.settings.numbers) { 2730 self.skitter_box 2731 .find('.info_slide') 2732 .show() 2733 .css({opacity:0}) 2734 .animate({opacity: opacity_elements}, interval_in_elements); 2735 } 2736 2737 if (self.settings.navigation) { 2738 self.skitter_box 2739 .find('.prev_button, .next_button') 2740 .show() 2741 .css({opacity:0}) 2742 .animate({opacity: opacity_elements}, interval_in_elements); 2743 } 2744 2745 if (self.settings.focus && !self.settings.foucs_active) { 2746 self.skitter_box 2747 .find('.focus_button') 2748 .stop() 2749 .show().css({opacity:0}) 2750 .animate({opacity:opacity_elements}, interval_in_elements); 2751 } 2752 2753 if (self.settings.controls) { 2754 self.skitter_box 2755 .find('.play_pause_button') 2756 .stop() 2757 .show().css({opacity:0}) 2758 .animate({opacity:opacity_elements}, interval_in_elements); 2759 } 2760 } 2761 2762 if (self.settings.focus && !self.settings.foucs_active && !self.settings.hide_tools) { 2763 self.skitter_box 2764 .find('.focus_button') 2765 .stop() 2766 .animate({opacity:1}, interval_in_elements); 2767 } 2768 2769 if (self.settings.controls && !self.settings.hide_tools) { 2770 self.skitter_box 2771 .find('.play_pause_button') 2772 .stop() 2773 .animate({opacity:1}, interval_in_elements); 2774 } 2775 } 2776 else { 2777 if (self.settings.hide_tools) { 2778 if (self.settings.numbers) { 2779 self.skitter_box 2780 .find('.info_slide') 2781 .queue("fx", []) 2782 .show() 2783 .css({opacity: opacity_elements}) 2784 .animate({opacity:0}
2784, interval_out_elements); 2785 } 2786 2787 if (self.settings.navigation) { 2788 self.skitter_box 2789 .find('.prev_button, .next_button') 2790 .queue("fx", []) 2791 .show() 2792 .css({opacity: opacity_elements}) 2793 .animate({opacity:0}, interval_out_elements); 2794 } 2795 2796 if (self.settings.focus && !self.settings.foucs_active) { 2797 self.skitter_box 2798 .find('.focus_button') 2799 .stop() 2800 .css({opacity: opacity_elements}) 2801 .animate({opacity:0}, interval_out_elements); 2802 } 2803 2804 if (self.settings.controls) { 2805 self.skitter_box 2806 .find('.play_pause_button') 2807 .stop() 2808 .css({opacity: opacity_elements}) 2809 .animate({opacity:0}, interval_out_elements); 2810 } 2811 } 2812 2813 if (self.settings.focus && !self.settings.foucs_active && !self.settings.hide_tools) { 2814 self.skitter_box 2815 .find('.focus_button') 2816 .stop() 2817 .animate({opacity:0.3}, interval_out_elements); 2818 } 2819 2820 if (self.settings.controls && !self.settings.hide_tools) { 2821 self.skitter_box 2822 .find('.play_pause_button') 2823 .stop() 2824 .animate({opacity:0.3}, interval_out_elements); 2825 } 2826 } 2827 }, 2828 2829 // Stop timer 2830 clearTimer: function (force) { 2831 var self = this; 2832 clearInterval(self.timer); 2833 }, 2834 2835 // Set link atual 2836 setLinkAtual: function() { 2837 if (this.settings.link_atual != '#' && this.settings.link_atual != '') { 2838 this.skitter_box.find('.image > a').attr({'href': this.settings.link_atual, 'target': this.settings.target_atual}); 2839 } 2840 else { 2841 this.skitter_box.find('.image > a').removeAttr('href'); 2842 } 2843 }, 2844 2845 // Hide tools 2846 hideTools: function() { 2847 this.skitter_box.find('.info_slide').fadeTo(0, 0); 2848 this.skitter_box.find('.prev_button').fadeTo(0, 0); 2849 this.skitter_box.find('.next_button').fadeTo(0, 0); 2850 this.skitter_box.find('.focus_button').fadeTo(0, 0); 2851 this.skitter_box.find('.play_pause_button').fadeTo(0, 0); 2852 }, 2853 2854 // Focus Skitter 2855 focusSkitter: function() { 2856 var self = this; 2857 var focus_button = $('<a href="#" class="focus_button">focus</a>'); 2858 2859 self.skitter_box.append(focus_button); 2860 focus_button 2861 .animate({opacity:0.3}, self.settings.interval_in_elements); 2862 2863 $(document).keypress(function(e) { 2864 var code = (e.keyCode ? e.keyCode : e.which); 2865 if (code == 27) $('#overlay_skitter').trigger('click'); 2866 }); 2867 2868 var _top = $('.skitter_box').offset().top; 2869 var _left = $('.skitter_box').offset().left; 2870 2871 self.skitter_box.find('.focus_button').click(function() { 2872 if ( self.settings.foucs_active ) return false; 2873 self.settings.foucs_active = true; 2874 2875 $(this).stop().animate({opacity:0}
2875, self.settings.interval_out_elements); 2876 2877 var div = $('<div id="overlay_skitter"></div>') 2878 .height( $(document).height() ) 2879 .hide() 2880 .fadeTo(self.settings.interval_in_elements, 0.98); 2881 2882 var _topFinal = (($(window).height() - $('.skitter_box').height()) / 2) + $(document).scrollTop(); 2883 var _leftFinal = ($(window).width() - $('.skitter_box').width()) / 2; 2884 2885 self.skitter_box.before('<div id="mark_position"></div>'); 2886 $('body').prepend(div); 2887 $('body').prepend(self.skitter_box); 2888 self.skitter_box 2889 .css({'top':_top, 'left':_left, 'position':'absolute', 'z-index':9999}) 2890 .animate({'top':_topFinal, 'left':_leftFinal}, 2000, 'easeOutExpo'); 2891 2892 $('#mark_position') 2893 .width($('.skitter_box').width()) 2894 .height($('.skitter_box').height()) 2895 .css({'background':'none'}) 2896 .fadeTo(300,0.3); 2897 2898 return false; 2899 }); 2900 2901 $(document).on('click', '#overlay_skitter', function() { 2902 if ( $(this).hasClass('finish_overlay_skitter') ) return false; 2903 2904 self.settings.foucs_active = false; 2905 $(this).addClass('finish_overlay_skitter'); 2906 2907 if (!self.settings.hide_tools) self.skitter_box.find('.focus_button').animate({opacity:0.3}, 200); 2908 2909 self.skitter_box 2910 .stop() 2911 .animate({'top':_top, 'left':_left}, 200, 'easeOutExpo', function() { 2912 $('#mark_position').before(self.skitter_box); 2913 $(this).css({'position':'relative', 'top':0, 'left': 0}); 2914 $('#mark_position').remove(); 2915 }); 2916 2917 $('#overlay_skitter').fadeTo(self.settings.interval_out_elements, 0, function() { 2918 $(this).remove(); 2919 }); 2920 2921 return false; 2922 }); 2923 }, 2924 2925 /** 2926 * Controls: play and stop 2927 */ 2928 setControls: function() { 2929 var self = this; 2930 var play_pause_button = $('<a href="#" class="play_pause_button">pause</a>'); 2931 2932 self.skitter_box.append(play_pause_button); 2933 2934 play_pause_button 2935 .animate({opacity:0.3}, self.settings.interval_in_elements); 2936 2937 play_pause_button.click(function() { 2938 if (!self.settings.is_paused) { 2939 $(this).html('play'); 2940 $(this).fadeTo(100, 0.5).fadeTo(100, 1); 2941 2942 $(this).addClass('play_button'); 2943 self.pauseTime(); 2944 self.settings.is_paused = true; 2945 self.clearTimer(true); 2946 } 2947 else { 2948 if (!self.settings.is_animating && !self.skitter_box.find('.progressbar').is(':visible')) { 2949 self.settings.elapsedTime = 0; 2950 } 2951 else { 2952 self.resumeTime(); 2953 } 2954 2955 if (!self.settings.progressbar) self.resumeTime(); 2956 2957 self.settings.is_paused = false; 2958 2959 $(this).html('pause'); 2960 $(this).fadeTo(100, 0.5).fadeTo(100, 1); 2961 $(this).removeClass('play_button'); 2962 2963 if (!self.settings.stop_over) { 2964 self.clearTimer(true); 2965 if (!self.settings.is_animating && self.settings.images_links.length > 1) { 2966 self.timer = setTimeout(function() { self.completeMove(); }, self.settings.interval - self.settings.elapsedTime); 2967 self.skitter_box.find('.image_main').attr({'src': self.getCurrentImage()}); 2968 self.skitter_box.find('.image > a').attr({'href': self.settings.link_atual}); 2969 } 2970 } 2971 } 2972 2973 return false; 2974 }); 2975 }, 2976 2977 /** 2978 * Object size 2979 */ 2980 objectSize: function(obj) { 2981 var size = 0, key; 2982 for (key in obj) { if (obj.hasOwnProperty(key)) size++; } 2983 return size; 2984 }, 2985 2986 /** 2987 * Add progress bar 2988 */ 2989 addProgressBar: function() { 2990 var self = this; 2991 2992 var progressbar = $('<div class="progressbar"></div>'); 2993 self.skitter_box.append(progressbar); 2994 2995 if (self.objectSize(self.settings.progressbar_css) == 0) { 2996 if (parseInt(progressbar.css('width')) > 0) { 2997 self.settings.progressbar_css.width = parseInt(progressbar.css('width')); 2998 } 2999 else { 3000 self.settings.progressbar_css = {width: self.settings.width_skitter, height:5}; 3001 } 3002 } 3003 if (self.objectSize(self.settings.progressbar_css) > 0 && self.settings.progressbar_css.width == undefined) { 3004 self.settings.progressbar_css.width = self.settings.width_skitter; 3005 } 3006 3007 progressbar.css(self.settings.progressbar_css).hide(); 3008 }, 3009 3010 /** 3011 * Start progress bar 3012 */ 3013 startProgressBar: function() { 3014 var self = this; 3015 if (self.settings.is_hover_skitter_box || self.settings.is_paused || self.settings.is_blur || !self.settings.progressbar) return false;
3016 self.skitter_box.find('.progressbar') 3017 .hide() 3018 .dequeue() 3019 .width(self.settings.progressbar_css.width) 3020 .animate({width:'show'}, self.settings.interval, 'linear'); 3021 }, 3022 3023 /** 3024 * Pause progress bar 3025 */ 3026 pauseProgressBar: function() { 3027 var self = this; 3028 if (!self.settings.is_animating) { 3029 self.skitter_box.find('.progressbar').stop(); 3030 } 3031 }, 3032 3033 /** 3034 * Resume progress bar 3035 */ 3036 resumeProgressBar: function() { 3037 var self = this; 3038 3039 if (self.settings.is_hover_skitter_box || self.settings.is_paused || !self.settings.progressbar) return false; 3040 3041 self.skitter_box.find('.progressbar').dequeue().animate({width: self.settings.progressbar_css.width}, (self.settings.interval - self.settings.elapsedTime), 'linear'); 3042 }, 3043 3044 /** 3045 * Hide progress bar 3046 */ 3047 hideProgressBar: function() { 3048 var self = this; 3049 3050 if (!self.settings.progressbar) return false; 3051 3052 self.skitter_box.find('.progressbar').stop().fadeOut(300, function() { 3053 $(this).width(self.settings.progressbar_css.width); 3054 }); 3055 }, 3056 3057 /** 3058 * Start time 3059 */ 3060 startTime: function() { 3061 var self = this; 3062 3063 self.settings.is_paused_time = false; 3064 3065 var date = new Date(); 3066 self.settings.elapsedTime = 0; 3067 self.settings.time_start = date.getTime(); 3068 3069 // Start progress bar 3070 self.startProgressBar(); 3071 }, 3072 3073 /** 3074 * Pause time 3075 */ 3076 pauseTime: function() { 3077 var self = this; 3078 3079 if (self.settings.is_paused_time) return false; 3080 self.settings.is_paused_time = true; 3081 3082 var date = new Date(); 3083 self.settings.elapsedTime += date.getTime() - self.settings.time_start; 3084 3085 // Pause progress bar 3086 self.pauseProgressBar(); 3087 }, 3088 3089 /** 3090 * Resume time 3091 */ 3092 resumeTime: function() { 3093 var self = this; 3094 3095 self.settings.is_paused_time = false; 3096 3097 var date = new Date(); 3098 self.settings.time_start = date.getTime(); 3099 3100 // Resume progress bar 3101 self.resumeProgressBar(); 3102 }, 3103 3104 /** 3105 * Enable navigation keys 3106 */ 3107 enableNavigationKeys: function() { 3108 var self = this; 3109 $(window).keydown(function(e) { 3110 // Next 3111 if (e.keyCode == 39 || e.keyCode == 40) { 3112 self.skitter_box.find('.next_button').trigger('click'); 3113 } 3114 // Prev 3115 else if (e.keyCode == 37 || e.keyCode == 38) { 3116 self.skitter_box.find('.prev_button').trigger('click'); 3117 } 3118 }); 3119 }, 3120 3121 /** 3122 * Get box clone with background image 3123 */ 3124 getBoxCloneBackground: function(options) 3125 { 3126 var box_clone = $('<div class="box_clone"></div>'); 3127 var background_size = this.settings.width_skitter + 'px ' + this.settings.height_skitter + 'px'; 3128 3129 box_clone.css({ 3130 'left': options.left, 3131 'top': options.top, 3132 'width': options.width, 3133 'height': options.height, 3134 'background-image': 'url('+options.image+')', 3135 'background-size': background_size, 3136 'background-position': options.position.left+'px '+options.position.top+'px' 3137 }); 3138 3139 return box_clone; 3140 }, 3141 3142 /** 3143 * Shuffle array 3144 * @author Daniel Castro Machado <[email protected]> 3145 */ 3146 shuffleArray: function (arrayOrigem) { 3147 var self = this; 3148 var arrayDestino = []; 3149 var indice; 3150 while (arrayOrigem.length > 0) { 3151 indice = self.randomUnique(0, arrayOrigem.length - 1); 3152 arrayDestino[arrayDestino.length] = arrayOrigem[indice]; 3153 arrayOrigem.splice(indice, 1); 3154 } 3155 return arrayDestino; 3156 }, 3157 3158 /** 3159 * Gera números aleatórios inteiros entre um intervalo 3160 * @author Daniel Castro Machado <[email protected]> 3161 */ 3162 randomUnique: function (valorIni, valorFim) { 3163 var numRandom; 3164 do numRandom = Math.random(); while (numRandom == 1); // Evita gerar o número valorFim + 1 3165 return (numRandom * (valorFim - valorIni + 1) + valorIni) | 0; 3166 }, 3167 3168 /** 3169 * Stop on window focus out 3170 * @author Dan Partac (http://thiagosf.net/projects/jquery/skitter/#comment-355473307) 3171 */ 3172 windowFocusOut: function () { 3173 var self = this; 3174 $(window).bind('blur', function(){ 3175 self.settings.is_blur = true; 3176 self.pauseTime(); 3177 self.clearTimer(true); 3178 }); 3179 $(window).bind('focus', function(){ 3180 if ( self.settings.images_links.length > 1 ) { 3181 self.settings.is_blur = false; 3182 3183 if (self.settings.elapsedTime == 0) { 3184 self.startTime(); 3185 } 3186 else { 3187 self.resumeTime(); 3188 } 3189 3190 if (self.settings.elapsedTime <= self.settings.interval) { 3191 self.clearTimer(true); // Fix bug IE: double next 3192 self.timer = setTimeout(function() { self.completeMove(); }, self.settings.interval - self.settings.elapsedTime); 3193 self.skitter_box.find('.image_main').attr({'src': self.getCurrentImage()}); 3194 self.skitter_box.find('.image > a').attr({'href': self.settings.link_atual}); 3195 } 3196 } 3197 }); 3198 }, 3199 3200 /** 3201 * Responsive 3202 */ 3203 setResponsive: function() { 3204 if (this.settings.responsive) { 3205 var self = this; 3206 var timeout = null; 3207 $(window).on('resize', function() { 3208 clearTimeout(timeout); 3209 timeout = setTimeout(function() { 3210 self.setDimensions(); 3211 }, 200); 3212 }).trigger('resize'); 3213 } 3214 }, 3215 3216 /** 3217 * Set skitter dimensions 3218 */ 3219 setDimensions: function() { 3220 var self = this; 3221 var was_set = false;
3222 3223 this.skitter_box.css('width', '100%'); 3224 this.skitter_box.find('.image_main') 3225 .attr({ src: this.getCurrentImage() }) 3226 .css({ 'width': '100%', 'height': 'auto' }) 3227 .on('load', function() { 3228 if (!was_set) { 3229 was_set = true; 3230 _setDimensions(); 3231 } 3232 }); 3233 3234 // fallback 3235 setTimeout(function() { 3236 if (!was_set) { 3237 was_set = true; 3238 _setDimensions(); 3239 } 3240 }, 3000); 3241 3242 var _setDimensions = function() { 3243 var image = self.skitter_box.find('.image_main'); 3244 var width_box = self.skitter_box.width(); 3245 var height_box = self.skitter_box.height(); 3246 var width_image = image.width(); 3247 var height_image = image.height(); 3248 var width = width_box; 3249 var height = (height_image * width_box) / width_image; 3250 3251 if (self.settings.fullscreen) { 3252 width = $(window).width(); 3253 height = $(window).height(); 3254 } 3255 3256 self.settings.width_skitter = width; 3257 self.settings.height_skitter = height; 3258 self.skitter_box 3259 .width(width) 3260 .height(height) 3261 .find('.container_skitter') 3262 .width(width) 3263 .height(height) 3264 .find('> a img, > img') 3265 .width(width) 3266 .height(height); 3267 }; 3268 }, 3269 3270 /** 3271 * Check is large device 3272 */ 3273 isLargeDevice: function() { 3274 return $(window).width() >= 1024; 3275 }, 3276 3277 /** 3278 * Max width splits (responsive friendly) 3279 */ 3280 getMaxW: function(max_w) { 3281 // 8 == 1024px 3282 // x == 768px 3283 // y == 480px 3284 // z == 320px 3285 if (this.settings.responsive) { 3286 var window_width = $(window).width(); 3287 if (window_width <= 320) { 3288 max_w = parseInt(max_w / 4); 3289 } else if (window_width <= 480) { 3290 max_w = parseInt(max_w / 3); 3291 } else if (window_width <= 768) { 3292 max_w = parseInt(max_w / 1.5); 3293 } 3294 } 3295 return max_w; 3296 }, 3297 3298 /** 3299 * Max height splits (responsive friendly) 3300 */ 3301 getMaxH: function(max_h) { 3302 return this.getMaxW(max_h); 3303 }, 3304 3305 /** 3306 * Get current image 3307 */ 3308 getCurrentImage: function() { 3309 var image = this.settings.image_atual; 3310 return this.getImageName(image); 3311 }, 3312 3313 /** 3314 * Get old image 3315 */ 3316 getOldImage: function() { 3317 var image = this.skitter_box.find('.image_main').attr('src'); 3318 return image; 3319 }, 3320 3321 /** 3322 * Get image name for responsive (if enabled) 3323 */ 3324 getImageName: function(image) { 3325 var window_width = $(window).width(); 3326 if (this.settings.responsive) { 3327 for (var name in this.settings.responsive) { 3328 var item = this.settings.responsive[name]; 3329 if (window_width < item.max_width && item.suffix) { 3330 var extension = image.split('.').reverse()[0]; 3331 image = image.replace('.' + extension, item.suffix + '.' + extension); 3332 break; 3333 } 3334 } 3335 } 3336 return image; 3337 }, 3338 3339 /** 3340 * Touches support 3341 */ 3342 setTouchSupport: function() { 3343 var self = this; 3344 var last_position_x = 0; 3345 var last_position_x_move = 0; 3346 var isTouch = (('ontouchstart' in window) || (navigator.msMaxTouchPoints > 0)); 3347 3348 if (isTouch) { 3349 this.skitter_box.on('touchstart', function(e) { 3350 if (e.originalEvent.touches.length > 0) { 3351 last_position_x = e.originalEvent.touches[0].pageX; 3352 } 3353 }); 3354 3355 this.skitter_box.on('touchmove', function(e) { 3356 if (e.originalEvent.touches.length > 0) { 3357 last_position_x_move = e.originalEvent.touches[0].pageX; 3358 } 3359 }); 3360 3361 this.skitter_box.on('touchend', function(e) { 3362 if (last_position_x < last_position_x_move) { 3363 self.skitter_box.find('.prev_button').trigger('click'); 3364 } else { 3365 self.skitter_box.find('.next_button').trigger('click'); 3366 } 3367 }); 3368 } 3369 }, 3370 3371 /** 3372 * Get available animations (public api) 3373 */ 3374 getAnimations: function() { 3375 return this.animations; 3376 }, 3377 3378 /** 3379 * Set animation (public api) 3380 */ 3381 setAnimation: function(animation) { 3382 this.settings.animation = animation; 3383 }, 3384 3385 /** 3386 * Next (public api) 3387 */ 3388 next: function() { 3389 this.skitter_box.find('.next_button').trigger('click'); 3390 }, 3391 3392 /** 3393 * Prev (public api) 3394 */ 3395 prev: function() { 3396 this.skitter_box.find('.prev_button').trigger('click'); 3397 } 3398 }); 3399 3400 /** 3401 * Helper function for cross-browser CSS3 support, prepends 3402 * all possible prefixes to all properties passed in 3403 * @param {Object} props Ker/value pairs of CSS3 properties 3404 */ 3405 $.fn.skitterCss3 = function(props) { 3406 var css = {}; 3407 var prefixes = ['moz', 'ms', 'o', 'webkit']; 3408 for(var prop in props) { 3409 for(var i=0; i<prefixes.length; i++) 3410 css['-'+prefixes[i]+'-'+prop] = props[prop]; 3411 css[prop] = props[prop]; 3412 } 3413 this.css(css); 3414 return this; 3415 }; 3416 3417})(jQuery);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.