From a5cb93541afad9a95fe4614bd96a8f7d8ee99a9b Mon Sep 17 00:00:00 2001 From: GRL Date: Tue, 25 May 2021 17:21:02 +0200 Subject: [PATCH] correction from code review --- front/src/Api/Events/ApiUpdateTileEvent.ts | 0 front/src/Api/Events/GameStateEvent.ts | 25 ++--- front/src/Api/Events/HasPlayerMovedEvent.ts | 2 +- front/src/Api/Events/IframeEvent.ts | 5 - front/src/Api/Events/TagEvent.ts | 10 -- front/src/Api/Events/TilesetEvent.ts | 15 --- front/src/Api/IframeListener.ts | 15 +-- front/src/Connexion/RoomConnection.ts | 9 +- front/src/Phaser/Game/GameScene.ts | 27 ++--- front/src/iframe_api.ts | 111 +++++++------------- 10 files changed, 58 insertions(+), 161 deletions(-) delete mode 100644 front/src/Api/Events/ApiUpdateTileEvent.ts delete mode 100644 front/src/Api/Events/TagEvent.ts delete mode 100644 front/src/Api/Events/TilesetEvent.ts diff --git a/front/src/Api/Events/ApiUpdateTileEvent.ts b/front/src/Api/Events/ApiUpdateTileEvent.ts deleted file mode 100644 index e69de29b..00000000 diff --git a/front/src/Api/Events/GameStateEvent.ts b/front/src/Api/Events/GameStateEvent.ts index 72e40898..704cd962 100644 --- a/front/src/Api/Events/GameStateEvent.ts +++ b/front/src/Api/Events/GameStateEvent.ts @@ -1,26 +1,13 @@ import * as tg from "generic-type-guard"; -/*export const isPositionState = new tg.IsInterface().withProperties({ - x: tg.isNumber, - y: tg.isNumber -}).get() -export const isPlayerState = new tg.IsInterface() - .withStringIndexSignature( - new tg.IsInterface().withProperties({ - position: isPositionState, - pusherId: tg.isUnion(tg.isNumber, tg.isUndefined) - }).get() - ).get() - -export type PlayerStateObject = tg.GuardedType;*/ - export const isGameStateEvent = new tg.IsInterface().withProperties({ - roomId: tg.isString, - mapUrl: tg.isString, - nickname: tg.isUnion(tg.isString, tg.isNull), - uuid: tg.isUnion(tg.isString, tg.isUndefined), - startLayerName: tg.isUnion(tg.isString, tg.isNull) + roomId: tg.isString, + mapUrl: tg.isString, + nickname: tg.isUnion(tg.isString, tg.isNull), + uuid: tg.isUnion(tg.isString, tg.isUndefined), + startLayerName: tg.isUnion(tg.isString, tg.isNull), + tags : tg.isArray(tg.isString), }).get(); /** * A message sent from the game to the iFrame when the gameState is got by the script diff --git a/front/src/Api/Events/HasPlayerMovedEvent.ts b/front/src/Api/Events/HasPlayerMovedEvent.ts index 28603284..5fe2a1e2 100644 --- a/front/src/Api/Events/HasPlayerMovedEvent.ts +++ b/front/src/Api/Events/HasPlayerMovedEvent.ts @@ -4,7 +4,7 @@ import * as tg from "generic-type-guard"; export const isHasPlayerMovedEvent = new tg.IsInterface().withProperties({ - direction: tg.isString, + direction: tg.isElementOf('right', 'left', 'up', 'down'), moving: tg.isBoolean, x: tg.isNumber, y: tg.isNumber diff --git a/front/src/Api/Events/IframeEvent.ts b/front/src/Api/Events/IframeEvent.ts index 8e4a76f5..1bab019a 100644 --- a/front/src/Api/Events/IframeEvent.ts +++ b/front/src/Api/Events/IframeEvent.ts @@ -15,8 +15,6 @@ import type { UserInputChatEvent } from './UserInputChatEvent'; import type { DataLayerEvent } from "./DataLayerEvent"; import type { LayerEvent } from './LayerEvent'; import type { SetPropertyEvent } from "./setPropertyEvent"; -import type { TagEvent } from "./TagEvent"; -import type { TilesetEvent } from "./TilesetEvent"; export interface TypedMessageEvent extends MessageEvent { data: T @@ -24,7 +22,6 @@ export interface TypedMessageEvent extends MessageEvent { export type IframeEventMap = { getState: GameStateEvent, - // updateTile: UpdateTileEvent registerMenuCommand: MenuItemRegisterEvent chat: ChatEvent, openPopup: OpenPopupEvent @@ -42,7 +39,6 @@ export type IframeEventMap = { hideLayer: LayerEvent setProperty: SetPropertyEvent getDataLayer: undefined - getTag: undefined //tilsetEvent: TilesetEvent } export interface IframeEvent { @@ -63,7 +59,6 @@ export interface IframeResponseEventMap { hasPlayerMoved: HasPlayerMovedEvent dataLayer: DataLayerEvent menuItemClicked: MenuItemClickedEvent - tagList: TagEvent } export interface IframeResponseEvent { type: T; diff --git a/front/src/Api/Events/TagEvent.ts b/front/src/Api/Events/TagEvent.ts deleted file mode 100644 index 66665403..00000000 --- a/front/src/Api/Events/TagEvent.ts +++ /dev/null @@ -1,10 +0,0 @@ -import * as tg from "generic-type-guard"; - -export const isTagEvent = - new tg.IsInterface().withProperties({ - list: tg.isArray(tg.isString), - }).get(); -/** - * A message sent from the iFrame to the game to show/hide a layer. - */ -export type TagEvent = tg.GuardedType; \ No newline at end of file diff --git a/front/src/Api/Events/TilesetEvent.ts b/front/src/Api/Events/TilesetEvent.ts deleted file mode 100644 index eab33bf7..00000000 --- a/front/src/Api/Events/TilesetEvent.ts +++ /dev/null @@ -1,15 +0,0 @@ -import * as tg from "generic-type-guard"; - -export const isTilesetEvent = - new tg.IsInterface().withProperties({ - name : tg.isString, - imgUrl : tg.isString, - tilewidth : tg.isNumber, - tileheight : tg.isNumber, - margin : tg.isNumber, - spacing : tg.isNumber, - }).get(); -/** - * A message sent from the iFrame to the game to show/hide a layer. - */ -export type TilesetEvent = tg.GuardedType; \ No newline at end of file diff --git a/front/src/Api/IframeListener.ts b/front/src/Api/IframeListener.ts index 647a95dc..ec340b16 100644 --- a/front/src/Api/IframeListener.ts +++ b/front/src/Api/IframeListener.ts @@ -19,7 +19,6 @@ import { Math } from 'phaser'; import type { DataLayerEvent } from "./Events/DataLayerEvent"; import { isMenuItemRegisterEvent } from './Events/MenuItemRegisterEvent'; import type { MenuItemClickedEvent } from './Events/MenuItemClickedEvent'; -import type { TagEvent } from "./Events/TagEvent"; //import { isTilesetEvent, TilesetEvent } from "./Events/TilesetEvent"; @@ -80,9 +79,6 @@ class IframeListener { private readonly _registerMenuCommandStream: Subject = new Subject(); public readonly registerMenuCommandStream = this._registerMenuCommandStream.asObservable(); - private readonly _tagListStream: Subject = new Subject(); - public readonly tagListStream = this._tagListStream.asObservable(); - /* private readonly _tilesetLoaderStream: Subject = new Subject(); public readonly tilesetLoaderStream = this._tilesetLoaderStream.asObservable();*/ @@ -154,9 +150,7 @@ class IframeListener { this._dataLayerChangeStream.next(); } else if (payload.type == "registerMenuCommand" && isMenuItemRegisterEvent(payload.data)) { this._registerMenuCommandStream.next(payload.data.menutItem) - } else if (payload.type == "getTag") { - this._tagListStream.next(); -/* } else if (payload.type == "tilsetEvent" && isTilesetEvent(payload.data)) { +/* } else if (payload.type == "tilsetEvent" && isTilesetEvent(payload.data)) { this._tilesetLoaderStream.next(payload.data);*/ } } @@ -164,13 +158,6 @@ class IframeListener { } - sendUserTagList(tagList: TagEvent){ - this.postMessage({ - 'type' : 'tagList', - 'data' : tagList - }) - } - sendDataLayerEvent(dataLayerEvent: DataLayerEvent) { this.postMessage({ 'type' : 'dataLayer', diff --git a/front/src/Connexion/RoomConnection.ts b/front/src/Connexion/RoomConnection.ts index 1cb4a97d..8bfa3b6a 100644 --- a/front/src/Connexion/RoomConnection.ts +++ b/front/src/Connexion/RoomConnection.ts @@ -169,9 +169,9 @@ export class RoomConnection implements RoomConnection { } else if (message.hasWorldfullmessage()) { worldFullMessageStream.onMessage(); this.closed = true; - // // } else if (message.hasWorldconnexionmessage()) { - // worldFullMessageStream.onMessage(message.getWorldconnexionmessage()?.getMessage()); - // this.closed = true; + } else if (message.hasWorldconnexionmessage()) { + worldFullMessageStream.onMessage(message.getWorldconnexionmessage()?.getMessage()); + this.closed = true; } else if (message.hasWebrtcsignaltoclientmessage()) { this.dispatch(EventMessage.WEBRTC_SIGNAL, message.getWebrtcsignaltoclientmessage()); } else if (message.hasWebrtcscreensharingsignaltoclientmessage()) { @@ -600,9 +600,6 @@ export class RoomConnection implements RoomConnection { } public getAllTag() : string[] { - this.tags.push('TEST'); - this.tags.push('TEST 2'); - this.tags.push('TEST 3'); return this.tags; } } diff --git a/front/src/Phaser/Game/GameScene.ts b/front/src/Phaser/Game/GameScene.ts index 3df7e093..5e540770 100644 --- a/front/src/Phaser/Game/GameScene.ts +++ b/front/src/Phaser/Game/GameScene.ts @@ -864,15 +864,6 @@ ${escapedMessage} this.iframeSubscriptionList.push(iframeListener.enablePlayerControlStream.subscribe(() => { this.userInputManager.restoreControls(); })); - this.iframeSubscriptionList.push(iframeListener.gameStateStream.subscribe(() => { - iframeListener.sendFrozenGameStateEvent({ - mapUrl: this.MapUrlFile, - startLayerName: this.startLayerName, - uuid: localUserStore.getLocalUser()?.uuid, - nickname: localUserStore.getName(), - roomId: this.RoomId, - }) - })); let scriptedBubbleSprite: Sprite; this.iframeSubscriptionList.push(iframeListener.displayBubbleStream.subscribe(() => { @@ -886,12 +877,10 @@ ${escapedMessage} })); this.iframeSubscriptionList.push(iframeListener.showLayerStream.subscribe((layerEvent)=>{ - console.log('show'); this.setLayerVisibility(layerEvent.name, true); })); this.iframeSubscriptionList.push(iframeListener.hideLayerStream.subscribe((layerEvent)=>{ - console.log('hide'); this.setLayerVisibility(layerEvent.name, false); })); @@ -903,12 +892,16 @@ ${escapedMessage} iframeListener.sendDataLayerEvent({data: this.gameMap.getMap()}); })) - this.iframeSubscriptionList.push(iframeListener.tagListStream.subscribe(()=> { - if (this.connection === undefined) { - return; - } - iframeListener.sendUserTagList({list: this.connection.getAllTag()}); - })) + this.iframeSubscriptionList.push(iframeListener.gameStateStream.subscribe(() => { + iframeListener.sendFrozenGameStateEvent({ + mapUrl: this.MapUrlFile, + startLayerName: this.startLayerName, + uuid: localUserStore.getLocalUser()?.uuid, + nickname: localUserStore.getName(), + roomId: this.RoomId, + tags: this.connection ? this.connection.getAllTag() : [] + }) + })); /* this.iframeSubscriptionList.push(iframeListener.tilesetLoaderStream.subscribe((tileset) => { //this.load.tilemapTiledJSON('logo', tileset.imgUrl); diff --git a/front/src/iframe_api.ts b/front/src/iframe_api.ts index b2eac975..f62b77a4 100644 --- a/front/src/iframe_api.ts +++ b/front/src/iframe_api.ts @@ -17,8 +17,6 @@ import { DataLayerEvent, isDataLayerEvent } from "./Api/Events/DataLayerEvent"; import type { ITiledMap } from "./Phaser/Map/ITiledMap"; import type { MenuItemRegisterEvent } from "./Api/Events/MenuItemRegisterEvent"; import { isMenuItemClickedEvent } from "./Api/Events/MenuItemClickedEvent"; -import {TagEvent, isTagEvent} from "./Api/Events/TagEvent"; -import type { TilesetEvent } from "./Api/Events/TilesetEvent"; interface WorkAdventureApi { sendChatMessage(message: string, author: string): void; @@ -42,18 +40,26 @@ interface WorkAdventureApi { displayBubble(): void; removeBubble(): void; registerMenuCommand(commandDescriptor: string, callback: (commandDescriptor: string) => void): void - getMapUrl(): Promise; - getUuid(): Promise; - getRoomId(): Promise; - getStartLayerName(): Promise; - getNickName(): Promise; - getTagUser(): Promise; - getMap(): Promise + getCurrentUser(): Promise + getCurrentRoom(): Promise //loadTileset(name: string, imgUrl : string, tilewidth : number, tileheight : number, margin : number, spacing : number): void; onPlayerMove(callback: (playerMovedEvent: HasPlayerMovedEvent) => void): void } +interface User { + id: string | undefined + nickName: string | null + tags: string[] +} + +interface Room { + id: string + mapUrl: string + map: ITiledMap + startLayer: string | null +} + declare global { // eslint-disable-next-line no-var var WA: WorkAdventureApi @@ -101,12 +107,14 @@ class Popup { }, '*'); } } -function uuidv4() { + +/*function uuidv4() { return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => { const r = Math.random() * 16 | 0, v = c === 'x' ? r : (r & 0x3 | 0x8); return v.toString(16); }); -} +}*/ + function getGameState(): Promise { if (immutableData) { return Promise.resolve(immutableData); @@ -131,34 +139,21 @@ function getDataLayer(): Promise { }) } -function getTag(): Promise { - return new Promise((resolver, thrower) => { - tagResolver.push((resolver)); - postToParent({ - type: "getTag", - data: undefined - }) - }) -} - const gameStateResolver: Array<(event: GameStateEvent) => void> = [] const dataLayerResolver: Array<(event: DataLayerEvent) => void> = [] -const tagResolver: Array<(event : TagEvent) => void> = [] let immutableData: GameStateEvent; -const callbackPlayerMoved: { [type: string]: HasPlayerMovedEventCallback | ((arg?: HasPlayerMovedEvent | never) => void) } = {} - +//const callbackPlayerMoved: { [type: string]: HasPlayerMovedEventCallback | ((arg?: HasPlayerMovedEvent | never) => void) } = {} +const callbackPlayerMoved: Array<(event: HasPlayerMovedEvent) => void> = [] function postToParent(content: IframeEvent) { window.parent.postMessage(content, "*") } -let playerUuid: string | undefined; window.WA = { onPlayerMove(callback: HasPlayerMovedEventCallback): void { - playerUuid = uuidv4(); - callbackPlayerMoved[playerUuid] = callback; + callbackPlayerMoved.push(callback); postToParent({ type: "onPlayerMove", data: undefined @@ -179,45 +174,17 @@ window.WA = { }) },*/ - getTagUser(): Promise { - return getTag().then((res) => { - return res.list; + getCurrentUser(): Promise { + return getGameState().then((gameState) => { + return {id: gameState.uuid, nickName: gameState.nickname, tags: gameState.tags}; }) }, - getMap(): Promise { - return getDataLayer().then((res) => { - return res.data as ITiledMap; - }) - }, - - getNickName(): Promise { - return getGameState().then((res) => { - return res.nickname; - }) - }, - - getMapUrl(): Promise { - return getGameState().then((res) => { - return res.mapUrl; - }) - }, - - getUuid(): Promise { - return getGameState().then((res) => { - return res.uuid; - }) - }, - - getRoomId(): Promise { - return getGameState().then((res) => { - return res.roomId; - }) - }, - - getStartLayerName(): Promise { - return getGameState().then((res) => { - return res.startLayerName; + getCurrentRoom(): Promise { + return getGameState().then((gameState) => { + return getDataLayer().then((mapJson) => { + return {id: gameState.roomId, map: mapJson.data as ITiledMap, mapUrl: gameState.mapUrl, startLayer: gameState.startLayerName}; + }) }) }, @@ -411,22 +378,18 @@ window.addEventListener('message', message => { resolver(payloadData); }) immutableData = payloadData; - } else if (payload.type == "hasPlayerMoved" && isHasPlayerMovedEvent(payloadData) && playerUuid) { - callbackPlayerMoved[playerUuid](payloadData) + } else if (payload.type == "hasPlayerMoved" && isHasPlayerMovedEvent(payloadData)) { + callbackPlayerMoved.forEach(callback => { + callback(payloadData); + }) } else if (payload.type == "dataLayer" && isDataLayerEvent(payloadData)) { dataLayerResolver.forEach(resolver => { resolver(payloadData); }) - } else if (payload.type == "menuItemClicked" && isMenuItemClickedEvent(payload.data)) { - const callback = menuCallbacks.get(payload.data.menuItem); + } else if (payload.type == "menuItemClicked" && isMenuItemClickedEvent(payloadData)) { + const callback = menuCallbacks.get(payloadData.menuItem); if (callback) { - callback(payload.data.menuItem) - } - } else { - if (payload.type == "tagList" && isTagEvent(payloadData)) { - tagResolver.forEach(resolver => { - resolver(payloadData); - }) + callback(payloadData.menuItem) } } }