Use appSettings for SyncPlay settings

src/components/syncPlay/core/PlaybackCore.js

@@ -6,7 +6,7 @@
 import { Events } from 'jellyfin-apiclient';
 import { toBoolean, toFloat } from '../../../scripts/stringUtils';
 import * as Helper from './Helper';
-import Settings from './Settings';
+import { getSetting } from './Settings';
 
 /**
  * Class that manages the playback of SyncPlay.
@@ -39,7 +39,7 @@ class PlaybackCore {
         this.manager = syncPlayManager;
         this.timeSyncCore = syncPlayManager.getTimeSyncCore();
 
-        Events.on(Settings, 'update', () => {
+        Events.on(this.manager, 'settings-update', () => {
             this.loadPreferences();
         });
     }
@@ -49,25 +49,25 @@ class PlaybackCore {
      */
     loadPreferences() {
         // Minimum required delay for SpeedToSync to kick in, in milliseconds.
-        this.minDelaySpeedToSync = toFloat(Settings.get('minDelaySpeedToSync'), 60.0);
+        this.minDelaySpeedToSync = toFloat(getSetting('minDelaySpeedToSync'), 60.0);
 
         // Maximum delay after which SkipToSync is used instead of SpeedToSync, in milliseconds.
-        this.maxDelaySpeedToSync = toFloat(Settings.get('maxDelaySpeedToSync'), 3000.0);
+        this.maxDelaySpeedToSync = toFloat(getSetting('maxDelaySpeedToSync'), 3000.0);
 
         // Time during which the playback is sped up, in milliseconds.
-        this.speedToSyncDuration = toFloat(Settings.get('speedToSyncDuration'), 1000.0);
+        this.speedToSyncDuration = toFloat(getSetting('speedToSyncDuration'), 1000.0);
 
         // Minimum required delay for SkipToSync to kick in, in milliseconds.
-        this.minDelaySkipToSync = toFloat(Settings.get('minDelaySkipToSync'), 400.0);
+        this.minDelaySkipToSync = toFloat(getSetting('minDelaySkipToSync'), 400.0);
 
         // Whether SpeedToSync should be used.
-        this.useSpeedToSync = toBoolean(Settings.get('useSpeedToSync'), true);
+        this.useSpeedToSync = toBoolean(getSetting('useSpeedToSync'), true);
 
         // Whether SkipToSync should be used.
-        this.useSkipToSync = toBoolean(Settings.get('useSkipToSync'), true);
+        this.useSkipToSync = toBoolean(getSetting('useSkipToSync'), true);
 
         // Whether sync correction during playback is active.
-        this.enableSyncCorrection = toBoolean(Settings.get('enableSyncCorrection'), true);
+        this.enableSyncCorrection = toBoolean(getSetting('enableSyncCorrection'), true);
     }
 
     /**

src/components/syncPlay/core/Settings.js

@@ -2,51 +2,27 @@
  * Module that manages SyncPlay settings.
  * @module components/syncPlay/core/Settings
  */
-import { Events, AppStorage } from 'jellyfin-apiclient';
+import appSettings from '../../../scripts/settings/appSettings';
 
 /**
- * Class that manages SyncPlay settings.
+ * Prefix used when saving SyncPlay settings.
  */
