diff --git a/front/src/Components/Menu/SettingsSubMenu.svelte b/front/src/Components/Menu/SettingsSubMenu.svelte index d5b40822..d5bcab56 100644 --- a/front/src/Components/Menu/SettingsSubMenu.svelte +++ b/front/src/Components/Menu/SettingsSubMenu.svelte @@ -8,243 +8,275 @@ import { displayableLocales, setCurrentLocale } from "../../i18n/locales"; import { isMediaBreakpointUp } from "../../Utils/BreakpointsUtils"; - let fullscreen: boolean = localUserStore.getFullscreen(); - let notification: boolean = localUserStore.getNotification() === "granted"; - let forceCowebsiteTrigger: boolean = localUserStore.getForceCowebsiteTrigger(); - let ignoreFollowRequests: boolean = localUserStore.getIgnoreFollowRequests(); - let valueGame: number = localUserStore.getGameQualityValue(); - let valueVideo: number = localUserStore.getVideoQualityValue(); - let valueLocale: string = $locale; - let previewValueGame = valueGame; - let previewValueVideo = valueVideo; - let previewValueLocale = valueLocale; + let fullscreen: boolean = localUserStore.getFullscreen(); + let notification: boolean = localUserStore.getNotification() === "granted"; + let forceCowebsiteTrigger: boolean = localUserStore.getForceCowebsiteTrigger(); + let ignoreFollowRequests: boolean = localUserStore.getIgnoreFollowRequests(); + let valueGame: number = localUserStore.getGameQualityValue(); + let valueVideo: number = localUserStore.getVideoQualityValue(); + let valueLocale: string = $locale; + let valuePrivacySettings = localUserStore.getPrivacySettings(); - function saveSetting() { - let change = false; + let previewValueGame = valueGame; + let previewValueVideo = valueVideo; + let previewValueLocale = valueLocale; + let previewPrivacySettings = valuePrivacySettings; // TODO: retreive from local storage - if (valueLocale !== previewValueLocale) { - previewValueLocale = valueLocale; - setCurrentLocale(valueLocale as Locales); - } + function saveSetting() { + let change = false; - if (valueVideo !== previewValueVideo) { - previewValueVideo = valueVideo; - videoConstraintStore.setFrameRate(valueVideo); - } - - if (valueGame !== previewValueGame) { - previewValueGame = valueGame; - localUserStore.setGameQualityValue(valueGame); - change = true; - } - - if (change) { - window.location.reload(); - } - - closeMenu(); + if (valueLocale !== previewValueLocale) { + previewValueLocale = valueLocale; + setCurrentLocale(valueLocale as Locales); } - function changeFullscreen() { - const body = HtmlUtils.querySelectorOrFail("body"); - if (body) { - if (document.fullscreenElement !== null && !fullscreen) { - document.exitFullscreen().catch((e) => console.error(e)); - } else { - body.requestFullscreen().catch((e) => console.error(e)); - } - localUserStore.setFullscreen(fullscreen); - } + if (valueVideo !== previewValueVideo) { + previewValueVideo = valueVideo; + videoConstraintStore.setFrameRate(valueVideo); } - function changeNotification() { - if (Notification.permission === "granted") { + if (valueGame !== previewValueGame) { + previewValueGame = valueGame; + localUserStore.setGameQualityValue(valueGame); + change = true; + } + + if (valuePrivacySettings !== previewPrivacySettings) { + console.log(`was: ${previewPrivacySettings} | is: ${valuePrivacySettings}`) + localUserStore.setPrivacySettings(valuePrivacySettings); + } + + if (change) { + window.location.reload(); + } + + closeMenu(); + } + + function changeFullscreen() { + const body = HtmlUtils.querySelectorOrFail("body"); + if (body) { + if (document.fullscreenElement !== null && !fullscreen) { + document.exitFullscreen().catch((e) => console.error(e)); + } else { + body.requestFullscreen().catch((e) => console.error(e)); + } + localUserStore.setFullscreen(fullscreen); + } + } + + function changeNotification() { + if (Notification.permission === "granted") { + localUserStore.setNotification(notification ? "granted" : "denied"); + } else { + Notification.requestPermission() + .then((response) => { + if (response === "granted") { localUserStore.setNotification(notification ? "granted" : "denied"); - } else { - Notification.requestPermission() - .then((response) => { - if (response === "granted") { - localUserStore.setNotification(notification ? "granted" : "denied"); - } else { - localUserStore.setNotification("denied"); - notification = false; - } - }) - .catch((e) => console.error(e)); - } + } else { + localUserStore.setNotification("denied"); + notification = false; + } + }) + .catch((e) => console.error(e)); } + } - function changeForceCowebsiteTrigger() { - localUserStore.setForceCowebsiteTrigger(forceCowebsiteTrigger); - } + function changeForceCowebsiteTrigger() { + localUserStore.setForceCowebsiteTrigger(forceCowebsiteTrigger); + } - function changeIgnoreFollowRequests() { - localUserStore.setIgnoreFollowRequests(ignoreFollowRequests); - } + function changeIgnoreFollowRequests() { + localUserStore.setIgnoreFollowRequests(ignoreFollowRequests); + } - function closeMenu() { - menuVisiblilityStore.set(false); - } + function closeMenu() { + menuVisiblilityStore.set(false); + } - const isMobile = isMediaBreakpointUp("md"); + const isMobile = isMediaBreakpointUp("md");
-
-

{$LL.menu.settings.gameQuality.title()}

-
- -
-
-
-

{$LL.menu.settings.videoQuality.title()}

-
- -
-
-
-

{$LL.menu.settings.language.title()}

-
- -
-
-
-

{$LL.menu.settings.save.warning()}

- +

{$LL.menu.settings.gameQuality.title()}

+
+ - {$LL.menu.settings.fullscreen()} - - - - -
+ + + + +
+ +
+

{$LL.menu.settings.videoQuality.title()}

+
+ +
+
+
+

{$LL.menu.settings.language.title()}

+
+ +
+
+ +
+

{$LL.menu.settings.privacySettings.title()}

+

{$LL.menu.settings.privacySettings.explaination()}

+
+ +
+
+
+

{$LL.menu.settings.save.warning()}

+ +
+
+ + + + +
diff --git a/front/src/Connexion/LocalUserStore.ts b/front/src/Connexion/LocalUserStore.ts index 24d4ab42..23e0bcb0 100644 --- a/front/src/Connexion/LocalUserStore.ts +++ b/front/src/Connexion/LocalUserStore.ts @@ -24,6 +24,7 @@ const code = "code"; const cameraSetup = "cameraSetup"; const cacheAPIIndex = "workavdenture-cache"; const userProperties = "user-properties"; +const privacySettings = "privacySettings"; class LocalUserStore { saveUser(localUser: LocalUser) { @@ -224,6 +225,14 @@ class LocalUserStore { return cameraSetupValues != undefined ? JSON.parse(cameraSetupValues) : undefined; } + setPrivacySettings(option: string) { + localStorage.setItem(privacySettings, option) + } + + getPrivacySettings() { + return localStorage.getItem(privacySettings); + } + getAllUserProperties(): Map { const result = new Map(); for (let i = 0; i < localStorage.length; i++) { diff --git a/front/src/Stores/MediaStore.ts b/front/src/Stores/MediaStore.ts index 9494eb7e..f1681615 100644 --- a/front/src/Stores/MediaStore.ts +++ b/front/src/Stores/MediaStore.ts @@ -12,6 +12,7 @@ import { privacyShutdownStore } from "./PrivacyShutdownStore"; import { MediaStreamConstraintsError } from "./Errors/MediaStreamConstraintsError"; import { SoundMeter } from "../Phaser/Components/SoundMeter"; import { AudioContext } from "standardized-audio-context"; +import { visibilityStore } from "./VisibilityStore"; /** * A store that contains the camera state requested by the user (on or off). @@ -242,6 +243,8 @@ export const mediaStreamConstraintsStore = derived( privacyShutdownStore, cameraEnergySavingStore, isSilentStore, + visibilityStore, + //TODO: optionState ], ( [ @@ -254,6 +257,7 @@ export const mediaStreamConstraintsStore = derived( $privacyShutdownStore, $cameraEnergySavingStore, $isSilentStore, + $visibilityStore ], set ) => { @@ -308,6 +312,11 @@ export const mediaStreamConstraintsStore = derived( currentAudioConstraint = false; } + // if ($visibilityStore === false && $option) { + // + // } + //TODO + // Let's make the changes only if the new value is different from the old one. if ( previousComputedVideoConstraint != currentVideoConstraint || diff --git a/front/src/i18n/de-DE/menu.ts b/front/src/i18n/de-DE/menu.ts index c1b7bc18..dc19e481 100644 --- a/front/src/i18n/de-DE/menu.ts +++ b/front/src/i18n/de-DE/menu.ts @@ -57,6 +57,14 @@ const menu: NonNullable = { language: { title: "Sprache", }, + privacySettings: { + title: "Datenschutzeinstellungen", //TODO: confirm & complete translation + explaination: "", + allEnabled: "", + onlyCameraEnabled: "", + onlyMicrophoneEnabled: "", + allDisabled: "" + }, save: { warning: "(Das Spiel wird nach dem Speichern neugestartet)", button: "Speichern", diff --git a/front/src/i18n/en-US/menu.ts b/front/src/i18n/en-US/menu.ts index 0883fb15..04f2f377 100644 --- a/front/src/i18n/en-US/menu.ts +++ b/front/src/i18n/en-US/menu.ts @@ -57,6 +57,14 @@ const menu: BaseTranslation = { language: { title: "Language", }, + privacySettings: { + title: "Privacy settings", + explaination: "Here you can set an option to keep your microphone/camera enabled when switching active tabs.", + allEnabled: "Camera and microphone always enabled", + onlyCameraEnabled: "Microphone disabled when the WA tab is not focused", + onlyMicrophoneEnabled: "Camera disabled when the WA tab is not focused", + allDisabled: "Both disabled when the WA tab is not focused" + }, save: { warning: "(Saving these settings will restart the game)", button: "Save", diff --git a/front/src/i18n/fr-FR/menu.ts b/front/src/i18n/fr-FR/menu.ts index f8c58990..9e32e9ba 100644 --- a/front/src/i18n/fr-FR/menu.ts +++ b/front/src/i18n/fr-FR/menu.ts @@ -57,6 +57,14 @@ const menu: NonNullable = { language: { title: "Langage", }, + privacySettings: { + title: "Paramètres de confidentialité", + explaination: "Vous pouvez définir ici si vous souhaitez conserver ou non l'activation du microphone/de la caméra au passage sur un autre onglet.", + allEnabled: "Camera et microphone toujours actifs", + onlyCameraEnabled: "Seul le microphone est activé quand l'onglet WA n'est pas sélectionné", + onlyMicrophoneEnabled: "Seule la caméra est activé quand l'onglet WA n'est pas sélectionné", + allDisabled: "Tout désactiver quand l'onglet WA n'est pas sélectionné" + }, save: { warning: "(La sauvegarde de ces paramètres redémarre le jeu)", button: "Sauvegarder",