diff --git a/page/src/playground.tsx b/page/src/playground.tsx index 42ae12a0..6d771afe 100644 --- a/page/src/playground.tsx +++ b/page/src/playground.tsx @@ -12,7 +12,7 @@ import { PopoverTrigger, } from "@/components/ui/popover"; -import { createDefaultSettings, Settings } from "./settings"; +import { Settings, loadSettings, saveSettings } from "./settings"; import { SettingsMenu } from "@/components/settings-menu"; import { PlayFill, StopFill, GearFill, PauseFill } from "react-bootstrap-icons"; @@ -79,7 +79,7 @@ export class Playground extends React.Component< this.toggleEmulatorState = this.toggleEmulatorState.bind(this); this.state = { - settings: createDefaultSettings(), + settings: loadSettings(), filesystemPromise: null, filesystem: null, emulator: null, @@ -247,7 +247,10 @@ export class Playground extends React.Component< this.setState({ settings: s })} + onChange={(s) => { + saveSettings(s); + this.setState({ settings: s }); + }} /> diff --git a/page/src/settings.ts b/page/src/settings.ts index b12fc819..d47e528e 100644 --- a/page/src/settings.ts +++ b/page/src/settings.ts @@ -16,6 +16,32 @@ export function createDefaultSettings(): Settings { }; } +export function loadSettings(): Settings { + const defaultSettings = createDefaultSettings(); + + const settingsStr = localStorage.getItem("settings"); + if (!settingsStr) { + return defaultSettings; + } + + try { + const userSettings = JSON.parse(settingsStr); + const keys = Object.keys(defaultSettings); + + keys.forEach((k) => { + if (k in userSettings) { + (defaultSettings as any)[k] = userSettings[k]; + } + }); + } catch (e) {} + + return defaultSettings; +} + +export function saveSettings(settings: Settings) { + localStorage.setItem("settings", JSON.stringify(settings)); +} + export function translateSettings(settings: Settings): string[] { const switches: string[] = [];