Env= [];
Env.IE_Version = new Number(((window.navigator.appVersion.split('; '))[1].split(' '))[1]);
Env.BarColor = ['#565857', '#565857', '#787878', '#787878'];
Env.ScrBarMinSize = 9;
Env.BtnColor = ['#787878', '#FF8500'];
Env.ScrTimeInterval = 40;
Env.ScrSkipTimeInterval = 200;

Bar = [];
Bar.last = 0;
Bar.tidList = [];
Bar.tmToSkipList = [];
Bar.YList = [];
Bar.YdifList = [];
Bar.BoxOnAction = [];
Bar.BarOnAction = [];
Bar.BtnOnAction = [];
Bar.onmousemove_slID = 0;

// public method
function Div_open (width, height) {
  Bar.last++;

  var opt = new Object();
  opt.width = ('undefined'!=typeof(width)) ? "width="+width: "";
  opt.height = ('undefined'!=typeof(height)) ? "height="+height: "";

  var openHTML = ""
    + "<table id=Div_Container_"+Bar.last+" border=0 cellpadding=0 cellspacing=0 "+opt.width+" "+opt.height+" style='TABLE-LAYOUT:fixed; "+opt.border+"'"
    + "  onmousewheel='Div_scrWheel("+Bar.last+", window.event)'"
    + "  onmousedown='Div_rlScrAll()'"
    + "  onmousemove='Div_mvScrBox("+Bar.last+", window.event)'"
    + ">"
    + "<tr>"
    + "<td id=Div_ContentBox_"+Bar.last+">"
    + "  <div id=Div_Content_"+Bar.last+" style='width:100%; height:100%; overflow:hidden'"
    + "    onscroll='Div_relocateScrBar("+Bar.last+")'"
    + "    onresize='Div_resizeScrBar("+Bar.last+")'"
    + "  >"
    + "\n";

  document.write(openHTML);
  return Bar.last;
}

