/*******************************************************************  
 * File    : JSFX_ImageZoom.js  © JavaScript-FX.com 
 * Created : 2001/08/31  
 * Author  : Roy Whittle  (Roy@Whittle.com) www.Roy.Whittle.com  
 * Purpose : To create a zooming effect for images 
 * History  
 * Date         Version        Description  
 * 2001-08-09    1.0             First version 
 * 2001-08-31    1.1             Code split - others became JSFX_FadingRollovers, 
 *                             JSFX_ImageFader and JSFX_ImageZoom. 
 * 2002-01-27    1.2             Completed development by converting to JSFX namespace 
 * 2002-04-25    1.3             Added the functions stretchIn & expandIn 
 * 2004-01-06    1.4             Allowed for the image (tag) being forcibly sized 
 ***********************************************************************/  
 /*** Create some global variables ***/ 
if(!window.JSFX) 
         JSFX=new Object(); 
 JSFX.ImageZoomRunning = false; 
 /******************************************************************* 
 * 
 * Function    : zoomIn 
 * 
 * Description : This function is based on the turn_on() function 
*                     of animate2.js (animated rollovers from www.roy.whittle.com). 
 *                     Each zoom object is given a state.  
 *                       OnMouseOver the state is switched depending on the current state. 
 *                       Current state -> Switch to 
 *                       =========================== 
 *                       null            ->      OFF. 
 *                       OFF             ->      ZOOM_IN + start timer 
 *                       ZOOM_OUT        ->      ZOOM_IN 
 *                       ZOOM_IN_OUT     ->      ZOOM_IN 
 *****************************************************************/ 
 JSFX.zoomOn = function(img, zoomStep, maxZoom) 
 { 
         if(img) 
        { 
                 if(!zoomStep) 
                 { 
                         if(img.mode == "EXPAND") 
                                 zoomStep = img.height/10; 
                         else 
                                 zoomStep = img.width/10; 
                 } 
  
                 if(!maxZoom) 
                 { 
                         if(img.mode == "EXPAND") 
                                 maxZoom = img.height/2; 
                         else 
                                maxZoom = img.width/2; 
                } 
 
 
                if(img.state == null) 
                { 
                        img.state = "OFF"; 
                        img.index = 0; 
                        img.orgWidth =  img.width; 
                        img.orgHeight = img.height; 
                        img.zoomStep = zoomStep; 
                        img.maxZoom  = maxZoom; 
                } 
 
                if(img.state == "OFF") 
                { 
                        img.state = "ZOOM_IN"; 
                        start_zooming(); 
                } 
                else if( img.state == "ZOOM_IN_OUT" 
                        || img.state == "ZOOM_OUT") 
                { 
                         img.state = "ZOOM_IN"; 
                } 
        } 
 } 
 JSFX.zoomIn = function(img, zoomStep, maxZoom) 
 { 
         img.mode = "ZOOM"; 
         JSFX.zoomOn(img, zoomStep, maxZoom); 
 } 
 JSFX.stretchIn = function(img, zoomStep, maxZoom) 
 { 
         img.mode = "STRETCH"; 
         JSFX.zoomOn(img, zoomStep, maxZoom); 
} 
JSFX.expandIn = function(img, zoomStep, maxZoom) 
{ 
       img.mode = "EXPAND"; 
       JSFX.zoomOn(img, zoomStep, maxZoom); 
 } 
/******************************************************************* 
* 
* Function    : zoomOut 
* 
* Description : This function is based on the turn_off function 
*                     of animate2.js (animated rollovers from www.roy.whittle.com). 
*                     Each zoom object is given a state.  
*                       OnMouseOut the state is switched depending on the current state. 
 *                       Current state -> Switch to 
 *                       =========================== 
 *                       ON              ->      ZOOM_OUT + start timer 
 *                       ZOOM_IN ->      ZOOM_IN_OUT. 
 *****************************************************************/ 
 JSFX.zoomOut = function(img) 
 { 
         if(img) 
         { 
                 if(img.state=="ON") 
                 { 
                         img.state="ZOOM_OUT"; 
                         start_zooming(); 
                 } 
                 else if(img.state == "ZOOM_IN") 
                 { 
                         img.state="ZOOM_IN_OUT"; 
                 } 
         } 
 } 
 /******************************************************************* 
 * 
 * Function    : start_zooming 
 * 
 * Description : This function is based on the start_animating() function 
 *                       of animate2.js (animated rollovers from www.roy.whittle.com). 
 *                       If the timer is not currently running, it is started. 
 *                       Only 1 timer is used for all objects 
 *****************************************************************/ 
 function start_zooming() 
 { 
         if(!JSFX.ImageZoomRunning) 
                 ImageZoomAnimation(); 
 } 
  
 JSFX.setZoom = function(img) 
 { 
         if(img.mode == "STRETCH") 
         { 
                 img.width  = img.orgWidth  + img.index; 
                 img.height = img.orgHeight; 
         } 
         else if(img.mode == "EXPAND") 
         { 
                 img.width  = img.orgWidth; 
                 img.height = img.orgHeight + img.index; 
         } 
         else 
         { 
                 img.width  = img.orgWidth   + img.index; 
                 img.height = img.orgHeight  + (img.index * (img.orgHeight/img.orgWidth)); 
         } 
 } 
 /******************************************************************* 
 * 
 * Function    : ImageZoomAnimation 
 * 
 * Description : This function is based on the Animate function 
 *                   of animate2.js (animated rollovers from www.roy.whittle.com). 
 *                   Each zoom object has a state. This function 
*                   modifies each object and (possibly) changes its state. 
 *****************************************************************/ 
 function ImageZoomAnimation() 
 { 
         JSFX.ImageZoomRunning = false; 
         for(i=0 ; i<document.images.length ; i++) 
         { 
                 var img = document.images[i]; 
                 if(img.state) 
                 { 
                         if(img.state == "ZOOM_IN") 
                         { 
                                 img.index+=img.zoomStep; 
                                 if(img.index > img.maxZoom) 
                                         img.index = img.maxZoom; 
  
                                 JSFX.setZoom(img); 
  
                                 if(img.index == img.maxZoom) 
                                         img.state="ON"; 
                                 else 
                                         JSFX.ImageZoomRunning = true; 
                         } 
                         else if(img.state == "ZOOM_IN_OUT") 
                         { 
                                 img.index+=img.zoomStep; 
                                 if(img.index > img.maxZoom) 
                                         img.index = img.maxZoom; 
  
                                 JSFX.setZoom(img); 
          
                                 if(img.index == img.maxZoom) 
                                         img.state="ZOOM_OUT"; 
                                 JSFX.ImageZoomRunning = true; 
                         } 
                         else if(img.state == "ZOOM_OUT") 
                         { 
                                 img.index-=img.zoomStep; 
                                 if(img.index < 0) 
                                         img.index = 0; 
  
                                 JSFX.setZoom(img); 
  
                                 if(img.index == 0) 
                                         img.state="OFF"; 
                                 else 
                                         JSFX.ImageZoomRunning = true; 
                         } 
                 } 
         } 
         /*** Check to see if we need to animate any more frames. ***/ 
         if(JSFX.ImageZoomRunning) 
                setTimeout("ImageZoomAnimation()", 40); 
 } 

