var N = (document.all) ? 0 : 1;
var stepCount = 100;
var playButton = "img/galleryplayer/galleryplay.gif";
var backButton = "img/galleryplayer/galleryback.gif";
var pauseButton = "img/galleryplayer/gallerypause.gif";
var fwdButton = "img/galleryplayer/galleryfwd.gif";
var imgLoading = "img/general/loading.gif";
var maxThumbSize = 48;

function animateObject(elName, objName)
{
            
    this.elName = elName;
    this.objName = objName;
    this.el = document.getElementById(elName);
    this.speed = 10;    
    this.curPlaying = false;
    this.curState = 0;
    this.width = 100;
    this.widthType = "%";
    this.height = 100;
    this.heightType = "%";
    this.stepCount = stepCount;
    this.run = false;
    this.gallery = new Array();
    this.galleryThumb = new Array();
    this.galleryWidth = new Array();
    this.galleryHeight = new Array();
    this.galleryItemCount = 0;
    this.isGallery = false;
    this.curItem = 0;
    this.elImg;
    this.stallperiod = 0;
    this.onEnd = "";

    this.maxImageWidth = 500;
    this.maxImageHeight = 300;
    
    //move
    this.xStart = 0;
    this.xFinish = 0;
    this.yStart = 0;
    this.yFinish = 0;
    this.curX = 0;
    this.curY = 0;
    
    //controls
    this.hasScroll = false;
    this.hasControl = false;
    this.controlAreaWidth = 500;
    this.showControls = showControls;
    this.hideControls = hideControls;

    //scroller
    this.ob = null;
    this.X = 0;
    this.curPos = 0;
    this.isScroll = true;
    this.scrollControlWidth = 510;
    this.scrollAreaWidth = 490;
    this.maxPos = this.scrollAreaWidth - 30;
    this.maxThumbWidth = 50;
    this.maxThumbHeight = 50;
    this.scrollWidth = this.maxPos;
    //listscroller
    this.listWidth = 0;
    this.itemWidth = 0;
    this.imageFwd = "";
    this.imageBack = "";
    this.listEnd = 0;
    
    this.expandRight = expandRight;
    this.runExpandRight = runExpandRight;

    this.expandDown = expandDown;
    this.runExpandDown = runExpandDown;
    
    this.shrinkRight = shrinkRight;
    this.runShrinkRight = runShrinkRight;
    
    this.runFade = runFade;
    this.runFadeOut = runFadeOut;
    this.runFadeIn = runFadeIn;
    this.playGallery = playGallery;
 
    this.addToGallery = addToGallery;
    this.createGallery = createGallery;
    this.getNextImage = getNextImage;
    this.getLastImage = getLastImage;
    this.setNextImage = setNextImage
    this.loadCurImage = loadCurImage;
    this.writeControl = writeControl;
    this.writeScroll = writeScroll;
    this.stepFwd = stepFwd;
    this.stepBack = stepBack;
    this.play = play;
    this.pause = pause;

    
    this.hideElement = hideElement;
    this.displayElement = displayElement;
    this.displayControl = displayControl;
    this.hideControl = hideControl;
    this.mouseOutControl = mouseOutControl;
    this.mouseOverControl = mouseOverControl;
    this.displayScroll = displayScroll;
    this.hideScroll = hideScroll;

    this.scrollSelect = scrollSelect;
    this.scrollDrag = scrollDrag;    
    this.scrollDrop = scrollDrop;
    this.buildScroll = buildScroll;
    this.loadScrollImages = loadScrollImages;
    this.loadScrollImage = loadScrollImage;
    this.scrollImageLoadFailure = scrollImageLoadFailure;
    this.updateScrollImage = updateScrollImage;
    this.scroll = scroll;
    this.setScrollForImage = setScrollForImage;
    this.selectImage = selectImage;
    this.initItemScroll = initItemScroll;
    this.scrollFwd = scrollFwd;    
    this.scrollBack = scrollBack
    this.scrollStop = scrollStop;
        
    this.move = move;
    this.runMove = runMove;
    
}

function scrollStop()
{
        var el;
        this.curPlaying = false;
     
        if(this.curX ==0)
            document.getElementById(this.imageBack).style.display = "none"
        else if(gallery.curX == this.listEnd)
            document.getElementById(this.imageFwd).style.display = "none"
        
}

