diff options
Diffstat (limited to 'app/ui')
-rw-r--r-- | app/ui/albums.php | 2 | ||||
-rw-r--r-- | app/ui/explore.php | 54 | ||||
-rw-r--r-- | app/ui/favorites.php | 29 | ||||
-rw-r--r-- | app/ui/home.php | 137 | ||||
-rw-r--r-- | app/ui/info.php | 1 | ||||
-rw-r--r-- | app/ui/library.php | 2 | ||||
-rw-r--r-- | app/ui/listing.php | 56 | ||||
-rw-r--r-- | app/ui/logout.php | 6 | ||||
-rw-r--r-- | app/ui/navigation.php | 4 | ||||
-rw-r--r-- | app/ui/player.php | 63 | ||||
-rw-r--r-- | app/ui/search.php | 4 | ||||
-rw-r--r-- | app/ui/settings.php | 226 | ||||
-rw-r--r-- | app/ui/update.php | 2 | ||||
-rw-r--r-- | app/ui/welcome-dp.php | 59 | ||||
-rw-r--r-- | app/ui/welcome.php | 2 |
15 files changed, 470 insertions, 177 deletions
diff --git a/app/ui/albums.php b/app/ui/albums.php index 1ee5822..29bd945 100644 --- a/app/ui/albums.php +++ b/app/ui/albums.php @@ -66,7 +66,7 @@ <img class="icon" src="/assets/logo-transparent.svg" style="filter: grayscale(1) invert(1); width: 96px; height: 96px;" alt=""> <h4 style="opacity: .75;">Add music to your library</h4> <p style="max-width: 300px; margin-left: auto; margin-right: auto;">Browse millions of songs and collect your favorites here.</p> - <div class="btn btn-primary" onclick="window.parent.openUI('explore');">Browse Mist</div> + <div class="btn btn-primary" onclick="window.parent.openUI('home');">Browse Mist</div> </div> </div> <?php endif; ?> diff --git a/app/ui/explore.php b/app/ui/explore.php deleted file mode 100644 index c93beff..0000000 --- a/app/ui/explore.php +++ /dev/null @@ -1,54 +0,0 @@ -<?php header("X-Frame-Options: SAMEORIGIN"); require_once $_SERVER['DOCUMENT_ROOT'] . "/includes/session.php"; global $songs; global $albums; ?> -<!doctype html> -<html lang="en"> -<head> - <script> - if (typeof window.parent.openModal === "undefined") { - location.href = "/app/#/explore"; - } - </script> - <meta charset="UTF-8"> - <meta name="viewport" - content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> - <meta http-equiv="X-UA-Compatible" content="ie=edge"> - <title>Explore</title> - <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet"> - <link href="/assets/dark.css" rel="stylesheet"> - <link href="/assets/styles.css" rel="stylesheet"> - <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script> - <script src="/assets/localforage.min.js"></script> - <script src="/assets/fuse.min.js"></script> - <script src="/assets/js/shortcuts.js"></script> - <link id="native-css" href="/assets/native.css" rel="stylesheet" disabled> -</head> -<body class="crossplatform has-navigation"> - <div id="ui-navigation" style="z-index: 999; background-color: rgba(255, 255, 255, .75); position: fixed; top: 0; left: 0; right: 0; height: 32px; backdrop-filter: blur(50px); -webkit-backdrop-filter: blur(50px);"> - <div style="display: grid; grid-template-columns: max-content 1fr max-content; height: 100%;" class="container"> - <div id="ui-back-button" onclick="history.back();" style="display: flex; align-items: center; justify-content: center; text-align: center; opacity: 0; pointer-events: none;"> - <img src="/assets/icons/back.svg" alt="Back" class="icon"> - </div> - <div style="display: flex; align-items: center; justify-content: center; text-align: center;"><b>Explore</b></div> - <div style="opacity: 0; pointer-events: none;"> - <input placeholder="Filter" id="filter" class="form-control" style="width: 256px;height: 32px;border-top: none;" onchange="updateFilter();" onkeyup="updateFilter();"> - </div> - </div> - </div> - <script src="/assets/js/common.js"></script> - <div class="container"> - <br> - - <form action="search.php" onsubmit="window.parent.location.hash = '#/search/' + encodeURIComponent(document.getElementById('search').value);"> - <div style="width: calc(100% - 20px); margin-left: 10px;" class="input-group mb-3"> - <input name="q" type="text" id="search" class="form-control" placeholder="Search on Mist"> - <button class="btn btn-outline-secondary" type="submit" id="btn-search">Search</button> - </div> - </form> - - <hr style="width: calc(100% - 20px); margin-left: 10px;"> - - <p style="margin-left: 10px;">To search for content on Mist, start by typing the name of a song, artist or album. Any corresponding results will show up. Should anything you need be missing, you can contact your administrator to ask for more content to be added.</p> - </div> - - <br><br> -</body> -</html>
\ No newline at end of file diff --git a/app/ui/favorites.php b/app/ui/favorites.php index f1ebe30..76821fd 100644 --- a/app/ui/favorites.php +++ b/app/ui/favorites.php @@ -2,13 +2,38 @@ header("X-Frame-Options: SAMEORIGIN"); require_once $_SERVER['DOCUMENT_ROOT'] . "/includes/session.php"; -global $songs; global $favorites; +global $songs; global $favorites; global $_PROFILE; $hasAlbum = false; $favoritesList = true; $list = []; -foreach ($favorites as $id) { +if (!isset($_GET["u"])) { + header("Location: favorites.php?u=" . $_PROFILE["id"]); + die(); +} + +$correctFavorites = $favorites; + +if (preg_match("/[^a-f0-9-]/m", $_GET["u"]) == 0 && $_GET["u"] !== $_PROFILE["id"]) { + if (file_exists($_SERVER['DOCUMENT_ROOT'] . "/includes/users/" . $_GET["u"] . "-privacy.json")) { + $userPrivacy = json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/users/" . $_GET["u"] . "-privacy.json"), true); + if ($userPrivacy["listen"] >= 1) { + $userId = $_GET["u"]; + $correctFavorites = json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/users/" . $_GET["u"] . "-favorites.json"), true); + } else { + header("Location: favorites.php?u=" . $_PROFILE["id"]); + die(); + } + } else { + header("Location: favorites.php?u=" . $_PROFILE["id"]); + die(); + } +} else { + $userId = $_PROFILE["id"]; +} + +foreach ($correctFavorites as $id) { if (isset($songs[$id])) $list[$id] = $songs[$id]; } diff --git a/app/ui/home.php b/app/ui/home.php new file mode 100644 index 0000000..e51c790 --- /dev/null +++ b/app/ui/home.php @@ -0,0 +1,137 @@ +<?php header("X-Frame-Options: SAMEORIGIN"); require_once $_SERVER['DOCUMENT_ROOT'] . "/includes/session.php"; global $history; global $profile; global $_PROFILE; global $songs; global $albums; ?> +<!doctype html> +<html lang="en"> +<head> + <script> + if (typeof window.parent.openModal === "undefined") { + location.href = "/app/#/home"; + } + </script> + <meta charset="UTF-8"> + <meta name="viewport" + content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> + <meta http-equiv="X-UA-Compatible" content="ie=edge"> + <title>Home</title> + <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet"> + <link href="/assets/dark.css" rel="stylesheet"> + <link href="/assets/styles.css" rel="stylesheet"> + <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script> + <script src="/assets/localforage.min.js"></script> + <script src="/assets/fuse.min.js"></script> + <script src="/assets/js/shortcuts.js"></script> + <link id="native-css" href="/assets/native.css" rel="stylesheet" disabled> + <style> + #play-item:hover { + background-color: rgba(0, 0, 0, .05); + } + + #play-item:active { + background-color: rgba(0, 0, 0, .1); + } + </style> +</head> +<body class="crossplatform"> + <script> + window.parent.location.hash = "#/home"; + </script> + <script src="/assets/js/common.js"></script> + <div class="container"> + <div style="margin-left: 10px;"> + <?php if (trim($profile["banner"]) !== ""): ?> + <div id="banner" style="background-size: cover; background-position: center; background-image: url("<?= str_replace('"', '', $profile["banner"]) ?>"); background-color: #eee; height: 256px; margin-top: 20px; border-radius: 20px;"> + <div style="background-color: rgba(255, 255, 255, .25); height: 100%; border-radius: 20px;"></div> + <?php else: ?> + <div id="banner" style="background-size: cover; background-position: center; background-image: url('https://account.equestria.dev/hub/api/rest/avatar/<?= $_PROFILE["id"] ?>?dpr=2&size=32'); background-color: #eee; height: 256px; margin-top: 20px; border-radius: 20px;"> + <div style="background-color: rgba(255, 255, 255, .25); height: 100%; backdrop-filter: blur(100px); -webkit-backdrop-filter: blur(50px); border-radius: 20px;"></div> + <?php endif; ?> + </div> + <br> + + <div style="display: grid; grid-template-columns: 64px 1fr max-content; grid-gap: 15px;"> + <img alt="" src="https://account.equestria.dev/hub/api/rest/avatar/<?= $_PROFILE["id"] ?>?dpr=2&size=128" style="filter: none !important; border-radius: 999px; vertical-align: middle; width: 64px;"> + <div style="display: flex; align-items: center;"> + <div id="name"> + <h4>Welcome <?= $_PROFILE["name"] ?></h4> + </div> + + <div style="width: 100%; display: none;" id="search"> + <div style="width: 100%;"> + <input name="q" type="text" id="query" class="form-control" placeholder="Search on Mist"> + </div> + </div> + </div> + <div style="display: flex; align-items: center;"> + <span onclick="toggleSearch();" class="player-btn" style="border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; height: 48px; width: 48px;" id="btn-search"> + <img class="icon" alt="" src="/assets/icons/search.svg" style="pointer-events: none; width: 32px; height: 32px;" id="btn-search-icon"> + </span> + </div> + </div> + </div> + + <div class="list-group" style="margin-top: 20px; display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 10px;"> + <?php usort($history, function ($a, $b) { + return strtotime($b["date"]) - strtotime($a["date"]); + }); foreach (array_slice(array_values(array_unique(array_map(function ($i) { return $i["item"]; }, array_values($history)))), 0, 12) as $item): $song = $songs[$item]; ?> + <div onclick="window.parent.playSong('<?= $item ?>')" id="play-item" class="list-group-item" style="border-radius: 5px !important; border: none !important; display: grid; grid-template-columns: 64px 1fr; white-space: nowrap; overflow: hidden !important; text-overflow: ellipsis;"> + <div style="display: flex; align-items: center;"> + <img alt="" src="/assets/content/<?= $item ?>.jpg" style="width: 48px; height: 48px; background-color: #eee; border-radius: 3px;"> + </div> + <div style="display: flex; align-items: center;"> + <div style="white-space: nowrap; overflow: hidden !important; text-overflow: ellipsis;"> + <div style="white-space: nowrap; overflow: hidden !important; text-overflow: ellipsis;"><?= $song["title"] ?></div> + <div style="white-space: nowrap; overflow: hidden !important; text-overflow: ellipsis;" class="text-muted"><?= $song["artist"] ?></div> + </div> + </div> + </div> + <?php endforeach; ?> + </div> + + <div id="album-grid" style="display: grid; grid-template-columns: repeat(5, 1fr); margin-top: 20px;"> + <?php global $albums; + + $albums = array_filter($albums, function ($i) { + global $library; + return in_array($i, $library); + }, ARRAY_FILTER_USE_KEY); + + $albums = array_reverse($albums); + + foreach ($albums as $id => $album): ?> + <a id="album-<?= $id ?>" data-item-track="<?= $album["title"] ?>" data-item-artist="<?= $album["artist"] ?>" href="listing.php?a=<?= $id ?>" style="padding: 10px; color: inherit; text-decoration: inherit;" class="album"> + <img class="album-list-art" alt="" src="/assets/content/<?= $id ?>.jpg" style="width: 100%; aspect-ratio: 1; border-radius: 5px; margin-bottom: 5px;"> + <div class="album-list-item" style="max-width: calc(80vw / 5); white-space: nowrap; overflow: hidden !important; text-overflow: ellipsis;"><?= $album["title"] ?></div> + <div class="album-list-item" style="max-width: calc(80vw / 5); opacity: .5; white-space: nowrap; overflow: hidden !important; text-overflow: ellipsis;"><?= $album["artist"] ?></div> + </a> + <?php endforeach; ?> + </div> + </div> + + <script> + document.getElementById("query").onkeydown = (e) => { + if (e.code === "Enter") { + toggleSearch(); + } + } + + function toggleSearch() { + if (document.getElementById("search").style.display === "none") { + document.getElementById("search").style.display = ""; + document.getElementById("name").style.display = "none"; + document.getElementById("query").focus(); + } else { + document.getElementById("query").blur(); + + if (document.getElementById("query").value.trim() === "") { + document.getElementById("search").style.display = "none"; + document.getElementById("name").style.display = ""; + } else { + window.parent.location.hash = '#/search/' + encodeURIComponent(document.getElementById('query').value); + location.href = "ui/search.php?q=" + encodeURIComponent(document.getElementById("query").value); + } + } + } + </script> + + <br><br> +</body> +</html>
\ No newline at end of file diff --git a/app/ui/info.php b/app/ui/info.php index d21e431..d857509 100644 --- a/app/ui/info.php +++ b/app/ui/info.php @@ -201,6 +201,7 @@ function getChannelConfiguration($c) { <hr><?php $id = $_GET["i"]; ?> <a class="btn btn-primary" onclick="<?= in_array($id, $favorites) ? "un" : "" ?>favoriteSong('<?= $id ?>');" id="btn-favorite-<?= $id ?>"><img id="btn-favorite-<?= $id ?>-icon" alt="" src="/assets/icons/favorite-<?= in_array($id, $favorites) ? "on" : "off" ?>.svg" style="pointer-events: none; filter: invert(1); width: 24px; height: 24px; margin-right: 5px;"><span id="btn-favorite-<?= $id ?>-text"><?= in_array($id, $favorites) ? "Remove from favorites" : "Add to favorites" ?></span></a> + <a style="float: right;" class="btn btn-outline-secondary" onclick="window.parent._modal.hide();">Close</a> </div> <script> diff --git a/app/ui/library.php b/app/ui/library.php index c6b5658..4736a11 100644 --- a/app/ui/library.php +++ b/app/ui/library.php @@ -23,7 +23,7 @@ </head> <body class="crossplatform"> <script> - window.parent.location.hash = "#/search/<?= rawurlencode($_GET["q"]) ?>"; + window.parent.location.hash = "#/library"; </script> <script src="/assets/js/common.js"></script> <div class="container"> diff --git a/app/ui/listing.php b/app/ui/listing.php index d32525b..510fa58 100644 --- a/app/ui/listing.php +++ b/app/ui/listing.php @@ -87,15 +87,30 @@ if (!$presetList) { <script> window.parent.location.hash = "#/albums/<?= $_GET["a"] ?>"; </script> + <?php endif; if (isset($favoritesList)): global $userId; ?> + <script> + window.parent.location.hash = "#/favorites/<?= $userId ?>"; + </script> <?php endif; ?> <div class="container"> <br> - <?php if (isset($favoritesList) && !$hasAlbum): ?> + <?php if (isset($favoritesList) && !$hasAlbum): global $userId; ?> <div id="album-info" style="display: grid; grid-template-columns: 20vw 1fr; margin-top: 10px; margin-left: 10px; grid-gap: 30px;"> <img id="album-info-art" alt="" src="/assets/favorites.svg" style="height: 20vw; width: 20vw; border-radius: .75vw;"> <div id="album-info-text" style="padding: 30px 0; display: grid; grid-template-rows: 1fr max-content;"> <div><h2>Favorites</h2> - <h2 style="opacity: .5;"><?= $_PROFILE["name"] ?></h2> + <h2 style="opacity: .5;"> + <select onchange="changeView();" id="favorites-user-select" class="form-select" style="width: max-content;font-size: inherit;margin: -0.375rem 0 -0.375rem -0.75rem;"> + <option <?= $userId === $_PROFILE["id"] ? "selected" : "" ?> value="<?= $_PROFILE["id"] ?>"><?= $_PROFILE["name"] ?></option> + <?php foreach (scandir($_SERVER['DOCUMENT_ROOT'] . "/includes/users") as $user): + if (str_ends_with($user, "-privacy.json")): + $userPrivacy = json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/users/" . $user), true); + $userProfile = json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/users/" . substr($user, 0, -13) . "-profile.json"), true); + if ($userPrivacy["listen"] >= 1 && $userProfile["id"] !== $_PROFILE["id"]): ?> + <option <?= $userId === $userProfile["id"] ? "selected" : "" ?> value="<?= $userProfile["id"] ?>"><?= $userProfile["name"] ?></option> + <?php endif; endif; endforeach; ?> + </select> + </h2> <div style="opacity: .5;"> Click on the heart icon near a song to add it to this list. </div> @@ -153,7 +168,7 @@ if (!$presetList) { <img class="icon" src="/assets/logo-transparent.svg" style="filter: grayscale(1) invert(1); width: 96px; height: 96px;" alt=""> <h4 style="opacity: .75;">Add music to your library</h4> <p style="max-width: 300px; margin-left: auto; margin-right: auto;">Browse millions of songs and collect your favorites here.</p> - <div class="btn btn-primary" onclick="window.parent.openUI('explore');">Browse Mist</div> + <div class="btn btn-primary" onclick="window.parent.openUI('home');">Browse Mist</div> </div> </div> <?php endif; ?> @@ -183,29 +198,16 @@ if (!$presetList) { } <?php endif; ?> - let items = Array.from(document.getElementsByClassName("track")).map(i => { return { title: i.getAttribute("data-item-track"), artist: i.getAttribute("data-item-artist"), id: i.id } }); - - const fuse = new Fuse(items, { - keys: [ - { - name: 'title', - weight: 1 - }, - { - name: 'artist', - weight: .5 - } - ] - }); + let items = Array.from(document.getElementsByClassName("track")).map(i => { return { title: i.getAttribute("data-item-track").toLowerCase().replace(/[^a-z\d ]/mg, " ").replace(/ +/mg, " "), artist: i.getAttribute("data-item-artist").toLowerCase().replace(/[^a-z\d ]/mg, " ").replace(/ +/mg, " "), id: i.id } }); function updateFilter() { - let query = document.getElementById("filter").value.trim(); + let query = document.getElementById("filter").value.trim().toLowerCase().replace(/[^a-z\d ]/mg, " ").replace(/ +/mg, " "); if (query !== "") { document.getElementById("search-results").style.display = "flex"; document.getElementById("main-list").style.display = "none"; - let results = items.filter(i => i.title.toLowerCase().replace(/[^a-z\d ]/mg, " ").replace(/ +/mg, " ").includes(query.toLowerCase().replace(/[^a-z\d ]/mg, " ").replace(/ +/mg, " ")) || i.artist.toLowerCase().replace(/[^a-z\d ]/mg, " ").replace(/ +/mg, " ").includes(query.toLowerCase().replace(/[^a-z\d ]/mg, " ").replace(/ +/mg, " "))); + let results = items.filter(i => i.title.includes(query) || i.artist.includes(query)).slice(0, 50); document.getElementById("search-results").innerHTML = ""; for (let result of results) { @@ -216,8 +218,24 @@ if (!$presetList) { document.getElementById("main-list").style.display = "flex"; } } + + function changeView() { + location.href = "favorites.php?u=" + document.getElementById("favorites-user-select").value; + } </script> + <style> + #favorites-user-select { + background-color: transparent; + border-color: transparent; + } + + #favorites-user-select:hover, #favorites-user-select:active, #favorites-user-select:focus { + background-color: var(--bs-body-bg); + border-color: var(--bs-border-color); + } + </style> + <br><br> </body> </html>
\ No newline at end of file diff --git a/app/ui/logout.php b/app/ui/logout.php new file mode 100644 index 0000000..0ea605e --- /dev/null +++ b/app/ui/logout.php @@ -0,0 +1,6 @@ +<?php header("X-Frame-Options: SAMEORIGIN"); +header("Set-Cookie: WAVY_SESSION_TOKEN=; SameSite=None; Path=/; Secure; HttpOnly; Expires=" . date("r", time() + (86400 * 730))); +?> +<script> + window.parent.location.href = "/app/"; +</script>
\ No newline at end of file diff --git a/app/ui/navigation.php b/app/ui/navigation.php index dacaa94..0125418 100644 --- a/app/ui/navigation.php +++ b/app/ui/navigation.php @@ -36,8 +36,8 @@ </div> <div id="navigation-container"> - <div id="explore" class="navigation-item" onclick="window.parent.openUI('explore');"> - <img class="icon" alt="" src="/assets/icons/explore.svg" style="vertical-align: middle; width: 32px;"><span style="vertical-align: middle; margin-left: 5px;" class="navigation-desktop">Explore</span> + <div id="home" class="navigation-item" onclick="window.parent.openUI('home');"> + <img class="icon" alt="" src="/assets/icons/home.svg" style="vertical-align: middle; width: 32px;"><span style="vertical-align: middle; margin-left: 5px;" class="navigation-desktop">Home</span> </div> <div id="library" class="navigation-item-mobile navigation-item" onclick="window.parent.openUI('library');"> <img class="icon" alt="" src="/assets/icons/library.svg" style="vertical-align: middle; width: 32px;"><span style="vertical-align: middle; margin-left: 5px;" class="navigation-desktop">Library</span> diff --git a/app/ui/player.php b/app/ui/player.php index 8043a5d..4c5298c 100644 --- a/app/ui/player.php +++ b/app/ui/player.php @@ -75,27 +75,29 @@ <audio id="player-audio-stella-side5"></audio> <div class="container" style="display: grid; grid-template-columns: 1fr 1.5fr 1fr;"> - <div id="buttons" style="height: 48px; margin-top: 8px; margin-bottom: 8px;"> - <span onclick="window.parent.toggleShuffle();" class="player-btn" style="border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; height: 48px; width: 48px;" id="btn-shuffle"> - <img class="icon" alt="" src="/assets/icons/shuffle-off.svg" style="pointer-events: none; width: 32px; height: 32px;" id="btn-shuffle-icon"> - </span> - <span onclick="window.parent.previous();" class="player-btn disabled" style="border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; height: 48px; width: 48px;" id="btn-previous"> - <img class="icon" alt="" src="/assets/icons/previous.svg" style="pointer-events: none; width: 32px; height: 32px;" id="btn-previous-icon"> - </span> - <span onclick="window.parent.playPause();" class="player-btn" style="border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; height: 48px; width: 48px;" id="btn-play"> - <img class="icon" alt="" src="/assets/icons/play.svg" style="pointer-events: none; width: 32px; height: 32px;" id="btn-play-icon"> - </span> - <span onclick="window.parent.next();" class="player-btn disabled" style="border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; height: 48px; width: 48px;" id="btn-next"> - <img class="icon" alt="" src="/assets/icons/next.svg" style="pointer-events: none; width: 32px; height: 32px;" id="btn-next-icon"> - </span> - <span onclick="window.parent.toggleRepeat();" class="player-btn" style="border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; height: 48px; width: 48px;" id="btn-repeat"> - <img class="icon" alt="" src="/assets/icons/repeat-off.svg" style="pointer-events: none; width: 32px; height: 32px;" id="btn-repeat-icon"> - </span> + <div id="buttons" style="text-align: center; display: flex; align-items: center; justify-content: center;"> + <div style="height: 48px; margin-top: 8px; margin-bottom: 8px;"> + <span onclick="window.parent.toggleShuffle();" class="player-btn" style="border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; height: 48px; width: 48px;" id="btn-shuffle"> + <img class="icon" alt="" src="/assets/icons/shuffle-off.svg" style="pointer-events: none; width: 32px; height: 32px;" id="btn-shuffle-icon"> + </span> + <span onclick="window.parent.previous();" class="player-btn disabled" style="border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; height: 48px; width: 48px;" id="btn-previous"> + <img class="icon" alt="" src="/assets/icons/previous.svg" style="pointer-events: none; width: 32px; height: 32px;" id="btn-previous-icon"> + </span> + <span onclick="window.parent.playPause();" class="player-btn" style="border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; height: 48px; width: 48px;" id="btn-play"> + <img class="icon" alt="" src="/assets/icons/play.svg" style="pointer-events: none; width: 32px; height: 32px;" id="btn-play-icon"> + </span> + <span onclick="window.parent.next();" class="player-btn disabled" style="border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; height: 48px; width: 48px;" id="btn-next"> + <img class="icon" alt="" src="/assets/icons/next.svg" style="pointer-events: none; width: 32px; height: 32px;" id="btn-next-icon"> + </span> + <span onclick="window.parent.toggleRepeat();" class="player-btn" style="border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; height: 48px; width: 48px;" id="btn-repeat"> + <img class="icon" alt="" src="/assets/icons/repeat-off.svg" style="pointer-events: none; width: 32px; height: 32px;" id="btn-repeat-icon"> + </span> + </div> </div> <div> - <span data-bs-html="true" data-bs-toggle="tooltip" id="badge-cd" style="z-index: 9999; display: none;position: absolute;margin-left: 71px;"><img src="/assets/icons/lossless.svg" alt="" style="height: 12px;opacity: .5;" class="icon"></span> - <span data-bs-html="true" data-bs-toggle="tooltip" id="badge-hires" style="z-index: 9999; display: none;position: absolute;margin-left: 71px;"><img src="/assets/icons/lossless.svg" alt="" style="height: 12px;opacity: .5;" class="icon"></span> - <span data-bs-html="true" title="<b>Mist Stella</b>" data-bs-toggle="tooltip" id="badge-stella" style="z-index: 9999; display: none;position: absolute;margin-left: 71px;"><img src="/assets/icons/stella.svg" alt="" style="height: 12px;opacity: .5;" class="icon"></span> + <span class="player-badge-desktop" data-bs-html="true" data-bs-toggle="tooltip" id="badge-cd" style="z-index: 9999; display: none;position: absolute;margin-left: 71px;"><img src="/assets/icons/lossless.svg" alt="" style="height: 12px;opacity: .5;" class="icon"></span> + <span class="player-badge-desktop" data-bs-html="true" data-bs-toggle="tooltip" id="badge-hires" style="z-index: 9999; display: none;position: absolute;margin-left: 71px;"><img src="/assets/icons/lossless.svg" alt="" style="height: 12px;opacity: .5;" class="icon"></span> + <span class="player-badge-desktop" data-bs-html="true" title="<b>Mist Stella</b>" data-bs-toggle="tooltip" id="badge-stella" style="z-index: 9999; display: none;position: absolute;margin-left: 71px;"><img src="/assets/icons/stella.svg" alt="" style="height: 12px;opacity: .5;" class="icon"></span> <div id="info" style="display: none; grid-template-columns: 64px 1fr; height: 64px; border-left: 1px solid rgba(0, 0, 0, .25); border-right: 1px solid rgba(0, 0, 0, .25);"> <img alt="" id="album-art" style="background-color: rgba(0, 0, 0, .1); height: 64px; width: 64px;"> <div id="info-grid" style="z-index: 9; display: grid; grid-template-rows: 2px 22px 22px 12px 6px;"> @@ -118,13 +120,28 @@ </div> </div> </div> - <div style="text-align: right; display: flex; align-items: center; justify-content: right;" id="badges"> - + <div style="text-align: center; display: flex; align-items: center; justify-content: center;" id="badges"> + <img src="/assets/icons/volume-down.svg" alt="" class="icon" style="margin-right: 10px; display: inline-block;"> + <input onchange="window.parent.setPlayerVolume();" oninput="window.parent.setPlayerVolume();" min="0" max="100" step="0.01" value="100" type="range" class="form-range" id="volume" style="width: 128px;"> + <img src="/assets/icons/volume-up.svg" alt="" class="icon" style="margin-left: 10px; display: inline-block;"> </div> </div> </div> <script> + if (localStorage.getItem("volume")) { + let vol = parseFloat(localStorage.getItem("volume")); + + if (!isNaN(vol) && vol >= 0 && vol <= 100) { + document.getElementById("volume").value = vol; + window.parent.setPlayerVolume(); + } else { + localStorage.setItem("volume", "100"); + } + } else { + localStorage.setItem("volume", "100"); + } + window.buildTooltips = () => { console.log("Build tooltip"); const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]'); @@ -136,13 +153,13 @@ } function openSong() { - window.parent.openModal((window.parent.songs[window.parent.currentSongID]?.artist ?? "Unknown artist") + " - " + (window.parent.songs[window.parent.currentSongID]?.title ?? "Unknown song"), "info.php?i=" + window.parent.currentSongID); + window.parent.openModal((window.parent.songs[window.parent.currentSongID]?.artist ?? "Unknown artist") + " - " + (window.parent.songs[window.parent.currentSongID]?.title ?? "Unknown song"), "info.php?i=" + window.parent.currentSongID, true); } function openArtist() { window.parent.location.hash = "#/search/" + encodeURIComponent(window.parent.songs[window.parent.currentSongID]?.artist ?? "Unknown artist"); window.parent.document.getElementById("ui").src = "ui/search.php?q=" + encodeURIComponent(window.parent.songs[window.parent.currentSongID]?.artist ?? "Unknown artist") - window.parent.redoNavigation("explore"); + window.parent.redoNavigation("home"); } function openAlbum() { diff --git a/app/ui/search.php b/app/ui/search.php index 0a1c3be..268ca5e 100644 --- a/app/ui/search.php +++ b/app/ui/search.php @@ -1,7 +1,7 @@ <?php header("X-Frame-Options: SAMEORIGIN"); require_once $_SERVER['DOCUMENT_ROOT'] . "/includes/session.php"; if (!isset($_GET["q"]) || trim($_GET["q"]) === "" || trim(preg_replace("/ +/m", " ", preg_replace("/[^a-z\d ]/m", " ", strtolower($_GET["q"])))) === "") { - header("Location: explore.php"); + header("Location: home.php"); die(); } @@ -11,7 +11,7 @@ if (!isset($_GET["q"]) || trim($_GET["q"]) === "" || trim(preg_replace("/ +/m", <head> <script> if (typeof window.parent.openModal === "undefined") { - location.href = "/app/#/explore"; + location.href = "/app/#/home"; } </script> <meta charset="UTF-8"> diff --git a/app/ui/settings.php b/app/ui/settings.php index 34cd095..3ef243d 100644 --- a/app/ui/settings.php +++ b/app/ui/settings.php @@ -1,4 +1,4 @@ -<?php header("X-Frame-Options: SAMEORIGIN"); require_once $_SERVER['DOCUMENT_ROOT'] . "/includes/session.php"; ?> +<?php header("X-Frame-Options: SAMEORIGIN"); require_once $_SERVER['DOCUMENT_ROOT'] . "/includes/session.php"; global $_PROFILE; ?> <!doctype html> <html lang="en"> <head> @@ -26,11 +26,15 @@ <div class="container"> <br> <h2 class="desktop-title" style="margin-top: 10px; margin-bottom: 20px; margin-left: 10px;">Settings</h2> + <div style="margin-left: 10px;"> + <h5>Preferences</h5> <div class="form-check form-switch"> <input onchange="saveDS();" class="form-check-input" type="checkbox" role="switch" id="data-saving"> - <label class="form-check-label" for="data-saving">Enable data saving</label> - <div class="text-muted small">Data saving disables playing lossless and high-resolution audio. Instead, you will get 256 kbps AAC-encoded audio, which is highly efficient. If you use Bluetooth headphones, the difference should be unnoticeable.</div> + <label class="form-check-label" for="data-saving"> + Enable data saving + <div class="text-muted small">Data saving disables playing lossless and high-resolution audio. Instead, you will get 256 kbps AAC-encoded audio, which is highly efficient. If you use Bluetooth headphones, the difference should be unnoticeable.</div> + </label> </div> <script> if (localStorage.getItem("data-saving") === "true") document.getElementById("data-saving").checked = true; @@ -42,8 +46,10 @@ <div class="form-check form-switch" style="margin-top: 10px;"> <input onchange="saveN();" class="form-check-input" type="checkbox" role="switch" id="normalize"> - <label class="form-check-label" for="normalize">Normalize loudness</label> - <div class="text-muted small">Normalizing adjusts the volume each song is played at to be the same level for every song. This will avoid you having to change your device's volume between each track, and should typically not be turned off. Powered by ReplayGain.</div> + <label class="form-check-label" for="normalize"> + Normalize loudness + <div class="text-muted small">Normalizing adjusts the volume each song is played at to be the same level for every song. This will avoid you having to change your device's volume between each track, and should typically not be turned off. Powered by ReplayGain.</div> + </label> </div> <script> if (localStorage.getItem("normalize") === "true") document.getElementById("normalize").checked = true; @@ -55,8 +61,10 @@ <div class="form-check form-switch" id="stella" style="display: none;margin-top: 10px;"> <input onchange="saveST();" class="form-check-input" type="checkbox" role="switch" id="enable-stella"> - <label class="form-check-label" for="enable-stella">Mist Stella</label> - <div class="text-muted small">Enjoy your music is a unique way thanks to the Mist Stella spatial audio technology. Stella makes your music feel like it's coming from all around you, giving you a concert-like experience. Note that Stella uses slightly more bandwidth than lossless streaming.</div> + <label class="form-check-label" for="enable-stella"> + Mist Stella + <div class="text-muted small">Enjoy your music is a unique way thanks to the Mist Stella spatial audio technology. Stella makes your music feel like it's coming from all around you, giving you a concert-like experience. Note that Stella uses slightly more bandwidth than lossless streaming.</div> + </label> </div> <script> if (localStorage.getItem("show-stella-settings") === "true") document.getElementById("stella").style.display = ""; @@ -72,8 +80,10 @@ <?php if (str_contains($_SERVER['HTTP_USER_AGENT'], "MistNative/")): ?> <div class="form-check form-switch" style="margin-top: 10px;"> <input onchange="saveDN();" class="form-check-input" type="checkbox" role="switch" id="desktop-notification"> - <label class="form-check-label" for="desktop-notification">Display notification when song changes</label> - <div class="text-muted small">If this is enabled, a desktop notification will be shown when the song being played changes, containing information about the new song. This requires having notifications enabled in your system settings.</div> + <label class="form-check-label" for="desktop-notification"> + Display notification when song changes + <div class="text-muted small">If this is enabled, a desktop notification will be shown when the song being played changes, containing information about the new song. This requires having notifications enabled in your system settings.</div> + </label> </div> <script> if (localStorage.getItem("desktop-notification") === "true") document.getElementById("desktop-notification").checked = true; @@ -86,8 +96,10 @@ <?php if (str_contains($_SERVER['HTTP_USER_AGENT'], "MistNative/")): ?> <div class="form-check form-switch" style="margin-top: 10px;"> <input onchange="saveRP();" class="form-check-input" type="checkbox" role="switch" id="rich-presence"> - <label class="form-check-label" for="desktop-notification">Show the song you are listening to on Discord</label> - <div class="text-muted small">Using Discord Rich Presence, Mist can display on Discord the song you are currently listening to. You need to have the Discord desktop app installed and running on your computer for this to work.</div> + <label class="form-check-label" for="desktop-notification"> + Show the song you are listening to on Discord + <div class="text-muted small">Using Discord Rich Presence, Mist can display on Discord the song you are currently listening to. You need to have the Discord desktop app installed and running on your computer for this to work.</div> + </label> </div> <script> if (localStorage.getItem("rich-presence") === "true") document.getElementById("rich-presence").checked = true; @@ -106,6 +118,120 @@ <?php endif; ?> <hr> + <h5>Privacy</h5> + + <div style="display: grid; grid-template-columns: 1fr max-content; grid-gap: 20px;"> + <div> + <label for="privacy-profile"> + Who can see your Mist profile? + <div class="text-muted small">Your Mist profile always shows some information about you that is publicly available on your Equestria.dev account. If you would like people not to know you are using Mist, you can change it here.</div> + </label> + </div> + <div> + <select disabled onchange="savePrivacy();" class="form-select" id="privacy-profile"> + <option selected value="2">Everyone</option> + <option value="1">All Mist users</option> + <option value="0">Only me</option> + </select> + </div> + </div> + <div style="display: grid; grid-template-columns: 1fr max-content; grid-gap: 20px; margin-top: 10px;"> + <div> + <label for="privacy-library"> + Who can see your library? + <div class="text-muted small">Your library can show up on your profile if you wish for it to show up. It will show all the albums and songs you have manually added to your library and not the songs you have only searched for.</div> + </label> + </div> + <div> + <select disabled onchange="savePrivacy();" class="form-select" id="privacy-library"> + <option value="2">Everyone</option> + <option value="1">All Mist users</option> + <option selected value="0">Only me</option> + </select> + </div> + </div> + <div style="display: grid; grid-template-columns: 1fr max-content; grid-gap: 20px; margin-top: 10px;"> + <div> + <label for="privacy-library"> + Who can see your history and activity? + <div class="text-muted small">If this is enabled, other people can see when you last used Mist and which songs you last listened to. Turning this on might reveal personal information, so be careful if you set this to "Everyone".</div> + </label> + </div> + <div> + <select disabled onchange="savePrivacy();" class="form-select" id="privacy-history"> + <option value="2">Everyone</option> + <option value="1">All Mist users</option> + <option selected value="0">Only me</option> + </select> + </div> + </div> + <div style="display: grid; grid-template-columns: 1fr max-content; grid-gap: 20px; margin-top: 10px;"> + <div> + <label for="privacy-favorites"> + Who can see your favorites? + <div class="text-muted small">Other people can see your favorites on your profile to know what songs you like. If you don't turn on the option below, other Mist users will not be able to directly listen to them in the Mist app.</div> + </label> + </div> + <div> + <select disabled onchange="savePrivacy();" class="form-select" id="privacy-favorites"> + <option value="2">Everyone</option> + <option value="1">All Mist users</option> + <option selected value="0">Only me</option> + </select> + </div> + </div> + <div style="display: grid; grid-template-columns: 1fr max-content; grid-gap: 20px; margin-top: 10px;"> + <div> + <label for="privacy-listen"> + Who can listen to your favorites? + <div class="text-muted small">If this is enabled, other Mist users will see your favorites directly in the application, giving them the option to listen to them if they want to. This means you won't have to share anything manually.</div> + </label> + </div> + <div> + <select disabled onchange="savePrivacy();" class="form-select" id="privacy-listen"> + <option value="1">All Mist users</option> + <option selected value="0">Only me</option> + </select> + </div> + </div> + <div style="display: grid; grid-template-columns: 1fr max-content; grid-gap: 20px; margin-top: 10px;"> + <div> + <label for="privacy-custom"> + Who can see your profile customizations? + <div class="text-muted small">If you customize your Mist profile through the options provided inside the app, you can choose who will see these customizations. This includes your banner, color, description, and all other settings.</div> + </label> + </div> + <div> + <select disabled onchange="savePrivacy();" class="form-select" id="privacy-custom"> + <option value="2">Everyone</option> + <option selected value="1">All Mist users</option> + <option value="0">Only me</option> + </select> + </div> + </div> + + <hr> + <h5>Profile</h5> + <p><a target="_blank" href="/profile/?/<?= $_PROFILE["id"] ?>">View your profile</a> · <a target="_blank" href="#" id="profile-url-btn">Copy profile URL</a></p> + <div class="mb-3"> + <label for="description" class="form-label">Profile description:</label> + <textarea onchange="saveCustom();" maxlength="500" class="form-control" id="description" rows="3" placeholder="You can enter some information about your musical tastes, your experience working with audio and music, the hardware you use, etc... Markdown is also supported. If the content in your profile is not safe for work, remember to check the corresponding box."></textarea> + </div> + + <div class="mb-3"> + <label for="banner" class="form-label">Profile banner:</label> + <input onchange="saveCustom();" maxlength="120" type="text" class="form-control" id="banner" placeholder="Enter an image URL or a Derpibooru URL"> + </div> + + <div class="form-check form-switch"> + <input onchange="saveCustom();" class="form-check-input" type="checkbox" role="switch" id="nsfw"> + <label class="form-check-label" for="nsfw"> + Mark profile as not safe for work + <div class="text-muted small">If your profile contains adult or violent content, check this box. This will show a warning when users open your profile informing them about the content that can be found on it, and giving them the option to not read your profile if needed.</div> + </label> + </div> + + <hr> <?php if (str_contains($_SERVER['HTTP_USER_AGENT'], "MistNative/")): ?> <a onclick="window.parent.MistNative.about();" href="#">About Mist</a> <?php else: ?> @@ -113,6 +239,7 @@ <img class="icon" src="/assets/logo-transparent.svg" style="vertical-align: middle; filter: grayscale(1) invert(1); width: 32px; height: 32px;" alt=""> <span style="vertical-align: middle;">Mist version <?= str_replace("|", " ", file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/version")) ?> (build <?= trim(file_exists("/opt/spotify/build.txt") ? file_get_contents("/opt/spotify/build.txt") : "trunk") ?>)<span id="copyright-separator-desktop"> · </span><span id="copyright-separator-mobile"><br></span>© <?= date('Y') ?> Equestria.dev</span> </div> + <br><br> <style> @media (min-width: 768px) { #copyright-separator-mobile { @@ -126,7 +253,82 @@ } } </style> - <?php endif; ?> + <?php endif; global $privacy; global $profile; ?> + <script> + async function saveCustom() { + document.getElementById("banner").disabled = true; + document.getElementById("description").disabled = true; + document.getElementById("nsfw").disabled = true; + + let customData = { + nsfw: document.getElementById("nsfw").checked, + description: document.getElementById("description").value.trim().substring(0, 500), + url: document.getElementById("banner").value.trim().substring(0, 120) + } + + console.log(customData); + + let fd = new FormData(); + fd.append('nsfw', customData.nsfw); + fd.append('description', customData.description); + fd.append('url', customData.url); + + await fetch("/api/saveProfile.php", { + body: fd, + method: "post" + }); + + document.getElementById("banner").disabled = false; + document.getElementById("description").disabled = false; + document.getElementById("nsfw").disabled = false; + } + + async function savePrivacy() { + document.getElementById("privacy-profile").disabled = true; + document.getElementById("privacy-library").disabled = true; + document.getElementById("privacy-history").disabled = true; + document.getElementById("privacy-favorites").disabled = true; + document.getElementById("privacy-listen").disabled = true; + document.getElementById("privacy-custom").disabled = true; + + await fetch("/api/savePrivacy.php?profile=" + document.getElementById("privacy-profile").value + "&library=" + document.getElementById("privacy-library").value + "&history=" + document.getElementById("privacy-history").value + "&favorites=" + document.getElementById("privacy-favorites").value + "&listen=" + document.getElementById("privacy-listen").value + "&custom=" + document.getElementById("privacy-custom").value); + + document.getElementById("privacy-profile").disabled = false; + document.getElementById("privacy-library").disabled = false; + document.getElementById("privacy-history").disabled = false; + document.getElementById("privacy-favorites").disabled = false; + document.getElementById("privacy-listen").disabled = false; + document.getElementById("privacy-custom").disabled = false; + } + + function loadSettings(privacy, profile) { + window.privacySettings = privacy; + window.profileSettings = profile; + + for (let item of Object.keys(privacy)) { + document.getElementById("privacy-" + item).value = privacy[item].toString(); + } + + document.getElementById("nsfw").checked = window.profileSettings.nsfw; + document.getElementById("description").value = window.profileSettings.description; + document.getElementById("banner").value = window.profileSettings.banner_orig ?? window.profileSettings.banner; + + document.getElementById("privacy-profile").disabled = false; + document.getElementById("privacy-library").disabled = false; + document.getElementById("privacy-history").disabled = false; + document.getElementById("privacy-favorites").disabled = false; + document.getElementById("privacy-listen").disabled = false; + document.getElementById("privacy-custom").disabled = false; + } + + document.getElementById("profile-url-btn").onclick = (e) => { + e.preventDefault(); + navigator.clipboard.writeText("https://mist.equestria.horse/profile/?/<?= $_PROFILE["id"] ?>"); + } + + loadSettings(JSON.parse(`<?= json_encode($privacy) ?>`), JSON.parse(`<?= json_encode($profile) ?>`)); + </script> </div> + </div> </body> </html>
\ No newline at end of file diff --git a/app/ui/update.php b/app/ui/update.php index b50dc21..a5776f3 100644 --- a/app/ui/update.php +++ b/app/ui/update.php @@ -27,7 +27,7 @@ <div style="text-align: center;"> <?php $releaseNotes = true; require_once "../notes/update-1.0.0.php" ?> - <a style="margin-top: 50px; margin-bottom: 30px; display: block;" class="btn btn-primary" onclick="localStorage.setItem('lastUpdate', '<?= trim(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/version")) ?>|<?= trim(file_exists("/opt/spotify/build.txt") ? file_get_contents("/opt/spotify/build.txt") : "trunk") ?>'); window.parent._modal.hide();">Continue</a> + <a style="margin-top: 50px; margin-bottom: 30px; display: block;" class="btn btn-primary" onclick="localStorage.setItem('lastUpdate', '<?= trim(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/version")) ?>'); window.parent._modal.hide();">Continue</a> </div> </div> diff --git a/app/ui/welcome-dp.php b/app/ui/welcome-dp.php deleted file mode 100644 index 3986ca3..0000000 --- a/app/ui/welcome-dp.php +++ /dev/null @@ -1,59 +0,0 @@ -<?php header("X-Frame-Options: SAMEORIGIN"); require_once $_SERVER['DOCUMENT_ROOT'] . "/includes/session.php"; ?> -<!doctype html> -<html lang="en"> -<head> - <script> - if (typeof window.parent.parent.openModal === "undefined") { - location.href = "/app/"; - } - </script> - <meta charset="UTF-8"> - <meta name="viewport" - content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> - <meta http-equiv="X-UA-Compatible" content="ie=edge"> - <title>welcome-dp</title> - <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet"> - <link href="/assets/dark.css" rel="stylesheet"> - <link href="/assets/styles.css" rel="stylesheet"> - <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script> - <script src="/assets/localforage.min.js"></script> - <script src="/assets/fuse.min.js"></script> - <script src="/assets/js/shortcuts.js"></script> - <link id="native-css" href="/assets/native.css" rel="stylesheet" disabled> -</head> -<body class="crossplatform" style="background-color: transparent !important;"> - <script src="/assets/js/common.js"></script> - <div style="padding: 1rem;"> - <div> - <div class="alert alert-warning"> - <p><b>This is a Developer Preview of Mist meant to be used only for development and experimental purposes.</b></p> - <p>If you want to use Mist as your primary streaming platform, you need to register and wait for the stable release instead. Equestria.dev makes no guarantee whatsoever that user data on Developer Preview will remain and reserves the right to revoke access at any time.</p> - <p>Thank you for making third-party Mist applications and helping develop the ecosystem. If you need assistance in building your application or hosting it, please <a href="mailto:raindrops@equestria.dev" target="_blank">contact us</a>.</p> - <div>While building your application, please keep the following rules in mind:</div> - <ul> - <li>Sharing content from Mist publicly is illegal.</li> - <li>Applications must not use Mist in an abusive way.</li> - <li>Applications must not give guest access to Mist.</li> - <li>Applications must credit Mist.</li> - <li>Applications must be free to use.</li> - <li>Do not alter sound quality without notice.</li> - <li>Mist Stella implementations should get credit.</li> - </ul> - <div>Thanks. (version <?= explode("|", trim(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/version")))[0] ?>, build <?= trim(file_exists("/opt/spotify/build.txt") ? file_get_contents("/opt/spotify/build.txt") : "trunk") ?>)</div> - </div> - <div class="btn btn-primary" onclick="window.parent._modal.hide();">Close</div> - <hr> - <div class="small text-muted">"Mist", "Mist Stella", the Mist logo and the Mist Stella logo are trademarks of Equestria.dev Developers. Mist and Mist Stella are © <?= date('Y') ?> Equestria.dev developers, released under the MIT license.</div> - </div> - </div> - - <script> - window.sizeInterval = setInterval(() => { - if (document.body.clientHeight > 0) { - clearInterval(sizeInterval); - window.parent.document.getElementById("modal-frame").style.height = document.body.clientHeight + "px"; - } - }); - </script> -</body> -</html>
\ No newline at end of file diff --git a/app/ui/welcome.php b/app/ui/welcome.php index 800da74..9ca0d38 100644 --- a/app/ui/welcome.php +++ b/app/ui/welcome.php @@ -33,7 +33,7 @@ <p style="margin-top: 100px;" class="small text-muted">Your searches, favorites and library help improve the service. The administrators can provide you with more information about how your data is managed.</p> <p class="small text-muted">With your Equestria.dev Account, you will be able to sign in to available services. Equestria.dev records certain data for security, support and reporting purposes. <a target="_blank" href="https://equestria.dev/legal/privacy">See how this data is managed.</a></p> - <a style="margin-bottom: 30px; display: block;" class="btn btn-primary" onclick="localStorage.setItem('welcomed', 'true'); localStorage.setItem('lastUpdate', '<?= trim(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/version")) ?>|<?= trim(file_exists("/opt/spotify/build.txt") ? file_get_contents("/opt/spotify/build.txt") : "trunk") ?>'); window.parent._modal.hide();">Continue</a> + <a style="margin-bottom: 30px; display: block;" class="btn btn-primary" onclick="localStorage.setItem('welcomed', 'true'); localStorage.setItem('lastUpdate', '<?= trim(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/version")) ?>'); window.parent._modal.hide();">Continue</a> </div> </div> |