﻿    var SelectedImageNum = 1;
    var TotalImages = 0;
    var SlideShow;
    var running = true;
    var fadebgcolor="black"
    var smalldim = 90;
    var bigdim = 108; 
    var spacing = 16;
    var numcolumns = 5;
    var intervalamnt = 10;
    var startslideshow = true;
    var spacingwithdiff = (bigdim-smalldim+spacing);
    var growlimit = smalldim+spacingwithdiff;
    ////NO need to edit beyond here/////////////
    var faderImages = new Array(); 
    var fadearray=new Array(); //array to cache fadeshow instances
    var fadeclear=new Array(); //array to cache corresponding clearinterval pointers
    var dom=(document.getElementById); //modern dom browsers
    var iebrowser=document.all;
    function fadeshow(theimages, fadewidth, fadeheight, borderwidth, delay, pause, displayorder)
    {
        this.pausecheck=pause
        this.mouseovercheck=0
        this.delay=delay
        this.degree=10 //initial opacity degree (10%)
        this.curimageindex=0
        //this.nextimageindex=0
        fadearray[fadearray.length]=this
        this.slideshowid=fadearray.length-1
        this.canvasbase="canvas"+this.slideshowid
        this.curcanvas=this.canvasbase+"_0"
        
        if (typeof displayorder!="undefined")
        {
            theimages.sort(function() {return 0.5 - Math.random();}) //thanks to Mike (aka Mwinter) :)
        }
           
        this.theimages=theimages
        this.imageborder=parseInt(borderwidth)
        this.postimages=new Array() //preload images
        
        for (p=0;p<theimages.length;p++)
        {
            this.postimages[p]=new Image()
            this.postimages[p].src=theimages[p][0]
        }
        this.nextimageindex = this.postimages.length;
        //alert(this.postimages.length);
        var fadewidth=fadewidth+this.imageborder*2
        var fadeheight=fadeheight+this.imageborder*2
     
        if (iebrowser&&dom||dom) //if IE5+ or modern browsers (ie: Firefox)
        {
            document.write('<div id="master'+this.slideshowid+'" style="position:relative;width:'+fadewidth+'px;height:'+fadeheight+'px;overflow:hidden;"><div valign=\"middle\" id="'+this.canvasbase+'_0" style="position:absolute;width:'+fadewidth+'px;height:'+fadeheight+'px;left:0;top:0;text-align:center;vertical-align:middle;filter:progid:DXImageTransform.Microsoft.alpha(opacity=10);-moz-opacity:10;-khtml-opacity:10;"></div><div id="'+this.canvasbase+'_1" valign=\"middle\" style="position:absolute;width:'+fadewidth+'px;height:'+fadeheight+'px;left:0;top:0;text-align:center;vertical-align:middle;filter:progid:DXImageTransform.Microsoft.alpha(opacity=10);-moz-opacity:10;"></div></div>')
        }
        else
        {
            document.write('<div style="text-align:center;vertical-align:middle;"><img name="defaultslide'+this.slideshowid+'" src="'+this.postimages[0].src+'"></div>')
        }
        if(startslideshow)
        {
            if (iebrowser&&dom||dom) //if IE5+ or modern browsers such as Firefox
            {
                //alert('dom');
                this.startit()
            }
            else
            {
                this.curimageindex++
                setInterval("fadearray["+this.slideshowid+"].rotateimage('up', true, null)", this.delay)
                //alert('setInterval:' + this.delay + ' 65');
            }
        }
    }
 
