From 41c51b8bdb9c8e9fa4a7d56f260d594739d4107e Mon Sep 17 00:00:00 2001
From: RaindropsSys <raindrops@equestria.dev>
Date: Mon, 30 Oct 2023 23:08:45 +0100
Subject: Updated 35 files and added 28 files (automated)

---
 app/ui/settings.php | 50 ++++++++++++++++++++++++++++++++++++++++++++++----
 1 file changed, 46 insertions(+), 4 deletions(-)

(limited to 'app/ui/settings.php')

diff --git a/app/ui/settings.php b/app/ui/settings.php
index e6dc9ba..34cd095 100644
--- a/app/ui/settings.php
+++ b/app/ui/settings.php
@@ -11,7 +11,7 @@
     <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>settings</title>
+    <title>Settings</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">
@@ -25,12 +25,12 @@
     <script src="/assets/js/common.js"></script>
     <div class="container">
         <br>
-        <h2 style="margin-top: 10px; margin-bottom: 20px; margin-left: 10px;">Settings</h2>
+        <h2 class="desktop-title" style="margin-top: 10px; margin-bottom: 20px; margin-left: 10px;">Settings</h2>
         <div style="margin-left: 10px;">
             <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 high efficient. If you use Bluetooth headphones, the difference should be unnoticeable.</div>
+                <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>
             </div>
             <script>
                 if (localStorage.getItem("data-saving") === "true") document.getElementById("data-saving").checked = true;
@@ -40,6 +40,35 @@
                 }
             </script>
 
+            <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>
+            </div>
+            <script>
+                if (localStorage.getItem("normalize") === "true") document.getElementById("normalize").checked = true;
+                function saveN() {
+                    localStorage.setItem("normalize", document.getElementById("normalize").checked ? "true" : "false");
+                    window.parent.location.reload();
+                }
+            </script>
+
+            <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>
+            </div>
+            <script>
+                if (localStorage.getItem("show-stella-settings") === "true") document.getElementById("stella").style.display = "";
+
+                if (localStorage.getItem("enable-stella") === "true") document.getElementById("enable-stella").checked = true;
+                function saveST() {
+                    localStorage.setItem("enable-stella", document.getElementById("enable-stella").checked ? "true" : "false");
+                    localStorage.setItem("show-stella-settings", "true");
+                    window.parent.location.reload();
+                }
+            </script>
+
             <?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">
@@ -82,8 +111,21 @@
             <?php else: ?>
             <div class="text-muted">
                 <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") ?>) · © <?= date('Y') ?> Equestria.dev</span>
+                <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>
+            <style>
+                @media (min-width: 768px) {
+                    #copyright-separator-mobile {
+                        display: none;
+                    }
+                }
+
+                @media (max-width: 767px) {
+                    #copyright-separator-desktop {
+                        display: none;
+                    }
+                }
+            </style>
             <?php endif; ?>
         </div>
 </body>
-- 
cgit