feat(settings): add setting for decorations

src/app/common/models/settings.ts

@@ -4,12 +4,21 @@ export class Settings {
     public spectators: boolean;
     public spectatorsAnimation: boolean;
     public particles: boolean;
+    public decorations: boolean;
 
-    constructor(sound = true, ghosts = true, spectators = true, spectatorsAnimation = true, particles = true) {
+    constructor(
+        sound = true,
+        ghosts = true,
+        spectators = true,
+        spectatorsAnimation = true,
+        particles = true,
+        decorations = true
+    ) {
         this.sound = sound;
         this.ghosts = ghosts;
         this.spectators = spectators;
         this.spectatorsAnimation = spectatorsAnimation;
         this.particles = particles;
+        this.decorations = decorations;
     }
 }

src/app/common/services/settings.service.ts

@@ -11,6 +11,7 @@ export class SettingsService {
     private static SPECTATORS_KEY = 'settings_spectators';
     private static SPECTATORS_ANIMATION_KEY = 'settings_spectators_animation';
     private static PARTICLES_KEY = 'settings_particles';
+    private static DECORATIONS_KEY = 'settings_decorations';
 
     private settings: Settings;
 
@@ -20,7 +21,8 @@ export class SettingsService {
             localStorage.getItem(SettingsService.GHOSTS_KEY) !== 'false',
             localStorage.getItem(SettingsService.SPECTATORS_KEY) !== 'false',
             localStorage.getItem(SettingsService.SPECTATORS_ANIMATION_KEY) !== 'false',
-            localStorage.getItem(SettingsService.PARTICLES_KEY) !== 'false'
+            localStorage.getItem(SettingsService.PARTICLES_KEY) !== 'false',
+            localStorage.getItem(SettingsService.DECORATIONS_KEY) !== 'false'
         );
         this.settings;
     }
@@ -43,6 +45,7 @@ export class SettingsService {
     }
 
     public persistSettings(): void {
+        console.log('persist');
         StorageManager.save(SettingsService.SOUND_KEY, this.settings.sound ? 'true' : 'false');
         StorageManager.save(SettingsService.SPECTATORS_KEY, this.settings.spectators ? 'true' : 'false');
         StorageManager.save(
@@ -51,5 +54,6 @@ export class SettingsService {
         );
         StorageManager.save(SettingsService.GHOSTS_KEY, this.settings.ghosts ? 'true' : 'false');
         StorageManager.save(SettingsService.PARTICLES_KEY, this.settings.particles ? 'true' : 'false');
+        StorageManager.save(SettingsService.DECORATIONS_KEY, this.settings.decorations ? 'true' : 'false');
     }
 }

src/app/game/game.ts

@@ -85,7 +85,7 @@ export class Game extends Engine {
             maxFps: 60,
             canvasElementId: 'game',
             suppressConsoleBootMessage: true,
-            antialiasing: true,
+            antialiasing: false,
             suppressHiDPIScaling: true
         });
 

src/app/game/scenes/race.ts

@@ -293,7 +293,7 @@ export class Race extends Scene {
             this.add(gate);
         }
 
-        if (track.decorations?.length) {
+        if ((this.engine as Game).settingsService.getSettings().decorations && track.decorations?.length) {
             for (const stockableDecoration of track.decorations) {
                 const decoration = new Decoration(
                     vec(stockableDecoration.x, stockableDecoration.y),

src/app/pages/learning/learning.component.html

@@ -110,9 +110,10 @@
         Here, you can customize various settings:
         <ul>
             <li>Sounds</li>
-            <li>Ghosts (may affect performance)</li>
-            <li>Spectators (may affect performance)</li>
+            <li>Ghosts</li>
+            <li>Spectators</li>
             <li>Particles (may affect performance)</li>
+            <li>Decorations</li>
         </ul>
         You can also restore the game to its default settings and erase all
         data.

src/app/pages/settings/settings.component.html

@@ -40,4 +40,10 @@
             <app-checkbox [(checked)]="settings().particles"></app-checkbox>
         </div>
     </div>
+    <div class="setting-item">
+        <div class="name">Decorations</div>
+        <div class="value">
+            <app-checkbox [(checked)]="settings().decorations"></app-checkbox>
+        </div>
+    </div>
 </div>

src/app/pages/settings/settings.component.ts

@@ -20,7 +20,6 @@ import { User } from '../../common/models/user';
 })
 export class SettingsComponent implements OnDestroy {
     private location = inject(Location);
-    private router = inject(Router);
 
     protected authService = inject(AuthService);
     protected settingsService = inject(SettingsService);