From 09bd0164ebc020a54b944b7326dcba496fb5d82c Mon Sep 17 00:00:00 2001
From: Minteck <contact@minteck.org>
Date: Fri, 26 Aug 2022 22:29:23 +0200
Subject: idk when was the last commit so I'm making a new one - Violet Dawn

---
 pages/demo.php | 130 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 130 insertions(+)
 create mode 100644 pages/demo.php

(limited to 'pages/demo.php')

diff --git a/pages/demo.php b/pages/demo.php
new file mode 100644
index 0000000..a408763
--- /dev/null
+++ b/pages/demo.php
@@ -0,0 +1,130 @@
+<?php
+
+$title = "Mode démonstration"; $demoHeader = true; $emergencyHeader = true; require_once $_SERVER['DOCUMENT_ROOT'] . '/includes/header.php';
+
+?>
+
+<script src="/app/banner.js"></script>
+<br>
+<div class="container">
+    <div>
+        <div id="header" style="text-align: center;">
+            <img alt="" src="/assets/uploads/raindrops.png" style="width:128px;">
+            <h3>Raindrops System</h3>
+            <p>Système plural de <?= count(json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/data/gdapd-members.json"), true)) - 1 ?> poneys</p>
+            <hr>
+        </div>
+
+        <div id="list">
+            <p>Cliquez sur quelqu'un pour avoir plus d'information sur elle.</p>
+            <div class="list-group">
+                <?php foreach (scoreOrder(json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/data/gdapd-members.json"), true), "gdapd") as $member): ?>
+                <a onclick="showMember('<?= $member["id"] ?>');" class="list-group-item">
+                    <img src="/assets/uploads/pt-<?= $member["name"] ?>.png" style="width:32px;vertical-align: middle;">
+                    <span style="vertical-align: middle;margin-left: 5px;">
+                        <b><?= getMiniName($member["display_name"] ?? $member["name"]) ?></b>
+                        <?= $member["_metadata"]["host"] ? "(hôte)" : "" ?><?= $member["_metadata"]["protector"] ? "(protectrice)" : "" ?><?= $member["_metadata"]["little"] === 2 ? (isset($member["_metadata"]["median"]) ? "(" . getMiniName(getSystemMember("gdapd", $member["_metadata"]["median"])["display_name"]) . " régressée en âge)" : "(petite)") : "" ?>
+                    </span>
+                </a>
+                <?php endforeach; ?>
+            </div>
+        </div>
+    </div>
+</div>
+
+<div class="modal fade" id="member">
+    <div class="modal-dialog modal-xl">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h4 class="modal-title">
+                    <img id="modal-img" src="/assets/uploads/pt.png" style="width:32px;vertical-align: middle;">
+                    <span style="vertical-align: middle;"><span id="modal-member">Member</span> · Raindrops System</span>
+                </h4>
+                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
+            </div>
+
+            <div class="modal-body">
+                <?php foreach (scoreOrder(json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/data/gdapd-members.json"), true), "gdapd") as $member): ?>
+                    <div class="modal-member-content" id="modal-member-content-<?= $member["id"] ?>">
+                        <script>
+                            <?php global $memberData; $memberData = $member; ?>
+                            window.currentMemberData = JSON.parse(atob(`<?= base64_encode(json_encode(getMemberBannerData($member["id"], "gdapd", true))) ?>`));
+                        </script>
+                        <div id="member-banner"></div>
+                        <script>
+                            refreshBanner(false, true);
+                            document.getElementById("member-banner").id = "";
+                        </script>
+                    </div>
+                <?php endforeach; ?>
+            </div>
+        </div>
+    </div>
+</div>
+
+<style>
+    .list-group-item {
+        color: #fff;
+        background-color: #222;
+        border: 1px solid rgba(255, 255, 255, .125);
+    }
+
+    .list-group-item.disabled {
+        color: #fff;
+        background-color: #222;
+        border-color: rgba(255, 255, 255, .125);
+        opacity: .75;
+    }
+
+    .list-group-item:hover {
+        background-color: #252525;
+        color: #ddd;
+    }
+
+    .list-group-item:active, .list-group-item:focus {
+        background-color: #272727;
+        color: #bbb;
+    }
+    
+    a {
+        cursor: pointer;
+    }
+
+    .modal-header {
+        border-bottom: 1px solid #353738;
+    }
+
+    .modal-content {
+        border: 1px solid rgba(255, 255, 255, .2);
+        background-color: #111;
+    }
+
+    .btn-close {
+        filter: invert(1);
+    }
+</style>
+
+<script>
+    window._phpMembers = JSON.parse(atob(`<?= base64_encode(json_encode(array_values(scoreOrder(json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/data/gdapd-members.json"), true), "gdapd")))) ?>`));
+    window.members = {};
+
+    for (let member of window._phpMembers) {
+        window.members[member.id] = member;
+    }
+
+    function showMember(id) {
+        let member = members[id];
+        document.getElementById("modal-member").innerText = member["display_name"];
+        document.getElementById("modal-img").src = "/assets/uploads/pt-" + member["name"] + ".png";
+
+        Array.from(document.getElementsByClassName("modal-member-content")).forEach((i) => {
+            i.style.display = "none";
+        });
+        document.getElementById("modal-member-content-" + id).style.display = "";
+
+        let modal = new bootstrap.Modal(document.getElementById('member'));
+        modal.show();
+    }
+</script>
+
+<?php require_once $_SERVER['DOCUMENT_ROOT'] . '/includes/footer.php'; ?>
-- 
cgit