noby/workadventure
2
2
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Adding a ingame console message

Browse Source 
Roughly inspired from the code used to notify the user when a website
can be opened.

Note: The CSS style used for the message could probably go somewhere
else, but I thought it could be interesting to be able to override it.
This commit is contained in:
Pierre Mauduit 2021-02-28 14:47:24 +01:00 committed by Thomas Basler
parent e3af68bed3
commit dbef5de7bb
2 changed files with 38 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
front/src/Phaser/Game/GameScene.ts
View File

@ -766,6 +766,13 @@ export class GameScene extends DirtyScene implements CenterListener {
}
}
});
this.gameMap.onPropertyChange('inGameConsoleMessage', (newValue, oldValue, allProps) => {
if (newValue !== undefined) {
layoutManager.addInGameConsoleMessage('inGameConsoleMessage', newValue.toString(), "font-size: 30px;max-width: 100%; margin-left: auto;");
} else {
layoutManager.removeInGameConsoleMessage('inGameConsoleMessage');
}
});
this.gameMap.onPropertyChange('jitsiRoom', (newValue, oldValue, allProps) => {
if (newValue === undefined) {
layoutManager.removeActionButton('jitsiRoom', this.userInputManager);

31
front/src/WebRtc/LayoutManager.ts
View File

@ -47,6 +47,8 @@ class LayoutManager {
private actionButtonTrigger: Map<string, Function> = new Map<string, Function>();
private actionButtonInformation: Map<string, HTMLDivElement> = new Map<string, HTMLDivElement>();
private inGameConsoleMessage: Map<string, HTMLDivElement> = new Map<string, HTMLDivElement>();
public setListener(centerListener: CenterListener|null) {
this.listener = centerListener;
}
@ -392,6 +394,35 @@ class LayoutManager {
this.removeActionButton(id, userInputManager);
}, 10000)
}
public addInGameConsoleMessage(id: string, text: string, customStyle: string){
//delete previous element
this.removeInGameConsoleMessage(id);
//create div and text html component
const p = document.createElement('p');
p.classList.add('action-body');
p.innerText = text;
p.setAttribute("style", customStyle);
const div = document.createElement('div');
div.classList.add('action');
div.id = id;
div.appendChild(p);
this.inGameConsoleMessage.set(id, div);
const mainContainer = HtmlUtils.getElementByIdOrFail<HTMLDivElement>('main-container');
mainContainer.appendChild(div);
}
public removeInGameConsoleMessage(id: string) {
//delete previous element
const previousDiv = this.inGameConsoleMessage.get(id);
if(previousDiv){
previousDiv.remove();
this.inGameConsoleMessage.delete(id);
}
}
}
const layoutManager = new LayoutManager();