summaryrefslogtreecommitdiff
path: root/includes/components
diff options
context:
space:
mode:
Diffstat (limited to 'includes/components')
-rw-r--r--includes/components/2023ui.inc114
-rw-r--r--includes/components/explicit.php20
-rw-r--r--includes/components/footer.inc10
-rw-r--r--includes/components/fullbanner.inc2
-rw-r--r--includes/components/header.inc464
-rw-r--r--includes/components/mobilenav.inc5
-rw-r--r--includes/components/navigation.inc814
-rw-r--r--includes/components/pane.inc5
-rw-r--r--includes/components/sysbanner.inc11
9 files changed, 1011 insertions, 434 deletions
diff --git a/includes/components/2023ui.inc b/includes/components/2023ui.inc
new file mode 100644
index 0000000..556a8b5
--- /dev/null
+++ b/includes/components/2023ui.inc
@@ -0,0 +1,114 @@
+<div id="menu-bar" style="position: fixed; top: 0; left: 101px; right: 20px; height: 52px; display: grid; grid-template-columns: 1fr 1fr 1fr;">
+ <div style="display: grid; grid-template-columns: max-content 1fr;">
+ <div style="height: 52px; display: flex; align-items: center;">
+ <a href="/" style="color: inherit; text-decoration: inherit;">
+ <img src="/assets/logo/newlogo.png" style="width: 32px;">
+ <span style="margin-left: 5px; vertical-align: middle; position: relative; top: -1px; font-weight: bold;">Cold Haze</span>
+ <span data-bs-toggle="tooltip" data-bs-placement="bottom" title="This is the new Cold Haze experience and it is currently experimental" class="badge bg-warning" style="margin-left: 5px; vertical-align: middle; position: relative; top: -1px; font-weight: bold;">Beta</span>
+ </a>
+ </div>
+ <div style="display: flex; align-items: center;">
+ <?php global $isLowerLoggedIn; global $isLoggedIn; global $_PROFILE; if ($isLoggedIn || $isLowerLoggedIn): ?>
+ <div style="margin-left: auto; margin-right: auto;">
+ <a data-bs-toggle="tooltip" data-bs-placement="bottom" title="Alerts" class="ui2023-side-bar-item" href="/-/alerts" style="padding: 10px; height: 48px; width: 48px; display: inline-block; border-radius: 999px;">
+ <img src="<?= icon("alerts") ?>" style="max-width: 28px; max-height: 28px;">
+ </a><a data-bs-toggle="tooltip" data-bs-placement="bottom" title="Member lists" class="ui2023-side-bar-item" href="/-/lists" style="padding: 10px; height: 48px; width: 48px; display: inline-block; border-radius: 999px;">
+ <img src="<?= icon("lists") ?>" style="max-width: 28px; max-height: 28px;">
+ </a>
+ </div>
+ <?php endif; ?>
+ </div>
+ </div>
+ <div style="height: 52px; display: flex; align-items: center;">
+ <form action="/-/search" style="width: 100%;">
+ <input name="q" class="form-control" type="text" value="" placeholder="Search on Cold Haze..." style="width: 100%; margin-left: auto; margin-right: auto; border-color: var(--palette-4) !important; background-color: var(--palette-4) !important;">
+ </form>
+ </div>
+ <div style="display: grid; grid-template-columns: 1fr max-content;">
+ <div style="display: flex; align-items: center;">
+ <?php global $isLowerLoggedIn; global $isLoggedIn; global $_PROFILE; if ($isLoggedIn || $isLowerLoggedIn): ?>
+ <div style="margin-left: auto; margin-right: auto;">
+ <a data-bs-toggle="tooltip" data-bs-placement="bottom" title="Jobs" class="ui2023-side-bar-item" href="/-/jobs" style="padding: 10px; height: 48px; width: 48px; display: inline-block; border-radius: 999px;">
+ <img src="<?= icon("jobs") ?>" style="max-width: 28px; max-height: 28px;">
+ </a><a data-bs-toggle="tooltip" data-bs-placement="bottom" title="Account" class="ui2023-side-bar-item" href="/-/account" style="padding: 10px; height: 48px; width: 48px; display: inline-block; border-radius: 999px;">
+ <img src="<?= icon("sessions") ?>" style="max-width: 28px; max-height: 28px;">
+ </a>
+ </div>
+ <?php endif; ?>
+ </div>
+ <div style="height: 52px; display: flex; align-items: center;">
+ <?php global $isLowerLoggedIn; global $isLoggedIn; global $_PROFILE; if ($isLoggedIn || $isLowerLoggedIn): ?>
+ <a href="https://account.equestria.dev/hub/users/<?= $_PROFILE["id"] ?>" target="_blank" style="color: inherit; text-decoration: inherit;">
+ <?php $fronters = json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/data/" . ($_PROFILE["login"] === "raindrops" ? "gdapd" : ($_PROFILE["login"] === "cloudburst" ? "ynmuc" : "other")) . "/fronters.json"), true); if (isset($fronters["members"][0])): ?>
+ <span style="margin-right: 5px; vertical-align: middle; margin-top: -2px;"><?= $fronters["members"][0]["display_name"] ?? $fronters["members"][0]["name"] ?></span>
+ <img src="<?= getAsset(($_PROFILE["login"] === "raindrops" ? "gdapd" : ($_PROFILE["login"] === "cloudburst" ? "ynmuc" : "other")), $fronters["members"][0]["id"]) ?>" style="width: 32px; height: 32px; border-radius: 999px; background-color: var(--palette-2);">
+ <?php else: ?>
+ <span style="margin-right: 5px; vertical-align: middle; margin-top: -2px;"><?= $_PROFILE["name"] ?></span>
+ <img src="https://account.equestria.dev/hub/api/rest/avatar/<?= $_PROFILE["id"] ?>?dpr=2&size=32" style="width: 32px; height: 32px; border-radius: 999px; background-color: var(--palette-2);">
+ <?php endif; ?>
+ </a>
+ <?php else: ?>
+ <a href="/login" style="color: inherit; text-decoration: inherit;">
+ <span style="margin-right: 5px; vertical-align: middle; margin-top: -2px;">Log in</span>
+ <img src="<?= icon("login", false) ?>" class="light-only" style="width: 24px; height: 24px; margin: 4px;">
+ <img src="<?= icon("login", true) ?>" class="dark-only" style="width: 24px; height: 24px; margin: 4px;">
+ </a>
+ <?php endif; ?>
+ </div>
+ </div>
+</div>
+
+<style>
+ .ui2023-side-bar-system:hover, .ui2023-side-bar-item:hover {
+ background-color: var(--palette-2);
+ }
+
+ .ui2023-side-bar-system:active {
+ background-color: var(--palette-1);
+ }
+
+ .ui2023-side-bar-system:active {
+ background-color: var(--palette-3);
+ }
+</style>
+
+<div id="side-bar" style="position: fixed; top: 62px; bottom: 20px; left: 0; width: 64px; display: flex; justify-content: center;">
+ <div>
+ <div style="background-color: var(--palette-4); height: max-content; border-radius: 999px;">
+ <a data-bs-toggle="tooltip" data-bs-placement="right" title="Raindrops System" class="ui2023-side-bar-system" href="/raindrops" style="padding: 8px; height: 48px; width: 48px; display: block; border-top-left-radius: 999px; border-top-right-radius: 999px;">
+ <img src="<?= getAsset("gdapd") ?>" style="max-width: 32px; max-height: 32px;">
+ </a>
+ <?php global $app; if ($isLoggedIn || $isLowerLoggedIn): ?>
+ <a data-bs-toggle="tooltip" data-bs-placement="right" title="<?= $app["other"]["name"] ?>" class="ui2023-side-bar-system" href="/<?= $app["other"]["slug"] ?>" style="padding: 8px; height: 48px; width: 48px; display: block;">
+ <img src="<?= getAsset("other") ?>" style="max-width: 32px; max-height: 32px;">
+ </a>
+ <?php endif; ?>
+ <a data-bs-toggle="tooltip" data-bs-placement="right" title="Cloudburst System" class="ui2023-side-bar-system" href="/cloudburst" style="padding: 8px; height: 48px; width: 48px; display: block; border-bottom-left-radius: 999px; border-bottom-right-radius: 999px;">
+ <img src="<?= getAsset("ynmuc") ?>" style="max-width: 32px; max-height: 32px;">
+ </a>
+ </div>
+
+ <div style="margin-top: 20px;">
+ <a data-bs-toggle="tooltip" data-bs-placement="right" title="Relations" class="ui2023-side-bar-item" href="/-/relations" style="padding: 10px; height: 48px; width: 48px; display: block; border-radius: 999px;">
+ <img src="<?= icon("relations") ?>" style="max-width: 28px; max-height: 28px;">
+ </a>
+
+ <?php if ($isLowerLoggedIn || $isLoggedIn): ?>
+ <div style="margin: 10px 0; width: 48px; height: 2px; background-color: var(--palette-2);"></div>
+
+ <a data-bs-toggle="tooltip" data-bs-placement="right" title="Schedules" class="ui2023-side-bar-item" href="/-/schedules" style="padding: 10px; height: 48px; width: 48px; display: block; border-radius: 999px;">
+ <img src="<?= icon("schedule") ?>" style="max-width: 28px; max-height: 28px;">
+ </a>
+ <a data-bs-toggle="tooltip" data-bs-placement="right" title="Money tracker" class="ui2023-side-bar-item" href="/-/money" style="padding: 10px; height: 48px; width: 48px; display: block; border-radius: 999px;">
+ <img src="<?= icon("money") ?>" style="max-width: 28px; max-height: 28px;">
+ </a>
+ <a data-bs-toggle="tooltip" data-bs-placement="right" title="Documents" class="ui2023-side-bar-item" href="/-/docs" style="padding: 10px; height: 48px; width: 48px; display: block; border-radius: 999px;">
+ <img src="<?= icon("documents") ?>" style="max-width: 28px; max-height: 28px;">
+ </a>
+ <a data-bs-toggle="tooltip" data-bs-placement="right" title="System travelling" class="ui2023-side-bar-item" href="/-/travelling" style="padding: 10px; height: 48px; width: 48px; display: block; border-radius: 999px;">
+ <img src="<?= icon("travelling") ?>" style="max-width: 28px; max-height: 28px;">
+ </a>
+ <?php endif; ?>
+ </div>
+ </div>
+</div> \ No newline at end of file
diff --git a/includes/components/explicit.php b/includes/components/explicit.php
index 4c55896..3e7675c 100644
--- a/includes/components/explicit.php
+++ b/includes/components/explicit.php
@@ -21,16 +21,18 @@
</div>
</div>
-<style>
- #explicit-modal .modal-header {
- border-bottom: 1px solid #353738;
- }
+<?php global $use2023UI; if (!$use2023UI): ?>
+ <style>
+ #explicit-modal .modal-header {
+ border-bottom: 1px solid #353738;
+ }
- #explicit-modal .modal-content {
- border: 1px solid rgba(255, 255, 255, .2);
- background-color: #111;
- }
-</style>
+ #explicit-modal .modal-content {
+ border: 1px solid rgba(255, 255, 255, .2);
+ background-color: #111;
+ }
+ </style>
+<?php endif; ?>
<!--suppress JSVoidFunctionReturnValueUsed -->
<script>
diff --git a/includes/components/footer.inc b/includes/components/footer.inc
index 7cce7d4..26114a5 100644
--- a/includes/components/footer.inc
+++ b/includes/components/footer.inc
@@ -3,10 +3,12 @@ global $start;
$GLOBALS["ColdHazePerformance"]["page"] = (microtime(true) - $start) * 1000;
$start = microtime(true);
global $pageFile;
+global $use2023UI;
?>
<script src="/assets/editor/ua-parser.js"></script>
+<?php if (!$use2023UI): ?>
<div id="footer-pre"></div>
<div id="footer">
<hr>
@@ -22,9 +24,15 @@ global $pageFile;
?>
© 2022-<?= date("Y") ?> <a href="https://equestria.dev" target="_blank" class="text-muted"><?= $lang["footer"]["copyright"] ?></a> · build <?= $version["build"] ?>.<?= $version["revision"] ?>, took <?= round($time * 1000, 2) ?> ms
+ <?php global $use2023UI; if (($isLoggedIn || $isLowerLoggedIn) && !$use2023UI && isset($_COOKIE["enable2023UIcta"]) && $_COOKIE["enable2023UIcta"] === "yes") { ?>
+ <br>
+ <a class="text-muted" href="#" data-bs-toggle="modal" data-bs-target="#new-ui-cta" onclick="newShape();">Enable Cold Haze's experimental new shape</a>
+ <?php } ?>
<br><br><br><br><br>
</div>
</div>
+<?php else: ?><br><br><?php endif; ?>
+</main>
<script>
let tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
@@ -32,11 +40,13 @@ global $pageFile;
return new bootstrap.Tooltip(tooltipTriggerEl)
});
+ <?php if (!$use2023UI): ?>
Array.from(document.querySelectorAll('[data-bs-toggle="tooltip"]')).forEach((item) => {
if (!item.classList.contains("tooltip-nohelp")) {
item.style.cursor = "help";
}
});
+ <?php endif; ?>
//window.fetch("/api/rename?name=" + encodeURIComponent("Cold Haze Web (" + UAParser().browser.name + " on " + UAParser().os.name + ")"));
diff --git a/includes/components/fullbanner.inc b/includes/components/fullbanner.inc
index b8f1f27..99cdb53 100644
--- a/includes/components/fullbanner.inc
+++ b/includes/components/fullbanner.inc
@@ -18,11 +18,9 @@
<div class="alert alert-primary" style="margin-bottom: 0 !important;">
<?= getMiniName($memberData["display_name"] ?? $memberData["name"]) ?> <?= $lang["fullbanner"]["visit"][0] ?> <?= $systemID === "ynmuc" ? "Raindrops System" : "Cloudburst System" ?><?= str_replace("%1", getMemberPronouns($memberData["pronouns"])["subjective"], str_replace("%2", getMemberPronouns($memberData["pronouns"])["third"] ? "is" : "are", $lang["fullbanner"]["visit"][1])) ?><?= $systemCommonName ?>.
</div>
- <br>
<?php elseif ($travelling[$memberID]['travelling'] && $travelling[$memberID]['equestria']): ?>
<br>
<div class="alert alert-primary" style="margin-bottom: 0 !important;">
<?= getMiniName($memberData["display_name"] ?? $memberData["name"]) ?> is on a trip to <?= $metadata["fictive"] ? "Equestria" : "Celeste" ?>. <?= str_replace("%1", getMemberPronouns($memberData["pronouns"])["subjective"], str_replace("%2", getMemberPronouns($memberData["pronouns"])["third"] ? "is" : "are", "Therefore %1 %2 currently not in the ")) ?><?= $systemCommonName ?>.
</div>
- <br>
<?php endif; ?> \ No newline at end of file
diff --git a/includes/components/header.inc b/includes/components/header.inc
index 5179d54..0fa60ae 100644
--- a/includes/components/header.inc
+++ b/includes/components/header.inc
@@ -1,6 +1,12 @@
<?php global $title; global $pages; global $readOnly;
$start = microtime(true);
$useNewUI = !isset($_GET['old']);
+$use2023UI = isset($_COOKIE["new2023UI"]) && !isset($_GET["no2023"]);
+global $use2023UI;
+
+if (!isset($_COOKIE["new2023UIctaFirstVisit"])) {
+ setcookie("new2023UIctaFirstVisit", time(), time() + 86400*365, "/", "", true, true);
+}
$isNormallyLoggedIn = false;
@@ -53,25 +59,28 @@ require_once $_SERVER['DOCUMENT_ROOT'] . "/includes/util/functions.inc";
<!doctype html>
<html lang="en">
<head>
- <link href="/assets/logo/custom.css" rel="preload" as="style">
- <link href="/assets/logo/light.css" rel="preload" as="style">
- <link href="/assets/logo/custom.css" rel="stylesheet">
+ <script>
+ document.cookie = "new2023UIDarkMode=" + (window.matchMedia("(prefers-color-scheme: dark)").matches ? "yes" : "no") + "; max-age=" + (60*60*24*365) + "; path=/; samesite; secure";
+ </script>
+ <link href="/assets/logo/custom<?= $use2023UI ? "-2023" : "" ?>.css" rel="preload" as="style">
+ <link href="/assets/logo/light<?= $use2023UI ? "-2023" : "" ?>.css" rel="preload" as="style">
+ <link href="/assets/logo/custom<?= $use2023UI ? "-2023" : "" ?>.css" rel="stylesheet">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
- <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.2.3/dist/css/bootstrap.min.css" rel="stylesheet">
+ <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"></script>
<title><?= $title && $title !== "-" ? $title . " · " : "" ?>Cold Haze</title>
<link rel="shortcut icon" href="/assets/logo/newlogo<?= $isLoggedIn || $isLowerLoggedIn ? "3" : "" ?>.png" type="image/png">
- <link href="/assets/logo/light.css" rel="stylesheet">
+ <link href="/assets/logo/light<?= $use2023UI ? "-2023" : "" ?>.css" rel="stylesheet">
</head>
-<body style="background-color: #000;">
+<body<?php if (!$use2023UI): ?> style="background-color: #000;"<?php else: ?> style="background-color: var(--palette-1);"<?php endif; ?>>
<?php require_once $_SERVER['DOCUMENT_ROOT'] . "/includes/components/navigation.inc"; global $navigation; ?>
<?php if (!$useNewUI): ?>
<div style="margin-top: 60px;" id="top-of-page"></div>
<?php endif; ?>
- <?php if ($useNewUI): ?>
+ <?php if ($useNewUI && !$use2023UI): ?>
<aside id="navigation-pane">
<?php require_once $_SERVER['DOCUMENT_ROOT'] . "/includes/components/pane.inc"; ?>
</aside>
@@ -230,6 +239,367 @@ require_once $_SERVER['DOCUMENT_ROOT'] . "/includes/util/functions.inc";
</style>
<?php endif; ?>
+ <?php if ($use2023UI) {
+ $palettes = json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/themes.json"), true);
+
+ $selectedPalette = $palettes["default"];
+
+ global $memberID; if (isset($memberID)) {
+ $member = getMemberWithoutSystem($memberID);
+
+ if (isset($_GET["debug"])) {
+ ob_clean();
+ echo("<pre>");
+
+ echo("Color difference debug\n======================\n\n");
+ echo("Member color: #" . $member["color"] . "\n\n");
+ }
+
+ $sr = hexdec(substr($member["color"], 0, 2));
+ $sg = hexdec(substr($member["color"], 2, 2));
+ $sb = hexdec(substr($member["color"], 4, 2));
+
+ $differencesAll = [];
+
+ foreach ($palettes["list"] as $id => $palette) {
+ $colors = [
+ ...explode(",", $palette["dark"]),
+ ...explode(",", $palette["light"])
+ ];
+
+ $importantColors = [
+ $colors[5],
+ $colors[9],
+ $colors[15],
+ $colors[19]
+ ];
+ $differences = [];
+
+ if (isset($_GET["debug"])) echo("Palette " . $id . ": " . implode(", ", array_map(function ($i) { return "#$i"; }, $importantColors)) . "\n");
+
+ foreach ($importantColors as $color) {
+ $r = hexdec(substr($color, 0, 2));
+ $g = hexdec(substr($color, 2, 2));
+ $b = hexdec(substr($color, 4, 2));
+
+ $dr = abs($r - $sr);
+ $dg = abs($g - $sg);
+ $db = abs($b - $sb);
+
+ $differences[] = $dr + $dg + $db;
+ }
+
+ $total = array_reduce($differences, function ($a, $b) { return $a + $b; }) / count($differences);
+
+ if (isset($_GET["debug"])) {
+ echo(" " . implode(", ", $differences) . "\n");
+ echo(" " . $total . "\n\n");
+ }
+
+ $differencesAll[] = [
+ "id" => $id,
+ "difference" => $total
+ ];
+ }
+
+ usort($differencesAll, function ($a, $b) {
+ return $a["difference"] - $b["difference"];
+ });
+
+ if (isset($_GET["debug"])) {
+ echo("Smaller: " . $differencesAll[0]["id"] . ", " . $differencesAll[0]["difference"]);
+ }
+
+ $selectedPalette = $differencesAll[0]["id"];
+
+ if (isset($_GET["debug"])) {
+ echo("</pre>");
+ die();
+ }
+ }
+
+ global $userPalette;
+ $userPalette = $palettes["list"][$selectedPalette];
+
+ function rgb($color) {
+ return hexdec(substr($color, 0, 2)) . "," . hexdec(substr($color, 2, 2)) . "," . hexdec(substr($color, 4, 2));
+ }
+
+ function icon($name, $dark = null, $body = false) {
+ global $userPalette;
+
+ if (isset($dark)) {
+ return "/assets/icons/new/" . $name . ".svg?color=" . explode(",", $userPalette[$dark ? "dark" : "light"])[$body ? 6 : 9];
+ } else {
+ return "/assets/icons/new/" . $name . ".svg?color=" . explode(",", $userPalette[isset($_COOKIE["new2023UIDarkMode"]) && $_COOKIE["new2023UIDarkMode"] === "yes" ? "dark" : "light"])[$body ? 6 : 9];
+ }
+ }
+
+ foreach ([ "dark", "light" ] as $theme) { $palette = explode(",", $userPalette[$theme]); ?>
+ <style>
+ @media (prefers-color-scheme: <?= $theme ?>)<?= $theme === "light" ? ", (prefers-color-scheme: no-preference)" : "" ?> {
+ :root {
+ --bs-body-color: #<?= $palette[6] ?> !important;
+ --bs-body-color-rgb: <?= rgb($palette[6]) ?> !important;
+ --bs-body-bg: #<?= $palette[0] ?> !important;
+ --bs-body-bg-rgb: <?= rgb($palette[0]) ?> !important;
+ --bs-white: #<?= $palette[0] ?> !important;
+ --bs-white-rgb: <?= rgb($palette[0]) ?> !important;
+
+ --bs-secondary-color: #<?= $palette[6] ?> !important;
+ --bs-secondary-color-rgb: <?= rgb($palette[6]) ?> !important;
+ --bs-secondary-bg: #<?= $palette[1] ?> !important;
+ --bs-secondary: #<?= $palette[6] ?> !important;
+ --bs-secondary-bg-rgb: <?= rgb($palette[1]) ?> !important;
+
+ --bs-tertiary-color: #<?= $palette[6] ?> !important;
+ --bs-tertiary-color-rgb: <?= rgb($palette[6]) ?> !important;
+ --bs-tertiary-bg: #<?= $palette[2] ?> !important;
+ --bs-tertiary-bg-rgb: <?= rgb($palette[2]) ?> !important;
+
+ --bs-light: #<?= $palette[2] ?> !important;
+ --bs-light-rgb: <?= rgb($palette[2]) ?> !important;
+
+ --bs-link-color: #<?= $palette[9] ?> !important;
+ --bs-link-hover-color: #<?= $palette[9] ?>77 !important;
+ --bs-link-active-color: #<?= $palette[9] ?>77 !important;
+
+ --palette-0: #<?= $palette[0] ?> !important;
+ --palette-1: #<?= $palette[1] ?> !important;
+ --palette-2: #<?= $palette[2] ?> !important;
+ --palette-3: #<?= $palette[3] ?> !important;
+ --palette-4: #<?= $palette[4] ?> !important;
+ --palette-5: #<?= $palette[5] ?> !important;
+ --palette-6: #<?= $palette[6] ?> !important;
+ --palette-7: #<?= $palette[7] ?> !important;
+ --palette-8: #<?= $palette[8] ?> !important;
+ --palette-9: #<?= $palette[9] ?> !important;
+
+ --palette-0-rgb: <?= rgb($palette[0]) ?> !important;
+ --palette-1-rgb: <?= rgb($palette[1]) ?> !important;
+ --palette-2-rgb: <?= rgb($palette[2]) ?> !important;
+ --palette-3-rgb: <?= rgb($palette[3]) ?> !important;
+ --palette-4-rgb: <?= rgb($palette[4]) ?> !important;
+ --palette-5-rgb: <?= rgb($palette[5]) ?> !important;
+ --palette-6-rgb: <?= rgb($palette[6]) ?> !important;
+ --palette-7-rgb: <?= rgb($palette[7]) ?> !important;
+ --palette-8-rgb: <?= rgb($palette[8]) ?> !important;
+ --palette-9-rgb: <?= rgb($palette[9]) ?> !important;
+ }
+
+ .dropdown-menu {
+ --bs-dropdown-bg: #<?= $palette[1] ?> !important;
+ --bs-dropdown-link-color: #<?= $palette[6] ?> !important;
+ --bs-dropdown-link-disabled-color: #<?= $palette[6] ?>77 !important;
+ --bs-dropdown-link-hover-color: #<?= $palette[6] ?> !important;
+ --bs-dropdown-link-hover-bg: #<?= $palette[3] ?> !important;
+ --bs-dropdown-link-active-bg: #<?= $palette[6] ?> !important;
+ --bs-dropdown-link-active-color: #<?= $palette[6] ?> !important;
+ }
+
+ .coins {
+ color: #<?= $palette[6] ?> !important;
+ background-color: #<?= $palette[1] ?> !important;
+ }
+
+ .list-group-item-primary {
+ color: var(--bs-body-bg);
+ background-color: #<?= $palette[6] ?>;
+ }
+
+ .list-group-item-action.list-group-item-primary:hover, .list-group-item-action.list-group-item-primary:active, .list-group-item-action.list-group-item-primary:focus {
+ background-color: #<?= $palette[6] ?>dd;
+ color: var(--bs-body-bg);
+ }
+
+ .profile-border-inner-active {
+ background-color: var(--bs-tertiary-bg) !important;
+ }
+
+ .bg-secondary {
+ background-color: #<?= $palette[9] ?> !important;
+ color: #<?= $palette[0] ?> !important;
+ }
+
+ .list-group-item-primary small {
+ color: #<?= $palette[0] ?>77 !important;
+ }
+
+ .dropdown-item:active span, .dropdown-item:active img {
+ filter: invert(1);
+ }
+
+ .list-group, .list-group-item, .list-group-item-action {
+ --bs-list-group-color: var(--bs-body-color) !important;
+ --bs-list-group-action-color: var(--bs-body-color) !important;
+ --bs-list-group-action-hover-color: var(--bs-body-color) !important;
+ --bs-list-group-action-active-color: var(--bs-body-color) !important;
+ --bs-list-group-border-color: #<?= $palette[5] ?> !important;
+ --bs-list-group-bg: #<?= $palette[2] ?> !important;
+ --bs-list-group-action-hover-bg: #<?= $palette[1] ?> !important;
+ --bs-list-group-action-active-bg: #<?= $palette[1] ?> !important;
+ }
+
+ .btn-outline-dark, .btn-outline-secondary {
+ --bs-btn-color: var(--bs-body-color);
+ --bs-btn-border-color: var(--bs-body-color);
+ --bs-btn-hover-color: var(--bs-body-bg);
+ --bs-btn-hover-bg: var(--bs-body-color);
+ --bs-btn-hover-border-color: var(--bs-body-color);
+ --bs-btn-focus-shadow-rgb: <?= rgb($palette[6]) ?>;
+ --bs-btn-active-color: var(--bs-body-bg);
+ --bs-btn-active-bg: var(--bs-body-color);
+ --bs-btn-active-border-color: var(--bs-body-color);
+ --bs-btn-active-shadow: inset 0 3px 5px rgba(<?= rgb($palette[6]) ?>, 0.125);
+ --bs-btn-disabled-color: #<?= $palette[6] ?>77;
+ --bs-btn-disabled-bg: transparent;
+ --bs-btn-disabled-border-color: #<?= $palette[6] ?>77;
+ --bs-gradient: none;
+ }
+
+ .alert-primary {
+ --bs-alert-color: var(--bs-body-bg);
+ --bs-alert-bg: var(--bs-body-color);
+ --bs-alert-border-color: var(--bs-body-color);
+ }
+
+ .alert-danger, .alert-success, .alert-warning, .list-group-item-warning {
+ --bs-alert-color: var(--bs-body-bg) !important;
+ --bs-alert-bg: #<?= $palette[9] ?> !important;
+ --bs-alert-border-color: #<?= $palette[9] ?> !important;
+ --bs-list-group-border-color: #<?= $palette[8] ?> !important;
+ }
+
+ .list-group-item-warning, .list-group-item-success, .list-group-item-danger, .list-group-item-warning:hover, .list-group-item-success:hover, .list-group-item-danger:hover, .list-group-item-warning:active, .list-group-item-success:active, .list-group-item-danger:active {
+ color: var(--bs-body-color) !important;
+ background-color: #<?= $palette[8] ?> !important;
+ }
+
+ .list-group-item-warning:hover, .list-group-item-success:hover, .list-group-item-danger:hover {
+ opacity: .75;
+ }
+
+ .list-group-item-warning:active, .list-group-item-success:active, .list-group-item-danger:active {
+ opacity: .5;
+ }
+
+ .list-group-item[open] {
+ opacity: 1 !important;
+ }
+
+ .alert-secondary {
+ --bs-alert-color: var(--bs-secondary-color);
+ --bs-alert-bg: var(--bs-secondary-bg);
+ --bs-alert-border-color: var(--bs-secondary-bg);
+ }
+
+ .badge.bg-success, .badge.bg-danger, .badge.bg-warning {
+ background-color: var(--bs-body-color) !important;
+ color: var(--bs-body-bg) !important;
+ }
+
+ .badge.bg-secondary, .badge.bg-black {
+ background-color: var(--bs-body-bg) !important;
+ color: var(--bs-body-color) !important;
+ }
+
+ .text-muted {
+ color: #<?= $palette[6] ?>77 !important;
+ }
+
+ body.bg-light {
+ background-color: var(--bs-body-bg) !important;
+ }
+
+ .btn-primary {
+ --bs-btn-color: #<?= $palette[8] ?>;
+ --bs-btn-bg: #<?= $palette[9] ?>;
+ --bs-btn-border-color: #<?= $palette[9] ?>;
+ --bs-btn-hover-color: #<?= $palette[8] ?>;
+ --bs-btn-hover-bg: #<?= $palette[9] ?>;
+ --bs-btn-hover-border-color: #<?= $palette[9] ?>;
+ --bs-btn-focus-shadow-rgb: <?= rgb($palette[9]) ?>;
+ --bs-btn-active-color: #<?= $palette[8] ?>;
+ --bs-btn-active-bg: #<?= $palette[9] ?>;
+ --bs-btn-active-border-color: #<?= $palette[9] ?>;
+ --bs-btn-active-shadow: inset 0 3px 5px rgba(<?= rgb($palette[9]) ?>, 0.25);
+ --bs-btn-disabled-color: #<?= $palette[8] ?>;
+ --bs-btn-disabled-bg: #<?= $palette[9] ?>77;
+ --bs-btn-disabled-border-color: #<?= $palette[9] ?>77;
+ }
+
+ .btn-outline-primary {
+ --bs-btn-color: #<?= $palette[9] ?>;
+ --bs-btn-border-color: #<?= $palette[9] ?>;
+ --bs-btn-hover-color: var(--bs-body-bg);
+ --bs-btn-hover-bg: #<?= $palette[9] ?>;
+ --bs-btn-hover-border-color: #<?= $palette[9] ?>;
+ --bs-btn-focus-shadow-rgb: <?= rgb($palette[6]) ?>;
+ --bs-btn-active-color: var(--bs-body-bg);
+ --bs-btn-active-bg: #<?= $palette[9] ?>;
+ --bs-btn-active-border-color: #<?= $palette[9] ?>;
+ --bs-btn-active-shadow: inset 0 3px 5px rgba(<?= rgb($palette[6]) ?>, 0.125);
+ --bs-btn-disabled-color: #<?= $palette[6] ?>77;
+ --bs-btn-disabled-bg: transparent;
+ --bs-btn-disabled-border-color: #<?= $palette[6] ?>77;
+ --bs-gradient: none;
+ }
+
+ .form-control, .form-control:focus, .form-select, .form-select:focus {
+ color: var(--bs-body-color);
+ background-color: #<?= $palette[2] ?>;
+ border-color: #<?= $palette[3] ?>;
+ }
+
+ .form-control:focus, .form-select:focus {
+ box-shadow: 0 0 0 0.25rem rgba(<?= rgb($palette[9]) ?>, .25);
+ }
+
+ .form-control::placeholder, .form-select::placeholder {
+ color: #<?= $palette[6] ?>77;
+ }
+
+ .modal {
+ --bs-modal-bg: #<?= $palette[1] ?> !important;
+ --bs-modal-header-border-color: #<?= $palette[3] ?> !important;
+ }
+
+ .card {
+ --bs-card-bg: #<?= $palette[1] ?> !important;
+ }
+
+ .btn-close {
+ background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23<?= $palette[6] ?>'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat
+ }
+
+ .ck-editor {
+ color: var(--bs-black);
+ }
+
+ .alert-primary a, .alert-danger a, .alert-success a, .alert-warning a {
+ color: var(--bs-body-bg);
+ }
+
+ #plus-box, #plus-box > div > div > div > span, #plus-box h2 {
+ color: var(--bs-body-color);
+ }
+
+ #plus-box {
+ background: #<?= $palette[2] ?> !important;
+ }
+
+ #plus-box > div {
+ background-image: none !important;
+ }
+ }
+ </style>
+ <?php }
+ } ?>
+
+ <?php if ($use2023UI): ?>
+ <?php require_once $_SERVER['DOCUMENT_ROOT'] . "/includes/components/2023ui.inc"; ?>
+ <?php endif; ?>
+
<?php if (isset($_GET["mini"]) || str_contains($_SERVER["HTTP_USER_AGENT"], "+ColdHazeDesktop")) {
?>
<style>
@@ -258,5 +628,83 @@ require_once $_SERVER['DOCUMENT_ROOT'] . "/includes/util/functions.inc";
}
</style>
<?php }
+
+if (
+ (($isLoggedIn || $isLowerLoggedIn) && !$use2023UI && isset($_COOKIE["enable2023UIcta"]) && $_COOKIE["enable2023UIcta"] === "yes") ||
+ (isset($_COOKIE["force2023UIcta"]) && $_COOKIE["force2023UIcta"] === "yes" && !$use2023UI)
+) { ?>
+ <div class="modal fade" id="new-ui-cta">
+ <div class="modal-dialog">
+ <div class="modal-content">
+ <div class="modal-body">
+ <img src="/assets/logo/light.svg" style="width: 100%; margin-bottom: 20px;" class="cta-light">
+ <img src="/assets/logo/dark.svg" style="width: 100%; margin-bottom: 20px;" class="cta-dark">
+ <style>
+ @media (prefers-color-scheme: light) {
+ .cta-dark {
+ display: none;
+ }
+ }
+
+ @media (prefers-color-scheme: dark) {
+ .cta-light {
+ display: none;
+ }
+
+ #new-ui-cta .modal-header {
+ border-bottom: 1px solid #353738;
+ }
+
+ #new-ui-cta .modal-content {
+ border: 1px solid rgba(255, 255, 255, .2);
+ background-color: #111;
+ }
+ }
+ </style>
+ <h3 style="text-align: center;">There is more to it</h3>
+ <p style="text-align: center;">Cold Haze is getting a new shape. Help us improve it by testing it early before it is made publicly available.</p>
+ <p style="text-align: center;">The new design is colorful, clean, modern, simple, fast, and gives you access to what you need the most.</p>
+ <div style="text-align: center;"><a class="btn btn-primary" href="/api/2023ui">Try it now</a> <a data-bs-dismiss="modal" onclick="localStorage.setItem('dismissed2023cta', '')" class="btn btn-outline-secondary">Maybe later</a></div>
+ <hr>
+ <div class="small text-muted">Some features are not available in the new design. <a href="https://bugs.equestria.dev/articles/CH-A-1/New-design-FAQ" target="_blank">Learn more.</a></div>
+ <!-- Equestria.dev makes no guarantee whatsoever that, after turning on this experimental feature, Cold Haze will continue working as intended. Access to emergency features might be unavailable while this option is turned on. Temporarily turning it off is possible using the "no2023" URL parameter. -->
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <script>
+ if (localStorage.getItem("dismissed2023cta") === null) {
+ let modal = new bootstrap.Modal(document.getElementById("new-ui-cta"));
+ modal.show();
+ }
+ </script>
+<?php }
+
+if ($use2023UI && isset($_GET["ui2023intro"])) { ?>
+ <div class="modal fade" id="new-ui-success">
+ <div class="modal-dialog">
+ <div class="modal-content">
+ <div class="modal-body" style="text-align: center;">
+ <img src="<?= icon("wave", false) ?>" class="light-only" style="height: 56px; margin: 10px 0;">
+ <img src="<?= icon("wave", true) ?>" class="dark-only" style="height: 56px; margin: 10px 0;">
+ <h3 style="text-align: center;">Welcome to a new experience</h3>
+ <p style="text-align: center;">The new design is now activated and you can use it now.</p>
+ <p style="text-align: center;">Please remember that it is currently experimental and you should report any issue you encounter.</p>
+ <div style="text-align: center;"><a data-bs-dismiss="modal" onclick="localStorage.setItem('dismissed2023cta', '')" class="btn btn-outline-primary">Done</a></div>
+ <hr>
+ <div class="small text-muted">Some features are not available in the new design. <a href="">Learn more.</a></div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <script>
+ let modal = new bootstrap.Modal(document.getElementById("new-ui-success"));
+ modal.show();
+ </script>
+<?php }
+
require_once $_SERVER['DOCUMENT_ROOT'] . "/includes/components/explicit.php";
$GLOBALS["ColdHazePerformance"]["header"] = (microtime(true) - $start) * 1000; $start = microtime(true); ?>
+<main id="app" style="background-color: var(--palette-0);"> \ No newline at end of file
diff --git a/includes/components/mobilenav.inc b/includes/components/mobilenav.inc
index 7b49434..e42e9ab 100644
--- a/includes/components/mobilenav.inc
+++ b/includes/components/mobilenav.inc
@@ -1,4 +1,4 @@
-<?php global $navigation; global $isLoggedIn; global $isLowerLoggedIn; ?>
+<?php global $use2023UI; global $navigation; global $isLoggedIn; global $isLowerLoggedIn; if (!$use2023UI): ?>
<div id="mobile-navigation">
<div id="mobile-navigation-container" class="container" style="display: grid; grid-template-columns: repeat(<?= count(array_values(array_filter($navigation, function ($item) use ($isLoggedIn) {
return !$item["admin"] || $isLoggedIn;
@@ -85,4 +85,5 @@
closeMobileNavigation();
}
}
-</script> \ No newline at end of file
+</script>
+<?php endif; ?> \ No newline at end of file
diff --git a/includes/components/navigation.inc b/includes/components/navigation.inc
index 1761937..1d24dea 100644
--- a/includes/components/navigation.inc
+++ b/includes/components/navigation.inc
@@ -1,444 +1,448 @@
<?php
+global $use2023UI;
$pages = json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/pages.json"), true);
global $navigation;
global $toplevel;
global $lang; global $pages; global $app; global $isLowerLoggedIn; global $isLoggedIn;
-$cache = json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/data/cache/navigation.json"), true);
+if (!$use2023UI) {
-if (!isset($cache["raindrops"])) $cache["raindrops"] = [];
-if (!isset($cache["cloudburst"])) $cache["cloudburst"] = [];
-if (!isset($cache["other"])) $cache["other"] = [];
+ $cache = json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/data/cache/navigation.json"), true);
-foreach ([
- [
- "name" => "raindrops",
- "id" => "gdapd"
- ],
- [
- "name" => "cloudburst",
- "id" => "ynmuc"
- ],
- [
- "name" => "other",
- "id" => $app["other"]["id"]
- ]
-] as $cacheSystem) {
- if (!isset($cache[$cacheSystem["name"]]["public"])) {
- $isLoggedInOldState = $isLoggedIn;
- $isLowerLoggedInOldState = $isLowerLoggedIn;
+ if (!isset($cache["raindrops"])) $cache["raindrops"] = [];
+ if (!isset($cache["cloudburst"])) $cache["cloudburst"] = [];
+ if (!isset($cache["other"])) $cache["other"] = [];
- $isLoggedIn = false;
- $isLowerLoggedIn = false;
-
- $cache[$cacheSystem["name"]]["public"] = array_map(function ($member) {
- return [
- "name" => $member['display_name'] ?? $member['name'],
- "icon" => getAsset($member["system"], $member["id"], "heads"),
- "invert" => false,
- "link" => "/$member[name]",
- "stepped" => null,
- "private" => false
- ];
- }, array_filter(scoreOrder(withTravelers(json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/data/$cacheSystem[id]/members.json"), true), "$cacheSystem[id]"), "$cacheSystem[id]"), function ($member) {
- return $member['name'] !== "unknown" && $member['name'] !== "fusion" && $member['name'] !== "new";
- }));
-
- $isLoggedIn = $isLoggedInOldState;
- $isLowerLoggedIn = $isLowerLoggedInOldState;
- }
+ foreach ([
+ [
+ "name" => "raindrops",
+ "id" => "gdapd"
+ ],
+ [
+ "name" => "cloudburst",
+ "id" => "ynmuc"
+ ],
+ [
+ "name" => "other",
+ "id" => $app["other"]["id"]
+ ]
+ ] as $cacheSystem) {
+ if (!isset($cache[$cacheSystem["name"]]["public"])) {
+ $isLoggedInOldState = $isLoggedIn;
+ $isLowerLoggedInOldState = $isLowerLoggedIn;
- if (!isset($cache[$cacheSystem["name"]]["private"])) {
- $isLoggedInOldState = $isLoggedIn;
- $isLowerLoggedInOldState = $isLowerLoggedIn;
+ $isLoggedIn = false;
+ $isLowerLoggedIn = false;
- $isLoggedIn = true;
- $isLowerLoggedIn = false;
+ $cache[$cacheSystem["name"]]["public"] = array_map(function ($member) {
+ return [
+ "name" => $member['display_name'] ?? $member['name'],
+ "icon" => getAsset($member["system"], $member["id"], "heads"),
+ "invert" => false,
+ "link" => "/$member[name]",
+ "stepped" => null,
+ "private" => false
+ ];
+ }, array_filter(scoreOrder(withTravelers(json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/data/$cacheSystem[id]/members.json"), true), "$cacheSystem[id]"), "$cacheSystem[id]"), function ($member) {
+ return $member['name'] !== "unknown" && $member['name'] !== "fusion" && $member['name'] !== "new";
+ }));
- $cache[$cacheSystem["name"]]["private"] = array_map(function ($member) {
- return [
- "name" => $member['display_name'] ?? $member['name'],
- "icon" => getAsset($member["system"], $member["id"], "heads"),
- "invert" => false,
- "link" => "/$member[name]",
- "stepped" => null,
- "private" => false
- ];
- }, array_filter(scoreOrder(withTravelers(json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/data/$cacheSystem[id]/members.json"), true), "$cacheSystem[id]"), "$cacheSystem[id]"), function ($member) {
- return $member['name'] !== "unknown" && $member['name'] !== "fusion" && $member['name'] !== "new";
- }));
+ $isLoggedIn = $isLoggedInOldState;
+ $isLowerLoggedIn = $isLowerLoggedInOldState;
+ }
- $isLoggedIn = $isLoggedInOldState;
- $isLowerLoggedIn = $isLowerLoggedInOldState;
- }
-}
+ if (!isset($cache[$cacheSystem["name"]]["private"])) {
+ $isLoggedInOldState = $isLoggedIn;
+ $isLowerLoggedInOldState = $isLowerLoggedIn;
-file_put_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/data/cache/navigation.json", json_encode($cache));
+ $isLoggedIn = true;
+ $isLowerLoggedIn = false;
-$navigation_admin = [
- "admin" => !$isLowerLoggedIn,
- "name" => "Private utilities",
- "icon" => "/assets/icons/admin.svg",
- "invert" => true,
- "items" => [
- "alerts" => [
- "name" => null,
- "minimal" => true,
- "items" => [
- [
- "name" => $pages["emergency"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/emergency.svg",
+ $cache[$cacheSystem["name"]]["private"] = array_map(function ($member) {
+ return [
+ "name" => $member['display_name'] ?? $member['name'],
+ "icon" => getAsset($member["system"], $member["id"], "heads"),
"invert" => false,
- "link" => "/-/emergency",
- "stepped" => null,
- "private" => false
- ],
- [
- "name" => $pages["wakeup"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/wakeup.svg",
- "invert" => false,
- "link" => "/-/wakeup",
- "stepped" => null,
- "private" => true
- ],
- [
- "name" => $pages["pleasure"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/pleasure.svg",
- "invert" => false,
- "link" => "/-/pleasure",
+ "link" => "/$member[name]",
"stepped" => null,
"private" => false
+ ];
+ }, array_filter(scoreOrder(withTravelers(json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/data/$cacheSystem[id]/members.json"), true), "$cacheSystem[id]"), "$cacheSystem[id]"), function ($member) {
+ return $member['name'] !== "unknown" && $member['name'] !== "fusion" && $member['name'] !== "new";
+ }));
+
+ $isLoggedIn = $isLoggedInOldState;
+ $isLowerLoggedIn = $isLowerLoggedInOldState;
+ }
+ }
+
+ file_put_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/data/cache/navigation.json", json_encode($cache));
+
+ $navigation_admin = [
+ "admin" => !$isLowerLoggedIn,
+ "name" => "Private utilities",
+ "icon" => "/assets/icons/admin.svg",
+ "invert" => true,
+ "items" => [
+ "alerts" => [
+ "name" => null,
+ "minimal" => true,
+ "items" => [
+ [
+ "name" => $pages["emergency"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/emergency.svg",
+ "invert" => false,
+ "link" => "/-/emergency",
+ "stepped" => null,
+ "private" => false
+ ],
+ [
+ "name" => $pages["wakeup"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/wakeup.svg",
+ "invert" => false,
+ "link" => "/-/wakeup",
+ "stepped" => null,
+ "private" => true
+ ],
+ [
+ "name" => $pages["pleasure"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/pleasure.svg",
+ "invert" => false,
+ "link" => "/-/pleasure",
+ "stepped" => null,
+ "private" => false
+ ]
]
- ]
- ],
- "apps" => [
- "name" => $lang["navigation"]["apps"],
- "minimal" => false,
- "items" => [
- time() >= 1686787200 ? null : [
- "name" => "Front planner<span class='badge bg-warning text-black rounded-pill' style='position:relative;top:-1px; margin-left: 5px;'>EOL</span>",
- "icon" => "/assets/icons/fronting.svg",
- "invert" => true,
- "link" => "/-/fronting",
- "stepped" => null,
- "private" => false
- ],
- [
- "name" => $pages["evening"]["name"][$lang["_name"]] . (time() >= 1686787200 ? "" : "<span class='badge bg-info text-black rounded-pill' style='position:relative;top:-1px; margin-left: 5px;'>Beta</span>"),
- "icon" => "/assets/icons/evening.svg",
- "invert" => true,
- "link" => "/-/evening",
- "stepped" => null,
- "private" => false
- ],
- [
- "name" => $pages["profiles"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/profiles.svg",
- "invert" => true,
- "link" => "/-/profiles",
- "stepped" => null,
- "private" => false
- ],
- [
- "name" => $pages["money"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/money.svg",
- "invert" => true,
- "link" => "/-/money",
- "stepped" => null,
- "private" => true
- ],
- [
- "name" => $pages["contacts"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/contacts.svg",
- "invert" => true,
- "link" => "/-/contacts",
- "stepped" => null,
- "private" => true
- ],
- [
- "name" => $pages["schedules"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/schedules.svg",
- "invert" => true,
- "link" => "/-/schedules",
- "stepped" => null,
- "private" => false
- ],
- [
- "name" => $pages["docs"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/docs.svg",
- "invert" => true,
- "link" => "/-/docs",
- "stepped" => null,
- "private" => true
- ],
- time() >= 1688169600 ? null : [
- "name" => "Devices<span class='badge bg-warning text-black rounded-pill' style='position:relative;top:-1px; margin-left: 5px;'>EOL</span>",
- "icon" => "/assets/icons/computers.svg",
- "invert" => true,
- "link" => "/-/computers",
- "stepped" => null,
- "private" => true
- ],
- [
- "name" => $pages["travelling"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/travelling.svg",
- "invert" => true,
- "link" => "/-/travelling",
- "stepped" => null,
- "private" => false
- ],
- [
- "name" => $pages["stats"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/stats.svg",
- "invert" => true,
- "link" => "/-/stats",
- "stepped" => null,
- "private" => true
- ],
- [
- "name" => $pages["pair"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/pair.svg",
- "invert" => true,
- "link" => "/-/pair",
- "stepped" => null,
- "private" => true
- ],
- [
- "name" => $pages["sessions"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/sessions.svg",
- "invert" => true,
- "link" => "/-/sessions",
- "stepped" => null,
- "private" => true
- ],
- [
- "name" => $pages["logout"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/logout.svg",
- "invert" => true,
- "link" => "/-/logout",
- "stepped" => null,
- "private" => false
+ ],
+ "apps" => [
+ "name" => $lang["navigation"]["apps"],
+ "minimal" => false,
+ "items" => [
+ time() >= 1686787200 ? null : [
+ "name" => "Front planner<span class='badge bg-warning text-black rounded-pill' style='position:relative;top:-1px; margin-left: 5px;'>EOL</span>",
+ "icon" => "/assets/icons/fronting.svg",
+ "invert" => true,
+ "link" => "/-/fronting",
+ "stepped" => null,
+ "private" => false
+ ],
+ [
+ "name" => $pages["evening"]["name"][$lang["_name"]] . (time() >= 1686787200 ? "" : "<span class='badge bg-info text-black rounded-pill' style='position:relative;top:-1px; margin-left: 5px;'>Beta</span>"),
+ "icon" => "/assets/icons/evening.svg",
+ "invert" => true,
+ "link" => "/-/evening",
+ "stepped" => null,
+ "private" => false
+ ],
+ [
+ "name" => $pages["profiles"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/profiles.svg",
+ "invert" => true,
+ "link" => "/-/profiles",
+ "stepped" => null,
+ "private" => false
+ ],
+ [
+ "name" => $pages["money"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/money.svg",
+ "invert" => true,
+ "link" => "/-/money",
+ "stepped" => null,
+ "private" => true
+ ],
+ [
+ "name" => $pages["contacts"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/contacts.svg",
+ "invert" => true,
+ "link" => "/-/contacts",
+ "stepped" => null,
+ "private" => true
+ ],
+ [
+ "name" => $pages["schedules"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/schedules.svg",
+ "invert" => true,
+ "link" => "/-/schedules",
+ "stepped" => null,
+ "private" => false
+ ],
+ [
+ "name" => $pages["docs"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/docs.svg",
+ "invert" => true,
+ "link" => "/-/docs",
+ "stepped" => null,
+ "private" => true
+ ],
+ time() >= 1688169600 ? null : [
+ "name" => "Devices<span class='badge bg-warning text-black rounded-pill' style='position:relative;top:-1px; margin-left: 5px;'>EOL</span>",
+ "icon" => "/assets/icons/computers.svg",
+ "invert" => true,
+ "link" => "/-/computers",
+ "stepped" => null,
+ "private" => true
+ ],
+ [
+ "name" => $pages["travelling"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/travelling.svg",
+ "invert" => true,
+ "link" => "/-/travelling",
+ "stepped" => null,
+ "private" => false
+ ],
+ [
+ "name" => $pages["stats"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/stats.svg",
+ "invert" => true,
+ "link" => "/-/stats",
+ "stepped" => null,
+ "private" => true
+ ],
+ [
+ "name" => $pages["pair"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/pair.svg",
+ "invert" => true,
+ "link" => "/-/pair",
+ "stepped" => null,
+ "private" => true
+ ],
+ [
+ "name" => $pages["sessions"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/sessions.svg",
+ "invert" => true,
+ "link" => "/-/sessions",
+ "stepped" => null,
+ "private" => true
+ ],
+ [
+ "name" => $pages["logout"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/logout.svg",
+ "invert" => true,
+ "link" => "/-/logout",
+ "stepped" => null,
+ "private" => false
+ ]
+ ]
+ ],
+ "sort" => [
+ "name" => "Sorted members lists",
+ "minimal" => false,
+ "items" => [
+ [
+ "name" => $pages["splitting"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/splitting.svg",
+ "invert" => true,
+ "link" => "/-/splitting",
+ "stepped" => null,
+ "private" => false
+ ],
+ [
+ "name" => $pages["byfront"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/byfront.svg",
+ "invert" => true,
+ "link" => "/-/byfront",
+ "stepped" => null,
+ "private" => false
+ ],
+ [
+ "name" => $pages["alphabet"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/alphabet.svg",
+ "invert" => true,
+ "link" => "/-/alphabet",
+ "stepped" => null,
+ "private" => false
+ ],
+ [
+ "name" => $pages["s:species"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/species.svg",
+ "invert" => true,
+ "link" => "/-/byspecies",
+ "stepped" => null,
+ "private" => false
+ ],
]
- ]
- ],
- "sort" => [
- "name" => "Sorted members lists",
- "minimal" => false,
- "items" => [
- [
- "name" => $pages["splitting"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/splitting.svg",
- "invert" => true,
- "link" => "/-/splitting",
- "stepped" => null,
- "private" => false
- ],
- [
- "name" => $pages["byfront"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/byfront.svg",
- "invert" => true,
- "link" => "/-/byfront",
- "stepped" => null,
- "private" => false
- ],
- [
- "name" => $pages["alphabet"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/alphabet.svg",
- "invert" => true,
- "link" => "/-/alphabet",
- "stepped" => null,
- "private" => false
- ],
- [
- "name" => $pages["s:species"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/species.svg",
- "invert" => true,
- "link" => "/-/byspecies",
- "stepped" => null,
- "private" => false
- ],
]
]
- ]
-];
-$navigation_global = [
- "admin" => false,
- "name" => $lang["navigation"]["general"],
- "icon" => "/assets/icons/global.svg",
- "invert" => true,
- "items" => [
- "main" => [
- "name" => null,
- "minimal" => false,
- "items" => [
- [
- "name" => $pages["home"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/home.svg",
- "invert" => true,
- "link" => "/",
- "stepped" => null,
- "private" => false
- ],
- [
- "name" => $pages["relations"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/relations.svg",
- "invert" => true,
- "link" => "/-/relations",
- "stepped" => null,
- "private" => false
- ],
- [
- "name" => $pages["terminology"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/terminology.svg",
- "invert" => true,
- "link" => "/-/terminology",
- "stepped" => null,
- "private" => false
+ ];
+ $navigation_global = [
+ "admin" => false,
+ "name" => $lang["navigation"]["general"],
+ "icon" => "/assets/icons/global.svg",
+ "invert" => true,
+ "items" => [
+ "main" => [
+ "name" => null,
+ "minimal" => false,
+ "items" => [
+ [
+ "name" => $pages["home"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/home.svg",
+ "invert" => true,
+ "link" => "/",
+ "stepped" => null,
+ "private" => false
+ ],
+ [
+ "name" => $pages["relations"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/relations.svg",
+ "invert" => true,
+ "link" => "/-/relations",
+ "stepped" => null,
+ "private" => false
+ ],
+ [
+ "name" => $pages["terminology"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/terminology.svg",
+ "invert" => true,
+ "link" => "/-/terminology",
+ "stepped" => null,
+ "private" => false
+ ]
]
]
]
- ]
-];
-$navigation_cloudburst = [
- "admin" => false,
- "name" => "Cloudburst System",
- "icon" => getAsset("ynmuc"),
- "invert" => false,
- "items" => [
- "header" => [
- "name" => null,
- "minimal" => false,
- "items" => [
- [
- "name" => $lang["navigation"]["about"],
- "icon" => "/assets/icons/about.svg",
- "invert" => true,
- "link" => "/cloudburst",
- "stepped" => null,
- "private" => false
- ],
- [
- "name" => $pages["s:history"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/history.svg",
- "invert" => true,
- "link" => "/cloudburst/-/history",
- "stepped" => null,
- "private" => false
+ ];
+ $navigation_cloudburst = [
+ "admin" => false,
+ "name" => "Cloudburst System",
+ "icon" => getAsset("ynmuc"),
+ "invert" => false,
+ "items" => [
+ "header" => [
+ "name" => null,
+ "minimal" => false,
+ "items" => [
+ [
+ "name" => $lang["navigation"]["about"],
+ "icon" => "/assets/icons/about.svg",
+ "invert" => true,
+ "link" => "/cloudburst",
+ "stepped" => null,
+ "private" => false
+ ],
+ [
+ "name" => $pages["s:history"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/history.svg",
+ "invert" => true,
+ "link" => "/cloudburst/-/history",
+ "stepped" => null,
+ "private" => false
+ ]
]
+ ],
+ "members" => [
+ "name" => $lang["navigation"]["members"],
+ "minimal" => false,
+ "items" => $cache["cloudburst"][$isLoggedIn || $isLowerLoggedIn ? "private" : "public"]
]
- ],
- "members" => [
- "name" => $lang["navigation"]["members"],
- "minimal" => false,
- "items" => $cache["cloudburst"][$isLoggedIn || $isLowerLoggedIn ? "private" : "public"]
]
- ]
-];
-$navigation_other = [
- "admin" => !$isLowerLoggedIn,
- "name" => $app["other"]["name"],
- "icon" => getAsset($app["other"]["id"]),
- "invert" => false,
- "items" => [
- "header" => [
- "name" => null,
- "minimal" => false,
- "items" => [
- [
- "name" => $lang["navigation"]["about"],
- "icon" => "/assets/icons/about.svg",
- "invert" => true,
- "link" => "/" . $app["other"]["slug"],
- "stepped" => null,
- "private" => false
- ],
- [
- "name" => $pages["s:history"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/history.svg",
- "invert" => true,
- "link" => "/" . $app["other"]["slug"] . "/-/history",
- "stepped" => null,
- "private" => false
+ ];
+ $navigation_other = [
+ "admin" => !$isLowerLoggedIn,
+ "name" => $app["other"]["name"],
+ "icon" => getAsset($app["other"]["id"]),
+ "invert" => false,
+ "items" => [
+ "header" => [
+ "name" => null,
+ "minimal" => false,
+ "items" => [
+ [
+ "name" => $lang["navigation"]["about"],
+ "icon" => "/assets/icons/about.svg",
+ "invert" => true,
+ "link" => "/" . $app["other"]["slug"],
+ "stepped" => null,
+ "private" => false
+ ],
+ [
+ "name" => $pages["s:history"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/history.svg",
+ "invert" => true,
+ "link" => "/" . $app["other"]["slug"] . "/-/history",
+ "stepped" => null,
+ "private" => false
+ ]
]
+ ],
+ "members" => [
+ "name" => $lang["navigation"]["members"],
+ "minimal" => false,
+ "items" => $cache["other"][$isLoggedIn || $isLowerLoggedIn ? "private" : "public"]
]
- ],
- "members" => [
- "name" => $lang["navigation"]["members"],
- "minimal" => false,
- "items" => $cache["other"][$isLoggedIn || $isLowerLoggedIn ? "private" : "public"]
]
- ]
-];
-$navigation_raindrops = [
- "admin" => false,
- "name" => "Raindrops System",
- "icon" => getAsset("gdapd"),
- "invert" => false,
- "items" => [
- "header" => [
- "name" => null,
- "minimal" => false,
- "items" => [
- [
- "name" => $lang["navigation"]["about"],
- "icon" => "/assets/icons/about.svg",
- "invert" => true,
- "link" => "/raindrops",
- "stepped" => null,
- "private" => false
- ],
- [
- "name" => $pages["s:history"]["name"][$lang["_name"]],
- "icon" => "/assets/icons/history.svg",
- "invert" => true,
- "link" => "/raindrops/-/history",
- "stepped" => null,
- "private" => false
+ ];
+ $navigation_raindrops = [
+ "admin" => false,
+ "name" => "Raindrops System",
+ "icon" => getAsset("gdapd"),
+ "invert" => false,
+ "items" => [
+ "header" => [
+ "name" => null,
+ "minimal" => false,
+ "items" => [
+ [
+ "name" => $lang["navigation"]["about"],
+ "icon" => "/assets/icons/about.svg",
+ "invert" => true,
+ "link" => "/raindrops",
+ "stepped" => null,
+ "private" => false
+ ],
+ [
+ "name" => $pages["s:history"]["name"][$lang["_name"]],
+ "icon" => "/assets/icons/history.svg",
+ "invert" => true,
+ "link" => "/raindrops/-/history",
+ "stepped" => null,
+ "private" => false
+ ]
]
+ ],
+ "members" => [
+ "name" => $lang["navigation"]["members"],
+ "minimal" => false,
+ "items" => $cache["raindrops"][$isLoggedIn || $isLowerLoggedIn ? "private" : "public"]
]
- ],
- "members" => [
- "name" => $lang["navigation"]["members"],
- "minimal" => false,
- "items" => $cache["raindrops"][$isLoggedIn || $isLowerLoggedIn ? "private" : "public"]
]
- ]
-];
+ ];
-global $parts;
+ global $parts;
-if (isset($parts) && isset($parts[0]) && $parts[0] === $app["other"]["slug"]) {
- $navigation = [
- "other" => $navigation_other,
- "cloudburst" => $navigation_cloudburst,
- "raindrops" => $navigation_raindrops,
- "admin" => $navigation_admin,
- "global" => $navigation_global
- ];
-} elseif (isset($parts) && isset($parts[0]) && $parts[0] === "cloudburst") {
- $navigation = [
- "cloudburst" => $navigation_cloudburst,
- "raindrops" => $navigation_raindrops,
- "other" => $navigation_other,
- "admin" => $navigation_admin,
- "global" => $navigation_global
- ];
-} elseif (isset($parts) && isset($parts[0]) && $parts[0] === "raindrops") {
- $navigation = [
- "raindrops" => $navigation_raindrops,
- "cloudburst" => $navigation_cloudburst,
- "other" => $navigation_other,
- "admin" => $navigation_admin,
- "global" => $navigation_global
- ];
-} else {
- $navigation = [
- "admin" => $navigation_admin,
- "global" => $navigation_global,
- "cloudburst" => $navigation_cloudburst,
- "raindrops" => $navigation_raindrops,
- "other" => $navigation_other,
- ];
+ if (isset($parts) && isset($parts[0]) && $parts[0] === $app["other"]["slug"]) {
+ $navigation = [
+ "other" => $navigation_other,
+ "cloudburst" => $navigation_cloudburst,
+ "raindrops" => $navigation_raindrops,
+ "admin" => $navigation_admin,
+ "global" => $navigation_global
+ ];
+ } elseif (isset($parts) && isset($parts[0]) && $parts[0] === "cloudburst") {
+ $navigation = [
+ "cloudburst" => $navigation_cloudburst,
+ "raindrops" => $navigation_raindrops,
+ "other" => $navigation_other,
+ "admin" => $navigation_admin,
+ "global" => $navigation_global
+ ];
+ } elseif (isset($parts) && isset($parts[0]) && $parts[0] === "raindrops") {
+ $navigation = [
+ "raindrops" => $navigation_raindrops,
+ "cloudburst" => $navigation_cloudburst,
+ "other" => $navigation_other,
+ "admin" => $navigation_admin,
+ "global" => $navigation_global
+ ];
+ } else {
+ $navigation = [
+ "admin" => $navigation_admin,
+ "global" => $navigation_global,
+ "cloudburst" => $navigation_cloudburst,
+ "raindrops" => $navigation_raindrops,
+ "other" => $navigation_other,
+ ];
+ }
} \ No newline at end of file
diff --git a/includes/components/pane.inc b/includes/components/pane.inc
index 1ecbcdf..a4b2d43 100644
--- a/includes/components/pane.inc
+++ b/includes/components/pane.inc
@@ -1,4 +1,4 @@
-<?php global $isLoggedIn; global $isLowerLoggedIn; global $pages; global $navigation; $byColor = getMembersByColor(); global $lang; global $pages; ?>
+<?php global $use2023UI; global $isLoggedIn; global $isLowerLoggedIn; global $pages; global $navigation; $byColor = getMembersByColor(); global $lang; global $pages; if (!$use2023UI): ?>
<div id="pane-header-background" style="background-image: linear-gradient(90deg, <?php
@@ -128,4 +128,5 @@ foreach ($list as $color) {
background-color: rgba(255, 255, 255, .1);
}
-</style> \ No newline at end of file
+</style>
+<?php endif; ?> \ No newline at end of file
diff --git a/includes/components/sysbanner.inc b/includes/components/sysbanner.inc
index 30babf0..2dd1dd4 100644
--- a/includes/components/sysbanner.inc
+++ b/includes/components/sysbanner.inc
@@ -34,14 +34,13 @@ $pages = json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/pa
<?= count(scoreOrder(json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/data/$systemID/members.json"), true), $systemID)) ?> members<?php
if (count($travellers) > 0) {
- echo(" (+ " . count($travellers) . " " . (count($travellers) > 1 ? $lang["system"]["traveller"] : $lang["system"]["travellers"]) . ")");
+ echo(" (+ " . count($travellers) . " " . (count($travellers) > 1 ? $lang["system"]["travellers"] : $lang["system"]["traveller"]) . ")");
}
- ?>
- </span>
- <span>
-
- </span>
+ ?><br><?php $leaders = array_filter(scoreOrderGlobal(), function ($i) use ($systemID) {
+ return $i["_system"] === $systemID && isset($i["_metadata"]["leader2"]) && $i["_metadata"]["leader2"];
+ }); if (count($leaders) > 0): ?><span style="vertical-align: middle; height: 24px;">Leader<?= count($leaders) > 1 ? "s" : "" ?>: </span><?php foreach ($leaders as $index => $leader): ?><a href="/<?= $leader["name"] ?>" class="member-link"><img src="<?= getAsset($leader["_system"], $leader["id"], "heads") ?>"><span style="vertical-align: middle;"> <?= $leader["display_name"] ?? $leader["name"] ?></span></a><?= $index <= count($leaders) - 1 ? ", " : "" ?><?php endforeach; ?><?php endif; ?>
+ </span>
</div>
</div>
</div>
© Floofi Systems, Some rights reserved. Powered by cgit.