$(function() {
    // Add a trend indicator to the end of an element
    var addTrendIndicator = function(elements, trend, url) {
        var better_title = "This metric improved with the last commit";
        var worse_title  = "This metric worsened with the last commit";
        switch(jQuery.trim(trend)) {
        case 'better': 
            var image_tag = ' <img src="/images/arrow_up.png" title="' +
                better_title +
                '" alt="[better]"/>';
            break;
        case 'worse':
            var image_tag = ' <img src="/images/arrow_down_red.png" title="' +
                worse_title + 
                '" alt="[worse]"/>';    
            break;
        default:
            return;             // no trend, so abort.
        }
        $(elements).append('<a href="' + url + '">' + image_tag + '</a>');
    };

    var metric_diff_url = $('#metric-diff-link').attr('href');
    $('.stat-pair[id$=-trend]').each(function() {
        var value   = $(this).find('.stat-value').text();
        var pair_id = $(this).attr('id');
        var tool    = /stat-pair-(\w+)/.exec(pair_id)[1];
        var metric  = $(this).find('.stat').text();
        var target  = $("#metric-title-" + tool);
        addTrendIndicator(target, value, metric_diff_url);
        $(this).hide();
    });
});