/*
    Utils - ToolTip 1.0
    ===========================
    developed by Core Engine
    http://www.core-engine.com/
*/



var ToolTip = new Class({
    
    template: '<table><thead><tr><td class="tt-tl"></td><td class="tt-t"></td><td class="tt-tr"></td>\
    </tr></thead><tbody><tr><td></td><td class="tt-m"><div class="tt-ml"><div class="tt-mr">{close}\
    <div class="tt-content">{content}</div></div></div></td><td></td></tr></tbody><tfoot><tr>\
    <td class="tt-bl"></td><td class="tt-b{anchor}"></td><td class="tt-br"></td></tr></tfoot></table>',
    
    close: '<input type="button" class="tt-close" title="{label}" value=""\
    onclick="javascript: this.getParent(\'.tooltip\').hide();" />',
    
    Implements: Options,
    options: {
        'id': 'tooltip',
        'class': '',
        'style': {},
        'overwrite': false,
        'content': '',
        'link': null,
        'anchor': 'left',
        'close': true,
        'fade': false,
        'autohide': false
    },
    
    
    
    initialize: function(options) {
        /*
        Initialize a tip
        ------------------------------------
            p: parameters 
        */
        
        // Params
        this.setOptions(options);
        var opt = this.options;
        if($(opt['id']) && !opt['overwrite']) return;
        
        // Element creation
        var t = new Element('span', {
            'id': opt['id'],
            'class': 'tooltip ' + opt['class'],
            'style': opt['style'],
            'html': this.template.substitute({
                'close': (opt['close']) ? this.close.substitute({label: "Fermer cette info-bulle"}) : '',
                'content': opt['content'],
                'anchor': (opt['anchor']) ? '-'+opt['anchor'] : ''
            })
        });
        
        t.show = this._show.bind(t);
        t.hide = this._hide.bind(t);
        t.autohide = opt['autohide'];
        
        var inject = function() {
            t.setStyle('opacity', 0);
            if(opt['link']) {
                var e = opt['link'];
                t.injectAfter(e);
                t.setStyles({
                    'margin-top': -t.getSize().y,
                    'margin-bottom': -t.getSize().y,
                    'margin-left': -45
                });
            }
            else {
                t.inject(document.body);
                t.setStyles({
                    'margin-left': t.offsetWidth/(-2),
                    'margin-top': t.offsetHeight/(-2)
                });
            };
            
            var cb = $empty;
            if(opt['fade']) { cb = function() { t.hide.delay(($type(opt['fade']) == 'number') ? opt['fade'] : 3000) }; };
            t.show(cb);
        };
        
        // Initialize
        if($(opt['id'])) { $(opt['id']).hide(inject); } else { inject(); };
        
        return t;
    },
    
    
    
    _show: function(cb) {
        /*
        Show tooltip
        ------------------------------------
            cb: callback (optional) 
        */
        
        var t = this;
        if(t.fx) t.fx.cancel();
        t.fx = new Fx.Tween(t, {
            'duration': 200,
            'onComplete':function() {
                if ($type(t.autohide) == 'number')
                    t.hide.delay(t.autohide);
                else
                    window.addEvent('mouseup', t.hide);
                if($type(cb) == 'function')
                    cb.attempt();
            }
        }).start('opacity', 1);
    },
    
    
    
    _hide: function(cb) {
        /*
        Hide tooltip
        ------------------------------------
            cb: callback (optional) 
        */
        
        var t = this;
        if(t.fx) t.fx.cancel();
        t.fx = new Fx.Tween(t, {
            'duration': 200,
            'onComplete':function() {
                t.destroy();
                window.removeEvent('mouseup', t.hide);
                if($type(cb) == 'function') cb.attempt();
            }
        }).start('opacity', 0);
    }
});