@geogirafe/lib-geoportal
Version:
GeoGirafe is a flexible application to build online geoportals.
85 lines (84 loc) • 3.06 kB
TypeScript
import GirafeHTMLElement from '../../base/GirafeHTMLElement';
import UserDataManager from '../../tools/userdata/userdatamanager';
import { PreferenceGroup, UserPreference } from './userPreference';
import GirafeColorPicker from '../../tools/utils/girafecolorpicker';
/**
Lets the user override default configuration values and saves them as user data.
*/
export default class UserPreferencesComponent extends GirafeHTMLElement {
template: () => import("uhtml").Hole;
visible: boolean;
ready: boolean;
preferences: Record<string, UserPreference>;
preferenceGroups: PreferenceGroup[];
colorPickers: Record<string, GirafeColorPicker>;
userDataManager: UserDataManager;
private readonly storagePath;
constructor();
connectedCallback(): void;
render(): void;
private renderComponent;
private togglePanel;
onChangeDarkMapMode(newValue: boolean | undefined): void;
onChangeDarkFrontendMode(newValue: boolean | undefined): void;
activateTheme(mode: 'dark' | 'light', className: string): void;
/**
For preferences that have options to choose from, readout all possible select options to show in the dropdowns
*/
private initPreferenceOptions;
/**
* Collect all possible options for the default theme preference. This has to be repeatable, since the user
* can create new custom themes at any time.
*/
private refreshThemeOptions;
/**
Readout the default value from the config to show in the component
*/
private initCurrentPreferenceValues;
/**
* Initializes dark mode-related preferences with fallback logic
*/
private initDarkModeDefaults;
/**
* Create color picker object and set the initial color value
*/
private initColorPicker;
/**
* If necessary, change/update options of select elements right before they're shown.
*/
onOpenSelectOption(preferenceKey: string): void;
/**
Called when user changes a preference in the panel
*/
onSelectOption(preferenceKey: string, evt: Event): void;
/**
Update state and local storage with new value
*/
changePreference(preferenceKey: string, newValue: unknown): void;
/**
Update the config object with the new value
*/
private updatePreferenceInConfig;
/**
Update the state with the new value
*/
private updatePreferenceInState;
/**
Save the user preference as a config override in user data storage
*/
private updatePreferenceInStorage;
/**
Delete user preference in the local browser storage
*/
private deletePreferenceInStorage;
/**
* Reset user preferences back to defaults. This will delete the configOverrides object in storage and set the
* current state back to the defaults from config.json
*/
onResetAll(): Promise<void>;
private resetAll;
/**
* @returns all preferences of a group for easy usage in the template.
*/
getPreferencesByGroup(group: string): [UserPreference, string][];
}