//	Lightbox v2.02 //	by Lokesh Dhakar - http://www.huddletogether.com //	3/31/06 // //	For more information on this script, visit: //	http://huddletogether.com/projects/lightbox2/ // //	Licensed under the Creative Commons Attribution 2.5 License - http://creativecommons.org/licenses/by/2.5/ //  //	Credit also due to those who have helped, inspired, and made their code available to the public. //	Including: Scott Upton(uptonic.com), Peter-Paul Koch(quirksmode.org), Thomas Fuchs(mir.aculo.us), and others.
var ix=0
var resizeSpeed=7
var fileLoadingImage="/images/loading.gif"
var fileBottomNavCloseImage="/images/closelabel.png"
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 objBottomNav=document.createElement("div")
objBottomNav.setAttribute('id','bottomNav')
objImageContainer.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)
var objLightboxImage=document.createElement("img")
objLightboxImage.setAttribute('id','lightboxImage')
objImageContainer.appendChild(objLightboxImage)
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 objenlaces=document.createElement("div")
objenlaces.setAttribute('id','enlaces')
objImageData.appendChild(objenlaces)
var objNextLink=document.createElement("a")
objNextLink.setAttribute('id','nextLink')
objNextLink.setAttribute('href','#')
objImageData.appendChild(objNextLink)
var objPrevLink=document.createElement("a")
objPrevLink.setAttribute('id','prevLink')
objPrevLink.setAttribute('href','#')
objImageData.appendChild(objPrevLink)
var objImageDetails=document.createElement("div")
objImageDetails.setAttribute('id','imageDetails')
objImageData.appendChild(objImageDetails)
var objCaption=document.createElement("div")
objCaption.setAttribute('id','caption')
objImageDetails.appendChild(objCaption)
var objcredito=document.createElement("div")
objcredito.setAttribute('id','credito')
objImageDetails.appendChild(objcredito)
var objdescripgal=document.createElement("div")
objdescripgal.setAttribute('id','descripgal')
objImageDetails.appendChild(objdescripgal)
var objNumberDisplay=document.createElement("span")
objNumberDisplay.setAttribute('id','numberDisplay')
objImageDetails.appendChild(objNumberDisplay)
},
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]
var gal_titulo=(anchor.childNodes[0]&&anchor.childNodes[0].type=="hidden")? anchor.childNodes[0].value : ""
var gal_credito=(anchor.childNodes[1]&&anchor.childNodes[0].type=="hidden")? anchor.childNodes[1].value : ""
var gal_descripcion=(anchor.childNodes[2]&&anchor.childNodes[0].type=="hidden")? anchor.childNodes[2].value : ""
if(anchor.getAttribute('href')&&(anchor.getAttribute('rel')==imageLink.getAttribute('rel'))){
imageArray.push(new Array(anchor.getAttribute('href'),gal_titulo,gal_credito,gal_descripcion))}}
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('prevLink')
Element.hide('nextLink')
Element.hide('imageDataContainer')
Element.hide('numberDisplay')
Element.hide('enlaces')
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.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])
Element.setInnerHTML("enlaces","")
divcito=document.getElementById("enlaces")
for(ix=0;ix<imageArray.length;ix++){
linksito=document.createElement("a")
linksito.href="javascript: myLightbox.changeImage("+ix+");"
barra=document.createTextNode(" | ")
texto=document.createTextNode(ix+1)
linksito.appendChild(texto)
divcito.appendChild(barra)
divcito.appendChild(linksito)}
Element.setInnerHTML('credito',imageArray[activeImage][2])
Element.setInnerHTML('descripgal',imageArray[activeImage][3])
Element.show('enlaces')
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(){
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)