//vim: et:ts=4:sw=4:sts=4:ft=js
Ox.Tooltip = function(options, self) {

    var self = self || {},
        that = new Ox.Element('div', self)
            .defaults({
                animate: true,
                title: ''
            })
            .options(options || {})
            .addClass('OxTooltip')
            .html(self.options.title);

    self.options.animate && that.css({
        opacity: 0
    });

    self.onChange = function(key, value) {
        if (key == 'title') {
            that.html(value);
        }
    };

    that.hide = function() {
        if (self.options.animate) {
            that.animate({
                opacity: 0
            }, 250, function() {
                that.removeElement();
            });
        } else {
            that.removeElement();
        }
        return that;
    };

    that.show = function(x, y) {
        var left, top, width, height;
        $('.OxTooltip').remove(); // fixme: don't use DOM
        that.appendTo(Ox.UI.$body);
        width = that.width();
        height = that.height();
        left = Ox.limit(x - width / 2, 0, Ox.UI.$document.width() - width);
        top = y > Ox.UI.$document.height() - height - 16 ? y - 32 : y + 16;
        that.css({
            left: left + 'px',
            top: top + 'px'
        });
        self.options.animate && that.animate({
            opacity: 1
        }, 250);
        return that;
    };

    return that;

};