-class SyncPlaySettings {
-    constructor() {
-        // Do nothing
-    }
+const PREFIX = 'syncPlay';
 
-    /**
-     * Gets the key used to store a setting in the App Storage.
-     * @param {string} name The name of the setting.
-     * @returns {string} The key.
-     */
-    getKey(name) {
-        return 'syncPlay-' + name;
-    }
-
-    /**
+/**
  * Gets the value of a setting.
  * @param {string} name The name of the setting.
  * @returns {string} The value.
  */
-    get(name) {
-        return AppStorage.getItem(this.getKey(name));
-    }
+export function getSetting(name) {
+    return appSettings.get(name, PREFIX);
+}
 
-    /**
+/**
  * Sets the value of a setting. Triggers an update if the new value differs from the old one.
  * @param {string} name The name of the setting.
  * @param {Object} value The value of the setting.
  */
-    set(name, value) {
-        const oldValue = this.get(name);
-        AppStorage.setItem(this.getKey(name), value);
-        const newValue = this.get(name);
-
-        if (oldValue !== newValue) {
-            Events.trigger(this, name, [newValue, oldValue]);
-        }
-
-        console.debug(`SyncPlay Settings set: '${name}' from '${oldValue}' to '${newValue}'.`);
-    }
+export function setSetting(name, value) {
+    return appSettings.set(name, value, PREFIX);
 }
-
-/** SyncPlaySettings singleton. */
-export default new SyncPlaySettings();

src/components/syncPlay/core/index.js

@@ -1,5 +1,4 @@
 import * as Helper from './Helper';
-import Settings from './Settings';
 import ManagerClass from './Manager';
 import PlayerFactoryClass from './players/PlayerFactory';
 import GenericPlayer from './players/GenericPlayer';
@@ -9,7 +8,6 @@ const Manager = new ManagerClass(PlayerFactory);
 
 export default {
     Helper,
-    Settings,
     Manager,
     PlayerFactory,
     Players: {

src/components/syncPlay/core/timeSync/TimeSyncCore.js

@@ -4,8 +4,9 @@
  */
 
 import { Events } from 'jellyfin-apiclient';
+import appSettings from '../../../../scripts/settings/appSettings';
 import { toFloat } from '../../../../scripts/stringUtils';
-import Settings from '../Settings';
+import { getSetting } from '../Settings';
 import TimeSyncServer from './TimeSyncServer';
 
 /**
@@ -26,8 +27,8 @@ class TimeSyncCore {
         this.manager = null;
         this.timeSyncServer = null;
 
-        this.timeSyncDeviceId = Settings.get('timeSyncDevice') || 'server';
-        this.extraTimeOffset = toFloat(Settings.get('extraTimeOffset'), 0.0);
+        this.timeSyncDeviceId = getSetting('timeSyncDevice') || 'server';
+        this.extraTimeOffset = toFloat(getSetting('extraTimeOffset'), 0.0);
     }
 
     /**
@@ -47,8 +48,10 @@ class TimeSyncCore {
             Events.trigger(this, 'time-sync-server-update', [timeOffset, ping]);
         });
 
-        Events.on(Settings, 'extraTimeOffset', () => {
-            this.extraTimeOffset = toFloat(Settings.get('extraTimeOffset'), 0.0);
+        Events.on(appSettings, 'change', function (e, name) {
+            if (name === 'extraTimeOffset') {
+                this.extraTimeOffset = toFloat(getSetting('extraTimeOffset'), 0.0);
+            }
         });
     }
 

src/components/syncPlay/ui/settings/SettingsEditor.js

@@ -5,6 +5,7 @@
 
 import { Events } from 'jellyfin-apiclient';
 import SyncPlay from '../../core';
+import { getSetting, setSetting } from '../../core/Settings';
 import dialogHelper from '../../../dialogHelper/dialogHelper';
 import layoutManager from '../../../layoutManager';
 import loading from '../../../loading/loading';
@@ -95,14 +96,14 @@ class SettingsEditor {
     async initEditor() {
         const { context } = this;
 
-        context.querySelector('#txtExtraTimeOffset').value = toFloat(SyncPlay.Settings.get('extraTimeOffset'), 0.0);
-        context.querySelector('#chkSyncCorrection').checked = toBoolean(SyncPlay.Settings.get('enableSyncCorrection'), true);
-        context.querySelector('#txtMinDelaySpeedToSync').value = toFloat(SyncPlay.Settings.get('minDelaySpeedToSync'), 60.0);
-        context.querySelector('#txtMaxDelaySpeedToSync').value = toFloat(SyncPlay.Settings.get('maxDelaySpeedToSync'), 3000.0);
-        context.querySelector('#txtSpeedToSyncDuration').value = toFloat(SyncPlay.Settings.get('speedToSyncDuration'), 1000.0);
-        context.querySelector('#txtMinDelaySkipToSync').value = toFloat(SyncPlay.Settings.get('minDelaySkipToSync'), 400.0);
-        context.querySelector('#chkSpeedToSync').checked = toBoolean(SyncPlay.Settings.get('useSpeedToSync'), true);
-        context.querySelector('#chkSkipToSync').checked = toBoolean(SyncPlay.Settings.get('useSkipToSync'), true);
+        context.querySelector('#txtExtraTimeOffset').value = toFloat(getSetting('extraTimeOffset'), 0.0);
+        context.querySelector('#chkSyncCorrection').checked = toBoolean(getSetting('enableSyncCorrection'), true);
+        context.querySelector('#txtMinDelaySpeedToSync').value = toFloat(getSetting('minDelaySpeedToSync'), 60.0);
+        context.querySelector('#txtMaxDelaySpeedToSync').value = toFloat(getSetting('maxDelaySpeedToSync'), 3000.0);
+        context.querySelector('#txtSpeedToSyncDuration').value = toFloat(getSetting('speedToSyncDuration'), 1000.0);
+        context.querySelector('#txtMinDelaySkipToSync').value = toFloat(getSetting('minDelaySkipToSync'), 400.0);
+        context.querySelector('#chkSpeedToSync').checked = toBoolean(getSetting('useSpeedToSync'), true);
+        context.querySelector('#chkSkipToSync').checked = toBoolean(getSetting('useSkipToSync'), true);
     }
 
     onSubmit() {
@@ -130,16 +131,16 @@ class SettingsEditor {
         const useSpeedToSync = context.querySelector('#chkSpeedToSync').checked;
         const useSkipToSync = context.querySelector('#chkSkipToSync').checked;
 
-        SyncPlay.Settings.set('extraTimeOffset', extraTimeOffset);
-        SyncPlay.Settings.set('enableSyncCorrection', syncCorrection);
-        SyncPlay.Settings.set('minDelaySpeedToSync', minDelaySpeedToSync);
-        SyncPlay.Settings.set('maxDelaySpeedToSync', maxDelaySpeedToSync);
-        SyncPlay.Settings.set('speedToSyncDuration', speedToSyncDuration);
-        SyncPlay.Settings.set('minDelaySkipToSync', minDelaySkipToSync);
-        SyncPlay.Settings.set('useSpeedToSync', useSpeedToSync);
-        SyncPlay.Settings.set('useSkipToSync', useSkipToSync);
+        setSetting('extraTimeOffset', extraTimeOffset);
+        setSetting('enableSyncCorrection', syncCorrection);
+        setSetting('minDelaySpeedToSync', minDelaySpeedToSync);
+        setSetting('maxDelaySpeedToSync', maxDelaySpeedToSync);
+        setSetting('speedToSyncDuration', speedToSyncDuration);
+        setSetting('minDelaySkipToSync', minDelaySkipToSync);
+        setSetting('useSpeedToSync', useSpeedToSync);
+        setSetting('useSkipToSync', useSkipToSync);
 
-        Events.trigger(SyncPlay.Settings, 'update');
+        Events.trigger(SyncPlay.Manager, 'settings-update');
     }
 }