feat: support for background and extra settings

Theme stored in `localStorage`

CHANGELOG.md

@@ -10,6 +10,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Added
 
 * Support for theme and palette selection
+* Theme stored in `localStorage`
 
 ### Changed
 

frontends/web/index.ts

@@ -40,7 +40,7 @@ const BACKGROUNDS = [
 
     // creates the emulator structure and initializes the
     // React app with both the parameters and the emulator
-    const emulator = new GameboyEmulator();
+    const emulator = new GameboyEmulator({ background: background });
     startApp("app", {
         emulator: emulator,
         fullscreen: fullscreen,

frontends/web/ts/gb.ts

@@ -93,6 +93,18 @@ export class GameboyEmulator extends EmulatorBase implements Emulator {
     private romSize = 0;
     private cartridge: Cartridge | null = null;
 
+    /**
+     * Associative map for extra settings to be used in
+     * opaque local storage operations, associated setting
+     * name with its value as a string.
+     */
+    private extraSettings: Record<string, string> = {};
+
+    constructor(extraSettings = {}) {
+        super();
+        this.extraSettings = extraSettings;
+    }
+
     /**
      * Runs the initialization and main loop execution for
      * the Game Boy emulator.
@@ -592,6 +604,11 @@ export class GameboyEmulator extends EmulatorBase implements Emulator {
         }
     }
 
+    onBackground(background: string) {
+        this.extraSettings.background = background;
+        this.storeSettings();
+    }
+
     /**
      * Tries to load game RAM from the `localStorage` using the
      * current cartridge title as the name of the item and
@@ -620,7 +637,8 @@ export class GameboyEmulator extends EmulatorBase implements Emulator {
     private storeSettings() {
         if (!window.localStorage) return;
         const settings = {
-            palette: PALETTES[this.paletteIndex].name
+            palette: PALETTES[this.paletteIndex].name,
+            ...this.extraSettings
         };
         localStorage.setItem("settings", JSON.stringify(settings));
     }