// ----------------------------------------------------------------------------------- // // This page coded by Scott Upton // http://www.uptonic.com | http://www.couloir.org // // This work is licensed under a Creative Commons License // Attribution-ShareAlike 2.0 // http://creativecommons.org/licenses/by-sa/2.0/ // // Associated APIs copyright their respective owners // // ----------------------------------------------------------------------------------- // --- version date: 11/28/05 -------------------------------------------------------- // get current photo id from URL var thisURL = document.location.href; var splitURL = thisURL.split("#"); var photoId = splitURL[1] - 1; // if no photoId supplied then set default var photoId = (!photoId)? 0 : photoId; // CSS border size x 2 var borderSize = 10; // Photo directory for this gallery var photoDir = "http://www.stjohnslibrary.org/js_slideshow/photos/01/"; // Define each photo's name, height, width, and caption var photoArray = new Array( // Source, Width, Height, Caption new Array("MNR._Page_001.jpg", "405", "540", "Make sure to print a pre-test"), new Array("MNR._Page_002.jpg", "405", "540", ""), new Array("MNR._Page_003.jpg", "405", "540", ""), new Array("MNR._Page_004.jpg", "405", "540", ""), new Array("MNR._Page_005.jpg", "405", "540", ""), new Array("MNR._Page_006.jpg", "405", "540", ""), new Array("MNR._Page_007.jpg", "405", "540", ""), new Array("MNR._Page_008.jpg", "405", "540", ""), new Array("MNR._Page_009.jpg", "405", "540", ""), new Array("MNR._Page_010.jpg", "405", "540", ""), new Array("MNR._Page_011.jpg", "405", "540", ""), new Array("MNR._Page_012.jpg", "405", "540", ""), new Array("MNR._Page_013.jpg", "405", "540", ""), new Array("MNR._Page_014.jpg", "405", "540", ""), new Array("MNR._Page_015.jpg", "405", "540", ""), new Array("MNR._Page_016.jpg", "405", "540", ""), new Array("MNR._Page_017.jpg", "405", "540", ""), new Array("MNR._Page_018.jpg", "405", "540", ""), new Array("MNR._Page_019.jpg", "405", "540", ""), new Array("MNR._Page_020.jpg", "405", "540", ""), new Array("MNR._Page_021.jpg", "405", "540", ""), new Array("MNR._Page_022.jpg", "405", "540", ""), new Array("MNR._Page_023.jpg", "405", "540", ""), new Array("MNR._Page_024.jpg", "405", "540", ""), new Array("MNR._Page_025.jpg", "405", "540", ""), new Array("MNR._Page_026.jpg", "405", "540", ""), new Array("MNR._Page_027.jpg", "405", "540", ""), new Array("MNR._Page_028.jpg", "405", "540", ""), new Array("MNR._Page_029.jpg", "405", "540", ""), new Array("MNR._Page_030.jpg", "405", "540", ""), new Array("MNR._Page_031.jpg", "405", "540", ""), new Array("MNR._Page_032.jpg", "405", "540", ""), new Array("MNR._Page_033.jpg", "405", "540", ""), new Array("MNR._Page_034.jpg", "405", "540", ""), new Array("MNR._Page_035.jpg", "405", "540", ""), new Array("MNR._Page_035.jpg", "405", "540", ""), new Array("MNR._Page_036.jpg", "405", "540", ""), new Array("MNR._Page_037.jpg", "405", "540", ""), new Array("MNR._Page_038.jpg", "405", "540", ""), new Array("MNR._Page_039.jpg", "405", "540", ""), new Array("MNR._Page_040.jpg", "405", "540", ""), new Array("MNR._Page_041.jpg", "405", "540", ""), new Array("MNR._Page_042.jpg", "405", "540", ""), new Array("MNR._Page_043.jpg", "405", "540", ""), new Array("MNR._Page_044.jpg", "405", "540", ""), new Array("MNR._Page_045.jpg", "405", "540", ""), new Array("MNR._Page_046.jpg", "405", "540", ""), new Array("MNR._Page_047.jpg", "405", "540", ""), new Array("MNR._Page_048.jpg", "405", "540", ""), new Array("MNR._Page_049.jpg", "405", "540", ""), new Array("MNR._Page_050.jpg", "405", "540", ""), new Array("MNR._Page_051.jpg", "405", "540", ""), new Array("MNR._Page_052.jpg", "405", "540", ""), new Array("MNR._Page_053.jpg", "405", "540", ""), new Array("MNR._Page_054.jpg", "405", "540", ""), new Array("MNR._Page_055.jpg", "405", "540", ""), new Array("MNR._Page_056.jpg", "405", "540", ""), new Array("MNR._Page_057.jpg", "405", "540", ""), new Array("MNR._Page_058.jpg", "405", "540", ""), new Array("MNR._Page_059.jpg", "405", "540", ""), new Array("MNR._Page_060.jpg", "405", "540", ""), new Array("MNR._Page_061.jpg", "405", "540", ""), new Array("MNR._Page_062.jpg", "405", "540", ""), new Array("MNR._Page_063.jpg", "405", "540", ""), new Array("MNR._Page_064.jpg", "405", "540", ""), new Array("MNR._Page_065.jpg", "405", "540", ""), new Array("MNR._Page_066.jpg", "405", "540", ""), new Array("MNR._Page_067.jpg", "405", "540", ""), new Array("MNR._Page_068.jpg", "405", "540", ""), new Array("MNR._Page_069.jpg", "405", "540", ""), new Array("MNR._Page_070.jpg", "405", "540", ""), new Array("MNR._Page_071.jpg", "405", "540", ""), new Array("MNR._Page_072.jpg", "405", "540", ""), new Array("MNR._Page_073.jpg", "405", "540", ""), new Array("MNR._Page_074.jpg", "405", "540", ""), new Array("MNR._Page_075.jpg", "405", "540", ""), new Array("MNR._Page_076.jpg", "405", "540", ""), new Array("MNR._Page_077.jpg", "405", "540", ""), new Array("MNR._Page_078.jpg", "405", "540", ""), new Array("MNR._Page_079.jpg", "405", "540", ""), new Array("MNR._Page_080.jpg", "405", "540", ""), new Array("MNR._Page_081.jpg", "405", "540", ""), new Array("MNR._Page_082.jpg", "405", "540", ""), new Array("MNR._Page_083.jpg", "405", "540", ""), new Array("MNR._Page_084.jpg", "405", "540", ""), new Array("MNR._Page_085.jpg", "405", "540", ""), new Array("MNR._Page_086.jpg", "405", "540", ""), new Array("MNR._Page_087.jpg", "405", "540", ""), new Array("MNR._Page_088.jpg", "405", "540", ""), new Array("MNR._Page_089.jpg", "405", "540", ""), new Array("MNR._Page_090.jpg", "405", "540", ""), new Array("MNR._Page_091.jpg", "405", "540", ""), new Array("MNR._Page_092.jpg", "405", "540", ""), new Array("MNR._Page_093.jpg", "405", "540", ""), new Array("MNR._Page_094.jpg", "405", "540", ""), new Array("MNR._Page_095.jpg", "405", "540", ""), new Array("MNR._Page_096.jpg", "405", "540", ""), new Array("MNR._Page_097.jpg", "405", "540", ""), new Array("MNR._Page_098.jpg", "405", "540", ""), new Array("MNR._Page_099.jpg", "405", "540", ""), new Array("MNR._Page_100.jpg", "405", "540", ""), new Array("MNR._Page_101.jpg", "405", "540", ""), new Array("MNR._Page_102.jpg", "405", "540", ""), new Array("MNR._Page_103.jpg", "405", "540", ""), new Array("MNR._Page_104.jpg", "405", "540", ""), new Array("MNR._Page_105.jpg", "405", "540", ""), new Array("MNR._Page_106.jpg", "405", "540", ""), new Array("MNR._Page_107.jpg", "405", "540", ""), new Array("MNR._Page_108.jpg", "405", "540", ""), new Array("MNR._Page_109.jpg", "405", "540", ""), new Array("MNR._Page_110.jpg", "405", "540", ""), new Array("MNR._Page_111.jpg", "405", "540", ""), new Array("MNR._Page_112.jpg", "405", "540", ""), new Array("MNR._Page_113.jpg", "405", "540", ""), new Array("MNR._Page_114.jpg", "405", "540", ""), new Array("MNR._Page_115.jpg", "405", "540", ""), new Array("MNR._Page_116.jpg", "405", "540", ""), new Array("MNR._Page_117.jpg", "405", "540", ""), new Array("MNR._Page_118.jpg", "405", "540", ""), new Array("MNR._Page_119.jpg", "405", "540", ""), new Array("MNR._Page_120.jpg", "405", "540", ""), new Array("MNR._Page_121.jpg", "405", "540", ""), new Array("MNR._Page_123.jpg", "405", "540", ""), new Array("MNR._Page_124.jpg", "405", "540", ""), new Array("MNR._Page_125.jpg", "405", "540", ""), new Array("MNR._Page_126.jpg", "405", "540", ""), new Array("MNR._Page_127.jpg", "405", "540", ""), new Array("MNR._Page_128.jpg", "405", "540", ""), new Array("MNR._Page_129.jpg", "405", "540", ""), new Array("MNR._Page_130.jpg", "405", "540", ""), new Array("MNR._Page_131.jpg", "405", "540", ""), new Array("MNR._Page_132.jpg", "405", "540", ""), new Array("MNR._Page_133.jpg", "405", "540", ""), new Array("MNR._Page_134.jpg", "405", "540", ""), new Array("MNR._Page_135.jpg", "405", "540", ""), new Array("MNR._Page_136.jpg", "405", "540", ""), new Array("MNR._Page_137.jpg", "405", "540", ""), new Array("MNR._Page_138.jpg", "405", "540", ""), new Array("MNR._Page_139.jpg", "405", "540", ""), new Array("MNR._Page_140.jpg", "405", "540", ""), new Array("MNR._Page_141.jpg", "405", "540", ""), new Array("MNR._Page_142.jpg", "405", "540", ""), new Array("MNR._Page_143.jpg", "405", "540", ""), new Array("MNR._Page_144.jpg", "405", "540", ""), new Array("MNR._Page_145.jpg", "405", "540", ""), new Array("MNR._Page_146.jpg", "405", "540", ""), new Array("MNR._Page_147.jpg", "405", "540", ""), new Array("MNR._Page_148.jpg", "405", "540", ""), new Array("MNR._Page_149.jpg", "405", "540", "") ); // Number of photos in this gallery var photoNum = photoArray.length; /*--------------------------------------------------------------------------*/ // Additional methods for Element added by SU, Couloir Object.extend(Element, { getWidth: function(element) { element = $(element); return element.offsetWidth; }, setWidth: function(element,w) { element = $(element); element.style.width = w +"px"; }, setHeight: function(element,h) { element = $(element); element.style.height = h +"px"; }, setSrc: function(element,src) { element = $(element); element.src = src; }, setHref: function(element,href) { element = $(element); element.href = href; }, setInnerHTML: function(element,content) { element = $(element); element.innerHTML = content; } }); /*--------------------------------------------------------------------------*/ var Slideshow = Class.create(); Slideshow.prototype = { initialize: function(photoId) { this.photoId = photoId; this.photo = 'Photo'; this.photoBox = 'Container'; this.prevLink = 'PrevLink'; this.nextLink = 'NextLink'; this.captionBox = 'CaptionContainer'; this.caption = 'Caption'; this.counter = 'Counter'; this.loader = 'Loading'; }, getCurrentSize: function() { // Get current height and width, subtracting CSS border size this.wCur = Element.getWidth(this.photoBox) - borderSize; this.hCur = Element.getHeight(this.photoBox) - borderSize; }, getNewSize: function() { // Get current height and width this.wNew = photoArray[photoId][1]; this.hNew = photoArray[photoId][2]; }, getScaleFactor: function() { this.getCurrentSize(); this.getNewSize(); // Scalars based on change from old to new this.xScale = (this.wNew / this.wCur) * 100; this.yScale = (this.hNew / this.hCur) * 100; }, setNewPhotoParams: function() { // Set source of new image Element.setSrc(this.photo,photoDir + photoArray[photoId][0]); // Set anchor for bookmarking Element.setHref(this.prevLink, "#" + (photoId+1)); Element.setHref(this.nextLink, "#" + (photoId+1)); }, setPhotoCaption: function() { // Add caption from gallery array Element.setInnerHTML(this.caption,photoArray[photoId][3]); Element.setInnerHTML(this.counter,((photoId+1)+'/'+photoNum)); }, resizePhotoBox: function() { this.getScaleFactor(); new Effect.Scale(this.photoBox, this.yScale, {scaleX: false, duration: 0.1, queue: 'front'}); new Effect.Scale(this.photoBox, this.xScale, {scaleY: false, delay: 0.1, duration: 0.1}); // Dynamically resize caption box as well Element.setWidth(this.captionBox,this.wNew-(-borderSize)); }, showPhoto: function(){ new Effect.Fade(this.loader, {delay: 0.1, duration: 0.1}); // Workaround for problems calling object method "afterFinish" new Effect.Appear(this.photo, {duration: 0.2, queue: 'end', afterFinish: function(){Element.show('CaptionContainer');Element.show('PrevLink');Element.show('NextLink');}}); }, nextPhoto: function(){ // Figure out which photo is next (photoId == (photoArray.length - 1)) ? photoId = 0 : photoId++; this.initSwap(); }, prevPhoto: function(){ // Figure out which photo is previous (photoId == 0) ? photoId = photoArray.length - 1 : photoId--; this.initSwap(); }, initSwap: function() { // Begin by hiding main elements Element.show(this.loader); Element.hide(this.photo); Element.hide(this.captionBox); Element.hide(this.prevLink); Element.hide(this.nextLink); // Set new dimensions and source, then resize this.setNewPhotoParams(); this.resizePhotoBox(); this.setPhotoCaption(); } } /*--------------------------------------------------------------------------*/ // Establish CSS-driven events via Behaviour script var myrules = { '#Photo' : function(element){ element.onload = function(){ var myPhoto = new Slideshow(photoId); myPhoto.showPhoto(); } }, '#PrevLink' : function(element){ element.onmouseover = function(){ soundManager.play('beep'); } element.onclick = function(){ var myPhoto = new Slideshow(photoId); myPhoto.prevPhoto(); soundManager.play('select'); } }, '#NextLink' : function(element){ element.onmouseover = function(){ soundManager.play('beep'); } element.onclick = function(){ var myPhoto = new Slideshow(photoId); myPhoto.nextPhoto(); soundManager.play('select'); } }, a : function(element){ element.onfocus = function(){ this.blur(); } } }; // Add window.onload event to initialize Behaviour.addLoadEvent(init); Behaviour.apply(); function init() { var myPhoto = new Slideshow(photoId); myPhoto.initSwap(); soundManagerInit(); }