<head>
  <link rel="stylesheet" type="text/css" href="/static/sensei-grid.min.css"/>
  <link rel="stylesheet" type="text/css" href="/static/bootstrap.min.css"/>

  <script src="/static/jquery.min.js"></script>
  <script src="/static/lodash.min.js"></script>
  <script src="/static/sensei-grid.min.js"></script>
</head>
<body>
<h1>Welcome to the Regolith Grader!</h1>
{% for dbname in rc.client.keys() if dbname != 'local' %}
  <h3>{{ dbname }}{% if status %} [{{status}}]{% endif %}</h3>
  {% for course in sorted(rc.client.all_documents('courses'), key=by_id) %}
  {% if course['active'] %}
    {% set course_id = course['_id'] %}
    <h4>Course: {{course_id}}</h4>
    <div class="course_{{course_id}}"></div>
    <script type="text/javascript">
    var courseColumns = [
        {name: "student", type: "string"},
        {%- for assign in sorted(rc.client.all_documents('assignments'), key=by_id) -%}
        {%- if course_id in assign['courses'] -%}
        {%- for i, question in enumerate(assign['questions']) -%}
            {name: "{{assign['_id']}}[{{i}}]", type: "float"},
        {%- endfor %}{% endif %}{% endfor -%}
        {name: "student", type: "string"}
        ];
    courseColumns.splice(courseColumns.length/4, 0, {name: "student", type: "string"})
    courseColumns.splice(courseColumns.length/2, 0, {name: "student", type: "string"})
    courseColumns.splice(3*courseColumns.length/4, 0, {name: "student", type: "string"})

    var courseData = [
        {% for student in course['students'] %}
        {student: "{{student}}",
          {%- for grade in rc.client.all_documents('grades') -%}
          {%- if course_id == grade['course'] and student == grade['student'] -%}
          {%- for i, score in enumerate(grade['scores']) -%}
            "{{grade['assignment']}}[{{i}}]": {{score}},
          {%- endfor %}{% endif %}{% endfor -%}
        },{% endfor %}
        ];

    var options = {disableKeys: ["student"]};
    var grid = $(".course_{{course_id}}").grid(courseData, courseColumns);
    grid.registerEditor(BasicEditor);
    grid.registerEditor(DisabledEditor);
    grid.events.on("editor:save", function(data, $cell) {
      var row = grid.getCellRow($cell);
      var rowData = grid.getRowData(row);
      var http = new XMLHttpRequest();
      http.open("POST", "/", true);
      http.setRequestHeader("Content-type","application/x-www-form-urlencoded");
      var params = "dbname={{dbname}}&" +
                   "course={{course_id}}&" +
                   "assignment=" + grid.getCellColumn($cell) + "&" +
                   "student=" + rowData.student + "&" +
                   "rowdata=" + JSON.stringify(rowData);
      http.send(params);
      http.onload = function() {};
    });
    grid.render();
    </script>
    <br/><br/>
 {% endif %}
 {% endfor %}
 <!-- end courses loop -->
{% endfor %}
<!-- end db loop -->

<br/><br/>
<hr/>
<br/><br/>
<form action="shutdown" method="post">
  <button name="shutdown" value="shutdown">Shutdown Server</button>
</form>
</body>
