//  ---------------------------------------------------------------------------
function setMaxCoords () {
    window.onresize = function () {showSize()};
};

//  ---------------------------------------------------------------------------
function doRightClick(e) {
  var rightclick;
  if (!e) var e = window.event;
  if (e.which)
    rightclick = (e.which == 3);
  else
    if (e.button)
      rightclick = (e.button == 2);
  alert(rightclick ? 'right click' : 'left click');
};

  //  ---------------------------------------------------------------------------
cancelBubble = function (e) {
  var evt = BrowserDetect.browser=='explorer' ? window.event : e;
  if (!evt) return;
/*  if (BrowserDetect.browser=='explorer')
    alert ('browser='+BrowserDetect.browser+', event='+window.Event);
  else
    alert ('browser='+BrowserDetect.browser+', event='+e);
  alert ('browser='+BrowserDetect.browser+', event='+evt);*/
  if (!evt.cancelBubble) return
  evt.cancelBubble = true;
};

//  -------------------------------------------------------------------------->
Container = function (tagType) {
  tagType = tagType==undefined ? 'div' : tagType;
  this.container = document.createElement (tagType);
//  alert ('new '+this.container.nodeName+' created');
  var node = this;
  this.container.allDataTypes = new Array ('boolean', 'string', 'integer', 'float', 'date', 'time', 'datetime');
  this.container.dataType = 'string';
  this.container.onfocus  = function (e) {e=fixEvent(e); node.container.preAction(node); cancelBubble(e)};
  this.container.onblur   = function (e) {e=fixEvent(e); node.container.postAction(node); cancelBubble(e)};
  this.container.onchange = function (e) {e=fixEvent(e); node.container.onchangeAction(node); cancelBubble(e)};
  this.container.onclick  = function (e) {e=fixEvent(e); node.container.onclickAction(node); cancelBubble(e)};
  this.container.ondblclick=function (e) {e=fixEvent(e); node.container.ondblclickAction(node); cancelBubble(e)}; 

  //  -------------------------------------------------------------------------->
  this.getType = function() {
    return this.dataType;
  };

  //  -------------------------------------------------------------------------->
  this.container.setType = function(dataType) {
//    alert (this.id);
    this.dataType = dataType;
    return this;
  };

  //  -------------------------------------------------------------------------->
  this.getRange = function() {
    return this.range;
  };

  //  -------------------------------------------------------------------------->
  this.setRange = function(range) {
    this.range = range;
    return this;
  };

  //  -------------------------------------------------------------------------->
  this.getFormat = function() {
    return this.format;
  };

  //  -------------------------------------------------------------------------->
  this.setFormat = function(format) {
    this.format = format;
    return this;
  };

  //  -------------------------------------------------------------------------->
  this.getContainer = function() {
    return this.container;
  };

  //  -------------------------------------------------------------------------->
  this.container.autoCorrect = function(node) {
    return node;
  };

  //  -------------------------------------------------------------------------->
  this.container.hasErrChildNodes = function(node) {
    if (node.container.hasChildNodes())
      for (var i=0; i < node.container.childNodes.length; i++)
        if (node.container.childNodes[i].hasError)
          return true;
    return false;
  };

  //  -------------------------------------------------------------------------->
  this.container.isValid = function(node) {
//    alert (this.id+'.isValid: '+node.container.id+' is '+node.container.value+' of '+node.container.dataType);
    node.container.hasError = false;
    if (this.hasErrChildNodes(node))
      return false;
    var value = node.container.value;
    switch (commandNoOf (node.container.dataType, this.allDataTypes)) {
      case 0: // 'boolean': 
        node.container.hasError = false;
        break;
      case 1:  // 'string': 
        node.container.hasError = false;
        break;
      case 2:  // 'integer': 
        node.container.hasError = parseInt(value, 10) === NaN ;
        break;
      case 3:  // 'float': 
//        alert (this.id+'.isValid: '+node.container.id+' is '+node.container.value+' of '+node.container.dataType+' == '+this.allDataTypes[3]);
//        alert ('parseFloat('+value+', 10): '+parseFloat(value, 10));
        node.container.hasError = isNaN (parseFloat(value, 10));
        break;
      case 4:  // 'date': 
        node.container.hasError = !(new Date().fromSting(value));
        break;
      case 5:  // 'time': 
        node.container.hasError = !(new Date().fromSting(value));
        break;
      case 6:  //  'datetime': 
        node.container.hasError = !(new Date().fromSting(value));
        break;
      default:		
        alert ('### isValid: no type found');
        exit;
      }
    return !node.container.hasError;
  };

  //  -------------------------------------------------------------------------->
  this.container.preAction = function() {
//    alert (this.id+'.preAction');
    return this.container;
  };

  //  -------------------------------------------------------------------------->
  this.container.postAction = function() {
//    alert (this.id+'.postAction');
    return this.container;
  };

  //  -------------------------------------------------------------------------->
  this.container.handleError = function() {
    if (!this.hasErrChildNodes(node))
      alert ('###  error: '+this.id+' - please correct your input');
    return this.container;
  };

  //  -------------------------------------------------------------------------->
  this.container.onclickAction = function(node) {
//    alert (this.id+'.onclickAction');
    return this.container;
  };

  //  -------------------------------------------------------------------------->
  this.container.ondblclickAction = function(node) {
//    alert (this.id+'.ondblclickAction');
    return this.container;
  };

  //  -------------------------------------------------------------------------->
  this.container.onchangeAction = function(node) {
//    alert (this.id+'.onchangeAction');
    node.getContainer().autoCorrect(node);
    if (node.getContainer().isValid(node))
      node.getContainer().postAction(); 
    else
      node.getContainer().handleError();
    return this.container;
  };

  //  -------------------------------------------------------------------------->
  this.container.onfocusAction = function(node) {
    alert (this.id+'.onfocusAction');
    return this.container;
  };

  //  ---------------------------------------------------------------------------
    this.container.toggleHeight = function (node, stopLevel) {
//    alert ('toggleHeight: '+node.id);
    if (!node.firstChild) return this;
    node.isPanelVisible = node.isPanelVisible==undefined ?  true : node.isPanelVisible;
    stopLevel = stopLevel==undefined ?  0 : stopLevel;
    var childNode = null;
    var from = node.firstChild.className == 'panelHeader'? 1 : 0;
    for (var i=from; i < node.childNodes.length; i++) {
      childNode = node.childNodes[i];
//      alert (childNode.nodeName+', '+childNode.id);
      if (childNode.toggleHeight) {
        if (stopLevel < 1)
          childNode.toggleHeight (childNode, stopLevel+1);
        else
          childNode.style.display = node.isPanelVisible ? 'none' : '';
      } else
        if (childNode.style)
          childNode.style.display = node.isPanelVisible ? 'none' : '';
        else
          this.style.display = node.isPanelVisible ? 'none' : '';
      }
    node.isPanelVisible = !node.isPanelVisible;
    return this;
  };

  //  -------------------------------------------------------------------------->
  return this.container;
};

