// HTML image-based animated clock by Leo Meyer, leo@leomeyer.de
// This code can be used and distributed freely, as long as this author's comment
// remains unchanged and is distributed along with the code.

// define clock image arrays
var clockImgsDec = new Array(10);	// this one will be two-dimensional
var clockImgs2 = new Array(5);
var clockImgs3 = new Array(5);
var clockImgs5 = new Array(5);

if (typeof(clockimgs) == "undefined") clockimgs = 0;
if (typeof(imgprefix) == "undefined") imgprefix = "";

  // initialize image arrays
  for (i = 0; i < 10; i++) {
    clockImgsDec[i] = new Array(5);
    for (j = 0; j < 5; j++) {
    	clockImgsDec[i][j] = new Image();
    	clockImgsDec[i][j].src = imgprefix + "i" + i + "_" + (i == 9 ? 0 : i + 1) + "_" + j + ".png";
    }
  }
  for (j = 0; j < 5; j++) {
  	clockImgs2[j] = new Image();
  	clockImgs2[j].src = imgprefix + "i2_0_" + j + ".png";
  }
  for (j = 0; j < 5; j++) {
  	clockImgs3[j] = new Image();
  	clockImgs3[j].src = imgprefix + "i3_0_" + j + ".png";
  }
  for (j = 0; j < 5; j++) {
  	clockImgs5[j] = new Image();
  	clockImgs5[j].src = imgprefix + "i5_0_" + j + ".png";
  }

var clIndex = 0;
var resynCnt = 0;
var resyncIntv = Math.round(Math.random()*10 + 1) *5;

// set clock image depending on current digit, next digit and counter i
function setDigit(n, d1, d2, i) {
  if ((d1 == 2) && (d2 == 0)) {
    window.document.images[clockimgs + n].src = clockImgs2[i].src;
  } else
  if ((d1 == 3) && (d2 == 0)) {
    window.document.images[clockimgs + n].src = clockImgs3[i].src;
  } else
  if ((d1 == 5) && (d2 == 0)) {
    window.document.images[clockimgs + n].src = clockImgs5[i].src;
  } else
    window.document.images[clockimgs + n].src = clockImgsDec[d1][i].src;
}

  date = new Date();
  date.setTime(new Date().getTime() - 1000);
  hours = date.getHours();
  minutes = date.getMinutes();
  seconds = date.getSeconds();
  
  // var names are a bit clumsy to avoid conflicts with the menu code
  var lc_h1 = (hours > 19 ? 2 : (hours > 9 ? 1 : 0));
  var lc_h2 = (hours % 10);
  var lc_m1 = Math.floor(minutes / 10);
  var lc_m2 = minutes % 10;
  var lc_s1 = Math.floor(seconds / 10);
  var lc_s2 = seconds % 10;
  // transition flags
  var s1trans = false;
  var m2trans = false;
  var m1trans = false;
  var h2trans = false;
  var h1trans = false;  

function clocktimer() {
  
  s1p = lc_s1;
  s2p = lc_s2;
  m1p = lc_m1;
  m2p = lc_m2;
  h1p = lc_h1;
  h2p = lc_h2;
  s1n = lc_s1+1;
  s2n = lc_s2+1;
  m1n = lc_m1+1;
  m2n = lc_m2+1;
  h1n = lc_h1+1;
  h2n = lc_h2+1;

  s2Index = clIndex;
  s1Index = 0;
  m2Index = 0;
  m1Index = 0;
  h2Index = 0;
  h1Index = 0;
  
  clIndex++;
  resynCnt++;
  if (clIndex >= 5) {
    clIndex = 0;
    lc_s2++;
    s2p = lc_s2;
    s2n = lc_s2 + 1;
    if (lc_s2 == 9) {
      s1trans = true;
      if (lc_s1 == 5) {
        m2trans = true;
        m2n = m2p + 1;
        if (lc_m2 == 9) {
          m1trans = true;
          m1n = m1p + 1;
          if (lc_m1 == 5) {
            h2trans = true;
            h2n = h2p + 1;
            if (lc_h2 == 9) {
              h1trans = true;
              h1n = h1p + 1;
            }
            if ((lc_h2 == 3) && (lc_h1 == 2)) {
              h2trans = true;
              h2n = 0;
              h1trans = true;
              h1n = 0;
            }          
          }
        }
      }
    } else {
    if (lc_s2 == 10) {
      lc_s2 = 0;
      s2p = 0;
      s2n = 1;
      lc_s1++;
      s1p = lc_s1;
      s1n = lc_s1 + 1;
      s1trans = false;
      m2trans = false;
      m1trans = false;
      h2trans = false;
      h1trans = false;
    }
    if (lc_s1 == 6) {
      lc_s1 = 0;
      s1p = 0;
      s1n = 0;
      lc_m2++;
      m2p = lc_m2;
      m2n = lc_m2 + 1;
    }
    if (lc_m2 == 10) {
      lc_m2 = 0;
      m2p = 0;
      m2n = 1;
      lc_m1++;
      m1p = lc_m1;
      m1n = lc_m1 + 1;
    }
    if (lc_m1 == 6) {
      lc_m1 = 0;
      m1p = 0;
      m1n = 1;
      lc_h2++;
      h2p = lc_h2;
      h2n = lc_h2 + 1;
    }
    if (lc_h2 == 10) {
      lc_h2 = 0;
      h2p = 0;
      h2n = 1;
      lc_h1++;
      h1p = lc_h1;
      h1n = lc_h1 + 1;
    }
    if ((lc_h1 == 2) && (lc_h2 == 4)) {
      lc_h2 = 0;
      h2p = 0;
      h2n = 1;
      lc_h1 = 0;
      h1p = 0;
      h1n = 1;
    }
    }
  }
  
  if (s2n > 9) s2n = 0;
  if (s1n > 5) s1n = 0;
  if (m2n > 9) m2n = 0;
  if (m1n > 5) m1n = 0;
  if (h2n > 9) h2n = 0;
  if (h1n > 2) h1n = 0;
  if ((h2n == 4) && (lc_h1 == 2)) h2n = 0;

  if (s1trans) s1Index = clIndex;
  if (m2trans) m2Index = clIndex;
  if (m1trans) m1Index = clIndex;
  if (h2trans) h2Index = clIndex;
  if (h1trans) h1Index = clIndex;

  // set digits
  setDigit(7, s2p, s2n, clIndex);
  setDigit(6, s1p, s1n, s1Index);
  setDigit(4, m2p, m2n, m2Index);
  setDigit(3, m1p, m1n, m1Index);
  setDigit(1, h2p, h2n, h2Index);
  setDigit(0, h1p, h1n, h1Index);
  
  // resync every few seconds; this allows for delays in the interval timer
  if ((resynCnt >= resyncIntv) && (clIndex == 4)) {
  	  resynCnt = 0;
  	  resyncIntv = Math.round(Math.random()*10 + 1) *5;

     date = new Date();
     date.setTime(new Date().getTime() - 1000);
	  hours = date.getHours();
	  minutes = date.getMinutes();
	  seconds = date.getSeconds();
	  
	  lc_h1 = (hours > 19 ? 2 : (hours > 9 ? 1 : 0));
	  lc_h2 = (hours % 10);
	  lc_m1 = Math.floor(minutes / 10);
	  lc_m2 = minutes % 10;
	  lc_s1 = Math.floor(seconds / 10);
	  lc_s2 = seconds % 10;
	  s1trans = false;
	  m2trans = false;
	  m1trans = false;
	  h2trans = false;
	  h1trans = false;  
	}  
}
function clockstart() {
  window.setInterval("clocktimer()", 200);
}