function scrollBack()
{
    
    var diff;
    //diff = gallery.xStart - galleryEnd;
    diff = 60;
    
    if(this.curX>= 0)
    {
        document.getElementById(this.imageBack).style.display = "none";
        return;
    }
    //5px per step
    this.stepCount = (parseInt(diff)/5);
    this.move(this.curX, this.curX+diff, 0, 0, false);
    document.getElementById(this.imageFwd).style.display = "block";
    
    
}

function scrollFwd()
{
    try
    {
        var diff;
        //diff = gallery.xStart - galleryEnd;
        diff = 60;
        if(this.curX-diff <= this.listEnd)
        {
            document.getElementById(this.imageFwd).style.display = "none";
        }
        if(this.curX <= this.listEnd)
        {
            return;
        }
        //5px per step
        this.stepCount = (parseInt(diff)/5);
        this.move(this.curX, this.curX-diff, 0, 0, false);
        document.getElementById(this.imageBack).style.display = "block";
 
    }catch(err){}
}

function initItemScroll(itemCount, itemWidth, scrollWidth, imgFwd, imgBack)
{
    this.imageFwd = imgFwd;
    this.imageBack = imgBack;
    this.listWidth = itemCount * itemWidth;
    document.getElementById(this.elName).style.width = this.listWidth + "px";
    this.listEnd = -1*(this.listWidth - scrollWidth);
    this.onEnd =  this.objName + ".scrollStop()";
    if(this.listEnd >= 0)
    {
        document.getElementById(imgFwd).style.display = "none";                    
    }
    

}

function move(xStart,xFinish, yStart, yFinish, repeat)
{

    if(this.curPlaying)
    {
        //do nothing
        return;
    }
    
    this.curPlaying = true;
    this.run = repeat;
    
    this.xStart = xStart;
    this.xFinish = xFinish;
    this.yStart = yStart;
    this.yFinish = yFinish;
    this.curX = xStart;
    this.curY = yStart; 
    
    this.curState = 0;
    this.el.style.left = xStart + "px";
    this.el.style.top = yStart + "px";

    this.runMove();
}

function runMove()
{

    if(!this.curPlaying)
    {
        //shouldn't be running anymore
        return;
    }

    
    if(this.curState >= this.stepCount)
    {
        //should be in finished pos
        this.el.style.left = this.xFinish + "px";
        this.el.style.top = this.yFinish + "px";
        this.curX  = this.xFinish;
        this.curY = this.yFinish;
    
        //if running set to go back to begining
        if(this.run)
        {
            this.curState = 0;
            t = window.setTimeout(this.objName + ".runMove()", this.speed);               
        }
        else
        {
            this.curPlaying = false;
            if(this.onEnd != "")
            {
                eval(this.onEnd);
            }
        }
    }
    else
    {
        this.curX = parseInt(this.curState/this.stepCount * (this.xFinish - this.xStart)) + this.xStart ;
        this.curY = parseInt(this.curState/this.stepCount * (this.yFinish - this.yStart))  + this.yStart;
        this.el.style.left = this.curX + "px";
        this.el.style.top = this.curY + "px";
        this.curState++;

        t = window.setTimeout(this.objName + ".runMove()", this.speed);               
        
    }
}

function addToGallery(url, thumb, width, height)
{

    this.gallery[this.galleryItemCount] = url;
    this.galleryThumb[this.galleryItemCount] = thumb;
    this.galleryWidth[this.galleryItemCount] = width;
    this.galleryHeight[this.galleryItemCount] = height;
    this.galleryItemCount++;
}
function createGallery(imgName)
{
    try
    {
        this.elImg = document.getElementById(imgName);
        this.isGallery = true;
        
        return true;
    }catch(err){return false;}
}

function loadCurImage()
{
       this.elImg.src = this.gallery[this.curItem];
        if(this.galleryWidth[this.curItem] > 0)
        {
            this.elImg.style.width = this.galleryWidth[this.curItem]  + "px";
        }
        if(this.galleryHeight[this.curItem] > 0)
        {
            this.elImg.style.height = this.galleryHeight[this.curItem]  + "px";
        }
        this.elImg.style.visibility = "visible";
 
}

function getNextImage()
{
    try
    {
    
        if(!this.isGallery || this.galleryItemCount <= 0)
        {
            return false;
        }
        
        this.curItem++;
        if(this.curItem >= this.galleryItemCount)
        {
            this.curItem = 0;
        }
        
        this.loadCurImage();       
        return true;
    }
    catch(err){return false;}
}

