clusters.html.jinja 2.18 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="x-ua-compatible" content="ie=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />

    <title>{{ title }}</title>

    {# <link rel="stylesheet" href="css/main.css" />
    <link rel="icon" href="images/favicon.png" /> #}
  </head>

  <body style="padding: 1em">
    No. of eDoz students: {{ edoz_count }} <br>
    No. of CX students: {{ course_count }} <span style="color: #999999">(may include staff)</span><br>
    No. of plagiarists: {{ plagiarist_count }} <br>
    {% for key, value in percentages.items() %}
      {{ key }}: {{ value }}% <br>
    {% endfor %}
    <table style="border-spacing: 1em 2em">
      <thead>
        <tr>
          <th scope="col"></th>
          <th scope="col"></th>
        </tr>
      </thead>
      <tbody>  
      {% for (cluster, cluster_rows) in clusters %}
        <tr>
          <td>
            Size: {{ cluster_rows.shape[0] }}
            {{ cluster_rows.to_html(classes="cluster", header=False, index_names=False) }}
            {# <table>
              {% for row in cluster_rows %}
              <tr>
                <td>
                  {{ row }}
                </td>
                { # <td></td>
                <td></td> # }
              </tr>
              {% endfor %}
            </table> #}
          </td>
          <td>
            <object data="{{ cluster['svg_file'].iat[0] }}" type="image/svg+xml" style="transform:scale(60%); max-width: 75em; visibility: hidden"></object>
          </td>
        </tr>
      {% endfor %}
      </tbody>
    </table>

    <script>
      window.addEventListener("load", function(){
        var svg_objects = document.querySelectorAll("table > tbody object");
        // console.log(svg_objects);
        svg_objects.forEach(obj => {
          var dim = obj.getBoundingClientRect();
          // console.log(dim.width, dim.height);
          obj.style.visibility = "visible";
          //obj.style.removeProperty("visibility");
          obj.style.transform = "";
          obj.style.width = dim.width + "px";
          obj.style.height = dim.height + "px";
        })
      });    
    </script>
  </body>
</html>