/*
 DynEl.js
*/

/* 
  Constructor for DynEl class
*/

function DynEl(window, id, body, left, top, width)
{
  this.window = window;
  this.id = id;
  this.body = body;
  //CCS-P Style Sheet
  var d = window.document;
  d.writeln("<style type='text/css'>");
  d.writeln("#" + id + " {position: absolute;");
  if(left){
    d.write("left:" + left + ";");
  }
  if(top){
    d.write("top:" + top + ";");
  }
  if(width){
    d.write("width:" + width + ";");
  }
  d.writeln("}");
  d.writeln("</style>");
}

/*
 DOM3 methods
*/
if(document.getElementById)
{ 
  /*
    Output the element itself.  Must be called first before 
    other methods
  */
  DynEl.prototype.output = function(){
    var d = this.window.document;

    //Output the element
    d.writeln("<div id='" + this.id + "'>");
    d.writeln(this.body);
    d.writeln("</div>");
    
    //Save a reference to the layer object
    this.element = document.getElementById(this.id);
    this.style = this.element.style;    
  }
  
  //Modify the element
  DynEl.prototype.moveTo = function(x, y)
  {
    this.style.left = x;
    this.style.top = y;
  }
  DynEl.prototype.moveBy = function(x, y)
  {
    this.style.left += x;
    this.style.top += y;
  }
  DynEl.prototype.show = function()
  {
    this.style.visibility = "visible";
  }
  DynEl.prototype.hide = function()
  {
    this.style.visibility = "hidden";
  }
  DynEl.prototype.setStackingOrder = function(z)
  {
    this.style.zIndex = z;
  }
  DynEl.prototype.setBgColor = function(color)
  {
    this.style.backgroundColor = color;
  }
  DynEl.prototype.setBgImage = function(image)
  {
    this.style.backgroundImage = image;
  }

  //Query the element
  DynEl.prototype.getX = function()
  {
    return parseInt(this.style.left);
  }
  DynEl.prototype.getY = function()
  {
    return parseInt(this.style.top);
  }
  DynEl.prototype.getWidth = function()
  {
    return parseInt(this.style.width);
  }
  DynEl.prototype.getHeight = function()
  {
    return parseInt(this.style.height);
  }
  DynEl.prototype.getStackingOrder = function()
  {
    return parseInt(this.style.zIndex);
  }
  DynEl.prototype.isVisible = function()
  {
    return (this.style.visibility == "show");
  }
  
  
  /*
    Dynamically change the contents of the element
    Then arg(s) should be HTML strings which become the new body
  */
  DynEl.prototype.setBody = function()
  {
    var body = "";
    for(var i = 0; i < arguments.length; i++){
      body += arguments[i] + "\n";
    }
    this.element.innerHTML = body;
  }
  
}
/*
  Navagator < 6 Methods
*/
else if(document.layers)
{

  /*
    Output the element itself.  Must be called first before 
    other methods
  */
  DynEl.prototype.output = function()
  {
    var d = this.window.document;
    
    //Output the element
    d.writeln("<div id='" + this.id + "'>");
    d.writeln(this.body);
    d.writeln("</div>");
    
    //Save a reference to the layer object
    this.layer = d[this.id];
  }
  
  
  //Modify the element
  DynEl.prototype.moveTo = function(x, y)
  {
    this.layer.moveTo(x, y);
  }
  DynEl.prototype.moveBy = function(x, y)
  {
    this.layer.moveBy(x, y);
  }
  DynEl.prototype.show = function()
  {
    this.layer.visibility = "show";
  }
  DynEl.prototype.hide = function()
  {
    this.layer.visibility = "hide";
  }
  DynEl.prototype.setStackingOrder = function(z)
  {
    this.layer.zIndex = z;
  }
  DynEl.prototype.setBgColor = function(color)
  {
    this.layer.bgColor = color;
  }
  DynEl.prototype.setBgImage = function(image)
  {
    this.layer.background.src = image;
  }

  
  //Query the element
  DynEl.prototype.getX = function()
  {
    return parseInt(this.layer.left);
  }
  DynEl.prototype.getY = function(){
    return parseInt(this.layer.top);
  }
  DynEl.prototype.getWidth = function()
  {
    return parseInt(this.layer.width);
  }
  DynEl.prototype.getHeight = function()
  {
    return parseInt(this.layer.height);
  }
  DynEl.prototype.getStackingOrder = function()
  {
    return parseInt(this.layer.zIndex);
  }
  DynEl.prototype.isVisible = function()
  {
    return this.layer.visibility == "show";
  }
  
  /*
    Dynamically change the contents of the element
    Then arg(s) should be HTML strings which become the new body
  */
  DynEl.prototype.setBody = function()
  {
    for(var i = 0; i < arguments.length; i++){
      this.layer.document.writeln(arguments[i]);
    }
    this.layer.document.close();
  }
  
}
/*
  Old IE Methods
*/
else if(document.all)
{

  /*
    Output the element itself.  Must be called first before 
    other methods
  */
  DynEl.prototype.output = function(){
    var d = this.window.document;

    //Output the element
    d.writeln("<div id='" + this.id + "'>");
    d.writeln(this.body);
    d.writeln("</div>");
    
    //Save a reference to the layer object
    this.element = d.all[this.id];
    this.style = this.element.style;    
  }
  
  //Modify the element
  DynEl.prototype.moveTo = function(x, y)
  {
    this.style.pixelLeft = x;
    this.style.pixelTop = y;
  }
  DynEl.prototype.moveBy = function(x, y)
  {
    this.style.pixelLeft += x;
    this.style.pixelTop += y;
  }
  DynEl.prototype.show = function()
  {
    this.style.visibility = "visible";
  }
  DynEl.prototype.hide = function()
  {
    this.style.visibility = "hidden";
  }
  DynEl.prototype.setStackingOrder = function(z)
  {
    this.style.zIndex = z;
  }
  DynEl.prototype.setBgColor = function(color)
  {
    this.style.backgroundColor = color;
  }
  DynEl.prototype.setBgImage = function(image)
  {
    this.style.backgroundImage = image;
  }

  //Query the element
  DynEl.prototype.getX = function()
  {
    return parseInt(this.style.pixelLeft);
  }
  DynEl.prototype.getY = function()
  {
    return parseInt(this.style.pixelTop);
  }
  DynEl.prototype.getWidth = function()
  {
    return parseInt(this.style.width);
  }
  DynEl.prototype.getHeight = function()
  {
    return parseInt(this.style.height);
  }
  DynEl.prototype.getStackingOrder = function()
  {
    return parseInt(this.style.zIndex);
  }
  DynEl.prototype.isVisible = function()
  {
    return this.style.visibility == "show";
  }
  
  
  /*
    Dynamically change the contents of the element
    Then arg(s) should be HTML strings which become the new body
  */
  DynEl.prototype.setBody = function()
  {
    var body = "";
    for(var i = 0; i < arguments.length; i++){
      body += arguments[i] + "\n";
    }
    this.element.innerHTML = body;
  }
  
}