//=====================================================================
// Project Image Views Implementation
// by structuredview.com
//
// Please ask me for permission to reuse any portion of this script.
//
// Requirements:
//		- browserCheck.js
//		- utility.js
//
//=====================================================================

//=====================================================================
// Initialize Variables
//=====================================================================

var ProjectView = {}
var pics=[];
var currImaNum=-1;
ProjectView.topEdge = 122;
var inTransition=false;
var page;

//=====================================================================
//
//=====================================================================

function setProjectCoverImage(context,imageURL){
    window.addEvent(
        'load',
        function(){

            for(var x=0;x<imageURL.length;x++){
                var c=imageURL.charAt(x);
                if(c=='/'){
                    imageURL=imageURL.substring(0,x)+'%47'+imageURL.substring(x+1,imageURL.length)
                    x=x+2;
                }
                if(c=='.'){
                    imageURL=imageURL.substring(0,x)+'%46'+imageURL.substring(x+1,imageURL.length)
                    x=x+2;
                }
            }
            //top.slide_show.location = context+'html/proj_ima.html?image='+imageURL;
        }
        );
}

window.addEvent(
    'load',
    function(){
        //==================
        // Collect Refs
        //==================
        for(var a=0;a<pics.length;a++){
            pics[a].imageRef=getObjectRef('projIm'+a);
            pics[a].creditRef=getObjectRef('imgCredit'+a);
            pics[a].buttonRef=getObjectRef('num'+a);
        }

        bodyLoaded=true;

        page=new pageSize();

        if(pics.length<1)return;

        showProjectImage(0);

        currImaNum=0;

        for(var a=0;a<pics.length;a++){
            var nName='num'+a;
            var numO=getObjectRef(nName);
            if(numO){
                makeVisible(numO);
            }
        }
    }
    )

//=====================================================================
// Mouse Action Functions
//=====================================================================

function showProjectImage(picIndex){
    top.focus();
    if(!bodyLoaded)return;
    if(inTransition||pics[picIndex].buttonClicked)return;
    inTransition=true;
    pics[picIndex].buttonClicked=true;

    for(var a=0;a<pics.length;a++){
        if(a!=picIndex&&pics[picIndex].buttonClicked==true){
            var thisPic=pics[a];
            fadeOut(thisPic.imageRef);
            fadeOut(thisPic.creditRef);

            if(thisPic && thisPic.buttonRef){
                thisPic.buttonRef.style.border='1px solid #bbbbbb';
            }
            thisPic.buttonClicked=false;
        }
    }

    // bring in image
    slideAndFadeIn(pics[picIndex].imageRef,page.width,340,1800,800);

    // bring in credit
    window.setTimeout('if(pics['+picIndex+'].buttonClicked){fadeIn(pics['+picIndex+'].creditRef,400);}inTransition=false;',400);

    // change button
    if(pics[picIndex] && pics[picIndex].buttonRef){
        pics[picIndex].buttonRef.style.border='1px solid #666666';
    }
}

function showCaption(index){
    var captionRef=getObjectRef('imgCaption'+index);
    makeVisible(captionRef);
}

function hideCaption(index){
    var captionRef=getObjectRef('imgCaption'+index);
    makeHidden(captionRef);
}

//=====================================================================
// Build Functions
//=====================================================================
ProjectView.tallestImage = 0;
function addPic(imageUrl,imageWidth,imageHeight,caption,creditText,creditUrl){
    var i=pics.length;
    pics[i]=new Object();
    pics[i].imageRef=null;
    pics[i].creditRef=null;
    pics[i].buttonRef=null;
    pics[i].imageUrl=imageUrl;
    pics[i].width=imageWidth;
    pics[i].height=imageHeight;
    pics[i].caption=caption;
    pics[i].hasCaption=(caption.length>0);
    pics[i].creditText=creditText;
    pics[i].creditUrl=creditUrl;
    pics[i].isIn=false;
    pics[i].buttonClicked=false;
    if( imageHeight > ProjectView.tallestImage ){
        ProjectView.tallestImage = imageHeight;
    }
}

