/* ####### Animator.js code starts here ########## */ /* Animator.js 1.1.9 This library is released under the BSD license: Copyright (c) 2006, Bernard Sumption. All rights reserved. Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met: Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer. Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution. Neither the name BernieCode nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission. THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE REGENTS OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. */ // Applies a sequence of numbers between 0 and 1 to a number of subjects // construct - see setOptions for parameters function Animator(options) { this.setOptions(options); var _this = this; this.timerDelegate = function(){_this.onTimerEvent()}; this.subjects = []; this.target = 0; this.state = 0; this.lastTime = null; }; Animator.prototype = { // apply defaults setOptions: function(options) { this.options = Animator.applyDefaults({ interval: 20, // time between animation frames duration: 400, // length of animation onComplete: function(){}, onStep: function(){}, transition: Animator.tx.easeInOut }, options); }, // animate from the current state to provided value seekTo: function(to) { this.seekFromTo(this.state, to); }, // animate from the current state to provided value seekFromTo: function(from, to) { this.target = Math.max(0, Math.min(1, to)); this.state = Math.max(0, Math.min(1, from)); this.lastTime = new Date().getTime(); if (!this.intervalId) { this.intervalId = window.setInterval(this.timerDelegate, this.options.interval); } }, // animate from the current state to provided value jumpTo: function(to) { this.target = this.state = Math.max(0, Math.min(1, to)); this.propagate(); }, // seek to the opposite of the current target toggle: function() { this.seekTo(1 - this.target); }, // add a function or an object with a method setState(state) that will be called with a number // between 0 and 1 on each frame of the animation addSubject: function(subject) { this.subjects[this.subjects.length] = subject; return this; }, // remove all subjects clearSubjects: function() { this.subjects = []; }, // forward the current state to the animation subjects propagate: function() { var value = this.options.transition(this.state); for (var i=0; i= Math.abs(this.state - this.target)) { this.state = this.target; } else { this.state += movement; } try { this.propagate(); } finally { this.options.onStep.call(this); if (this.target == this.state) { window.clearInterval(this.intervalId); this.intervalId = null; this.options.onComplete.call(this); } } }, // shortcuts play: function() {this.seekFromTo(0, 1)}, reverse: function() {this.seekFromTo(1, 0)}, // return a string describing this Animator, for debugging inspect: function() { var str = "# 20) return; } }, getStyle: function(state) { state = this.from + ((this.to - this.from) * state); if (this.property == 'filter') return "alpha(opacity=" + Math.round(state*100) + ")"; if (this.property == 'opacity') return state; return Math.round(state) + this.units; }, inspect: function() { return "\t" + this.property + "(" + this.from + this.units + " to " + this.to + this.units + ")\n"; } } // animates a colour based style property between two hex values function ColorStyleSubject(els, property, from, to) { this.els = Animator.makeArray(els); this.property = Animator.camelize(property); this.to = this.expandColor(to); this.from = this.expandColor(from); this.origFrom = from; this.origTo = to; } ColorStyleSubject.prototype = { // parse "#FFFF00" to [256, 256, 0] expandColor: function(color) { var hexColor, red, green, blue; hexColor = ColorStyleSubject.parseColor(color); if (hexColor) { red = parseInt(hexColor.slice(1, 3), 16); green = parseInt(hexColor.slice(3, 5), 16); blue = parseInt(hexColor.slice(5, 7), 16); return [red,green,blue] } if (window.DEBUG) { //alert("Invalid colour: '" + color + "'"); alert(ICaltgopub.pa_txt1 + color + "' "); } }, getValueForState: function(color, state) { return Math.round(this.from[color] + ((this.to[color] - this.from[color]) * state)); }, setState: function(state) { var color = '#' + ColorStyleSubject.toColorPart(this.getValueForState(0, state)) + ColorStyleSubject.toColorPart(this.getValueForState(1, state)) + ColorStyleSubject.toColorPart(this.getValueForState(2, state)); for (var i=0; i 255) number = 255; var digits = number.toString(16); if (number < 16) return '0' + digits; return digits; } ColorStyleSubject.parseColor.rgbRe = /^rgb\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)$/i; ColorStyleSubject.parseColor.hexRe = /^\#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/; // Animates discrete styles, i.e. ones that do not scale but have discrete values // that can't be interpolated function DiscreteStyleSubject(els, property, from, to, threshold) { this.els = Animator.makeArray(els); this.property = Animator.camelize(property); this.from = from; this.to = to; this.threshold = threshold || 0.5; } DiscreteStyleSubject.prototype = { setState: function(state) { var j=0; for (var i=0; i section ? 1 : 0); } if (this.options.rememberance) { document.location.hash = this.rememberanceTexts[section]; } } } /* ####### Animator.js code ends here ########## */ /* ####### Photoalbum.js code starts here ########## */ /***** GLOBALS *****/ var slowest = 5000; var slow = 4000; var med = 3000; var fast = 2000; var fastest = 1000; var slideTime; var randTime; /*****These are our events****/ //parent.content.onscroll = adjustoverlay; window.onscroll = adjustOverlay; //window.onresize = adjustOverlay; /***** Event Functions*****/ function checkMouseover(evt) { //alert(evt); if (!evt) var evt = window.event; if(document.all) evtObj = evt.srcElement; else evtObj = evt.target; if (evtObj.id.substring(0,5) == 'thumb' && evtObj.parentNode.offsetWidth < 75) { var positionX = getCoords(evtObj).x; var positionY = getCoords(evtObj).y; enlargedImage = $('enlargedImage'+this.photoNum); enlargedImage.style.width = Math.floor(evtObj.width * 2.25) + 'px'; enlargedImage.style.height = Math.floor(evtObj.height * 2.25) + 'px'; enlargedImage.style.position = "absolute"; enlargedImage.style.top = positionY - Math.floor(evtObj.height * 0.75) + 'px'; enlargedImage.style.left = positionX - Math.floor(evtObj.width * 0.75)+ 'px'; enlargedImage.src = this.imageAttributes[this.currentImage].olpath; // so we size down rather than up //alert(enlargedImage.style.width); enlargedImage.style.display = 'block'; } } function checkDoubleClicks(evt) { if (!evt) var evt = window.event; if(document.all) evtObj = evt.srcElement; else evtObj = evt.target; if (((evtObj.id.substring(0, 5) == "thumb") || (evtObj.id.substring(0, 8) == 'enlarged')) && this.mainViewer == 1) { //setting height & width of background gray area. PA_ID = this.photoNum; window.document.body.appendChild($('detailScreen')); window.document.body.appendChild($('detailsContainer' + PA_ID)); $('detailScreen').style.height = getWinHeight(); $('detailScreen').style.width = getWinWidth(); this.showDetails(evtObj); if ($('pausebutton'+this.photoNum).style.display == 'block') { //this.stop(); this.midPlay = 1; } } else return; } function checkClickables(evt) { //alert(evt.target.id); //alert(this.currentImage); if (!evt) var evt = window.event; if(document.all) evtObj = evt.srcElement; else evtObj = evt.target; if (((evtObj.id.substring(0, 5) == 'thumb') || (evtObj.id.substring(0, 8) == 'enlarged')) && (evtObj.id.substring(5, 8) != "Con")) { thumbID = evtObj.id.split("_"); this.lastImage=this.currentImage; this.currentImage = parseInt(thumbID[2]); //image container this.currentImage = parseInt(thumbID[2]); //image this.findCurrent(); this.showCurrent(evtObj); } /*if ((evtObj.id.substring(0, 8) == "enlarged")) { this.lastImage = this.currentImage; this.currentImage = parseInt($('enlargedImage'+this.photoNum).name); this.findCurrent(); this.showCurrent(); }*/ if((evtObj.id == ("mainImage"+this.photoNum) || evtObj.id == ("imageContainer"+this.photoNum)) || (evtObj.id.substring(0, 5) == "thumb" && this.mainViewer == 0) || ((evtObj.id.substring(0, 8) == "enlarged") && (this.mainViewer == 0))) { //setting height & width of background gray area. PA_ID = this.photoNum; //detailsScreen = $('detailscreen'); window.document.body.appendChild($('detailScreen')); window.document.body.appendChild($('detailsContainer' + PA_ID)); $('detailScreen').style.height = getWinHeight(); $('detailScreen').style.width = getWinWidth(); this.showDetails(evtObj); //this.stop(); this.midPlay = 1; } } //document.onmouseout = checkMouseout PhotoAlbum.prototype.calcRatio = calcRatio; PhotoAlbum.prototype.buildThumbs = buildThumbs; PhotoAlbum.prototype.updateCounter = updateCounter; PhotoAlbum.prototype.buildMainViewer = buildMainViewer; PhotoAlbum.prototype.showDetails = showDetails; PhotoAlbum.prototype.showNextDetail = showNextDetail; PhotoAlbum.prototype.showPrevDetail = showPrevDetail; PhotoAlbum.prototype.closeDetails = closeDetails; PhotoAlbum.prototype.next = next; PhotoAlbum.prototype.previous = previous; PhotoAlbum.prototype.findCurrent = findCurrent; PhotoAlbum.prototype.showCurrent = showCurrent; PhotoAlbum.prototype.initPlay = initPlay; PhotoAlbum.prototype.linearPlay = linearPlay; PhotoAlbum.prototype.randPlay = randPlay; PhotoAlbum.prototype.stop = stop; PhotoAlbum.prototype.f_Slide = f_Slide; PhotoAlbum.prototype.l_Slide = l_Slide; PhotoAlbum.prototype.changeSpeed = changeSpeed; PhotoAlbum.prototype.adjustOverlay = adjustOverlay; PhotoAlbum.prototype.hideDetails = hideDetails; PhotoAlbum.prototype.checkClickables = checkClickables; PhotoAlbum.prototype.checkDoubleClicks = checkDoubleClicks; PhotoAlbum.prototype.checkMouseover = checkMouseover; /*****The PhotoAlbum object ****/ function PhotoAlbum(photoNum, mainWidth,photoAlbumType,imageBackColor,titleColor, thumbWidth,numOfThumbs,aspectRatio,titles, imageAttributes,textFont,specifyBoxWidth, newIC) { this.photoNum=photoNum; //The photo number this.mainWidth = mainWidth; //colum width of the web page - should determine the size of the entire photo album this.photoAlbumType = photoAlbumType; //PhotoAlbum Type 1-5 this.imageBackColor = imageBackColor; //color of overlay matte and thumbnail BG: defualt is WHITE this.titleColor = titleColor; //title/desc text color this.textFont = textFont; this.specifyBoxWidth = specifyBoxWidth; if(this.specifyBoxWidth == "true"){ this.numOfThumbs = 0; if (thumbWidth.length == 0) { this.thumbWidth = 0; } else { this.thumbWidth = parseInt(thumbWidth); //advance option } } else{ this.thumbWidth = 0; if (numOfThumbs.length == 0) { this.numOfThumbs = 0; } else { this.numOfThumbs = parseInt(numOfThumbs); //calculated based on mainWidth, 0 means nothing specified and use 'thumbWidth' advance option } } this.aspectRatio = aspectRatio; //could be "square", "portrait", "landscape": default should be SQUARE per the specs, landscape might be better :-P if (titles.length == 0 || titles == "false") { this.titles = 0; } else { this.titles = 1; } this.slideSpeed = med; //default is medium, 2 seconds this.imageAttributes = imageAttributes; //should be an array this.imageTotal = imageAttributes.length; for(i=0; i 0) { for(var i=0; i 0 ) { if (document.all) this.thumbWidth = Math.floor(this.mainWidth/this.numOfThumbs) - 13; //18 is padding+ border + left/right extremes else this.thumbWidth = Math.floor(this.mainWidth/this.numOfThumbs) - 12; } this.calcRatio(); $('thumbContainer'+this.photoNum).style.width = this.mainWidth + "px"; this.thumbDiv = new Array; this.thumbIMG = new Array; this.thumbTitle = new Array; this.thumbTable = new Array; this.thumbTBody = new Array; this.thumbTR = new Array; this.thumbTD = new Array; for(i=0; i largestTitle[j]) { largestTitle[j] = this.imageAttributes[i].title.length; this.largestDiv[j] = this.thumbTitle[i]; //alert(this.largestDiv[j].offsetHeight); } if(((i+1)%this.numOfThumbs) == 0) { j++; largestTitle[j] = 0; this.largestDiv[j] = this.thumbTitle[i]; } /* if(this.imageAttributes[i].title.length > largestTitle) largestTitle = this.imageAttributes[i].title.length; */ /**Attach**/ $("thumbContainer"+this.photoNum).appendChild(this.thumbDiv[i]); this.thumbDiv[i].appendChild(this.thumbTable[i]); this.thumbTable[i].appendChild(this.thumbTBody[i]); this.thumbTBody[i].appendChild(this.thumbTR[i]); this.thumbTR[i].appendChild(this.thumbTD[i]); this.thumbTD[i].appendChild(this.thumbIMG[i]); this.thumbDiv[i].appendChild(this.thumbTitle[i]); } //Calculate height with titles PER ROW var newHeight = []; if (this.titles == 1) { //get specific height per row for(i=0; i<=j; i++) { approxWidth = Math.ceil(largestTitle[i]*11); //font size is 11px if(approxWidth > this.thumbWidth) rowUnit = Math.ceil(approxWidth/this.thumbWidth); else if(largestTitle[i] == 0) rowUnit = 0; else rowUnit = 1; newHeight[i] = rowUnit * 16; //line-height is set to 16px } j=0; //reset row counter for(i=0; i 0) { this.lastImage=this.currentImage; this.currentImage--; } else { this.currentImage=this.imageTotal-1; this.lastImage = 0; } this.findCurrent(); this.showCurrent(); } function showPrevDetail() { /* if (this.currentImage != 0) this.currentImage--; else this.currentImage = this.imageTotal-1; */ this.previous(); $("popImage"+this.photoNum).src = this.imageAttributes[this.currentImage].olpath; $("popTitle"+this.photoNum).innerHTML = this.imageAttributes[this.currentImage].title; $("popDesc"+this.photoNum).innerHTML = this.imageAttributes[this.currentImage].desc; } function randPlay() { if (stopSlide != 1) { if (this.currentImage <= this.imageTotal) { this.lastImage = this.currentImage; while (this.lastImage == this.currentImage) { this.currentImage = randNum(0, (this.imageTotal-1)); } this.findCurrent(); this.showCurrent(); } } else return; } function changeSpeed(speed, num, relative_path) { this.slideSpeed = speed; //speed = this.slideSpeed; //just trust me for (i=num; i<6; i++) { $('speed'+i+this.photoNum).src = relative_path+'images/photoalbum/button_photoSpeed'+i+'.jpg'; //$('detailspeed'+i).src = 'images/photoalbum/button_photoSpeed'+i+'.jpg'; } for (i=1; i<=num; i++) { $('speed'+i+this.photoNum).src = relative_path+'images/photoalbum/button_photoSpeed'+i+'_ON.jpg'; //$('detailspeed'+i).src = 'images/button_photoSpeed'+i+'_ON.jpg'; } if (this.randomSlideShow == 1) { clearInterval(this.randInterval); this.randInterval = window.setInterval(createObjectCallback(this, this.randPlay), this.slideSpeed); } else if($('playbutton'+this.photoNum).style.display == 'none') { clearInterval(this.playInterval); this.playInterval = window.setInterval(createObjectCallback(this, this.linearPlay), this.slideSpeed); } } function swap(a, b) { $(a).style.display = 'none'; $(b).style.display = 'inline'; } function $(id) { return document.getElementById(id); } function randNum(x, y) { var range = y - x + 1; return Math.floor(Math.random() * range) + x; } function getCoords(element) { var valueT = 0, valueL = 0; do { valueT += element.offsetTop || 0; valueL += element.offsetLeft || 0; element = element.offsetParent; } while (element); return {x: valueL, y: valueT}; } function adjustOverlay() { //onscroll try{ if (document.all &&(navigator.appVersion.indexOf("MSIE 7.")==-1)) { $('detailScreen').style.height = getWinHeight(); //adjust for resize $('detailScreen').style.width = getWinWidth(); //adjust for resize //$("detailsContainer"+this.photoNum).style.top = document.documentElement.scrollTop + 10 + "px"; if(this.newIC == 'false') { //legacy frames //$("detailScreen").style.top = parent.content.document.body.scrollTop + "px"; } else { $("detailScreen").style.top = document.documentElement.scrollTop + "px"; } } } catch(e){return false;} //else { // $("detailsContainer").style.top = window.pageYOffset + 10 + "px"; // $("detailScreen").style.top = window.pageYOffset + "px"; // } } function createObjectCallback(obj, fn) { return function() { fn.apply(obj, arguments); }; } /* ####### Photoalbum.js code ends here ########## */