2015-04-07 00:00:00 +00:00
|
|
|
/// <reference path="../BaseView.ts"/>
|
|
|
|
|
2017-01-26 23:52:45 +00:00
|
|
|
module TS.SpaceTac.View {
|
2014-12-29 00:00:00 +00:00
|
|
|
// Interactive view of a Battle
|
2015-04-07 00:00:00 +00:00
|
|
|
export class BattleView extends BaseView {
|
2014-12-29 00:00:00 +00:00
|
|
|
|
|
|
|
// Displayed battle
|
|
|
|
battle: Game.Battle;
|
|
|
|
|
2014-12-30 00:00:00 +00:00
|
|
|
// Interacting player
|
|
|
|
player: Game.Player;
|
|
|
|
|
|
|
|
// UI container
|
2015-03-12 00:00:00 +00:00
|
|
|
ui: Phaser.Group;
|
2014-12-30 00:00:00 +00:00
|
|
|
|
|
|
|
// Battleground container
|
2014-12-31 00:00:00 +00:00
|
|
|
arena: Arena;
|
2014-12-30 00:00:00 +00:00
|
|
|
|
2015-02-03 00:00:00 +00:00
|
|
|
// Background image
|
|
|
|
background: Phaser.Image;
|
|
|
|
|
2014-12-31 00:00:00 +00:00
|
|
|
// Targetting mode (null if we're not in this mode)
|
|
|
|
targetting: Targetting;
|
|
|
|
|
2015-01-14 00:00:00 +00:00
|
|
|
// Ship list
|
|
|
|
ship_list: ShipList;
|
|
|
|
|
2015-01-02 00:00:00 +00:00
|
|
|
// Action bar
|
|
|
|
action_bar: ActionBar;
|
|
|
|
|
2014-12-31 00:00:00 +00:00
|
|
|
// Currently hovered ship
|
|
|
|
ship_hovered: Game.Ship;
|
|
|
|
|
2017-01-09 23:24:33 +00:00
|
|
|
// Ship tooltip
|
|
|
|
ship_tooltip: ShipTooltip;
|
|
|
|
|
2014-12-31 00:00:00 +00:00
|
|
|
// Subscription to the battle log
|
2014-12-31 00:00:00 +00:00
|
|
|
log_processor: LogProcessor;
|
2014-12-31 00:00:00 +00:00
|
|
|
|
2015-02-16 00:00:00 +00:00
|
|
|
// True if player interaction is allowed
|
|
|
|
interacting: boolean;
|
|
|
|
|
|
|
|
// Indicator of interaction disabled
|
|
|
|
icon_waiting: Phaser.Image;
|
|
|
|
|
2014-12-29 00:00:00 +00:00
|
|
|
// Init the view, binding it to a specific battle
|
2015-01-06 00:00:00 +00:00
|
|
|
init(player: Game.Player, battle: Game.Battle) {
|
2015-04-07 00:00:00 +00:00
|
|
|
super.init();
|
|
|
|
|
2014-12-30 00:00:00 +00:00
|
|
|
this.player = player;
|
2014-12-29 00:00:00 +00:00
|
|
|
this.battle = battle;
|
2014-12-31 00:00:00 +00:00
|
|
|
this.targetting = null;
|
2014-12-31 00:00:00 +00:00
|
|
|
this.ship_hovered = null;
|
2014-12-31 00:00:00 +00:00
|
|
|
this.log_processor = null;
|
2015-02-03 00:00:00 +00:00
|
|
|
this.background = null;
|
2014-12-29 00:00:00 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
// Create view graphics
|
|
|
|
create() {
|
2015-04-07 00:00:00 +00:00
|
|
|
super.create();
|
|
|
|
|
2014-12-30 00:00:00 +00:00
|
|
|
var game = this.game;
|
|
|
|
|
2015-02-03 00:00:00 +00:00
|
|
|
// Background
|
2015-01-02 00:00:00 +00:00
|
|
|
game.stage.backgroundColor = 0x000000;
|
2015-02-03 00:00:00 +00:00
|
|
|
this.background = new Phaser.Image(game, 0, 0, "battle-background", 0);
|
|
|
|
game.add.existing(this.background);
|
2015-01-02 00:00:00 +00:00
|
|
|
|
|
|
|
// Add arena (local map)
|
2015-03-06 00:00:00 +00:00
|
|
|
this.arena = new Arena(this);
|
2014-12-31 00:00:00 +00:00
|
|
|
game.add.existing(this.arena);
|
|
|
|
|
2015-01-02 00:00:00 +00:00
|
|
|
// Add UI layer
|
2015-03-12 00:00:00 +00:00
|
|
|
this.ui = new Phaser.Group(game);
|
2014-12-30 00:00:00 +00:00
|
|
|
game.add.existing(this.ui);
|
|
|
|
|
2015-01-02 00:00:00 +00:00
|
|
|
// Add UI elements
|
|
|
|
this.action_bar = new ActionBar(this);
|
2015-01-14 00:00:00 +00:00
|
|
|
this.ship_list = new ShipList(this);
|
2017-01-09 23:24:33 +00:00
|
|
|
this.ship_tooltip = new ShipTooltip(this);
|
2015-01-08 00:00:00 +00:00
|
|
|
|
2015-04-26 19:34:55 +00:00
|
|
|
this.icon_waiting = new Phaser.Image(this.game, this.getWidth() / 2, 50, "battle-waiting", 0);
|
2015-02-16 00:00:00 +00:00
|
|
|
this.icon_waiting.anchor.set(0.5, 0.5);
|
2015-02-28 00:00:00 +00:00
|
|
|
this.icon_waiting.scale.set(0.5, 0.5);
|
2015-02-16 00:00:00 +00:00
|
|
|
game.add.existing(this.icon_waiting);
|
2017-01-17 22:46:14 +00:00
|
|
|
game.tweens.create(this.icon_waiting).to({ "angle": 360 }, 3000).loop().start();
|
2015-02-23 00:00:00 +00:00
|
|
|
|
2014-12-31 00:00:00 +00:00
|
|
|
// Start processing the battle log
|
|
|
|
this.log_processor = new LogProcessor(this);
|
2015-02-20 00:00:00 +00:00
|
|
|
|
2015-04-07 00:00:00 +00:00
|
|
|
// "Battle" animation
|
|
|
|
this.displayFightMessage();
|
|
|
|
|
2015-04-22 21:42:40 +00:00
|
|
|
// BGM
|
|
|
|
this.gameui.audio.startMusic("full-on");
|
|
|
|
|
2015-03-06 00:00:00 +00:00
|
|
|
// Key mapping
|
2015-04-23 22:36:57 +00:00
|
|
|
this.inputs.bind(Phaser.Keyboard.SPACEBAR, "End turn", this.onSpaceKeyPressed);
|
|
|
|
this.inputs.bindCheat(Phaser.Keyboard.W, "Win current battle", () => {
|
|
|
|
this.battle.endBattle(this.player.fleet);
|
|
|
|
});
|
2014-12-29 00:00:00 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
// Leaving the view, we unbind the battle
|
|
|
|
shutdown() {
|
2015-01-02 00:00:00 +00:00
|
|
|
this.exitTargettingMode();
|
|
|
|
|
2014-12-31 00:00:00 +00:00
|
|
|
if (this.log_processor) {
|
|
|
|
this.log_processor.destroy();
|
|
|
|
this.log_processor = null;
|
2014-12-31 00:00:00 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
if (this.ui) {
|
|
|
|
this.ui.destroy();
|
|
|
|
this.ui = null;
|
|
|
|
}
|
|
|
|
|
|
|
|
if (this.arena) {
|
|
|
|
this.arena.destroy();
|
|
|
|
this.arena = null;
|
|
|
|
}
|
|
|
|
|
2014-12-29 00:00:00 +00:00
|
|
|
this.battle = null;
|
2015-04-07 00:00:00 +00:00
|
|
|
|
|
|
|
super.shutdown();
|
|
|
|
}
|
|
|
|
|
|
|
|
// Display an animated "BATTLE" text in the center of the view
|
|
|
|
displayFightMessage(): void {
|
2015-04-07 00:00:00 +00:00
|
|
|
var text = this.game.add.text(this.getMidWidth(), this.getMidHeight(), "BATTLE !",
|
2017-01-09 00:37:15 +00:00
|
|
|
{ align: "center", font: "bold 42px Arial", fill: "#EE2233" });
|
2015-04-07 00:00:00 +00:00
|
|
|
text.anchor.set(0.5, 0.5);
|
2017-01-09 00:37:15 +00:00
|
|
|
this.game.tweens.create(text.scale).to({ x: 3, y: 3 }).start();
|
|
|
|
var text_anim = this.game.tweens.create(text).to({ alpha: 0 });
|
2015-04-07 00:00:00 +00:00
|
|
|
text_anim.onComplete.addOnce(() => {
|
|
|
|
text.destroy();
|
|
|
|
});
|
|
|
|
text_anim.start();
|
2014-12-31 00:00:00 +00:00
|
|
|
}
|
|
|
|
|
2015-02-20 00:00:00 +00:00
|
|
|
// Listener for space key events
|
|
|
|
onSpaceKeyPressed(): void {
|
|
|
|
if (this.battle.playing_ship && this.battle.playing_ship.getPlayer() === this.player) {
|
|
|
|
this.battle.advanceToNextShip();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2014-12-31 00:00:00 +00:00
|
|
|
// Method called when cursor starts hovering over a ship (or its icon)
|
|
|
|
cursorOnShip(ship: Game.Ship): void {
|
|
|
|
this.setShipHovered(ship);
|
|
|
|
}
|
|
|
|
|
|
|
|
// Method called when cursor stops hovering over a ship (or its icon)
|
|
|
|
cursorOffShip(ship: Game.Ship): void {
|
|
|
|
if (this.ship_hovered === ship) {
|
|
|
|
this.setShipHovered(null);
|
|
|
|
}
|
|
|
|
}
|
2014-12-30 00:00:00 +00:00
|
|
|
|
2014-12-31 00:00:00 +00:00
|
|
|
// Method called when cursor moves in space
|
|
|
|
cursorInSpace(x: number, y: number): void {
|
|
|
|
if (!this.ship_hovered) {
|
2015-01-02 00:00:00 +00:00
|
|
|
if (this.targetting) {
|
|
|
|
this.targetting.setTargetSpace(x, y);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// Method called when cursor has been clicked (in space or on a ship)
|
|
|
|
cursorClicked(): void {
|
|
|
|
if (this.targetting) {
|
|
|
|
this.targetting.validate();
|
2014-12-31 00:00:00 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2014-12-31 00:00:00 +00:00
|
|
|
// Set the currently hovered ship
|
|
|
|
setShipHovered(ship: Game.Ship): void {
|
|
|
|
this.ship_hovered = ship;
|
2015-01-23 00:00:00 +00:00
|
|
|
this.arena.setShipHovered(ship);
|
2015-02-04 00:00:00 +00:00
|
|
|
this.ship_list.setHovered(ship);
|
2017-01-09 23:24:33 +00:00
|
|
|
this.ship_tooltip.setShip(ship);
|
2015-01-08 00:00:00 +00:00
|
|
|
if (this.targetting) {
|
|
|
|
if (ship) {
|
|
|
|
this.targetting.setTargetShip(ship);
|
|
|
|
} else {
|
|
|
|
this.targetting.unsetTarget();
|
|
|
|
}
|
2015-01-02 00:00:00 +00:00
|
|
|
}
|
2014-12-29 00:00:00 +00:00
|
|
|
}
|
2014-12-31 00:00:00 +00:00
|
|
|
|
2015-02-16 00:00:00 +00:00
|
|
|
// Enable or disable the global player interaction
|
|
|
|
// Disable interaction when it is the AI turn, or when the current ship can't play
|
|
|
|
setInteractionEnabled(enabled: boolean): void {
|
|
|
|
this.exitTargettingMode();
|
|
|
|
this.interacting = enabled;
|
|
|
|
|
2015-02-20 00:00:00 +00:00
|
|
|
Animation.setVisibility(this.game, this.icon_waiting, !this.interacting, 100);
|
2015-02-16 00:00:00 +00:00
|
|
|
}
|
|
|
|
|
2014-12-31 00:00:00 +00:00
|
|
|
// Enter targetting mode
|
|
|
|
// While in this mode, the Targetting object will receive hover and click events, and handle them
|
|
|
|
enterTargettingMode(): Targetting {
|
2015-02-16 00:00:00 +00:00
|
|
|
if (!this.interacting) {
|
|
|
|
return null;
|
|
|
|
}
|
|
|
|
|
2015-01-02 00:00:00 +00:00
|
|
|
if (this.targetting) {
|
|
|
|
this.exitTargettingMode();
|
|
|
|
}
|
|
|
|
|
2014-12-31 00:00:00 +00:00
|
|
|
this.targetting = new Targetting(this);
|
|
|
|
return this.targetting;
|
|
|
|
}
|
|
|
|
|
|
|
|
// Exit targetting mode
|
|
|
|
exitTargettingMode(): void {
|
2015-01-02 00:00:00 +00:00
|
|
|
if (this.targetting) {
|
|
|
|
this.targetting.destroy();
|
|
|
|
}
|
2014-12-31 00:00:00 +00:00
|
|
|
this.targetting = null;
|
|
|
|
}
|
2014-12-29 00:00:00 +00:00
|
|
|
}
|
|
|
|
}
|