var Overlay = {
  yPos: 0,
  xPos: 0,
  isIE: /*@cc_on!@*/false,

  open: function(href, close_func) {
    // make http(s) links the same as in this document
    href = href.replace(/^http(s)?\:/, window.location.protocol);
    this.href = href;
    this.close_func = close_func;
    this.activate();
  },
  
  setSize: function(width, height) {
    $('overlay_wrapper').setStyle({
      width:width + 'px', height:height + 'px',
      marginTop:(-height/2) + 'px',   // 10 = 2*borderwidth
      marginLeft:(-width/2) + 'px'
    });
    $('overlay_iframe_wrapper').setStyle({
      width:(width-4) + 'px', height:(height-34) + 'px'
    });
  },
	
  submitForm: function(close_func) {
    this.close_func = close_func;
    this.href = null;
    this.activate();
    return true;
  },
	
  // Turn everything on - mainly the IE fixes
  activate: function(){
    this.setSize(600, 500);
    if (this.hasIFrame()) {
      this.loadIFrame();
      return;
    }
    if (this.isIE){
      this.getScroll();
      this.prepareIE('100%', 'hidden');
      this.setScroll(0,0);
      this.hideSelects('hidden');
    }
    this.displayOverlay("block");
  },

  // Ie requires height to 100% and overflow hidden or else you can scroll down past the lightbox
  prepareIE: function(height, overflow){
    bod = document.getElementsByTagName('body')[0];
    bod.style.height = height;
    bod.style.overflow = overflow;
  
    htm = document.getElementsByTagName('html')[0];
    htm.style.height = height;
    htm.style.overflow = overflow; 
  },
	
  // In IE, select elements hover on top of the lightbox
  hideSelects: function(visibility){
    selects = document.getElementsByTagName('select');
    for(i = 0; i < selects.length; i++) {
      selects[i].style.visibility = visibility;
    }
  },
	
  // Taken from lightbox implementation found at http://www.huddletogether.com/projects/lightbox/
  getScroll: function(){
    if (window.pageYOffset) {
      this.yPos = window.pageYOffset;
    } else if (document.documentElement && document.documentElement.scrollTop){
      this.yPos = document.documentElement.scrollTop; 
    } else if (document.body) {
      this.yPos = document.body.scrollTop;
    }
  },
	
  setScroll: function(x, y){
    window.scrollTo(x, y); 
  },
	
	displayOverlay: function(display){
		$('overlay').style.display = display;
		if(display != 'none') {
		  this.loadIFrame();
		  enableFlashContainers(false);
		} else {
		  enableFlashContainers(true);
		}
	},
	
	loadingDone: function() {
      $('overlay_loading').hide();
	  if (this.loadingTimeout) {
        clearTimeout(this.loadingTimeout);
		this.loadingTimeout = null;
	  }
	},

	loadIFrame: function() {
      $('overlay_loading').show();
      this.removeIFrame();
      iframe = '<iframe frameborder="0" width="100%" height="100%" ' +
               'id="overlay_iframe" name="overlay_iframe"' +
               (this.href ? 'src="' + this.href + '"' : '') + '></iframe>';
      $('overlay_iframe_wrapper').update(iframe);
      this.loadingTimeout = setTimeout(this.loadingDone, 5000);
	},
		
	hasIFrame: function() {
	    return $('overlay_iframe');
	},
	
	removeIFrame: function() {
	    if (this.hasIFrame()) Element.remove('overlay_iframe');
	},
	
	// Example of creating your own functionality once lightbox is initiated
	close: function(){
	    this.removeIFrame();
		
		if (this.isIE){
			this.setScroll(0, this.yPos);
			this.prepareIE("auto", "auto");
			this.hideSelects("visible");
		}
		
		this.displayOverlay("none");
		
		if (this.close_func) {
		  this.close_func.apply(this.close_func, arguments);
		}
	},

    addMarkup: function(el) {
      if ($('overlay')) return;
      document.write('<div id="overlay">' +
	                   '<div id="overlay_background"></div>' +
                       '<div id="overlay_wrapper" class="loading">'+
                         '<div id="overlay_loading" style="display:none">' +
	                       '<img src="/static/images/loading.gif" />' +
                         '</div>' +
                         '<div id="overlay_content">' +
                           '<div id="overlay_title">' +
                             '<a href="#" onclick="Overlay.close(); return false">&nbsp;</a>' +
                           '</div>' +
                           '<div id="overlay_iframe_wrapper"></div>' +
                           '<div id="overlay_bottom"><span>&nbsp;</span></div>' +
                         '</div>' +
                       '</div>' +
					 '</div>');
    }
}

Event.observe(window, 'load', Overlay.addMarkup, false);