function fadepic(obj){
    if (obj.degree<100){
        obj.degree+=10
        if (obj.tempobj.filters&&obj.tempobj.filters[0])
        {
            if (typeof obj.tempobj.filters[0].opacity=="number") //if IE6+
                obj.tempobj.filters[0].opacity=obj.degree
            else //else if IE5.5-
                obj.tempobj.style.filter="alpha(opacity="+obj.degree+")"
        }
        else if (obj.tempobj.style.MozOpacity)
            obj.tempobj.style.MozOpacity=obj.degree/101
        else if (obj.tempobj.style.opacity)
        {
            obj.tempobj.style.opacity=obj.degree/100
        }
        else if (obj.tempobj.style.KhtmlOpacity)
            obj.tempobj.style.KhtmlOpacity=obj.degree/100
    }
    else
    {
        //stop cycle
        clearInterval(fadeclear[obj.slideshowid])
    }
}
 
 
fadeshow.prototype.movenextslide=function(nextslide)
{
    if (this.pausecheck==1) //if pause onMouseover enabled, cache object
        var cacheobj=this
    if (this.mouseovercheck==1)
        setTimeout(function(){cacheobj.movenextslide(nextslide)}, 100)
    else if (iebrowser&&dom||dom)
    {
        this.resetit()
        var crossobj=this.tempobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
        crossobj.style.zIndex++

        //move nextimageindex to next slot
        this.nextimageindex=nextslide
        
        //load next canvasbase
        this.nextcanvas=(this.curcanvas==this.canvasbase+"_0")? this.canvasbase+"_0" : this.canvasbase+"_1"
        //losf tempobj
        this.tempobj=iebrowser? iebrowser[this.nextcanvas] : document.getElementById(this.nextcanvas)
        //add image to next canvas
        this.populateslide(this.tempobj, this.nextimageindex)
        //set rotateimage to run for next cycle
        
        fadeclear[this.slideshowid]=setInterval("fadepic(fadearray["+this.slideshowid+"])",50)
        this.curcanvas=(this.curcanvas==this.canvasbase+"_0")? this.canvasbase+"_1" : this.canvasbase+"_0"
    }

}


//~~ rotateimage ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    fadeshow.prototype.rotateimage=function()
    {

        //alert('pre rotateimage this.curimageindex= ' + this.curimageindex);
        if (this.pausecheck==1) //if pause onMouseover enabled, cache object
            var cacheobj=this
        if (this.mouseovercheck==1)
            setTimeout(function(){cacheobj.rotateimage()}, 100)
        else if (iebrowser&&dom||dom)
        {
            this.resetit()
            var crossobj=this.tempobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
            crossobj.style.zIndex++

            //move nextimageindex to next slot
            this.nextimageindex=(this.nextimageindex<this.postimages.length-1)? this.nextimageindex+1 : 0
            
            //load next canvasbase
            this.nextcanvas=(this.curcanvas==this.canvasbase+"_0")? this.canvasbase+"_0" : this.canvasbase+"_1"
            //losf tempobj
            this.tempobj=iebrowser? iebrowser[this.nextcanvas] : document.getElementById(this.nextcanvas)
            //add image to next canvas
            this.populateslide(this.tempobj, this.nextimageindex)
            //set rotateimage to run for next cycle

            var imagenum = this.nextimageindex + 1;
            //alert('nextimageindex ' + this.nextimageindex);
            //alert('imagenum ' + imagenum);
            try
            {
                ImgOff(SelectedImageNum)
                var oldicon = document.getElementById('icon_image_'+SelectedImageNum);
                var oldiconnum = document.getElementById('icon_num_'+SelectedImageNum);
                oldicon.src = 'assets/icon_off.gif';
                oldiconnum.className = 'SubNav';
            }
            catch(err)
            {}
            try
            {
                ImgOn(imagenum)
                var icon = document.getElementById('icon_image_'+imagenum);
                var iconnum = document.getElementById('icon_num_'+imagenum);
                icon.src = 'assets/icon_on.gif';
                iconnum.className = 'SubNavOn';
            }
            catch(err)
            {}
            SelectedImageNum = imagenum;
            
            fadeclear[this.slideshowid]=setInterval("fadepic(fadearray["+this.slideshowid+"])",50)
            this.curcanvas=(this.curcanvas==this.canvasbase+"_0")? this.canvasbase+"_1" : this.canvasbase+"_0"
        }
    }


