// ----------------------------------------------------------------------------------- // // 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 = 20; // Photo directory for this gallery var photoDir = "photos/"; // Define each photo's name, height, width, and caption var photoArray = new Array( // Source, Width, Height, Caption new Array("thai_001.jpg", "800", "532", "Trip to Thailand, March 2007"), new Array("thai_002.jpg", "800", "532", "The places we´ve visited"), new Array("thai_003.jpg", "800", "532", "Khao San Street, Bangkok, the first stop of all backpakers"), new Array("thai_004.jpg", "800", "532", "Saamlaw (túk-túk), a typical local transport"), new Array("thai_005.jpg", "399", "600", "The neons are just everywhere, Khao San Street, Bangkok"), new Array("thai_006.jpg", "399", "600", "Phra Borom Maharatchawong (Grand Palace), Bangkok"), new Array("thai_007.jpg", "800", "532", "The guards, Phra Borom Maharatchawong (Grand Palace), Bangkok"), new Array("thai_008.jpg", "800", "532", "Gold is mine!, Phra Borom Maharatchawong (Grand Palace), Bangkok"), new Array("thai_009.jpg", "800", "532", "Decoration detail, Phra Borom Maharatchawong (Grand Palace), Bangkok"), new Array("thai_010.jpg", "399", "600", "A prayer in front of the Grand Palace"), new Array("thai_011.jpg", "399", "600", "Chakri Maha Prasat (The Grand Palace Hall Chakri), Bangkok"), new Array("thai_012.jpg", "399", "600", "Aphonphimok Pavilon, Grand Palace, Bangkok"), new Array("thai_013.jpg", "800", "532", "The captivation, Chakri Maha Prasat (The Grand Palace Hall Chakri), Bangkok"), new Array("thai_014.jpg", "800", "532", "Dusit Maha Prasat (The Grand Palac Hall Dusit), Bangkok"), new Array("thai_015.jpg", "399", "600", "Wat Pho, Bangkok, the reclining Buddha (46m long, 15m high)"), new Array("thai_016.jpg", "800", "532", "Wat Pho, Bangkok, the reclining Buddha (46m long, 15m high)"), new Array("thai_017.jpg", "399", "600", "China Town, Bangkok,"), new Array("thai_018.jpg", "399", "600", "Life in China Town, Bangkok"), new Array("thai_019.jpg", "399", "600", "Electric line, everywhere in Thailand"), new Array("thai_020.jpg", "399", "600", "A smiling girl"), new Array("thai_021.jpg", "399", "600", "A prayer, China Town, Bangkok"), new Array("thai_022.jpg", "399", "600", "A sacrificial place, China Town, Bangkok"), new Array("thai_023.jpg", "800", "532", "An amazing market in China Town, Bangkok"), new Array("thai_024.jpg", "800", "532", "An amazing market in China Town, Bangkok"), new Array("thai_025.jpg", "800", "532", "An amazing market in China Town, Bangkok"), new Array("thai_026.jpg", "800", "532", "An amazing market in China Town, Bangkok"), new Array("thai_027.jpg", "800", "532", "An amazing market in China Town, Bangkok"), new Array("thai_028.jpg", "800", "532", "TBC - Thai boiled chicken :-)"), new Array("thai_029.jpg", "399", "600", "Wings or strips? hmmmm"), new Array("thai_030.jpg", "800", "532", "A typical local restaurant, Bangkok"), new Array("thai_031.jpg", "800", "532", "A chinese dumplings? Who knows... China Town, Bangkok"), new Array("thai_032.jpg", "399", "600", "Life and work in the street, China Town, Bangkok"), new Array("thai_033.jpg", "399", "600", "China Town, Bangkok, a prayer"), new Array("thai_034.jpg", "800", "532", "China Town, Bangkok, a prayer"), new Array("thai_035.jpg", "399", "600", "China Town, Bangkok, a prayer"), new Array("thai_036.jpg", "399", "600", "China Town, Bangkok"), new Array("thai_037.jpg", "800", "532", "Decoration detail, Wat Arun, Bangkok"), new Array("thai_038.jpg", "800", "532", "Wat Maha That, Bangkok"), new Array("thai_039.jpg", "400", "600", "A young monk"), new Array("thai_040.jpg", "800", "532", "Bus No. 53, Bangkok"), new Array("thai_041.jpg", "399", "600", "A sharp policeman, Bangkok"), new Array("thai_042.jpg", "399", "600", "Wondering schoolgirls, Bangkok"), new Array("thai_043.jpg", "399", "600", "Thai food, noodles and vegetable with nuts"), new Array("thai_044.jpg", "399", "600", "Traffic jam and Skytrain line, New Bangkok"), new Array("thai_045.jpg", "399", "600", "Skyscraper snd Skytrain line, New Bangkok "), new Array("thai_046.jpg", "399", "600", "Leaving Bangkok"), new Array("thai_047.jpg", "399", "600", "A local bus to The Historical Park, Sukothai "), new Array("thai_048.jpg", "399", "600", "By bicycle, The Historical Park, Sukothai"), new Array("thai_049.jpg", "800", "158", "Panorama of the Sukothai ruins"), new Array("thai_050.jpg", "800", "532", "The Historical Park, Sukothai"), new Array("thai_051.jpg", "800", "532", "The Historical Park, Sukothai"), new Array("thai_052.jpg", "399", "600", "A local oldman, Sukothai"), new Array("thai_053.jpg", "800", "532", "A long-distance bus to Chiang Mai"), new Array("thai_054.jpg", "399", "600", "Wat Chiang Man, Chiang Mai"), new Array("thai_055.jpg", "800", "532", "Wat Chiang Man, Chiang Mai"), new Array("thai_056.jpg", "800", "532", "'Buy them freedom...', Wat Chiang Man, Chiang Mai"), new Array("thai_057.jpg", "800", "532", "Wat Chiang Man, Chiang Mai"), new Array("thai_058.jpg", "800", "532", "Wat Phra Singh, Chiang Mai"), new Array("thai_059.jpg", "800", "532", "Wat Phra Singh, Chiang Mai"), new Array("thai_060.jpg", "399", "600", "A monk in a temple, Chiang Mai"), new Array("thai_061.jpg", "399", "600", "A mural in a temple, Chiang mai"), new Array("thai_062.jpg", "800", "532", "Young monks"), new Array("thai_063.jpg", "399", "600", "Having a break in the shadow"), new Array("thai_064.jpg", "800", "532", "Friendly smile"), new Array("thai_065.jpg", "800", "532", "Happy to see it in English.. :)"), new Array("thai_066.jpg", "800", "532", "Elephant riding, jungle north of Chiang Mai"), new Array("thai_067.jpg", "800", "531", "Feeding of elephants, jungle north of Chiang Mai"), new Array("thai_068.jpg", "399", "600", "Nice to meet you."), new Array("thai_069.jpg", "800", "532", "Elephant riding, jungle north of Chiang Mai"), new Array("thai_070.jpg", "800", "532", "By waterfall, jungle north of Chiang Mai"), new Array("thai_071.jpg", "399", "600", "By waterfall, jungle north of Chiang Mai"), new Array("thai_072.jpg", "399", "600", "Trekking in the jungle north of Chiang Mai"), new Array("thai_073.jpg", "800", "532", "A small village where we´ve slept, jungle north of Chiang Mai"), new Array("thai_074.jpg", "800", "532", "Boy with the tire, jungle north of Chiang Mai"), new Array("thai_075.jpg", "800", "532", "Boy with the tire, jungle north of Chiang Mai"), new Array("thai_076.jpg", "800", "532", "Boy with the tire, jungle north of Chiang Mai"), new Array("thai_077.jpg", "399", "600", "The big boss of a small village, jungle north of Chiang Mai"), new Array("thai_078.jpg", "800", "532", "Public toilet, jungle north of Chiang Mai"), new Array("thai_079.jpg", "800", "532", "A rest after work, jungle north of Chiang Mai"), new Array("thai_080.jpg", "399", "600", "Strong-water, jungle north of Chiang Mai"), new Array("thai_081.jpg", "800", "532", "Countryside, jungle north of Chiang Mai"), new Array("thai_082.jpg", "800", "532", "A cow by the roadside, jungle north of Chiang Mai"), new Array("thai_083.jpg", "800", "532", "Fire and fear, trekking in the jungle north of Chiang Mai"), new Array("thai_084.jpg", "800", "532", "Waterfall bathing (so cold!), jungle north of Chiang Mai"), new Array("thai_085.jpg", "399", "600", "Our guide called Coconut, jungle north of Chiang Mai"), new Array("thai_086.jpg", "800", "532", "Rice fields, trekking in the jungle north of Chiang Mai"), new Array("thai_087.jpg", "399", "600", "Bamboo rafting, jungle north of Chiang Mai"), new Array("thai_088.jpg", "800", "532", "Thai chicken soup with noodles"), new Array("thai_089.jpg", "800", "532", "Thai soup with noodles, pork, nuts and sugar"), new Array("thai_090.jpg", "399", "600", "Happy boat diver, on the road to Koh Hai island"), new Array("thai_091.jpg", "800", "532", "On the road to Koh Hai island"), new Array("thai_092.jpg", "399", "600", "A beach, Koh Hai island"), new Array("thai_093.jpg", "399", "600", "Walking at sunrise, Koh Hai island"), new Array("thai_094.jpg", "399", "600", "Walking at sunrise, Koh Hai island"), new Array("thai_095.jpg", "399", "600", "A lonely boat, Koh Hai island"), new Array("thai_096.jpg", "800", "532", "A beach at low tide, Koh Hai island"), new Array("thai_097.jpg", "399", "600", "Our bamboo bungalow, Koh Hai island"), new Array("thai_098.jpg", "800", "532", "Paradise resort, Koh Hai island"), new Array("thai_099.jpg", "399", "600", "A wild pineapple growing in the jungle, Koh Hai island"), new Array("thai_100.jpg", "399", "600", "Just beautiful, Koh Hai island"), new Array("thai_101.jpg", "800", "532", "Life is so easy here..., Ko Hai island"), new Array("thai_102.jpg", "399", "600", "An easful palm grove, Koh Hai island"), new Array("thai_103.jpg", "800", "532", "A sunset, Koh Hai island"), new Array("thai_104.jpg", "399", "600", "The old man and the sea?"), new Array("thai_105.jpg", "800", "532", "Rock in the sea, Andaman sea"), new Array("thai_106.jpg", "800", "532", "A luxury resort on the coast, Koh Muk island"), new Array("thai_107.jpg", "800", "283", "Gekon, Koh Muk island"), new Array("thai_108.jpg", "399", "600", "Frog in the bathroom, Koh Muk island"), new Array("thai_109.jpg", "399", "600", "Dreamy veil, Koh Muk island"), new Array("thai_110.jpg", "800", "532", "Dog´s hangover, Koh Muk island"), new Array("thai_111.jpg", "399", "600", "Our bungalow in the shadow of the palms, Koh Muk island"), new Array("thai_112.jpg", "800", "532", "Skype me :)"), new Array("thai_113.jpg", "399", "600", "Relaxation, Koh Lanta Yai island"), new Array("thai_114.jpg", "800", "532", "A depopulated beach, Koh Lanta Yai island"), new Array("thai_115.jpg", "399", "600", "Gas station in the middle of the nowhere, Koh Lanta Yai island"), new Array("thai_116.jpg", "399", "600", "Long-tail boat, Koh Lanta Yai island"), new Array("thai_117.jpg", "800", "532", "Couple, Koh Lanta Yai island"), new Array("thai_118.jpg", "399", "600", "No problem, Koh Lanta Yai island"), new Array("thai_119.jpg", "800", "532", "Delicious pinapple pancake, Koh Lanta Yai island"), new Array("thai_120.jpg", "800", "532", "The end of the beatiful day, Koh Tao island"), new Array("thai_121.jpg", "800", "532", "Sunset, Koh Tao island"), new Array("thai_122.jpg", "399", "600", "Tout, Koh Samui island"), new Array("thai_123.jpg", "800", "532", "Sunset in the port, Koh Tao island"), new Array("thai_124.jpg", "800", "532", "Trip around Koh Tao island"), new Array("thai_125.jpg", "800", "532", "Snorkelling boat, Koh Tao island"), new Array("thai_126.jpg", "800", "532", "Hi there..., Koh Tao island"), new Array("thai_127.jpg", "399", "600", "Snorkelling crab? :), Koh Tao island"), new Array("thai_128.jpg", "800", "158", "Marvelous panorama, Koh Nang Yuan islands"), new Array("thai_129.jpg", "800", "532", "Smiling all the time, Koh Nang Yuan islands"), new Array("thai_130.jpg", "399", "600", "Coconut harvesting, Koh Lanta Yai island"), new Array("thai_131.jpg", "800", "532", "'I love my job!', Koh Lanta Yai island"), new Array("thai_132.jpg", "399", "600", "Get out of the road!"), new Array("thai_133.jpg", "800", "532", "Good bye, Thailand..."), new Array("thai_134.jpg", "800", "532", "Surprised by the snow, Zurich Airport") ); // 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.3, queue: 'front'}); new Effect.Scale(this.photoBox, this.xScale, {scaleY: false, delay: 0.1, duration: 0.3}); // Dynamically resize caption box as well Element.setWidth(this.captionBox,this.wNew-(-borderSize)); }, showPhoto: function(){ new Effect.Fade(this.loader, {delay: 0, duration: 0.3}); // Workaround for problems calling object method "afterFinish" new Effect.Appear(this.photo, {duration: 0.3, 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(); preloadImages(photoId); } }, '#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(); } } }; // Automatic slideshow //setTimeout("play()", 5000); function play() { var myPhoto = new Slideshow(photoId); myPhoto.nextPhoto(); timerID = setTimeout("play()", 5000); control = document.getElementById("Controls").innerHTML="Pause"; } function pause() { clearTimeout(timerID); control = document.getElementById("Controls").innerHTML="Play"; } // Preloading images... function preloadImages(photoId) { var preImages = new Array(); for (i = (photoId+1); i < (photoId+3); i++) { preImages[i] = new Image(); preImages[i].src = photoDir + photoArray[i][0]; } } // Add window.onload event to initialize Behaviour.addLoadEvent(init); Behaviour.apply(); function init() { var myPhoto = new Slideshow(photoId); myPhoto.initSwap(); soundManagerInit(); }