Merge branch 'develop' of github.com:thecodingmachine/workadventure into main

This commit is contained in:
_Bastler 2021-06-15 09:21:40 +02:00
commit 29da03ee44
3 changed files with 19 additions and 16 deletions

View File

@ -3,6 +3,7 @@ import ScaleManager = Phaser.Scale.ScaleManager;
import {coWebsiteManager} from "../../WebRtc/CoWebsiteManager"; import {coWebsiteManager} from "../../WebRtc/CoWebsiteManager";
import type {Game} from "../Game/Game"; import type {Game} from "../Game/Game";
import {ResizableScene} from "../Login/ResizableScene"; import {ResizableScene} from "../Login/ResizableScene";
import {HtmlUtils} from "../../WebRtc/HtmlUtils";
class WaScaleManager { class WaScaleManager {
@ -39,6 +40,12 @@ class WaScaleManager {
const style = this.scaleManager.canvas.style; const style = this.scaleManager.canvas.style;
style.width = Math.ceil(realSize.width / devicePixelRatio) + 'px'; style.width = Math.ceil(realSize.width / devicePixelRatio) + 'px';
style.height = Math.ceil(realSize.height / devicePixelRatio) + 'px'; style.height = Math.ceil(realSize.height / devicePixelRatio) + 'px';
// Resize the game element at the same size at the canvas
const gameStyle = HtmlUtils.getElementByIdOrFail<HTMLDivElement>('game').style;
gameStyle.width = style.width;
gameStyle.height = style.height;
// Note: onResize will be called twice (once here and once in Game.ts), but we have no better way. // Note: onResize will be called twice (once here and once in Game.ts), but we have no better way.
for (const scene of this.game.scene.getScenes(true)) { for (const scene of this.game.scene.getScenes(true)) {
if (scene instanceof ResizableScene) { if (scene instanceof ResizableScene) {

View File

@ -353,13 +353,13 @@ video.myCamVideo{
body { body {
margin: 0; margin: 0;
height: 100vh; height: 100%;
width: 100vw; width: 100%;
} }
.main-container { .main-container {
height: 100vh; height: 100%;
width: 100vw; width: 100%;
position: absolute; position: absolute;
} }
@ -379,10 +379,7 @@ body {
} }
#game { #game {
height: 100%; position: relative; /* Position relative is needed for the game-overlay. */
width: 100%;
position: relative;
/* Position relative is needed for the game-overlay. */
} }
.audioplayer:first-child { .audioplayer:first-child {
@ -639,7 +636,6 @@ input[type=range]:focus::-ms-fill-upper {
.media-container { .media-container {
display: flex; display: flex;
justify-content: center;
flex-direction: column; flex-direction: column;
overflow: hidden; overflow: hidden;
} }