<commit_before><!DOCTYPE html>
<html lang="en" ng-app="drat" xmlns:wicket="http://wicket.apache.org">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>PROTEUS</title>
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://rawgit.com/novus/nvd3/v1.1.15-beta/nv.d3.min.css"/>
    <link rel="stylesheet" type="text/css" href="styles/HomePage.css">
</head>
<body ng-controller="switch">
<div class="container" ng-init="runDrat()">
    <div class="header">
        <h1 class="proteus"><a style="color:inherit; text-decoration:none" href="/proteus">PROTEUS</a></h1>
        <span class="h4">'A GUI FOR DRAT'</span>
    </div>


    <div class="row sections">

        <!-- ******* The left section is here ******* -->
        <div id="left-section" class="col-lg-3">
            <!-- List of scanned files start here -->
            <div id="scanned-files" >
                <!-- List of scanned files are inside of here -->
                <div class = "list-header"><span class="glyphicon glyphicon-folder-close" id="icon"></span> <span class="sub-header">{{scanStatus}}</span></div>
                <div class="list-box">
                    <ul class = "list-group scanned-list">
                        <li ng-if="!scanComplete" class = "list-group-item" ng-repeat="files in arrayOfScannedFiles">{{files.listName}}</li>

                        <li ng-if="scanComplete" class = "list-group-item" ng-repeat="rat in ratInstances">
                            <a href="#" data-toggle="modal" data-target="#logs" ng-click="openModal(rat.ratId)"> RAT {{rat.ratId}} </a>
                        </li>
                    </ul>
                </div>

            </div>
            <!-- List of scanned files end here -->

            <!-- logs are here -->
            <div class="logs list-header" >
                <!-- logs contents are here -->
            </div>
            <!-- logs ended above -->
        </div>
        <!-- ******* The left section ends here ******* -->

        <!-- ******* The middle section is here ******* -->
        <div id="middle-section" class="col-lg-6">
            <!-- progress bar area and header start here -->
            <div class="mid-header-box">
                <h1> Please wait while <span class="fontweight-600">DRAT</span> scans your repository...</h1>
                <uib-progressbar max="max" value="dynamic" type="info">
                    <span style="color:white; white-space:nowrap;"></span>
                </uib-progressbar>
                <div class="index-value">
                    <span class="fontweight-600">{{ value }}%</span> is completed on step: <span class="fontweight-600"> {{ steps[0] }} </span>
                </div>
                <!-- progress bar area and header are inside of it -->
            </div>
            <!-- progress bar and header ends here -->

            <!-- stats area -->
            <div class="stats-area">
                <!-- stats are inside of it -->
                <div class="sub-header">
                    <h4 lass="fontweight-600"> <span class="glyphicon glyphicon-folder-open"> </span> <span class="stat-subheader">Repository Statistics</span></h4>
                </div>
                <div class="table-responsive num-stats">
                    <table class="table">
                        <tr>
                            <td>
                                <div class="in-memory-size">
                                    <table class="rep-stats-table">
                                        <tr>
                                            <td class="left fontweight-600"> In-Memory Size </td>
                                            <td class="right"> {{ memorySize/1000000 |  number : fractionSize }} MB</td>
                                        </tr>
                                    </table>
                                </div>
                            </td>
                            <td class="right-s">
                                <div class="number-of-files">
                                    <table class="rep-stats-table">
                                        <tr>
                                            <td class="left fontweight-600"> Number of files </td>
                                            <td class="right"> {{ numberOfFiles |  number : fractionSize }}</td>
                                        </tr>
                                    </table>
                                </div>
                            </td>
                        </tr>
                    </table>
                </div>
                <div class="pie-chart col-lg-6">

                    <!-- the tag below shows the pie-chart -->
                    <div class="fontweight-600">MIME Types Breakdown </div>
                    <div style="margih-right: 50px;">
                        <nvd3
                                transform="translate(20,50) rotate(40) scale(7)"
                                data="data"
                                id="donutLabelsOutsideExample"
                                options="options"
                                >

                        </nvd3>
                    </div>
                    <!-- <nvd3 options="options" data="data"></nvd3> -->
                </div>
                <div class="bars col-lg-6">
                    <!-- the tag below shows the pie-chart -->
                    <div class="fontweight-600">License Types Breakdowns </div>
                    <nvd3 options="chartOptions" data="chartData"></nvd3>
                </div>
            </div>
            <!-- stats area ends -->
        </div>
        <!-- ******* The middle section ends here ******* -->


        <!-- ******* Section for the DRAT statistics. (left-section) ******* -->
        <div id="stats-right-section" class="col-lg-3">
            <!-- Contents of the Drat stats are here... -->
            <div class="drat-stats">
                <div class = "list-header">
                    <span class="glyphicon glyphicon-stats" id="icon"></span>
                    <span class="sub-header">DRAT Statistics</span>
                </div>
                <ul class="drat-stats-list">
                    <li><span class="fontweight-600">{{numOfRatRunning}}</span> RAT Instances <span class="fontweight-600">running</span> </li>
                    <li><span class="fontweight-600">{{numORatFinished}}</span> RAT Instances <span class="fontweight-600">finished</span> </li>
                </ul>
            </div>
        </div>
        <!-- ******* Left-side section ends here... ******* -->

    </div> <!-- .sections div ends -->

    <!-- modal window for RAT instances -->
    <div class="modal fade" id="logs"  role="dialog">
        <!--<div class="modal fade" id="showLogsDiv" ng-show="showLogsBox" role="dialog">-->
        <div class="modal-dialog">
