<%# Analytics page for contributor stats %>
<%# ARGUMENTS: contributorID - the current contributor's ID %>

<%- include("../partials/header") -%>
<%- include("../partials/navigationPrivate") -%>

<%# Backend queries %>

<script>
	$(document).ready(function () {

		// hide no results found
        $("#no-results").hide(0);
        $("#success").hide(0);

        let id = "<%= contributorID %>";

        $.get("/contributors/getContributorStats", { id }, (data) => {
            
            if(data.status == "Error") {

                $("#no-results").show(500);
                $("#success").hide(100);
            } else {
                    
                $("#hours").text(data.data.hourSum);
                $("#pending-hours").text(data.data.pendingHourSum);
                $("#average-rating").text(data.data.ratingAverage);

                $("#physics-written").text(data.data.physics.physicsWritten);
                $("#chemistry-written").text(data.data.chemistry.chemistryWritten);
                $("#biology-written").text(data.data.biology.biologyWritten);
                $("#physics-avg-rating").text(data.data.physics.physicsRatingAverage);
                $("#chemistry-avg-rating").text(data.data.chemistry.chemistryRatingAverage);
                $("#biology-avg-rating").text(data.data.biology.biologyRatingAverage);
                $("#physics-pending").text(data.data.physics.pendingPhysicsWritten);
                $("#chemistry-pending").text(data.data.chemistry.pendingChemistryWritten);
                $("#biology-pending").text(data.data.biology.pendingBiologyWritten);
                
                $("#no-results").hide(100);
                $("#success").show(500);
            }
        });
		
	});
</script>

<h1 class="my-5 container display-2 text-center">Your Contributor Stats (<font color="blue"><%= contributorID %></font>)</h1>

<div class="jumbotron container">

    <div class="my-2 alert alert-success" id="success">Successfully fetched your contribution stats</div>
    <div class="my-2 alert alert-danger" id="no-results">No data was found - you should write some questions! :)</div>
    
    <div class="container mt-3">
        <h5>Approximate Confirmed Hours: <span id="hours">XXX</span></h5>
        <h5>Speculative Additional Hours: <span id="pending-hours">XXX</span></h5>
        <h5>Average Rating: <span id="average-rating">XXX</span></h5>
    </div>

    <h3 class="text-center mt-4 mb-3">Question Writing Stats</h3>
    <table class="text-center table">
        <thead>
            <tr>
                <th scope="col"></th>
                <th scope="col">Physics</th>
                <th scope="col">Chemistry</th>
                <th scope="col">Biology</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <th scope="row">Finalized</th>
                <td id="physics-written">XXX</td>
                <td id="chemistry-written">XXX</td>
                <td id="biology-written">XXX</td>
            </tr>
            <tr>
                <th scope="row">Average Rating</th>
                <td id="physics-avg-rating">XXX</td>
                <td id="chemistry-avg-rating">XXX</td>
                <td id="biology-avg-rating">XXX</td>
            </tr>
            <tr>
                <th scope="row">Pending Review</th>
                <td id="physics-pending">XXX</td>
                <td id="chemistry-pending">XXX</td>
                <td id="biology-pending">XXX</td>
            </tr>
        </tbody>
      </table>

</div>