add method for filtering

This commit is contained in:
marlon-erler
2026-09-23 00:09:09 +02:00
parent 3458799a3b
commit 26c99085d2
61 changed files with 1703 additions and 1623 deletions
Binary file not shown.
+4 -4
View File
@@ -1,5 +1,5 @@
import * as React from "../../react";
import CoreViewModel from "./coreViewModel";
import * as React from "../../react";
export default class ConnectionViewModel {
// state
@@ -48,7 +48,7 @@ export default class ConnectionViewModel {
);
}
this.hideConnectionModal();
this.hideConnectionModal();
};
// methods
@@ -69,8 +69,8 @@ export default class ConnectionViewModel {
this.coreViewModel.connectionModel.removeAddress(address);
this.updatePreviousAddresses();
if (this.previousAddresses.value.size > 0) return;
this.hideConnectionModal();
if (this.previousAddresses.value.size > 0) return;
this.hideConnectionModal();
};
// view
+15 -12
View File
@@ -40,8 +40,8 @@ export default class CoreViewModel {
return;
while (this.contexts.length > 0) {
const currentContext: Context|undefined= this.context;
if (!currentContext) return;
const currentContext: Context | undefined = this.context;
if (!currentContext) return;
currentContext.handleContextClose(fromHistoryEvent);
this.contextStack.delete(currentContext.contextId);
if (currentContext.contextId == contextId) break;
@@ -49,9 +49,10 @@ export default class CoreViewModel {
};
handleKeyDown = (e: KeyboardEvent): void => {
if (!(e instanceof KeyboardEvent)) return console.trace("NOT A KEY EVENT");
if (!(e instanceof KeyboardEvent))
return console.trace("NOT A KEY EVENT");
if (CoreViewModel.checkIsKeystroke(e) == false) return;
console.log(e.key);
console.log(e.key);
e.preventDefault();
const contexts: Context[] = this.contexts;
while (contexts.length > 0) {
@@ -97,7 +98,7 @@ export default class CoreViewModel {
document.body.addEventListener("keydown", this.handleKeyDown);
window.onpopstate = () => {
if (!this.context) return;
if (!this.context) return;
this.closeContext(this.context.contextId, true);
};
@@ -164,11 +165,10 @@ export class ContextHost<T> extends Context {
updateContexts = (): void => {
if (this.isOpen == false) return;
const selection = this.contextSelection;
if (!selection) return;
const selectedContext: Context | undefined = this.contexts.get(
selection
);
const selection = this.contextSelection;
if (!selection) return;
const selectedContext: Context | undefined =
this.contexts.get(selection);
if (!selectedContext) return;
if (selectedContext != this.currentContext.value) {
this.closeCurrentContext();
@@ -178,7 +178,10 @@ export class ContextHost<T> extends Context {
this.currentContext.value = selectedContext;
};
constructor(contextDebugDescription: string, public coreViewModel: CoreViewModel) {
super(contextDebugDescription);
constructor(
contextDebugDescription: string,
public coreViewModel: CoreViewModel,
) {
super(contextDebugDescription);
}
}
@@ -1,5 +1,5 @@
import * as React from "../../react";
import CoreViewModel, { Context } from "./coreViewModel";
import * as React from "../../react";
import { CommonKeys } from "../../View/keystrokes";
import StorageModel, {
StorageModelSubPaths,
@@ -54,7 +54,9 @@ export default class FileTransferViewModel extends Context {
exportKey: React.State<string> = new React.State("");
exportKeyConfirmation: React.State<string> = new React.State("");
importedFile: React.State<File | undefined> = new React.State<File | undefined>(undefined);
importedFile: React.State<File | undefined> = new React.State<
File | undefined
>(undefined);
importedFileString: React.State<string> = new React.State("");
importKey: React.State<string> = new React.State("");
isImportKeyCorrect: React.State<boolean> = new React.State(true);
@@ -139,7 +141,7 @@ export default class FileTransferViewModel extends Context {
};
downloadFile = async (): Promise<void> => {
if (this.cannotExport.value == true) return;
if (this.cannotExport.value == true) return;
const date = new Date().toISOString().split("T")[0];
const backup: Blob =
@@ -158,7 +160,7 @@ export default class FileTransferViewModel extends Context {
if (!input) return;
if (!(input instanceof HTMLInputElement)) return;
if (!input.files) return;
if (!input.files) return;
const file = input.files[0];
this.importedFile.value = file;
};
@@ -171,7 +173,7 @@ export default class FileTransferViewModel extends Context {
reader.readAsText(file, "utf8");
reader.onload = () => {
const result = reader.result;
if (!result) return;
if (!result) return;
this.importedFileString.value = result.toString();
this.showImportDecryptDataModal();
};
@@ -1,6 +1,6 @@
import * as React from "../../react";
import { ChatPageTypes } from "../Chat/chatViewModel";
import ChatListViewModel from "../Chat/chatListViewModel";
import * as React from "../../react";
import ChatModel, { ChatMessage } from "../../Model/Chat/chatModel";
export default class NotificationViewModel {
@@ -35,7 +35,7 @@ export default class NotificationViewModel {
};
openNotification = () => {
const notification: Notification|undefined = this.marquee.value;
const notification: Notification | undefined = this.marquee.value;
if (notification == undefined) return;
const chat = [
@@ -44,7 +44,7 @@ export default class NotificationViewModel {
(chat) =>
chat.chatModel.unwrappedPrimaryChannel == notification.chat,
);
if (!chat) return;
if (!chat) return;
chat.open();
chat.openPage(ChatPageTypes.Messages);
};
@@ -56,8 +56,9 @@ export default class NotificationViewModel {
return this.stopLoop();
}
const notification: Notification|undefined = this.messagesInMarquee.shift();
if (!notification) return;
const notification: Notification | undefined =
this.messagesInMarquee.shift();
if (!notification) return;
this.seenMessageIds.delete(notification.messageId);
this.marquee.value = notification;
};
+103 -92
View File
@@ -1,5 +1,5 @@
import * as React from "../../react";
import CoreViewModel, { Context } from "./coreViewModel";
import * as React from "../../react";
import { CommonKeys } from "../../View/keystrokes";
import { Languages, ThemeSettings } from "../../Model/Global/settingsModel";
@@ -13,12 +13,12 @@ export default class SettingsViewModel extends Context {
requiresReload = new React.State<boolean>(false);
firstDayOfWeek: React.State<string> = new React.State("0");
language: React.State<Languages | string> = new React.State<Languages | string>(
Languages.English,
);
theme: React.State<ThemeSettings | string> = new React.State<ThemeSettings | string>(
ThemeSettings.System,
);
language: React.State<Languages | string> = new React.State<
Languages | string
>(Languages.English);
theme: React.State<ThemeSettings | string> = new React.State<
ThemeSettings | string
>(ThemeSettings.System);
// guards
cannotSetName: React.State<boolean> = React.createProxyState(
@@ -48,121 +48,132 @@ export default class SettingsViewModel extends Context {
};
showModalPage = (page: SettingsModalPages): void => {
this.selectedModalPage.value = page;
this.selectedModalPage.value = page;
};
// view
applyTheme = (): void => {
let theme: string = this.theme.value;
let theme: string = this.theme.value;
if (theme == ThemeSettings.Dynamic) {
const scene = this.selectDynamicScene();
this.setScene(scene);
return;
}
if (theme == ThemeSettings.Dynamic) {
const scene = this.selectDynamicScene();
this.setScene(scene);
return;
}
if (theme == ThemeSettings.System) {
theme = SettingsViewModel.getSystemTheme();
}
if (theme == ThemeSettings.System) {
theme = SettingsViewModel.getSystemTheme();
}
if (theme == ThemeSettings.Dark) {
this.setScene(DynamicSceneNight);
} else {
this.setScene(DynamicSceneDay);
}
if (theme == ThemeSettings.Dark) {
this.setScene(DynamicSceneNight);
} else {
this.setScene(DynamicSceneDay);
}
};
selectDynamicScene = (): DynamicScene => {
let hour = new Date().getHours();
let hour = new Date().getHours();
if (hour >= 21 || hour <= 6) {
return DynamicSceneNight;
} else if (hour > 6 && hour < 10) {
return DynamicSceneSunrise;
} else if (hour < 14) {
return DynamicSceneDay;
} else if (hour < 17) {
return DynamicSceneAfternoon
} else {
return DynamicSceneSunset
}
}
if (hour >= 21 || hour <= 6) {
return DynamicSceneNight;
} else if (hour > 6 && hour < 10) {
return DynamicSceneSunrise;
} else if (hour < 14) {
return DynamicSceneDay;
} else if (hour < 17) {
return DynamicSceneAfternoon;
} else {
return DynamicSceneSunset;
}
};
setScene = (scene: DynamicScene): void => {
document.body.style.setProperty("--backdrop-grass-filter", `brightness(${scene.brightness})`);
document.body.style.setProperty(
"--backdrop-grass-filter",
`brightness(${scene.brightness})`,
);
function setSkyColor(tone: 1|2, hue: number, saturation: number, luma: number) {
document.body.style.setProperty(`--sky-${tone}`, `hsl(${hue}, ${saturation}%, ${luma}%)`);
}
setSkyColor(1, scene.hue1, scene.saturation, scene.luma);
setSkyColor(2, scene.hue2, scene.saturation - 10, scene.luma-10);
function setSkyColor(
tone: 1 | 2,
hue: number,
saturation: number,
luma: number,
) {
document.body.style.setProperty(
`--sky-${tone}`,
`hsl(${hue}, ${saturation}%, ${luma}%)`,
);
}
setSkyColor(1, scene.hue1, scene.saturation, scene.luma);
setSkyColor(2, scene.hue2, scene.saturation - 10, scene.luma - 10);
document.body.setAttribute("theme", scene.baseTheme);
}
document.body.setAttribute("theme", scene.baseTheme);
};
// exit
close = (): void => {
this.coreViewModel.closeContext(this.contextId);
this.coreViewModel.closeContext(this.contextId);
};
handleContextClose = (): void => {
this.isShowingSettingsModal.value = false;
if (this.requiresReload.value == true) {
window.location.reload();
}
this.isShowingSettingsModal.value = false;
if (this.requiresReload.value == true) {
window.location.reload();
}
};
// init
constructor(public readonly coreViewModel: CoreViewModel) {
super("settings");
super("settings");
this.username.value = coreViewModel.settingsModel.username;
this.usernameInput.value = coreViewModel.settingsModel.username;
this.firstDayOfWeek.value = coreViewModel.settingsModel.firstDayOfWeek;
this.language.value = coreViewModel.settingsModel.language;
this.theme.value = coreViewModel.settingsModel.theme;
this.username.value = coreViewModel.settingsModel.username;
this.usernameInput.value = coreViewModel.settingsModel.username;
this.firstDayOfWeek.value = coreViewModel.settingsModel.firstDayOfWeek;
this.language.value = coreViewModel.settingsModel.language;
this.theme.value = coreViewModel.settingsModel.theme;
// subscriptions
this.firstDayOfWeek.subscribe(this.setFirstDayofWeek);
this.language.subscribeSilent((newValue) => {
this.coreViewModel.settingsModel.setLanguage(newValue);
this.requiresReload.value = true;
});
this.theme.subscribeSilent((newValue) => {
this.coreViewModel.settingsModel.setTheme(newValue);
});
// subscriptions
this.firstDayOfWeek.subscribe(this.setFirstDayofWeek);
this.language.subscribeSilent((newValue) => {
this.coreViewModel.settingsModel.setLanguage(newValue);
this.requiresReload.value = true;
});
this.theme.subscribeSilent((newValue) => {
this.coreViewModel.settingsModel.setTheme(newValue);
});
// set theme
this.theme.subscribe(() => {
this.applyTheme();
});
SettingsViewModel.generateThemeMedia().addEventListener("change", () =>
this.applyTheme(),
);
const seconds = new Date().getSeconds();
const secondsUntilNewMinute = 60-seconds;
setTimeout(() => {
setInterval(this.applyTheme, 1000*60);
}, secondsUntilNewMinute);
// set theme
this.theme.subscribe(() => {
this.applyTheme();
});
SettingsViewModel.generateThemeMedia().addEventListener("change", () =>
this.applyTheme(),
);
const seconds = new Date().getSeconds();
const secondsUntilNewMinute = 60 - seconds;
setTimeout(() => {
setInterval(this.applyTheme, 1000 * 60);
}, secondsUntilNewMinute);
// keystrokes
this.registerKeyStroke(CommonKeys.CloseOrCancel, this.close);
// keystrokes
this.registerKeyStroke(CommonKeys.CloseOrCancel, this.close);
}
static generateThemeMedia(): MediaQueryList {
return window.matchMedia("(prefers-color-scheme: dark)");
return window.matchMedia("(prefers-color-scheme: dark)");
}
static getSystemTheme(): string {
const media = SettingsViewModel.generateThemeMedia();
return media.matches == true ? ThemeSettings.Dark : ThemeSettings.Light;
const media = SettingsViewModel.generateThemeMedia();
return media.matches == true ? ThemeSettings.Dark : ThemeSettings.Light;
}
}
export enum SettingsModalPages {
Appearance,
Regional,
Info,
Regional,
Info,
}
export interface DynamicScene {
@@ -176,40 +187,40 @@ export interface DynamicScene {
export const DynamicSceneNight: DynamicScene = {
hue1: 215,
hue2: 220,
saturation : 50,
saturation: 50,
luma: 25,
brightness: 0.4,
baseTheme: ThemeSettings.Dark,
}
};
export const DynamicSceneSunrise: DynamicScene = {
hue1: 45,
hue2: 190,
saturation : 100,
saturation: 100,
luma: 50,
brightness: 1.2,
baseTheme: ThemeSettings.Light,
}
};
export const DynamicSceneDay: DynamicScene = {
hue1: 190,
hue2: 180,
saturation : 100,
saturation: 100,
luma: 70,
brightness: 1.4,
baseTheme: ThemeSettings.Light,
}
};
export const DynamicSceneAfternoon: DynamicScene = {
hue1: 195,
hue2: 220,
saturation : 100,
saturation: 100,
luma: 50,
brightness: 0.8,
baseTheme: ThemeSettings.Light,
}
};
export const DynamicSceneSunset: DynamicScene = {
hue1: 20,
hue2: 260,
saturation : 100,
saturation: 100,
luma: 50,
brightness: 0.4,
baseTheme: ThemeSettings.Dark,
}
};
+1 -1
View File
@@ -1,5 +1,5 @@
import * as React from "../../react";
import CoreViewModel, { Context } from "./coreViewModel";
import * as React from "../../react";
import { CommonKeys } from "../../View/keystrokes";
import StorageModel, {
PATH_COMPONENT_SEPARATOR,