var usingApplet       = false;
   var feedSelected      = 0;
   var allowClockUpdates = true;
   var tl_hover          = false;
   var imageLoaded       = false;
   var playState         = 0;
   var nextAct           = 'postreload';
   var playStateChange   = false;
   var zoomMultiplier    = 1;
   var appletRunning     = false;
   var modeSetLockout    = true;
   var appletSafe        = false;

   var cQual = 2;
   var cZoom = 3;
   var cSpd  = 4;

   //Date selector variables
   var ds_oe;
   var ds_ce;

   var tH = 0; var tM = 0;

   // Configure all the sliders
   var slider=new Array();
   slider[1]=new Object();
   slider[1].min=1;
   slider[1].max=5;
   slider[1].val=3;
   slider[1].onchange=sliderChangeCallback;

   slider[2]=new Object();
   slider[2].min=1;
   slider[2].max=5;
   slider[2].val=3;
   slider[2].onchange=sliderChangeCallback;

   slider[3]=new Object();
   slider[3].min=1;
   slider[3].max=5;
   slider[3].val=4;
   slider[3].onchange=sliderChangeCallback;

   //These values are overridden later and depend on cSpd above
   var updateRate     = 100;
   var skipframes     = 0;

   var qualitySetting = 0;

   var cookieQuality;
   var useQuality     = cQual;

   cookieQuality = getCookie("quality");

   if (cookieQuality != null)
     useQuality = cookieQuality;

   if (forcequality != -1)
     useQuality = forcequality;
   
   if (useQuality == 1)
     qualitySetting = 15;
   if (useQuality == 1)
     qualitySetting = 25;
   if (useQuality == 1)
     qualitySetting = 50;
   if (useQuality == 1)
     qualitySetting = 75;
   if (useQuality == 1)
     qualitySetting = 0;

   var viewmode = 0;
   var cookieViewmode;

   cookieViewmode = getCookie("viewmode");

   if (cookieViewmode != null) {
     if (cookieViewmode == 1)
       viewmode = 1;
     else
       viewmode = 0;
   }

   if (forceviewmode != -1) {
     if (forceviewmode == 1) {
       userPref = confirm("You have forced the i-Catcher web view to use JavaScript mode. This is usually only\nnecessary if you are experiencing problems with the Java applet.\n\nClick OK to make this change permanent (affects this machine only).");
       if (userPref)
         setCookie("viewmode",1);
     } else {
       userPref = confirm("You have forced the i-Catcher web view to use Java mode.\n\nClick OK to make this change permanent (affects this machine only).");
       if (userPref)
         setCookie("viewmode",2);
     }

     viewmode = forceviewmode;
   }

   if (viewmode > 1)
     viewmode = 0;

   if (viewmode < 1)
     usingApplet = true;

   var playImage   = new Image();

   // standard parts
   preload('panel-h.gif'); preload('panel-v.gif'); preload('panel-h2.gif');
   preload('panel-tl.gif'); preload('panel-tr.gif'); preload('panel-bl.gif'); preload('panel-br.gif');
   preload('button.gif'); preload('buttonhover.gif');
   preload('zi.gif'); preload('zo.gif'); preload('zi-d.gif'); preload('zo-d.gif'); preload('zi-h.gif'); preload('zo-h.gif');
   preload('scale1.gif'); preload('scale2.gif');

   // Playback images
   preload('rewind.gif'); preload('stepback.gif'); preload('playback.gif'); preload('stop.gif');
   preload('playfrwd.gif'); preload('stepfrwd.gif'); preload('playend.gif');
   preload('rewind-h.gif'); preload('stepback-h.gif'); preload('playback-h.gif'); preload('stop-h.gif');
   preload('playfrwd-h.gif'); preload('stepfrwd-h.gif'); preload('playend-h.gif');

   function zeroFormat(i) {
     if (i<10)
       return '0'+i;
     else
       return i;
   }

   function appletInited() {
     appletSafe = true;
   }
   
   function initPlayback() {
     if (!allowZooming)
       disableZoomControls();
 
     document.getElementById('date').value = zeroFormat(cDay)+'/'+zeroFormat(cMonth)+'/'+cYear;

     if (!usingApplet) {
       playImage.src = '/playback/postreload.cgi?ID='+ConnectionID+'&Key='+ConnectionKey+'&uniq='+getMillis();

       playImage.onload = notifyLoaded;

       i = document.getElementById('image1');

       if (i != null) {
         i.src='/status/populating.gif';
         i.width = 352; i.height = 288;
       }

       window.setTimeout("imageTimer()",updateRate);
     }

     //Reinit the date selector
     ds_oe = ds_getel('ds_calclass');
     ds_ce = ds_getel('ds_conclass');

     if (document.layers)
       document.getElementById('timeline').captureEvents(Event.MOUSEMOVE);

     document.onmousemove = tl_time;

     setQual(useQuality);

     //The speed is also set in Console as this is called too early to send the request via the applet
     //We still call it here anyway for the JavaScript view
     notifySpd(cSpd);
     //The initial slider position is set in sliderPostLoad()

     document.getElementById('liveLink').href='/?feed='+defaultFeed;

     if (viewmode >= 0)
       document.viewselect.viewer[1-viewmode].checked=true;
     else 
       document.viewselect.viewer[1].checked=true;

     modeSetLockout = false;
   }

   function selectMode(mode) {
     if (modeSetLockout)
       return;

     if (mode != viewmode) {
        location.href='/playback/index.htm?feed='+feedIDs[feedSelected-1]+'&ID='+ConnectionID+'&Key='+ConnectionKey+'&mode='+mode;
     }
   }

   function feedHover(feed) {
      td = document.getElementById('tdfeed'+feed);
      td.className = 'feedHover';
   }

   function feedUnHover(feed) {
      td = document.getElementById('tdfeed'+feed);
      if (feedSelected != feed) {
        td.className = 'feedUnSelect';
      } else {
        td.className = 'feedSelect';
      }
   }

   function enterFeed(feed) {

      td = document.getElementById('tdfeed'+feedSelected);
      td.className = 'feedUnSelect';

      feedSelected = feed;

      document.getElementById('liveLink').href='/?feed='+feedIDs[feedSelected-1];

      td = document.getElementById('tdfeed'+feedSelected);
      td.className = 'feedSelect';

      playbackAction('load&feed='+feedIDs[feedSelected-1]);
   }

   function setZoomSlider(p) {
     if (!allowZooming)
       return;

     cZoom = p;
     notifyZoom(p);
   }

   function notifyZoom(zoomLevel) {
     if (usingApplet) {
       if (checkApplet())
         document.MJPGApplet.setZoom(zoomLevel);
       playbackAction('resend');
     } else {
       if (zoomLevel == 1)
         zoomMultiplier = 0.25;
       if (zoomLevel == 2)
         zoomMultiplier = 0.5;
       if (zoomLevel == 3)
         zoomMultiplier = 1.0;
       if (zoomLevel == 4)
         zoomMultiplier = 2.0;
       if (zoomLevel == 5)
         zoomMultiplier = 4.0;

       requestNewResolution(playImage.width * zoomMultiplier, playImage.height * zoomMultiplier);

      }
   }

   function setZoom(p) {
     if (!allowZooming)
       return;

     if (cZoom == p)
       return;

     cZoom = p;
     notifyZoom(p);
   }

   function adjustZoom(p) {
     t = eval(cZoom +'+'+ p);
     if (t < 1) t = 1;
     if (t > 5) t = 5;
     setSlider(1,t);
     setZoom(t);
   }

   function sliderChangeCallback(val, slider) {
     if (slider == 1)
      setZoom(Math.floor(val + 0.5));
     if (slider == 2)
      setQual(Math.floor(val + 0.5));
     if (slider == 3)
      setSpd(Math.floor(val + 0.5));
   }

   function setQualSlider(p) {
     cQual = p;
     setCookie("quality",p);
     notifyQual(p);
   }


   function notifyQual(qualLevel) {
     qualitySetting = 0;

     if (qualLevel == 1)
       qualitySetting = 15;
     if (qualLevel == 2)
       qualitySetting = 25;
     if (qualLevel == 3)
       qualitySetting = 50;
     if (qualLevel == 4)
       qualitySetting = 75;
     if (qualLevel == 5)
       qualitySetting = 0;

     if (usingApplet)
       playbackAction('quality&quality='+qualitySetting);
     else {
       if (nextAct != 'postreload')
         playbackAction('');
     }
   }

   function setQual(p) {
     if (cQual == p)
       return; 

     setQualSlider(p);
   }

   function adjustQual(p) {
     t = eval(cQual +'+'+ p);
     if (t < 1) t = 1;
     if (t > 5) t = 5;
     setSlider(2,t);
     setQual(t);
   }

   function notifySpd(spdLevel) {
     if (usingApplet)
       playbackAction('speed&speed='+(5-spdLevel));
     else {
       if (spdLevel == 1) {
         updateRate = 1000; skipFrames = 0;
       }
       if (spdLevel == 2) {
         updateRate = 250; skipFrames = 0;
       }
       if (spdLevel == 3) {
         updateRate = 100; skipFrames = 0;
       }
       if (spdLevel == 4) {
         updateRate = 50; skipFrames = 0;
       }
       if (spdLevel == 5) {
         updateRate = 50; skipFrames = 1;
       }
     }
   }

   function setSpd(p) {
     if (cSpd == p)
       return;

     cSpd = p;
     notifySpd(p);
     setSlider(3,p);
   }

   function adjustSpd(p) {
     t = eval(cSpd +'+'+ p);
     if (t < 1) t = 1;
     if (t > 5) t = 5;
     setSpd(t);
   }

   function requestNewResolution(newWidth, newHeight) {
     if (usingApplet) {
       if (checkApplet()) {
         document.MJPGApplet.width  = newWidth;
         document.MJPGApplet.height = newHeight;
       }
     } else {
       i = document.getElementById('image1');

       if (i != null) {
         i.width = newWidth;
         i.height = newHeight;
       }
     }

   }

   function getMillis() {
     var d = new Date();
     return d.getTime();
   }

   function playbackAction(act) {
     if ((act == 'play') && (playState == 1))
       return playbackAction('stop');

     if ((act == 'bplay') && (playState == -1))
       return playbackAction('stop');

     if (act.substring(0,4) == 'load')
       playbackAction('stop');

     if (usingApplet) {
       if (act == 'play') {
         playState = 1;
         playHover(document.getElementById('playf'),'playfrwd');
         playUnHover(document.getElementById('playb'),'playback');
       }
       if (act == 'bplay') {
         playState = -1;
         playHover(document.getElementById('playb'),'playback');
         playUnHover(document.getElementById('playf'),'playfrwd');
       }
       if (act == 'stop') {
         playState = 0;
         playUnHover(document.getElementById('playf'),'playfrwd');
         playUnHover(document.getElementById('playb'),'playback');
       }
 
       if (checkApplet())
         document.MJPGApplet.addPlaybackCommand(act);
     } else {
       nextAct = act;

       if (act == 'play') {
         playState = 1; nextAct = 'play'; playStateChange = true;
         playHover(document.getElementById('playf'),'playfrwd');
         playUnHover(document.getElementById('playb'),'playback');
       }
       if (act == 'bplay') {
         playState = -1; nextAct = 'play'; playStateChange = true;
         playHover(document.getElementById('playb'),'playback');
         playUnHover(document.getElementById('playf'),'playfrwd');
       }
       if (act == 'stop') {
         playState = 0; playStateChange = true;
         playUnHover(document.getElementById('playf'),'playfrwd');
         playUnHover(document.getElementById('playb'),'playback');
       }

       playStateChange = true;
     }
   }

   function tl_update() {
     document.getElementById('timeline').src = '/playback/timeline.cgi?ID='+ConnectionID+'&Key='+ConnectionKey+'&uniq='+getMillis();
   }

  function timelineclick(click) {
    if (navigator.appName=='Netscape') {
      rx = click.clientX - document.getElementById('timeline').x;
    } else {
      rx = click.offsetX;
    }

    mins=parseInt((rx - 2) * (1440/(document.getElementById('timeline').width-4)));
    if (mins < 0) { mins = 0; }
    if (mins > 1439) { mins = 1439; }

    hrs=parseInt(mins / 60);
    mins%=60;

    rsetClock(hrs,mins);

    tH = hrs; tM = mins;

    gotoTime(hrs,mins);
  }

  function tl_time(e) {
    if (!tl_hover)
      return;

    if (document.layers) {
      rx = e.pageX;
      rx = rx - document.getElementById('timeline').x;
    } else {
      if (document.all) 
        rx = event.clientX + document.body.scrollLeft;
      else
        rx = e.clientX + document.body.scrollLeft;

      iPos = 0; elt = document.getElementById('timeline');
      while (elt != null) {
        iPos += elt.offsetLeft;
        elt = elt.offsetParent;
      }

      rx = rx - iPos;
    }  

    mins=parseInt((rx - 2) * (1440/(document.getElementById('timeline').width-4)));
    mins -= 6;
    if (mins < 0) { mins = 0; }
    if (mins > 1439) { mins = 1439; }

    hrs=parseInt(mins / 60);
    mins%=60;

    rsetClock(hrs,mins);
    
    return false;
  }

  function setClock(hrs, mins) {
    if ((!allowClockUpdates) || (tl_hover)) {
      tH = hrs; tM = mins;
      return;
    } else {
      rsetClock(hrs, mins); 
    }
  }

  function rsetClock(hrs, mins) {
    clk='';

    if (hrs>=10) {
      clk = hrs;
    } else {
      clk = '0' + hrs;
    }

    clk = clk + ':';

    if (mins>=10) {
      clk = clk + mins;
    } else {
      clk = clk + '0' + mins;
    }

    document.getElementById('clock').value = clk;
  }

  function gotoTime(hrs, mins) {
    playbackAction('specframe&timecode='+((hrs * 60)+mins));
  }

  function gotoDate(d, m, y) {
    cDay = d;
    cMonth = m;
    cYear = y;
    action = 'load&day='+d+'&month='+m+'&year='+y;
    playbackAction(action);
  }

  function gotoUserTime() {
    t = document.getElementById('clock').value;
    nt = ''; l = t.length;

    for (n=0; n<l; n++) {
      c = t.substring(n,n+1);
      if ((c>='0') && (c<='9'))
        nt = nt + c;
    }

    if (nt.length > 2)
      h = nt.substring(0, nt.length - 2);
    else
      h = 0;

    if (nt.length > 1)
      m = nt.substring(nt.length - 2, nt.length);
    else
      m = nt;

    h = parseInt(h,10); m = parseInt(m,10);

    if (h<0)
        h = 0;

    if (h>23)
        h = 23;

    if (m<0)
        m = 0;

    if (m>59)
        m = 59;
 
    document.getElementById('date').focus();
    rsetClock(h,m);
    gotoTime(h,m);
    document.getElementById('date').focus();
    allowClockUpdates = true;
    tH = h; tM = m;
    
  }

  function keyTime() {
    if (window.event && window.event.keyCode == 13)
      gotoUserTime();

    if (event && event.which == 13)
      gotoUserTime();
  }

  function notifyLoaded() {
    imageLoaded = true;
  }

  function imageTimer() {
    if (usingApplet)
      return;
  
    if (!imageLoaded) {
      window.setTimeout("imageTimer()",updateRate);
      return;
    }

    idleTime = 0;

    i = document.getElementById('image1');

    if (playImage.height == 1) {  // Status image
      s = i.src;
      i.width = 352; i.height = 288;
      if (playImage.width == 1)
        s = '/status/invalid.gif';  // Invalid session
      if (playImage.width == 2) {
        s = '/status/noimages.gif'; // No more images to play
        if (!playStateChange) {
          playState = 0; nextAct = 'stop';
        }
      }
      if (playImage.width == 3)
        s = '/status/populating.gif'; // Still loading cache
      if (playImage.width == 4)
        s = '/status/nofeed.gif'; // No feed available
      if (playImage.width == 5)
        s = '/status/denied.gif'; // Access denied

      if (s != i.src.substring(i.src.length - s.length))
        i.src = s;

      if (nextAct == 'postreload')
        tl_update();

    } else {
      if (i.src != playImage.src) {
        i.src = playImage.src;
        i.width = playImage.width * zoomMultiplier; i.height = playImage.height * zoomMultiplier;
      }

      if (nextAct == 'postreload')
        tl_update();

      if ((!playStateChange) || (nextAct == 'postreload')) {
        if (playState == 0)
          nextAct = 'stop';
        else
          nextAct = 'play';
      }
    }
 
    if (playState == 0) {
      if (nextAct.substring(0,4) == 'load') {
        imageLoaded = false;
        playImage.src = '/playback/load.cgi?action='+nextAct+'&ID='+ConnectionID+'&Key='+ConnectionKey+'&uniq='+getMillis();
        nextAct = 'postreload';
      } else if (nextAct.substring(0,9) == 'specframe') {
        imageLoaded = false;
        playImage.src = '/playback/specframe.cgi?action='+nextAct+'&ID='+ConnectionID+'&quality='+qualitySetting+'&Key='+ConnectionKey+'&uniq='+getMillis();
        nextAct = 'play';
      } else if (nextAct == 'postreload') {
        imageLoaded = false;
        playImage.src = '/playback/postreload.cgi?action='+nextAct+'&ID='+ConnectionID+'&Key='+ConnectionKey+'&quality='+qualitySetting+'&uniq='+getMillis();
        nextAct = 'postreload';
      } else if (nextAct != 'stop') {
        imageLoaded = false;
        playImage.src = '/playback/image.cgi?action='+nextAct+'&ID='+ConnectionID+'&Key='+ConnectionKey+'&quality='+qualitySetting+'&uniq='+getMillis();
        nextAct = 'stop';
      }
    } else {
      imageLoaded = false;
      if (nextAct == 'play') {
        if (playState == 1)
          playImage.src = '/playback/image.cgi?action=next&ID='+ConnectionID+'&Key='+ConnectionKey+'&quality='+qualitySetting+'&count='+(skipframes + 1)+'&uniq='+getMillis();
        if (playState == -1)
          playImage.src = '/playback/image.cgi?action=previous&ID='+ConnectionID+'&Key='+ConnectionKey+'&quality='+qualitySetting+'&count='+(skipframes + 1)+'&uniq='+getMillis();
      } else if (nextAct.substring(0,4) == 'load') {
        imageLoaded = false;
        playImage.src = '/playback/load.cgi?action='+nextAct+'&ID='+ConnectionID+'&Key='+ConnectionKey+'&uniq='+getMillis();
        nextAct = 'postreload';
      } else if (nextAct.substring(0,9) == 'specframe') {
        imageLoaded = false;
        playImage.src = '/playback/specframe.cgi?action='+nextAct+'&ID='+ConnectionID+'&Key='+ConnectionKey+'&quality='+qualitySetting+'&uniq='+getMillis();
        nextAct = 'play';
      } else if (nextAct == 'postreload') {
        imageLoaded = false;
        playImage.src = '/playback/postreload.cgi?action='+nextAct+'&ID='+ConnectionID+'&Key='+ConnectionKey+'&quality='+qualitySetting+'&uniq='+getMillis();
        nextAct = 'postreload';
      } else if (nextAct != 'stop') {
        imageLoaded = false;
        playImage.src = '/playback/image.cgi?action='+nextAct+'&ID='+ConnectionID+'&Key='+ConnectionKey+'&quality='+qualitySetting+'&uniq='+getMillis();
        nextAct = 'stop';
      }
    } 

    playStateChange = false;

    window.setTimeout("imageTimer()",updateRate);
  }

  function showInfo() {
    if (playState != 0)
      return alert('Please stop the playback before retrieving image information');

    open('/playback/info.cgi?ID='+ConnectionID+'&Key='+ConnectionKey+'&uniq='+getMillis(), '_blank', 'width=32,height=32,status=no,toolbar=no,menubar=no');
  }

  function disableZoomControls() {
    document.getElementById('izo').src = '/images/zo-d.gif';
    document.getElementById('izi').src = '/images/zi-d.gif';
    for (n=1; n<=5; n++) {
//      if (n !=3)
//        document.getElementById('zoomp'+n).src = '/images/scale1d.gif'
//      else
//        document.getElementById('zoomp'+n).src = '/images/scale2d.gif'
    }
    document.getElementById('zoomtext').className = 'icontrolsd';
  }

  function playHover(i,button) {
    i.src = '/images/'+button+'-h.gif';
  }

  function playUnHover(i,button) {
    if (playState == 0) {
      i.src = '/images/'+button+'.gif';
      return;
    }

    if ((i.name == 'playf') && (playState != 1))
      i.src = '/images/'+button+'.gif';
    else if  ((i.name == 'playb') && (playState != -1))
      i.src = '/images/'+button+'.gif';
    else if ((i.name != 'playb') && (i.name != 'playf'))
      i.src = '/images/'+button+'.gif';
  }

  var idleTime = 0;

  function idleExpire() {
    if (!usingApplet)
      idleTime++;

    if (idleTime > 300) {
      if (usingApplet) {
        usingApplet = false;
      }
      i = document.getElementById('image1');
      if (i != null) {
        i.src = '/status/invalid.gif';
        i.width = 352; i.height = 288;
      }
    } else {
      window.setTimeout("idleExpire()",1000);
    }
  }

  window.setTimeout("idleExpire()",1000);

  function mainAppletRunning() {
    appletRunning = true;
  }

  function sliderPostLoad() {
    setSlider(2, useQuality);
    setSlider(3, cSpd);
  }

  function invalidate() {
    idleTime = 300;
  }

  function notifyAtEnd() {
    playState = 0;
    playUnHover(document.getElementById('playf'),'playfrwd');
    playUnHover(document.getElementById('playb'),'playback');
  }

  function checkApplet() {
   return appletSafe;
  }

  function printFeedList() {
    t = totalFeeds;
    if (t>10) t = 10;
    divHeight = 19 * t;

    document.write('<div class="feed" style="height: '+divHeight+'px; width: 120px; overflow: auto;">');

    document.write('<table width="100" cellpadding="1" cellspacing="1" border="0">');

    for (f=1; f<=totalFeeds; f++) {
      tc = 'feedUnSelect';
      if (feedIDs[f-1] == defaultFeed) {
        tc = 'feedSelect';
        feedSelected = f;
      }

      document.write('<tr><td id="tdfeed'+f+'" onMouseOver="feedHover('+f+');" onMouseOut="feedUnHover('+f+');" onClick="enterFeed('+f+',1);" class="'+tc+'">');
      document.write('<p class="feed">'+feedNames[f-1]+'<\/p><\/td><\/tr>');
    }

    document.write('<\/table><\/div>');
  }

/* Button hover code */

   function buttonHover(button) {
     bt = document.getElementById('button'+button);
     bt.className = 'buttonHover';
   }
 
   function buttonUnHover(button) {
     bt = document.getElementById('button'+button);
     bt.className = 'button';
   }