1/* 2 * jQuery SimpleSlider v1.0, ARG, 2023 3 */ 4 5"use strict"; 6 7var sssMyTurn; 8 9;( function($) { 10 11Array.prototype.pick = function(){ 12return this[ Math.floor( ( Math.random()*this.length ) ) ]; 13} 14 15Array.prototype.shuffle = function(){ 16for( var i=this.length-1; i>0; i-- ){ 17 var j = Math.floor( Math.random()*(i+1) ); 18 [ this[i], this[j] ] = [ this[j], this[i] ]; 19 } 20} 21 22$.fn.extend( { qcss: //// queued css, takes up to 8 property/value pairs 23function(a,b,c=0,d=0,e=0,f=0,g=0,h=0,i=0,j=0,k=0,l=0,m=0,n=0,o=0,p=0){ 24return $(this).queue( function( next ){ 25 if( a ) { $(this).css( a, b ); 26 if( c ) { $(this).css( c, d ); 27 if( e ) { $(this).css( e, f ); 28 if( g ) { $(this).css( g, h ); 29 if( i ) { $(this).css( i, j ); 30 if( k ) { $(this).css( k, l ); 31 if( m ) { $(this).css( m, n ); 32 if( o ) { $(this).css( o, p ); }}}}}}}}; 33 next(); 34 } ) ; } 35} ); 36 37function isOdd( i ){ return Math.floor(i) %2; } 38function isEven( i ){ return Math.floor(i+1) %2; } 39function sin( a ){ return Math.sin( Math.PI * 2 * a/360 ); } 40function cos( a ){ return Math.cos( Math.PI * 2 * a/360 ); } 41function tan( a ){ return Math.tan( Math.PI * 2 * a/360 ); } 42 43/* ============================================================== */ 44 45$.fn.SimpleSlider = function( options ){ 46 return this.each( function( key, value ){ 47 if( $(this).data( 'sss-slider' ) ) return $(this).data('sss-slider'); 48 $(this).data( 'sss-slider', new SimpleSlider( this, options ) ); 49 } ); 50 } 51$.fn.SimpleSlider.defaults = { 52 debug: false, 53 uid: '00000', 54 autoStart: true, 55 shuffle: false, 56 randomStart: false, 57 randomJump: false, 58 pauseHover: false, 59 arrows: true, 60 bullets: true, 61 thumbs: false, 62 pauseFocus: false, 63 oops: true, 64 startSlide: 0, 65 slideTime: 4000, //// ms 66 effectTime: 1500, //// ms 67 effect: 'random', 68 effectList: '', 69 sequenceList: '', 70 idleTime: 10, //// minutes 71 }; 72var SimpleSlider = function( element, options ){ 73var settings = $.extend( {}, $.fn.SimpleSlider.defaults, options ); 74const u = settings.uid; //// Math.round( ( Math.random()*1000000) ); 75const c = '#sss-slide-curr-' + u; //// slide 76const c2 = '#sss-slide-curr2-' + u; //// mask 77const p = '#sss-slide-prev-' + u; //// slide 78const p2 = '#sss-slide-prev2-' + u; //// mask 79const above = 'sss-slide-above'; 80const below = 'sss-slide-below'; 81const IN = 1; 82const OUT = 0; 83const slider = $( element ); 84var slides = slider.children( '.sss-slide' ).toArray(); 85var captions = slider.children( '.sss-caption' ).toArray(); 86var controls = ''; 87var bullets = ''; 88var thumbs = ''; 89var source = ''; 90var txt = ''; 91var currSlide = -2; 92var prevSlide = -3; 93var effect = ''; 94var paused = ! settings.autoStart; 95var runner = ''; 96var idler = ''; 97var delay = 0; 98var inTrans = false; 99var sound = false; 100var reverse = false; 101var ts = settings.slideTime; 102var te = settings.effectTime; 103var err = .2; 104var msg = ''; 105var src = ''; 106var w, w0, w1, w2, wi; 107var h, h0, h1, h2, hi; 108var x, x0, x1, x2; 109var y, y0, y1, y2; 110var z, z0, z1, z2; 111var a, a0, a1, a2; 112var r, r0, r1, r2; 113var axis, origin, dd; 114var beffects = Array( 'fade', 'fade', 'fade', 'fade', 'fade', 'fade', ); 115var bx, by, bz, ba; //// booleans 116var sx, sy, sz, sa; //// signs 117var tx, ty, tz, ta; //// tristates 118var rx, ry, rz, ra; //// randoms 119var mx, my; //// centered randoms 120var txt1 = '', txt2 = 'deg)'; 121var i, j, k, n, m; 122var svg, mask, svgns, maskId, svgId, transparent, transluscent, opaque, elem, elems; 123settings.debug = true; //// overrides here 124if( ! sssMyTurn ) sssMyTurn = u; 125if( settings.pauseFocus ) $(window).blur( function(){ pause( 'lost focus' ) } ); 126if( settings.shuffle ) slides.shuffle(); 127if( settings.randomStart ) settings.startSlide = Math.floor( Math.random() * slides.length ); 128if( settings.startSlide < 0 || settings.startSlide >= slides.length ) settings.startSlide = 0; 129slider.hover( 130 function(){ 131 sssMyTurn = u; 132 activity( 'hover in' ); 133 if( settings.pauseHover ) pause( 'hover in' ); 134 }, 135 function(){ 136 sssMyTurn = u; 137 activity( 'hover out' ); 138 } 139 ); 140if( settings.arrows ){ 141slider.append( '<a class="sss-corner sss-corner-upper-left" id="sss-corner-upper-left-' 142 + u + '" title="Previous"></a>' 143 + '<a class="sss-corner sss-corner-upper-right" id="sss-corner-upper-right-' 144 + u + '" title="Next"></a>' 145 + '<a class="sss-corner sss-corner-lower-left" id="sss-corner-lower-left-' 146 + u + '" title="Pause"></a>' 147 + '<a class="sss-corner sss-corner-lower-right" id="sss-corner-lower-right-' 148 + u + '" title="Play"></a>' ); 149slider.append( $( '<div id="sss-shield-' + u + '" class="sss-shield" ></div>' ) ); 150$(slider).on( 'click', 'a#sss-corner-upper-left-' + u, //// back 151 function(e){ 152 blink(this); 153 sssMyTurn = u; 154 activity( 'prev arrow' ); 155 reverse = true; 156 engine( currSlide -1, 'prev arrow', beffects.shift() ); //// pop 157 beffects = beffects.slice( 0, 40 ); 158 reverse = false;
159 } ); 160$(slider).on( 'click', 'a#sss-corner-upper-right-' + u, 161 function(e){ 162 blink(this); 163 sssMyTurn = u; 164 activity( 'next arrow' ); 165 engine( currSlide-0 +1, 'next arrow' ); //// force integer type 166 } ); 167$(slider).on( 'click', 'a#sss-corner-lower-left-' + u, 168 function(e){ 169 if( ! paused ) blink(this); 170 sssMyTurn = u; 171 activity( 'pause arrow' ); 172 pause( 'pause button' ); 173 } ); 174$(slider).on( 'click', 'a#sss-corner-lower-right-' + u, 175 function(e){ 176 if( paused ) blink(this); 177 sssMyTurn = u; 178 activity( 'play arrow' ); 179 if( paused ){ 180 paused = false; 181 engine( currSlide-0 +1, 'play arrow' ); //// force integer type 182 } 183 } ); 184$(slider).on( 'click', '#sss-shield-'+u, function(e){ log( 'click blocked' ); } ); 185} 186////slider.after( $( '<br/><p style="text-align:center;">Simple Slideshow 1.0</p><br/>' ) ); 187////if(settings.debug) slider.after( $( '<br/><p style="text-align:center;">' + dumpSettings() + '</p><br/>' ) ); 188if( 1 || settings.captions || settings.bullets || settings.thumbs ){ 189 slider.after( $( '<div id="sss-controls-' + u + '" class="sss-controls"></div>' ) ); 190 controls = $( '#sss-controls-' + u ); 191 } 192////if( settings.thumbs ) settings.bullets = false; //// both? 193if( settings.bullets ){ 194 controls.append( $( '<div id="sss-bullets-' + u + '" class="sss-bullets"></div>' ) ); 195 bullets = $( '#sss-bullets-' + u ); 196 for( i=0; i<slides.length; i++ ) 197 bullets.append( '<a class="sss-bullet" title="" rel="' + i + '">' + i + '</a>' ); 198 $( 'a', bullets ).bind( 'click', function(){ 199 sssMyTurn = u; 200 if( $(this).attr( 'rel' ) == currSlide ) return; 201 engine( $(this).attr( 'rel' ), 'bullets' ); 202 activity( 'bullets' ); 203 } ); 204 } 205if( settings.captions ) 206 controls.append( $( '<div id="sss-caption-active-' + u 207 + '" class="sss-caption-active"></div>' ) ); 208if( settings.thumbs ){ 209 controls.append( $( '<div id="sss-thumbs-' + u + '" class="sss-thumbs"></div>' ) ); 210 thumbs = $( '#sss-thumbs-' + u ); 211 for( i=0; i<slides.length; i++ ) 212 thumbs.append( '<div class="sss-thumb"><a class="sss-thumb" rel="' + i 213 + '"><img src="' + $( slides[i] ).attr('thumb') 214 + '" alt="" title="" class="sss-thumb"/></a></div>' ); 215 $( 'a', thumbs ).bind( 'click', function(){ 216 sssMyTurn = u; 217 if( $(this).attr( 'rel' ) == currSlide ) return; 218 engine( $(this).attr( 'rel' ), 'thumbs' ); 219 activity( 'thumbs' ); 220 } ); 221 } 222engine( settings.startSlide, 'startup' ); 223activity( 'startup' ); 224 225/* ============================================================== */ 226 227function engine( newSlide, msg='', beffect='' ){ ////alert(newSlide); 228if( inTrans || slides.length < 2 ) return ; 229if( sssMyTurn != u && msg != 'startup' ){ 230 pause( 'engine' ); 231 return; 232 } 233if( ! paused ){ 234 if( runner ) clearTimeout( runner ); 235 runner = setInterval( function(){ engine( currSlide+1, 'auto' ); }, ts ); 236 } 237if( settings.randomJump ) newSlide = Math.floor( Math.random() * slides.length ); 238else if( currSlide == newSlide ) return; 239else if( newSlide < 0 ) newSlide = slides.length-1; 240else if( newSlide > slides.length-1 ) newSlide = 0; 241transIn( msg ); 242w = parseFloat( $(slider).css('width') ); 243h = parseFloat( $(slider).css('height') ); 244wi = Math.round( w ); 245hi = Math.round( h ); 246x0 = x1 = x2 = y0 = y1 = y2 = z0 = z1 = z2 = a0 = a1 = a2 = 0; 247bx = Array( 0, 1 ).pick(); 248by = Array( 0, 1 ).pick(); 249bz = Array( 0, 1 ).pick(); 250ba = Array( 0, 1 ).pick(); 251sx = Array( 1, -1 ).pick(); 252sy = Array( 1, -1 ).pick(); 253sz = Array( 1, -1 ).pick(); 254sa = Array( 1, -1 ).pick(); 255tx = Array( 1, 0, -1 ).pick(); 256ty = Array( 1, 0, -1 ).pick(); 257tz = Array( 1, 0, -1 ).pick(); 258ta = Array( 1, 0, -1 ).pick(); 259rx = Math.random(); 260ry = Math.random(); 261rz = Math.random(); 262ra = Math.random(); 263mx = .8 * rx + .1; 264my = .8 * ry + .1; 265axis = '1,1,1'; 266dd = Array( '000', '045', '090', '135', '180', '225', '270', '315' ); 267i = j = k = n = m = 0; 268if( currSlide < 0 ) currSlide = newSlide-0; //// force integer type 269prevSlide = currSlide-0; 270currSlide = newSlide-0; 271$(c).remove(); 272$(p).remove(); 273$(c2).remove(); 274$(p2).remove(); 275svgId = 'sss-svg-' + u; 276maskId = 'sss-mask-' + u; 277$( '.' + svgId ).remove(); 278$( '.' + maskId ).remove(); 279slider.append( $( '<div id="' + c.replace( '#', '' ) 280 + '" class="sss-slide sss-slide-curr sss-vcenter" ></div>' ) ); 281slider.append( $( '<div id="' + p.replace( '#', '' ) 282 + '" class="sss-slide sss-slide-prev sss-vcenter"></div>' ) ); 283$(c).html( $( slides[currSlide] ).html() ); 284$(p).html( $( slides[prevSlide] ).html() ); 285if( settings.bullets ){ 286 bullets = $( '#sss-bullets-' + u ); 287 $( 'a', bullets ).removeClass( 'active' ); 288 $( 'a:eq(' + currSlide + ')', bullets ).addClass( 'active' ); 289 } 290if( settings.captions ){ 291 source = $( slides[currSlide] ).attr( 'caption' ); 292 txt = $( '#' + source ).html(); 293 if( txt == '' ) txt = ' '; 294 $( '#sss-caption-active-' + u ).animate( { opacity: 0 }, te/2, function(){ 295 $( '#sss-caption-active-' + u ).html( txt ).animate( { opacity: 1 }, te/2 ); 296 } ); 297 } 298if( settings.thumbs ){ 299 thumbs = $( '#sss-thumbs-' + u ); 300 $( 'a:eq(' + prevSlide + ')', thumbs ).animate( { opacity: 1 }, te ); 301 $( 'a:eq(' + currSlide + ')', thumbs ).animate( { opacity: .25 }, te ); 302 } 303transmission( msg, beffect ); 304////log( 'engine: ' + '[' + u + ']\n' + msg + '(' + newSlide + ') ' + effect + '(' + te + ') ' ); 305} 306 307/* ============================================================== */ 308 309function blink( elem, msg='' ){ $(elem).hide(0).delay(150).show(0); } 310 311function transIn( msg='' ){ 312inTrans = setTimeout( function(){ transOut( msg='shield timed out' ); }, te*3 ); 313$( '#sss-shield-' + u ).qcss( 'display', 'block' ); 314} 315 316function transOut( msg='' ){ 317if( inTrans ) clearTimeout( inTrans ); 318inTrans = false;
319$( '#sss-shield-' + u ).delay(200).qcss( 'display', 'none' ); 320if(settings.debug) log( msg ); 321} 322 323function dumpSettings(){ 324$tmp = JSON.stringify( settings, null, 4 ); 325log( $tmp ); 326return '<pre>' + $tmp + '</pre>'; 327} 328 329function activity( msg='' ){ 330if( settings.idleTime <= 0 ) return; 331if( idler ) clearTimeout( idler ); 332idler = setTimeout( function(){ pause( 'no activity' ); }, settings.idleTime * 60 * 1000 ); 333} 334 335function pause( msg='' ){ if( runner ) clearTimeout( runner ); paused = true; } 336 337function playSound( file='' ){ 338sound = document.createElement( 'audio' ); 339if( file ){ 340 src = document.getElementById( 'SimpleSliderScript-js' ).src; 341 src = src.substring( 0, src.indexOf( '/assets' ) ) + 'assets/' + file; 342 sound.setAttribute( 'src', src ); 343 if( te < 1000 ) te = 1000; 344 sound.play(); 345 } 346sound.remove(); 347} 348 349function log( msg ){ if(settings.debug) console.log( '\n\n' + msg + '\n\n' ); } 350 351/* ============================================================== */ 352 353function svgSetup(){ //// return false; 354 355if( ! svg_support() ){ 356 $(p).qcss( 'opacity', 0 ) 357 .delay(10) 358 .qcss( 'opacity', 1 ) 359 .animate( { opacity: 0 }, te ); 360 $(c).qcss( 'opacity', 0 ) 361 .animate( { opacity: 1 }, { 362 duration: te, 363 complete: function(){ transOut( 'svgSetup: (' + effect + ')' ); }, 364 } ); 365 return false; 366 } 367 368svgns = 'http://www.w3.org/2000/svg'; 369svg = document.createElementNS( svgns, 'svg' ); 370svg.setAttributeNS( null, 'class', svgId ); 371svg.setAttributeNS( null, 'viewBox', '0 0 ' + Math.floor(w+1) + ' ' + Math.floor(h+1) ); 372svg.setAttributeNS( null, "width", Math.floor(w+1) ); 373svg.setAttributeNS( null, "height", Math.floor(h+1) ); 374slider.append( svg ); 375mask = document.createElementNS( svgns, 'mask' ); 376mask.setAttributeNS( null, 'id', maskId ); 377transparent = '#000000'; 378transluscent = '#a0a0a0'; 379opaque = '#ffffff'; 380svgRect( 0, 0, w+1, h+1, opaque ); 381mask.appendChild( elem ); 382svg.appendChild( mask ); 383$(p).addClass( maskId ); 384$(p).addClass( above ); 385elems = []; 386return true; 387} 388 389//// chrome & all derivatives are defective 390function svg_support(){ return true; 391var isChrome=false, isFirefox=false, isSafari=false; 392isChrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1; 393isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1; 394isSafari = navigator.userAgent.toLowerCase().indexOf('safari') > -1; 395if( isChrome || ( ! ( isFirefox || isSafari ) ) ) return false; 396return true; 397} 398 399//// https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Basic_Shapes 400 401function svgRect( x=0, y=0, w=0, h=0, f=transparent, sw=0, s=transluscent, rx=0, ry=0 ){ 402elem = document.createElementNS( svgns, 'rect' ); 403elem.setAttributeNS( null, 'x', Math.round(x) ); 404elem.setAttributeNS( null, 'y', Math.round(y) ); 405elem.setAttributeNS( null, 'width', Math.round(w) ); 406elem.setAttributeNS( null, 'height', Math.round(h) ); 407elem.setAttributeNS( null, 'fill', f ); 408elem.setAttributeNS( null, 'stroke-width', Math.round(sw) ); 409elem.setAttributeNS( null, 'stroke', s ); 410elem.setAttributeNS( null, 'rx', Math.round(rx) ); 411elem.setAttributeNS( null, 'ry', Math.round(ry) ); 412mask.appendChild( elem ); 413return elem; 414} 415 416function svgCircle( cx=0, cy=0, r=0, f=transparent, sw=0, s=transluscent ){ 417elem = document.createElementNS( svgns, 'circle' ); 418elem.setAttributeNS( null, 'cx', Math.round(cx) ); 419elem.setAttributeNS( null, 'cy', Math.round(cy) ); 420elem.setAttributeNS( null, 'r', Math.round(r) ); 421elem.setAttributeNS( null, 'fill', f ); 422elem.setAttributeNS( null, 'stroke-width', Math.round(sw) ); 423elem.setAttributeNS( null, 'stroke', s ); 424mask.appendChild( elem ); 425return elem; 426} 427 428function svgEllipse( cx=0, cy=0, rx=0, ry0, f=transparent, sw=0, s=transluscent ){ 429elem = document.createElementNS( svgns, 'ellipse' ); 430elem.setAttributeNS( null, 'cx', Math.round(cx) ); 431elem.setAttributeNS( null, 'cy', Math.round(cy) ); 432elem.setAttributeNS( null, 'rx', Math.round(rx) ); 433elem.setAttributeNS( null, 'ry', Math.round(ry) ); 434elem.setAttributeNS( null, 'fill', f ); 435elem.setAttributeNS( null, 'stroke-width', Math.round(sw) ); 436elem.setAttributeNS( null, 'stroke', s ); 437mask.appendChild( elem ); 438return elem; 439} 440 441function svgPolygon( points='', f=transparent, sw=0, s=transluscent ){ 442elem = document.createElementNS( svgns, 'polygon' ); 443elem.setAttributeNS( null, 'points', points ); 444elem.setAttributeNS( null, 'fill', f ); 445elem.setAttributeNS( null, 'stroke-width', Math.round(sw) ); 446elem.setAttributeNS( null, 'stroke', s ); 447mask.appendChild( elem ); 448return elem; 449} 450
451function svgLine( x1=0, y1=0, x2=0, y2=0, sw=1, s=transparent ){ 452elem = document.createElementNS( svgns, 'line' ); 453elem.setAttributeNS( null, 'x1', Math.round(x1) ); 454elem.setAttributeNS( null, 'y1', Math.round(y1) ); 455elem.setAttributeNS( null, 'x2', Math.round(x2) ); 456elem.setAttributeNS( null, 'y2', Math.round(y2) ); 457elem.setAttributeNS( null, 'stroke-width', Math.round(sw) ); 458elem.setAttributeNS( null, 'stroke', s ); 459mask.appendChild( elem ); 460return elem; 461} 462 463function svgPolyline( points='', f=transparent, sw=1, s=transluscent ){ 464elem = document.createElementNS( svgns, 'polyline' ); 465elem.setAttributeNS( null, 'points', points ); 466elem.setAttributeNS( null, 'fill', f ); 467elem.setAttributeNS( null, 'stroke-width', Math.round(sw) ); 468elem.setAttributeNS( null, 'stroke', s ); 469mask.appendChild( elem ); 470return elem; 471} 472 473function svgPath( path='', f=transparent, sw=1, s=transluscent ){ 474elem = document.createElementNS( svgns, 'path' ); 475elem.setAttributeNS( null, 'd', path ); 476elem.setAttributeNS( null, 'fill', f ); 477elem.setAttributeNS( null, 'stroke-width', Math.round(sw) ); 478elem.setAttributeNS( null, 'stroke', s ); 479mask.appendChild( elem ); 480return elem; 481} 482 483//// https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths 484 485/* ============================================================== */ 486/* select transition effect */ 487/* ============================================================== */ 488 489function transmission( msg='', beffect='' ){ 490var tmp; 491if( ! beffect ) { 492if( settings.effect == 'random1' ){ tmp = Array( //// settings.effect = Array( 493 'fade', 'flash', 'dodge', 'wipe', 'blackout', 'blur', //// 'snap', 494 'bloat', 'glide', 'zoom', 'scoot', 'pivot', 'push', 'flip', 495 'roll', 'twirl', 'spin', 'skew', 'swing', 'deal', 'bounce', 496 'cube', 'box', 'whirl', 'wheel', 'mesh', 'peel', 'slew', 'crush', 'fold', 497 ////'filmstrip', 'fall', 'projector', 'flush', 'trash', 'viewmaster', 'register', //// sound 498 'filmstrip2', 'fall2', 'projector2', 'flush2', 'trash2', 'viewmaster2', 'register2', //// no sound 499 ////'rain', 'boxes', 'strips', 'spot', 'radar', 'burst', 'blinds', 'rings', 'flood', 'scribble', 'confetti', 500 );////.pick(); 501 if( svg_support() ) tmp.push( 'rain', 'boxes', 'strips', 'spot', 'radar', 'burst', 'blinds', 'rings', 'flood', 'scribble', 'confetti' ); settings.effect = tmp.pick(); 502 } 503if( settings.effect == 'calm1' ){ tmp = Array( //// settings.effect = Array( 504 'fade', 'wipe', 'blur', 'zoom', //// 'spin', //// 'snap', 505 'bloat', 'glide', 'pivot', 'push', 'flip', 'wheel', 'crush', 506 'roll', 'twirl', 'swing', 'deal', 'cube', 'box', 'mesh', 'peel', 'fold', 507 ////'rain', 'boxes', 'strips', 'spot', 'radar', 'blinds', 'flood', 'scribble', 'confetti', 508 );////.pick(); 509 if( svg_support() ) tmp.push( 'rain', 'boxes', 'strips', 'spot', 'radar', 'blinds', 'flood', 'scribble', 'confetti' ); settings.effect = tmp.pick(); 510 settings.oops = false; 511 } 512effect = settings.effect; 513if( testEffect() ) effect = testEffect(); 514if( effect == 'custom' ) 515 effect = settings.effectList.split(',').pick(); 516else if( effect == 'sequence' ){ 517 effects = settings.sequenceList.split(','); 518 if( ++k > effects.length ) k = 0; 519 effect = effects[k]; 520 } 521if( msg == 'startup' ) effect = 'snap'; 522if( ! effect ) { 523 msg = 'ERROR: no effect selected'; 524 effect = 'snap'; 525 } 526switch( effect ){ case 527'random': tmp = Array( //// effect = Array( 528 'fade', 'flash', 'dodge', 'wipe', 'blur', 'blackout', 529 'bloat', 'glide', 'zoom', 'scoot', 'pivot', 'push', 'flip', 'fold', 530 'roll', 'twirl', 'spin', 'skew', 'swing', 'deal', 'bounce', 'crush', 531 ////'filmstrip', 'fall', 'projector', 'flush', 'trash', 'viewmaster', 'register', //// sound 532 'filmstrip2', 'fall2', 'projector2', 'flush2', 'trash2', 'viewmaster2', 'register2', //// no sound 533 'cube', 'box', 'stretch', 'whirl', 'wheel', 'mesh', 'peel', 'slew', 534 ////'rain', 'boxes', 'strips', 'spot', 'radar', 'burst', 'blinds', 'rings', 'flood', 'scribble', 'confetti', 535 );////.pick(); 536 if( svg_support() ) tmp.push( 'rain', 'boxes', 'strips', 'spot', 'radar', 'burst', 'blinds', 'rings', 'flood', 'scribble', 'confetti' ); 537 effect = tmp.pick(); 538 break; case 539'calm': tmp = Array( //// effect = Array( 540 'fade', 'wipe', 'blur', 'zoom', 'peel', 'box', 541 'bloat', 'glide', 'pivot', 'push', 'flip', 'mesh', 'fold', 542 'roll', 'twirl', 'swing', 'deal', 'cube', 'wheel', 'crush', 543 ////'rain', 'boxes', 'strips', 'spot', 'radar', 'blinds', 'rings', 'flood', 'scribble', 'confetti', 544 );////.pick(); 545 if( svg_support() ) tmp.push( 'rain', 'boxes', 'strips', 'spot', 'radar', 'blinds', 'rings', 'flood', 'scribble', 'confetti' ); 546 effect = tmp.pick(); 547 settings.oops = false;
548 break; case 549'all-in': effect = Array( 550 'dodge-in', 'bloat-in', 'glide-in', 'zoom-in', 'scoot-in', 'peel-in', 'push', 551 'roll-in', 'twirl-in', 'spin-in', 'skew-in', 'pivot-in', 'swing-in', 'crush', 552 'deal-in-090', 'deal-in-270', 'wipe-in-c', 'wheel-in', 'peel-in,', 'slew-in', 553 ).pick(); 554 break; case 555'all-out': effect = Array( 556 'dodge-out', 'bloat-out', 'glide-out', 'zoom-out', 'scoot-out', 'stretch', 557 'roll-out', 'twirl-out', 'spin-out', 'skew-out', 'pivot-out', 'swing-out', 558 'deal-out-up-090', 'deal-out-315', 'deal-out-135', 'deal-out-225', 'slew-out', 559 'wipe-out-c', 'wheel-out', 'peel-out', 560 ).pick(); 561 break; case 562'1d': effect = Array( 563 'fade', 'flash', 'wipe', 'blur', 'blackout', 'peel', 'whirl', 'bloat', 'slew', 564 ////'rain', 'boxes', 'strips', 'spot', 'radar', 'burst', 'rings', 'scribble', 'confetti', 565 ).pick(); 566 break; case 567'2d': effect = Array( 568 'glide', 'push', 'pivot', 'swing', 'deal', 'skew', 'stretch', 'crush', 569 ).pick(); 570 break; case 571'1d2d': effect = Array( 572 'fade', 'flash', 'wipe', 'blur', 'blackout', 'peel', 'whirl', 'bloat', 573 'glide', 'push', 'pivot', 'swing', 'deal', 'skew', 'stretch', 'slew', 'crush', 'fold', 574 ).pick(); 575 break; case 576'3d': effect = Array( 577 'flip', 'cube', 'roll', 'spin', 'zoom', 'bounce', 'twirl', 'scoot', 'wheel', 'mesh', 'box', 'fold', 578 ).pick(); 579 break; case 580'edges': effect = Array( 581 'glide-in-000', 'glide-in-180', 'glide-in-270', 'glide-in-090', 582 'glide-out-000', 'glide-out-180', 'glide-out-270', 'glide-out-090', 583 'dodge-in-000', 'dodge-in-180', 'dodge-in-270', 'dodge-in-090', 584 'dodge-out-000', 'dodge-out-180', 'dodge-out-270', 'dodge-out-090', 585 'zoom-in-000', 'zoom-in-180', 'zoom-in-270', 'zoom-in-090', 586 'zoom-out-000', 'zoom-out-180', 'zoom-out-270', 'zoom-out-090', 587 'spin-in-000', 'spin-in-180', 'spin-in-270', 'spin-in-090', 588 'spin-out-000', 'spin-out-180', 'spin-out-270', 'spin-out-090', 589 'roll-in-000', 'roll-in-180', 'roll-in-270', 'roll-in-090', 590 'roll-out-000', 'roll-out-180', 'roll-out-270', 'roll-out-090', 591 'pivot-in-000', 'pivot-in-180', 'pivot-in-270', 'pivot-in-090', 592 'pivot-out-000', 'pivot-out-180', 'pivot-out-270', 'pivot-out-090', 593 'swing-in-000', 'swing-in-180', 'swing-in-270', 'swing-in-090', 594 'swing-out-000', 'swing-out-180', 'swing-out-270', 'swing-out-090', 595 'skew-in-000', 'skew-in-180', 'skew-in-270', 'skew-in-090', 596 'skew-out-000', 'skew-out-180', 'skew-out-270', 'skew-out-090', 597 'scoot-in-000', 'scoot-in-180', 'scoot-in-270', 'scoot-in-090', 598 'scoot-out-000', 'scoot-out-180', 'scoot-out-270', 'scoot-out-090', 599 'wheel-in-000', 'wheel-in-180', 'wheel-in-270', 'wheel-in-090', 600 'wheel-out-000', 'wheel-out-180', 'wheel-out-270', 'wheel-out-090', 601 'mesh-in-000', 'mesh-in-180', 'mesh-in-270', 'mesh-in-090', 602 'mesh-out-000', 'mesh-out-180', 'mesh-out-270', 'mesh-out-090', 603 'crush-000', 'crush-180', 'crush-270', 'crush-090', 604 'push-000', 'push-180', 'push-270', 'push-090', 605 'deal-in-090', 'deal-in-270', 606 ).pick(); 607 break; case 608'left-right': effect = Array( 609 'glide-in-270', 'glide-in-090', 'glide-out-270', 'glide-out-090', 610 'dodge-in-270', 'dodge-in-090', 'dodge-out-270', 'dodge-out-090', 611 'zoom-in-270', 'zoom-in-090', 'zoom-out-270', 'zoom-out-090', 612 'spin-in-270', 'spin-in-090', 'spin-out-270', 'spin-out-090', 613 'roll-in-270', 'roll-in-090', 'roll-out-270', 'roll-out-090', 614 'pivot-in-270', 'pivot-in-090', 'pivot-out-270', 'pivot-out-090', 615 'swing-in-270', 'swing-in-090', 'swing-out-270', 'swing-out-090', 616 'skew-in-270', 'skew-in-090', 'skew-out-270', 'skew-out-090', 617 'scoot-in-270', 'scoot-in-090', 'scoot-out-270', 'scoot-out-090', 618 'deal-in-090', 'deal-in-270', 'push-270', 'push-090', 619 'cube-090', 'cube-270', 'box-270', 'box-090', 620 'stretch-270', 'stretch-090', 'crush-270', 'crush-090', 621 'wheel-in-270', 'wheel-in-090', 'wheel-out-270', 'wheel-out-090', 622 'deal-out-045', 'deal-out-315', 623 'deal-out-135', 'deal-out-225', 624 //'strips-090', 'strips-270' 625 ).pick(); 626 break; case 627'top-bottom': effect = Array( 628 'glide-in-000', 'glide-in-180', 'glide-out-000', 'glide-out-180', 629 'dodge-in-000', 'dodge-in-180', 'dodge-out-000', 'dodge-out-180', 630 'zoom-in-000', 'zoom-in-180', 'zoom-out-000', 'zoom-out-180', 631 'spin-in-000', 'spin-in-180', 'spin-out-000', 'spin-out-180', 632 'roll-in-000', 'roll-in-180', 'roll-out-000', 'roll-out-180', 633 'pivot-in-000', 'pivot-in-180', 'pivot-out-000', 'pivot-out-180', 634 'swing-in-000', 'swing-in-180', 'swing-out-000', 'swing-out-180', 635 'scoot-in-000', 'scoot-in-180', 'scoot-out-000', 'scoot-out-180', 636 'skew-in-000', 'skew-in-180', 'skew-out-000', 'skew-out-180', 637 'push-180', 'push-000', 'viewmaster2', 'filmstrip2', 638 'cube-180', 'cube-000', 'box-180', 'box-000', 639 'stretch-180', 'stretch-000', 'crush-000', 'crush-180', 640 'wheel-in-000', 'wheel-in-180', 'wheel-out-000', 'wheel-out-180', 641 //'strips-000', 'strips-180' 642 ).pick(); 643 break; case 644'corners': effect = Array( 645 'glide-in-315', 'glide-in-045', 'glide-in-225', 'glide-in-135', 646 'glide-out-315', 'glide-out-045', 'glide-out-225', 'glide-out-135', 647 'dodge-in-315', 'dodge-in-045', 'dodge-in-225', 'dodge-in-135', 648 'dodge-out-315', 'dodge-out-045', 'dodge-out-225', 'dodge-out-135', 649 'zoom-in-315', 'zoom-in-045', 'zoom-in-225', 'zoom-in-135', 650 'zoom-out-315', 'zoom-out-045', 'zoom-out-225', 'zoom-out-135', 651 'roll-in-315', 'roll-in-045', 'roll-in-225', 'roll-in-135', 652 'roll-out-315', 'roll-out-045', 'roll-out-225', 'roll-out-135', 653 'wheel-in-315', 'wheel-in-045', 'wheel-in-225', 'wheel-in-135', 654 'wheel-out-315', 'wheel-out-045', 'wheel-out-225', 'wheel-out-135', 655 'spin-in-315', 'spin-in-045', 'spin-in-225', 'spin-in-135', 656 'spin-out-315', 'spin-out-045', 'spin-out-225', 'spin-out-135', 657 'wipe-in-315', 'wipe-in-045', 'wipe-in-225', 'wipe-in-135',
658 'wipe-out-315', 'wipe-out-045', 'wipe-out-225', 'wipe-out-135', 659 'crush-315', 'crush-045', 'crush-225', 'crush-225', 660 'push-315', 'push-045', 'push-225', 'push-225', 661 //'radar-c-315', 'radar-c-045', 'radar-c-225', 'radar-c-135', 662 //'radar-cc-315', 'radar-cc-045', 'radar-cc-225', 'radar-cc-135', 663 //'burst-315', 'burst-045', 'burst-225', 'burst-135', 664 ).pick(); 665 break; case 666'centers': effect = Array( 667 'fade', 'fade', ' bloat', 'bounce', 'wipe', 'roll3', 'blur', 'flip', 'cube', 'whirl', 'mesh', 668 'bounce-m2', 'bounce-m3', 'peel', 'box', 'slew', 'crush', 'fold', 669 'wipe-in-c', 'wipe-out-c', 'wipe-in-h', 'wipe-out-h', 'wipe-in-v', 'wipe-out-v', 670 'wheel-in-000', 'wheel-in-180', 'wheel-in-270', 'wheel-in-090', 671 'wheel-out-000', 'wheel-out-180', 'wheel-out-270', 'wheel-out-090', 672 'zoom-in-m', 'zoom-out-m', 'spin-in-m', 'spin-out-m', 673 'roll-in', 'roll-out', 'twirl-in', 'twirl-out', 674 ////'rain', 'boxes', 'strips', 'spot', 'radar', 'burst', 'blinds', 'rings', 'flood', 'scribble', 'confetti', 675 ).pick(); 676 break; case 677'left-to-right': effect = Array( 678 'glide-in-270', 'glide-out-090', 'dodge-in-270', 'dodge-out-090', 679 'zoom-in-270', 'zoom-out-090', 'spin-in-270', 'spin-out-090', 680 'roll-in-270', 'roll-out-090', 'pivot-in-270', 'pivot-out-090', 681 'swing-in-270', 'swing-out-090', 'scoot-in-270', 'scoot-out-090', 682 'skew-in-270', 'skew-out-090', 'peel-in-270', 'peel-out-090', 683 'deal-in-270', 'deal-out-045', 'deal-out-135', 684 'wipe-090', 'push-090', 'cube-090', 'stretch-090', 685 'box-090', 'crush-270', 'fold-270', 686 //'strips-270' 687 ).pick(); 688 break; case 689'top-to-bottom': effect = Array( 690 'glide-in-000', 'glide-out-180', 'dodge-in-000', 'dodge-out-180', 691 'zoom-in-000', 'zoom-out-180', 'spin-in-000', 'spin-out-180', 692 'roll-in-000', 'roll-out-180', 'pivot-in-000', 'pivot-out-180', 693 'swing-in-000', 'swing-out-180', 'scoot-in-000', 'scoot-out-180', 694 'skew-in-000', 'skew-out-180', 'push-000', 'viewmaster2', 695 'filmstrip2', 'box-000', 'cube-000', 'stretch-000', 696 'crush-000', 'peel-in-000', 'peel-out-000', 'fold-000', 697 //'strips-000' 698 ).pick(); 699 break; case 700'top-left-to-bottom-right': effect = Array( 701 'glide-in-315', 'glide-out-135', 'dodge-in-315', 'dodge-out-135', 702 'zoom-in-315', 'zoom-out-135', 'roll-in-315', 'roll-out-135', 703 'wheel-in-315', 'wheel-out-135', 'spin-in-315', 'spin-out-135', 704 'wipe-in-315', 'wipe-out-135', ////'skew-in-315', 'skew-out-135', 705 'crush-315', 'push-315', 706 ).pick(); 707 break; case 708'svg': effect = Array( 709 'rain', 'boxes', 'strips', 'spot', 'radar', 'burst', 'blinds', 'rings', 'flood', 'scribble', 'confetti', 710 ).pick(); 711 break; 712} 713if( msg != 'startup' ) beffects.unshift( effect ); //// push 714} //// if( ! beffect ) 715else effect = beffect; 716////if( settings.debug ) log( effect + ' start' ); 717switch( effect ) { case 718'snap': snap( msg ); break; case 719'fade': fade( msg ); break; case 720'blackout': blackout(); break; case 721'blinds': blinds(); break; case 722'blinds-v': blinds('v'); break; case 723'blinds-h': blinds('h'); break; case 724'bloat': bloat( ); break; case 725'bloat-in': bloat( IN ); break; case 726'bloat-out': loat( OUT ); break; case 727'blur': blur(); break; case 728'bounce': bounce( ); break; case 729'bounce-c': bounce( ta, .5, .5 ); break; case 730'bounce-m': bounce( ta, rx, ry ); break; case 731'bounce-edges': bounce( ta, sx, sy ); break; case 732'bounce2': bounce( 0 ); break; case 733'bounce-c2': bounce( 0, .5, .5 ); break; case 734'bounce-m2': bounce( 0, mx, my ); break; case 735'bounce3': bounce( sa, ); break; case 736'bounce-c3': bounce( sa, .5, .5 ); break; case 737'bounce-m3': bounce( sa, mx, my ); break; case 738'box': cube( '', sx, -1 ); break; case 739'box-h': cube( 'h', sx, -1 ); break; case 740'box-000': cube( 'v', -1, -1 ); break; case 741'box-090': cube( 'h', 1, -1 ); break; case 742'box-180': cube( 'v', 1, -1 ); break; case 743'box-270': cube( 'h', -1, -1 ); break; case 744'box-v': cube( 'v', sx, -1 ); break; case 745'boxes': boxes(); break; case 746'boxes-all': boxes( 'all'); break; case 747'boxes-all-6': boxes( 'all', 6 ); break; case 748'boxes-all-12': boxes( 'all', 12 ); break; case 749'boxes-all-24': boxes( 'all', 24 ); break; case 750'boxes-all-48': boxes( 'all', 48 ); break; case 751'boxes-all-96': boxes( 'all', 96 ); break; case 752'boxes-alt': boxes( 'alt'); break; case 753'boxes-alt-6': boxes( 'alt', 6 ); break; case 754'boxes-alt-12': boxes( 'alt', 12 ); break; case 755'boxes-alt-24': boxes( 'alt', 24 ); break; case 756'boxes-alt-48': boxes( 'alt', 48 ); break; case 757'boxes-alt-96': boxes( 'alt', 96 ); break; case 758'burst': burst(); break; case 759'burst-c': burst('c'); break; case 760'burst-m': burst('m'); break; case 761'burst-000': burst( '000' ); break; case 762'burst-045': burst( '045' ); break; case 763'burst-090': burst( '090' ); break; case 764'burst-135': burst( '135' ); break; case 765'burst-180': burst( '180' ); break; case 766'burst-225': burst( '225' ); break; case 767'burst-270': burst( '270' ); break; case 768'burst-315': burst( '315' ); break; case 769'confetti': confetti(); break; case 770'crush': crush( ); break; case 771'crush-000': crush( '000' ); break; case 772'crush-045': crush( '045' ); break; case 773'crush-090': crush( '090' ); break; case 774'crush-135': crush( '135' ); break; case 775'crush-180': crush( '180' ); break; case 776'crush-225': crush( '225' ); break; case 777'crush-270': crush( '270' ); break; case 778'crush-315': crush( '315' ); break; case 779'cube': cube( ); break; case 780'cube-h': cube( 'h', ); break; case 781'cube-000': cube( 'v', -1 ); break; case 782'cube-090': cube( 'h', 1 ); break; case 783'cube-180': cube( 'v', 1 ); break; case 784'cube-270': cube( 'h', -1 ); break; case 785'cube-v': cube( 'v', ); break; case 786'deal': deal( ); break; case 787'deal-in-090': deal( 'in-090' ); break; case 788'deal-in-270': deal( 'in-270' ); break; case 789'deal-out-045': deal( 'out-045' ); break; case 790'deal-out-135': deal( 'out-135' ); break; case 791'deal-out-225': deal( 'out-225' ); break; case 792'deal-out-315': deal( 'out-315' ); break; case 793'dodge': dodge( ); break; case 794'dodge-in': dodge( IN ); break; case 795'dodge-in-000': dodge( IN, 0, -1 ); break; case 796'dodge-in-045': dodge( IN, 1, -1 ); break; case 797'dodge-in-090': dodge( IN, 1, 0 ); break; case 798'dodge-in-135': dodge( IN, 1, 1 ); break; case 799'dodge-in-180': dodge( IN, 0, 1 ); break; case 800'dodge-in-225': dodge( IN, -1, 1 ); break; case 801'dodge-in-270': dodge( IN, -1, 0 ); break; case 802'dodge-in-315': dodge( IN, -1, -1 ); break; case 803'dodge-out': dodge( OUT ); break; case 804'dodge-out-000': dodge( OUT, 0, -1 ); break; case 805'dodge-out-045': dodge( OUT, 1, -1 ); break; case 806'dodge-out-090': dodge( OUT, 1, 0 ); break; case 807'dodge-out-135': dodge( OUT, 1, 1 ); break; case 808'dodge-out-180': dodge( OUT, 0, 1 ); break; case 809'dodge-out-225': dodge( OUT, -1, 1 ); break; case 810'dodge-out-270': dodge( OUT, -1, 0 ); break; case 811'dodge-out-315': dodge( OUT, -1, -1 ); break; case 812'fall': fall(1); break; case 813'fall2': fall(0); break; case 814'filmstrip': filmstrip(1); break; case 815'filmstrip2': filmstrip(0); break; case 816'flash': flash(); break; case 817'flip': flip( ); break; case 818'flip-v': flip( 'h' ); break; case 819'flip-h': flip( 'v' ); break; case 820'flip-d': flip( 'd' ); break; case 821'flood': flood(); break; case 822'flush': flush(1); break; case 823'flush2': flush(0); break; case 824'fold': fold( ); break; case 825'fold-000': fold( '000' ); break; case 826'fold-090': fold( '090' ); break; case 827'fold-180': fold( '180' ); break; case 828'fold-270': fold( '270' ); break; case 829'glide': glide( ); break; case 830'glide-in': glide( IN ); break; case 831'glide-in-000': glide( IN, 0, -1 ); break; case 832'glide-in-045': glide( IN, 1, -1 ); break; case 833'glide-in-090': glide( IN, 1, 0 ); break; case 834'glide-in-135': glide( IN, 1, 1 ); break; case 835'glide-in-180': glide( IN, 0, 1 ); break; case 836'glide-in-225': glide( IN, -1, 1 ); break; case 837'glide-in-270': glide( IN, -1, 0 ); break; case 838'glide-in-315': glide( IN, -1, -1 ); break; case 839'glide-out': glide( OUT ); break; case 840'glide-out-000': glide( OUT, 0, -1 ); break; case 841'glide-out-045': glide( OUT, 1, -1 ); break; case 842'glide-out-090': glide( OUT, 1, 0 ); break; case 843'glide-out-135': glide( OUT, 1, 1 ); break; case 844'glide-out-180': glide( OUT, 0, 1 ); break; case 845'glide-out-225': glide( OUT, -1, 1 ); break; case 846'glide-out-270': glide( OUT, -1, 0 ); break; case 847'glide-out-315': glide( OUT, -1, -1 ); break; case 848'mesh': mesh( ); break; case 849'mesh-in': mesh( IN ); break; case 850'mesh-in-000': mesh( IN, '000' ); break; case 851'mesh-in-045': mesh( IN, '045' ); break; case 852'mesh-in-090': mesh( IN, '090' ); break; case 853'mesh-in-135': mesh( IN, '135' ); break; case 854'mesh-in-180': mesh( IN, '180' ); break; case 855'mesh-in-225': mesh( IN, '225' ); break; case 856'mesh-in-270': mesh( IN, '270' ); break; case 857'mesh-in-315': mesh( IN, '315' ); break; case 858'mesh-out': mesh( OUT ); break; case 859'mesh-out-000': mesh( OUT, '000' ); break; case 860'mesh-out-045': mesh( OUT, '045' ); break; case 861'mesh-out-090': mesh( OUT, '090' ); break; case 862'mesh-out-135': mesh( OUT, '135' ); break; case 863'mesh-out-180': mesh( OUT, '180' ); break; case 864'mesh-out-270': mesh( OUT, '270' ); break; case 865'mesh-out-225': mesh( OUT, '225' ); break; case 866'mesh-out-315': mesh( OUT, '315' ); break; case 867'peel': peel( ); break; case 868'peel-in': peel( IN ); break; case 869'peel-in-000': peel( IN, '000' ); break; case 870'peel-in-090': peel( IN, '090' ); break; case 871'peel-in-180': peel( IN, '180' ); break; case 872'peel-in-270': peel( IN, '270' ); break; case 873'peel-out': peel( OUT ); break; case 874'peel-out-000': peel( OUT, '000' ); break; case 875'peel-out-090': peel( OUT, '090' ); break; case 876'peel-out-180': peel( OUT, '180' ); break; case 877'peel-out-270': peel( OUT, '270' ); break; case 878'pivot': pivot( ); break; case 879'pivot-in': pivot( IN ); break; case 880'pivot-in-000': pivot( IN, sx, 0, sx ); break; case 881'pivot-in-045': pivot( IN, 1, 0, ); break; case 882'pivot-in-090': pivot( IN, 1, sy, sy ); break; case 883'pivot-in-135': pivot( IN, 1, 1, ); break; case 884'pivot-in-180': pivot( IN, sx, 1, -sx ); break; case 885'pivot-in-225': pivot( IN, 0, 1, ); break; case 886'pivot-in-270': pivot( IN, 0, sy, -sy ); break; case 887'pivot-in-315': pivot( IN, 0, 0, ); break; case 888'pivot-out': pivot( OUT, ); break; case 889'pivot-out-000': pivot( OUT, sx, 0, sx ); break; case 890'pivot-out-045': pivot( OUT, 1, 0, ); break; case 891'pivot-out-090': pivot( OUT, 1, sy, sy ); break; case 892'pivot-out-135': pivot( OUT, 1, 1, ); break; case 893'pivot-out-180': pivot( OUT, sx, 1, -sx ); break; case 894'pivot-out-225': pivot( OUT, 0, 1, ); break; case 895'pivot-out-270': pivot( OUT, 0, sy, -sy ); break; case 896'pivot-out-315': pivot( OUT, 0, 0, ); break; case 897'projector': projector(1); break; case 898'projector2': projector(0); break; case 899'push': push( ); break; case 900'push-000': push( '000' ); break; case 901'push-045': push( '045' ); break; case 902'push-090': push( '090' ); break; case 903'push-135': push( '135' ); break; case 904'push-180': push( '180' ); break; case 905'push-225': push( '225' ); break; case 906'push-270': push( '270' ); break; case 907'push-315': push( '315' ); break; case 908'radar': radar(); break; case 909'radar-c': radar( '', 1); break; case 910'radar-c-000': radar( '000',1 ); break; case 911'radar-c-045': radar( '045',1 ); break; case 912'radar-c-090': radar( '090',1 ); break; case 913'radar-c-135': radar( '135',1 ); break; case 914'radar-c-180': radar( '180',1 ); break; case 915'radar-c-225': radar( '225',1 ); break; case 916'radar-c-270': radar( '270',1 ); break; case 917'radar-c-315': radar( '315',1 ); break; case 918'radar-cc': radar( '', -1 ); break; case 919'radar-cc-000': radar( '000',-1 ); break; case 920'radar-cc-045': radar( '045',-1 ); break; case 921'radar-cc-090': radar( '090',-1 ); break; case 922'radar-cc-135': radar( '135',-1 ); break; case 923'radar-cc-180': radar( '180',-1 ); break; case 924'radar-cc-225': radar( '225',-1 ); break; case 925'radar-cc-270': radar( '270',-1 ); break; case 926'radar-cc-315': radar( '315',-1 ); break; case 927'rain': rain(); break; case 928'register': register(1); break; case 929'register2': register(0); break; case 930'rings': rings(); break; case 931'rings-c': rings('c'); break; case 932'rings-m': rings('m'); break; case 933'roll': roll( ); break; case 934'roll-in': roll( IN ); break; case 935'roll-in-v': roll( IN, 'h' ); break; case 936'roll-in-h': roll( IN, 'v' ); break; case 937'roll-in-d': roll( IN, 'd' ); break; case 938'roll-in-000': roll( IN, '000' ); break; case 939'roll-in-045': roll( IN, '045' ); break; case 940'roll-in-090': roll( IN, '090' ); break; case 941'roll-in-135': roll( IN, '135' ); break; case 942'roll-in-180': roll( IN, '180' ); break; case 943'roll-in-225': roll( IN, '225' ); break; case 944'roll-in-270': roll( IN, '270' ); break; case 945'roll-in-315': roll( IN, '315' ); break; case 946'roll-out': roll( OUT ); break; case 947'roll-out-v': roll( OUT, 'h' ); break; case 948'roll-out-h': roll( OUT, 'v' ); break; case 949'roll-out-d': roll( OUT, 'd' ); break; case 950'roll-out-000': roll( OUT, '000' ); break; case 951'roll-out-045': roll( OUT, '045' ); break; case 952'roll-out-090': roll( OUT, '090' ); break; case 953'roll-out-135': roll( OUT, '135' ); break; case 954'roll-out-180': roll( OUT, '180' ); break; case 955'roll-out-225': roll( OUT, '225' ); break; case 956'roll-out-270': roll( OUT, '270' ); break; case 957'roll-out-315': roll( OUT, '315' ); break; case 958'scoot': scoot( ); break; case 959'scoot-in': scoot( IN ); break; case 960'scoot-in-000': scoot( IN, '000' ); break; case 961'scoot-in-090': scoot( IN, '090' ); break; case 962'scoot-in-180': scoot( IN, '180' ); break; case 963'scoot-in-270': scoot( IN, '270' ); break; case 964'scoot-out': scoot( OUT ); break; case 965'scoot-out-000': scoot( OUT, '000' ); break; case 966'scoot-out-090': scoot( OUT, '090' ); break; case 967'scoot-out-180': scoot( OUT, '180' ); break; case 968'scoot-out-270': scoot( OUT, '270' ); break; case 969'scribble': scribble(); break; case 970'skew': skew( ); break; case 971'skew-in': skew( IN ); break; case 972'skew-in-000': skew( IN, '000' ); break; case 973'skew-in-045': skew( IN, '045' ); break; case 974'skew-in-090': skew( IN, '090' ); break; case 975'skew-in-135': skew( IN, '135' ); break; case 976'skew-in-180': skew( IN, '180' ); break; case 977'skew-in-225': skew( IN, '225' ); break; case 978'skew-in-270': skew( IN, '270' ); break; case 979'skew-in-315': skew( IN, '315' ); break; case 980'skew-out': skew( OUT ); break; case 981'skew-out-000': skew( OUT, '000' ); break; case 982'skew-out-045': skew( OUT, '045' ); break; case 983'skew-out-090': skew( OUT, '090' ); break; case 984'skew-out-135': skew( OUT, '135' ); break; case 985'skew-out-180': skew( OUT, '180' ); break; case 986'skew-out-225': skew( OUT, '225' ); break; case 987'skew-out-270': skew( OUT, '270' ); break; case 988'skew-out-315': skew( OUT, '315' ); break; case 989'slew': slew( ); break; case 990'slew-in': slew(
990 IN ); break; case 991'slew-in-h': slew( IN, 1 ); break; case 992'slew-in-v': slew( IN, 0 ); break; case 993'slew-out': slew( OUT ); break; case 994'slew-out-h': slew( OUT, 1 ); break; case 995'slew-out-v': slew( OUT, 0 ); break; case 996'spin': zoom( '', rx, ry, 360 ); break; case 997'spin-in': zoom( IN, rx, ry, 360 ); break; case 998'spin-in-c': zoom( IN, .5, .5, 360 ); break; case 999'spin-in-m': zoom( IN, mx, my, 360 ); break; case 1000'spin-in-000': zoom( IN, mx, 0, 360 ); break; case 1001'spin-in-045': zoom( IN, 1, 0, 360 ); break; case 1002'spin-in-090': zoom( IN, 1, my, 360 ); break; case 1003'spin-in-135': zoom( IN, 1, 1, 360 ); break; case 1004'spin-in-180': zoom( IN, mx, 1, 360 ); break; case 1005'spin-in-225': zoom( IN, 0, 1, 360 ); break; case 1006'spin-in-270': zoom( IN, 0, my, 360 ); break; case 1007'spin-in-315': zoom( IN, 0, 0, 360 ); break; case 1008'spin-out': zoom( OUT, rx, ry, 360 ); break; case 1009'spin-out-c': zoom( OUT, .5, .5, 360 ); break; case 1010'spin-in-m': zoom( OUT, mx, my, 360 ); break; case 1011'spin-out-000': zoom( OUT, mx, 0, 360 ); break; case 1012'spin-out-045': zoom( OUT, 1, 0, 360 ); break; case 1013'spin-out-090': zoom( OUT, 1, my, 360 ); break; case 1014'spin-out-135': zoom( OUT, 1, 1, 360 ); break; case 1015'spin-out-180': zoom( OUT, mx, 1, 360 ); break; case 1016'spin-out-225': zoom( OUT, 0, 1, 360 ); break; case 1017'spin-out-270': zoom( OUT, 0, my, 360 ); break; case 1018'spin-out-315': zoom( OUT, 0, 0, 360 ); break; case 1019'spot': spot(); break; case 1020'spot-in': spot( IN ); break; case 1021'spot-in-000': spot( IN, '000' ); break; case 1022'spot-in-045': spot( IN, '045' ); break; case 1023'spot-in-090': spot( IN, '090' ); break; case 1024'spot-in-135': spot( IN, '135' ); break; case 1025'spot-in-180': spot( IN, '180' ); break; case 1026'spot-in-225': spot( IN, '225' ); break; case 1027'spot-in-270': spot( IN, '270' ); break; case 1028'spot-in-315': spot( IN, '315' ); break; case 1029'spot-out': spot( OUT ); break; case 1030'spot-out-000': spot( OUT, '000' ); break; case 1031'spot-out-045': spot( OUT, '045' ); break; case 1032'spot-out-090': spot( OUT, '090' ); break; case 1033'spot-out-135': spot( OUT, '135' ); break; case 1034'spot-out-180': spot( OUT, '180' ); break; case 1035'spot-out-225': spot( OUT, '225' ); break; case 1036'spot-out-270': spot( OUT, '270' ); break; case 1037'spot-out-315': spot( OUT, '315' ); break; case 1038'stretch': stretch( ); break; case 1039'stretch-000': stretch( '000' ); break; case 1040'stretch-090': stretch( '090' ); break; case 1041'stretch-180': stretch( '180' ); break; case 1042'stretch-270': stretch( '270' ); break; case 1043'strips': strips(); break; case 1044'strips-000': strips('000'); break; case 1045'strips-090': strips('090'); break; case 1046'strips-180': strips('180'); break; case 1047'strips-270': strips('270'); break; case 1048'swing': swing( ); break; case 1049'swing-in': swing( IN ); break; case 1050'swing-in-000': swing( IN, sx, 0, sx ); break; case 1051'swing-in-045': swing( IN, 1, 0, ); break; case 1052'swing-in-090': swing( IN, 1, sy, sy ); break; case 1053'swing-in-135': swing( IN, 1, 1, ); break; case 1054'swing-in-180': swing( IN, sx, 1, -sx ); break; case 1055'swing-in-225': swing( IN, 0, 1, ); break; case 1056'swing-in-270': swing( IN, 0, sy, -sy ); break; case 1057'swing-in-315': swing( IN, 0, 0, ); break; case 1058'swing-out': swing( OUT ); break; case 1059'swing-out-000': swing( OUT, sx, 0, sx ); break; case 1060'swing-out-045': swing( OUT, 1, 0, ); break; case 1061'swing-out-090': swing( OUT, 1, sy, sy ); break; case 1062'swing-out-135': swing( OUT, 1, 1, ); break; case 1063'swing-out-180': swing( OUT, sx, 1, -sx ); break; case 1064'swing-out-225': swing( OUT, 0, 1, ); break; case 1065'swing-out-270': swing( OUT, 0, sy, -sy ); break; case 1066'swing-out-315': swing( OUT, 0, 0, ); break; case 1067'trash': trash(1); break; case 1068'trash2': trash(0); break; case 1069'twirl': roll( '', '', 3 ); break; case 1070'twirl-in': roll( IN, '', 3 ); break; case 1071'twirl-in-v': roll( IN, 'h', 3 ); break; case 1072'twirl-in-h': roll( IN, 'v', 3 ); break; case 1073'twirl-in-d': roll( IN, 'd', 3 ); break; case 1074'twirl-out': roll( OUT, '', 3 ); break; case 1075'twirl-out-v': roll( OUT, 'h', 3 ); break; case 1076'twirl-out-h': roll( OUT, 'v', 3 ); break; case 1077'twirl-out-d': roll( OUT, 'd', 3 ); break; case 1078'twist': twist( ); break; case 1079'twist-in': twist( IN ); break; case 1080'twist-out': twist( OUT ); break; case 1081'viewmaster': viewmaster(1); break; case 1082'viewmaster2': viewmaster(0); break; case 1083'wheel': wheel( ); break; case 1084'wheel-in': wheel( IN ); break; case 1085'wheel-in-000': wheel( IN, '000' ); break; case 1086'wheel-in-045': wheel( IN, '045' ); break; case 1087'wheel-in-090': wheel( IN, '090' ); break; case 1088'wheel-in-135': wheel( IN, '135' ); break; case 1089'wheel-in-180': wheel( IN, '180' ); break; case 1090'wheel-in-225': wheel( IN, '225' ); break; case 1091'wheel-in-270': wheel( IN, '270' ); break; case 1092'wheel-in-315': wheel( IN, '315' ); break; case 1093'wheel-out': wheel( OUT ); break; case 1094'wheel-out-000': wheel( OUT, '000' ); break; case 1095'wheel-out-045': wheel( OUT, '045' ); break; case 1096'wheel-out-090': wheel( OUT, '090' ); break; case 1097'wheel-out-135': wheel( OUT, '135' ); break; case 1098'wheel-out-180': wheel( OUT, '180' ); break; case 1099'wheel-out-225': wheel( OUT, '225' ); break; case 1100'wheel-out-270': wheel( OUT, '270' ); break; case 1101'wheel-out-315': wheel( OUT, '315' ); break; case 1102'whirl': whirl(); break; case 1103'wipe': wipe( ); break; case 1104'wipe-000': wipe( '000' ); break; case 1105'wipe-090': wipe( '090' ); break; case 1106'wipe-180': wipe( '180' ); break; case 1107'wipe-270': wipe( '270' ); break; case 1108'wipe-in-c': wipe( 'in-c' ); break; case 1109'wipe-in-h': wipe( 'in-h' ); break; case 1110'wipe-in-v': wipe( 'in-v' ); break; case 1111'wipe-in-045': wipe( 'in-045' ); break; case 1112'wipe-in-135': wipe( 'in-135' ); break; case 1113'wipe-in-225': wipe( 'in-225' ); break; case 1114'wipe-in-315': wipe( 'in-315' ); break; case 1115'wipe-out-c': wipe( 'out-c' ); break; case 1116'wipe-out-h': wipe( 'out-h' ); break; case 1117'wipe-out-v': wipe( 'out-v' ); break; case 1118'out-wipe-045': wipe( 'out-045' ); break; case 1119'wipe-out-135': wipe( 'out-135' ); break; case 1120'wipe-out-225': wipe( 'out-225' ); break; case 1121'wipe-out-315': wipe( 'out-315' ); break; case 1122'zoom': zoom( ); break; case
1123'zoom-in': zoom( IN ); break; case 1124'zoom-in-c': zoom( IN, .5, .5 ); break; case 1125'zoom-in-m': zoom( IN, mx, my ); break; case 1126'zoom-in-000': zoom( IN, mx, 0 ); break; case 1127'zoom-in-045': zoom( IN, 1, 0 ); break; case 1128'zoom-in-090': zoom( IN, 1, my ); break; case 1129'zoom-in-135': zoom( IN, 1, 1 ); break; case 1130'zoom-in-180': zoom( IN, mx, 1 ); break; case 1131'zoom-in-225': zoom( IN, 0, 1 ); break; case 1132'zoom-in-270': zoom( IN, 0, my ); break; case 1133'zoom-in-315': zoom( IN, 0, 0 ); break; case 1134'zoom-out': zoom( OUT ); break; case 1135'zoom-out-c': zoom( OUT, .5, .5 ); break; case 1136'zoom-out-m': zoom( OUT, mx, my ); break; case 1137'zoom-out-000': zoom( OUT, mx, 0 ); break; case 1138'zoom-out-045': zoom( OUT, 1, 0 ); break; case 1139'zoom-out-090': zoom( OUT, 1, my ); break; case 1140'zoom-out-135': zoom( OUT, 1, 1 ); break; case 1141'zoom-out-180': zoom( OUT, mx, 1 ); break; case 1142'zoom-out-225': zoom( OUT, 0, 1 ); break; case 1143'zoom-out-270': zoom( OUT, 0, my ); break; case 1144'zoom-out-315': zoom( OUT, 0, 0 ); break; case 1145'test': test(); break; 1146default: snap(); 1147} 1148} 1149 1150/* ============================================================== */ 1151/* transition effects ( "gears" ) */ 1152/* ============================================================== */ 1153 1154function snap( msg='' ){ 1155if( msg ) msg = ' (' + msg + ')'; 1156transOut( 'snap' + msg ); 1157} 1158 1159/* ============================================================== */ 1160 1161function fade( msg='' ){ 1162//if( msg ) msg = ' (' + msg + ')'; 1163$(p).animate( { opacity: 0 }, te ); 1164$(c).qcss( 'opacity', 0 ) 1165 .animate( { opacity: 1 }, { 1166 duration: te, 1167 complete: function(){ transOut( 'fade' ); }, 1168 } ); 1169} 1170 1171/* ============================================================== */ 1172 1173function blackout(){ 1174$(c).qcss( 'opacity', 0 ) 1175 .animate( { q: 0 }, { 1176 duration: 0, 1177 step: function(q){ $(this).css( { "filter": "brightness(" + q + "%)" } ); }, 1178 } ); 1179$(p).animate( { q: 100 }, { 1180 duration: 0, 1181 step: function(q){ $(this).css( { "filter": "brightness(" + q + "%)" } ); }, 1182 } ) 1183 .animate( { q: 0 }, { 1184 duration: te * .5, 1185 step: function(q){ $(this).css( { "filter": "brightness(" + q + "%)" } ); }, 1186 } ); 1187$(c).delay( te * .5 ) 1188 .qcss( 'opacity', 1 ) 1189 .animate( { q: 100 }, { 1190 duration: te * .5, 1191 step: function(q){ $(this).css( { "filter": "brightness(" + q + "%)" } ); }, 1192 complete: function(){ transOut( 'blackout' ); }, 1193 } ); 1194} 1195 1196/* ============================================================== */ 1197 1198function flash(){ 1199$(p).qcss( 'filter', 'brightness(0%)' ); 1200$(c).qcss( 'opacity', 0 ) 1201 .animate( { opacity: 1 }, { 1202 duration: te, 1203 complete: function(){ transOut( 'flash' ); }, 1204 } ); 1205} 1206 1207/* ============================================================== */ 1208 1209function blur(){ 1210$(p).addClass(above) 1211 .animate( { q: 100 }, { 1212 duration: te, 1213 queue: false, 1214 step: function(q){ $(this).css( { "filter": "blur(" + q + "px)" } ); }, 1215 } ) 1216 .delay( te * .5 ) 1217 .animate( { opacity: 0 }, { 1218 duration: te * .5, 1219 complete: function(){ transOut( 'blur' ); }, 1220 } ); 1221} 1222 1223/* ============================================================== */ 1224 1225function bloat( d=bx ){ 1226m = 12; 1227if( d ){ //// in 1228 if( !settings.oops || rz > .1 ) 1229 $(c).qcss( 'opacity', 0, 'width', w*m, 'height', h*m, 'top', -(m-1)*h/2, 'left', -(m-1)*w/2 ) 1230 .animate( { opacity: 1, width: w, height: h, top: 0, left: 0 }, { 1231 duration: te, 1232 complete: function(){ transOut( 'bloat in' ); }, 1233 } ); 1234 else //// oops 1235 $(c).qcss( 'opacity', 0, 'width', w*m, 'height', h*m, 'top', -(m-1)*h/2, 'left', -(m-1)*w/2 ) 1236 .animate( { opacity: 1, width: "100%", height: "100%", top: sy*ry*h*err, left: sx*rx*w*err }, te ) 1237 .delay( 400 ) 1238 .animate( { width: w*1.1, height: h*1.1, left: -w*.05, top: -h*.05}, 200 ) 1239 .animate( { left: 0, top: 0, width: w, height: h }, { 1240 duration: 200, 1241 complete: function(){ transOut( 'bloat in oops' ); }, 1242 } ); 1243 } 1244else //// no "oops" out 1245$(p).addClass(above) 1246 .animate( { opacity: 0, width: w*m, height: h*m, top: -(m-1)*h/2, left: -(m-1)*w/2 }, { 1247 duration: te, 1248 complete: function(){ transOut( 'bloat out' ); }, 1249 } ); 1250} 1251 1252/* ============================================================== */ 1253 1254function glide( d=bx, x1=tx, y1=ty ){ 1255if( !x1 && !y1 ) x1 = sx; //// 1 in 9 chance of no-op 1256x1 *= w; 1257y1 *= h; 1258if( !settings.oops || rz > .1 ){ 1259 if( d ) //// in 1260 $(c).qcss( 'left', x1, 'top', y1 ) 1261 .animate( { left: 0, top: 0 }, { 1262 duration: te, 1263 complete: function(){ transOut( 'glide in' ); }, 1264 } ); 1265 else 1266 $(p).addClass(above) 1267 .animate( { left: x1, top: y1 }, { 1268 duration: te, 1269 complete: function(){ transOut( 'glide out' ); }, 1270 } ); 1271 return 1272 } 1273x2 = x1 * ( .1 * rz + .1 ); 1274y2 = y1 * ( .1 * rz + .1 ); 1275a1 = sa * 7; 1276if( d ){ 1277 $(c).qcss( 'left', x1, 'top', y1 ) 1278 .animate( { left: x2, top: y2 }, te*.5 ) 1279 .animate( { deg: a1 }, { 1280 duration: te * .5, 1281 step: function(q){ $(this).css( { transform: 'rotate(' + q + 'deg)' } ); }, 1282 queue: false, 1283 } ) 1284 .delay( te * .4 ) 1285 .animate( { width: w*(1-err), height: h*(1-err) }, 200 ) 1286 .animate( { deg: 0 }, { 1287 duration: te * .2, 1288 step: function(q){ $(this).css( { transform: 'rotate(' + q + 'deg)' } ); }, 1289 } )
1290 .animate( { width: w, height: h, left: x1, top: y1 }, 200 ) 1291 .animate( { left: 0, top: 0 }, { 1292 duration: te * .2, 1293 complete: function(){ transOut( 'glide in oops' ); }, 1294 } ); 1295 } 1296else{ 1297 $(p).addClass(above) 1298 .animate( { left: x2, top: y2 }, { 1299 duration: te * .2, 1300 } ) 1301 .animate( { deg: a1 }, { 1302 duration: te * .2, 1303 step: function(q){ $(this).css( { transform: 'rotate(' + q + 'deg)' } ); }, 1304 queue: false, 1305 } ) 1306 .delay( te * .4 ) 1307 .animate( { width: w*(1-err), height: h*(1-err), left: w*(err/2), top: h*(err/2) }, 200 ) 1308 .animate( { deg: 0 }, { 1309 duration: te * .2, 1310 step: function(q){ $(this).css( { transform: 'rotate(' + q + 'deg)' } ); }, 1311 } ) 1312 .animate( { width: w, height: h, left: x1, top: y1 }, 200 ) 1313 .animate( { width: w, height: h, left: x1, top: y1 }, { 1314 duration: te * .3, 1315 complete: function(){ transOut( 'glide out oops' ); }, 1316 } ) 1317 } 1318} 1319 1320/* ============================================================== */ 1321 1322function dodge( d=bx, x1=tx, y1=ty ){ 1323if( !x1 && !y1 ) x1 = sx; //// 1 in 9 chance of no-op 1324x1 *= w; 1325y1 *= h; 1326if( d ){ //// in 1327 err = .8; 1328 x2 = -err * x1; y2 = -err * y1; 1329 $(c).qcss( 'left', x1, 'top', y1 ) 1330 .animate( { left: x2, top: y2 }, te*.4 ) 1331 .animate( { left: 0, top: 0 }, { 1332 duration: te * .6, 1333 complete: function(){ transOut( 'dodge in' ); }, 1334 } ); 1335 } 1336else{ 1337 m = rz * 0.2 + 0.1; 1338 $(p).addClass(above) 1339 .animate( { left: -x1*m, top: -y1*m }, te * .8 ) 1340 .animate( { left: x1, top: y1 }, { 1341 duration: te * .2, 1342 complete: function(){ transOut( 'dodge out' ); }, 1343 } ); 1344 } 1345} 1346 1347/* ============================================================== */ 1348 1349function push( d='' ){ //// x-y flat translation 1350if( ! d ) d = dd.pick(); 1351switch( d ){ case 1352'000': x1=0; y1=-h; x2=0; y2=h; break; case 1353'045': x1=w; y1=-h; x2=-w; y2=h; break; case 1354'090': x1=w; y1=0; x2=-w; y2=0; break; case 1355'135': x1=w; y1=h; x2=-w; y2=-h; break; case 1356'180': x1=0; y1=h; x2=0; y2=-h; break; case 1357'225': x1=-w; y1=h; x2=w; y2=-h; break; case 1358'270': x1=-w; y1=0; x2=w; y2=0; break; case 1359'315': x1=-w; y1=-h; x2=w; y2=h; break; 1360} 1361$(c).qcss( 'left', x1, 'top', y1 ) 1362 .animate( { left: 0, top: 0 }, te ); 1363$(p).animate( { left: x2, top: y2 }, { 1364 duration: te, 1365 queue: false, 1366 complete: function(){ transOut( 'push: ' + d ); }, 1367 } ); 1368} 1369 1370/* ============================================================== */ 1371 1372function crush( d='' ){ 1373if( ! d ) d = dd.pick(); 1374switch( d ){ case 1375'000': x1=w*.5; y1=0; x2=w*my; y2=h; break; case 1376'045': x1=w; y1=0; x2=0; y2=h; break; case 1377'090': x1=w; y1=h*.5; x2=0; y2=h*my; break; case 1378'135': x1=w; y1=h; x2=0; y2=0; break; case 1379'180': x1=w*.5; y1=h; x2=w*my; y2=0; break; case 1380'225': x1=0; y1=h; x2=w; y2=0; break; case 1381'270': x1=0; y1=h*.5; x2=w; y2=h*my; break; case 1382'315': x1=0; y1=0; x2=w; y2=h; break; 1383} 1384$(c).qcss( 'left', x1, 'top', y1, 'width', 0, 'height', 0 ) 1385 .animate( { left: 0, top: 0, width: w, height: h }, te ); 1386$(p).animate( { left: x2, top: y2, width: 0, height: 0 }, { 1387 duration: te, 1388 complete: function(){ transOut( 'crush: ' + d ); }, 1389 } ); 1390} 1391 1392/* ============================================================== */ 1393 1394function twist( d=bx ){ 1395txt1 = 'rotate3d('; 1396a1 = 180 * sa; 1397axis = Array( '0,1,1,', '1,0,1,', ).pick(); 1398if( d ){ //// in 1399 $(p).addClass(below); 1400 $(c).animate( { value: a1 }, { 1401 duration: 0, 1402 step: function(q){ $(this).css( 'transform', txt1+axis+q+txt2 ); }, 1403 } ) 1404 .animate( { value: 0 }, { 1405 duration: te, 1406 step: function(q){ $(this).css( 'transform', txt1+axis+q+txt2 ); }, 1407 complete: function(){ transOut( 'twist in' ); }, 1408 } ); 1409 } 1410else{ 1411 $(c).addClass(below); 1412 $(p).animate( { value: a1 }, { 1413 duration: te, 1414 step: function(q){ $(this).css( 'transform', txt1+axis+q+txt2 ); }, 1415 complete: function(){ transOut( 'twist out' ); }, 1416 } ); 1417 } 1418} 1419 1420/* ============================================================== */ 1421 1422function wheel( d=sa, b='', r=.2 ){ 1423if( ! b ) b = dd.pick(); 1424if( ! d ) d = -1; 1425txt1 = 'rotate3d('; 1426a1 = 120 * d; 1427a2 = -a1; 1428switch( b ){ case 1429'000': 1430 axis = '-1,0,0,'; 1431 y1 = y2 = 0 - r * h; 1432 break; case 1433'045': 1434 axis = wi + ',' + hi + ',0,'; 1435 x1 = w + r * w; 1436 y1 = 0 - r * h; 1437 a1 = -a1; a2 = -a2; 1438 break; case 1439'090': 1440 axis = '0,-1,0,';
1441 x1 = w + r * w; 1442 break; case 1443'135': 1444 axis = wi + ',' + -hi + ',0,'; 1445 x1 = w + r * w; 1446 y1 = h + r * h; 1447 break; case 1448'180': 1449 axis = '1,0,0,'; 1450 y1 = h + r * h; 1451 break; case 1452'225': 1453 axis = -wi + ',' + -hi + ',0,'; 1454 x1 = 0 - r * w; 1455 y1 = h + r * h; 1456 a1 = -a1; a2 = -a2; 1457 break; case 1458'270': 1459 axis = '0,1,0,'; 1460 x1 = 0 - r * w; 1461 break; case 1462'315': 1463 axis = -wi + ',' + hi + ',0,'; 1464 x1 = 0 - r * w; 1465 y1 = 0 - r * h; 1466 break; 1467} 1468x1= Math.round(x1); 1469y1= Math.round(y1); 1470if( d>0 ) $(p).addClass(above); 1471$(c).qcss( 'transform-origin', x1 + 'px ' + y1 + 'px' ) 1472 .animate( { value: a1 }, 0 ) 1473 .animate( { value: 0 }, { 1474 duration: te, 1475 step: function(q){ $(this).css( 'transform', txt1+axis+q+txt2 ); }, 1476 } ); 1477$(p).qcss( 'transform-origin', x1 + 'px ' + y1 + 'px' ) 1478 .animate( { value: a2 }, { 1479 duration: te, 1480 step: function(q){ $(this).css( 'transform', txt1+axis+q+txt2 ); }, 1481 complete: function(){ transOut( 'wheel: ' + b ); }, 1482 } ); 1483} 1484 1485/* ============================================================== */ 1486 1487function mesh( d=sa, b='', r=.2 ){ 1488if( ! b ) b = dd.pick(); 1489msg = 'mesh in: '; if( d<0 ) msg = 'mesh out: '; 1490txt1 = 'rotate3d('; 1491a1 = Math.round( 120 * d ); 1492a2 = Math.round( a1 * sz ); 1493switch( b ){ case 1494'000': 1495 axis = '1,0,0,'; 1496 y1 = 0 - r * w; 1497 y2 = h + r * w; 1498 a1 = -a1; 1499 break; case 1500'045': 1501 axis = -wi + ',' + -hi + ',0,'; 1502 x1 = w + r * w; 1503 x2 = 0 - r * w; 1504 y1 = 0 - r * h; 1505 y2 = h + r * h; 1506 break; case 1507'090': 1508 axis = '0,-1,0,'; 1509 x1 = w + r * w; 1510 x2 = 0 - r * w; 1511 break; case 1512'135': 1513 axis = wi + ',' + -hi + ',0,'; 1514 x1 = w + r * w; 1515 x2 = 0 - r * w; 1516 y1 = h + r * h; 1517 y2 = 0 - r * h; 1518 break; case 1519'225': 1520 axis = -wi + ',' + -hi + ',0,'; 1521 x1 = 0 - r * w; 1522 x2 = w + r * w; 1523 y1 = h + r * h; 1524 y2 = 0 - r * h; 1525 a1 = -a1; 1526 break; case 1527'180': 1528 axis = '-1,0,0,'; 1529 y1 = h + r * w; 1530 y2 = 0 - r * w; 1531 a1 = -a1; 1532 break; case 1533'270': 1534 axis = '0,1,0,'; 1535 x1 = 0 - r * w; 1536 x2 = w + r * w; 1537 break; case 1538'315': 1539 axis = - wi + ',' + hi + ',0,'; 1540 x1 = 0 - r * w; 1541 x2 = w + r * w; 1542 y1 = 0 - r * h; 1543 y2 = h + r * h; 1544 break; 1545} 1546x1 = Math.round( x1 ); 1547x2 = Math.round( x2 ); 1548y1 = Math.round( y1 ); 1549y2 = Math.round( y2 ); 1550if( d>0 ) $(p).addClass(above); 1551$(c).qcss( 'transform-origin', x1 + 'px ' + y1 + 'px' ) 1552 .animate( { value: a1 }, 0 ) 1553 .animate( { value: 0 }, { 1554 duration: te, 1555 step: function(q){ $(this).css( 'transform', txt1+axis+q+txt2 ); }, 1556 } ); 1557$(p).qcss( 'transform-origin', x2 + 'px ' + y2 + 'px' ) 1558 .animate( { value: a2 }, { 1559 duration: te, 1560 step: function(q){ $(this).css( 'transform', txt1+axis+q+txt2 ); }, 1561 complete: function(){ transOut( msg + b ); }, 1562 } ); 1563} 1564 1565/* ============================================================== */ 1566 1567function zoom( d=bx, x1=rx, y1=ry, a1=0 ){ 1568txt1 = 'rotate3d('; 1569axis = Array( '1,1,1,', '0,1,1,', '1,0,1,', '1,1,0,', //// twist 1570 '1,0,0,', '1,0,0,', '0,1,0,', '0,1,0,', //// vert / horiz spin 1571 '0,0,1,', '0,0,1,', '0,0,1,', '0,0,1,', //// flat spin 1572 ).pick(); 1573msg = 'zoom '; if( a1 ) msg = 'spin '; 1574if( ! settings.oops || rz > .1 ){ 1575 if( d ){ //// in 1576 $(c).addClass(above) 1577 .qcss( 'width', 0, 'height', 0, 'left', x1*w, 'top', y1*h ); 1578 if( a1 ) $(c).animate( { value: sa * a1 }, { 1579 duration: te, 1580 step: function(q){ $(this).css( 'transform', txt1+axis+q+txt2); }, 1581 queue: false, 1582 } ); 1583 $(c).animate( { width: w, height: h, left: 0, top:0 }, { 1584 duration: te, 1585 complete: function(){ transOut( msg + 'in' ); }, 1586 } ); 1587 } 1588 else{ 1589 $(p).addClass(above); 1590 if( a1 ) $(p).animate( { value: sa * a1 }, { 1591 duration: te, 1592 step: function(q){ $(this).css( 'transform', txt1+axis+q+txt2 ); }, 1593 queue: false, 1594 } ); 1595 $(p).animate( { width: 0, height: 0, left: x1*w, top:y1*h }, { 1596 duration: te, 1597 complete: function(){ transOut( msg + 'out' ); }, 1598 } ); 1599 } 1600 return; 1601 } 1602if( d ) //// in oops 1603 $(c).addClass(above) 1604 .qcss( 'width', 0, 'height', 0, 'left', x1, 'top', y1 )
1605 .animate( { width: w, height: h, left: 0, top: 0, deg: sa*a1+sa*(ra*10+10) }, { 1606 duration: te * .8, 1607 step: function(q){ $(this).css( { transform:txt1+axis+q+txt2 } ); }, 1608 } ) 1609 .delay( 400 ) 1610 .animate( { width: w*(1-err), height: h*(1-err), left: w*(err/2), top: h*(err/2), deg: sa*a1 }, { 1611 duration: 200, 1612 step: function(q){ $(this).css( { transform:txt1+axis+q+txt2 } ); }, 1613 } ) 1614 .animate( { width: w, height: h, left: 0, top: 0 }, { 1615 duration: 200, 1616 complete: function(){ transOut( msg + 'in oops' ); }, 1617 } ); 1618else{ //// out oops 1619 if( a1 ) a1 = 40 + rz * 40; 1620 x1 = w * rx / 2; 1621 y1 = h * ry / 2; 1622 $(p).addClass(above); 1623 $(p).animate( { width: w*.7, height: h*.7, left: x1, top: y1 }, { 1624 duration: te * .2, 1625 queue: false, 1626 } ); 1627 $(p).animate( { value: sa * a1 }, { 1628 duration: te * .2, 1629 step: function(q){ $(this).css( 'transform', txt1+axis+q+txt2 ); }, 1630 } ) 1631 .delay( te * .6 ) 1632 .animate( { top: h*1.5, left: w/4 }, { 1633 duration: te * .3, 1634 complete: function(){ transOut( msg + 'out' ); }, 1635 } ); 1636 } 1637} 1638 1639/* ============================================================== */ 1640 1641function pivot( d=bx, x=sx, y=sy, a=sa, offset=0 ){ 1642msg = 'pivot'; if( offset ) msg = 'swing'; 1643txt1 = 'rotate('; 1644a1 = a * 90 / ( offset + 1 ); //// rotation, enough to get it off-screen 1645x1 = x * w * ( offset + 1 ); 1646y1 = y * h * ( offset + 1 ); 1647if( x1 < 0 ) x1 = -w * offset; 1648if( y1 < 0 ) y1 = -h * offset; 1649x1 = Math.round( x1 ); 1650y1 = Math.round( y1 ); 1651if( d ){ //// in 1652 $(p).addClass(below); 1653 $(c).qcss( 'opacity', 0, 'transform-origin', x1 + 'px ' + y1 + 'px' ) 1654 .animate( { value: a1 }, { 1655 duration: 0, 1656 step: function(q){ $(this).css( { transform:txt1 + q + txt2 } ); }, 1657 } ) 1658 .qcss( 'opacity', 1 ) 1659 .animate( { value: 0 }, { 1660 duration: te, 1661 step: function(q){ $(this).css( { transform:txt1 + q + txt2 } ); }, 1662 complete: function(){ transOut( msg + ' in' ); }, 1663 } ); 1664 } 1665else{ 1666 $(c).addClass(below); 1667 $(p).qcss( 'opacity', 0, 'transform-origin', x1 + 'px ' + y1 + 'px' ) 1668 .animate( { value: 0 }, { 1669 duration: 0, 1670 step: function(q){ $(this).css( { transform:txt1 + q + txt2 } ); }, 1671 } ) 1672 .qcss( 'opacity', 1 ) 1673 .animate( { value: a1 }, { 1674 duration: te, 1675 step: function(q){ $(this).css( { transform:txt1 + q + txt2 } ) ; }, 1676 complete: function(){ transOut( msg + ' out' ); }, 1677 } ); 1678 } 1679} 1680 1681/* -------------------------------------------------------------- */ 1682 1683function swing( d=bx, x1=sx, y1=sy, a1=sa ){ 1684pivot( d, x1, y1, a1, 1 ); 1685} 1686 1687/* ============================================================== */ 1688 1689function skew( d=bx, b='' ){ 1690if( ! b ) b = dd.pick(); 1691txt1 = 'skew('; 1692x1 = bx * wi; 1693y1 = by * hi; 1694a1 = sa * 90; 1695switch( b ){ case 1696'000': 1697 origin = x1 + 'px ' + 0 + 'px'; 1698 txt2 = 'deg,0deg)'; 1699 break; case 1700'045': 1701 origin = wi + 'px ' + 0 + 'px'; 1702 if( a1>0 ){ a1=-a1; txt1 = 'skew(0deg,'; } 1703 break; case 1704'090': 1705 origin = wi + 'px ' + y1 + 'px'; 1706 txt1 = 'skew(0deg,'; 1707 break; case 1708'135': 1709 origin = wi + 'px ' + hi + 'px'; 1710 if( a1<0 ){ a1=-a1; txt1 = 'skew(0deg,'; } 1711 break; case 1712'180': 1713 origin = x1 + 'px ' + hi + 'px'; 1714 txt2 = 'deg,0deg)'; 1715 break; case 1716'225': 1717 origin = 0 + 'px ' + hi + 'px'; 1718 if( a1>0 ){ a1=-a1; txt1 = 'skew(0deg,'; } 1719 break; case 1720'270': 1721 origin = 0 + 'px ' + y1 + 'px'; 1722 txt1 = 'skew(0deg,'; 1723 break; case 1724'315': 1725 origin = 0 + 'px ' + 0 + 'px'; 1726 if( a1<0 ){ a1=-a1; txt1 = 'skew(0deg,'; } 1727 break; 1728} 1729if( d ){ //// in 1730 $(p).addClass(below); 1731 $(c).qcss( 'opacity', 0, 'transform-origin', origin ) 1732 .animate( { value: a1 }, { 1733 duration: 0, 1734 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 1735 } ) 1736 .animate( { opacity: 1 }, { queue: false, duration: te*.8 } ) 1737 .animate( { value: 0 }, { 1738 duration: te, 1739 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 1740 complete: function(){ transOut( 'skew in: ' + b ); }, 1741 } ); 1742 } 1743else{ 1744 $(c).addClass(below); 1745 $(p).qcss( 'opacity', 1, 'transform-origin', origin ) 1746 .animate( { value: 0 }, { 1747 duration: 0, 1748 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 1749 } ) 1750 .animate( { opacity: 0 }, { queue: false, duration: te*.8 } ) 1751 .animate( { value: a1 }, { 1752 duration: te, 1753 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 1754 complete: function(){ transOut( 'skew out: ' + b ); }, 1755 } ); 1756 } 1757} 1758 1759/* ============================================================== */ 1760 1761function slew( d=bx, axis=by ){ 1762origin = Math.round(w*.5) + 'px ' + Math.round(h*.5) + 'px'; 1763////origin = Math.round(w*rx) + 'px ' + Math.round(h*ry) + 'px'; 1764a1 = sa * 89.5; 1765txt1 = 'skew('; 1766txt2 = 'deg,0deg)'; 1767if( ! axis ){ 1768 txt1 = 'skew(0deg,'; 1769 txt2 = 'deg)'; 1770 } 1771if( d ){ //// in 1772 $(c).qcss( 'transform-origin', origin ) 1773 .animate( { value: -a1 }, { 1774 duration: 0, 1775 step: function(q){ $(this).css( { transform: txt1 + q + txt2 } ); }, 1776 } ) 1777 .animate( { value: 0 }, { 1778 duration: te, 1779 step: function(q){ $(this).css( { transform: txt1 + q + txt2 } ); }, 1780 easing: 'swing', 1781 complete: function(){ transOut( 'slew in' ); }, 1782 } ); 1783 return; 1784} 1785$(c).addClass(below); 1786$(p).qcss( 'transform-origin', origin ) 1787 .animate( { value: a1 }, { 1788 duration: te, 1789 step: function(q){ $(this).css( { transform: txt1 + q + txt2 } ); }, 1790 easing: 'swing', 1791 complete: function(){ transOut( 'slew out' ); }, 1792 } ) 1793 .qcss( 'opacity', 0 ); 1794} 1795 1796/* ============================================================== */ 1797 1798function roll( d=bx, axis='', n=1 ){ 1799if( ! axis && n==1 ) axis = Array( 'h', 'v', 'd', '000', '090', '180', '270', 1800 '315', '045', '225', '135' ).pick(); 1801else if( ! axis && n>1 ) axis = Array( 'h', 'v', 'd' ).pick(); 1802a1 = 120; 1803switch( axis ){ case 1804'v': 1805 a1 = 90; 1806 x1 = Math.round( .5 * w ); 1807 txt1 = 'rotateY('; 1808 if( n>1 ) x1 = Math.round( .5 * w ); 1809 break; case 1810'h': 1811 a1 = 90; 1812 y1 = Math.floor( .5 * h + .5 ); 1813 txt1 = 'rotateX('; 1814 if( n>1 ) y1 = Math.round( .5 * h ); 1815 break; case 1816'd': 1817 a1 = 90; txt1 = 'rotate3d(' + sx*wi + ',' + sy*hi + ',0,'; 1818 break; case 1819'000': 1820 n = 1; txt1 = 'rotateX('; 1821 break; case 1822'045': 1823 x1 = wi; n = 1; txt1 = 'rotate3d(' + wi + ',' + hi + ',0,' ; 1824 break; case 1825'090': 1826 x1 = wi; n = 1; txt1 = 'rotateY('; 1827 break; case 1828'135': 1829 x1 = wi; y1 = hi; n = 1; txt1 = 'rotate3d(' + wi + ',' + -hi + ',0,' ; 1830 break; case 1831'180': 1832 y1 = hi; n = 1; txt1 = 'rotateX('; 1833 break; case 1834'225': 1835 y1 = hi; n = 1; txt1 = 'rotate3d(' + -wi + ',' + -hi + ',0,' ; 1836 break; case 1837'270': 1838 n = 1; txt1 = 'rotateY('; 1839 break; case 1840'315': 1841 n = 1; txt1 = 'rotate3d(' + -wi + ',' + hi + ',0,' ; 1842 break; 1843}; 1844a1 = sa * n * a1; 1845origin = x1 + 'px ' + y1 + 'px'; 1846if( axis == 'd' ) origin = ''; 1847msg = 'roll'; if( n>1 ) msg = 'twirl'; 1848if( d ){ //// in 1849 $(c).qcss( 'transform-origin', origin ) 1850 .animate( { value: a1 }, { 1851 duration: 0, 1852 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 1853 } ) 1854 .animate( { value: 0 }, { 1855 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 1856 duration: te, 1857 complete: function(){ transOut( msg + ' in: ' + axis ); }, 1858 } ); 1859 } 1860else 1861 $(p).addClass(above) 1862 .qcss( 'transform-origin', origin ) 1863 .animate( { value: a1 }, { 1864 duration: te, 1865 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 1866 queue: false, 1867 complete: function(){ transOut( msg + ' out: ' + axis ); }, 1868 } ); 1869} 1870 1871/* ============================================================== */ 1872 1873function flip( axis='', n=1 ){ 1874if( ! axis ) axis = Array( 'h', 'v', 'd' ).pick(); 1875switch( axis ){ case 1876 'v': x1 = Math.round( w / 2 ); txt1 = 'rotateY('; break; case 1877 'h': y1 = Math.round( h / 2 ); txt1 = 'rotateX('; break; case 1878 'd': txt1 = 'rotate3d(' + sx*wi + ',' + sy*hi + ',0,'; break; 1879 } 1880origin = x1 + 'px ' + y1 + 'px'; 1881if( axis == 'd' ) origin = ''; 1882$(p).addClass(above) 1883 .qcss( 'transform-origin', origin ) 1884 .animate( { value: 0 }, { 1885 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 1886 duration: 0, 1887 } ) 1888 .animate( { value: -sa * n * 90 }, { 1889 duration: te * .5, 1890 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 1891 easing: 'linear', 1892 } ) 1893 .addClass(below); 1894$(c).qcss( 'transform-origin', origin ) 1895 .animate( { value: sa * n * 90 }, { 1896 duration: 0, 1897 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 1898 } ) 1899 .delay( te * .5 ) 1900 .animate( { value: 0 }, { 1901 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 1902 duration: te * .5, 1903 easing: 'linear', 1904 complete: function(){ transOut( 'flip: ' + axis ); }, 1905 } ); 1906} 1907 1908/* ============================================================== */ 1909 1910function bounce( a1=ta, x1=rx, y1=ry ){ 1911if( x1 < 0 ) x1 = 0; 1912if( y1 < 0 ) y1 = 0; 1913x1 *= w; 1914y1 *= h; 1915a1 *= 360; 1916txt1 = 'rotate('; 1917$(p).addClass(above) 1918 .delay( 200 ) 1919 .animate( { width: 0, height: 0, left: x1, top: y1, deg: a1 }, { 1920 duration: te * .5, 1921 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 1922 } ); 1923$(c).qcss( 'width', 0, 'height', 0, 'left', x1, 'top', y1 ) 1924 .delay( te * .8 )
1925 .animate( { width: w, height: h, left: 0, top: 0, deg: -a1 }, { 1926 duration: te * .5, 1927 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 1928 complete: function(){ transOut( 'bounce' ); }, 1929 } ); 1930} 1931 1932/* ============================================================== */ 1933 1934function deal( d='' ){ //// like playing cards 1935if( ! d ) d = Array( 'in-270', 'in-090', 'out-225', 'out-135', 'out-315', 'out-045' ).pick(); 1936switch( d ){ case 1937'in-090': 1938 $(c).animate( { left: w, top: 0, deg: -90 }, { 1939 duration: 0, 1940 step: function(q){ $(this).css( { transform: 'rotate(' + q + 'deg)' } ); } 1941 } ) 1942 .animate( { left: 0, top: 0, deg: 0 }, { 1943 duration: te, 1944 step: function(q){ $(this).css( { transform: 'rotate(' + q + 'deg)' } ); }, 1945 complete: function(){ transOut( 'deal: ' + d ); }, 1946 } ); 1947 break; case 1948'in-270': 1949 $(c).animate( { left: -h, top: -w, deg: -90 }, { 1950 duration: 0, 1951 step: function(q){ $(this).css( { transform: 'rotate(' + q + 'deg)' } ); }, 1952 } ) 1953 .animate( { left: 0, top: 0, deg: 0 }, { 1954 duration: te, 1955 step: function(q){ $(this).css( { transform: 'rotate(' + q + 'deg)' } ); }, 1956 complete: function(){ transOut( 'deal: ' + d ); }, 1957 } ); 1958 break; case 1959'out-045': 1960 $(p).addClass(above) 1961 .animate( { left: w, top: -h, deg: 90 }, { 1962 duration: te, 1963 step: function(q){ $(this).css( { transform: 'rotate(' + q + 'deg)' } ); }, 1964 complete: function(){ transOut( 'deal: ' + d ); }, 1965 } ); 1966 break; case 1967'out-135': 1968 $(p).addClass(above) 1969 .animate( { left: h, top: w, deg: -90 }, { 1970 duration: te, 1971 step: function(q){ $(this).css( { transform: 'rotate(' + q + 'deg)' } ); }, 1972 complete: function(){ transOut( 'deal: ' + d ); }, 1973 } ); 1974 break; case 1975'out-225': 1976 $(p).addClass(above) 1977 .animate( { left: h, top: w, deg: 90 }, { 1978 duration: te, 1979 step: function(q){ $(this).css( { transform: 'rotate(' + q + 'deg)' } ); }, 1980 complete: function(){ transOut( 'deal: ' + d ); }, 1981 } ); 1982 break; case 1983'out-315': 1984 $(p).addClass(above) 1985 .animate( { left: -w, top: -h, deg: -90 }, { 1986 duration: te, 1987 step: function(q){ $(this).css( { transform: 'rotate(' + q + 'deg)' } ); }, 1988 complete: function(){ transOut( 'deal: ' + d ); }, 1989 } ); 1990 break; 1991} 1992} 1993 1994/* ============================================================== */ 1995 1996function scoot( d=bx, b='' ){ 1997if( ! b ) b = Array( '000', '090', '180', '270' ).pick(); 1998x1 = w * ( .6 * rx + .2 - .1 ); 1999y1 = h * ( .6 * ry + .2 - .1 ); 2000switch( b ){ case 2001 '000': x0=w*(rx-.1); y0=h*-.2; x2=w*(rx-.1); y2=h*-.2; break; case 2002 '090': x0=w; y0=h*(ry-.1); x2=w; y2=h*(ry-.1); break; case 2003 '180': x0=w*(rx-.1); y0=h; x2=w*(rx-.1); y2=h; break; case 2004 '270': x0=w*-.2; y0=h*(ry-.1); x2=w*-.2; y2=h*(ry-.1); break; 2005 } 2006if( d ) //// in 2007 $(c).animate( { left: x0, top: y0, width: '20%', height: '20%' }, 0 ) 2008 .animate( { left: x1, top: y1 }, te*.2 ) 2009 .animate( { left: 0, top: 0, width: w, height: h }, { 2010 duration: te * .8, 2011 complete: function(){ transOut( 'scoot in' ); }, 2012 } ); 2013else 2014 $(p).addClass(above) 2015 .animate( { left: x1, top: y1, width: '20%', height: '20%' }, te*.8 ) 2016 .animate( { left: x2, top: y2 }, { 2017 duration: te * .2, 2018 complete: function(){ transOut( 'scoot out' ); }, 2019 } ); 2020} 2021 2022/* ============================================================== */ 2023 2024function cube( axis='', d=sx, b=1 ){ 2025if( ! axis ) axis = Array( 'h', 'v' ).pick(); 2026if( axis == 'h' ){ 2027 txt1 = 'rotateY('; 2028 z1 = - Math.round( w * .688190960235586769103604791 ); //// .5*tan((180-72)/2) 2029 } 2030else if( axis == 'v' ){ 2031 txt1 = 'rotateX('; 2032 z1 = - Math.round( h * .688190960235586769103604791 ); 2033 } 2034d *= b; 2035z1 *= b; 2036msg = 'cube: '; if( b<0 ) msg = 'box: '; 2037x1 = Math.round( w / 2 ); 2038y1 = Math.round( h / 2 ); 2039a1 = d * 72; 2040$(p).qcss( 'transform-origin', x1 + 'px ' + y1 + 'px ' + z1 + 'px ' ) 2041 .animate( { value: a1 }, { 2042 duration: te, 2043 step: function(q){ $(this).css( 'transform', txt1+q+txt2 ); }, 2044 } ); 2045$(c).qcss( 'transform-origin', x1 + 'px ' + y1 + 'px ' + z1 + 'px ' ) 2046 .animate( { value: -a1 }, { 2047 duration: 0, 2048 step: function(q){ $(this).css( 'transform', txt1+q+txt2 ); }, 2049 } ) 2050 .animate( { value: 0 }, { 2051 duration: te, 2052 step: function(q){ $(this).css( 'transform', txt1+q+txt2 ); }, 2053 complete: function(){ transOut( msg + axis ); }, 2054 } ); 2055} 2056 2057/* ============================================================== */ 2058 2059function stretch( d='' ){ 2060if( ! d ) d = Array( '000', '090', '180' , '270' ).pick(); 2061m = 10; 2062$(c).addClass(below); 2063$(p).find('img').animate( { height: '100%' }, { 2064 duration: te, 2065 queue: false, 2066 } ); 2067switch( d ){ case 2068'000': 2069 $(p).animate( { top: 0, left: w/2-w/2/m, width: w/m, height: h*m }, te ) 2070 .animate( { top: h*m }, { 2071 duration: 500, 2072 complete: function(){ transOut( 'stretch: ' + d ); }, 2073 } ); 2074 break; case 2075'090': 2076 $(p).animate( { left: 0, top: h/2-h/2/m, height: h/m, width: w*m }, te ) 2077 .animate( { left: w*m }, { 2078 duration: 500, 2079 complete: function(){ transOut( 'stretch: ' + d ); }, 2080 } ); 2081 break; case 2082'180': 2083 $(p).animate( { top: -h*m, left: w/2-w/2/m, width: w/m, height: h*(m+1) }, te ) 2084 .animate( { top: -h*m*2 }, {
2085 duration: 500, 2086 complete: function(){ transOut( 'stretch: ' + d ); }, 2087 } ); 2088 break; case 2089'270': 2090 $(p).animate( { left: -w*m, top: h/2-h/2/m, height: h/m, width: w*(m+1) }, te ) 2091 .animate( { left: -w*m*2 }, { 2092 duration: 500, 2093 complete: function(){ transOut( 'stretch: ' + d ); }, 2094 } ); 2095 break; 2096} 2097} 2098 2099/* ============================================================== */ 2100 2101function projector( noise=true ){ 2102if( noise ) playSound( 'slide-projector-2.mp3' ); 2103$(p).animate( { top: -h }, te * .3 ); 2104$(c).qcss( 'top', -h ) 2105 .delay( te * .7 ) 2106 .animate( { top: 0 }, { 2107 duration: te * .3, 2108 complete: function(){ transOut( 'projector' ); }, 2109 } ); 2110} 2111 2112/* ============================================================== */ 2113 2114function register( noise=true ){ 2115if( noise ) playSound( 'register.mp3' ); 2116$(p).animate( { top: h }, te ); 2117$(c).addClass( below ) 2118 .qcss( 'top', h ) 2119 .animate( { top: 0 }, { 2120 duration: te, 2121 complete: function(){ transOut( 'register' ); }, 2122 } ); 2123} 2124 2125/* ============================================================== */ 2126 2127function viewmaster( noise=true ){ 2128if( noise ) playSound( 'slide-projector-1.mp3' ); 2129txt1 = 'rotate('; 2130a1 = 30 ; //// rotation, enough to get it off-screen 2131if( reverse ) a1 = -a1; 2132x1 = Math.round( h * -2 ); 2133y1 = Math.round( h / 2 ); 2134$(p).qcss( 'transform-origin', x1 + 'px ' + y1 + 'px' ) 2135 .animate( { value: a1 }, { 2136 duration: te, 2137 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 2138 queue: false, 2139 } ); 2140$(c).qcss( 'transform-origin', x1 + 'px ' + y1 + 'px' ) 2141 .animate( { value: -a1 }, { 2142 duration: 0, 2143 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); } 2144 } ) 2145 .animate( { value: 0 }, { 2146 duration: te, 2147 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 2148 complete: function(){ transOut( 'viewmaster' ); }, 2149 } ); 2150} 2151 2152/* ============================================================== */ 2153 2154function filmstrip( noise=true ){ 2155if( noise ) playSound( 'filmstrip.mp3' ); 2156m = 40; 2157y1 = -h; 2158y2 = h; 2159if( reverse ){ y1 = h; y2 = -h; m = -m; } 2160$(c).qcss( 'left', 0, 'top', y1-m ) 2161 .animate( { left: 0, top: y1*.75-m }, { duration: te/4, } ) 2162 .animate( { left: 0, top: y1*.50-m }, { duration: te/4, } ) 2163 .animate( { left: 0, top: y1*.25-m }, { duration: te/4, } ) 2164 .animate( { left: 0, top: 0 }, { duration: te/4, } ); 2165$(p).animate( { left: 0, top: y2*.25 }, { duration: te/4, } ) 2166 .animate( { left: 0, top: y2*.50 }, { duration: te/4, } ) 2167 .animate( { left: 0, top: y2*.75 }, { duration: te/4, } ) 2168 .animate( { left: 0, top: y2+m }, { 2169 duration: te/4, 2170 complete: function(){ transOut( 'filmstrip' ); }, 2171 } ); 2172} 2173/* ============================================================== */ 2174 2175function fall( noise=true ){ 2176if( noise ) playSound( 'fall.mp3' ); 2177x1 = sx * w; if( x1<0 ) x1 = 0; 2178y1 = h * .2 * ( ry + 1 ); 2179txt1 = 'rotate('; 2180origin = x1 + 'px ' + y1 + 'px'; 2181$(p).addClass(above) 2182 .animate( { left: 0, top: y1 }, { duration: 200, } ) 2183 .qcss( 'transform-origin', origin ) 2184 .animate( { value: -sx * 90 }, { 2185 duration: te - 600, 2186 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 2187 complete: function(){ transOut( 'fall');}, 2188 } ) 2189 .animate( { left: 0, top: h*2 }, { duration: 400, } ); 2190} 2191 2192/* ============================================================== */ 2193 2194function trash( noise=true ){ 2195txt1 = 'rotate('; 2196a1 = 450; 2197if( noise ) playSound( 'trash.mp3' ); 2198$(p).addClass(above) 2199 .animate( { width: w*.33333, height: h*.333, left: w*.333, top: h*.333, deg: sa*a1 }, { 2200 duration: te * .5, 2201 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 2202 } ) 2203 .delay( te * .2 ) 2204 .animate( { top: h*1.5 }, { 2205 duration: te * .3, 2206 complete: function(){ transOut( 'trash' ); }, 2207 } ); 2208} 2209 2210/* ============================================================== */ 2211 2212function flush( noise=true ){ 2213txt1 = 'rotate('; 2214if( noise ) playSound( 'flush.mp3' ); 2215$(p).delay( 300 ) 2216 .animate( { opacity: .8, width: 0, height: 0, left: w/2, top: h/2, deg: 720 }, { 2217 duration: 1500, 2218 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 2219 } ); 2220$(c).addClass(below) 2221 .qcss( 'opacity', 0, 'width', 0, 'height', 0, 'left', w/2, 'top', h/2 ) 2222 .delay( 1000 ) 2223 .animate( { opacity: 1, width: '100%', height: '100%', left: 0, top: 0 }, { 2224 duration: 2000,
2225 complete: function(){ transOut( 'flush' ); }, 2226 } ); 2227} 2228 2229/* ============================================================== */ 2230 2231function whirl(){ 2232n = 6; 2233txt1 = 'rotate('; 2234$(c).qcss( 'opacity', 0 ) 2235 .animate( { opacity: 1 }, te ); 2236$(c).animate( { deg: sa * n * 360 }, { 2237 duration: te, 2238 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 2239 queue: false, 2240 } ); 2241$(p).qcss( 'opacity', 1 ) 2242 .animate( { opacity: 0 }, te ); 2243$(p).animate( { deg: sa * n * 360 }, { 2244 duration: te, 2245 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 2246 complete: function(){ transOut( 'whirl' ); }, 2247 queue: false, 2248 } ); 2249} 2250 2251/* ============================================================== */ 2252 2253function wipe( d='' ){ 2254if( ! d ) d = Array( 'in-315', 'in-045', 'in-225', 'in-135', 'out-315', 'out-045', 2255 'out-225', 'out-135', '000', '090', '180', '270', 'in-c', 2256 'in-h', 'in-v', 'out-c', 'out-h', 'out-v' ).pick(); 2257$('.sss-image',c).qcss( 'width', w, 'height', h ); 2258$('.sss-image',p).qcss( 'width', w, 'height', h ); 2259switch(d){ case 2260'000': 2261 $(c).qcss( 'left', 0, 'top', 0, 'width', w, 'height', 0 ) 2262 .animate( { left: 0, top: 0, width: w, height: h }, { 2263 duration: te, 2264 complete: function(){ transOut( 'wipe: ' + d ); }, 2265 } ); 2266 break; case 2267'090': 2268 $(c).qcss( 'left', 0, 'top', 0, 'width', 0, 'height', h ) 2269 .animate( { left: 0, top: 0, width: w, height: h }, { 2270 duration: te, 2271 complete: function(){ transOut( 'wipe: ' + d ); }, 2272 } ); 2273 break; case 2274'180': 2275 $('.sss-image',c).qcss( 'bottom', 0 ); 2276 $(c).qcss( 'left', 0, 'top', h, 'width', w, 'height', 0 ) 2277 .animate( { left: 0, top: 0, width: w, height: h }, { 2278 duration: te, 2279 complete: function(){ transOut( 'wipe: ' + d ); }, 2280 } ); 2281 break; case 2282'270': 2283 $('.sss-image',c).qcss( 'right', 0 ); 2284 $(c).qcss( 'left', w, 'top', 0, 'width', 0, 'height', h ) 2285 .animate( { left: 0, top: 0, width: w, height: h }, { 2286 duration: te, 2287 complete: function(){ transOut( 'wipe: ' + d ); }, 2288 } ); 2289 break; case 2290'in-c': 2291 $('.sss-image',p).animate( { top: -h/2, left: -w/2, width: w, height: h }, te ); 2292 $(p).addClass(above) 2293 .animate( { left: w/2, top: h/2, width: 0, height: 0 }, { 2294 duration: te, 2295 complete: function(){ transOut( 'wipe: ' + d ); }, 2296 } ); 2297 break; case 2298'in-v': 2299 $('.sss-image',p).animate( { top: -h/2, left: 0, width: w, height: h }, te ); 2300 $(p).addClass(above) 2301 .animate( { left: 0, top: h/2, width: w, height: 0 }, { 2302 duration: te, 2303 complete: function(){ transOut( 'wipe: ' + d ); }, 2304 } ); 2305 break; case 2306'in-h': 2307 $('.sss-image',p).animate( { top: 0, left: -w/2, width: w, height: h }, te ); 2308 $(p).addClass(above) 2309 .animate( { left: w/2, top: 0, width: 0, height: h }, { 2310 duration: te, 2311 complete: function(){ transOut( 'wipe: ' + d ); }, 2312 } ); 2313 break; case 2314'in-315': 2315 $(c).qcss( 'left', 0, 'top', 0, 'width', 0, 'height', 0 ) 2316 .animate( { left: 0, top: 0, width: w, height: h }, { 2317 duration: te, 2318 complete: function(){ transOut( 'wipe: ' + d ); }, 2319 } ); 2320 break; case 2321'in-045': 2322 $('.sss-image',c).qcss( 'right', 0 ); 2323 $(c).qcss( 'left', w, 'top', 0, 'width', 0, 'height', 0 ) 2324 .animate( { left: 0, top: 0, width: w, height: h }, { 2325 duration: te, 2326 complete: function(){ transOut( 'wipe: ' + d ); }, 2327 } ); 2328 break; case 2329'in-135': 2330 $('.sss-image',c).qcss( 'bottom', 0, 'right', 0 ); 2331 $(c).qcss( 'left', w, 'top', h, 'width', 0, 'height', 0 ) 2332 .animate( { left: 0, top: 0, width: w, height: h }, { 2333 duration: te, 2334 complete: function(){ transOut( 'wipe: ' + d ); }, 2335 } ); 2336 break; case 2337'in-225': 2338 $('.sss-image',c).qcss( 'bottom', 0 ); 2339 $(c).qcss( 'left', 0, 'top', h, 'width', 0, 'height', 0 ) 2340 .animate( { left: 0, top: 0, width: w, height: h }, { 2341 duration: te, 2342 complete: function(){ transOut( 'wipe: ' + d ); }, 2343 } ); 2344 break; case 2345'out-c': //// jitters
2346 $('.sss-image',c).qcss( 'top', -h/2, 'left', -w/2 ) 2347 .animate( { top: 0, left: 0, width: w, height: h }, te ); 2348 $(c).qcss( 'left', w/2, 'top', h/2, 'width', 0, 'height', 0 ) 2349 .animate( { left: 0, top: 0, width: w, height: h }, { 2350 duration: te, 2351 complete: function(){ transOut( 'wipe: ' + d ); }, 2352 } ); 2353 break; case 2354'out-h': //// jitters 2355 $('.sss-image',c).qcss( 'top', 0, 'left', -w/2 ) 2356 .animate( { top: 0, left: 0 }, te ); 2357 $(c).qcss( 'left', w/2, 'top', 0, 'width', 0, 'height', h ) 2358 .animate( { left: 0, top: 0, width: w, height: h }, { 2359 duration: te, 2360 complete: function(){ transOut( 'wipe: ' + d ); }, 2361 } ); 2362 break; case 2363'out-v': //// jitters 2364 $('.sss-image',c).qcss( 'top', -h/2, 'left', 0 ) 2365 .animate( { top: 0, left: 0 }, te ); 2366 $(c).qcss( 'left', 0, 'top', h/2, 'width', w, 'height', 0 ) 2367 .animate( { left: 0, top: 0, width: w, height: h }, { 2368 duration: te, 2369 complete: function(){ transOut( 'wipe: ' + d ); }, 2370 } ); 2371 break; case 2372'out-135': 2373 $('.sss-image',p).animate( { bottom: 0, right: 0, width: w, height: h }, te ); 2374 $(p).addClass(above) 2375 .qcss( 'left', 0, 'top', 0, 'width', w, 'height', h ) 2376 .animate( { left: w, top: h, width: 0, height: 0 }, { 2377 duration: te, 2378 complete: function(){ transOut( 'wipe: ' + d ); }, 2379 } ); 2380 break; case 2381'out-225': 2382 $('.sss-image',p).animate( { bottom: 0, left: 0, width: w, height: h }, te ); 2383 $(p).addClass(above) 2384 .qcss( 'left', 0, 'top', 0, 'width', w, 'height', h ) 2385 .animate( { left: 0, top: h, width: 0, height: 0 }, { 2386 duration: te, 2387 complete: function(){ transOut( 'wipe: ' + d ); }, 2388 } ); 2389 break; case 2390'out-045': 2391 $('.sss-image',p).animate( { top: 0, right: 0, width: w, height: h }, te ); 2392 $(p).addClass(above) 2393 .qcss( 'left', 0, 'top', 0, 'width', w, 'height', h ) 2394 .animate( { left: w, top: 0, width: 0, height: 0 }, { 2395 duration: te, 2396 complete: function(){ transOut( 'wipe: ' + d ); }, 2397 } ); 2398 break; case 2399'out-315': 2400 $('.sss-image',p).animate( { top: 0, left: 0, width: w, height: h }, te ); 2401 $(p).addClass(above) 2402 .qcss( 'left', 0, 'top', 0, 'width', w, 'height', h ) 2403 .animate( { left: 0, top: 0, width: 0, height: 0 }, { 2404 duration: te, 2405 complete: function(){ transOut( 'wipe: ' + d ); }, 2406 } ); 2407 break; 2408} 2409} 2410 2411/* ============================================================== */ 2412 2413function fold( d='' ){ 2414if( ! d ) d = Array( '000', '090', '180', '270' ).pick(); 2415slider.append( $( '<div id="' + c2.replace( '#', '' ) 2416 + '" class="sss-slide sss-slide-curr2 sss-vcenter"></div>' ) ); 2417slider.append( $( '<div id="' + p2.replace( '#', '' ) 2418 + '" class="sss-slide sss-slide-prev2 sss-vcenter"></div>' ) ); 2419$(c2).html( $( slides[currSlide] ).html() ) 2420 .qcss( 'overflow', 'hidden', 'display', 'block' ); 2421$(p2).html( $( slides[prevSlide] ).html() ) 2422 .qcss( 'overflow', 'hidden', 'display', 'block' ); 2423a = 90; 2424if( reverse ){ 2425 if( d=='090' ) d = '270'; 2426 else if( d=='270' ) d = '090'; 2427 else if( d=='000' ) d = '180'; 2428 else if( d=='180' ) d = '000'; 2429 } 2430switch( d ){ case 2431'000': 2432 txt1 = 'rotateX('; 2433 y1 = y = h / 2; 2434 $(p ).css( { width: w, height: y, left: 0, top: 0 } ); 2435 $(p2).css( { width: w, height: y, left: 0, top: y } ); 2436 $(c ).css( { width: w, height: y+3, left: 0, top: y } ); 2437 $(c2).css( { width: w, height: y, left: 0, top: 0, } ); 2438 $('.sss-image',p).css( { width: w, height: h, left: 0, top: 0 } ); 2439 $('.sss-image',p2).css( { width: w, height: h, left: 0, top: -y } ); 2440 $('.sss-image',c).css( { width: w, height: h, left: 0, top: -y } ); 2441 $('.sss-image',c2).css( { width: w, height: h, left: 0, top: 0 } ); 2442 break; case 2443'090': 2444 txt1 = 'rotateY('; 2445 x2 = x = w / 2; 2446 //x2-=3; 2447 $(p ).css( { width: x, height: h, left: x, top: 0 } ); 2448 $(p2).css( { width: x, height: h, left: 0, top: 0 } ); 2449 $(c ).css( { width: x+3, height: h, left: 0, top: 0 } ); 2450 $(c2).css( { width: x, height: h, left: x, top: 0 } ); 2451 $('.sss-image',p).css( { width: w, height: h, left: -x, top: 0 } ); 2452 $('.sss-image',p2).css( { width: w, height: h, left: 0, top: 0 } ); 2453 $('.sss-image',c).css( { width: w, height: h, left: 0, top: 0 } ); 2454 $('.sss-image',c2).css( { width: w, height: h, left: -x, top: 0 } ); 2455 break; case 2456'180': 2457 txt1 = 'rotateX('; 2458 y2 = y = h / 2; 2459 a = -a; 2460 $(p ).css( { width: w, height: y+3, left: 0, top: y } ); 2461 $(p2).css( { width: w, height: y, left: 0, top: 0 } ); 2462 $(c ).css( { width: w, height: y, left: 0, top: 0 } ); 2463 $(c2).css( { width: w, height: y, left: 0, top: y } ); 2464 $('.sss-image',p).css( { width: w, height: h, left: 0, top: -y } ); 2465 $('.sss-image',p2).css( { width: w, height: h, left: 0, top: 0 } ); 2466 $('.sss-image',c).css( { width: w, height: h, left: 0, top: 0 } ); 2467 $('.sss-image',c2).css( { width: w, height: h, left: 0, top: -y } ); 2468 break; case 2469'270': 2470 txt1 = 'rotateY('; 2471 x1 = x = w / 2; 2472 a = -90; 2473 $(p ).css( { width: x+3, height: h, left: 0, top: 0 } ); 2474 $(p2).css( { width: x, height: h, left: x, top: 0 } ); 2475 $(c ).css( { width: x, height: h, left: x, top: 0 } ); 2476 $(c2).css( { width: x, height: h, left: 0, top: 0 } ); 2477 $('.sss-image',p).css( { width: w, height: h, left: 0, top: 0 } ); 2478 $('.sss-image',p2).css( { width: w, height: h, left: -x, top: 0 } ); 2479 $('.sss-image',c).css( { width: w, height: h, left: -x, top: 0 } ); 2480 $('.sss-image',c2).css( { width: w, height: h, left: 0, top: 0 } ); 2481 break; 2482} 2483origin = x1 + 'px ' + y1 + 'px'; 2484$(p).css( 'transform-origin', origin ) 2485 .animate( { value: 0 }, { 2486 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 2487 duration: 0, 2488 } ) 2489 .animate( { value: -a }, { 2490 duration: te * .5, 2491 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 2492 easing: 'linear', 2493 } ) 2494 .qcss( 'display', 'none' ); 2495origin = x2 + 'px ' + y2 + 'px'; 2496$(c).css( 'transform-origin', origin ) 2497 .animate( { value: a }, { 2498 duration: 0, 2499 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 2500 } ) 2501 .delay( te * .5 ) 2502 .animate( { value: 0 }, { 2503 step: function(q){ $(this).css( { transform:txt1+q+txt2 } ); }, 2504 duration: te * .5, 2505 easing: 'linear', 2506 complete: function(){ transOut( 'fold: ' + d ); }, 2507 } ); 2508} 2509 2510/* ============================================================== */ 2511 2512function peel( d=bx, b='' ){ 2513if( ! b ) b = Array( '000', '090', '180', '270', ).pick(); 2514$('.sss-image',c ).qcss( 'width', w, 'height', h ); 2515$('.sss-image',c2).qcss( 'width', w, 'height', h ); 2516$('.sss-image',p ).qcss( 'width', w, 'height', h ); 2517$('.sss-image',p2).qcss( 'width', w, 'height', h ); 2518if( d ){ //// in 2519 slider.append( $( '<div id="' + c2.replace( '#', '' ) 2520 + '" class="sss-slide sss-slide-curr sss-vcenter"></div>' ) ); 2521 $(p).addClass(below); 2522 $(c2).html( $( slides[currSlide] ).html() ) 2523 .qcss( 'opacity', .8 ); 2524 $('.sss-image',c ).qcss( 'width', w, 'height', h ); 2525 $('.sss-image',c2).qcss( 'width', w, 'height', h ); 2526 switch( b ){ case 2527 '000': 2528 $(c).qcss( 'left', 0, 'top', 0, 'width', w, 'height', 0 ) 2529 .animate( { height: h }, { 2530 duration: te, 2531 complete: function(){ transOut( 'peel: ' + d + ' ' + b ); }, 2532 } ); 2533 $('.sss-image',c2).qcss( 'transform', 'scale(1,-1)', 'top', 0, 'width', w ); 2534 $(c2).qcss( 'left', 0, 'top', -h, 'width', w, 'height', h ) 2535 .animate( { top: h, height: 0 }, te ); 2536 break; case 2537 '090': 2538 $(c).qcss( 'left', 0, 'top', 0, 'width', 0, 'height', h ) 2539 .animate( { width: w, height: h }, { 2540 duration: te, 2541 complete: function(){ transOut( 'peel: ' + d + ' ' + b ); }, 2542 } ); 2543 $('.sss-image',c2).qcss( 'transform', 'scale(-1,1)', 'left', 0, 'height', h ); 2544 $(c2).qcss( 'left', -w, 'top', 0, 'width', w, 'height', h ) 2545 .animate( { left: w, width: 0 }, te ); 2546 break; case 2547 '180': 2548 $('.sss-image',c).qcss( 'bottom', 0 ); 2549 $(c).qcss( 'left', 0, 'top', h, 'width', w, 'height', 0 ) 2550 .animate( { top: 0, height: h }, { 2551 duration: te, 2552 complete: function(){ transOut( 'peel: ' + d + ' ' + b ); }, 2553 } ); 2554 $('.sss-image',c2).qcss( 'transform', 'scale(1,-1)', 'bottom', 0, 'width', w ); 2555 $(c2).qcss( 'left', 0, 'top', h, 'width', w, 'height', h ) 2556 .animate( { top: 0, height: 0 }, te ); 2557 break; case 2558 '270': 2559 $('.sss-image',c).qcss( 'right', 0 ); 2560 $(c).qcss( 'left', w, 'top', 0, 'width', 0, 'height', h ) 2561 .animate( { left: 0, width: w }, { 2562 duration: te, 2563 complete: function(){ transOut( 'peel: ' + d + ' ' + b ); }, 2564 } ); 2565 $('.sss-image',c2).qcss( 'transform', 'scale(-1,1)', 'right', 0, 'height', h ); 2566 $(c2).qcss( 'left', w, 'top', 0, 'width', w, 'height', h ) 2567 .animate( { left: 0, width: 0 }, te ); 2568 break; 2569 } 2570 return; 2571 } 2572slider.append( $( '<div id="' + p2.replace( '#', '' ) 2573 + '" class="sss-slide sss-slide-prev sss-vcenter"></div>' ) ); 2574$(p2).html( $( slides[prevSlide] ).html() ) 2575 .qcss( 'opacity', .8 );
2576$('.sss-image',c ).qcss( 'width', w, 'height', h ); 2577$('.sss-image',p2).qcss( 'width', w, 'height', h ); 2578switch( b ){ case 2579'000': 2580 $(c).qcss( 'left', 0, 'top', 0, 'width', w, 'height', 0 ) 2581 .animate( { width: w, height: h }, { 2582 duration: te, 2583 complete: function(){ transOut( 'peel: ' + d + ' ' + b ); }, 2584 } ); 2585 $('.sss-image',p2).qcss( 'transform', 'scale(1,-1)', 'bottom', 0, 'width', w ); 2586 $(p2).qcss( 'left', 0, 'top', 0, 'width', w, 'height', 0 ) 2587 .animate( { top: h, height: h }, te ); 2588 break; case 2589'090': 2590 $(c).qcss( 'left', 0, 'top', 0, 'width', 0, 'height', h ) 2591 .animate( { width: w }, { 2592 duration: te, 2593 complete: function(){ transOut( 'peel: ' + d + ' ' + b ); }, 2594 } ); 2595 $('.sss-image',p2).qcss( 'transform', 'scale(-1,1)', 'right', 0, 'height', h ); 2596 $(p2).qcss( 'left', 0, 'top', 0, 'width', 0, 'height', h ) 2597 .animate( { left: w, width: w }, te ); 2598 break; case 2599'180': 2600 $('.sss-image',c).qcss( 'bottom', 0 ); 2601 $(c).qcss( 'left', 0, 'top', h, 'width', w, 'height', 0 ) 2602 .animate( { top: 0, height: h }, { 2603 duration: te, 2604 complete: function(){ transOut( 'peel: ' + d + ' ' + b ); }, 2605 } ); 2606 $('.sss-image',p2).qcss( 'transform', 'scale(1,-1)', 'top', 0, 'width', w ); 2607 $(p2).qcss( 'left', 0, 'top', h, 'width', w, 'height', 0 ) 2608 .animate( { top: -h, height: h }, te ); 2609 break; case 2610'270': 2611 $('.sss-image',c).qcss( 'right', 0 ); 2612 $(c).qcss( 'left', w, 'top', 0, 'width', 0, 'height', h ) 2613 .animate( { left: 0, width: w }, { 2614 duration: te, 2615 complete: function(){ transOut( 'peel: ' + d + ' ' + b ); }, 2616 } ); 2617 $('.sss-image',p2).qcss( 'transform', 'scale(-1,1)', 'left', 0, 'height', h ); 2618 $(p2).qcss( 'left', w, 'top', 0, 'width', 0, 'height', h ) 2619 .animate( { left: -w, width: w }, te ); 2620 break; 2621} 2622} 2623 2624/* ============================================================== */ 2625 2626function rain(){ 2627if( ! svgSetup() ) return; 2628n = 40; 2629m = Math.round( Math.sqrt( w*w + h*h ) / n ); 2630async function draw(){ 2631 for( i=0; i<n; i++ ) await draw1(); 2632 await new Promise( (res) => setTimeout( res, 200 ) ); 2633 $(svg).qcss( 'transition', 'opacity 0.5s ease' ); 2634 $(p).animate( { opacity: 0, top: h/2 }, te/2 ); 2635 transOut( 'rain' ); 2636 } 2637async function draw1(){ 2638 await new Promise( (res) => setTimeout( res, Math.round(te/n) ) ); 2639 for( j=0; j<25; j++ ){ 2640 x0 = Math.random() * w + .5; 2641 y0 = Math.random() * h + .5; 2642 r0 = Math.random() * m + m/2 + .5; 2643 svgCircle( x0, y0, r0, transparent, 1 ) 2644 } 2645 } 2646draw(); 2647} 2648 2649/* ============================================================== */ 2650 2651function confetti(){ 2652if( ! svgSetup() ) return; 2653n = 40; 2654r = 25; 2655async function draw(){ 2656 for( i=0; i<n; i++ ) await draw1(); 2657 await new Promise( (res) => setTimeout( res, 200 ) ); 2658 $(svg).css( 'transition', 'opacity 0.5s ease', 'opacity', 0 ); 2659 $(p).animate( { opacity: 0 }, te/2 ); 2660 transOut( 'confetti' ); 2661 } 2662async function draw1(){ 2663 await new Promise( (res) => setTimeout( res, Math.round(te/n) ) ); 2664 a = Math.random() * 90; 2665 r1 = Math.round( r * sin(a) ); 2666 r2 = Math.round( r * cos(a) ); 2667 for( j=0; j<25; j++ ){ 2668 x0 = Math.round( Math.random() * w ); 2669 y0 = Math.round( Math.random() * h ); 2670 m = (x0+r1) + ',' + (y0+r2) + ','; 2671 m = m + (x0+r2) + ',' + (y0-r1) + ','; 2672 m = m + (x0-r1) + ',' + (y0-r2) + ','; 2673 m = m + (x0-r2) + ',' + (y0+r1); 2674 svgPolygon( m, transparent, 1 ) 2675 } 2676 } 2677draw(); 2678} 2679 2680/* ============================================================== */ 2681 2682function scribble(){ 2683if( ! svgSetup() ) return; 2684n = 40; 2685r = 12; 2686x2 = w * Math.random() + .5; 2687y2 = h * Math.random() + .5; 2688async function draw(){ 2689 for( i=0; i<n; i++ ) await draw1(); 2690 await new Promise( (res) => setTimeout( res, 200 ) ); 2691 $(svg).css( 'transition', 'opacity 0.5s ease', 'opacity', 0 ); 2692 $(p).animate( { opacity: 0 }, te/2 ); 2693 transOut( 'scribble' ); 2694 } 2695async function draw1(){ 2696 await new Promise( (res) => setTimeout( res, Math.round(te/n) ) ); 2697 for( j=0; j<12; j++ ){ 2698 x1 = x2; 2699 y1 = y2; 2700 x2 = w * Math.random() + .5; 2701 y2 = h * Math.random() + .5; 2702 svgLine( x1, y1, x2, y2, r ); 2703 } 2704 } 2705draw(); 2706} 2707 2708/* ============================================================== */ 2709 2710function boxes( mode='', size=0, shuffle=-1 ){ 2711if( ! svgSetup() ) return; 2712if( ! mode ) mode = Array( 'all', 'alt' ).pick(); 2713if( ! size ) size = Array( 96, 48, 24, 12, 6 ).pick(); //// odd numbers work badly 2714if( shuffle<0 ) shuffle = Array( 0, 1 ).pick(); 2715for( y=0; y<h+size; y+=size ){ 2716 for( x=0; x<w+size; x+=size ){ 2717 if( mode == 'all' ) elems[k++] = [ x, y ]; 2718 else if( isOdd(i) && isOdd(j) ) elems[k++] = [ x, y ]; 2719 else if( isEven(i) && isEven(j) ) elems[k++] = [ x, y ]; 2720 i++; 2721 } 2722 j++; i=0; 2723 } 2724j = 20; if( j > k ) j = k; 2725n = Math.floor( k/j ) ; if( ! n ) n = 1; 2726m = Math.floor( te/j ) ; if( ! m ) m = 1; 2727if( mode=='alt' ){ 2728 m = Math.floor(m/2); if( ! m ) m = 1; 2729 } 2730if( mode=='all' || shuffle ) elems.shuffle(); 2731async function draw(){ 2732 for( i=0; i<elems.length; i+=n ) await draw1( i ); 2733 if( mode=='alt' ) $(p).delay(200).animate( { opacity: 0 }, te/2 ); 2734 transOut( 'boxes: ' + mode + ' ' + size ); 2735 } 2736async function draw1( i ){ 2737 for( k=i; k<i+n; k++ ){ 2738 if( k >= elems.length ) break; 2739 svgRect( elems[k][0], elems[k][1], size, size, transparent ); 2740 } 2741 await new Promise( (res) => setTimeout( res, m/2 ) ); 2742 } 2743draw(); 2744} 2745 2746/* ============================================================== */ 2747 2748function strips( d='', size=0, m='' ){ 2749if( ! svgSetup() ) return; 2750if( ! d ) d = Array( '000', '090', '180', '270' ).pick(); 2751if( ! size ) size = Array( 24, 12, 6 ).pick(); 2752if( ! m ){ m = Array( 'random', 'straight', 'reverse', 'fade', 'slip' ).pick(); } 2753x1 = w; y1 = h; 2754switch( d ){ case 2755'000': 2756 for( i=0; i<h+size; i+=size ) elems[j++] = [ 0, i ]; 2757 y1 = size; x2 = sx*w; y2 = 0; 2758 break; case 2759'090': 2760 for( i=0; i<w+size; i+=size ) elems[j++] = [ i, 0 ]; 2761 x1 = size; x2 = 0; y2 = sy*h; 2762 elems.reverse(); 2763 break; case 2764'180': 2765 for( i=0; i<h+size; i+=size ) elems[j++] = [ 0, i ]; 2766 y1 = size; x2 = sx*w; y2 = 0; 2767 elems.reverse(); 2768 break; case 2769'270': 2770 for( i=0; i<w+size; i+=size ) elems[j++] = [ i, 0 ]; 2771 x1 = size; x2 = 0; y2 = sy*h; 2772 break; 2773 } 2774delay = Math.floor( te / j ); if( ! delay ) delay = 1; 2775async function draw(){ 2776 switch( m ){ case 2777 'random': 2778 elems.shuffle(); 2779 for( i=0; i<elems.length; i+=1 ) await draw1(i); 2780 break; case 2781 'straight': 2782 for( i=0; i<elems.length; i+=2 ) await draw1(i); 2783 for( i=1; i<elems.length; i+=2 ) await draw1(i); 2784 break; case 2785 'reverse': log(elems.length) 2786 for( i=0; i<elems.length; i+=2 ) await draw1(i); 2787 j = 0; if( elems.length % 2 == 0 ) j = 1 ; 2788 for( i=elems.length-j; i>0; i-=2 ) await draw1(i); 2789 break; case 2790 'fade': 2791 for( i=0; i<elems.length; i+=2 ) await draw1(i); 2792 $(p).animate( { opacity: 0 }, te / 2 ); 2793 break; case 2794 'slip': 2795 for( i=0; i<elems.length; i+=2 ) await draw1(i); 2796 $(p).delay(200).animate( { top: y2, left: x2 }, te / 2 ); 2797 break; 2798 } 2799 transOut( 'strips: ' + m + ' ' + d + ' ' + size ); 2800 } 2801async function draw1( i ){ 2802 if( i<0 || i>=elems.length ) return; 2803 svgRect( elems[i][0], elems[i][1], x1, y1, transparent ); 2804 await new Promise( (res) => setTimeout( res, delay ) ); 2805 } 2806draw(); 2807} 2808 2809/* ============================================================== */ 2810 2811function spot( d=-1, b='' ){ 2812if( ! svgSetup() ) return; 2813if( d < 0 ) d = Array( IN, OUT ).pick(); 2814if( ! b ){ dd.push('c'); dd.push('m'); b = dd.pick(); } 2815switch( b ){ case 2816'c': x0=.5; y0=.5; r0=1.4; break; case 2817'm': x0=rx; y0=ry; r0=1; break; case 2818'000': x0=.5; y0=0; r0=1; break; case 2819'045': x0=1; y0=0; r0=1; break; case 2820'090': x0=1; y0=.5; r0=1; break; case 2821'135': x0=1; y0=1; r0=1; break; case 2822'180': x0=.5; y0=1; r0=1; break; case 2823'225': x0=0; y0=1; r0=1; break; case 2824'270': x0=0; y0=.5; r0=1; break; case 2825'315': x0=0; y0=0; r0=1; break; 2826} 2827elem = svgCircle( x0*w, y0*h, -1, transparent, 2 ); 2828r1 = Math.round( Math.sqrt(w*w+h*h)/r0 + 5 ); 2829r2 = Math.floor( (1000/te) * r1 / 70 ); 2830async function draw(){ 2831 if( d ){ 2832 for( r=0; r<r1; r+=r2 ){ 2833 elem.setAttributeNS( null, 'r', r ); 2834 await new Promise( (res) => setTimeout( res, 10 ) ); 2835 } 2836 } 2837 else { 2838 $(p).removeClass( maskId ).removeClass( above ); 2839 $(c).addClass( maskId ); 2840 for( r=r1; r>=-r2; r-=r2 ){ 2841 elem.setAttributeNS( null, 'r', r ); 2842 await new Promise( (res) => setTimeout( res, 10 ) ); 2843 } 2844 $(p).animate( { opacity: 0 }, 200 ); 2845 } 2846 transOut( 'spot: ' + d ); 2847 } 2848draw(); 2849} 2850 2851/* ============================================================== */ 2852 2853function radar( b='', d=0 ){ 2854if( ! svgSetup() ) return; 2855if( ! d ) d = Array( 1, -1 ).pick(); 2856if( ! b ){ dd.push('c'); dd.push('m'); b = dd.pick(); } 2857switch( b ){ case 2858'c': a0=0; x0=Math.round(w/2); y0=Math.round(h/2); a1=360; a2=5; break; case 2859'm': a0=0; x0=Math.round(w*mx); y0=Math.round(h*my); a1=360; a2=5; break; case 2860'000': a0=90; x0=w/2; y0=0; a1=180; a2 = 3; break; case 2861'045': a0=180; x0=w; y0=0; a1=90; a2 = 2; break; case 2862'090': a0=180; x0=w; y0=h/2; a1=180; a2 = 3; break; case 2863'135': a0=270; x0=w; y0=h; a1=90; a2 = 2; break; case 2864'180': a0=270; x0=w/2; y0=h; a1=180; a2 = 3; break; case 2865'225': a0=0; x0=0; y0=h; a1=90; a2 = 2; break; case 2866'270': a0=0; x0=0; y0=h/2; a1=180; a2 = 3; break; case 2867'315': a0=90; x0=0; y0=0; a1=90; a2 = 2; break; 2868} 2869r0 = Math.round( Math.sqrt( w*w + h*h ) + 5 ); 2870x0 = Math.round(x0); 2871y0 = Math.round(y0); 2872delay = Math.floor( a2/a1 * te + 1 ); 2873async function draw_c(){ 2874 for( a=a0; a<=a0+a1; a+=a2 ){ 2875 x1 = Math.round( x0 + sin(a) * r0 ); 2876 y1 = Math.round( y0 - cos(a) * r0 ); 2877 x2 = Math.round( x0 + sin(a+a2+1) * r0 ); 2878 y2 = Math.round( y0 - cos(a+a2+1) * r0 ); 2879 elem = x0 +','+ y0 +' '+ x1 +','+ y1 +' '+ x2 +','+ y2; 2880 svgPolygon( elem, transparent ); 2881 await new Promise( (res) => setTimeout( res, Math.round( delay ) ) ); 2882 } 2883 transOut( 'radar c: ' + b ); 2884 } 2885async function draw_cc(){ 2886 switch( b ){ case 2887 '000': a0=270; break; case 2888 '045': a0=270; break; case 2889 '090': a0=0; break; case 2890 '135': a0=0; break; case 2891 '180': a0=90; break; case 2892 '225': a0=90; break; case 2893 '270': a0=180; break; case 2894 '315': a0=180; break; 2895 } 2896 for( a=a0; a>=a0-a1; a-=a2 ){ 2897 x1 = Math.round( x0 + sin( a ) * r0 ); 2898 y1 = Math.round( y0 - cos( a ) * r0 ); 2899 x2 = Math.round( x0 + sin( a-a2-1 ) * r0 ); 2900 y2 = Math.round( y0 - cos( a-a2-1 ) * r0 ); 2901 elem = x0 +','+ y0 +' '+ x1 +','+ y1 +' '+ x2 +','+ y2; 2902 svgPolygon( elem, transparent ); 2903 await new Promise( (res) => setTimeout( res, Math.round( delay ) ) ); 2904 } 2905 transOut( 'radar cc: ' + b ); 2906 } 2907if( d>0 ) draw_c(); else draw_cc(); 2908} 2909 2910/* ============================================================== */ 2911 2912function burst( d='', b='', m='' ){ 2913if( ! svgSetup() ) return; 2914if( ! d ){ dd.push('c'); dd.push('m'); d = dd.pick(); } 2915if( ! m ) m = Array( 'random', 'straight', 'reverse', 'fade' ).pick(); 2916if( ! b ) b = Array( 'cw', 'ccw' ).pick(); 2917r0 = Math.round( Math.sqrt( w*w + h*h ) + 5 ); 2918x0 = Math.round(w/2); y0 = Math.floor(h/2); 2919switch( d ){ case 2920'c': a0=0; x0=Math.round(w/2); y0=Math.round(h/2); a1=360; a2=15; break; case 2921'm': a0=0; x0=Math.round(w*mx); y0=Math.round(h*my); a1=360; a2=15; break; case 2922'000': a0=90; x0=w/2; y0=0; a1=180; a2 = 10; break; case 2923'045': a0=180; x0=w; y0=0; a1=90; a2 = 5; break; case 2924'090': a0=180; x0=w; y0=h/2; a1=180; a2 = 10; break; case 2925'135': a0=270; x0=w; y0=h; a1=90; a2 = 5; break; case 2926'180': a0=270; x0=w/2; y0=h; a1=180; a2 = 10; break; case 2927'225': a0=0; x0=0; y0=h; a1=90; a2 = 5; break; case 2928'270': a0=0; x0=0; y0=h/2; a1=180; a2 = 10; break; case 2929'315': a0=90; x0=0; y0=0; a1=90; a2 = 5; break; 2930} 2931x0 = Math.round(x0); y0 = Math.round(y0); 2932for( a=a0; a<a0+a1; a+=a2 ) elems[j++] = a; 2933if( b == 'ccw' ) elems.reverse(); 2934delay = Math.floor( a2/a1 * te + 1 ); 2935async function draw(){ 2936 ////svgCircle( x0, y0, 25, transparent ); 2937 switch( m ){ case 2938 'random': 2939 elems.shuffle(); 2940 for( i=0; i<elems.length; i+=1 ) await draw1(i); 2941 break; case 2942 'straight': 2943 for( i=0; i<elems.length; i+=2 ) await draw1(i); 2944 for( i=1; i<elems.length; i+=2 ) await draw1(i); 2945 break; case 2946 'reverse': 2947 for( i=0; i<elems.length; i+=2 ) await draw1(i); 2948 j = 0; if( elems.length % 2 == 0 ) j = 1 ; 2949 for( i=elems.length-j; i>0; i-=2 ) await draw1(i); 2950 break; case 2951 'fade': 2952 for( i=0; i<elems.length; i+=2 ) await draw1(i); 2953 $(p).animate( { opacity: 0 }, te/2 ); 2954 break; 2955 } 2956 transOut( 'burst: ' + d + ' ' + b + ' ' + m ); 2957 } 2958async function draw1(i){ 2959 if( i<0 || i>=elems.length ) return; 2960 x1 = Math.round( x0 + sin( elems[i] ) * r0 ); 2961 y1 = Math.round( y0 - cos( elems[i] ) * r0 ); 2962 x2 = Math.round( x0 + sin( elems[i]+a2+1 ) * r0 ); 2963 y2 = Math.round( y0 - cos( elems[i]+a2+1 ) * r0 ); 2964 elem = x0 +','+ y0 +' '+ x1 +','+ y1 +' '+ x2 +','+ y2; 2965 svgPolygon( elem, transparent ); 2966 await new Promise( (res) => setTimeout( res, Math.round( delay ) ) ); 2967 } 2968draw(); 2969} 2970 2971/* ============================================================== */ 2972 2973function blinds( d='', size=40 ){ 2974if( ! svgSetup() ) return; 2975if( ! d ) d = Array( 'v', 'h' ).pick(); 2976delay = Math.floor( te / size ); 2977if( d=='v' ){ 2978for( i=0; i<w+size+1; i+=size ) elems[j++] = svgRect( i, 0, 0, h, transparent ); 2979async function draw1(j){ 2980 for( i=0; i<elems.length; i++ ){ 2981 x0 = parseInt( elems[i].getAttribute( 'x' ))-1; 2982 elems[i].setAttributeNS( null, 'x', x0 ); 2983 elems[i].setAttributeNS( null, 'width', j ); 2984 } 2985 await new Promise( (res) => setTimeout( res, delay ) ); 2986 } 2987async function draw1a(){ 2988 for( j=1; j<=size+2; j+=2 ) await draw1(j); 2989 transOut( 'blinds: v ' + size ); 2990 } 2991draw1a(); 2992return; 2993} 2994for( i=0; i<h+size+1; i+=size ) elems[j++] = svgRect( 0, i, w, 0, transparent ); 2995async function draw2(j){ 2996 for( i=0; i<elems.length; i++ ){ 2997 y0 = parseInt( elems[i].getAttribute( 'y' ))-1; 2998 elems[i].setAttributeNS( null, 'y', y0 ); 2999 elems[i].setAttributeNS( null, 'height', j ); 3000 } 3001 await new Promise( (res) => setTimeout( res, delay ) ); 3002 } 3003async function draw2a(){ 3004 for( j=1; j<=size+2; j+=2 ) await draw2(j); 3005 transOut( 'blinds: h ' + size ); 3006 } 3007draw2a(); 3008} 3009 3010/* ============================================================== */ 3011 3012function rings( d='', m='', size=0 ){ 3013if( ! svgSetup() ) return; 3014if( ! d ){ dd.push('c'); dd.push('m'); d = dd.pick(); } 3015if( ! m ) m = Array( 'random', 'straight', 'reverse', 'fade', 'slip' ).pick(); 3016if( ! size ) size = Array( 12, 24 ).pick(); 3017r0 = Math.round( Math.sqrt(w*w+h*h) + size ); 3018if( d == 'c' ) r0 = Math.round( r0/2 ); 3019switch( d ){ case 3020'c': x0=.5; y0=.5; if(m=='slip') m='fade'; break; case 3021'm': x0=rx; y0=ry; if(m=='slip') m='fade'; break; case 3022'000': x0=.5; y0=0; if(m=='slip') m='fade'; break; case 3023'045': x0=1; y0=0; a0=90; break; case 3024'090': x0=1; y0=.5; if(m=='slip') m='fade'; break; case 3025'135': x0=1; y0=1; a0=-90; break; case 3026'180': x0=.5; y0=1; if(m=='slip') m='fade'; break; case 3027'225': x0=0; y0=1; a0=90; break; case 3028'270': x0=0; y0=.5; if(m=='slip') m='fade'; break; case 3029'315': x0=0; y0=0; a0=-90; break; 3030} 3031if( w > h ) a0 = -a0; 3032x0 = Math.round( x0 * w ); 3033y0 = Math.round( y0 * h ); 3034for( r=0; r<r0+size; r+=size ) elems[j++] = r; 3035delay = Math.round( te / elems.length ); 3036async function draw(){ 3037 svgCircle( x0, y0, size/2, transparent ); 3038 switch( m ){ case 3039 "random": 3040 elems.shuffle(); 3041 for( i=0; i<elems.length; i
3041+=1 ) await draw1(i); 3042 break; case 3043 "straight": 3044 for( i=0; i<elems.length; i+=2 ) await draw1(i); 3045 for( i=1; i<elems.length; i+=2 ) await draw1(i); 3046 break; case 3047 "reverse": 3048 for( i=0; i<elems.length; i+=2 ) await draw1(i); 3049 j = 0; if( elems.length % 2 == 0 ) j = 1 ; 3050 for( i=elems.length-j; i>0; i-=2 ) await draw1(i); 3051 break; case 3052 "fade": 3053 for( i=0; i<elems.length; i+=2 ) await draw1(i); 3054 $(p).animate( { opacity: 0 }, te/2 ); 3055 break; case 3056 "slip": 3057 for( i=0; i<elems.length; i+=2 ) await draw1(i); 3058 $(p).delay(200) 3059 .qcss( 'transform-origin', x0 + 'px ' + y0 + 'px' ) 3060 .animate( { deg: a0 }, { 3061 duration: te/2, 3062 step: function(q){ $(this).css( { transform: 'rotate(' + q + 'deg)' } ); }, 3063 } ) 3064 .qcss( 'opacity', 0 ); 3065 break; 3066 } 3067 transOut( 'rings: ' + m + ' ' + d ); 3068 } 3069async function draw1(i){ 3070 if( i<0 || i>=elems.length ) return; 3071 svgCircle( x0, y0, elems[i], 'none', size+1, transparent ); 3072 await new Promise( (res) => setTimeout( res, delay ) ); 3073 } 3074draw(); 3075} 3076 3077/* ============================================================== */ 3078 3079function flood(){ 3080if( ! svgSetup() ) return; 3081n = 3; 3082m = 50; 3083r = Math.sqrt(w*w+h*h)/m; 3084delay = Math.floor(te/m); 3085async function draw(){ 3086 for( i=0; i<n; i++ ){ 3087 x=(.2+.6*Math.random())*w; 3088 y=(.2+.6*Math.random())*h; 3089 r1 = Math.random()*r; 3090 r2 = Math.random()*r; 3091 elems[i] = svgEllipse( x, y, r1, r2, transparent ); 3092 } 3093 for( j=0; j<m; j++ ){
3094 for( i=0; i<n; i++ ){ 3095 r1 = parseInt(elems[i].getAttribute('rx')) + Math.random()*r +.5; 3096 r2 = parseInt(elems[i].getAttribute('ry')) + Math.random()*r +.5; 3097 elems[i].setAttributeNS( null, 'rx', Math.floor(r1) ); 3098 elems[i].setAttributeNS( null, 'ry', Math.floor(r2) ); 3099 } 3100 await new Promise( (res) => setTimeout( res, delay ) ); 3101 } 3102 $(p).animate( { opacity: 0 }, 300 ); 3103 transOut( 'flood' ); 3104 } 3105draw(); 3106} 3107 3108/* ============================================================== */ 3109 3110function test( d='' ){ 3111fold(); 3112//transOut( 'test' ); 3113} 3114 3115/* ============================================================== */ 3116 3117} } ) (jQuery); 3118 3119function testEffect(){ return ''; } 3120 3121////
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.