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