added persistent theme cookie

This commit is contained in:
Jonas_Jones 2025-03-26 02:29:17 +01:00
parent 1b7b1129c7
commit 4d57c8c044
2 changed files with 41 additions and 4 deletions

View file

@ -93,6 +93,36 @@ export function deleteSavedGridCookie(cookieName = 'bingoGrid') {
deleteGameLockCookie();
}
/**
* Functions to add the Page-Theme cookie
* @module cookies
*/
export function setThemeCookie(pageTheme) {
document.cookie = `pageTheme=${pageTheme};path=/;max-age=31536000`; // Cookie lasts for 1 year
}
/**
* Function to check if the Page-Theme cookie is present
* @returns {String} The Theme from the cookie
*/
export function getThemeCookie() {
const cookies = document.cookie.split('; ');
for (let cookie of cookies) {
const [name, value] = cookie.split('=');
if (name === 'pageTheme') {
return decodeURIComponent(value);
}
}
return ""; // if the cookie is not found
}
/**
* Function to delete the Page-Theme cookie
*/
export function deleteThemeCookie() {
document.cookie = `pageTheme=;path=/;max-age=0`;
}
/**
* Delete all cookies and reload page
*/
@ -100,5 +130,6 @@ export function deleteAllCookies() {
deleteSavedEntriesCookie();
deleteSavedGridCookie();
deleteGameLockCookie();
deleteThemeCookie();
window.location.reload();
}

View file

@ -6,7 +6,7 @@
import jsPDF from 'jspdf';
import { page } from '$app/stores';
import party from "party-js";
import { getGridFromCookie, saveGridAsCookie, getEntriesFromCookie, saveEntriesAsCookie, deleteSavedGridCookie, isGameLockCookiePresent, addGameLockCookie, deleteGameLockCookie, deleteAllCookies } from '$lib/cookies.js';
import { getGridFromCookie, saveGridAsCookie, getEntriesFromCookie, saveEntriesAsCookie, deleteSavedGridCookie, isGameLockCookiePresent, addGameLockCookie, deleteGameLockCookie, deleteAllCookies, setThemeCookie, getThemeCookie } from '$lib/cookies.js';
$: queryParams = $page.url.searchParams;
$: bingocode = queryParams.get('bingo');
@ -226,12 +226,18 @@ Bingo Item 25`;
function toggleTheme() {
theme = theme === 'dark' ? 'light' : 'dark';
document.documentElement.setAttribute('data-theme', theme);
setThemeCookie(theme);
}
onMount(() => {
const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
theme = prefersDark ? 'dark' : 'light';
document.documentElement.setAttribute('data-theme', theme);
if (getThemeCookie()) {
theme = getThemeCookie();
document.documentElement.setAttribute('data-theme', theme);
} else {
const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
theme = prefersDark ? 'dark' : 'light';
document.documentElement.setAttribute('data-theme', theme);
}
const savedGrid = getGridFromCookie();
const savedEntries = getEntriesFromCookie();