//~~ populateslide ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    fadeshow.prototype.populateslide=function(picobj, picindex)
    {
        //alert('populateslide start');
        var slideHTML=""
        if (this.theimages[picindex][1]!="") //if associated link exists for image
        {
            slideHTML='<a href="'+this.theimages[picindex][1]+'" target="'+this.theimages[picindex][2]+'">'
        }
        slideHTML+='<table border="0" cellpadding="0" cellspacing="0" width="495px" height="350px"><tr><td width="495px" height="350px" valign="middle" align="center"><img src="'+this.postimages[picindex].src+'" border="'+this.imageborder+'px"></td></tr></table>'
        if (this.theimages[picindex][1]!="") //if associated link exists for image
        {
            slideHTML+='</a>'
        }
        picobj.innerHTML=slideHTML
        //alert('populateslide end');
    }


//~~ resetit ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    fadeshow.prototype.resetit=function()
    {
        //alert('resetit');
        this.degree=10
        var crossobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
        if (crossobj.filters&&crossobj.filters[0])
        {
            if (typeof crossobj.filters[0].opacity=="number") //if IE6+
            {
                crossobj.filters(0).opacity=this.degree
            }
            else //else if IE5.5-
            {
                crossobj.style.filter="alpha(opacity="+this.degree+")"
            }
        }
        else if (crossobj.style.MozOpacity)
        {
            crossobj.style.MozOpacity=this.degree/101
        }
        else if (crossobj.style.opacity)
        {
            crossobj.style.opacity=this.degree/100
        }
        else if (crossobj.style.KhtmlOpacity)
        {
            crossobj.style.KhtmlOpacity=obj.degree/100
        }    
        else
        {
            crossobj.style.opacity=this.degree/100
        }
    }


//~~ startit ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    fadeshow.prototype.startit=function()
    {
        //alert('startit');
        var crossobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas)
        this.populateslide(crossobj, this.curimageindex)
        //alert('this.curimageindex: ' + this.curimageindex);
        if (this.pausecheck==1)
        { //IF SLIDESHOW SHOULD PAUSE ONMOUSEOVER
            var cacheobj=this
            var crossobjcontainer=iebrowser? iebrowser["master"+this.slideshowid] : document.getElementById("master"+this.slideshowid)
            crossobjcontainer.onmouseover=function(){cacheobj.mouseovercheck=1}
            crossobjcontainer.onmouseout=function(){cacheobj.mouseovercheck=0}
        }
        this.selectimage(SelectedImageNum);
        SlideShow = setInterval("fadearray[0].rotateimage()", this.delay);
    }


//~~ selectimage ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    fadeshow.prototype.selectimage=function(imagenum)
    {
        try
        {
            var oldicon = document.getElementById('icon_image_'+SelectedImageNum);
            var oldiconnum = document.getElementById('icon_num_'+SelectedImageNum);
            oldicon.src = 'assets/icon_off.gif';
            oldiconnum.className = 'SubNav';
        }
        catch(err)
        {}
        try
        {
            var icon = document.getElementById('icon_image_'+imagenum);
            var iconnum = document.getElementById('icon_num_'+imagenum);
            icon.src = 'assets/icon_on.gif';
            iconnum.className = 'SubNavOn';
        }
        catch(err)
        {}
        SelectedImageNum = imagenum;
        clearInterval(SlideShow);
        imagenum=(imagenum>0)? imagenum-1 : TotalImages-1
        fadearray[0].movenextslide(imagenum);
        //nextImage();
        
        try
        {
           stopSlideShow();
        }
        catch(err)
        {}
    }
    
    