function setNextImage(index)
{
    try
    {
    
        if(!this.isGallery || this.galleryItemCount <= index)
        {
            return false;
        }
        
        this.curItem = index;

        this.loadCurImage();       
        return true;
    }
    catch(err){return false;}
}


function getLastImage()
{
    try
    {
    
        if(!this.isGallery || this.galleryItemCount <= 0)
        {
            return false;
        }
        
        this.curItem--;
        if(this.curItem < 0)
        {
            this.curItem = this.gallery.length - 1;
        }
       
        this.loadCurImage();       
        
        return true;
    }
    catch(err){return false;}
}


function expandRight(){
   
   try
   {
        if(this.curPlaying)
        {
            //do nothing as already playing
            return;
        }
       this.curPlaying = true;
       this.el.style.width = "0" + this.widthType;
       
       
       t = window.setTimeout( this.objName + ".runExpandRight()", this.speed);   
    }
    catch(err)
    {
        alert(err);
    }
}

function runExpandRight(){
    try
    {
        if(this.curState <= this.stepCount)
        {
        
            this.el.style.width = parseInt(this.curState/this.stepCount * this.width)  + this.widthType;
            
            this.curState = this.curState + 1;
            
            t = window.setTimeout(this.objName + ".runExpandRight()", this.speed);   
        }
        else
        {
            this.el.style.width = this.width  + this.widthType;
        }
    }catch(err){
        alert(err.message);
    }
}

function expandDown(){
   
   try
   {
   
        if(this.curPlaying)
        {
            //do nothing as already playing
            return;
        }
       this.curPlaying = true;
        this.el.style.height= parseInt(this.curState/this.stepCount * this.height)  + this.heightType;
       
       t = window.setTimeout( this.objName + ".runExpandDown()", this.speed );   
    }
    catch(err)
    {
        alert(err);
    }
}

function runExpandDown(){
    try
    {
        if(this.curState <= this.stepCount)
        {
        
            this.el.style.height= parseInt(this.curState/this.stepCount * this.height)  + this.heightType;
            
            this.curState = this.curState + 1;
            
            t = window.setTimeout(this.objName + ".runExpandDown()", this.speed);   
        }
        else
        {
            this.el.style.height = this.height+ this.heightType;
        }
    }catch(err){
        alert(err.message);
    }
}



function shrinkRight(){
   
   try
   {
        if(this.curPlaying)
        {
            //do nothing as already playing
            return;
        }
       this.curPlaying = true;
       this.el.style.width = this.width + this.widthType;
       this.el.style.visibility = "visible";
       this.curState = this.stepCount;
       
       t = window.setTimeout( this.objName + ".runShrinkRight()", this.speed);   
    }
    catch(err)
    {
        alert(err);
    }
}

function runShrinkRight(){
    try
    {
        if(this.curState > 0)
        {
        
            this.el.style.width = parseInt(this.curState/this.stepCount * this.width)  + this.widthType;
            
            this.curState = this.curState - 1;
            
            t = window.setTimeout(this.objName + ".runShrinkRight()", this.speed);   
        }
        else
        {
            //this.el.style.width = this.width  + this.widthType;
            this.el.style.visibility = "hidden";
        }
    }catch(err){
        alert(err.message);
    }
}


function runFadeIn(){
    var op;
    
    //if paused then need to cancel
    if(!this.curPlaying)
    {
        this.el.style.filter = "auto";
        this.el.style.opacity = "1";
        return;
    }
    
    if(this.curState >= this.stepCount)
    {
        //this.el.style.filter = "auto";
        //this.el.style.opacity = "auto";
        this.el.style.opacity = "1";
        this.el.style.filter  = "alpha(opacity=100)";
        
        //if single fade then done
        if(!this.run)
        {
            //stop playing
            this.curPlaying = false;
            return;
        }
        //pause to view then fade out
        this.curState = this.stepCount;
        t = window.setTimeout(this.objName + '.runFadeOut()', this.speed + this.stallperiod);   
        
    }    
    else
    {
        //still fading in
        op = (this.curState/this.stepCount) ;
        //for ie
        this.el.style.filter  = "alpha(opacity=" + parseInt(op * 100)+ ")";
        //for firefox
        this.el.style.opacity  =  op;
        this.curState += 1;
        t = window.setTimeout(this.objName + '.runFadeIn()', this.speed);   
        
    }

}

