diff options
author | Frankie B <git@diskfloppy.me> | 2024-01-22 01:16:42 +0000 |
---|---|---|
committer | Frankie B <git@diskfloppy.me> | 2024-01-22 01:19:23 +0000 |
commit | 6fa9efcc74a9c36f9e2178ee5427eafb8d470d99 (patch) | |
tree | 9bbcf3d82d3c3b49ec34b89d7a2ec625ea6cb400 | |
parent | 75fed3cbc11691ca9f50780cad187e5693354c49 (diff) |
Get scheme cookie server-side instead of client-side on page load
-rw-r--r-- | app/Http/Middleware/EncryptCookies.php | 2 | ||||
-rw-r--r-- | public/js/schemeSwap.js (renamed from public/js/themeSwap.js) | 23 | ||||
-rw-r--r-- | resources/views/includes/head.blade.php | 7 | ||||
-rw-r--r-- | resources/views/layouts/default.blade.php | 2 |
4 files changed, 9 insertions, 25 deletions
diff --git a/app/Http/Middleware/EncryptCookies.php b/app/Http/Middleware/EncryptCookies.php index 867695b..5ee1433 100644 --- a/app/Http/Middleware/EncryptCookies.php +++ b/app/Http/Middleware/EncryptCookies.php @@ -12,6 +12,6 @@ class EncryptCookies extends Middleware * @var array<int, string> */ protected $except = [ - // + "colorscheme" ]; } diff --git a/public/js/themeSwap.js b/public/js/schemeSwap.js index 18faaee..de5a6b2 100644 --- a/public/js/themeSwap.js +++ b/public/js/schemeSwap.js @@ -1,5 +1,5 @@ /** - * Retrieves a cookie's value + * Retrieves a cookies value * @param {string} cname Cookie name * @returns {string} Cookie value */ @@ -44,29 +44,10 @@ function cookieExists(cname) { /** * Swaps the colorscheme - * @param option + * @param {string} scheme Color scheme ID */ function swapScheme(scheme) { setCookie("colorscheme", scheme, 90); document.getElementById("css-colorscheme").href = `/css/colorschemes/${scheme}.css`; console.log(`Set colorscheme to ${getCookie("colorscheme")}`) } - -function setDefaultScheme() { - if (!cookieExists("colorscheme")) { - setCookie("colorscheme", "catppuccin-macchiato", 90); - console.debug("Set default colorscheme"); - } else { - const scheme = getCookie("colorscheme"); - const schemeselector = document.getElementById("scheme-selector"); - if (scheme && schemeselector) { - for (let option of schemeselector.options) { - if (option.value == scheme) { - option.selected = true; - break; - } - } - } - swapScheme(scheme); - } -} diff --git a/resources/views/includes/head.blade.php b/resources/views/includes/head.blade.php index 3d51672..d6d1280 100644 --- a/resources/views/includes/head.blade.php +++ b/resources/views/includes/head.blade.php @@ -1,13 +1,16 @@ +@php // Get colorscheme from cookie and apply immediately + $colorscheme = request()->cookie('colorscheme', 'catppuccin-macchiato'); +@endphp <!-- Global --> <meta charset="utf-8"> <meta property="og:type" content="website"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="theme-color" content="#333333"> - <link rel="stylesheet" href="/css/colorschemes/catppuccin-macchiato.css" id="css-colorscheme"/> + <link rel="stylesheet" href="{{ asset("/css/colorschemes/{$colorscheme}.css") }}" id="css-colorscheme"/> <link rel="stylesheet" href="/css/master.css"/> <link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32"/> <link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16"/> - <script src="/js/themeSwap.js"></script> + <script src="/js/schemeSwap.js"></script> {!! (intval(date('n')) == 12) ? '<script src="/js/christmas/snow.js"></script>' : '' !!} <!-- Page-specific --> diff --git a/resources/views/layouts/default.blade.php b/resources/views/layouts/default.blade.php index 144c32b..996d895 100644 --- a/resources/views/layouts/default.blade.php +++ b/resources/views/layouts/default.blade.php @@ -4,7 +4,7 @@ @include('includes.head') </head> -<body onload="setDefaultScheme()"> +<body> <div class="page"> <div id="header" class="header"> @include('includes.header') |