Ox.SmallVideoTimeline = function(options, self) {

    self = self || {};
    var that = Ox.Element({}, self)
        .defaults({
            duration: 0,
            editing: false,
            getTimelineURL: null,
            'in': 0,
            out: 0,
            width: 256,
            type: 'player'
        })
        .options(options || {})
        .addClass('OxSmallVideoTimeline')
        .css({
            width: self.options.width + 'px'
        });

    self.height = self.options.type == 'player' ? 16 : 24;
    self.imageHeight = self.options.type == 'player' ? 16 : 18;
    self.imageTop = self.options.type == 'player' ? 0 : 3;

    that.css({
        height: self.height + 'px'
    });

    self.tooltip = Ox.Tooltip({
        animate: false
    }).css({
        textAlign: 'center'
    });

    getImageURL('timeline', function(timelineURL) {

        $('<img>')
            .attr({
                src: timelineURL
            })
            .css({
                width: self.options.width + 'px',
                height: self.imageHeight + 'px',
                top: self.imageTop + 'px'
            })
            .appendTo(that.$element);

        

    });


    return that;

};