function runFadeOut(){
    var op;
   
   
    
    //if paused then need to cancel
    if(!this.curPlaying)
    {
        this.el.style.filter = "auto";
        this.el.style.opacity = "1";
        return;
    }
    
    if(this.curState <= 0)
    {
        this.el.style.filter = "0";
        this.el.style.opacity = "0";
        
        //if single fade then done
        if(!this.run)
        {
         
            //stop playing
            this.curPlaying = false;
            return;
        }
        //if is a gallery then update image
        if(this.isGallery)
        {
            this.getNextImage();
        }
        else
        {
            //pause then fade back in
            t = window.setTimeout(this.objName + '.runFadeIn()', this.speed);   
        }
    }    
    else
    {
        //still fading out
        op = (this.curState/this.stepCount) ;
        //for ie
        this.el.style.filter  = "alpha(opacity=" + parseInt(op * 100)+ ")";
        //for firefox
        this.el.style.opacity  =  op;
        this.curState -= 1;
        t = window.setTimeout(this.objName + '.runFadeOut()', this.speed);   
        
    }

}


function runFade(){
   
   try
   {
   
        if(this.curPlaying)
        {
            //do nothing as already playing
            return;
        }
       this.curPlaying = true;
       this.run = true;
       this.curState = this.stepCount;
       this.el.style.filter = "auto";
        this.el.style.opacity = "auto";

       
       t = window.setTimeout( this.objName + ".runFadeOut()", this.speed);   
    }
    catch(err)
    {
        alert(err);
    }
}


function playGallery()
{
  try
   {
   
        if(this.curPlaying)
        {
            //do nothing as already playing
            return;
        }

        //reset
       this.curState = 0;
       this.el.style.filter = "alpha(opacity=10)";
       //this.el.style.filter = "auto";
       this.el.style.opacity = "0.1";

       //play
       this.getNextImage();
       this.play();
    }
    catch(err)
    {     
    }
}


function writeControl()
{

    var lstrHTML;
    
        lstrHTML = '   <div id="galleryControl' + this.objName + '" class="galleryControlDiv" style="width:' + this.controlAreaWidth + 'px;top:' + this.controlTop + 'px" onMouseOver="displayElement(\'galleryControl' + this.objName + '\')" onMouseOut="hideElement(\'galleryControl' + this.objName + '\')">\r\n';
        lstrHTML += '       <div class="galleryControlBackground" style="width:' + this.controlAreaWidth + 'px" ></div>\r\n';
        lstrHTML += '       <img id="imgBack' + this.objName + '" src="' + backButton + '" class="galleryControlItem" onMouseOver="mouseOverControl(\'imgBack' + this.objName + '\')" onMouseOut="mouseOutControl(\'imgBack' + this.objName + '\')" onClick="' + this.objName + '.stepBack()"/>\r\n';
        lstrHTML += '       <img id="imgPlay' + this.objName + '" src="' + playButton + '" class="galleryControlItem" onMouseOver="mouseOverControl(\'imgPlay' + this.objName + '\')" onMouseOut="mouseOutControl(\'imgPlay' + this.objName + '\')" onClick="' + this.objName + '.play()"/>\r\n';
        lstrHTML += '       <img id="imgPause' + this.objName + '" src="' + pauseButton + '" class="galleryControlItem" style="display:none" onMouseOver="mouseOverControl(\'imgPause' + this.objName + '\')" onMouseOut="mouseOutControl(\'imgPause' + this.objName + '\')" onClick="' + this.objName + '.pause()"/>\r\n';
        lstrHTML += '       <img id="imgFwd' + this.objName + '" src="' + fwdButton + '" class="galleryControlItem" onMouseOver="mouseOverControl(\'imgFwd' + this.objName + '\')" onMouseOut="mouseOutControl(\'imgFwd' + this.objName + '\')" onClick="' + this.objName + '.stepFwd()"/>\r\n';
        lstrHTML += '   </div>\r\n';

    document.write(lstrHTML);
    this.hasControl = true;
}

