feat: 게임 설정을 단일 JSON으로 관리하는 newUserSetting 생성

src/constants/localStorage.constant.ts

@@ -11,3 +11,4 @@ export const KEY_HAPTIC_ENABLED = 'haptic-enabled';
 export const KEY_PREFIX_STATS = 'stats-';
 export const KEY_PREFIX_BEST_SCORE = 'stats-best-score-';
 export const KEY_GAME_MODE = 'game-mode';
+export const KEY_GAME_SETTINGS = 'game-settings';

src/pages/games/SnackGame/game/popup/SettingPopup.ts

@@ -13,6 +13,7 @@ import { RoundedBox } from '../ui/RoundedBox';
 import { Switch } from '../ui/Switch';
 import { VolumeSlider } from '../ui/VolumeSlider';
 import { gamePause, gameResume } from '../util/api';
+import { newUserSettings } from '../util/newUserSetting';
 import { storage } from '../util/storage';
 import { userSettings } from '../util/userSetting';
 
@@ -89,18 +90,21 @@ export class SettingsPopup extends Container implements AppScreen {
     this.masterSlider = new VolumeSlider(t('master_volume', { ns: 'game' }));
     this.masterSlider.onUpdate.connect((v) => {
       userSettings.setMasterVolume(v / 100);
+      newUserSettings.setMasterVolume(v / 100);
     });
     this.layout.addChild(this.masterSlider);
 
     this.bgmSlider = new VolumeSlider(t('bgm_volume', { ns: 'game' }));
     this.bgmSlider.onUpdate.connect((v) => {
       userSettings.setBgmVolume(v / 100);
+      newUserSettings.setBgmVolume(v / 100);
     });
     this.layout.addChild(this.bgmSlider);
 
     this.sfxSlider = new VolumeSlider(t('sfx_volume', { ns: 'game' }));
     this.sfxSlider.onUpdate.connect((v) => {
       userSettings.setSfxVolume(v / 100);
+      newUserSettings.setSfxVolume(v / 100);
     });
     this.layout.addChild(this.sfxSlider);
 
@@ -109,6 +113,7 @@ export class SettingsPopup extends Container implements AppScreen {
     this.hapticCheckBox.y = 10;
     this.hapticCheckBox.onCheck.connect((v) => {
       userSettings.setHapticEnabled(v);
+      newUserSettings.setHapticEnabled(v);
     });
     this.panel.addChild(this.hapticCheckBox);
   }
@@ -132,10 +137,10 @@ export class SettingsPopup extends Container implements AppScreen {
 
   /** 팝업을 표시하기 직전에 설정 */
   public async onPrepare(screen: Rectangle) {
-    this.masterSlider.value = userSettings.getMasterVolume() * 100;
-    this.bgmSlider.value = userSettings.getBgmVolume() * 100;
-    this.sfxSlider.value = userSettings.getSfxVolume() * 100;
-    this.hapticCheckBox.checked = userSettings.getHapticEnabled();
+    this.masterSlider.value = newUserSettings.getMasterVolume() * 100;
+    this.bgmSlider.value = newUserSettings.getBgmVolume() * 100;
+    this.sfxSlider.value = newUserSettings.getSfxVolume() * 100;
+    this.hapticCheckBox.checked = newUserSettings.getHapticEnabled();
   }
 
   /** 팝업을 애니메이션과 함께 표시 */

src/pages/games/SnackGame/game/util/hapticFeedback.ts

@@ -1,3 +1,4 @@
+import { newUserSettings } from './newUserSetting';
 import { userSettings } from './userSetting';
 
 type HapticMethod =
@@ -9,7 +10,7 @@ type HapticMethod =
 
 export const HapticFeedback = {
   async invoke(method: HapticMethod) {
-    const isHapticEnabled = userSettings.getHapticEnabled();
+    const isHapticEnabled = newUserSettings.getHapticEnabled();
     if (!isHapticEnabled) return;
 
     window.ReactNativeWebView?.postMessage(

src/pages/games/SnackGame/game/util/newUserSetting.ts

@@ -0,0 +1,87 @@
+import { KEY_GAME_SETTINGS } from '@constants/localStorage.constant';
+
+import { bgm, setMasterVolume, sfx } from './audio';
+import { storage } from './storage';
+
+class NewUserSettings {
+  private settings: {
+    hapticEnabled: boolean;
+    volumeMaster: number;
+    volumeBGM: number;
+    volumeSFX: number;
+  };
+
+  constructor() {
+    this.settings = this.loadSettings();
+    setMasterVolume(this.getMasterVolume());
+    bgm.setVolume(this.getBgmVolume());
+    sfx.setVolume(this.getSfxVolume());
+  }
+
+  private loadSettings() {
+    return storage.getObject(KEY_GAME_SETTINGS) ?? this.getDefaultSettings();
+  }
+
+  private getDefaultSettings() {
+    return {
+      hapticEnabled: true,
+      volumeMaster: 0.38,
+      volumeBGM: 0.83,
+      volumeSFX: 0.83,
+    };
+  }
+
+  private saveSettings() {
+    storage.setObject(KEY_GAME_SETTINGS, this.settings);
+  }
+
+  /** 전체 사운드 볼륨을 가져옵니다. */
+  public getMasterVolume() {
+    return this.settings.volumeMaster;
+  }
+
+  /** 전체 사운드 볼륨을 설정합니다. */
+  public setMasterVolume(value: number) {
+    setMasterVolume(value);
+    this.settings.volumeMaster = value;
+    this.saveSettings();
+  }
+
+  /** 배경 음악 볼륨을 가져옵니다. */
+  public getBgmVolume() {
+    return this.settings.volumeBGM;
+  }
+
+  /** 배경 음악 볼륨을 설정합니다. */
+  public setBgmVolume(value: number) {
+    bgm.setVolume(value);
+    this.settings.volumeBGM = value;
+    this.saveSettings();
+  }
+
+  /** 효과음 볼륨을 가져옵니다. */
+  public getSfxVolume() {
+    return this.settings.volumeSFX;
+  }
+
+  /** 효과음 볼륨을 설정합니다. */
+  public setSfxVolume(value: number) {
+    sfx.setVolume(value);
+    this.settings.volumeSFX = value;
+    this.saveSettings();
+  }
+
+  /** 햅틱 활성화 여부를 설정합니다. */
+  public setHapticEnabled(value: boolean) {
+    this.settings.hapticEnabled = value;
+    this.saveSettings();
+  }
+
+  /** 햅틱 활성화 여부를 가져옵니다. */
+  public getHapticEnabled() {
+    return this.settings.hapticEnabled;
+  }
+}
+
+/** 공유된 사용자 설정 인스턴스 */
+export const newUserSettings = new NewUserSettings();