Calendar.prototype.draw = function()

in saga-web/src/main/resources/static/js/date.js [166:351]


Calendar.prototype.draw = function () {
  calendar = this;

  var mvAry = [];
  mvAry[mvAry.length] = ' <div name="calendarForm" style="margin: 0px;">';
  mvAry[mvAry.length] = '    <table width="100%" border="0" cellpadding="0" cellspacing="1">';
  mvAry[mvAry.length] = '      <tr>';
  mvAry[mvAry.length] = '        <th align="left" width="1%"><input style="border: 1px solid '
      + calendar.colors["input_border"]
      + ';background-color:'
      + calendar.colors["input_bg"]
      + ';width:16px;height:20px;" name="prevMonth" type="button" id="prevMonth" value="<" /></th>';
  mvAry[mvAry.length] = '        <th align="center" width="98%" nowrap="nowrap"><select name="calendarYear" id="calendarYear" style="font-size:12px;"></select><select name="calendarMonth" id="calendarMonth" style="font-size:12px;"></select></th>';
  mvAry[mvAry.length] = '        <th align="right" width="1%"><input style="border: 1px solid '
      + calendar.colors["input_border"]
      + ';background-color:'
      + calendar.colors["input_bg"]
      + ';width:16px;height:20px;" name="nextMonth" type="button" id="nextMonth" value=">" /></th>';
  mvAry[mvAry.length] = '      </tr>';
  mvAry[mvAry.length] = '    </table>';
  mvAry[mvAry.length] = '    <table id="calendarTable" width="100%" style="border:0px solid #CCCCCC;background-color:#FFFFFF" border="0" cellpadding="3" cellspacing="1">';
  mvAry[mvAry.length] = '      <tr>';
  for (var i = 0; i < 7; i++) {
    mvAry[mvAry.length] = '      <th style="font-weight:normal;background-color:'
        + calendar.colors["tr_bg"]
        + ';color:'
        + calendar.colors["tr_word"]
        + ';">'
        + Calendar.language["weeks"][this.lang][i] + '</th>';
  }
  mvAry[mvAry.length] = '      </tr>';
  for (var i = 0; i < 6; i++) {
    mvAry[mvAry.length] = '    <tr align="center">';
    for (var j = 0; j < 7; j++) {
      if (j == 0) {
        mvAry[mvAry.length] = ' <td style="cursor:default;color:'
            + calendar.colors["sun_word"] + ';"></td>';
      } else if (j == 6) {
        mvAry[mvAry.length] = ' <td style="cursor:default;color:'
            + calendar.colors["sat_word"] + ';"></td>';
      } else {
        mvAry[mvAry.length] = ' <td style="cursor:default;"></td>';
      }
    }
    mvAry[mvAry.length] = '    </tr>';
  }

  mvAry[mvAry.length] = '      <tr align="center" style="font-size:12px;">';
  mvAry[mvAry.length] = '        <td name="abort" id="abort" colspan="1" style="cursor:default;">'
      + Calendar.language["abort"][this.lang] + '</td>';
  mvAry[mvAry.length] = '        <td colspan="6"><select name="calendarHour" id="calendarHour"></select>';
  mvAry[mvAry.length] = ':<select name="calendarMinute" id="calendarMinute"></select>';
  mvAry[mvAry.length] = ':<select name="calendarSecond" id="calendarSecond"></select>';
  mvAry[mvAry.length] = '      </td></tr>';

  mvAry[mvAry.length] = '      <tr style="background-color:'
      + calendar.colors["input_bg"] + ';">';
  mvAry[mvAry.length] = '        <th colspan="2"><input name="calendarClear" type="button" id="calendarClear" value="'
      + Calendar.language["clear"][this.lang]
      + '" style="border: 1px solid '
      + calendar.colors["input_border"]
      + ';background-color:'
      + calendar.colors["input_bg"]
      + ';width:100%;height:20px;font-size:12px;"/></th>';
  mvAry[mvAry.length] = '        <th colspan="3"><input name="calendarToday" type="button" id="calendarToday" value="'
      + Calendar.language["today"][this.lang]
      + '" style="border: 1px solid '
      + calendar.colors["input_border"]
      + ';background-color:'
      + calendar.colors["input_bg"]
      + ';width:100%;height:20px;font-size:12px;"/></th>';
  mvAry[mvAry.length] = '        <th colspan="2"><input name="calendarClose" type="button" id="calendarClose" value="'
      + Calendar.language["close"][this.lang]
      + '" style="border: 1px solid '
      + calendar.colors["input_border"]
      + ';background-color:'
      + calendar.colors["input_bg"]
      + ';width:100%;height:20px;font-size:12px;"/></th>';
  mvAry[mvAry.length] = '      </tr>';
  mvAry[mvAry.length] = '    </table>';
  mvAry[mvAry.length] = ' </div>';
  this.panel.innerHTML = mvAry.join("");

  var obj = this.getElementById("prevMonth");
  obj.onclick = function () {
    calendar.goPrevMonth(calendar);
  }
  obj.onblur = function () {
    calendar.onblur();
  }
  this.prevMonth = obj;

  obj = this.getElementById("nextMonth");
  obj.onclick = function () {
    calendar.goNextMonth(calendar);
  }
  obj.onblur = function () {
    calendar.onblur();
  }
  this.nextMonth = obj;

  obj = this.getElementById("calendarClear");
  obj.onclick = function () {
    calendar.dateControl.value = "";
    calendar.hide();
  }
  this.calendarClear = obj;

  obj = this.getElementById("calendarClose");
  obj.onclick = function () {
    calendar.hide();
  }
  this.calendarClose = obj;

  obj = this.getElementById("calendarYear");
  obj.onchange = function () {
    calendar.update(calendar);
  }
  obj.onblur = function () {
    calendar.onblur();
  }
  this.calendarYear = obj;

  obj = this.getElementById("calendarMonth");
  with (obj) {
    onchange = function () {
      calendar.update(calendar);
    }
    onblur = function () {
      calendar.onblur();
    }
  }
  this.calendarMonth = obj;

  obj = this.getElementById("calendarHour");
  with (obj) {
    length = 0;
    for (var i = 0; i < 24; i++) {
      if (i < 10) {
        options[length] = new Option("0" + i, "0" + i);
      } else {
        options[length] = new Option(i, i);
      }
    }
  }
  this.calendarHour = obj;

  obj = this.getElementById("calendarMinute");
  with (obj) {
    length = 0;
    for (var i = 0; i < 60; i++) {
      if (i < 10) {
        options[length] = new Option("0" + i, "0" + i);
      } else {
        options[length] = new Option(i, i);
      }
    }
  }
  this.calendarMinute = obj;

  obj = this.getElementById("calendarSecond");
  with (obj) {
    length = 0;
    for (var i = 0; i < 60; i++) {
      if (i < 10) {
        options[length] = new Option("0" + i, "0" + i);
      } else {
        options[length] = new Option(i, i);
      }
    }
  }
  this.calendarSecond = obj;

  obj = this.getElementById("calendarToday");
  obj.onclick = function () {
    var today = new Date();
    calendar.date = today;
    calendar.year = today.getFullYear();
    calendar.month = today.getMonth();
    calendar.changeSelect();
    calendar.bindData();
    calendar.dateControl.value = today.format(calendar.dateFormatStyle);
    calendar.hide();
  }
  this.calendarToday = obj;
}