//~~ nextIcon ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    function initIcon()
    {
        var imagenum = SelectedImageNum;
        if(imagenum > TotalImages)
        {
            imagenum = 1;
        }
                //alert('initIcon');
            try
            {
                //alert('selectimage');
                ImgOn(imagenum);
            }
            catch(err)
            {}
        try
        {
            var icon = document.getElementById('icon_image_'+imagenum);
            var iconnum = document.getElementById('icon_num_'+imagenum);
            icon.src = 'assets/icon_on.gif';
            iconnum.className = 'SubNavOn';
            SelectedImageNum = imagenum
        }
        catch(err)
        {
            try
            {
                imagenum = 1
                var icon = document.getElementById('icon_image_'+imagenum);
                var iconnum = document.getElementById('icon_num_'+imagenum);
                icon.src = 'assets/icon_on.gif';
                iconnum.className = 'SubNavOn';
                SelectedImageNum = imagenum
            }
            catch(err)
            {}
        }
        //fadearray[0].rotateimage();
    }


//~~ prevImage ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    function prevImage()
    {
        try
        {
            var oldicon = document.getElementById('icon_image_'+SelectedImageNum);
            var oldiconnum = document.getElementById('icon_num_'+SelectedImageNum);
            oldicon.src = 'assets/icon_off.gif';
            oldiconnum.className = 'SubNav';
        }
        catch(err)
        {}
        var imagenum = SelectedImageNum - 1;
        if(imagenum < 1)
        {
            imagenum = TotalImages;
        }
        try
        {
            var icon = document.getElementById('icon_image_'+imagenum);
            var iconnum = document.getElementById('icon_num_'+imagenum);
            icon.src = 'assets/icon_on.gif';
            iconnum.className = 'SubNavOn';
            SelectedImageNum = imagenum
        }
        catch(err)
        {
            imagenum = 1
            var icon = document.getElementById('icon_image_'+imagenum);
            var iconnum = document.getElementById('icon_num_'+imagenum);
            icon.src = 'assets/icon_on.gif';
            iconnum.className = 'SubNavOn';
            SelectedImageNum = imagenum
        }
    }


//~~ rollovericon ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    function rollovericon(imagenum)
    {
        if(SelectedImageNum!=imagenum)
        {
            var icon = document.getElementById('icon_image_'+imagenum);
            var iconnum = document.getElementById('icon_num_'+imagenum);
            icon.src = 'assets/icon_on.gif';
            iconnum.className = 'SubNavOn';
        }
    }


//~~ rollofficon ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    function rollofficon(imagenum)
    {
        if(SelectedImageNum!=imagenum)
        {
            var icon = document.getElementById('icon_image_'+imagenum);
            var iconnum = document.getElementById('icon_num_'+imagenum);
            icon.src = 'assets/icon_off.gif';
            iconnum.className = 'SubNav';
        }
    }


//~~ rollovericon ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    function rolloverresume()
    {
        var icon = document.getElementById('slideshowresumebutton');
        var icontext = document.getElementById('linkresume');
        icon.src = 'assets/resume_over.gif';
        icontext.className = 'SubNavOn';
    }


//~~ rollofficon ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    function rolloffresume()
    {
        var icon = document.getElementById('slideshowresumebutton');
        var icontext = document.getElementById('linkresume');
        icon.src = 'assets/resume.gif';
        icontext.className = 'SubNav';
    }


//~~ clickNext ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    fadeshow.prototype.clickNext=function()
    {
        clearInterval(SlideShow);
        var newImageNum=(SelectedImageNum<TotalImages)? SelectedImageNum+1 : 1
        fadearray[0].selectimage(newImageNum);
        //nextImage();
        stopSlideShow();
    }


//~~ clickPrev ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    fadeshow.prototype.clickPrev=function()
    {
        clearInterval(SlideShow);
        var newImageNum=(SelectedImageNum>1)? SelectedImageNum-1 : TotalImages
        fadearray[0].selectimage(newImageNum);
        //prevImage();
        stopSlideShow();
    }



//~~ stopSlideShow ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    function stopSlideShow()
    {
        var slideshowControlcontainer = window.document.getElementById('slideshow_control_container');
        slideshowControlcontainer.style.visibility = "visible";
        clearInterval(SlideShow);
    }
    function hideSlideShowbutton()
    {
        var slideshowControlcontainer = window.document.getElementById('slideshow_control_container');
        slideshowControlcontainer.style.visibility = "hidden";
    }