function writeScroll()
{
    var lstrHTML;
    
        lstrHTML = '   <div id="galleryScroller' + this.objName + '" class="galleryScroller" style="width:' + this.controlAreaWidth + 'px" onMouseOver="displayElement(\'galleryScroller' + this.objName + '\')" onMouseOut="hideElement(\'galleryScroller' + this.objName + '\')">\r\n';
        lstrHTML += '        <div class="galleryScrollerBackground" style="width:' + this.scrollControlWidth + 'px">\r\n';
        lstrHTML += '            <div class="galleryListBackground" style="width:' + this.scrollAreaWidth + 'px">\r\n';
        lstrHTML += '            </div>\r\n';    
        lstrHTML += '        </div> \r\n';
        lstrHTML += '        <div>\r\n';
        lstrHTML += '            <div class="galleryListContainer" style="width:' + this.scrollAreaWidth + 'px;">\r\n';
        lstrHTML += '                <div id="galleryScrollThumbs' + this.objName + '" class="scrollItems" >\r\n';
        lstrHTML += '                </div>\r\n';
        lstrHTML += '            </div>\r\n';
        lstrHTML += '            <div id="galleryScrollBar' + this.objName + '" class="galleryScrollBar" style="width:' + this.scrollAreaWidth + 'px">\r\n';
        lstrHTML += '                <div id="galleryScrollButton' + this.objName + '" class="galleryScrollButton" onMouseDown="' + this.objName + '.scrollSelect(event, \'galleryScrollButton' + this.objName + '\')" ></div>\r\n';
        lstrHTML += '            </div>\r\n';
        lstrHTML += '        </div>\r\n';
        lstrHTML += '   </div>\r\n';           

    document.write(lstrHTML);
    this.hasScroll = true;
}

 function hideControl()
 {
    this.hideElement("galleryControl" +this.objName );
 }

 function displayControl()
 {
    if(this.hasControl)
        this.displayElement("galleryControl" +this.objName );
 }

    function displayElement(elName)
    {
    
        document.getElementById(elName).style.filter = "auto";
        document.getElementById(elName).style.opacity = "1";    
    }
    function hideElement(elName)
    {
    
        document.getElementById(elName).style.filter = "alpha(opacity=0)";
        document.getElementById(elName).style.opacity = "0.001";    
    }

    function mouseOverControl(elName)
    {
        document.getElementById(elName).style.filter= "auto";
        document.getElementById(elName).style.opacity= "auto";
    
    }
    function mouseOutControl(elName)
    {
        document.getElementById(elName).style.filter= "alpha(opacity=70)";    
        document.getElementById(elName).style.opacity = ".7";    
    }


function pause()
{
    this.curPlaying = false;   
    this.run = false;
 
    document.getElementById("imgPlay" + this.objName).style.display = "inline";
    document.getElementById("imgPause"+ this.objName).style.display = "none";
    //set to visible
    this.el.style.filter= "auto";
    this.el.style.opacity= "1";
    this.curState = this.stepCount;

}


function play()
{
     if(this.curPlaying)
    {
        //do nothing as already playing
        return;
    }
    this.curPlaying = true;
   
    this.run = true;

 
    document.getElementById("imgPlay" + this.objName).style.display = "none";
    document.getElementById("imgPause"+ this.objName).style.display = "inline";
    this.runFadeOut();
}

function stepBack()
{
    this.pause();
    this.getLastImage();
    this.el.style.filter= "auto";
    this.el.style.opacity= "1";

}

function stepFwd(){

    try
    {
        
        this.pause();
        this.getNextImage();
        this.el.style.filter= "auto";
        this.el.style.opacity= "1";
        

    }catch(err){}    
}

function selectImage(index)
{
   this.pause();
   this.setNextImage(index); 
    this.el.style.filter= "auto";
    this.el.style.opacity= "1";
        
}


/******* scroll action *******************/    
    
    function scrollSelect(e, elName)
    {

        this.ob = document.getElementById(elName);

        if (N) {
            this.X=e.clientX - this.curPos;
            return false;
        }
        else {
            
            this.X=event.clientX - this.curPos;
       }
       

    }
    
    function scrollDrag(e)
    {

        if (this.ob) {

            if (N) {
            
                this.curPos = e.clientX-this.X ;
            }
            else {
            this.curPos = event.clientX-this.X ;// + document.body.scrollLeft;
            
          }
          
            if(this.curPos < 0)
                this.curPos = 0;
            else if(this.curPos > this.maxPos)
                this.curPos = this.maxPos;
            this.ob.style.left = this.curPos + "px";
            
            //move photos
            this.scroll();
            return false;
       }
     }
    
    function scrollDrop()
    {
        this.ob = null;
    }
   

