window.addEvent('domready', function(){
	var Tips1 = new myTips($$('.tooltip'), {
		showDelay: 1000,
		hideDelay: 0,		
		className: "tt",
		fixed: true
	});			
});

var myDrag = new Class({
	Extends: Drag,
	Implements: [Events, Options],
	
	initialize: function() {
		var params = Array.link(arguments, {'options': Object.type, 'element': $defined});
		this.element = params.element;
		this.document = this.element.getDocument();
		
		this.setOptions(params.options || {});
		var htype = $type(this.options.handle);
		this.handles = (htype == 'array' || htype == 'collection') ? $$(this.options.handle) : $(this.options.handle) || this.element;
		this.mouse = {'now': {}, 'pos': {}};
		this.value = {'start': {}, 'now': {}};
		
		this.selection = (Browser.Engine.trident) ? 'selectstart' : 'mousedown';
		
		this.bound = {
			start: this.start.bind(this),
			check: this.check.bind(this),
			drag: this.drag.bind(this),
			stop: this.stop.bind(this),
			cancel: this.cancel.bind(this),
			eventStop: $lambda(false)
		};
		this.attach();	
	}
});

var myTips = new Class({
    Extends: Tips,
    Implements: [Events, Options],	
	options: {
		onShow: function(tip){			
			tip.fade('in');   
		},
		onHide: function(tip){		
			tip.set('tween', {duration: '150'});
			tip.tween('opacity', '0');
		
		},
		active : 0		
	},
		
    attach: function(elements) {	
		var Tips = this;
		$$(elements).each(function(element) {   
			var content = element.get('title').split(' :: ');   
			element.store('tip:title', content[0]);   
			element.store('tip:text', content[1]);   
			
			var mouseclick = element.retrieve('tip:mouseclick', Tips.elementClick.bindWithEvent(Tips, element));
			element.addEvents({click: mouseclick});		
			
		});   			
		
		this.tip.setStyles({opacity: '0', visibility: 'visible'});
        this.parent(elements);
    },
	
	detatch: function(elements) {
		$$(elements).each(function(element){
			element.removeEvent('mouseenter', element.retrieve('tip:enter') || $empty);
			element.removeEvent('mouseleave', element.retrieve('tip:leave') || $empty);
			element.removeEvent('mousemove', element.retrieve('tip:move') || $empty);
			element.removeEvent('mouseclick', element.retrieve('tip:mouseclick') || $empty);
			element.eliminate('tip:enter').eliminate('tip:leave').eliminate('tip:move').eliminate('tip:mouseclick');			
		});
	},
	
	elementClick: function(event, element) {
		this.show();
		this.options.active = 1;
		var elem = this;
			
		var cancelBtn = new Element('div', {		   
		    'class': 'cancelBtn',
		    'events': {
		        'click': function(){
					elem.tipDrag.detach();
					this.dispose();
					elem.options.active = 0;
		            elem.hide();
		        },
				'mouseover': function() {
					this.setStyle('cursor','pointer');					
				}
		    }
		});
		
		cancelBtn.inject(this.tip);				
		
		this.tipDrag = new myDrag(this.tip, {
			snap: 0			
		});		
		
	},
	elementEnter: function(event, element){				
		this.parent(event, element);
		element.setStyle('cursor','pointer');	
	},
	
	show: function(){		
		this.fireEvent('show', this.tip);
	},

	hide: function(){	
		if(this.options.active == 0)
			this.fireEvent('hide', this.tip);
	}
});