function makePlayer(root, width) {
    var scale = d3.time.scale().range([0, width]);

    var axis = d3.svg.axis()
        .scale(scale)
        .ticks(width / 80)
        .tickSize(6)
        .orient('bottom');

    var timeLine = root.append('g').attr('class', 'axis');

    function updatePlayer(events, band, clicked) {
        scale.domain([new Date(events[0][0]), new Date(events[events.length - 1][0])]);
        scale.range([0, width - band]);
        scale.domain([new Date(events[0][0]), scale.invert(width)]);
        scale.range([0, width]);

        timeLine.call(axis)
            .selectAll('text')
            .style('text-anchor', 'start');

        timeLine.selectAll('text').on('click', function (d) {
            for (var i = 0; i < events.length; i++) {
                if (events[i][2] >= d) {
                    d3.event.stopPropagation();
                    clicked(i);
                    break;
                }
            }
        });
    }

    return {
        updatePlayer: updatePlayer
    };
}