var tmmClock;
mizuyari.addOnLoadEvent(tmmInit);

function tmmInit() {
 tmmClock = new imgClock("tmmClock");
}

function imgClock(name) {
 this.self = "window." + name;
 this.imgs = new Array();
 this.clockTimer = null;
 this.preImg();
 this.createClock();
}

imgClock.prototype = {

 preImg : function() {
  for (var i=0; i<10; i++) {
   this.imgs[i] = new Image();
   this.imgs[i].src = '/shared/images/c/' + i + '.gif';
   this.imgs[i].alt = i;
  }
  this.imgs[10] = new Image();
  this.imgs[10].src = '/shared/images/c/colon.gif';
  this.imgs[10].alt = ':';
 },

 createClock : function() {
  var now = new Date();
  var jp_tz = this.getNowTime(now, 540);
  var clock_html = '<img src="/shared/images/c/time.gif" alt="TIME ">';
  for (var i=0; i<jp_tz.length; i++) {
   var str = jp_tz.substr(i,1);
   var imgId = str;
   if (str == ":") imgId = "10";
   clock_html += '<img src="'+this.imgs[imgId].src+'" alt="'+this.imgs[imgId].alt+'" id="clock-time'+i+'" />';
  }
  document.getElementById("clock").innerHTML = clock_html;
  this.clockTimer = setTimeout(this.self+'.updateClock()', 500);
 },

 updateClock : function() {
  if (this.clockTimer) clearTimeout(this.clockTimer);
  var now = new Date();
  var jp_tz = this.getNowTime(now, 540);
  for (var i=0; i<jp_tz.length; i++) {
   var tmpElmt = miz$("clock-time"+i);
   var str = jp_tz.substr(i,1);
   var imgId = str;
   if (str == ":") imgId = "10";
   tmpElmt.src = this.imgs[imgId].src;
   tmpElmt.alt = this.imgs[imgId].alt;
  }
  this.clockTimer = setTimeout(this.self+'.updateClock()', 500);
 },

 getNowTime : function(now, tz) {
  var hh, mm, ss;
  var t = new Date();
  t.setTime(now.getTime() + ((now.getTimezoneOffset() + tz) * 60 * 1000));
  hh = t.getHours();
  mm = t.getMinutes();
  ss = t.getSeconds();
  if (hh < 10)  hh = '0' + hh;
  if (mm < 10)  mm = '0' + mm;
  if (ss < 10)  ss = '0' + ss;
  return hh + ":" + mm + ":" + ss;
 }

}