/**
 WindowOverlay dynamically created window that can appear anywhere in the page.
   Can also be attached to any element on the page.

 WindowOverlayUtil, when a WindowOverlay is attached to an element this utility
   will reposition the WindowOverlay when the browser window resizes.

*/

if(typeof deconcept == "undefined") var deconcept = new Object();
if(typeof deconcept.util == "undefined") deconcept.util = new Object();
if(typeof WindowOverlayUtil == "undefined") var WindowOverlayUtil = new Object();

if( ! deconcept.util.addEvent )
  deconcept.util.addEvent = function( obj, type, fn )
  {
    if( obj.attachEvent )
      {
	obj['e'+type+fn] = fn;
	obj[type+fn] = function(){obj['e'+type+fn]( window.event );}
	obj.attachEvent( 'on'+type, obj[type+fn] );
      }
    else
      {
	obj.addEventListener( type, fn, false );
      }
  }

if( ! deconcept.util.getNextHighestZIndex )
  deconcept.util.getNextHighestZIndex = function()
  {
    if( ! document.getElementsByTagName )
      return false;

    var tags = document.getElementsByTagName( '*' );
    if( ! tags )
      return false;

    var zIndex = 1;
    for( var i=0; i<tags.length; i++ )
      {
	var tag = tags[i];
	if( ! tag.style || ! tag.style.zIndex )
	  continue;

	var z = parseInt( tag.style.zIndex );
	if( z > zIndex )
	  zIndex = z;
      }

    return zIndex + 1;
  }

WindowOverlayUtil.windows = new Array();
WindowOverlayUtil.onresizeHandler = function( evt )
{
  for( var i=0; i<WindowOverlayUtil.windows.length; i++ )
    {
      var w = WindowOverlayUtil.windows[i];
      if( w.isShowing() )
	w.reposition();
    }
}

WindowOverlayUtil.onclickHandler = function( evt )
{
  for( var i=0; i<WindowOverlayUtil.windows.length; i++ )
    {
      var w = WindowOverlayUtil.windows[i];
      if( w.okToClose() )
	w.hide();
      else if( w.isShowing() )
	w.setJustOpened( false );
    }
}

WindowOverlayUtil.attachWindowHandlers = function()
{
  deconcept.util.addEvent( window, 'resize', WindowOverlayUtil.onresizeHandler );
  deconcept.util.addEvent( document, 'click', WindowOverlayUtil.onclickHandler );
}

deconcept.WindowOverlay = function( url, width, height )
{
  this.url = url;
  this.x = 0;
  this.y = 0;
  this.offsetX = 0;
  this.offsetY = 0;
  this.width = width;
  this.height = height;
  this.header = null;
  this.closeButton = null;
  this.layer = null;
  this.iframe = null;
  this.attachedToElement = null;
  this.border = 0;
  this.headerBorder = 0;
  this.align = 'center';
  this.verticalAlignment = 'above';
  this.closeOnClickAway = true;
  this.justOpened = false;
}

