rhombus 0.2.21

Next generation extendable CTF framework with batteries included
Documentation 
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
71
72
73
74
75

{% import "icons.html" as icons %}
{% extends "layout.html" %}

{% block content %}
  <div
    class="w-full h-fit my-4 px-4 gap-4 grid grid-cols-1 md:grid-cols-[repeat(auto-fit,minmax(600px,1fr))]"
    id="challenges"
  ></div>

  <div class="hidden" id="initial-challenge-json">
    {{- challenge_json | tojson -}}
  </div>
  <script>
    (function () {
      rhombus.renderChallenges(
        document.getElementById("challenges"),
        JSON.parse(document.getElementById("initial-challenge-json").innerHTML),
      );

      window.addEventListener("focus", window.challengeRefetchHandler);
      window.addEventListener("manualRefresh", window.challengeRefetchHandler);

      window.deregister = () => {
        window.removeEventListener("focus", window.challengeRefetchHandler);
        window.removeEventListener(
          "manualRefresh",
          window.challengeRefetchHandler,
        );
      };

      document.body.addEventListener("htmx:afterSettle", function (detail) {
        const dialog = detail.target.querySelector(
          "dialog[data-onload-showmodal]",
        );
        if (dialog) {
          dialog.addEventListener("close", () => {
            dialog.remove();
          });
          dialog.addEventListener("mousedown", (event) => {
            const rect = event.target.getBoundingClientRect();

            if (
              event.clientX - rect.left <= 0 ||
              rect.right - event.clientX <= 0 ||
              event.clientY - rect.top <= 0 ||
              rect.bottom - event.clientY <= 0
            ) {
              dialog.isMouseDown = true;
            }
          });
          dialog.addEventListener("mouseup", (event) => {
            const rect = event.target.getBoundingClientRect();

            if (
              (event.clientX - rect.left <= 0 ||
                rect.right - event.clientX <= 0 ||
                event.clientY - rect.top <= 0 ||
                rect.bottom - event.clientY <= 0) &&
              dialog.isMouseDown
            ) {
              dialog.close();
            }

            dialog.isMouseDown = false;
          });
          dialog.showModal();
        }
      });

      document.body.addEventListener("closeModal", function () {
        document.querySelector("dialog[open]")?.close();
      });
    })();
  </script>
{% endblock %}