<commit_msg>Added links to the spinner.<commit_after><!DOCTYPE html>
<html lang="en" ng-app="drat" xmlns:wicket="http://wicket.apache.org">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>PROTEUS</title>
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://rawgit.com/novus/nvd3/v1.1.15-beta/nv.d3.min.css"/>
    <link rel="stylesheet" type="text/css" href="styles/HomePage.css">
</head>
<body ng-controller="switch">
<div class="container" ng-init="runDrat()">
    <div class="header">
        <h1 class="proteus"><a style="color:inherit; text-decoration:none" href="/proteus">PROTEUS</a></h1>
        <span class="h4">'A GUI FOR DRAT'</span>
    </div>


    <div class="row sections">

        <!-- ******* The left section is here ******* -->
        <div id="left-section" class="col-lg-3">
            <!-- List of scanned files start here -->
            <div id="scanned-files" >
                <!-- List of scanned files are inside of here -->
                <div class = "list-header"><span class="glyphicon glyphicon-folder-close" id="icon"></span> <span class="sub-header">{{scanStatus}}</span></div>
                <div class="list-box">
                    <ul class = "list-group scanned-list">
                        <li ng-if="!scanComplete" class = "list-group-item" ng-repeat="files in arrayOfScannedFiles">{{files.listName}}</li>

                        <li ng-if="scanComplete" class = "list-group-item" ng-repeat="rat in ratInstances">
                            <a href="#" data-toggle="modal" data-target="#logs" ng-click="openModal(rat.ratId)"> RAT {{rat.ratId}} </a>
                        </li>
                    </ul>
                </div>

            </div>
            <!-- List of scanned files end here -->

            <!-- logs are here -->
            <div class="logs list-header" >
                <!-- logs contents are here -->
            </div>
            <!-- logs ended above -->
        </div>
        <!-- ******* The left section ends here ******* -->

        <!-- ******* The middle section is here ******* -->
        <div id="middle-section" class="col-lg-6">
            <!-- progress bar area and header start here -->
            <div class="mid-header-box">
                <h1> Please wait while <span class="fontweight-600">DRAT</span> scans your repository...</h1>
                <uib-progressbar max="max" value="dynamic" type="info">
                    <span style="color:white; white-space:nowrap;"></span>
                </uib-progressbar>
                <div class="index-value">
                    <span class="fontweight-600">{{ value }}%</span> is completed on step: <span class="fontweight-600"> {{ steps[0] }} </span>
                </div>
                <!-- progress bar area and header are inside of it -->
            </div>
            <!-- progress bar and header ends here -->

            <!-- stats area -->
            <div class="stats-area">
                <!-- stats are inside of it -->
                <div class="sub-header">
                    <h4 lass="fontweight-600"> <span class="glyphicon glyphicon-folder-open"> </span> <span class="stat-subheader">Repository Statistics</span></h4>
                </div>
                <div class="table-responsive num-stats">
                    <table class="table">
                        <tr>
                            <td>
                                <div class="in-memory-size">
                                    <table class="rep-stats-table">
                                        <tr>
                                            <td class="left fontweight-600"> In-Memory Size </td>
                                            <td class="right"> {{ memorySize/1000000 |  number : fractionSize }} MB</td>
                                        </tr>
                                    </table>
                                </div>
                            </td>
                            <td class="right-s">
                                <div class="number-of-files">
                                    <table class="rep-stats-table">
                                        <tr>
                                            <td class="left fontweight-600"> Number of files </td>
                                            <td class="right"> {{ numberOfFiles |  number : fractionSize }}</td>
                                        </tr>
                                    </table>
                                </div>
                            </td>
                        </tr>
                    </table>
                </div>
                <div class="pie-chart col-lg-6">

                    <!-- the tag below shows the pie-chart -->
                    <div class="fontweight-600">MIME Types Breakdown </div>
                    <img src="img/spinner.gif" class="spinner"> <!-- spinner image -->
                    <div style="margih-right: 50px;">
                        <nvd3
                                transform="translate(20,50) rotate(40) scale(7)"
                                data="data"
                                id="donutLabelsOutsideExample"
                                options="options"
                                >

                        </nvd3>
                    </div>
                    <!-- <nvd3 options="options" data="data"></nvd3> -->
                </div>
                <div class="bars col-lg-6">
                    <!-- the tag below shows the pie-chart -->
                    <div class="fontweight-600">License Types Breakdowns </div>
                    <img src="img/spinner.gif" class="spinner"> <!-- spinner image -->
                    <nvd3 options="chartOptions" data="chartData"></nvd3>
                </div>
            </div>
            <!-- stats area ends -->
        </div>
        <!-- ******* The middle section ends here ******* -->


        <!-- ******* Section for the DRAT statistics. (left-section) ******* -->
        <div id="stats-right-section" class="col-lg-3">
            <!-- Contents of the Drat stats are here... -->
            <div class="drat-stats">
                <div class = "list-header">
                    <span class="glyphicon glyphicon-stats" id="icon"></span>
                    <span class="sub-header">DRAT Statistics</span>
                </div>
                <ul class="drat-stats-list">
                    <li><span class="fontweight-600">{{numOfRatRunning}}</span> RAT Instances <span class="fontweight-600">running</span> </li>
                    <li><span class="fontweight-600">{{numORatFinished}}</span> RAT Instances <span class="fontweight-600">finished</span> </li>
                </ul>
            </div>
        </div>
        <!-- ******* Left-side section ends here... ******* -->

    </div> <!-- .sections div ends -->

    <!-- modal window for RAT instances -->
    <div class="modal fade" id="logs"  role="dialog">
        <!--<div class="modal fade" id="showLogsDiv" ng-show="showLogsBox" role="dialog">-->
        <div class="modal-dialog">

{'fraction_non_alphanumeric': 0.16261355695317958, 'fraction_numerical': 0.011320754716981131, 'mean_word_length': 1.3104617371649985, 'pattern_counts': {'":': 0, '<': 349, '<?xml version=': 0, '>': 349, 'https://': 4, 'lorem ipsum': 0, 'www.': 0, 'xml': 2}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 32, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6032469', 'n_tokens_mistral': 3860, 'n_tokens_neox': 3551, 'n_words': 838}