var fileLoadingImage="img/loading.gif"
var fileBottomNavCloseImage="img/closelabel.gif"
var resizeSpeed=7
var borderSize=10
var imageArray=new Array
var activeImage
if(resizeSpeed>10){resizeSpeed=10;}
if(resizeSpeed<1){resizeSpeed=1;}
resizeDuration=(11-resizeSpeed)*0.15
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"
},
setTop: function(element,t){
element=$(element)
element.style.top=t+"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}
})
Array.prototype.removeDuplicates=function(){
for(i=1;i<this.length;i++){
if(this[i][0]==this[i-1][0]){
this.splice(i,1)}}}
Array.prototype.empty=function(){
for(i=0;i<=this.length;i++){
this.shift()}}
var Lightbox=Class.create()
Lightbox.prototype={
initialize: function(){
if(!document.getElementsByTagName){return;}
var anchors=document.getElementsByTagName('a')
for(var i=0;i<anchors.length;i++){
var anchor=anchors[i]
var relAttribute=String(anchor.getAttribute('rel'))
if(anchor.getAttribute('href')&&(relAttribute.toLowerCase().match('lightbox'))){
anchor.onclick=function(){myLightbox.start(this);return false;}}}
var objBody=document.getElementsByTagName("body").item(0)
var objOverlay=document.createElement("div")
objOverlay.setAttribute('id','overlay')
objOverlay.style.display='none'
objOverlay.onclick=function(){myLightbox.end();return false;}
objBody.appendChild(objOverlay)
var objLightbox=document.createElement("div")
objLightbox.setAttribute('id','lightbox')
objLightbox.style.display='none'
objBody.appendChild(objLightbox)
var objOuterImageContainer=document.createElement("div")
objOuterImageContainer.setAttribute('id','outerImageContainer')
objLightbox.appendChild(objOuterImageContainer)
var objImageContainer=document.createElement("div")
objImageContainer.setAttribute('id','imageContainer')
objOuterImageContainer.appendChild(objImageContainer)
var objLightboxImage=document.createElement("img")
objLightboxImage.setAttribute('id','lightboxImage')
objImageContainer.appendChild(objLightboxImage)
var objHoverNav=document.createElement("div")
objHoverNav.setAttribute('id','hoverNav')
objImageContainer.appendChild(objHoverNav)
var objPrevLink=document.createElement("a")
objPrevLink.setAttribute('id','prevLink')
objPrevLink.setAttribute('href','#')
objHoverNav.appendChild(objPrevLink)
var objNextLink=document.createElement("a")
objNextLink.setAttribute('id','nextLink')
objNextLink.setAttribute('href','#')
objHoverNav.appendChild(objNextLink)
var objLoading=document.createElement("div")
objLoading.setAttribute('id','loading')
objImageContainer.appendChild(objLoading)
var objLoadingLink=document.createElement("a")
objLoadingLink.setAttribute('id','loadingLink')
objLoadingLink.setAttribute('href','#')
objLoadingLink.onclick=function(){myLightbox.end();return false;}
objLoading.appendChild(objLoadingLink)
var objLoadingImage=document.createElement("img")
objLoadingImage.setAttribute('src',fileLoadingImage)
objLoadingLink.appendChild(objLoadingImage)
var objImageDataContainer=document.createElement("div")
objImageDataContainer.setAttribute('id','imageDataContainer')
objImageDataContainer.className='clearfix'
objLightbox.appendChild(objImageDataContainer)
var objImageData=document.createElement("div")
objImageData.setAttribute('id','imageData')
objImageDataContainer.appendChild(objImageData)
var objImageDetails=document.createElement("div")
objImageDetails.setAttribute('id','imageDetails')
objImageData.appendChild(objImageDetails)
var objCaption=document.createElement("span")
objCaption.setAttribute('id','caption')
objImageDetails.appendChild(objCaption)
var objNumberDisplay=document.createElement("span")
objNumberDisplay.setAttribute('id','numberDisplay')
objImageDetails.appendChild(objNumberDisplay)
var objBottomNav=document.createElement("div")
objBottomNav.setAttribute('id','bottomNav')
objImageData.appendChild(objBottomNav)
var objBottomNavCloseLink=document.createElement("a")
objBottomNavCloseLink.setAttribute('id','bottomNavClose')
objBottomNavCloseLink.setAttribute('href','#')
objBottomNavCloseLink.onclick=function(){myLightbox.end();return false;}
objBottomNav.appendChild(objBottomNavCloseLink)
var objBottomNavCloseImage=document.createElement("img")
objBottomNavCloseImage.setAttribute('src',fileBottomNavCloseImage)
objBottomNavCloseLink.appendChild(objBottomNavCloseImage)
},
start: function(imageLink){
hideSelectBoxes()
var arrayPageSize=getPageSize()
Element.setHeight('overlay',arrayPageSize[1])
new Effect.Appear('overlay',{duration: 0.2,from: 0.0,to: 0.8})
imageArray=[]
imageNum=0
if(!document.getElementsByTagName){return;}
var anchors=document.getElementsByTagName('a')
if((imageLink.getAttribute('rel')=='lightbox')){
imageArray.push(new Array(imageLink.getAttribute('href'),imageLink.getAttribute('title')))
}else{
for(var i=0;i<anchors.length;i++){
var anchor=anchors[i]
if(anchor.getAttribute('href')&&(anchor.getAttribute('rel')==imageLink.getAttribute('rel'))){
imageArray.push(new Array(anchor.getAttribute('href'),anchor.getAttribute('title')))}}
imageArray.removeDuplicates()
while(imageArray[imageNum][0] !=imageLink.getAttribute('href')){imageNum++;}}
var arrayPageSize=getPageSize()
var arrayPageScroll=getPageScroll()
var lightboxTop=arrayPageScroll[1]+(arrayPageSize[3]/15)
Element.setTop('lightbox',lightboxTop)
Element.show('lightbox')
this.changeImage(imageNum)
},
changeImage: function(imageNum){
activeImage=imageNum
Element.show('loading')
Element.hide('lightboxImage')
Element.hide('hoverNav')
Element.hide('prevLink')
Element.hide('nextLink')
Element.hide('imageDataContainer')
Element.hide('numberDisplay')
imgPreloader=new Image()
imgPreloader.onload=function(){
Element.setSrc('lightboxImage',imageArray[activeImage][0])
myLightbox.resizeImageContainer(imgPreloader.width,imgPreloader.height)}
imgPreloader.src=imageArray[activeImage][0]
},
resizeImageContainer: function(imgWidth,imgHeight){
this.wCur=Element.getWidth('outerImageContainer')
this.hCur=Element.getHeight('outerImageContainer')
this.xScale=((imgWidth+(borderSize*2))/this.wCur)*100
this.yScale=((imgHeight+(borderSize*2))/this.hCur)*100
wDiff=(this.wCur-borderSize*2)-imgWidth
hDiff=(this.hCur-borderSize*2)-imgHeight
if(!(hDiff==0)){new Effect.Scale('outerImageContainer',this.yScale,{scaleX: false,duration: resizeDuration,queue: 'front'});}
if(!(wDiff==0)){new Effect.Scale('outerImageContainer',this.xScale,{scaleY: false,delay: resizeDuration,duration: resizeDuration});}
if((hDiff==0)&&(wDiff==0)){
if(navigator.appVersion.indexOf("MSIE")!=-1){pause(250);}else{pause(100);}}
Element.setHeight('prevLink',imgHeight)
Element.setHeight('nextLink',imgHeight)
Element.setWidth('imageDataContainer',imgWidth+(borderSize*2))
this.showImage()
},
showImage: function(){
Element.hide('loading')
new Effect.Appear('lightboxImage',{duration: 0.5,queue: 'end',afterFinish: function(){myLightbox.updateDetails();}})
this.preloadNeighborImages()
},
updateDetails: function(){
Element.show('caption')
Element.setInnerHTML('caption',imageArray[activeImage][1])
if(imageArray.length>1){
Element.show('numberDisplay')
Element.setInnerHTML('numberDisplay',"Image "+eval(activeImage+1)+" of "+imageArray.length)}
new Effect.Parallel(
[ new Effect.SlideDown('imageDataContainer',{sync: true,duration: resizeDuration+0.25,from: 0.0,to: 1.0}),
new Effect.Appear('imageDataContainer',{sync: true,duration: 1.0})],
{duration: 0.65,afterFinish: function(){myLightbox.updateNav();}}
)
},
updateNav: function(){
Element.show('hoverNav')
if(activeImage !=0){
Element.show('prevLink')
document.getElementById('prevLink').onclick=function(){
myLightbox.changeImage(activeImage-1);return false}}
if(activeImage !=(imageArray.length-1)){
Element.show('nextLink')
document.getElementById('nextLink').onclick=function(){
myLightbox.changeImage(activeImage+1);return false}}
this.enableKeyboardNav()
},
enableKeyboardNav: function(){
document.onkeydown=this.keyboardAction
},
disableKeyboardNav: function(){
document.onkeydown=''
},
keyboardAction: function(e){
if(e==null){
keycode=event.keyCode
}else{
keycode=e.which}
key=String.fromCharCode(keycode).toLowerCase()
if((key=='x')||(key=='o')||(key=='c')){
myLightbox.end()
}else if(key=='p'){
if(activeImage !=0){
myLightbox.disableKeyboardNav()
myLightbox.changeImage(activeImage-1)}
}else if(key=='n'){
if(activeImage !=(imageArray.length-1)){
myLightbox.disableKeyboardNav()
myLightbox.changeImage(activeImage+1)}}
},
preloadNeighborImages: function(){
if((imageArray.length-1)>activeImage){
preloadNextImage=new Image()
preloadNextImage.src=imageArray[activeImage+1][0]}
if(activeImage>0){
preloadPrevImage=new Image()
preloadPrevImage.src=imageArray[activeImage-1][0]}
},
end: function(){
this.disableKeyboardNav()
Element.hide('lightbox')
new Effect.Fade('overlay',{duration: 0.2})
showSelectBoxes()}}
function getPageScroll(){
var yScroll
if(self.pageYOffset){
yScroll=self.pageYOffset
}else if(document.documentElement&&document.documentElement.scrollTop){
yScroll=document.documentElement.scrollTop
}else if(document.body){
yScroll=document.body.scrollTop}
arrayPageScroll=new Array('',yScroll)
return arrayPageScroll}
function getPageSize(){
var xScroll,yScroll
if(window.innerHeight&&window.scrollMaxY){
xScroll=document.body.scrollWidth
yScroll=window.innerHeight+window.scrollMaxY
}else if(document.body.scrollHeight>document.body.offsetHeight){
xScroll=document.body.scrollWidth
yScroll=document.body.scrollHeight
}else{
xScroll=document.body.offsetWidth
yScroll=document.body.offsetHeight}
var windowWidth,windowHeight
if(self.innerHeight){
windowWidth=self.innerWidth
windowHeight=self.innerHeight
}else if(document.documentElement&&document.documentElement.clientHeight){
windowWidth=document.documentElement.clientWidth
windowHeight=document.documentElement.clientHeight
}else if(document.body){
windowWidth=document.body.clientWidth
windowHeight=document.body.clientHeight}
if(yScroll<windowHeight){
pageHeight=windowHeight
}else{
pageHeight=yScroll}
if(xScroll<windowWidth){
pageWidth=windowWidth
}else{
pageWidth=xScroll}
arrayPageSize=new Array(pageWidth,pageHeight,windowWidth,windowHeight)
return arrayPageSize}
function getKey(e){
if(e==null){
keycode=event.keyCode
}else{
keycode=e.which}
key=String.fromCharCode(keycode).toLowerCase()
if(key=='x'){}}
function listenKey(){document.onkeypress=getKey;}
function showSelectBoxes(){
selects=document.getElementsByTagName("select")
for(i=0;i !=selects.length;i++){
selects[i].style.visibility="visible"}}
function hideSelectBoxes(){
selects=document.getElementsByTagName("select")
for(i=0;i !=selects.length;i++){
selects[i].style.visibility="hidden"}}
function pause(numberMillis){
var now=new Date()
var exitTime=now.getTime()+numberMillis
while(true){
now=new Date()
if(now.getTime()>exitTime)
return}}
function initLightbox(){myLightbox=new Lightbox();}
Event.observe(window,'load',initLightbox,false)