deconcept.WindowOverlay.prototype = {
  create: function()
  {
    this.iframe = document.createElement( 'iframe' );
    this.iframe.overlay = this;
    this.iframe.src = this.url;
    this.iframe.setAttribute( 'frameBorder', 0 );
    this.iframe.setAttribute( 'marginWidth', 0 );
    this.iframe.setAttribute( 'marginHeight', 0 );
    this.iframe.setAttribute( 'frameborder', 0 );
    this.iframe.setAttribute( 'marginwidth', 0 );
    this.iframe.setAttribute( 'marginheight', 0 );
    this.iframe.setAttribute( 'width', this.width );
    this.iframe.setAttribute( 'height', this.height );
    this.iframe.setAttribute( 'scrolling', 'auto' );

    this.layer = document.createElement( 'div' );
    this.overlay = this;
    this.layer.style.padding = 0;
    this.layer.style.margin = 0;
    this.layer.style.border = this.border;
    this.layer.style.position = 'absolute';
    this.move( this.x, this.y );
    this.layer.style.width = this.width + 'px';
    this.hide();

    this.layer.appendChild( this.iframe );

    if( this.header )
      this.layer.appendChild( this.header );

    document.body.appendChild( this.layer );

    WindowOverlayUtil.windows.push( this );

    // incase a header was added, the overall height changes
    this.height = this.layer.offsetHeight;
  },

  createHeader: function( bgcolor, fontColor )
  {
    this.closeButton = document.createElement( 'a' );
    this.closeButton.overlay = this;
    this.closeButton.onclick = this.closeHandler;
    this.closeButton.style.border = 0;
    this.closeButton.style.padding = 0;
    this.closeButton.style.margin = '0 5px 0 0';
    this.closeButton.style.color = fontColor;
    this.closeButton.style.fontSize = '12px';
    this.closeButton.style.cursor = 'pointer';
    this.closeButton.style.textDecoration = 'underline';
    this.closeButton.style.cssFloat = 'right';
    this.closeButton.style.styleFloat = 'right';
    this.closeButton.style.display = 'block';
    this.closeButton.innerHTML = 'close';

    var br = document.createElement( 'br' );
    br.style.padding = 0;
    br.style.margin = 0;
    br.style.width = '0px';
    br.style.height = '0px';
    br.style.clear = 'both';

    this.header = document.createElement( 'div' );
    this.header.style.backgroundColor = bgcolor;
    this.header.style.border = this.headerBorder;
    this.header.style.padding = 0;
    this.header.style.margin = 0;
    this.header.appendChild( this.closeButton );
    this.header.appendChild( br );
  },

  setCloseButtonHTML: function( html )
  {
    this.closeButton.innerHTML = html;
  },

  setBorder: function( border )
  {
    this.border = border;
  },

  setHeaderBorder: function( border )
  {
    this.headerBorder = border;
  },

  setAlign: function( align )
  {
    this.align = align;
  },

  setVerticalAlign: function( verticalAlignment )
  {
    this.verticalAlignment = verticalAlignment;
  },

  setOffsetX: function( x )
  {
    this.offsetX = x;
  },

  setOffsetY: function( y )
  {
    this.offsetY = y;
  },

  setJustOpened: function( justOpened )
  {
    this.justOpened = justOpened;
  },

  move: function( x, y )
  {
    this.x = x;
    this.y = y;
    this.layer.style.left = this.x + 'px';
    this.layer.style.top = this.y + 'px';
  },

  show: function()
  {
    if( this.justOpened == false && this.iframe.contentWindow && this.iframe.contentWindow.windowOverlay_active )
      this.iframe.contentWindow.windowOverlay_active();

    var zIndex = deconcept.util.getNextHighestZIndex();

    this.reposition();
    if( zIndex && (! this.layer.style.zIndex || parseInt(this.layer.style.zIndex) < (zIndex-1)) )
      this.layer.style.zIndex = zIndex;

    this.layer.style.visibility = 'visible';
    this.justOpened = true;      
  },

  hide: function()
  {
    if( this.justOpened && this.iframe.contentWindow && this.iframe.contentWindow.windowOverlay_inactive )
      this.iframe.contentWindow.windowOverlay_inactive();

    this.layer.style.visibility = 'hidden';
    this.justOpened = false;
  },

  isShowing: function()
  {
    return this.layer.style.visibility == 'visible';
  },

  okToClose: function()
  {
    return this.isShowing() && this.closeOnClickAway && this.justOpened == false;
  },

  attachTo: function( element )
  {
    this.attachedToElement = element;
  },

  getAttachedElement: function()
  {
    return this.attachedToElement;
  },

  reposition: function()
  {
    if( ! this.attachedToElement )
      return;

    var obj = this.attachedToElement;
    var x = 0;
    var y = 0;
    do {
      x += obj.offsetLeft;
      y += obj.offsetTop;
    } while( obj = obj.offsetParent );

    switch( this.align )
      {
	case 'center': {
	  x -= (this.width - this.attachedToElement.offsetWidth) / 2;
	} break;

	case 'left-corner': {
	} break;

        case 'left': {
	  x -= this.width;
	} break;

        case 'right-corner': {
	  x += this.attachedToElement.offsetWidth - this.width;
	} break;

        case 'right': {
	  x += this.attachedToElement.offsetWidth;
	} break;

      } // end switch( this.align )

    switch( this.verticalAlignment )
      {
      case 'top': {
	y -= (this.height - this.attachedToElement.offsetHeight);
      } break;

      case 'above': {
	y -= this.height;
      } break;

      case 'bottom': {
      } break;

      case 'below': {
	y += this.attachedToElement.offsetHeight;
      } break;

      case 'middle': {
	y -= (this.height - this.attachedToElement.offsetHeight) / 2;
      } break;

      } // end switch( this.verticalAlignment )

    x += this.offsetX;
    y += this.offsetY;

    // incase x or y are off the browser page
    if( x < 0 )
      x = 0;

    if( y < 0 )
      y = 0;

    this.move( x, y );
  },

  closeHandler: function()
  {
    this.overlay.hide();
  }
}

var WindowOverlay = deconcept.WindowOverlay;