<commit_before>var nonAvail = '<span rel="tooltip" data-toggle="tooltip"' +
    'title="Not available"><i class="fa fa-ban"></i></span>';
var kernelName = $('#kernel-name').val();
var jobName = $('#job-name').val();
var searchFilter = $('#search-filter').val();

function createHideShowButton(element, action) {
    'use strict';
    var faClass = 'fa fa-eye',
        tooltipTitle = 'Show content for lab &#171;' + element + '&#187;"';
    if (action === 'hide') {
        faClass = 'fa fa-eye-slash';
        tooltipTitle = 'Hide content for lab &#171;' + element + '&#187;"';
    }
    return '<span rel="tooltip" data-toggle="tooltip"' +
        'title="' + tooltipTitle + '"><i data-action="' + action + '" ' +
        'data-id="' + element + '" class="' + faClass + '" ' +
        'onclick="showHideLab(this)"></i></span>';
}

function showHideLab(element) {
    'use strict';
    var tElement = $(element),
        dataId = tElement.data('id'),
        dataAction = tElement.data('action');

    if (dataAction === 'hide') {
        $('#accordion' + dataId).hide();
        $('#view-eye-' + dataId).empty().append(
            createHideShowButton(dataId, 'show')
        );
        $('#view-' + dataId).empty().append(
            '<small>Content for lab &#171;' + dataId + '&#187; ' +
            'hidden. Use the <i class="fa fa-eye"></i> ' +
            'button to show it again.</small>'
        );
    } else {
        $('#accordion' + dataId).show();
        $('#view-' + dataId).empty();
        $('#view-eye-' + dataId).empty().append(
            createHideShowButton(dataId, 'hide')
        );
    }
}

function showHideBoots(element) {
    'use strict';
    switch (element.id) {
        case 'success-cell':
            if ($('#success-btn').attr('disabled') !== 'disabled') {
                $('.df-failed').hide();
                $('.df-success').show();
                $('.df-unknown').hide();
                $('#success-btn').addClass('active').siblings()
                    .removeClass('active');
            }
            break;
        case 'success-btn':
            $('.df-failed').hide();
            $('.df-success').show();
            $('.df-unknown').hide();
            break;
        case 'fail-cell':
            if ($('#fail-btn').attr('disabled') !== 'disabled') {
                $('.df-failed').show();
                $('.df-success').hide();
                $('.df-unknown').hide();
                $('#fail-btn').addClass('active').siblings()
                    .removeClass('active');
            }
            break;
        case 'fail-btn':
            $('.df-failed').show();
            $('.df-success').hide();
            $('.df-unknown').hide();
            break;
        case 'unknown-cell':
            if ($('#unknown-btn').attr('disabled') !== 'disabled') {
                $('.df-failed').hide();
                $('.df-success').hide();
                $('.df-unknown').show();
                $('#unknown-btn').addClass('active').siblings()
                    .removeClass('active');
            }
            break;
        case 'unknown-btn':
            $('.df-failed').hide();
            $('.df-success').hide();
            $('.df-unknown').show();
            break;
        default:
            $('.df-failed').show();
            $('.df-success').show();
            $('.df-unknown').show();
            $('#all-btn').addClass('active').siblings()
                .removeClass('active');
            break;
    }
}

function createPieChart(data) {
    'use strict';
    var localData = data.result,
        len = localData.length,
        success = 0,
        fail = 0,
        unknown = 0,
        i = 0,
        width = 200,
        height = 200,
        radius = Math.min(width, height) / 2,
        dataset = null,
        svg = null,
        // success, fail and unknown status colors.
        color = ['#5cb85c', '#d9534f', '#f0ad4e'],
        pie = d3.layout.pie().sort(null),
        arc = d3.svg.arc().innerRadius(radius - 30).outerRadius(radius - 50);

    if (len > 0) {
        for (i; i < len; i = i + 1) {
            switch (localData[i].status) {
                case 'FAIL':
                    fail = fail + 1;
                    break;
                case 'PASS':
                    success = success + 1;
                    break;
                default:
                    unknown = unknown + 1;
                    break;
            }
        }

        dataset = [success, fail, unknown];
        svg = d3.select('#pie-chart').append('svg')
            .attr('width', width)
            .attr('height', height)
            .append('g')
            .attr('transform', 'translate(' + width / 2 + ',' +
                height / 2 + ')'
            );

        svg.selectAll('path')
            .data(pie(dataset))
            .enter().append('path')
            .attr('fill', function(d, i) {
                return color[i];
            })
            .attr('d', arc);

    }

    $('#success-cell')
        .empty()
        .append(
            '<span rel="tooltip" data-toggle="tooltip" ' +
            'title="Successful boot">' + success + '</span>'
        ).css('border-bottom-color', color[0]);
    $('#fail-cell')
        .empty()
        .append(
            '<span rel="tooltip" data-toggle="tooltip" ' +
            'title="Failed boot">' + fail + '</span>'
        ).css('border-bottom-color', color[1]);
    $('#unknown-cell')
        .empty()
        .append(
            '<span rel="tooltip" data-toggle="tooltip" ' +
            'title="Unknown status">' + unknown + '</span>'
        ).css('border-bottom-color', color[2]);
}

