//dissolvesOff is set from the pop up window and persists
// stopDissolve is set to true when user clicks on a dissolve image and lasts only for 
//currentimage
var dissolveGlobals = {
                  dissolvesOff: false, showOriginal: false, timePerFrame: 80, stopDissolve: false
               };
 

function __animate(id, numFrames, timePerFrame, animationfn, whendone, img, imgsize)
{ 

     displayNextFrame = function() 
     {  
        for(var i = 0; i < 10000; i++){};  
        if (frame >= numFrames  ||  dissolveGlobals.stopDissolve)   // First, see if we're done
        {     
            clearInterval(intervalId);   
            if (whendone) frame = whendone(id,time, frame);
            return;                          
        }

      if(frame >= 2 && frame <= 5) {   //hold image on screen for first 4 frames
        frame++;
        return;   
      }
      animationfn(id, frame, time, img, imgsize); 
     

      frame++;               // Increment the frame number
      time += timePerFrame;  // Increment the elapsed time

    }

    var frame = 0;   // Store current frame number
    var time = 0;    // Store total elapsed time    
    
    var intervalId = setInterval(displayNextFrame, timePerFrame);

}

function setClip(objectID, clipTop, clipRight, clipBottom, clipLeft) {
var dom = getDOMStyle(objectID);
  if (dom.clip.left) {   
	dom.clip.top = clipTop;
	dom.clip.right = clipRight;
	dom.clip.bottom = clipBottom;
	dom.clip.left = clipLeft;
  }
  dom.clip = 'rect(' + clipTop + ' ' + clipRight + ' ' + clipBottom + ' ' + clipLeft +')';
}

var iwidth = -1;
var iheight = -1;
var clipLeft=0, clipTop=0, clipRight=0, clipBottom=0;

function whendone(id, time, frame) {
   clipLeft=0, clipTop=0, clipRight=0, clipBottom=0;
   iwidth = -1;
   iheight = -1;
   dissolveGlobals.stopDissolve = false;
   dissolveGlobals.stopDissolve = false;
   hide(id); 
   show('options');
   return 0;
}

function dissolve(id, time, frame, img, imgSize) {
var imgW = imgSize.w;
var imgH = imgSize.h;
var body = '<img src="' + img + '" onmousedown="stopDissolve(\'img\');" ';


 if(iwidth == -1 && iheight == -1) {  
 iheight = browserHeight();   
 iwidth = (iheight*imgW)/imgH;      

   body += ' width="' + iwidth + '" height="' + iheight + '">';

   setBody(id, body);
   clipBottom = iheight;
   clipRight = iwidth;   
   setStyle('left', (browserWidth()-iwidth)/2, id);
   setStyle('top', (browserHeight()-iheight)/2, id);
   show(id);   
   return;
 }
  else {   
    clipBottom -= 5;
    clipRight -=5;
    clipTop += 5;
    clipLeft +=5;    
    setClip(id, clipTop, clipRight, clipBottom, clipLeft);
  } 
}

function animate(id, numFrames, timePerFrame, animationfn, whendone, im, imgsize) {
if(dissolveGlobals.timePerFrame == null) dissolveGlobals.timePerFrame = timePerFrame;

 var img = im.src;
 if(dissolveGlobals.dissolvesOff) return;

 if(dissolveGlobals.showOriginal || !im.isloaded) {
      showOriginal(im, imgsize);
      if(!im.isloaded) return;
 }
  __animate(id, numFrames, dissolveGlobals.timePerFrame, animationfn, whendone, img, imgsize);
}


function resetDissolveTime(dt) {  
   dissolveGlobals.timePerFrame += dt;
   if(dissolveGlobals.timePerFrame <= 5) dissolveGlobals.timePerFrame = 10;
   return dissolveGlobals.timePerFrame;
}

function resetShowOriginal(bool) {

  dissolveGlobals.showOriginal = bool;
}


function resetStopDissolve(bool) {
  dissolveGlobals.dissolvesOff = bool;
}

// The following three functions return state valuesl to
// the animation control popup window

function getDissolveOffState() {
return dissolveGlobals.dissolvesOff;
}

function getPopupState() {
return dissolveGlobals.showOriginal;
}

function getDissolveSpeed() {
  return dissolveGlobals.timePerFrame;
}



// on unloading the image window sets the isloaded field of the image to true
// so that windows don't continue to pop up if Image.isloaded fails to get set to true
//after an image is loaded
// This script is written to the popup image window
var scriptBody = 'window.onunload=unloadhandler;'
               +  'var img = opener.getcurrentLoaded();'
               + ' function unloadhandler() { if(img) img.isloaded = true; };';
var currentImg = false;
function getcurrentLoaded(){
 var temp = currentImg;
 if(currentImg)
    return temp;
 else return false; 
} 
             
function showOriginal(img, size) {
 var width = size.w + 40;
 var height = size.h +  40;
   w = window.open("", "image", "resizable=yes,width=" + width + ",height=" + height);
   w.document.open();
   writeBasicCSS(w.document);   
   writeBasicBodyTag(w.document);   
   w.document.write('<center><img src="', img.src,'"></center>');
   currentImg = img;
   writeScript(w.document, scriptBody) 
   w.document.close();
}


function resetGlobals() {

 dissolveGlobals = {
                     dissolvesOff: false, showOriginal: false, timePerFrame: 80
                  };
}

// event handler called when user clicks mouse down on dissolve image--the image tag
// with event handler is created in dissolve() above
function stopDissolve(id) {
  dissolveGlobals.stopDissolve = true;
}