/***********************************************
* CMotion Image Gallery- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com for source code
* Last updated Mar 15th, 04'. Added "End of Gallery" message.
* This copyright notice must stay intact for legal use
***********************************************/

/*********************************************
Modification: Erik Bartlow http://www.dataspex.com
Modification Date:  3/24/2006
Purpose:  To allow more than one image on a page.
This modification requires the developer to set the
number of images on the page, and then call the
Setup function on the page showing the images
/**********************************************/
var imageCount = 3;
var cross_main_array = new Array(imageCount);
var cross_scroll_array = new Array(imageCount);
var actual_width_array = new Array(imageCount);
/**********************************************/
var restarea=6 //1) width of the "neutral" area in the center of the gallery in px
var maxspeed=7 //2) top scroll speed in pixels. Script auto creates a range from 0 to top speed.
var endofgallerymsg="" //3) message to show at end of gallery. Enter "" to disable message.

function enlargeimage(path, optWidth, optHeight){ //function to enlarge image. Change as desired.
var actualWidth=typeof optWidth!="undefined" ? optWidth : "600px" //set 600px to default width
var actualHeight=typeof optHeight!="undefined" ? optHeight : "500px" //set 500px to  default height
var winattributes="width="+actualWidth+",height="+actualHeight+",resizable=yes"
window.open(path,"", winattributes)
}

////NO NEED TO EDIT BELOW THIS LINE////////////

var iedom=document.all||document.getElementById
var scrollspeed=0
var movestate=""

var actualwidth=''
var cross_scroll, ns_scroll
var loadedyes=0