function Div_close () {
  var closeHTML = ""
    + "  </div>"
    + "</td>"
    + "<td width=11 align=center bgcolor='#707070' id=Div_ScrBox_"+Bar.last+" style='display:none'>"
    + "  <table border=0 cellpadding=0 cellspacing=0 width=9 height=100% style='TABLE-LAYOUT:fixed'>"
    + "  <tr height=11>"
    + "    <td align=center' style='position:relative;'"
    + "      onmousedown='Div_prScrBtn("+Bar.last+", \"up\", window.event)'"
    + "      onmouseup='Div_rlScrBtn("+Bar.last+", \"up\", window.event)'"
    + "      onmouseout='Div_rlScrBtn("+Bar.last+", \"up\", window.event)'"
    + "      ondragstart='Div_cancelEvent(window.event)'"
    + "    >"      
    + "      <table width=9 height=9 border=0 cellpadding=0 cellspacing=0>"
    + "      <tr><td align=center style='background-color:"+Env.BtnColor[0]+"' onMouseOver=\"this.style.backgroundColor='"+Env.BtnColor[1]+"'\" onMouseOut=\"this.style.backgroundColor='"+Env.BtnColor[0]+"'\">"
    + "      <img src='images/ic_scroll_up.gif' width=9 height=9 style='position:absolute; top:1; left:0; z-index:4;'>"
    + "      "+mkBtn("Div_ScrBtn_upOff_"+Bar.last, "up", 2, Env.BtnColor[0])
    + "      "+mkBtn("Div_ScrBtn_upOn_"+Bar.last,  "up", 1, Env.BtnColor[1])
    + "     </td></tr></table>"
    + "    </td>"
    + "  </tr>"
    + "  <tr>"
    + "    <td align=center valign=middle bgcolor=#707070 style='position:relative; top:0; left:0; width:100%; height:100%;'>"
    + "      <img src='"+Env.ImgPrefix+"/img_blank.gif' width=100% height=100% style='position:absolute; top:0; left:0;'"
    + "        onmousedown='Div_prScrBox("+Bar.last+", window.event)'"
    + "        onmouseup='Div_rlScrBox("+Bar.last+", window.event)'"
    + "        onmouseout='Div_rlScrBox("+Bar.last+", window.event)'"
    + "        ondragstart='Div_cancelEvent(window.event)'"
    + "      >"
    + "      <div id=Div_ScrBar_Carrier_"+Bar.last+" style='position:absolute; top:0; left:0; width:100%; height:100%;'"
    + "        onmousedown='Div_prScrBar("+Bar.last+", window.event)'"
    + "        onmouseup='Div_rlScrBar("+Bar.last+", window.event)'"
    + "        onmouseout='Div_rlScrBar("+Bar.last+", window.event)'"
    + "        ondragstart='Div_cancelEvent(window.event)'"
    + "      >"
    + "        <img id=Div_ScrBar_Wrapper_"+Bar.last+" src='"+Env.ImgPrefix+"/img_blank.gif' width=100% height=100% style='position:absolute; top:0; left:0; z-index:4;"+((Env.IE_Version >= 6.0) ? " cursor:url("+Env.CurPrefix+"/hand.cur);" : "")+"'>"
    + "        "+mkBar("Div_ScrBarOff_"+Bar.last, 2, Env.BarColor[0], Env.BarColor[1])
    + "        "+mkBar("Div_ScrBarOn_"+Bar.last, 1, Env.BarColor[2], Env.BarColor[3])
    + "      </div>"
    + "    </td>"
    + "  </tr>"
    + "  <tr height=11>"
    + "    <td bgcolor='#707070' align='center' style='position:relative; top:0; left:0'"
    + "      onmousedown='Div_prScrBtn("+Bar.last+", \"down\", window.event)'"
    + "      onmouseup='Div_rlScrBtn("+Bar.last+", \"down\", window.event)'"
    + "      onmouseout='Div_rlScrBtn("+Bar.last+", \"down\", window.event)'"
    + "      ondragstart='Div_cancelEvent(window.event)'"
    + "    >"
    + "      <table width=9 height=9 border=0 cellpadding=0 cellspacing=0>"
    + "      <tr><td align=center style='background-color:"+Env.BtnColor[0]+"' onMouseOver=\"this.style.backgroundColor='"+Env.BtnColor[1]+"'\" onMouseOut=\"this.style.backgroundColor='"+Env.BtnColor[0]+"'\">"
    + "      <img id=Div_ScrBtn_Wrapper_"+Bar.last+" src='images/ic_scroll_down.gif' width=9 height=9 style='position:absolute; top:1; left:0; z-index:4;'>"
    + "      "+mkBtn("Div_ScrBtn_downOff_"+Bar.last, "down", 2, Env.BtnColor[0])
    + "      "+mkBtn("Div_ScrBtn_downOn_"+Bar.last,  "down", 1, Env.BtnColor[1])
    + "        </td></tr>" 
    + "    </table>"
    + "    </td>"
    + "  </tr>"
    + "  </table>"
    + "</td>"
    + "</tr>"
    + "</table>"
    + "\n";

  document.write(closeHTML);
  setTimeout("Div_resizeScrBar("+Bar.last+")", 200);
}

// private method
function Div_cancelEvent (event) {
  event.cancelBubble = true;
  event.returnValue = false;
}

function Div_isThisEventToBeCanceled (event) {
  if ('object' == typeof(event)) {
    switch (event.type) {
      case 'mousedown':
      case 'mouseup':
        if (!(event.button & 1))
          return true;
        break;
      case 'mouseout':
        if (Env.IE_Version >= 5.5)
          return true;
        break;
    }
  }
  return false;
}

function Div_scr (slID, dir) {
  document.all['Div_Content_'+slID].doScroll(dir);
}

function Div_scrTo (slID, X, Y) {
  document.all['Div_Content_'+slID].scrollLeft = X;
  document.all['Div_Content_'+slID].scrollTop = Y;
}

function Div_scrWheel (slID, event) {
  Div_rlScrAll(slID);

  for (var i=0; i < event.wheelDelta; i += 120) {
    Div_scr(slID, "up");
  }
  for (var i=0; i > event.wheelDelta; i -= 120) {
    Div_scr(slID, "down");
  }
}