//  -------------------------------------------------------------------------->
Panel = function (id, style) {
  this.container = new Container();
  this.container.id = 'panel' + id;
  this.container.className = style==undefined ? 'panel' : style;
  this.container.ondblclickAction = function () {this.toggleHeight(this)};
//  this.container.setToolTipText("");
//  alert ('Panel '+this.container.id+' created, style='+this.container.className);

  this.container.appendHeader = function (text) {
    var div = document.createElement ('div');
    div.className = 'panelHeader';
    div.appendChild (document.createTextNode(text));
    this.appendChild (div);
    return this;
  };

  this.container.appendListItem = function (text) {
    var ul = this.findNodeByType ('ul');
    var li = document.createElement ('li');
    li.appendChild (document.createTextNode(text));
    ul.appendChild (li);
    return this;
  };

  this.container.findNodeByType = function (type) {
    if (this.hasChildNodes())
      for (var i=0; i < this.childNodes.length; i++)
        if (this.childNodes[i].nodeName.toLowerCase() == type) return this.childNodes[i];
    var node = document.createElement(type);
    this.appendChild (node);
    return node;
  };

  return this.container;  
};

Panel.prototype = new Container ();

//  -------------------------------------------------------------------------->
Header = function (id, text, style) {
  this.container = new Container();
  this.container.id = 'header' + id;
  this.container.className = style==undefined ? 'header' : style;
  var span = document.createElement(span);
  span.appendChild (document.createTextNode(text));
  this.container.appendChild (span);
//  alert ('Header '+this.container.id+' created, style='+this.container.className+', text='+text);

  this.container.saveText = function () {
    this.savedText = this.firstChild.firstChild.nodeValue;
//    alert ('saved Text='+this.savedText);
    return this;
  };

  this.container.restoreText = function () {
    if (!this.savedText) return this;
    this.firstChild.firstChild.nodeValue = this.savedText;
//    alert ('restored Text='+this.firstChild.firstChild.nodeValue);
    return this;
  };

  this.container.setText = function (text) {
    this.firstChild.firstChild.nodeValue = text;
//    alert ('set Text='+this.firstChild.firstChild.nodeValue);
    return this;
  };

  return this.container;  
};

Header.prototype = new Container ();

//  -------------------------------------------------------------------------->
Field = function  (id, text, value, style) {
  this.container = new Container();
  this.container.id = 'field'+id;
  this.container.className = style==undefined ? 'field' : style;
  this.container.appendChild (new Label (id,  text, style));  
  this.container.appendChild (new Input (id, value, style));
//  alert ('Field '+this.container.id+' created, style='+this.container.className);
  this.container.getInput = function  () {
    return this.lastChild;
  };
  return this.container;
};
  
Field.prototype = new Container ();

//  -------------------------------------------------------------------------->
Label = function (id, text, style) {
  this.container = new Container();
  this.container.appendChild (document.createTextNode(text));
  this.container.id = 'label'+id;
  this.container.className = style==undefined ? 'label' : style;
  return this.container;
}; 

Label.prototype = new Container ();

//  -------------------------------------------------------------------------->
Input = function (id, value, style) {
  this.container = new Container('input');
  this.container.id = 'input'+id;
  this.container.className = style==undefined ? 'input' : style;
  this.container.value = value;
  return this.container;
}; 

Input.prototype = new Container ();

//  ----------------------------------------------------------------------------
Button = function(id, text, action, style) {
  this.container = new Container ('button');
  this.container.id = 'button'+id;
  this.container.className = style==undefined ? 'button' : style;
  this.container.value = text;
  this.container.appendChild (document.createTextNode(text));
  this.container.onclick = function (e) {action(); cancelBubble(e)};
  return this.container;
};

Button.prototype = new Container ();

//  -------------------------------------------------------------------------->
Combo = function  (id, text, selected, selectSize, style) {
  this.container = new Container ('form');
  this.container.appendChild (document.createTextNode(id));
  this.container.id = id+'combo';
  this.container.className = style==undefined ? 'combo' : style;
  var select = document.createElement ('select');
  select.id = 'selection';
  select.size = selectSize;
  for (var i=0; i < text.length; i++) {
    var option = document.createElement ('option');
    option.value = "#";
    option.appendChild (document.createTextNode(text[i]));
    option.className = 'smalltext';
    if (i == selected) option.selected="selected";
    select.appendChild (option);
  }
  this.container.appendChild (select);
  return this.container;
};

Combo.prototype = new Container ();