orbit/js/scenes/GameScene.js

79 lines
1.9 KiB
JavaScript

import Phaser from '../vendor/phaser.js';
import { config } from '../config/Config.js';
import { toColor } from '../utils/Color.js';
import { Ship } from '../entities/Ship.js';
import { Starfield } from '../visuals/Starfield.js';
const FONT_FALLBACK = "'Segoe UI', 'Helvetica Neue', Arial, sans-serif";
/**
* The game world (v0.1: one ship in open space).
* Click anywhere to fly there.
*/
export class GameScene extends Phaser.Scene {
constructor() {
super({ key: 'GameScene' });
}
create() {
// Background
this.starfield = new Starfield(this);
this.starfield.create();
// The ship
this.ship = new Ship(this, this.scale.width / 2, this.scale.height / 2);
this.ship.setDepth(10);
// Hint
this.hint = this.add
.text(this.scale.width / 2, this.scale.height - 26, config.get('game.hintText', ''), {
fontFamily: FONT_FALLBACK,
fontSize: '14px',
color: '#54608a',
})
.setOrigin(0.5);
// Input: click = fly there
this.input.on('pointerdown', (pointer) => {
this.showTargetMarker(pointer.worldX, pointer.worldY);
this.ship.setTarget(pointer.worldX, pointer.worldY);
this.hideHint();
});
}
update(_time, delta) {
this.starfield.update(delta);
this.ship.update(_time, delta);
}
showTargetMarker(x, y) {
const color = toColor(config.get('game.markerColor', '#41c7ff'));
const marker = this.add.circle(x, y, 10, color, 0.8).setDepth(5);
this.tweens.add({
targets: marker,
scale: 2.4,
alpha: 0,
duration: 450,
ease: 'Sine.easeOut',
onComplete: () => marker.destroy(),
});
}
hideHint() {
if (!this.hint || !this.hint.active) return;
this.tweens.add({
targets: this.hint,
alpha: 0,
duration: 400,
onComplete: () => {
this.hint.destroy();
this.hint = null;
},
});
}
shutdown() {
this.starfield?.destroy();
}
}