function populateBootsPage(data) {
    'use strict';
<commit_msg>Add total number of boots inside pie chart.<commit_after>var nonAvail = '<span rel="tooltip" data-toggle="tooltip"' +
    'title="Not available"><i class="fa fa-ban"></i></span>';
var kernelName = $('#kernel-name').val();
var jobName = $('#job-name').val();
var searchFilter = $('#search-filter').val();

function createHideShowButton(element, action) {
    'use strict';
    var faClass = 'fa fa-eye',
        tooltipTitle = 'Show content for lab &#171;' + element + '&#187;"';
    if (action === 'hide') {
        faClass = 'fa fa-eye-slash';
        tooltipTitle = 'Hide content for lab &#171;' + element + '&#187;"';
    }
    return '<span rel="tooltip" data-toggle="tooltip"' +
        'title="' + tooltipTitle + '"><i data-action="' + action + '" ' +
        'data-id="' + element + '" class="' + faClass + '" ' +
        'onclick="showHideLab(this)"></i></span>';
}

function showHideLab(element) {
    'use strict';
    var tElement = $(element),
        dataId = tElement.data('id'),
        dataAction = tElement.data('action');

    if (dataAction === 'hide') {
        $('#accordion' + dataId).hide();
        $('#view-eye-' + dataId).empty().append(
            createHideShowButton(dataId, 'show')
        );
        $('#view-' + dataId).empty().append(
            '<small>Content for lab &#171;' + dataId + '&#187; ' +
            'hidden. Use the <i class="fa fa-eye"></i> ' +
            'button to show it again.</small>'
        );
    } else {
        $('#accordion' + dataId).show();
        $('#view-' + dataId).empty();
        $('#view-eye-' + dataId).empty().append(
            createHideShowButton(dataId, 'hide')
        );
    }
}

function showHideBoots(element) {
    'use strict';
    switch (element.id) {
        case 'success-cell':
            if ($('#success-btn').attr('disabled') !== 'disabled') {
                $('.df-failed').hide();
                $('.df-success').show();
                $('.df-unknown').hide();
                $('#success-btn').addClass('active').siblings()
                    .removeClass('active');
            }
            break;
        case 'success-btn':
            $('.df-failed').hide();
            $('.df-success').show();
            $('.df-unknown').hide();
            break;
        case 'fail-cell':
            if ($('#fail-btn').attr('disabled') !== 'disabled') {
                $('.df-failed').show();
                $('.df-success').hide();
                $('.df-unknown').hide();
                $('#fail-btn').addClass('active').siblings()
                    .removeClass('active');
            }
            break;
        case 'fail-btn':
            $('.df-failed').show();
            $('.df-success').hide();
            $('.df-unknown').hide();
            break;
        case 'unknown-cell':
            if ($('#unknown-btn').attr('disabled') !== 'disabled') {
                $('.df-failed').hide();
                $('.df-success').hide();
                $('.df-unknown').show();
                $('#unknown-btn').addClass('active').siblings()
                    .removeClass('active');
            }
            break;
        case 'unknown-btn':
            $('.df-failed').hide();
            $('.df-success').hide();
            $('.df-unknown').show();
            break;
        default:
            $('.df-failed').show();
            $('.df-success').show();
            $('.df-unknown').show();
            $('#all-btn').addClass('active').siblings()
                .removeClass('active');
            break;
    }
}

function createPieChart(data) {
    'use strict';
    var localData = data.result,
        len = localData.length,
        success = 0,
        fail = 0,
        unknown = 0,
        i = 0,
        width = 200,
        height = 200,
        radius = Math.min(width, height) / 2,
        dataset = null,
        svg = null,
        // success, fail and unknown status colors.
        color = ['#5cb85c', '#d9534f', '#f0ad4e'],
        pie = d3.layout.pie().sort(null),
        arc = d3.svg.arc().innerRadius(radius - 30).outerRadius(radius - 50);

    if (len > 0) {
        for (i; i < len; i = i + 1) {
            switch (localData[i].status) {
                case 'FAIL':
                    fail = fail + 1;
                    break;
                case 'PASS':
                    success = success + 1;
                    break;
                default:
                    unknown = unknown + 1;
                    break;
            }
        }

        dataset = [success, fail, unknown];
        svg = d3.select('#pie-chart').append('svg')
            .attr('width', width)
            .attr('height', height)
            .append('g')
            .attr('transform', 'translate(' + width / 2 + ',' +
                height / 2 + ')'
            );

        svg.selectAll('path')
            .data(pie(dataset))
            .enter().append('path')
            .attr('fill', function(d, i) {
                return color[i];
            })
            .attr('d', arc);

        svg.append('text')
            .attr('dy', '0em')
            .style('text-anchor', 'middle')
            .attr('class', 'pie-chart-inside')
            .text(function(d) {
                return len;
            });

        svg.append('text')
            .attr('dy', '1.5em')
            .style('text-anchor', 'middle')
            .attr('class', 'pie-chart-data')
            .text(function(d) {
                return 'total boots';
            });
    }

    $('#success-cell')
        .empty()
        .append(
            '<span rel="tooltip" data-toggle="tooltip" ' +
            'title="Successful boot">' + success + '</span>'
        ).css('border-bottom-color', color[0]);
    $('#fail-cell')
        .empty()
        .append(
            '<span rel="tooltip" data-toggle="tooltip" ' +
            'title="Failed boot">' + fail + '</span>'
        ).css('border-bottom-color', color[1]);
    $('#unknown-cell')
        .empty()
        .append(
            '<span rel="tooltip" data-toggle="tooltip" ' +
            'title="Unknown status">' + unknown + '</span>'
        ).css('border-bottom-color', color[2]);
}

function populateBootsPage(data) {
    'use strict';

{'fraction_non_alphanumeric': 0.1987077284551481, 'fraction_numerical': 0.009482252244692456, 'mean_word_length': 1.5696420871065113, 'pattern_counts': {'":': 0, '<': 41, '<?xml version=': 0, '>': 41, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '7147537', 'n_tokens_mistral': 3522, 'n_tokens_neox': 3367, 'n_words': 660}