Start fixing MDI
This commit is contained in:
@@ -1,6 +1,5 @@
|
||||
import { EventEmitter } from '$lib/utils/EventEmitter';
|
||||
import { get } from 'svelte/store';
|
||||
import { accessibilitySettings, uiSettings } from '$lib/stores/mudStore';
|
||||
import { get, writable, type Writable } from 'svelte/store';
|
||||
|
||||
export interface Settings {
|
||||
accessibility: {
|
||||
@@ -30,6 +29,11 @@ export interface Settings {
|
||||
export class SettingsManager extends EventEmitter {
|
||||
private settings: Settings;
|
||||
private readonly STORAGE_KEY = 'svelte-mud-settings';
|
||||
private initialized = false;
|
||||
|
||||
// Create our own stores rather than depending on the ones from mudStore
|
||||
public accessibilitySettings: Writable<Settings['accessibility']>;
|
||||
public uiSettings: Writable<Settings['ui']>;
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
@@ -60,6 +64,31 @@ export class SettingsManager extends EventEmitter {
|
||||
}
|
||||
};
|
||||
|
||||
// Create the stores with default values
|
||||
this.accessibilitySettings = writable(this.settings.accessibility);
|
||||
this.uiSettings = writable(this.settings.ui);
|
||||
|
||||
// Set up subscriptions to save settings when they change
|
||||
this.accessibilitySettings.subscribe(value => {
|
||||
// Skip during initialization
|
||||
if (!this.initialized) return;
|
||||
|
||||
if (typeof window !== 'undefined') {
|
||||
// Use a small timeout to batch multiple rapid changes
|
||||
setTimeout(() => this.saveSettings(), 100);
|
||||
}
|
||||
});
|
||||
|
||||
this.uiSettings.subscribe(value => {
|
||||
// Skip during initialization
|
||||
if (!this.initialized) return;
|
||||
|
||||
if (typeof window !== 'undefined') {
|
||||
// Use a small timeout to batch multiple rapid changes
|
||||
setTimeout(() => this.saveSettings(), 100);
|
||||
}
|
||||
});
|
||||
|
||||
// Load settings from storage
|
||||
this.loadSettings();
|
||||
}
|
||||
@@ -68,102 +97,87 @@ export class SettingsManager extends EventEmitter {
|
||||
* Load settings from localStorage
|
||||
*/
|
||||
private loadSettings(): void {
|
||||
if (typeof window === 'undefined') {
|
||||
return; // Skip during SSR
|
||||
// Skip during SSR
|
||||
if (typeof window === 'undefined' || typeof localStorage === 'undefined') {
|
||||
console.log('SSR environment detected, skipping settings load');
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
try {
|
||||
const storedSettings = localStorage.getItem(this.STORAGE_KEY);
|
||||
|
||||
if (storedSettings) {
|
||||
console.log('Retrieved settings from localStorage');
|
||||
const parsedSettings = JSON.parse(storedSettings);
|
||||
|
||||
// Merge with defaults to ensure all properties exist
|
||||
this.settings = {
|
||||
accessibility: {
|
||||
...this.settings.accessibility,
|
||||
...parsedSettings.accessibility
|
||||
},
|
||||
ui: {
|
||||
...this.settings.ui,
|
||||
...parsedSettings.ui
|
||||
}
|
||||
};
|
||||
|
||||
console.log('Loaded settings from localStorage:', this.settings);
|
||||
|
||||
// Update Svelte stores with loaded settings
|
||||
accessibilitySettings.set(this.settings.accessibility);
|
||||
uiSettings.set(this.settings.ui);
|
||||
|
||||
this.emit('settingsLoaded', this.settings);
|
||||
if (parsedSettings && typeof parsedSettings === 'object') {
|
||||
// Update internal settings
|
||||
this.settings = {
|
||||
accessibility: {
|
||||
...this.settings.accessibility,
|
||||
...(parsedSettings.accessibility || {})
|
||||
},
|
||||
ui: {
|
||||
...this.settings.ui,
|
||||
...(parsedSettings.ui || {})
|
||||
}
|
||||
};
|
||||
|
||||
console.log('Loaded settings from localStorage:', this.settings);
|
||||
|
||||
// Set the stores without triggering the save callback
|
||||
this.accessibilitySettings.set(this.settings.accessibility);
|
||||
this.uiSettings.set(this.settings.ui);
|
||||
} else {
|
||||
console.warn('Invalid settings format found in localStorage');
|
||||
}
|
||||
} else {
|
||||
console.log('No settings found in localStorage, using defaults');
|
||||
// Update Svelte stores with default settings
|
||||
accessibilitySettings.set(this.settings.accessibility);
|
||||
uiSettings.set(this.settings.ui);
|
||||
}
|
||||
|
||||
// Now that settings are loaded, mark as initialized
|
||||
this.initialized = true;
|
||||
|
||||
// Notify listeners
|
||||
this.emit('settingsLoaded', this.settings);
|
||||
} catch (error) {
|
||||
console.error('Failed to load settings from localStorage:', error);
|
||||
// Mark as initialized even on error
|
||||
this.initialized = true;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Save settings to localStorage
|
||||
*/
|
||||
// Save settings to localStorage
|
||||
public saveSettings(): void {
|
||||
if (typeof window === 'undefined') {
|
||||
return; // Skip during SSR
|
||||
}
|
||||
if (typeof window === 'undefined' || !this.initialized) return;
|
||||
|
||||
try {
|
||||
// Get current values from stores
|
||||
this.settings.accessibility = get(accessibilitySettings);
|
||||
this.settings.ui = get(uiSettings);
|
||||
this.settings.accessibility = get(this.accessibilitySettings);
|
||||
this.settings.ui = get(this.uiSettings);
|
||||
|
||||
localStorage.setItem(this.STORAGE_KEY, JSON.stringify(this.settings));
|
||||
console.log('Saved settings to localStorage:', this.settings);
|
||||
console.log('Saved settings to localStorage');
|
||||
|
||||
this.emit('settingsSaved', this.settings);
|
||||
} catch (error) {
|
||||
console.error('Failed to save settings to localStorage:', error);
|
||||
console.error('Failed to save settings:', error);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Update accessibility settings
|
||||
*/
|
||||
// Update methods
|
||||
public updateAccessibilitySettings(newSettings: Partial<Settings['accessibility']>): void {
|
||||
accessibilitySettings.update(current => {
|
||||
const updated = { ...current, ...newSettings };
|
||||
this.settings.accessibility = updated;
|
||||
this.saveSettings();
|
||||
return updated;
|
||||
});
|
||||
|
||||
this.emit('accessibilitySettingsUpdated', get(accessibilitySettings));
|
||||
this.accessibilitySettings.update(current => ({...current, ...newSettings}));
|
||||
}
|
||||
|
||||
/**
|
||||
* Update UI settings
|
||||
*/
|
||||
public updateUiSettings(newSettings: Partial<Settings['ui']>): void {
|
||||
uiSettings.update(current => {
|
||||
const updated = { ...current, ...newSettings };
|
||||
this.settings.ui = updated;
|
||||
this.saveSettings();
|
||||
return updated;
|
||||
});
|
||||
|
||||
this.emit('uiSettingsUpdated', get(uiSettings));
|
||||
this.uiSettings.update(current => ({...current, ...newSettings}));
|
||||
}
|
||||
|
||||
/**
|
||||
* Reset settings to defaults
|
||||
*/
|
||||
// Reset settings to defaults
|
||||
public resetSettings(): void {
|
||||
// Create default settings
|
||||
const defaultSettings: Settings = {
|
||||
const defaults = {
|
||||
accessibility: {
|
||||
textToSpeech: false,
|
||||
highContrast: false,
|
||||
@@ -188,27 +202,19 @@ export class SettingsManager extends EventEmitter {
|
||||
}
|
||||
};
|
||||
|
||||
// Update stores
|
||||
accessibilitySettings.set(defaultSettings.accessibility);
|
||||
uiSettings.set(defaultSettings.ui);
|
||||
|
||||
// Update internal settings and save
|
||||
this.settings = defaultSettings;
|
||||
this.saveSettings();
|
||||
|
||||
this.emit('settingsReset', defaultSettings);
|
||||
this.accessibilitySettings.set(defaults.accessibility);
|
||||
this.uiSettings.set(defaults.ui);
|
||||
this.emit('settingsReset', defaults);
|
||||
}
|
||||
|
||||
/**
|
||||
* Import settings from a JSON string
|
||||
*/
|
||||
// Import/export
|
||||
public importSettings(json: string): void {
|
||||
try {
|
||||
const imported = JSON.parse(json);
|
||||
|
||||
if (typeof imported === 'object' && imported !== null) {
|
||||
// Create a valid settings object with defaults for missing properties
|
||||
const newSettings: Settings = {
|
||||
const newSettings = {
|
||||
accessibility: {
|
||||
...this.settings.accessibility,
|
||||
...(imported.accessibility || {})
|
||||
@@ -220,12 +226,11 @@ export class SettingsManager extends EventEmitter {
|
||||
};
|
||||
|
||||
// Update stores
|
||||
accessibilitySettings.set(newSettings.accessibility);
|
||||
uiSettings.set(newSettings.ui);
|
||||
this.accessibilitySettings.set(newSettings.accessibility);
|
||||
this.uiSettings.set(newSettings.ui);
|
||||
|
||||
// Update internal settings and save
|
||||
// Update internal settings
|
||||
this.settings = newSettings;
|
||||
this.saveSettings();
|
||||
|
||||
this.emit('settingsImported', newSettings);
|
||||
}
|
||||
@@ -235,13 +240,10 @@ export class SettingsManager extends EventEmitter {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Export settings to a JSON string
|
||||
*/
|
||||
public exportSettings(): string {
|
||||
// Get current values from stores
|
||||
this.settings.accessibility = get(accessibilitySettings);
|
||||
this.settings.ui = get(uiSettings);
|
||||
this.settings.accessibility = get(this.accessibilitySettings);
|
||||
this.settings.ui = get(this.uiSettings);
|
||||
|
||||
return JSON.stringify(this.settings, null, 2);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user