function scroll()
{
    var pct;
    //get pct moved
    pct = this.curPos/this.maxPos;
    
    
    //todo: remove width hardcoding
    document.getElementById("galleryScrollThumbs" + this.objName).style.left = (-1 * (this.scrollWidth - this.scrollAreaWidth)*pct) + "px";


}

function setScrollForImage()
{
/* Moves the scroll for the current image*/

    var scrollPos;
    var scrollPct;

    try{    
        //pixels to the point we want to be the central pos
        scrollPos = ((this.curImageID + 1) * this.maxThumbWidth) - (this.maxThumbWidth/2); 
           
        scrollPos = scrollPos - (this.maxImageWidth/2);   
        if(scrollPos < 0)
        {
            scrollPos = 0;
        }
        else if(scrollPos > (this.scrollWidth - this.maxImageWidth))
        {
            scrollPos = this.scrollWidth - this.maxImageWidth;
        }
        //get scroll pct
        scrollPct = scrollPos/(this.scrollWidth - this.maxImageWidth);
        
        //perform the scroll        
        this.curPos = scrollPct*(this.maxPos);  
        document.getElementById("galleryScrollButton" + this.objName).style.left = this.curPos + "px";
        this.scroll(this.curPos, "galleryScrollThumbs" + this.objName);
    }
    catch(err){}        
}

function displayScroll()
{
    try
    {
        if(this.hasScroll)
            this.displayElement('galleryScroller' + this.objName );
    }catch(err){}
    
}
function hideScroll()
{   
    this.hideElement('galleryScroller' + this.objName );
}



/*********** load images *****************/

function buildScroll()
{
    var el, elScroll;
    var lstrHTML = "";
    try
    {        
        el = document.getElementById("galleryScrollThumbs" + this.objName);    
        elScroll = document.getElementById("galleryScrollBar" + this.objName);
                                
        //set the width of the div    
        this.scrollWidth = this.gallery.length * this.maxThumbWidth;
        el.style.width = this.scrollWidth  + "px";
        //if don't need to scroll images then don't need scroll bar
        this.isScroll = (this.scrollWidth < this.maxPos);
        if(this.isScroll)
        {
            elScroll.style.visibility = "hidden"; 
        }
        else
        {
            elScroll.style.visibility = "visible"; 
        }
        
        //initialise html
        for(var i=0; i<this.gallery.length;i++)
        {
            lstrHTML += "<div class='galleryThumb' ><div class='centeringDiv'>"
            lstrHTML += "<img id='imgScroll" + this.objName + "_" + i + "' src='" + imgLoading + "' class='galleryScrollImage' onclick='" + this.objName + ".selectImage(" + i + ")'/>";
            lstrHTML += "</div></div>";        
            
        }    
        el.innerHTML = lstrHTML;
        
        //load images before displaying - 
        this.loadScrollImages();
    }
    catch(err){}    
}

function loadScrollImages()
{
    for(var i=0;i<this.galleryThumb.length;i++)
    {
        this.loadScrollImage(i);
    }
}


function loadScrollImage(imageIndex)
{
        var img = new Image();
        var elImage;
        var url;
        
        elImage = document.getElementById("imgScroll" + this.objName + "_" + (imageIndex));
        url = this.galleryThumb[imageIndex];
        
        //preload image first
        img.onerror = function() { scrollImageLoadFailure(elImage)};
        img.onload = function() { updateScrollImage(elImage, url) };
        img.src = url;
}

function scrollImageLoadFailure(elImage)
{

    //image must be missing so load the default instead
    var img = new Image();
    var url = "Images/General/unknown.gif";
    img.onload = function() { updateScrollImage(elImage, url) };
    img.src = url;
}


function updateScrollImage(elImage, url)
{
    
        elImage.src = url;
                
        //scale image 
        if(elImage.width > elImage.height)
        {
            //width bigger so set to max
            elImage.width = maxThumbSize;
        }
        else
        {
            //height bigger so set to max
            elImage.height = maxThumbSize;
        }      

}


/*********** end load images *************/


function showControls()
{
    this.displayControl();
    this.displayScroll();
}
function hideControls()
{
    this.hideControl();
    this.hideScroll();
}