// JavaScript Document
var Popup = new Class({

    Implements: [Options, Events],

    options: { title: "Title", width: 200, height: 200, adoptElement: null, add_close_button: true },
    popupElement: null,
    mainElement: null,
    contentElement: null,
    
    initialize: function(options) {
      this.setOptions(options);     
      this.createPopup();
      this.adopt();
    },
    
    show: function() {
      blankScreen();
      this.popupElement.fade('in');
    },
    
    setTitle : function(title) {
      this.mainElement.getElement('h1').set('html', title);
    },
    
    close: function() {
      $('blanker').fade('out');
      this.popupElement.fade('out');
    },
    
    setPosition: function(x, y) {
      this.popupElement.setStyle('left', x);
      this.popupElement.setStyle('top', y);
      
    },
    
    centre: function() {
      var x = (window.getSize().x / 2) - (this.popupElement.getSize().x / 2);
      var y = (window.getSize().y / 2) - (this.popupElement.getSize().y / 2);
      if (y < 0) { y = 100; }
      this.setPosition(x, y);
    },

    createPopup: function() {
      this.popupElement = new Element('div', 
        {'class': 'popup', 'styles': { 
          'width': this.options.width, 'height': this.options.height
        }
        });
      this.mainElement = new Element('div', 
        {'class': 'main', 'styles': { 
          'width': this.options.width - 32, 'height': this.options.height - 40
        }
        });
      this.popupElement.setStyle('opacity', 0);
      topBar = new Element('div', {'class': 'top', 'styles': {'width': this.options.width - 10}});
      bottomBar = new Element('div', {'class': 'bottom', 'styles': {'width': this.options.width - 10}});
      leftBar = new Element('div', {'class': 'left', 'styles': {'height': this.options.height - 10}});
      rightBar = new Element('div', {'class': 'right', 'styles': {'height': this.options.height - 10}});
      brCorner = new Element('div', {'class': 'bottom-right'});
      blCorner = new Element('div', {'class': 'bottom-left'});
      trCorner = new Element('div', {'class': 'top-right'});
      tlCorner = new Element('div', {'class': 'top-left'});
      this.contentElement = new Element('div', {'class': 'content'});
      
      if (this.options.add_close_button) {
	      closeEl = new Element('a', {'class': 'close', 'href': '#'});
	      closeEl.addEvent('click', function() {
	        this.close();
	        return false;
	      }.bindWithEvent(this));
	      closeEl.inject(this.popupElement);
      }
      
      title = new Element('h1');
      topBar.inject(this.popupElement);
      bottomBar.inject(this.popupElement);
      leftBar.inject(this.popupElement);
      rightBar.inject(this.popupElement);
      brCorner.inject(this.popupElement);
      blCorner.inject(this.popupElement);
      trCorner.inject(this.popupElement);
      tlCorner.inject(this.popupElement);
      title.inject(this.mainElement);
      this.contentElement.inject(this.mainElement);
      this.setTitle(this.options.title);
      this.mainElement.inject(this.popupElement);
      this.popupElement.inject($('full_width_container'), 'top');
      this.centre();
      
    },
    
    adopt: function() {
      if (this.options.adoptElement == null) {
        return;
      }
      this.options.adoptElement.inject(this.contentElement);
    }
    
});