var overlayTime=0.5;
var overlayOverlayOpacity=0.7;

Event.observe(window,'load',overlaysInit);

function overlaysInit() {
    $$('.overlayAble').each(function(e,i){
        if (e.ancestors().any(function(a) { return (a.hasClassName('imageGallery4ColTall') || a.hasClassName('imageGallery3ColShort') || a.hasClassName('imageGallery3ColWide')); })) {
            thumb=false;
        } else {
            thumb=e.select('img')[0];
        }
        e.identify();
        if (thumb) {
            if (BrowserDetect.browser=='Explorer' && clickedTab!=undefined) { // elements must be visible in page to get widths and heights, these ifs temporarily undo the tab features to do this
                $$('.tabContent').each(function(e){e.writeAttribute('storedStyleDisplay',e.style.display);e.style.display='block';});
            }
            iconWidth=parseInt(overlayReadCSS('overlayment.css','.overlayIcon','width'));
            iconHeight=parseInt(overlayReadCSS('overlayment.css','.overlayIcon','height'));
            e.style.width=thumb.getWidth()+'px';
            e.style.height=thumb.getHeight()+'px';
            oldHTML=e.innerHTML;
            wrapper=e.wrap('div');
            wrapper.addClassName('overlayWrapper');
            wrapper.style.width=e.getWidth()+'px';
            wrapper.style.height=e.getHeight()+'px';
            wrapper.insert({bottom:'<div class="overlayIcon" style="left: '+(thumb.getWidth()-iconWidth)+'px; top:'+(thumb.getHeight()-iconHeight)+'px;"></div>'});
            actionItem=wrapper;
            if (BrowserDetect.browser=='Explorer' && clickedTab!=undefined) {
                $$('.tabContent').each(function(e){e.style.display=e.readAttribute('storedStyleDisplay');e.writeAttribute('storedStyleDisplay',null);});
            }
        } else {
            actionItem=e;
        }
        actionItem.writeAttribute('overlaysrcid',e.id);
        actionItem.onclick=function(){
            overlayOverlayShow(this.readAttribute('overlaysrcid'));
            return false;
        }
    });
}

var overlayIsEnlarged=false;
var overlayIsMoving=false;
var overlayImageExtensions=['.jpg','.gif','.bmp','.png']; //these will use the image overlay and place URL in an img tag, everything else will be sent to an iframe
var ie8FixInterval;
var overlayHoldsImage=false;
function overlayOverlayShow(which,inW,inH,inS,useDiv) {
    if (!overlayIsEnlarged && !overlayIsMoving && !$('overlayOverlay')) {
        if (typeof(which)=='string') {
            //for direct javascript calls
            src=which;
            tW=inW;
            tH=inH;
            tS=(inS=='true'||inS=='yes')?'yes':'no';
        } else {
            which=$(which);
            src=which.href;
            tW=(which.readAttribute('iframeWidth')==undefined)?'950':which.readAttribute('iframeWidth');
            tH=(which.readAttribute('iframeHeight')==undefined)?'600':which.readAttribute('iframeHeight');
            tS=(which.readAttribute('iframeScrolling')==undefined)?'yes':which.readAttribute('iframeScrolling');
        }
        overlayIsEnlarged=true;
        $(document.body).insert({top:'<div id="overlayImage"></div><div id="overlayOverlay"></div>'});
        if (BrowserDetect.browser=='Explorer') {
                if (BrowserDetect.version==7) { // needed for ie7 only
                        $('overlayOverlay').setOpacity(0);
                        $('overlayImage').setOpacity(0);
                } else if (BrowserDetect.version==6) { // needed for ie6 only
                        $('overlayOverlay').style.position='absolute';
                        $('overlayImage').style.position='absolute';
                        Event.observe(window,'resize',overlayOverlayUpdate);
                        Event.observe(window,'scroll',overlayOverlayUpdate);
                        overlayOverlayUpdate();
                }
        }
        Event.observe('overlayOverlay','click',overlayOverlayRemove);
        Event.observe('overlayImage','click',overlayOverlayRemove);
        newHTML ='<table width="100%" height="100%" cellpadding="0" cellmargin="0" border="0"><tr><td align="center" valign="middle" class="tdWithPadding">';
        newHTML+='<table cellpadding="0" cellmargin="0" border="0"><tr><td align="right" valign="top">';
        newHTML+='<div style="position: relative;">';
        overlayHoldsImage=false;
        for (var ext in overlayImageExtensions) {
            if (src.indexOf(overlayImageExtensions[ext])==src.length-4) {
                overlayHoldsImage=true;
            }
        }
        if (overlayHoldsImage) {
            newHTML+='<div class="overlayClose"></div>';
            newHTML+='<div class="overlayHider">';
            newHTML+='<img id="overlayImageTag" src="'+src+'" onload="overlayResizeOnLoad(this.id)" />';
            newHTML+='</div>';
        //} else if (useDiv===true) {
        //    newHTML+='<div class="overlayClose X"></div>';
        //    newHTML+='<div class="overlayHider" style="width:'+tW+'px; height:'+tH+'px;">';
        //    newHTML+='<div width="'+tW+'" height="'+tH+'" id="overlayDivTag"></div>';
        //    newHTML+='</div>';
        //    setTimeout(function(){
        //        $('overlayImage').setOpacity(0.999);
        //        //$('overlayImage').select('.overlayClose')[0].style.display='block';
        //        //window.location=src;
        //        new Ajax.Request('overlayDivTag',src,{
        //            evalScripts:true,
        //            onSuccess:function(transport){window.alert(transport.responseText);}
        //            //onSuccess:function(){overlayResizeOnLoad('overlayDivTag',false);}
        //        });
        //    },100);
        } else {
            newHTML+='<div class="overlayClose X"></div>';
            newHTML+='<div class="overlayHider" style="width:'+tW+'px; height:'+tH+'px;">';
            newHTML+='<iframe width="'+tW+'" height="'+tH+'" id="overlayIframeTag" name="overlayIframeTag" src="'+src+'" onload="overlayResizeOnLoad(this.id)" frameborder="0" scrolling="'+tS+'" />';
            newHTML+='</div>';
        }
        newHTML+='</div>';
        newHTML+='</td></tr></table>';
        newHTML+='</td></tr></table>';
        overlayIsMoving=true;
        new Effect.Opacity('overlayOverlay',{
            to: overlayOverlayOpacity,
            duration: 0.5,
            fps: 30,
            afterFinish: function() {
                overlayIsMoving=false;
                $('overlayImage').insert({top:newHTML});
            }
        });
    }
}

