var Bubble = new Class({
	initialize: function(bubble, trigger){
		this.bubble = $(bubble);
		this.trigger = $(trigger);
		this.hideBubble();
		this.bindEvents();
	},
	hideBubble: function(){
		this.bubble.setStyle('opacity', 0);
		this.bubble.setStyle('z-index', -10);
	},
	addCloseEvents : function () {
		var closers = this.bubble.getElements('.closeBubble');
		if (closers) {
			$each(closers, function(elm) {
				elm.addEvent('click', function(e) {
					e.stop();
						this.bubble.fade("out");
						this.bubble.activeBubble = false;
						this.bubble.setStyle('z-index', -10);
						alert(this.bubble.getStyle('z-index'));
						this.bubble.morph({
							'opacity' :0,
							'margin-top' :0
						});
				});
			}, this);
		}
	},
	bindEvents : function(){
		this.addCloseEvents();
		var self = this;
		this.trigger.set('morph', {link : 'cancel'});
		this.trigger.addEvents({
			'click': function(e) {
			if(!$defined(self.bubble.activeBubble) || !self.bubble.activeBubble){
				self.bubble.setStyle("left", e.page.x-self.bubble.getSize().x);
				self.bubble.activeBubble = true;
				self.bubble.setStyle('z-index', 10);
				self.bubble.morph({
						'opacity' : 1,
						'margin-top' : '-10px'
					});
				}
			
			}	
		});
		
	}
});