function Div_scrRepeatedly (slID, dir, option) {
  if ('START' == option) {
    if (Bar.tidList[slID]) clearInterval(Bar.tidList[slID]);
    Bar.tidList[slID] = setInterval("Div_scrRepeatedly('"+slID+"', '"+dir+"', '')", Env.ScrTimeInterval);
    Bar.tmToSkipList[slID] = Env.ScrSkipTimeInterval;
  }
  else if ('STOP' == option) {
    if (Bar.tidList[slID]) clearInterval(Bar.tidList[slID]);
    Bar.tidList[slID] = '';
    return;
  }
  else if (Bar.tmToSkipList[slID] > 0) {
    Bar.tmToSkipList[slID] -= Env.ScrTimeInterval;
    return;
  }

  switch (dir) {
    case 'pageup':
      if ((Bar.YList[slID] - Bar.YdifList[slID]) < document.all['Div_ScrBar_Carrier_'+slID].offsetTop) {
        Div_scr(slID, dir);
      }
      break;
    case 'pagedown':
      if ((Bar.YList[slID] - Bar.YdifList[slID]) >= document.all['Div_ScrBar_Carrier_'+slID].offsetTop + document.all['Div_ScrBar_Carrier_'+slID].offsetHeight) {
        Div_scr(slID, dir);
      }
      break;
    case 'up':
    case 'down':
      Div_scr(slID, dir);
      break;
  }
}

function Div_resizeScrBar (slID) {
  var A = document.all['Div_Content_'+slID].offsetHeight;
  var B = document.all['Div_Content_'+slID].scrollHeight;
  var b = A - 16;
  var a = Math.max(Math.round(A * b / B), Env.ScrBarMinSize);

  if (A == 0 || B == 0) {
    setTimeout("Div_resizeScrBar("+slID+")", 200);
    return;
  }

  if (A < B) {
    document.all['Div_ScrBox_'+slID].style.display = 'block';
    if (Env.IE_Version < 5.5 && 'fixed'==document.all['Div_ScrBarOff_'+slID].style.tableLayout) {
      document.all['Div_ScrBarOff_'+slID].style.tableLayout = 'auto';
      document.all['Div_ScrBarOn_'+slID].style.tableLayout = 'auto';
    }
    document.all['Div_ScrBar_Carrier_'+slID].style.height = a;
    Div_relocateScrBar(slID);
  }
  else {
    // no scrollbar
    document.all['Div_ScrBox_'+slID].style.display = 'none';
    document.all['Div_ScrBox_'+slID].style.height = '100%';
  }
}

function Div_relocateScrBar (slID) {
  var A = document.all['Div_Content_'+slID].offsetHeight;
  var B = document.all['Div_Content_'+slID].scrollHeight;
  var C = document.all['Div_Content_'+slID].scrollTop;
  var b = A - 16;
  var a = Math.max(Math.round(A * b / B), Env.ScrBarMinSize);
  var c = Math.round(C * b / B);

  if (a + c >= b) {
    // the bottom of scroll
    document.all['Div_ScrBar_Carrier_'+slID].style.top = b - a;
  }
  else if (A < B) {
    document.all['Div_ScrBar_Carrier_'+slID].style.top = c;
  }
  else {
    // no scrollbar
  }
}

function Div_prScrBox (slID, event) {
  Div_cancelEvent(event);

  if (Div_isThisEventToBeCanceled(event))
    return;
  if (Bar.BoxOnAction[slID])
    return;

  Div_rlScrAll();

  Bar.BoxOnAction[slID] = true;
  Bar.YList[slID] = event.clientY;
  Bar.YdifList[slID] = event.clientY - event.offsetY;
  var dir = (event.offsetY < document.all['Div_ScrBar_Carrier_'+slID].offsetTop) ? 'pageup' : 'pagedown';
  Div_scrRepeatedly(slID, dir, 'START');
}

function Div_mvScrBox (slID, event) {
  Bar.YList[slID] = event.clientY;

  Div_mvScrBar(slID, event);
}