function ietruebody(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function creatediv(){
statusdiv=document.createElement("div")
statusdiv.setAttribute("id","statusdiv")
document.body.appendChild(statusdiv)
statusdiv=document.getElementById("statusdiv")
statusdiv.innerHTML=endofgallerymsg
}

function positiondiv(imageIndex){
menuheight=parseInt(cross_main_array[imageIndex].offsetHeight)
mainobjoffsetH=getposOffset(cross_main_array[imageIndex], "top")
statusdiv.style.left=mainobjoffset+(menuwidth/2)-(statusdiv.offsetWidth/2)+"px"
statusdiv.style.top=menuheight+mainobjoffsetH+"px"
}

function showhidediv(what){
if (endofgallerymsg!="")
statusdiv.style.visibility=what
}

function getposOffset(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft: what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}


function moveleft(imageIndex){
    if (loadedyes){
        movestate="left"
        if ( iedom && parseInt(cross_scroll_array[imageIndex].style.left) > (menuwidth - actual_width_array[imageIndex]) ){
            cross_scroll_array[imageIndex].style.left=parseInt(cross_scroll_array[imageIndex].style.left)-scrollspeed+"px"
            showhidediv("hidden")
        } else {
            showhidediv("visible")
        }
    }
    lefttime=setTimeout("moveleft(" +imageIndex + ")",5)
}

function moveright(imageIndex){
    if (loadedyes){
        movestate="right"
        if (iedom && parseInt(cross_scroll_array[imageIndex].style.left) < 0){
            cross_scroll_array[imageIndex].style.left=parseInt(cross_scroll_array[imageIndex].style.left)+scrollspeed+"px"
            showhidediv("hidden")
        } else {
            showhidediv("visible")
        }
        righttime=setTimeout("moveright(" + imageIndex + ")",5)
    }
}

function motionengine(e, imageIndex){
    d = 1;
    var dsocx=(window.pageXOffset)? pageXOffset: ietruebody().scrollLeft;
    var dsocy=(window.pageYOffset)? pageYOffset : ietruebody().scrollTop;
    var curposy=window.event? event.clientX : e.clientX? e.clientX: ""
    curposy-=mainobjoffset-dsocx
    var leftbound=(menuwidth-restarea)/2
    var rightbound=(menuwidth+restarea)/2
    
    if (curposy>rightbound){
        scrollspeed=(curposy-rightbound)/((menuwidth-restarea)/2) * maxspeed
        if (window.righttime) clearTimeout(righttime)
        if (movestate!="left") moveleft(imageIndex)
    } else if (curposy<leftbound){
        scrollspeed=(leftbound-curposy)/((menuwidth-restarea)/2) * maxspeed
        if (window.lefttime) clearTimeout(lefttime)
        if (movestate!="right") moveright(imageIndex)
    } else {
        scrollspeed = 0;
    }
}

function contains_ns6(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}

function stopmotion(e, imageIndex){
if ((window.event&&!cross_main_array[imageIndex].contains(event.toElement)) || (e && e.currentTarget && e.currentTarget!= e.relatedTarget && !contains_ns6(e.currentTarget, e.relatedTarget))){
if (window.lefttime) clearTimeout(lefttime)
if (window.righttime) clearTimeout(righttime)
movestate=""
}
}

function fillup(){
    var thisCrossMain;
    var motionContainerID = "motioncontainer";
    var motionGalleryID = "motiongallery";
    var trueContainerID = "trueContainer";
    var imageIndex = 0;
    if ( arguments[0] != undefined ){
        imageIndex = arguments[0];
        motionContainerID += imageIndex;
        motionGalleryID += imageIndex;
        trueContainerID += imageIndex;
    }
    if (iedom){
        thisCrossMain = document.getElementById? document.getElementById(motionContainerID) : document.all.motioncontainer
        menuwidth = parseInt(thisCrossMain.style.width)
        mainobjoffset = getposOffset(thisCrossMain, "left")
        cross_scroll_array[imageIndex] = document.getElementById? document.getElementById(motionGalleryID) : document.all.motiongallery
        actual_width_array[imageIndex] = document.all? cross_scroll_array[imageIndex].offsetWidth : document.getElementById(trueContainerID).offsetWidth

        thisCrossMain.onmousemove=function(e){
            motionengine(e, imageIndex)
        }

        thisCrossMain.onmouseout=function(e){
            stopmotion(e, imageIndex)
            showhidediv("hidden")
        }
        // Add the container to the array
        cross_main_array[imageIndex] = thisCrossMain;
        
    }
    loadedyes=1
    if (endofgallerymsg!=""){
        creatediv()
        positiondiv(imageIndex)
    }
}
// Call the fillup function for each image in the image count.
function Setup(){
    window.status = "I'm here.";
    for( var i = 0; i < imageCount; i++ ){
        fillup(i + 1);
    }
}

//starts here :Specify image paths and optional link (set link to "" for no link):
var dynimages=new Array()
dynimages[0]=["images/streetpaint/katrina_1.jpg", ""]
dynimages[1]=["images/streetpaint/katrina_2.jpg", ""]
dynimages[2]=["images/streetpaint/katrina_3.jpg", ""]
dynimages[3]=["images/streetpaint/katrina_4.jpg", ""]
dynimages[4]=["images/streetpaint/katrina_5.jpg", ""]
dynimages[5]=["images/streetpaint/McDonalds_1.jpg", ""]
dynimages[6]=["images/streetpaint/McDonalds_2.jpg", ""]
dynimages[7]=["images/streetpaint/McDonalds_3.jpg", ""]

//Preload images ("yes" or "no"):
var preloadimg="yes"

//Set optional link target to be added to all images with a link:
var optlinktarget=""

//Set image border width
var imgborderwidth=1

//Optionally, change 1.0 and 0.7 below to affect Wipe gradient size and duration in seconds in IE5.5+:
var filterstring="progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=1.0 Duration=0.7)"

///////No need to edit beyond here/////

if (preloadimg=="yes"){
for (x=0; x<dynimages.length; x++){
var myimage=new Image()
myimage.src=dynimages[x][0]
}
}

function returnimgcode(theimg){
var imghtml=""
if (theimg[1]!="")
imghtml='<a href="'+theimg[1]+'" target="'+optlinktarget+'">'
imghtml+='<img src="'+theimg[0]+'" border="'+imgborderwidth+'">'
if (theimg[1]!="")
imghtml+='</a>'
return imghtml
}

function modifyimage(loadarea, imgindex){
if (document.getElementById){
var imgobj=document.getElementById(loadarea)
if (imgobj.filters && window.createPopup){
imgobj.style.filter=filterstring
imgobj.filters[0].Apply()
}
imgobj.innerHTML=returnimgcode(dynimages[imgindex])
if (imgobj.filters && window.createPopup)
imgobj.filters[0].Play()
return false
}
}