function overlayResizeOnLoad(which) {
    $('overlayOverlay').style.backgroundImage='none';
    anims=[];
    anims.push(
        new Effect.Opacity('overlayImage',{
            to: 0.999,
            duration: 0.5,
            fps: 30,
            afterFinish: function(){
                $('overlayImage').style.filter='';//'alpha(opacity=100)';
                $('overlayImage').style.opacity=1;
                $('overlayImage').select('.overlayClose')[0].style.display='block';
            }
        })
    );
    if (overlayHoldsImage) {
        tW=$(which).getWidth()+'px';
        tH=$(which).getHeight()+'px';
        $(which).style.width='0px';
        $(which).style.height='0px';
        anims.push(
            new Effect.Morph($(which).up(),{
                style: {
                    width: tW,
                    height: tH
                }
            })
        );
        anims.push(
            new Effect.Morph($(which),{
                style: {
                    width: tW,
                    height: tH
                }
            })
        );
    }
    new Effect.Parallel(anims,{
        duration: 0.5,
        fps: 30,
        sync: true
    });
}

function overlayOverlayRemove() {
    if (overlayIsEnlarged && $('overlayOverlay')) {
        Event.stopObserving(window,'resize',overlayOverlayUpdate);
        Event.stopObserving(window,'scroll',overlayOverlayUpdate);
        overlayIsEnlarged=false;
        overlayIsMoving=true;
        if (!overlayHoldsImage) {
            $('overlayImage').update();
        }
        new Effect.Parallel([
            new Effect.Opacity('overlayOverlay',{
                to: 0
            }),
            new Effect.Opacity('overlayImage',{
                to: 0,
                afterFinish: function() {
                    $('overlayOverlay').remove();
                    $('overlayImage').remove();
                    overlayIsMoving=false;
                }
            })
        ],{
            duration: 0.5,
            fps: 30,
            sync: true
        });
    }
}

function overlayOverlayUpdate() { // needed for ie6 only
    winSize={};
    winSize.width = document.documentElement.clientWidth;
    winSize.height = document.documentElement.clientHeight;
    if ($('overlayOverlay') ) {
        $('overlayOverlay').style.width=winSize.width+'px';
        $('overlayOverlay').style.height=(winSize.height+100)+'px';
        $('overlayImage').style.width=winSize.width+'px';
        $('overlayImage').style.height=(winSize.height+100)+'px';
        $('overlayOverlay').style.top=(document.documentElement.scrollTop-50)+'px';
        $('overlayImage').style.top=(document.documentElement.scrollTop-50)+'px';
        pageFix=document.body.cumulativeOffset();
        $('overlayOverlay').style.left=(0-pageFix.left)+'px';
        $('overlayImage').style.left=(0-pageFix.left)+'px';
    }
}

function overlayReadCSS(fileName,ruleName,attrName) {
    foundValue=false;
    cssIdx=-1;
    for (i=0;i<document.styleSheets.length;i++) {
        cssUrl=document.styleSheets[i].href;
        if (cssUrl.indexOf(fileName)>=0) {
            cssIdx=i;
            break;
        }
    }
    if (document.styleSheets[cssIdx].cssRules) {
        theRules=document.styleSheets[cssIdx].cssRules; //modern
    } else {
        theRules=document.styleSheets[cssIdx].rules; //ie
    }
    for (i=0;i<theRules.length;i++) {
        if (theRules[i].selectorText==ruleName) {
            foundValue=theRules[i].style[attrName];
            break;
        }
    }
    return foundValue;
}

function overlayOpen(url,width,height,allowScrolling,useDiv) {
    if (width==undefined) {width=800;}
    if (height==undefined) {height=600;}
    if (allowScrolling==undefined) {allowScrolling=false;}
    if (useDiv==undefined) {useDiv=false;}
    if (url!=undefined) {
        overlayOverlayShow(url,width,height,allowScrolling,useDiv);
    }
    return false;
}