@(
    projectsWithSelection: ProjectsWithSelection,
    vulnerableDependencies: Seq[GroupedDependency],
    allDependenciesCount: Int,
    dependenciesWithSuppressedVulnerabilitiesOnlyCount: Int,
    reports: DependencyCheckReportsParser.Result
)(implicit header: DefaultRequest, mainTemplateData: MainTemplateData)

@main(
    title = s"Vulnerable libraries for ${projectsWithSelection.projectNameText} (${vulnerableDependencies.size} deps, ${vulnerableDependencies.flatMap(_.cpeIdentifiers.map(_.toCpeIdentifierOption.get)).toSet.size} CPEs)",
    projectsOption = Some((projectsWithSelection, routes.Statistics.vulnerableLibraries(_)))
){
    @healthReport(reports.failedProjects)
    <script type="text/javascript" src="@routes.Assets.versioned("lib/jqplot/jquery.jqplot.min.js")"></script>
    <script type="text/javascript" src="@routes.Assets.versioned("lib/jqplot/plugins/jqplot.pieRenderer.min.js")"></script>
    <h2>Plot</h2>
    <div id="vulnerable-dependencies-chart"></div>
<script type="text/javascript">
$(document).ready(function(){
    var data = [
        ['Vulnerable libraries', (@(vulnerableDependencies.size))],
        ['Libraries with all vulnerabilities suppressed', (@(dependenciesWithSuppressedVulnerabilitiesOnlyCount))],
        ['Libraries with no known vulnerability', (@(allDependenciesCount - vulnerableDependencies.size - dependenciesWithSuppressedVulnerabilitiesOnlyCount))]
    ];
    var plot1 = jQuery.jqplot ('vulnerable-dependencies-chart', [data], {
        seriesDefaults: {
            // Make this a pie chart.
            renderer: jQuery.jqplot.PieRenderer,
            pointLabels: true,
            rendererOptions: {
                // Put data labels on the pie slices.
                // By default, labels show the percentage of the slice.
                showDataLabels: true,
                dataLabels: 'value',
                startAngle: -90,
                seriesColors: ['red', 'yellow', 'green'],
                legendOptions: {
                    textColor: 'white'
                }
            }
        },
        legend: {
          show:true,
            location: 'e',
            labels: $(data).map(function (i, item) {
                return item[0]+" ("+item[1]+")";
            })
        }
    });
});
</script>
    <h2>List</h2>
    <div class="help">
        <p>Libraries are sorted:</p>
        <ol>
            <li>by max vulnerability score if defined for at least one vulnerability</li>
            <li>by affected dependency count if the score above is not defined</li>
            <li>by number of vulnerabilities</li>
            <li>by affected project count</li>
        </ol>
        <p>Note that the number of affected projects is calculated from the current view, not from all projects (unless all projects are selected).</p>
    </div>
    @dependencyList(
        "vulnerable",
        vulnerableDependencies.sorted(severityOrdering),
        selectorOption = projectsWithSelection.selectorString,
        addButtons = false
    )
}