function Div_rlScrBox (slID, event) {
  if (Div_isThisEventToBeCanceled(event))
    return;

  Bar.BoxOnAction[slID] = false;
  Div_scrRepeatedly(slID, '', 'STOP');
}

function Div_prScrBar (slID, event) {
  Div_cancelEvent(event);

  if (Div_isThisEventToBeCanceled(event))
    return;
  if (Bar.BarOnAction[slID])
    return;

  Div_rlScrAll();
  Bar.BarOnAction[slID] = true;
  Div_mSB_Ydif = event.clientY - document.all['Div_ScrBar_Carrier_'+slID].offsetTop;
  document.all['Div_ScrBarOn_'+slID].style.zIndex = 3;
  if (Env.IE_Version >= 6.0)
    document.all["Div_ScrBar_Wrapper_"+slID].style.cursor = "url("+Env.CurPrefix+"/grabbed.cur)";

  Bar.onmousemove_slID = slID;
  document.attachEvent('onmousemove', Div_mvBody);
}

function Div_mvScrBar (slID, event) {
  if (!Bar.BarOnAction[slID])
    return;

  Div_scrTo(slID, 0, Math.round((event.clientY - Div_mSB_Ydif) * document.all['Div_Content_'+slID].scrollHeight / (document.all['Div_Content_'+slID].offsetHeight - 16)));
}

function Div_rlScrBar (slID, event) {
  if (Div_isThisEventToBeCanceled(event))
    return;

  Bar.BarOnAction[slID] = false;
  document.all['Div_ScrBarOn_'+slID].style.zIndex = 1;
  if (Env.IE_Version >= 6.0)
    document.all["Div_ScrBar_Wrapper_"+slID].style.cursor = "url("+Env.CurPrefix+"/hand.cur)";

  Bar.onmousemove_slID = 0;
  document.detachEvent('onmousemove', Div_mvBody);
}

function Div_mvBody () {
  Div_mvScrBar(Bar.onmousemove_slID, window.event);
}

function Div_prScrBtn (slID, dir, event) {
  Div_cancelEvent(event);

  Div_rlScrAll();

  Bar.BtnOnAction[slID] = true;
  Div_scrRepeatedly(slID, dir, "START");
  document.all['Div_ScrBtn_'+dir+'On_'+slID].style.zIndex = 3;
}

function Div_rlScrBtn (slID, dir, event) {
  if (Div_isThisEventToBeCanceled(event))
    return;

  Bar.BtnOnAction[slID] = false;
  Div_scrRepeatedly(slID, "", "STOP");
  document.all['Div_ScrBtn_'+dir+'On_'+slID].style.zIndex = 1;
}

function Div_rlScrAll (except) {
  for (var i=1; i <= Bar.last; i++) {
    if (i == except)
      continue;

    if ('object'==typeof(document.all['Div_Container_'+i])) {
      if (Bar.BoxOnAction[i])
        Div_rlScrBox(i);
      if (Bar.BarOnAction[i])
        Div_rlScrBar(i);
      if (Bar.BtnOnAction[i]) {
        Div_rlScrBtn(i, "up");
        Div_rlScrBtn(i, "down");
      }
    }
    else alert('no object - '+i);
  }
}

function mkBar (id, zIndex, borderColor, backgroundColor) {
  var strTABLE = ""
	+ "<table id="+id+" border=0 cellpadding=0 cellspacing=0 width=100% height=100% style='table-layout:fixed; z-index:"+zIndex+"; position:absolute; top:0; left:0;'>\n"
    + "<tr><td style='border: 1px solid "+borderColor+";background-color:"+backgroundColor+"'>&nbsp;</td></tr>"
    + "</table>";
  return strTABLE;
}

function mkBtn (id, dir, zIndex, backgroundColor) {
	var strTABLE = ""
	+ "<table id="+id+" width=1 height=0 border=0 cellpadding=0 cellspacing=0 style='table-layout:fixed; z-index:"+zIndex+"; position:absolute; top:1; left:1;'>"
    + "  <tr><td style='background-color:"+backgroundColor+"'></td></tr>"
	+ "</table>";
  return strTABLE;
}