function writeProjIma()
{
    var page=new pageSize();
    var pageWidth=page.width;
    if(pageWidth==0)pageWidth=290;
    var numberSpacerHeight = 0;
    var creditSpacerHeight = 0;

    var pageSubTitleBottom = 113;
    var projectViewSpacer = $('project-view-spacer');
    if( projectViewSpacer ){
        ProjectView.topEdge = projectViewSpacer.getPosition().y;
    }

    //==================
    // Write Loading Image
    //==================
    //document.write('<div id="loading" style="position:absolute;z-index:1;width:21;top:'+(ProjectView.topEdge+100)+'px;left:308px;visibility:visible;margin:0px;border:0px;padding:0px;filter:alpha(opacity=100);-khtml-opacity:1;">');
    //document.write('	<img src="http://www.bcj.com/images/uti/loading_tr_1a.gif" width="21" height="21" border="0">');
    //document.write('</div>');

    //==================
    // Write Credits
    //==================
    for(var a=0;a<pics.length;a++){
        document.write('<div id="imgCredit'+a+'" class="image_credit" style="position: absolute;z-index: 10;width: '+pics[a].width+'px;text-align: left;font-size: 9px;color: #777777;top: '+(ProjectView.topEdge+ProjectView.tallestImage)+'px;left: 340px;visibility: hidden;margin: 0px;border: 0px;padding: 0px;filter: alpha(opacity=100);-khtml-opacity: 1;">');
        if(pics[a].creditUrl!=null&&pics[a].creditUrl!=""){
            document.write('Photo: <a href="'+pics[a].creditUrl+'" target="_blank" class="photo_credit">'+pics[a].creditText+'</a>');
            creditSpacerHeight = 10
        }
        else if(pics[a].creditText!=null&&pics[a].creditText!=""){
            document.write('Photo: '+pics[a].creditText);
            creditSpacerHeight = 10
        }
        document.write('</div>');
    }

    //==================
    // Write Numbers
    //==================
    if( pics.length>1 ){
        for(var a=0;a<pics.length;a++){
            document.write('<div style="position:absolute;z-index:50;width:21px;height:21px;top:'+(ProjectView.topEdge+ProjectView.tallestImage+creditSpacerHeight+8)+'px;visibility:hidden;vertical-align:bottom;margin:0px;border:1px solid #bbbbbb;padding-top:3px;font-size:12px;line-height:12px;cursor:pointer;opacity:.99;background-color:#dddddd;text-align:center;left:'+(340+(a*25))+'px;" id="num'+a+'"  onclick="showProjectImage('+a+')" onmouseover="if(!pics['+a+'].buttonClicked)this.style.border=\'1px solid #333333\'" onmouseout="if(!pics['+a+'].buttonClicked)this.style.border=\'1px solid #bbbbbb\'">');
            document.write('<table width="21" border="0" cellpadding="0" cellspacing="0"><tr><td valign="middle" align="center">');
            document.write('<a href="javascript:showProjectImage('+a+');">'+(a+1)+'</a>');
            document.write('</td></tr></table>');
            document.write('</div>');
        }
        numberSpacerHeight = 23;
    }

    //==================
    // Write ProjectImages
    //==================
    for(var a=0;a<pics.length;a++){
        var captionMO='';
        if(pics[a].hasCaption){
            captionMO=' onmouseover="showCaption('+a+')" onmouseout="hideCaption('+a+')"';
        }
        document.write('<div id="projIm'+a+'" style="position:absolute;z-index:10;width:'+pics[a].width+'px;top:'+ProjectView.topEdge+'px;left:-1000px;visibility:hidden;margin:0px;border:0px;padding:0px;filter:alpha(opacity=100);-khtml-opacity:1;" '+captionMO+'>');
        document.write('<img src="'+pics[a].imageUrl+'" width="'+pics[a].width+'" height="'+pics[a].height+'" border="0">');
        document.write('</div>');

    }


    //==================
    // Write Caption
    //==================
    for(var a=0;a<pics.length;a++){
        if(!browser.isNN4 && pics[a].hasCaption)
        {
            document.write('<div id="imgCaption'+a+'" class="image_caption" style="position:absolute;z-index:60;width:'+(pics[a].width-30)+'px;text-align:left;color:#ffffff;font-size:12px;line-height:9px;top:'+(ProjectView.topEdge+10)+'px;left:350px;visibility:hidden;background-color:#000000;margin:0px;border:0px;padding:5px;filter:alpha(opacity=50);-khtml-opacity:.5;opacity:.5;" onmouseover="showCaption('+a+')" onmouseout="hideCaption('+a+')">');
            document.write(pics[a].caption);
            document.write('</div>');
        }
    }

    // Has Numbers
    var number

    // Adjust Text
    var projectText = $('project_text');
    if( projectText ){
        projectText.setStyle('padding-top',ProjectView.tallestImage+numberSpacerHeight+creditSpacerHeight+35);
    }
    var projectViewSpacer = $('project-view-spacer');
    if( projectViewSpacer ){
        projectViewSpacer.setStyle('height',ProjectView.tallestImage+numberSpacerHeight+creditSpacerHeight+5);
    }

}