//~~ resumeSlideShow ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    fadeshow.prototype.resumeSlideShow=function()
    {
        //alert('pauseplay');
        var pauseplay = window.document.getElementById('pauseplaytext');
        //alert(running);
        clearInterval(SlideShow);
        if(running)
        {
            pauseplay.innerHTML = "PLAY";
            running = false;
        }
        else
        {
            
            var nextimage=(SelectedImageNum<TotalImages)? SelectedImageNum+1 : 1
            clickThumbnail(nextimage);
            overimage = 0;
            SelectedImageNum = nextimage;
            fadearray[0].startit();
            pauseplay.innerHTML = "PAUSE";
            running = true;
        }
        //this.clickNext();
        
        //hideSlideShowbutton();
    }


//~~ Thumbnails ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
var ivalup = new Array(15);
var ivaldwn = new Array(15);

var ImageArray = new Array(15);

var lastdwnlft, lastdwntop, lastdwnobj, imgname, imageid, nextid, totalthumbs, steps, maxx, maxy, currentx, currenty, dx, dy;
var baseopacity=0;
var fadein;
var fadeout;
var fadeinall;
var fadeoutall;
var thumbid = 0;
var ongoingcount=1;
var browserdetect;
var overimage = 0;
var selectedoldnum=1;

function ImgOver(num)
{
    var objnum = num;
    
    //alert(SelectedImageNum);
    if((num!=SelectedImageNum)&&(num!=selectedoldnum))
    {
	    var robjref = eval("document.getElementById('I" + objnum + "')");
	    
        robjref.style.border='2px solid #00549d';
	    robjref.style.height = smalldim-4;
	    robjref.style.width = smalldim-4;
        overimage=num;
	    
    }
    else
    {
    //alert('num='+num+'  SelectedImageNum'+SelectedImageNum+'  selectedoldnum='+selectedoldnum);
    }
}

function ImgOut(num)
{
    var objnum = num;
    if((num!=SelectedImageNum)&&(num!=selectedoldnum))
	{
	    var robjref = eval("document.getElementById('I" + objnum + "')");
        robjref.style.border='0px solid #00549d';
	    robjref.style.height = smalldim;
	    robjref.style.width = smalldim;
	    overimage=0;
    }
}

function ImgOn(num)
{
    var objnum = num;
    var topnum = 1;
    var lftnum = parseInt(parseInt(objnum)%numcolumns);
    topnum = parseInt((parseInt(objnum)-1)/numcolumns);
    if (lftnum == 0)
    {
        lftnum = numcolumns;
	}
	var robjref = eval("document.getElementById('I" + objnum + "')");
	var dobjref = eval("document.getElementById('D" + objnum + "')");
    dobjref.style.zIndex = 100;
        
    browserdetect=robjref.filters? "ie" : typeof robjref.style.MozOpacity=="string"? "mozilla" : "";

    if (browserdetect=="mozilla"){
	    robjref.height = smalldim;
	    robjref.width = smalldim;
    }
    else if (browserdetect=="ie"){
	    robjref.style.height = smalldim;
	    robjref.style.width = smalldim;
    }
    robjref.style.border='2px solid #00549d';
    dobjref.style.left = (((parseInt(lftnum)-1) * smalldim)+(parseInt(lftnum) * spacingwithdiff)-1) + 'px';
    dobjref.style.top = (parseInt(topnum+1) * spacingwithdiff)+(parseInt(topnum)*smalldim)-1 + 'px';
    //alert('IMGON :: lftnum:'+lftnum+' topnum:'+topnum+' spacingwithdiff:'+spacingwithdiff+'\nleft='+dobjref.style.left+'\ntop='+dobjref.style.top);

    
    if (ivalup[objnum] != null)
    {
        clearInterval(ivalup[objnum]);
    }
    if (ivaldwn[objnum] != null)
    {
		clearInterval(ivaldwn[objnum]);
    }
    var functionRef = "resizeImg('" + objnum + "', " + lftnum + ", " +  topnum + ", 'grow')";
    ivalup[objnum] = setInterval(functionRef, intervalamnt);

}


