1/* 2 This file is part of JonDesign's SmoothGallery v2.0. 3 4 JonDesign's SmoothGallery is free software; you can redistribute it and/or modify 5 it under the terms of the GNU General Public License as published by 6 the Free Software Foundation; either version 3 of the License, or 7 (at your option) any later version. 8 9 JonDesign's SmoothGallery is distributed in the hope that it will be useful, 10 but WITHOUT ANY WARRANTY; without even the implied warranty of 11 MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 12 GNU General Public License for more details. 13 14 You should have received a copy of the GNU General Public License 15 along with JonDesign's SmoothGallery; if not, write to the Free Software 16 Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA 17 18 Main Developer: Jonathan Schemoul (JonDesign: http://www.jondesign.net/) 19 Contributed code by: 20 - Christian Ehret (bugfix) 21 - Nitrix (bugfix) 22 - Valerio from Mad4Milk for his great help with the carousel scrolling and many other things. 23 - Archie Cowan for helping me find a bugfix on carousel inner width problem. 24 - Tomocchino from #mootools for the preloader class 25 Many thanks to: 26 - The mootools team for the great mootools lib, and it's help and support throughout the project. 27*/ 28 29// declaring the class 30var gallery = { 31 initialize: function(element, options) { 32 this.setOptions({ 33 showArrows: true, 34 showCarousel: true, 35 showInfopane: true, 36 embedLinks: true, 37 fadeDuration: 500, 38 timed: false, 39 delay: 9000, 40 preloader: true, 41 preloaderImage: true, 42 preloaderErrorImage: true, 43 /* Data retrieval */ 44 manualData: [], 45 populateFrom: false, 46 populateData: true, 47 destroyAfterPopulate: true, 48 elementSelector: "div.imageElement", 49 titleSelector: "h3", 50 subtitleSelector: "p", 51 linkSelector: "a.open", 52 imageSelector: "img.full", 53 thumbnailSelector: "img.thumbnail", 54 defaultTransition: "fade", 55 /* InfoPane options */ 56 slideInfoZoneOpacity: 0.7, 57 slideInfoZoneSlide: true, 58 /* Carousel options */ 59 carouselMinimizedOpacity: 0.4, 60 carouselMinimizedHeight: 20, 61 carouselMaximizedOpacity: 0.9, 62 thumbHeight: 75, 63 thumbWidth: 100, 64 thumbSpacing: 10, 65 thumbIdleOpacity: 0.2, 66 textShowCarousel: 'Pictures', 67 showCarouselLabel: true, 68 thumbCloseCarousel: true, 69 useThumbGenerator: false, 70 thumbGenerator: 'resizer.php', 71 useExternalCarousel: false, 72 carouselElement: false, 73 carouselHorizontal: true, 74 activateCarouselScroller: true, 75 carouselPreloader: true, 76 textPreloadingCarousel: 'Loading...', 77 /* CSS Classes */ 78 baseClass: 'jdGallery', 79 withArrowsClass: 'withArrows', 80 /* Plugins: HistoryManager */ 81 useHistoryManager: false, 82 customHistoryKey: false 83 }, options); 84 this.fireEvent('onInit'); 85 this.currentIter = 0; 86 this.lastIter = 0; 87 this.maxIter = 0; 88 this.galleryElement = element; 89 this.galleryData = this.options.manualData; 90 this.galleryInit = 1; 91 this.galleryElements = Array(); 92 this.thumbnailElements = Array(); 93 this.galleryElement.addClass(this.options.baseClass); 94 95 this.populateFrom = element; 96 if (this.options.populateFrom) 97 this.populateFrom = this.options.populateFrom; 98 if (this.options.populateData) 99 this.populateData(); 100 element.style.display="block"; 101 102 if (this.options.useHistoryManager) 103 this.initHistory(); 104 105 if (this.options.embedLinks) 106 { 107 this.currentLink = new Element('a').addClass('open').setProperties({ 108 href: '#', 109 title: '' 110 }).injectInside(element); 111 if ((!this.options.showArrows) && (!this.options.showCarousel)) 112 this.galleryElement = element = this.currentLink; 113 else 114 this.currentLink.setStyle('display', 'none'); 115 } 116 117 this.constructElements(); 118 if ((this.galleryData.length>1)&&(this.options.showArrows)) 119 { 120 var leftArrow = new Element('a').addClass('left').addEvent( 121 'click', 122 this.prevItem.bind(this) 123 ).injectInside(element); 124 var rightArrow = new Element('a').addClass('right').addEvent( 125 'click', 126 this.nextItem.bind(this) 127 ).injectInside(element); 128 this.galleryElement.addClass(this.options.withArrowsClass); 129 } 130 this.loadingElement = new Element('div').addClass('loadingElement').injectInside(element); 131 if (this.options.showInfopane) this.initInfoSlideshow(); 132 if (this.options.showCarousel) this.initCarousel(); 133 this.doSlideShow(1); 134 }, 135 populateData: function() { 136 currentArrayPlace = this.galleryData.length; 137 options = this.options; 138 var data = $A(this.galleryData); 139 data.extend(this.populateGallery(this.populateFrom, currentArrayPlace)); 140 this.galleryData = data; 141 this.fireEvent('onPopulated'); 142 }, 143 populateGallery: function(element, startNumber) { 144 var data = []; 145 options = this.options;
146 currentArrayPlace = startNumber; 147 element.getElements(options.elementSelector).each(function(el) { 148 elementDict = { 149 image: el.getElement(options.imageSelector).getProperty('src'), 150 number: currentArrayPlace, 151 transition: this.options.defaultTransition 152 }; 153 elementDict.extend = $extend; 154 if ((options.showInfopane) | (options.showCarousel)) 155 elementDict.extend({ 156 title: el.getElement(options.titleSelector).innerHTML, 157 description: el.getElement(options.subtitleSelector).innerHTML 158 }); 159 if (options.embedLinks) 160 elementDict.extend({ 161 link: el.getElement(options.linkSelector).href||false, 162 linkTitle: el.getElement(options.linkSelector).title||false, 163 linkTarget: el.getElement(options.linkSelector).getProperty('target')||false 164 }); 165 if ((!options.useThumbGenerator) && (options.showCarousel)) 166 elementDict.extend({ 167 thumbnail: el.getElement(options.thumbnailSelector).getProperty('src') 168 }); 169 else if (options.useThumbGenerator) 170 elementDict.extend({ 171 thumbnail: options.thumbGenerator + '?imgfile=' + elementDict.image + '&max_width=' + options.thumbWidth + '&max_height=' + options.thumbHeight 172 }); 173 174 data.extend([elementDict]); 175 currentArrayPlace++; 176 if (this.options.destroyAfterPopulate) 177 el.remove(); 178 }); 179 return data; 180 }, 181 constructElements: function() { 182 el = this.galleryElement; 183 this.maxIter = this.galleryData.length; 184 var currentImg; 185 for(i=0;i<this.galleryData.length;i++) 186 { 187 var currentImg = new Fx.Styles( 188 new Element('div').addClass('slideElement').setStyles({ 189 'position':'absolute', 190 'left':'0px', 191 'right':'0px', 192 'margin':'0px', 193 'padding':'0px', 194 'backgroundPosition':"center center", 195 'opacity':'0' 196 }).injectInside(el), 197 'opacity', 198 {duration: this.options.fadeDuration} 199 ); 200 if (this.options.preloader) 201 { 202 currentImg.source = this.galleryData[i].image; 203 currentImg.loaded = false; 204 currentImg.load = function(imageStyle) { 205 if (!imageStyle.loaded) { 206 new Asset.image(imageStyle.source, { 207 'onload' : function(img){ 208 img.element.setStyle( 209 'backgroundImage', 210 "url('" + img.source + "')") 211 img.loaded = true; 212 }.bind(this, imageStyle) 213 }); 214 } 215 }.pass(currentImg, this); 216 } else { 217 currentImg.element.setStyle('backgroundImage', 218 "url('" + this.galleryData[i].image + "')"); 219 } 220 this.galleryElements[parseInt(i)] = currentImg; 221 } 222 }, 223 destroySlideShow: function(element) { 224 var myClassName = element.className; 225 var newElement = new Element('div').addClass('myClassName'); 226 element.parentNode.replaceChild(newElement, element); 227 }, 228 startSlideShow: function() { 229 this.fireEvent('onStart'); 230 this.loadingElement.style.display = "none"; 231 this.lastIter = this.maxIter - 1; 232 this.currentIter = 0; 233 this.galleryInit = 0; 234 this.galleryElements[parseInt(this.currentIter)].set({opacity: 1}); 235 if (this.options.showInfopane) 236 this.showInfoSlideShow.delay(1000, this); 237 var textShowCarousel = formatString(this.options.textShowCarousel, this.currentIter+1, this.maxIter); 238 if (this.options.showCarousel&&(!this.options.carouselPreloader)) 239 this.carouselBtn.setHTML(textShowCarousel).setProperty('title', textShowCarousel); 240 this.prepareTimer(); 241 if (this.options.embedLinks) 242 this.makeLink(this.currentIter); 243 }, 244 nextItem: function() { 245 this.fireEvent('onNextCalled'); 246 this.nextIter = this.currentIter+1; 247 if (this.nextIter >= this.maxIter) 248 this.nextIter = 0; 249 this.galleryInit = 0; 250 this.goTo(this.nextIter); 251 }, 252 prevItem: function() { 253 this.fireEvent('onPreviousCalled'); 254 this.nextIter = this.currentIter-1; 255 if (this.nextIter <= -1) 256 this.nextIter = this.maxIter - 1; 257 this.galleryInit = 0; 258 this.goTo(this.nextIter); 259 }, 260 goTo: function(num) { 261 this.clearTimer(); 262 if(this.options.preloader) 263 { 264 this.galleryElements[num].load(); 265 if (num==0) 266 this.galleryElements[this.maxIter - 1].load(); 267 else 268 this.galleryElements[num - 1].load(); 269 if (num==(this.maxIter - 1)) 270 this.galleryElements[0].load(); 271 else 272 this.galleryElements[num + 1].load(); 273 274 } 275 if (this.options.embedLinks) 276 this.clearLink(); 277 if (this.options.showInfopane) 278 { 279 this.slideInfoZone.clearChain(); 280 this.hideInfoSlideShow().chain(this.changeItem.pass(num, this)); 281 } else 282 this.currentChangeDelay = this.changeItem.delay(500, this, num); 283 if (this.options.embedLinks) 284 this.makeLink(num); 285 this.prepareTimer(); 286 /*if (this.options.showCarousel)
287 this.clearThumbnailsHighlights();*/ 288 }, 289 changeItem: function(num) { 290 this.fireEvent('onStartChanging'); 291 this.galleryInit = 0; 292 if (this.currentIter != num) 293 { 294 for(i=0;i<this.maxIter;i++) 295 { 296 if ((i != this.currentIter)) this.galleryElements[i].set({opacity: 0}); 297 } 298 gallery.Transitions[this.galleryData[num].transition].pass([ 299 this.galleryElements[this.currentIter], 300 this.galleryElements[num], 301 this.currentIter, 302 num], this)(); 303 this.currentIter = num; 304 } 305 var textShowCarousel = formatString(this.options.textShowCarousel, num+1, this.maxIter); 306 if (this.options.showCarousel) 307 this.carouselBtn.setHTML(textShowCarousel).setProperty('title', textShowCarousel); 308 this.doSlideShow.bind(this)(); 309 this.fireEvent('onChanged'); 310 }, 311 clearTimer: function() { 312 if (this.options.timed) 313 $clear(this.timer); 314 }, 315 prepareTimer: function() { 316 if (this.options.timed) 317 this.timer = this.nextItem.delay(this.options.delay, this); 318 }, 319 doSlideShow: function(position) { 320 if (this.galleryInit == 1) 321 { 322 imgPreloader = new Image(); 323 imgPreloader.onload=function(){ 324 this.startSlideShow.delay(10, this); 325 }.bind(this); 326 imgPreloader.src = this.galleryData[0].image; 327 if(this.options.preloader) 328 this.galleryElements[0].load(); 329 } else { 330 if (this.options.showInfopane) 331 { 332 if (this.options.showInfopane) 333 { 334 this.showInfoSlideShow.delay((500 + this.options.fadeDuration), this); 335 } else 336 if ((this.options.showCarousel)&&(this.options.activateCarouselScroller)) 337 this.centerCarouselOn(position); 338 } 339 } 340 }, 341 createCarousel: function() { 342 var carouselElement; 343 if (!this.options.useExternalCarousel) 344 { 345 var carouselContainerElement = new Element('div').addClass('carouselContainer').injectInside(this.galleryElement); 346 this.carouselContainer = new Fx.Styles(carouselContainerElement, {transition: Fx.Transitions.expoOut}); 347 this.carouselContainer.normalHeight = carouselContainerElement.offsetHeight; 348 this.carouselContainer.set({'opacity': this.options.carouselMinimizedOpacity, 'top': (this.options.carouselMinimizedHeight - this.carouselContainer.normalHeight)}); 349 this.carouselBtn = new Element('a').addClass('carouselBtn').setProperties({ 350 title: this.options.textShowCarousel 351 }).injectInside(carouselContainerElement); 352 if(this.options.carouselPreloader) 353 this.carouselBtn.setHTML(this.options.textPreloadingCarousel); 354 else 355 this.carouselBtn.setHTML(this.options.textShowCarousel); 356 this.carouselBtn.addEvent( 357 'click', 358 function () { 359 this.carouselContainer.clearTimer(); 360 this.toggleCarousel(); 361 }.bind(this) 362 ); 363 this.carouselActive = false; 364 365 carouselElement = new Element('div').addClass('carousel').injectInside(carouselContainerElement); 366 this.carousel = new Fx.Styles(carouselElement); 367 } else { 368 carouselElement = $(this.options.carouselElement).addClass('jdExtCarousel'); 369 } 370 this.carouselElement = new Fx.Styles(carouselElement, {transition: Fx.Transitions.expoOut}); 371 this.carouselElement.normalHeight = carouselElement.offsetHeight; 372 if (this.options.showCarouselLabel) 373 this.carouselLabel = new Element('p').addClass('label').injectInside(carouselElement); 374 carouselWrapper = new Element('div').addClass('carouselWrapper').injectInside(carouselElement); 375 this.carouselWrapper = new Fx.Styles(carouselWrapper, {transition: Fx.Transitions.expoOut}); 376 this.carouselWrapper.normalHeight = carouselWrapper.offsetHeight; 377 this.carouselInner = new Element('div').addClass('carouselInner').injectInside(carouselWrapper); 378 if (this.options.activateCarouselScroller) 379 { 380 this.carouselWrapper.scroller = new Scroller(carouselWrapper, { 381 area: 100, 382 velocity: 0.2 383 }) 384 385 this.carouselWrapper.elementScroller = new Fx.Scroll(carouselWrapper, { 386 duration: 400, 387 onStart: this.carouselWrapper.scroller.stop.bind(this.carouselWrapper.scroller), 388 onComplete: this.carouselWrapper.scroller.start.bind(this.carouselWrapper.scroller) 389 }); 390 } 391 }, 392 fillCarousel: function() { 393 this.constructThumbnails(); 394 this.carouselInner.normalWidth = ((this.maxIter * (this.options.thumbWidth + this.options.thumbSpacing + 2))+this.options.thumbSpacing) + "px"; 395 this.carouselInner.style.width = this.carouselInner.normalWidth; 396 }, 397 initCarousel: function () { 398 this.createCarousel(); 399 this.fillCarousel(); 400 if (this.options.carouselPreloader) 401 this.preloadThumbnails(); 402 }, 403 flushCarousel: function() { 404 this.thumbnailElements.each(function(myFx) { 405 myFx.element.remove(); 406 myFx = myFx.element = null; 407 }); 408 this.thumbnailElements = []; 409 }, 410 toggleCarousel: function() { 411 if (this.carouselActive) 412 this.hideCarousel(); 413 else 414 this.showCarousel(); 415 }, 416 showCarousel: function () { 417 this.fireEvent('onShowCarousel'); 418 this.carouselContainer.start({ 419 'opacity': this.options.carouselMaximizedOpacity, 420 'top': 0 421 }).chain(function() { 422 this.carouselActive = true; 423 this.carouselWrapper.scroller.start(); 424 this.fireEvent('onCarouselShown'); 425 this.carouselContainer.options.onComplete = null; 426 }.bind(this)); 427 }, 428 hideCarousel: function () { 429 this.fireEvent('onHideCarousel'); 430 var targetTop = this.options.carouselMinimizedHeight - this.carouselContainer.normalHeight; 431 this.carouselContainer.start({ 432 'opacity': this.options.carouselMinimizedOpacity, 433 'top': targetTop 434 }).chain(function() { 435 this.carouselActive = false;
436 this.carouselWrapper.scroller.stop(); 437 this.fireEvent('onCarouselHidden'); 438 this.carouselContainer.options.onComplete = null; 439 }.bind(this)); 440 }, 441 constructThumbnails: function () { 442 element = this.carouselInner; 443 for(i=0;i<this.galleryData.length;i++) 444 { 445 var currentImg = new Fx.Style(new Element ('div').addClass("thumbnail").setStyles({ 446 backgroundImage: "url('" + this.galleryData[i].thumbnail + "')", 447 backgroundPosition: "center center", 448 backgroundRepeat: 'no-repeat', 449 marginLeft: this.options.thumbSpacing + "px", 450 width: this.options.thumbWidth + "px", 451 height: this.options.thumbHeight + "px" 452 }).injectInside(element), "opacity", {duration: 200}).set(this.options.thumbIdleOpacity); 453 currentImg.element.addEvents({ 454 'mouseover': function (myself) { 455 myself.clearTimer(); 456 myself.start(0.99); 457 if (this.options.showCarouselLabel) 458 $(this.carouselLabel).setHTML('<span class="number">' + (myself.relatedImage.number + 1) + "/" + this.maxIter + ":</span> " + myself.relatedImage.title); 459 }.pass(currentImg, this), 460 'mouseout': function (myself) { 461 myself.clearTimer(); 462 myself.start(this.options.thumbIdleOpacity); 463 }.pass(currentImg, this), 464 'click': function (myself) { 465 this.goTo(myself.relatedImage.number); 466 if (this.options.thumbCloseCarousel) 467 this.hideCarousel(); 468 }.pass(currentImg, this) 469 }); 470 471 currentImg.relatedImage = this.galleryData[i]; 472 this.thumbnailElements[parseInt(i)] = currentImg; 473 } 474 }, 475 log: function(value) { 476 if(console.log) 477 console.log(value); 478 }, 479 preloadThumbnails: function() { 480 var thumbnails = []; 481 for(i=0;i<this.galleryData.length;i++) 482 { 483 thumbnails[parseInt(i)] = this.galleryData[i].thumbnail; 484 } 485 this.thumbnailPreloader = new Preloader(); 486 this.thumbnailPreloader.addEvent('onComplete', function() { 487 var textShowCarousel = formatString(this.options.textShowCarousel, this.currentIter+1, this.maxIter); 488 this.carouselBtn.setHTML(textShowCarousel).setProperty('title', textShowCarousel); 489 }.bind(this)); 490 this.thumbnailPreloader.load(thumbnails); 491 }, 492 clearThumbnailsHighlights: function() 493 { 494 for(i=0;i<this.galleryData.length;i++) 495 { 496 this.thumbnailElements[i].clearTimer(); 497 this.thumbnailElements[i].start(0.2); 498 } 499 }, 500 changeThumbnailsSize: function(width, height) 501 { 502 for(i=0;i<this.galleryData.length;i++) 503 { 504 this.thumbnailElements[i].clearTimer(); 505 this.thumbnailElements[i].element.setStyles({ 506 'width': width + "px", 507 'height': height + "px" 508 }); 509 } 510 }, 511 centerCarouselOn: function(num) { 512 if (!this.carouselWallMode) 513 { 514 var carouselElement = this.thumbnailElements[num]; 515 var position = carouselElement.element.offsetLeft + (carouselElement.element.offsetWidth / 2); 516 var carouselWidth = this.carouselWrapper.element.offsetWidth; 517 var carouselInnerWidth = this.carouselInner.offsetWidth; 518 var diffWidth = carouselWidth / 2; 519 var scrollPos = position-diffWidth; 520 this.carouselWrapper.elementScroller.scrollTo(scrollPos,0); 521 } 522 }, 523 initInfoSlideshow: function() { 524 /*if (this.slideInfoZone.element) 525 this.slideInfoZone.element.remove();*/ 526 this.slideInfoZone = new Fx.Styles(new Element('div').addClass('slideInfoZone').injectInside($(this.galleryElement))).set({'opacity':0}); 527 var slideInfoZoneTitle = new Element('h3').injectInside(this.slideInfoZone.element); 528 var slideInfoZoneDescription = new Element('p').injectInside(this.slideInfoZone.element); 529 this.slideInfoZone.normalHeight = this.slideInfoZone.element.offsetHeight; 530 this.slideInfoZone.element.setStyle('opacity',0); 531 }, 532 changeInfoSlideShow: function() 533 { 534 this.hideInfoSlideShow.delay(10, this); 535 this.showInfoSlideShow.delay(500, this); 536 }, 537 showInfoSlideShow: function() { 538 this.fireEvent('onShowInfopane'); 539 this.slideInfoZone.clearTimer(); 540 element = this.slideInfoZone.element; 541 element.getElement('h3').setHTML(this.galleryData[this.currentIter].title); 542 element.getElement('p').setHTML(this.galleryData[this.currentIter].description); 543 if(this.options.slideInfoZoneSlide) 544 this.slideInfoZone.start({'opacity': [0, this.options.slideInfoZoneOpacity], 'height': [0, this.slideInfoZone.normalHeight]}); 545 else 546 this.slideInfoZone.start({'opacity': [0, this.options.slideInfoZoneOpacity]}); 547 if (this.options.showCarousel) 548 this.slideInfoZone.chain(this.centerCarouselOn.pass(this.currentIter, this)); 549 return this.slideInfoZone; 550 }, 551 hideInfoSlideShow: function() { 552 this.fireEvent('onHideInfopane'); 553 this.slideInfoZone.clearTimer(); 554 if(this.options.slideInfoZoneSlide) 555 this.slideInfoZone.start({'opacity': 0, 'height': 0}); 556 else 557 this.slideInfoZone.start({'opacity': 0}); 558 return this.slideInfoZone; 559 }, 560 makeLink: function(num) { 561 this.currentLink.setProperties({ 562 href: this.galleryData[num].link,
563 title: this.galleryData[num].linkTitle 564 }) 565 if (!((this.options.embedLinks) && (!this.options.showArrows) && (!this.options.showCarousel))) 566 this.currentLink.setStyle('display', 'block'); 567 }, 568 clearLink: function() { 569 this.currentLink.setProperties({href: '', title: ''}); 570 if (!((this.options.embedLinks) && (!this.options.showArrows) && (!this.options.showCarousel))) 571 this.currentLink.setStyle('display', 'none'); 572 }, 573 /* To change the gallery data, those two functions : */ 574 flushGallery: function() { 575 this.galleryElements.each(function(myFx) { 576 myFx.element.remove(); 577 myFx = myFx.element = null; 578 }); 579 this.galleryElements = []; 580 }, 581 changeData: function(data) { 582 this.galleryData = data; 583 this.clearTimer(); 584 this.flushGallery(); 585 if (this.options.showCarousel) this.flushCarousel(); 586 this.constructElements(); 587 if (this.options.showCarousel) this.fillCarousel(); 588 if (this.options.showInfopane) this.hideInfoSlideShow(); 589 this.galleryInit=1; 590 this.lastIter=0; 591 this.currentIter=0; 592 this.doSlideShow(1); 593 }, 594 /* Plugins: HistoryManager */ 595 initHistory: function() { 596 this.fireEvent('onHistoryInit'); 597 this.historyKey = this.galleryElement.id + '-picture'; 598 if (this.options.customHistoryKey) 599 this.historyKey = this.options.customHistoryKey(); 600 this.history = HistoryManager.register( 601 this.historyKey, 602 [1], 603 function(values) { 604 if (parseInt(values[0])-1 < this.maxIter) 605 this.goTo(parseInt(values[0])-1); 606 }.bind(this), 607 function(values) { 608 return [this.historyKey, '(', values[0], ')'].join(''); 609 }.bind(this), 610 this.historyKey + '\\((\\d+)\\)'); 611 this.addEvent('onChanged', function(){ 612 this.history.setValue(0, this.currentIter+1); 613 }.bind(this)); 614 this.fireEvent('onHistoryInited'); 615 } 616}; 617gallery = new Class(gallery); 618gallery.implement(new Events); 619gallery.implement(new Options); 620 621gallery.Transitions = new Abstract ({ 622 fade: function(oldFx, newFx, oldPos, newPos){ 623 oldFx.options.transition = newFx.options.transition = Fx.Transitions.linear; 624 oldFx.options.duration = newFx.options.duration = this.options.fadeDuration; 625 if (newPos > oldPos) newFx.start({opacity: 1}); 626 else 627 { 628 newFx.set({opacity: 1}); 629 oldFx.start({opacity: 0}); 630 } 631 }, 632 crossfade: function(oldFx, newFx, oldPos, newPos){ 633 oldFx.options.transition = newFx.options.transition = Fx.Transitions.linear; 634 oldFx.options.duration = newFx.options.duration = this.options.fadeDuration; 635 newFx.start({opacity: 1}); 636 oldFx.start({opacity: 0}); 637 }, 638 fadebg: function(oldFx, newFx, oldPos, newPos){ 639 oldFx.options.transition = newFx.options.transition = Fx.Transitions.linear; 640 oldFx.options.duration = newFx.options.duration = this.options.fadeDuration / 2; 641 oldFx.start({opacity: 0}).chain(newFx.start.pass([{opacity: 1}], newFx)); 642 } 643}); 644 645/* All code copyright 2007 Jonathan Schemoul */ 646 647/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 648 * Follows: Preloader (class) 649 * Simple class for preloading images with support for progress reporting 650 * Copyright 2007 Tomocchino. 651 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ 652 653var Preloader = new Class({ 654 655 Implements: [Events, Options], 656 657 options: { 658 root : '', 659 period : 100 660 }, 661 662 initialize: function(options){ 663 this.setOptions(options); 664 }, 665 666 load: function(sources) { 667 this.index = 0; 668 this.images = []; 669 this.sources = this.temps = sources; 670 this.total = this. sources.length; 671 672 this.fireEvent('onStart', [this.index, this.total]); 673 this.timer = this.progress.periodical(this.options.period, this); 674 675 this.sources.each(function(source, index){ 676 this.images[index] = new Asset.image(this.options.root + source, { 677 'onload' : function(){ this.index++; if(this.images[index]) this.fireEvent('onLoad', [this.images[index], index, source]); }.bind(this), 678 'onerror' : function(){ this.index++; this.fireEvent('onError', [this.images.splice(index, 1), index, source]); }.bind(this), 679 'onabort' : function(){ this.index++; this.fireEvent('onError', [this.images.splice(index, 1), index, source]); }.bind(this) 680 }); 681 }, this); 682 }, 683
684 progress: function() { 685 this.fireEvent('onProgress', [Math.min(this.index, this.total), this.total]); 686 if(this.index >= this.total) this.complete(); 687 }, 688 689 complete: function(){ 690 $clear(this.timer); 691 this.fireEvent('onComplete', [this.images]); 692 }, 693 694 cancel: function(){ 695 $clear(this.timer); 696 } 697 698}); 699 700Preloader.implement(new Events, new Options); 701 702/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * 703 * Follows: formatString (function) 704 * Original name: Yahoo.Tools.printf 705 * Copyright Yahoo. 706 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ 707 708function formatString() { 709 var num = arguments.length; 710 var oStr = arguments[0]; 711 for (var i = 1; i < num; i++) { 712 var pattern = "\\{" + (i-1) + "\\}"; 713 var re = new RegExp(pattern, "g"); 714 oStr = oStr.replace(re, arguments[i]); 715 } 716 return oStr; 717}
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.