/* --------------------------------------------------------------------------------------
 * selectbox.js
 * version 1.00
 * Required common.js ver1.40 later
-------------------------------------------------------------------------------------- */
function fncSelectBox(targetIds, opts) {
  if (!VCOMN.funcSelectBoxFunc) {
    VCOMN.funcSelectBoxFunc = [];
  }
  VCOMN.funcSelectBoxFunc[VCOMN.funcSelectBoxFunc.length] = new VCOMN.SelectBox(targetIds, opts);
}

VCOMN.SelectBox = function () {
  this.initialize.apply(this, arguments);
}

VCOMN.SelectBox.prototype = {
  ROOT_ID: 'contentsArea',
  OPEN_CLASS: 'open',
  CURRENT_CLASS: 'current',
  SELECTBOX_CLASS: 'selectbox-wrapper',

  initialize: function (targetIds, opts) {
    opts = opts || {};
    this.opts = {};
    if (opts.menuList) {
      this.opts.menuList = opts.menuList;
    }
    this._initSelectBox(targetIds);
  },
  _initSelectBox: function (targetIds) {
    this.selects = [];
    var root = document.getElementById(this.ROOT_ID);
    for (var i = 0; i < targetIds.length; i++) {
      var parent = document.getElementById(targetIds[i]);
      if (!parent) continue;
      var p = parent.getElementsByTagName('P');
      if (!p || !p.length) continue;
      p = p[0];
      var width = parent.offsetWidth;
      var elem = document.createElement('DIV');
      var input = document.createElement('INPUT');
      elem.id = parent.id + '_selectbox_menu';
      input.type = 'text';
      input.setAttribute('readOnly', 'true');
      input.style.height = '0px';
      input.style.border = '0pt none';
      input.style.background = 'transparent';
      input.style.position = 'absolute';
      input.style.cursor = 'default';
      parent.appendChild(input);
      var span = p.getElementsByTagName('SPAN');
      if (!span || !span.length) {
        span = p.getElementsByTagName('A');
        if (!span || !span.length) continue;
        span[0].onclick = function () {return false;};
      }
      span = span[0];
      var select = parent.getElementsByTagName('UL');
      if (!select || !select.length) continue;
      select = select[0];
      var selectHeight = select.offsetHeight;
      var lists = select.getElementsByTagName('LI');
      var list;
      for (var j = 0; j < lists.length; j++) {
        list = lists[j];
        VCOMN.EventObserve(list, 'mouseover', VCOMN.bindFunc(this.onListMouseOver, this, list), false);
        VCOMN.EventObserve(list, 'mouseout', VCOMN.bindFunc(this.onListMouseOut, this, list), false);
        VCOMN.EventObserve(list, 'click', VCOMN.bindFunc(this.onClickList, this, list, elem), false);
      }
      elem.appendChild(select);
      elem.className = this.SELECTBOX_CLASS;
      var offsetParent = VCOMN.cumulativeOffset(parent);
      var offsetRoot = VCOMN.cumulativeOffset(root);
      elem.style.left = (offsetParent[0] - offsetRoot[0]) + 'px';
      elem.style.top = (offsetParent[1] - offsetRoot[1] + parent.offsetHeight) + 'px';
      elem.style.width = width + 'px';
      root.appendChild(elem);
      if (elem.offsetHeight > selectHeight) {
        elem.style.height = (selectHeight + 6) + 'px';
        elem.style.overflow = 'visible';
      }
      elem.style.display = 'none';
      VCOMN.addClass(span, this.OPEN_CLASS);
      VCOMN.EventObserve(input, 'blur', VCOMN.bindFunc(this.onBlurControl, this, elem, input, span), false);
      VCOMN.EventObserve(span, 'click', VCOMN.bindFunc(this.onClickControl, this, elem, input), false);
      VCOMN.EventObserve(span, 'mouseover', VCOMN.bindFunc(this.onElementMouseOver, this, span), false);
      VCOMN.EventObserve(span, 'mouseout', VCOMN.bindFunc(this.onElementMouseOut, this, span), false);
      VCOMN.EventObserve(elem, 'mouseover', VCOMN.bindFunc(this.onElementMouseOver, this, elem), false);
      VCOMN.EventObserve(elem, 'mouseout', VCOMN.bindFunc(this.onElementMouseOut, this, elem), false);
      this.selects[this.selects.length] = elem;
    }
  },
  onClickControl: function (targetElem, inputElem) {
    if (targetElem.style.display == 'none') {
      targetElem.style.display = 'block';
    }
    inputElem.focus();
    for (var i = 0; i < this.selects.length; i++) {
      if (this.selects[i] === targetElem) continue;
      this.selects[i].style.display = 'none';
    }
    for (var i = 0; i < VCOMN.funcSelectBoxFunc.length; i++) {
      if (VCOMN.funcSelectBoxFunc[i] !== this) {
        VCOMN.funcSelectBoxFunc[i].allBoxClose();
      }
    }
  },
  onClickList: function (targetElem, parentElem) {
    var atag = targetElem.getElementsByTagName('A');
    if (atag) {
      location.href = atag[0].href;
    }
    parentElem.style.display = 'none';
  },
  onListMouseOver: function (targetElem) {
    VCOMN.addClass(targetElem, this.CURRENT_CLASS);
  },
  onListMouseOut: function (targetElem) {
    VCOMN.removeClass(targetElem, this.CURRENT_CLASS);
  },
  onElementMouseOver: function (targetElem) {
    targetElem._ismouseover = true;
  },
  onElementMouseOut: function (targetElem, inputElem) {
    targetElem._ismouseover = false;
  },
  onBlurControl: function (targetElem, inputElem, parent) {
    if (targetElem.style.display == 'none') return;
    if (parent._ismouseover) return;
    if (targetElem._ismouseover) {
      inputElem.focus();
      return;
    }
    var lists = targetElem.getElementsByTagName('LI');
    for (var j = 0; j < lists.length; j++) {
      if (VCOMN.hasClass(lists[j], this.CURRENT_CLASS)) {
        inputElem.focus();
        return;
      }
    }
    this.hideElement(targetElem);
  },
  hideElement: function (targetElem) {
    targetElem.style.display = 'none';
  },
  allBoxClose: function () {
    for (var i = 0; i < this.selects.length; i++) {
      this.selects[i].style.display = 'none';
    }
  }
}