function ImgOff(num)
{
    
    var objnum = num;
    var lftnum = parseInt(parseInt(objnum)%numcolumns);
    if (lftnum ==0 )
        lftnum = numcolumns;
    selectedoldnum = num;

    var topnum = 1;
    topnum = parseInt((parseInt(objnum)-1)/numcolumns);

    clearInterval(ivalup[objnum]);
    clearInterval(ivaldwn[objnum]);

	var functionRef = "resizeImg('" + objnum + "', " + lftnum + ", " +  topnum + ", 'shrink')";
    ivaldwn[objnum] = setInterval(functionRef, intervalamnt);
}


function resizeImg(objnum, lftnum, topnum, type) 
{
	var robjref = eval("document.getElementById('I" + objnum + "')");
	var dobjref = eval("document.getElementById('D" + objnum + "')");
    var lft;
    var tp;
	if (type == 'grow' && objnum != thumbid)
	{
	    if ((robjref.width<bigdim) && (robjref.height<bigdim)) {
	    //alert(browserdetect);
            if (browserdetect=="ie"){
		        robjref.style.height = robjref.height + 2;
		        robjref.style.width = robjref.width + 2;
		    }
            else{
		        robjref.height = robjref.height + 2;
		        robjref.width = robjref.width + 2;
		    }
		    //var lft = dobjref.left;
		    var adjust = (bigdim - parseInt(robjref.width))/2 ;
		    //var lft = ((parseInt(lftnum)-1) * smalldim) + adjust;
		    //var tp = (parseInt(topnum) * smalldim) + adjust;
		    //growlimit = 90+34
		    lft = ((parseInt(lftnum)-1) * smalldim)+(parseInt(lftnum) * spacingwithdiff) - ((parseInt(robjref.width)-smalldim+2)/2);
		    tp = ((parseInt(topnum)+1) * spacingwithdiff)+(parseInt(topnum)*smalldim) - ((parseInt(robjref.height)-smalldim+2)/2);
		    //var lft = dobjref.style.left - 1;
		    //var tp =  dobjref.style.top - 1;
            //alert(":: GROW[" + objnum + "] ::\adjust:"+adjust+"\nlft:" + lft + " tp:" + tp + " lftnum:" + lftnum + " topnum:" + topnum+"\nwidth:" + robjref.width + " height:" + robjref.height);   	
		    dobjref.style.left = lft + 'px';
		    dobjref.style.top = tp + 'px';
	    }
	    else {
		    clearInterval(ivalup[objnum]);
            if (browserdetect=="ie"){
		        robjref.style.height = bigdim;
		        robjref.style.width = bigdim;
		    }
            else{
		        robjref.height = bigdim;
		        robjref.width = bigdim;
		    }
		    
		    //dobjref.style.left =(parseInt(lftnum)  *growlimit) - bigdim - (spacing/2)  + 'px';
		    //dobjref.style.top = (parseInt(topnum+1)*growlimit) - bigdim - (spacing/2)  + 'px';
		    
		    lft = ((parseInt(lftnum)-1) * smalldim)+(parseInt(lftnum) * spacingwithdiff) - ((bigdim-smalldim+2)/2);
		    tp = (parseInt(topnum) * smalldim)+((parseInt(topnum)+1) * spacingwithdiff) - ((bigdim-smalldim+2)/2);

		    dobjref.style.left = lft + 'px';
		    dobjref.style.top = tp + 'px';
            //alert(":: GROW[" + objnum + "] DONE ::\nlft:" + lft + " tp:" + tp + " lftnum:" + lftnum + " topnum:" + topnum+"\nwidth:" + robjref.width + " height:" + robjref.height+"\ntop:" + dobjref.style.top + " left:" + dobjref.style.left);   	

            //alert("objnum - " + objnum + "; lftnum - " + dobjref.style.left + "; topnum - " + dobjref.style.top);   	
   	    }
   	}
   	else
   	{
	    if ((robjref.width>smalldim) && (robjref.height>smalldim)) {
            if (browserdetect=="ie"){
		        robjref.style.height = robjref.height - 2;
		        robjref.style.width = robjref.width - 2;
		    }
            else{
		        robjref.height = robjref.height - 2;
		        robjref.width = robjref.width - 2;
		    }
		    //var lft = ((((parseInt(lftnum)-1) * smalldim) + growlimit) - (parseInt(robjref.width))/2);
		    //var tp = (growlimit - (parseInt(robjref.width))/2);
		    
		    lft = ((parseInt(lftnum)-1) * smalldim)+(parseInt(lftnum) * spacingwithdiff) - ((parseInt(robjref.width)-smalldim+2)/2);
		    tp = ((parseInt(topnum)+1) * spacingwithdiff)+(parseInt(topnum)*smalldim) - ((parseInt(robjref.height)-smalldim+2)/2);
		    //var lft = dobjref.style.left+1;
		    //var tp = dobjref.style.top+1;
		    dobjref.style.left = lft + 'px';
		    dobjref.style.top = tp + 'px';

            //alert(":: SHRINK[" + objnum + "] ::\nlft:" + lft + " tp:" + tp + " lftnum:" + lftnum + " topnum:" + topnum+"\nwidth:" + robjref.width + " height:" + robjref.height);   	
            //alert(":: GROW[" + objnum + "] ::\adjust:"+adjust+"\nlft:" + lft + " tp:" + tp + " lftnum:" + lftnum + " topnum:" + topnum+"\nwidth:" + robjref.width + " height:" + robjref.height);   	
	    }
	    else {
		    clearInterval(ivaldwn[objnum]);
		    //alert(objnum)
		    //alert(overimage)
		    if (objnum==overimage)
		    {
    		    robjref.style.border='1px solid #ffffff';
                if (browserdetect=="ie"){
		            robjref.style.height = smalldim;
		            robjref.style.width = smalldim;
		        }
                else{
		            robjref.height = smalldim-2;
		            robjref.width = smalldim-2;
		        }
		    }
		    else
		    {
    		    robjref.style.border='0px solid #ffffff';
                if (browserdetect=="ie"){
		            robjref.style.height = smalldim;
		            robjref.style.width = smalldim;
		        }
                else{
		            robjref.height = smalldim;
		            robjref.width = smalldim;
		        }
		    }
		    lft = ((parseInt(lftnum)) * spacingwithdiff)+((parseInt(lftnum)-1) * smalldim);
		    tp = ((parseInt(topnum)+1) * spacingwithdiff)+(parseInt(topnum)*smalldim);

		    dobjref.style.left = lft + 'px';
		    dobjref.style.top = tp + 'px';
		    //dobjref.style.left = (((parseInt(lftnum)-1) * smalldim) + spacingwithdiff) + 'px';
		    //dobjref.style.top = parseInt(topnum)+spacingwithdiff + 'px';
            //alert(":: SHRINK[" + objnum + "] DONE ::\nlft:" + lft + " tp:" + tp + " lftnum:" + lftnum + " topnum:" + topnum+"\nwidth:" + robjref.width + " height:" + robjref.height);   	
   	    }
   	}	
}
function clickThumbnail(imagenum)
{
    if(SelectedImageNum!=imagenum)
    {
        ImgOff(SelectedImageNum);
        fadeshow.prototype.selectimage(imagenum);
        ImgOn(imagenum);
        SelectedImageNum = imagenum;
        var pauseplay = window.document.getElementById('pauseplaytext');
        clearInterval(SlideShow);
        pauseplay.innerHTML = "PLAY";
        running = false;
    }
}
