lbehm/workadventure
1
0
Fork 0
Code Issues Pull requests Releases Activity

Refactoring layoutManagerActionStore. It now supports an uuid field.

Browse source 
layoutManagerVisibilityStore is now a derived field from layoutManagerActionStore.
This commit is contained in:
David Négrier 2021-08-05 11:19:28 +02:00
parent 92fee33b64
commit 87e4367455
4 changed files with 42 additions and 53 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
front/src/Components/LayoutManager/LayoutManager.svelte
View file

@ -1,26 +1,5 @@
<script lang="ts"> <script lang="ts">
import { layoutManagerActionStore } from "../../Stores/LayoutManagerStore"; import { layoutManagerActionStore } from "../../Stores/LayoutManagerStore";
import { onDestroy, onMount } from "svelte";
import { get } from "svelte/store";
onMount(() => {
for (const action of get(layoutManagerActionStore)) {
action.userInputManager?.addSpaceEventListner(action.callback);
if ( action.type === 'warning') {
//remove it after 10 sec
setTimeout(() => {
layoutManagerActionStore.removeAction(action);
}, 10000)
}
}
})
onDestroy(() => {
for (const action of get(layoutManagerActionStore)) {
action.userInputManager?.removeSpaceEventListner(action.callback);
}
layoutManagerActionStore.clearActions();
})
function onClick(callback: () => void) { function onClick(callback: () => void) {
callback(); callback();
@ -75,4 +54,4 @@
50% {bottom: 30px;} 50% {bottom: 30px;}
100% {bottom: 40px;} 100% {bottom: 40px;}
} }
</style> </style>

35
front/src/Phaser/Game/GameScene.ts
View file

@ -86,7 +86,7 @@ import { playersStore } from "../../Stores/PlayersStore";
import { chatVisibilityStore } from "../../Stores/ChatStore"; import { chatVisibilityStore } from "../../Stores/ChatStore";
import Tileset = Phaser.Tilemaps.Tileset; import Tileset = Phaser.Tilemaps.Tileset;
import { userIsAdminStore } from "../../Stores/GameStore"; import { userIsAdminStore } from "../../Stores/GameStore";
import { layoutManagerActionStore, layoutManagerVisibilityStore } from "../../Stores/LayoutManagerStore"; import { layoutManagerActionStore } from "../../Stores/LayoutManagerStore";
import { get } from "svelte/store"; import { get } from "svelte/store";
export interface GameSceneInitInterface { export interface GameSceneInitInterface {
@ -792,7 +792,7 @@ export class GameScene extends DirtyScene {
}); });
this.gameMap.onPropertyChange("openWebsite", (newValue, oldValue, allProps) => { this.gameMap.onPropertyChange("openWebsite", (newValue, oldValue, allProps) => {
if (newValue === undefined) { if (newValue === undefined) {
layoutManagerVisibilityStore.set(false); layoutManagerActionStore.removeAction("openWebsite");
coWebsiteManager.closeCoWebsite(); coWebsiteManager.closeCoWebsite();
} else { } else {
const openWebsiteFunction = () => { const openWebsiteFunction = () => {
@ -802,7 +802,7 @@ export class GameScene extends DirtyScene {
allProps.get("openWebsiteAllowApi") as boolean | undefined, allProps.get("openWebsiteAllowApi") as boolean | undefined,
allProps.get("openWebsitePolicy") as string | undefined allProps.get("openWebsitePolicy") as string | undefined
); );
layoutManagerVisibilityStore.set(false); layoutManagerActionStore.removeAction("openWebsite");
}; };
const openWebsiteTriggerValue = allProps.get(TRIGGER_WEBSITE_PROPERTIES); const openWebsiteTriggerValue = allProps.get(TRIGGER_WEBSITE_PROPERTIES);
@ -812,12 +812,12 @@ export class GameScene extends DirtyScene {
message = "Press SPACE or touch here to open web site"; message = "Press SPACE or touch here to open web site";
} }
layoutManagerActionStore.addAction({ layoutManagerActionStore.addAction({
type: "openWebsite", uuid: "openWebSite",
type: "message",
message: message, message: message,
callback: () => openWebsiteFunction(), callback: () => openWebsiteFunction(),
userInputManager: this.userInputManager, userInputManager: this.userInputManager,
}); });
layoutManagerVisibilityStore.set(true);
} else { } else {
openWebsiteFunction(); openWebsiteFunction();
} }
@ -825,7 +825,7 @@ export class GameScene extends DirtyScene {
}); });
this.gameMap.onPropertyChange("jitsiRoom", (newValue, oldValue, allProps) => { this.gameMap.onPropertyChange("jitsiRoom", (newValue, oldValue, allProps) => {
if (newValue === undefined) { if (newValue === undefined) {
layoutManagerVisibilityStore.set(false); layoutManagerActionStore.removeAction("jitsi");
this.stopJitsi(); this.stopJitsi();
} else { } else {
const openJitsiRoomFunction = () => { const openJitsiRoomFunction = () => {
@ -838,7 +838,7 @@ export class GameScene extends DirtyScene {
} else { } else {
this.startJitsi(roomName, undefined); this.startJitsi(roomName, undefined);
} }
layoutManagerVisibilityStore.set(false); layoutManagerActionStore.removeAction("jitsi");
}; };
const jitsiTriggerValue = allProps.get(TRIGGER_JITSI_PROPERTIES); const jitsiTriggerValue = allProps.get(TRIGGER_JITSI_PROPERTIES);
@ -848,12 +848,12 @@ export class GameScene extends DirtyScene {
message = "Press SPACE or touch here to enter Jitsi Meet room"; message = "Press SPACE or touch here to enter Jitsi Meet room";
} }
layoutManagerActionStore.addAction({ layoutManagerActionStore.addAction({
type: "jitsiRoom", uuid: "jitsi",
type: "message",
message: message, message: message,
callback: () => openJitsiRoomFunction(), callback: () => openJitsiRoomFunction(),
userInputManager: this.userInputManager, userInputManager: this.userInputManager,
}); });
layoutManagerVisibilityStore.set(true);
} else { } else {
openJitsiRoomFunction(); openJitsiRoomFunction();
} }
@ -1154,20 +1154,21 @@ ${escapedMessage}
"triggerActionMessage", "triggerActionMessage",
(message) => (message) =>
new Promise((resolver) => { new Promise((resolver) => {
layoutManager.addActionButton( layoutManagerActionStore.addAction({
message.uuid, uuid: message.uuid,
message.message, type: "message",
() => { message: message.message,
layoutManager.removeActionButton(message.uuid, this.userInputManager); callback: () => {
layoutManagerActionStore.removeAction(message.uuid);
resolver(); resolver();
}, },
this.userInputManager userInputManager: this.userInputManager,
); });
}) })
); );
iframeListener.registerAnswerer("removeActionMessage", (message) => { iframeListener.registerAnswerer("removeActionMessage", (message) => {
layoutManager.removeActionButton(message.uuid, this.userInputManager); layoutManagerActionStore.removeAction(message.uuid);
}); });
} }

