2021-07-16 11:22:36 +02:00
|
|
|
import "phaser";
|
2020-04-03 14:56:21 +02:00
|
|
|
import GameConfig = Phaser.Types.Core.GameConfig;
|
2021-05-17 16:16:18 +02:00
|
|
|
import "../style/index.scss";
|
2021-03-18 12:37:05 +01:00
|
|
|
|
2021-07-16 11:22:36 +02:00
|
|
|
import { DEBUG_MODE, isMobile } from "./Enum/EnvironmentVariable";
|
|
|
|
import { LoginScene } from "./Phaser/Login/LoginScene";
|
|
|
|
import { ReconnectingScene } from "./Phaser/Reconnecting/ReconnectingScene";
|
|
|
|
import { SelectCharacterScene } from "./Phaser/Login/SelectCharacterScene";
|
|
|
|
import { SelectCompanionScene } from "./Phaser/Login/SelectCompanionScene";
|
|
|
|
import { EnableCameraScene } from "./Phaser/Login/EnableCameraScene";
|
|
|
|
import { CustomizeScene } from "./Phaser/Login/CustomizeScene";
|
|
|
|
import WebFontLoaderPlugin from "phaser3-rex-plugins/plugins/webfontloader-plugin.js";
|
|
|
|
import OutlinePipelinePlugin from "phaser3-rex-plugins/plugins/outlinepipeline-plugin.js";
|
|
|
|
import { EntryScene } from "./Phaser/Login/EntryScene";
|
|
|
|
import { coWebsiteManager } from "./WebRtc/CoWebsiteManager";
|
|
|
|
import { localUserStore } from "./Connexion/LocalUserStore";
|
|
|
|
import { ErrorScene } from "./Phaser/Reconnecting/ErrorScene";
|
|
|
|
import { iframeListener } from "./Api/IframeListener";
|
|
|
|
import { SelectCharacterMobileScene } from "./Phaser/Login/SelectCharacterMobileScene";
|
|
|
|
import { HdpiManager } from "./Phaser/Services/HdpiManager";
|
|
|
|
import { waScaleManager } from "./Phaser/Services/WaScaleManager";
|
|
|
|
import { Game } from "./Phaser/Game/Game";
|
|
|
|
import App from "./Components/App.svelte";
|
|
|
|
import { HtmlUtils } from "./WebRtc/HtmlUtils";
|
2021-06-22 16:35:57 +02:00
|
|
|
import WebGLRenderer = Phaser.Renderer.WebGL.WebGLRenderer;
|
|
|
|
|
2021-07-16 11:22:36 +02:00
|
|
|
const { width, height } = coWebsiteManager.getGameSize();
|
2020-04-07 20:41:35 +02:00
|
|
|
|
2020-12-04 11:30:35 +01:00
|
|
|
const valueGameQuality = localUserStore.getGameQualityValue();
|
2021-07-16 11:22:36 +02:00
|
|
|
const fps: Phaser.Types.Core.FPSConfig = {
|
2020-11-25 01:19:19 +01:00
|
|
|
/**
|
|
|
|
* The minimum acceptable rendering rate, in frames per second.
|
|
|
|
*/
|
2020-11-27 16:24:07 +01:00
|
|
|
min: valueGameQuality,
|
2020-11-25 01:19:19 +01:00
|
|
|
/**
|
|
|
|
* The optimum rendering rate, in frames per second.
|
|
|
|
*/
|
2020-11-27 16:24:07 +01:00
|
|
|
target: valueGameQuality,
|
2020-11-25 01:19:19 +01:00
|
|
|
/**
|
|
|
|
* Use setTimeout instead of requestAnimationFrame to run the game loop.
|
|
|
|
*/
|
2021-04-21 10:37:20 +02:00
|
|
|
forceSetTimeOut: false,
|
2020-11-25 01:19:19 +01:00
|
|
|
/**
|
|
|
|
* Calculate the average frame delta from this many consecutive frame intervals.
|
|
|
|
*/
|
|
|
|
deltaHistory: 120,
|
|
|
|
/**
|
|
|
|
* The amount of frames the time step counts before we trust the delta values again.
|
|
|
|
*/
|
|
|
|
panicMax: 20,
|
|
|
|
/**
|
|
|
|
* Apply delta smoothing during the game update to help avoid spikes?
|
|
|
|
*/
|
2021-07-16 11:22:36 +02:00
|
|
|
smoothStep: false,
|
|
|
|
};
|
2020-11-27 16:24:07 +01:00
|
|
|
|
2021-01-25 11:18:48 +01:00
|
|
|
// the ?phaserMode=canvas parameter can be used to force Canvas usage
|
2021-01-25 12:02:00 +01:00
|
|
|
const params = new URLSearchParams(document.location.search.substring(1));
|
|
|
|
const phaserMode = params.get("phaserMode");
|
2021-01-25 11:18:48 +01:00
|
|
|
let mode: number;
|
|
|
|
switch (phaserMode) {
|
2021-07-16 11:22:36 +02:00
|
|
|
case "auto":
|
2021-01-25 11:18:48 +01:00
|
|
|
case null:
|
|
|
|
mode = Phaser.AUTO;
|
|
|
|
break;
|
2021-07-16 11:22:36 +02:00
|
|
|
case "canvas":
|
2021-01-25 11:18:48 +01:00
|
|
|
mode = Phaser.CANVAS;
|
|
|
|
break;
|
2021-07-16 11:22:36 +02:00
|
|
|
case "webgl":
|
2021-01-25 11:18:48 +01:00
|
|
|
mode = Phaser.WEBGL;
|
|
|
|
break;
|
|
|
|
default:
|
|
|
|
throw new Error('phaserMode parameter must be one of "auto", "canvas" or "webgl"');
|
|
|
|
}
|
|
|
|
|
2021-07-16 11:22:36 +02:00
|
|
|
const hdpiManager = new HdpiManager(640 * 480, 196 * 196);
|
|
|
|
const { game: gameSize, real: realSize } = hdpiManager.getOptimalGameSize({ width, height });
|
2021-01-25 11:18:48 +01:00
|
|
|
|
2020-04-03 14:56:21 +02:00
|
|
|
const config: GameConfig = {
|
2021-01-25 11:18:48 +01:00
|
|
|
type: mode,
|
2020-08-11 22:32:55 +02:00
|
|
|
title: "WorkAdventure",
|
2021-05-04 11:29:37 +02:00
|
|
|
scale: {
|
|
|
|
parent: "game",
|
|
|
|
width: gameSize.width,
|
|
|
|
height: gameSize.height,
|
|
|
|
zoom: realSize.width / gameSize.width,
|
|
|
|
autoRound: true,
|
2021-07-16 11:22:36 +02:00
|
|
|
resizeInterval: 999999999999,
|
2021-05-04 11:29:37 +02:00
|
|
|
},
|
2021-07-16 11:22:36 +02:00
|
|
|
scene: [
|
|
|
|
EntryScene,
|
2021-04-23 03:59:14 +02:00
|
|
|
LoginScene,
|
|
|
|
isMobile() ? SelectCharacterMobileScene : SelectCharacterScene,
|
2021-05-05 11:01:11 +02:00
|
|
|
SelectCompanionScene,
|
|
|
|
EnableCameraScene,
|
|
|
|
ReconnectingScene,
|
|
|
|
ErrorScene,
|
|
|
|
CustomizeScene,
|
2021-06-01 11:07:52 +02:00
|
|
|
],
|
2021-05-04 11:29:37 +02:00
|
|
|
//resolution: window.devicePixelRatio / 2,
|
2020-11-25 01:19:19 +01:00
|
|
|
fps: fps,
|
2020-12-04 11:30:35 +01:00
|
|
|
dom: {
|
2021-07-16 11:22:36 +02:00
|
|
|
createContainer: true,
|
2020-12-04 11:30:35 +01:00
|
|
|
},
|
2021-02-02 12:04:50 +01:00
|
|
|
render: {
|
|
|
|
pixelArt: true,
|
|
|
|
roundPixels: true,
|
2021-07-16 11:22:36 +02:00
|
|
|
antialias: false,
|
2021-02-02 12:04:50 +01:00
|
|
|
},
|
2021-05-26 17:07:07 +02:00
|
|
|
plugins: {
|
2021-07-16 11:22:36 +02:00
|
|
|
global: [
|
|
|
|
{
|
|
|
|
key: "rexWebFontLoader",
|
|
|
|
plugin: WebFontLoaderPlugin,
|
|
|
|
start: true,
|
|
|
|
},
|
|
|
|
],
|
2021-05-26 17:07:07 +02:00
|
|
|
},
|
2020-04-11 18:17:36 +02:00
|
|
|
physics: {
|
2020-04-12 16:12:08 +02:00
|
|
|
default: "arcade",
|
|
|
|
arcade: {
|
2020-11-25 00:47:21 +01:00
|
|
|
debug: DEBUG_MODE,
|
2021-07-16 11:22:36 +02:00
|
|
|
},
|
2020-07-15 23:44:01 +02:00
|
|
|
},
|
2021-04-23 17:25:17 +02:00
|
|
|
// Instruct systems with 2 GPU to choose the low power one. We don't need that extra power and we want to save battery
|
|
|
|
powerPreference: "low-power",
|
2020-07-15 23:44:01 +02:00
|
|
|
callbacks: {
|
2021-07-16 11:22:36 +02:00
|
|
|
postBoot: (game) => {
|
2021-06-22 16:35:57 +02:00
|
|
|
// Install rexOutlinePipeline only if the renderer is WebGL.
|
|
|
|
const renderer = game.renderer;
|
2021-01-13 18:39:28 +01:00
|
|
|
if (renderer instanceof WebGLRenderer) {
|
2021-07-16 11:22:36 +02:00
|
|
|
game.plugins.install("rexOutlinePipeline", OutlinePipelinePlugin, true);
|
2021-06-22 16:35:57 +02:00
|
|
|
}
|
2021-07-16 11:22:36 +02:00
|
|
|
},
|
|
|
|
},
|
2020-04-03 14:56:21 +02:00
|
|
|
};
|
|
|
|
|
2021-04-23 13:29:23 +02:00
|
|
|
//const game = new Phaser.Game(config);
|
|
|
|
const game = new Game(config);
|
2020-04-03 18:41:06 +02:00
|
|
|
|
2021-05-18 09:20:38 +02:00
|
|
|
waScaleManager.setGame(game);
|
2021-05-04 11:29:37 +02:00
|
|
|
|
2021-07-16 11:22:36 +02:00
|
|
|
window.addEventListener("resize", function (event) {
|
2021-03-18 15:05:15 +01:00
|
|
|
coWebsiteManager.resetStyle();
|
2021-05-04 11:29:37 +02:00
|
|
|
|
|
|
|
waScaleManager.applyNewSize();
|
2020-08-13 18:21:48 +02:00
|
|
|
});
|
2020-11-27 16:24:07 +01:00
|
|
|
|
2021-03-18 15:05:15 +01:00
|
|
|
coWebsiteManager.onResize.subscribe(() => {
|
2021-05-04 11:29:37 +02:00
|
|
|
waScaleManager.applyNewSize();
|
2020-05-13 16:17:58 +02:00
|
|
|
});
|
2021-03-04 19:00:00 +01:00
|
|
|
|
|
|
|
iframeListener.init();
|
2021-05-11 17:37:21 +02:00
|
|
|
|
|
|
|
const app = new App({
|
2021-07-16 11:22:36 +02:00
|
|
|
target: HtmlUtils.getElementByIdOrFail("svelte-overlay"),
|
2021-05-31 12:06:11 +02:00
|
|
|
props: {
|
2021-07-16 11:22:36 +02:00
|
|
|
game: game,
|
2021-05-31 12:06:11 +02:00
|
|
|
},
|
2021-07-16 11:22:36 +02:00
|
|
|
});
|
2021-05-11 17:37:21 +02:00
|
|
|
|
2021-07-16 11:22:36 +02:00
|
|
|
export default app;
|