This commit is contained in:
Hyun Ahn 2023-11-21 03:59:02 +09:00
parent 469659fdd2
commit ff17c51286
2 changed files with 86 additions and 77 deletions

View File

@ -8,95 +8,96 @@ class LoadingScene extends Phaser.Scene {
} }
loadLoadingScreen() { loadLoadingScreen() {
let progressBar = this.add.graphics(); const graphics = this.add.graphics();
let progressBox = this.add.graphics();
progressBox.fillStyle(0x222222, 0.8);
let width = this.cameras.main.width; graphics.lineStyle(4, 0xff00ff, 1).setDepth(10);
let height = this.cameras.main.height;
let loadingText = this.make.text({ // let progressBar = this.add.graphics();
x: width / 2, // let progressBox = this.add.graphics();
y: height / 2 - 50, // progressBox.lineStyle(5, 0xff00ff, 1.0);
text: "Loading...", // progressBox.fillStyle(0x222222, 0.8);
style: {
font: "20px emerald",
color: "#ffffff",
},
});
loadingText.setOrigin(0.5, 0.5);
let percentText = this.make.text({ // let width = this.cameras.main.width;
x: width / 2, // let height = this.cameras.main.height;
y: height / 2,
text: "0%",
style: {
font: "18px emerald",
color: "#ffffff",
},
});
percentText.setOrigin(0.5, 0.5);
let assetText = this.make.text({ // let loadingText = this.make.text({
x: width / 2, // x: width / 2,
y: height / 2 + 50, // y: height / 2 - 50,
text: "", // text: "Loading game...",
style: { // style: {
font: "18px monospace", // font: "23px emerald",
color: "#ffffff", // color: "#ffffff",
}, // },
}); // });
assetText.setOrigin(0.5, 0.5); // loadingText.setOrigin(0.5, 0.5);
this.load.on("progress", (value: string) => { // let percentText = this.make.text({
const parsedValue = parseInt(value); // x: width / 2,
percentText.setText(parsedValue * 100 + "%"); // y: height / 2,
progressBar.clear(); // text: "0%",
progressBar.fillStyle(0xffffff, 0.8); // style: {
progressBar.fillRect( // font: "18px emerald",
this.gameWidth / 2 - 160, // color: "#ffffff",
280, // },
300 * parsedValue, // });
30 // percentText.setOrigin(0.5, 0.5);
);
});
this.load.on("fileprogress", (file) => { // let assetText = this.make.text({
assetText.setText("Loading asset: " + file.key); // x: width / 2,
}); // y: height / 2 + 50,
// text: "",
// style: {
// font: "18px emerald",
// color: "#ffffff",
// },
// });
// assetText.setOrigin(0.5, 0.5);
this.load.on("complete", () => { // this.load.on("progress", (value: string) => {
progressBar.destroy(); // const parsedValue = parseInt(value);
progressBox.destroy(); // percentText.setText(parsedValue * 100 + "%");
loadingText.destroy(); // progressBar.clear();
percentText.destroy(); // progressBar.fillStyle(0xffffff, 0.8);
assetText.destroy(); // progressBar.fillRect(width / 2 - 160, 280, 300 * parsedValue, 30);
}); // });
// this.load.on("fileprogress", (file) => {
// assetText.setText("Loading asset: " + file.key);
// });
// this.load.on("complete", () => {
// progressBar.destroy();
// progressBox.destroy();
// loadingText.destroy();
// percentText.destroy();
// assetText.destroy();
// });
} }
isLocal() { // isLocal() {
return location.hostname === "localhost" || // return location.hostname === "localhost" ||
location.hostname === "127.0.0.1" // location.hostname === "127.0.0.1"
? true // ? true
: false; // : false;
} // }
gameHeight() { // get gameHeight() {
return game.config.height as number; // return this.game.config.height as number;
} // }
gameWidth() { // get gameWidth() {
return game.config.width as number; // return this.game.config.width as number;
} // }
create() { async create() {
// const logoExposeSetting: number = this.isLocal ? 300 : 2000; // const logoExposeSetting: number = this.isLocal() ? 500 : 2000;
// this.cameras.main.fadeIn(1000, 255, 255, 255); // this.cameras.main.fadeIn(1000, 255, 255, 255);
// setTimeout(() => {
// this.scene.start("battle"); setTimeout(() => {
// }, logoExposeSetting); this.scene.start("battle");
}, 500);
} }
} }

View File

@ -6,16 +6,25 @@ import InvertPostFX from './pipelines/invert';
const config: Phaser.Types.Core.GameConfig = { const config: Phaser.Types.Core.GameConfig = {
type: Phaser.WEBGL, type: Phaser.WEBGL,
parent: 'app', parent: 'app',
backgroundColor: 'transparent',
scale: { scale: {
width: 1920, width: 1920,
height: 1080, height: 1080,
mode: Phaser.Scale.FIT mode: Phaser.Scale.FIT
}, },
pixelArt: true, pixelArt: true,
pipeline: [ InvertPostFX ] as unknown as Phaser.Types.Core.PipelineConfig, pipeline: [ InvertPostFX ] as unknown as Phaser.Types.Core.PipelineConfig
scene: [ LoadingScene, BattleScene ]
}; };
const game = new Phaser.Game(
Object.assign(config, {
scene: [
LoadingScene,
BattleScene,
]
})
)
const setPositionRelative = function (guideObject: any, x: number, y: number) { const setPositionRelative = function (guideObject: any, x: number, y: number) {
if (guideObject && guideObject instanceof Phaser.GameObjects.GameObject) { if (guideObject && guideObject instanceof Phaser.GameObjects.GameObject) {
const offsetX = guideObject.width * (-0.5 + (0.5 - guideObject.originX)); const offsetX = guideObject.width * (-0.5 + (0.5 - guideObject.originX));
@ -34,7 +43,6 @@ Phaser.GameObjects.Text.prototype.setPositionRelative = setPositionRelative;
document.fonts.load('16px emerald').then(() => document.fonts.load('10px pkmnems')); document.fonts.load('16px emerald').then(() => document.fonts.load('10px pkmnems'));
const game = new Phaser.Game(config);
game.sound.pauseOnBlur = false; game.sound.pauseOnBlur = false;
export default game; export default game;