diff --git a/src/app/app.component.html b/src/app/app.component.html
index d95fa31..6f17558 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -323,6 +323,19 @@
mat-menu-item aria-label="Roboto italic">
Roboto italic
+
+
+
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index c1e3df1..cbca2ae 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -72,6 +72,15 @@ export class AppComponent implements OnInit {
initialized = false;
/** Whether it's Christmas currently. */
christmas: boolean;
+ /** Whether the button 'Other' in the font selection dropdown is available. */
+ fetchFontsButtonActive = false;
+ /** Set of locally installed fonts. Will contain values after the user pressed on 'Other fonts' and granted access. */
+ localFonts : {
+ family: string,
+ fullName: string,
+ postscriptName?: string,
+ style: string,
+ }[] = [];
/** Set the currently selected tab index (in the {@link DataService}). */
set tabIndex(value: number) {
@@ -110,8 +119,9 @@ export class AppComponent implements OnInit {
private readonly cache: CacheService,
protected readonly settings: SettingsService,
private readonly fileAccessService: FileAccessService,
- cdr: ChangeDetectorRef,
+ private readonly cdr: ChangeDetectorRef,
) {
+ this.fetchFontsButtonActive = 'queryLocalFonts' in window;
const date = new Date();
this.christmas = date.getMonth() === 11 && date.getDate() <= 27;
dataService.changeDetectionRequired.subscribe(() => cdr.markForCheck());
@@ -551,6 +561,27 @@ export class AppComponent implements OnInit {
window.location.reload();
}
+ /**
+ * Opens a dialog where the user can select any font from his local machine.
+ * The selected font will be saved to settings and used as default afterward.
+ */
+ openSetFontDialog(): void {
+ if (!('queryLocalFonts' in window)) {
+ throw new Error('Failed to load local fonts.');
+ }
+
+ (window as any).queryLocalFonts().then((fonts: {
+ family: string,
+ fullName: string,
+ postscriptName?: string,
+ style: string,
+ }[]) => {
+ this.localFonts = fonts;
+ this.fetchFontsButtonActive = false;
+ this.cdr.markForCheck();
+ });
+ }
+
/**
* Easter egg 🐰
*/
diff --git a/src/app/services/settings.service.ts b/src/app/services/settings.service.ts
index 156f91f..c54d1e1 100644
--- a/src/app/services/settings.service.ts
+++ b/src/app/services/settings.service.ts
@@ -5,8 +5,6 @@ import {isTauri} from "@clipboardjesus/helpers";
/** The boolean string value which is stored in the localstorage. */
const TRUE = 'True';
-/** The available font types. */
-type Font = 'Victor Mono' | 'Roboto';
/**
* The service which provides all the settings
@@ -105,18 +103,21 @@ export class SettingsService {
}
/** Backing field */
- private _fontFamily!: Font;
+ private _fontFamily!: string;
/** Get the app font family. */
- get fontFamily(): Font { return this._fontFamily; }
+ get fontFamily(): string { return this._fontFamily; }
/** Set the app font family. */
- set fontFamily(value: Font) {
+ set fontFamily(value: string) {
this._fontFamily = value;
if (value === 'Roboto') {
SettingsService.setFontFamily('var(--font-family-roboto)');
localStorage.removeItem(this.storageKeys.fontFamily);
- } else {
+ } else if (value === 'Victor Mono') {
SettingsService.setFontFamily('var(--font-family-victor)');
localStorage.setItem(this.storageKeys.fontFamily, value);
+ } else {
+ SettingsService.setFontFamily(value);
+ localStorage.setItem(this.storageKeys.fontFamily, value);
}
}
@@ -158,7 +159,7 @@ export class SettingsService {
this.alwaysOnTop = localStorage.getItem(this.storageKeys.alwaysOnTop) === TRUE;
this.animationsDisabled = localStorage.getItem(this.storageKeys.animationsDisabled) === TRUE;
this.language = localStorage.getItem(this.storageKeys.language) ?? 'en';
- this.fontFamily = localStorage.getItem(this.storageKeys.fontFamily) as Font ?? 'Roboto';
+ this.fontFamily = localStorage.getItem(this.storageKeys.fontFamily) ?? 'Roboto';
this.fontStyle = localStorage.getItem(this.storageKeys.fontStyle) ?? 'normal';
this.dblClickMode = localStorage.getItem(this.storageKeys.dblClickMode) === TRUE;