<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta property="og:title" content="Grading Tool"/>
        <meta property="og:description" content="Grading Tool for Human Grading of LLM Generated Proofs"/>
        <meta property="description" content="Grading Tool for Human Grading of LLM Generated Proofs"/>
      
        <meta property="og:image:width" content="1200"/>
        <meta property="og:image:height" content="630"/>
        <meta name="keywords" content="Math, LLM, Olympiads, Competitions, Leaderboards, AI, Machine Learning, Grading"/>
        <link rel="icon" type="image/x-icon" href="{{ url_for('static', filename='images/favicon.ico') }}">
      
        <meta name="viewport" content="width=device-width, initial-scale=1">
      
        <title>Grading Tool - Upload File</title>
        <link href="https://fonts.googleapis.com/css?family=Google+Sans|Noto+Sans|Castoro"
        rel="stylesheet">
      
        <link rel="stylesheet"
        href="https://cdn.jsdelivr.net/gh/jpswalsh/academicons@1/css/academicons.min.css">
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css" integrity="sha384-n8MVd4RsNIU0tAv4ct0nTaAbDJwPJzDEaqSD1odI+WdtXRGWt2kTvGFasHpSy3SV" crossorigin="anonymous">
        <script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js" integrity="sha384-XjKyOOlGwcjNTAIQHIpgOno0Hl1YQqzUOEleOLALmuqehneUG+vnGctmUb0ZY0l8" crossorigin="anonymous"></script>
        <script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/contrib/auto-render.min.js" integrity="sha384-+VBxd3r6XgURycqtZ117nYw44OOcIax56Z4dCRWbxyPt0Koah1uHoK0o4+/RRE05" crossorigin="anonymous"
            onload="renderMathInElement(document.body);"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>

        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
        <link rel="stylesheet" href="{{ url_for('static', filename='css/index.css') }}">
        <link rel="stylesheet" href="{{ url_for('static', filename='css/sidebar.css') }}">
        <link rel="stylesheet" href="{{ url_for('static', filename='css/data.css') }}">
        <link rel="stylesheet" href="{{ url_for('static', filename='css/problem_review.css') }}">
</head>
<body>
    <script>
        document.addEventListener("DOMContentLoaded", function() {
          renderMathInElement(document.body, {
            delimiters: [
              {left: '$$', right: '$$', display: true},
                {left: '$', right: '$', display: false},
                {left: '\\(', right: '\\)', display: false},
                {left: '\\[', right: '\\]', display: true}
            ],
            output: "htmlAndMathml",
            throwOnError: false
          });
        });
      </script>
    <div class="main-container">
        <div class="top-controls">
            <h3 class="mb-0">Reviewing: {{ file_name }}</h3>
            <button id="downloadButton" class="btn btn-success">
                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-download" viewBox="0 0 16 16">
                    <path d="M.5 9.9a.5.5 0 0 1 .5.5v2.5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-2.5a.5.5 0 0 1 1 0v2.5a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2v-2.5a.5.5 0 0 1 .5-.5z"/>
                    <path d="M7.646 11.854a.5.5 0 0 0 .708 0l3-3a.5.5 0 0 0-.708-.708L8.5 10.293V1.5a.5.5 0 0 0-1 0v8.793L5.354 8.146a.5.5 0 1 0-.708.708l3 3z"/>
                </svg>
                Download Edits
            </button>
        </div>
        <div id="paginationControlsContainerTop" class="mt-4 d-flex justify-content-center">
        </div>
        <div id="problemsContainer">
            </div>
        <div id="paginationControlsContainer" class="mt-4 d-flex justify-content-center">
            </div>
    </div>

    <script>
        // Data passed from Flask template
        let problemsData = {{ problems_data | tojson }};
        const fileId = "{{ file_id }}";
    </script>
    <script src="{{ url_for('static', filename='js/data.js') }}"></script>
    <script src="{{ url_for('static', filename='js/review.js') }}"></script>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>

</body>
</html>