//=====================================================================
// Utility Functions
//=====================================================================

function getObjectRef(elName){
    if(document.all) {
        return document.all[elName];
    }
    else if(document.getElementById){
        return document.getElementById(elName);
    }
    else if(document.layers){
        return document.layers[elName]
    }
    return false;
}

function slideAndFadeIn(obj,slideStartX,slideEndX,slideTime,fadeTime){
    slideIn(obj,slideStartX,slideEndX,slideTime);
    fadeIn(obj,fadeTime);
}

function slideIn(obj,startX,endX,slideTime){
    setX(obj,340);
//setX(obj,page.width);
//var imMo=new AccelimationAug(obj, AccelimationAug.LEFT,startX,endX,slideTime,-1);
//imMo.start();
}

function makeVisible(obj)
{
    if(document.all){
        obj.style.visibility='visible';
    }
    else if(document.getElementById){
        obj.style.visibility='visible';
    }
    else if(document.layers){
        obj.visibility='show';
    }
}

function makeHidden(obj)
{
    if(document.all){
        obj.style.visibility='hidden';
    }
    else if(document.getElementById){
        obj.style.visibility='hidden';
    }
    else if(document.layers){
        obj.visibility='hide';
    }
}

//==============================================================================
//  Opacity
//==============================================================================
function thisCanFade(obj)
{
    if(document.all&&obj.filters){
        if(browser.isMac)//MacIE says it has filters, but doesn't deliver.
        {
            return false;
        }
        return true;
    }
    else if(document.getElementById){
        if(obj.style&&obj.style.MozOpacity!=null){
            return true;
        }
        else if(obj.style&&obj.style.opacity!=null){
            return true;
        }
        else if(obj.style&&obj.style.getPropertyValue&&obj.style.getPropertyValue('-khtml-opacity')!=null){
            return true;
        }
    }
    return false;
}

function fadeIn(obj,time){
    var canFade=thisCanFade(obj);
    if(canFade){
        setOpacity(obj,0);
        makeVisible(obj);
        var imFa=new AccelimationAug(obj,AccelimationAug.OPACITY,0,getOpacityMax(),time,0);
        imFa.start();
    }
    else{
        makeVisible(obj);
    //setX(obj,40);
    }
}

function fadeOut(obj)
{
    var canFade=thisCanFade(obj);
    if(canFade){
        var imFa=new AccelimationAug(obj,AccelimationAug.OPACITY,getOpacityMax(),0,400,0);
        eval('imFa.onend=function(){var o=getObjectRef(\''+obj.id+'\');makeHidden(o);}');
        imFa.start();
    }
    else{
        makeHidden(obj);
    //setX(obj,-1000);
    }
}