23
front/src/Stores/LayoutManagerStore.ts
View file

@ -1,15 +1,14 @@
import { writable } from "svelte/store"; import { derived, writable } from "svelte/store";
import type { UserInputManager } from "../Phaser/UserInput/UserInputManager"; import type { UserInputManager } from "../Phaser/UserInput/UserInputManager";
export interface LayoutManagerAction { export interface LayoutManagerAction {
type: string; uuid: string;
type: "warning" | "message";
message: string | number | boolean | undefined; message: string | number | boolean | undefined;
callback: () => void; callback: () => void;
userInputManager: UserInputManager | undefined; userInputManager: UserInputManager | undefined;
} }
export const layoutManagerVisibilityStore = writable(false);
function createLayoutManagerAction() { function createLayoutManagerAction() {
const { subscribe, set, update } = writable<LayoutManagerAction[]>([]); const { subscribe, set, update } = writable<LayoutManagerAction[]>([]);
@ -18,26 +17,26 @@ function createLayoutManagerAction() {
addAction: (newAction: LayoutManagerAction): void => { addAction: (newAction: LayoutManagerAction): void => {
update((list: LayoutManagerAction[]) => { update((list: LayoutManagerAction[]) => {
let found = false; let found = false;
for (const actions of list) { for (const action of list) {
if (actions.type === newAction.type && actions.message === newAction.message) { if (action.uuid === newAction.uuid) {
found = true; found = true;
} }
} }
if (!found) { if (!found) {
list.push(newAction); list.push(newAction);
newAction.userInputManager?.addSpaceEventListner(newAction.callback);
} }
return list; return list;
}); });
}, },
removeAction: (oldAction: LayoutManagerAction): void => { removeAction: (uuid: string): void => {
update((list: LayoutManagerAction[]) => { update((list: LayoutManagerAction[]) => {
const index = list.findIndex( const index = list.findIndex((action) => action.uuid === uuid);
(actions) => actions.type === oldAction.type && actions.message === oldAction.message
);
if (index !== -1) { if (index !== -1) {
list[index].userInputManager?.removeSpaceEventListner(list[index].callback);
list.splice(index, 1); list.splice(index, 1);
} }
@ -51,3 +50,7 @@ function createLayoutManagerAction() {
} }
export const layoutManagerActionStore = createLayoutManagerAction(); export const layoutManagerActionStore = createLayoutManagerAction();
export const layoutManagerVisibilityStore = derived(layoutManagerActionStore, ($layoutManagerActionStore) => {
return !!$layoutManagerActionStore.length;
});

14
front/src/WebRtc/MediaManager.ts
View file

@ -25,15 +25,18 @@ export class MediaManager {
if (result.type === "error") { if (result.type === "error") {
console.error(result.error); console.error(result.error);
layoutManagerActionStore.addAction({ layoutManagerActionStore.addAction({
uuid: "cameraAccessDenied",
type: "warning", type: "warning",
message: "Camera access denied. Click here and check your browser permissions.", message: "Camera access denied. Click here and check your browser permissions.",
callback: () => { callback: () => {
helpCameraSettingsVisibleStore.set(true); helpCameraSettingsVisibleStore.set(true);
layoutManagerVisibilityStore.set(false);
}, },
userInputManager: this.userInputManager, userInputManager: this.userInputManager,
}); });
layoutManagerVisibilityStore.set(true); //remove it after 10 sec
setTimeout(() => {
layoutManagerActionStore.removeAction("cameraAccessDenied");
}, 10000);
return; return;
} }
}); });
@ -42,15 +45,18 @@ export class MediaManager {
if (result.type === "error") { if (result.type === "error") {
console.error(result.error); console.error(result.error);
layoutManagerActionStore.addAction({ layoutManagerActionStore.addAction({
uuid: "screenSharingAccessDenied",
type: "warning", type: "warning",
message: "Screen sharing denied. Click here and check your browser permissions.", message: "Screen sharing denied. Click here and check your browser permissions.",
callback: () => { callback: () => {
helpCameraSettingsVisibleStore.set(true); helpCameraSettingsVisibleStore.set(true);
layoutManagerVisibilityStore.set(false);
}, },
userInputManager: this.userInputManager, userInputManager: this.userInputManager,
}); });
layoutManagerVisibilityStore.set(true); //remove it after 10 sec
setTimeout(() => {
layoutManagerActionStore.removeAction("screenSharingAccessDenied");
}, 10000);
return; return;
} }
}); });