2015-04-07 00:00:00 +00:00
|
|
|
/// <reference path="../BaseView.ts"/>
|
|
|
|
|
2017-02-09 00:00:35 +00:00
|
|
|
module TS.SpaceTac.UI {
|
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
|
2017-02-09 00:00:35 +00:00
|
|
|
battle: Battle;
|
2014-12-29 00:00:00 +00:00
|
|
|
|
2014-12-30 00:00:00 +00:00
|
|
|
// Interacting player
|
2017-02-09 00:00:35 +00:00
|
|
|
player: Player;
|
2014-12-30 00:00:00 +00:00
|
|
|
|
2017-03-15 21:40:19 +00:00
|
|
|
// Layers
|
|
|
|
layer_background: Phaser.Group;
|
|
|
|
layer_arena: Phaser.Group;
|
|
|
|
layer_borders: Phaser.Group;
|
|
|
|
layer_overlay: Phaser.Group;
|
|
|
|
layer_dialogs: Phaser.Group;
|
|
|
|
layer_sheets: 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
|
2017-03-09 17:11:00 +00:00
|
|
|
background: Phaser.Image | null;
|
2015-02-03 00:00:00 +00:00
|
|
|
|
2014-12-31 00:00:00 +00:00
|
|
|
// Targetting mode (null if we're not in this mode)
|
2017-03-09 17:11:00 +00:00
|
|
|
targetting: Targetting | null;
|
2014-12-31 00:00:00 +00:00
|
|
|
|
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
|
2017-03-09 17:11:00 +00:00
|
|
|
ship_hovered: Ship | null;
|
2014-12-31 00:00:00 +00:00
|
|
|
|
2017-01-09 23:24:33 +00:00
|
|
|
// Ship tooltip
|
|
|
|
ship_tooltip: ShipTooltip;
|
|
|
|
|
2017-03-12 23:32:41 +00:00
|
|
|
// Outcome dialog layer
|
|
|
|
outcome_layer: Phaser.Group;
|
|
|
|
|
2017-02-27 23:36:12 +00:00
|
|
|
// Character sheet
|
|
|
|
character_sheet: CharacterSheet;
|
|
|
|
|
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;
|
|
|
|
|
2014-12-29 00:00:00 +00:00
|
|
|
// Init the view, binding it to a specific battle
|
2017-02-09 00:00:35 +00:00
|
|
|
init(player: Player, battle: 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;
|
2015-02-03 00:00:00 +00:00
|
|
|
this.background = null;
|
2017-02-16 22:59:41 +00:00
|
|
|
|
|
|
|
this.battle.timer = this.timer;
|
2017-02-19 21:33:07 +00:00
|
|
|
|
|
|
|
this.log_processor = new LogProcessor(this);
|
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;
|
|
|
|
|
2017-03-15 21:40:19 +00:00
|
|
|
// Add layers
|
|
|
|
this.layer_background = this.addLayer();
|
|
|
|
this.layer_arena = this.addLayer();
|
|
|
|
this.layer_borders = this.addLayer();
|
|
|
|
this.layer_overlay = this.addLayer();
|
|
|
|
this.layer_dialogs = this.addLayer();
|
|
|
|
this.layer_sheets = this.addLayer();
|
|
|
|
|
2015-02-03 00:00:00 +00:00
|
|
|
// Background
|
|
|
|
this.background = new Phaser.Image(game, 0, 0, "battle-background", 0);
|
2017-03-15 21:40:19 +00:00
|
|
|
this.layer_background.add(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);
|
2017-03-15 21:40:19 +00:00
|
|
|
this.layer_arena.add(this.arena);
|
2014-12-30 00:00:00 +00:00
|
|
|
|
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);
|
2017-03-12 23:32:41 +00:00
|
|
|
this.outcome_layer = new Phaser.Group(this.game);
|
2017-03-15 21:40:19 +00:00
|
|
|
this.layer_dialogs.add(this.outcome_layer);
|
2017-02-28 00:07:37 +00:00
|
|
|
this.character_sheet = new CharacterSheet(this, -this.getWidth());
|
2017-03-15 21:40:19 +00:00
|
|
|
this.layer_sheets.add(this.character_sheet);
|
2015-01-08 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
|
2017-05-16 23:31:23 +00:00
|
|
|
this.inputs.bind("t", "Show tactical view", () => {
|
|
|
|
this.arena.setTacticalMode(true);
|
|
|
|
this.timer.schedule(5000, () => this.arena.setTacticalMode(false));
|
|
|
|
});
|
2017-05-03 18:12:13 +00:00
|
|
|
this.inputs.bindCheat("w", "Win current battle", () => {
|
2017-03-14 17:48:04 +00:00
|
|
|
iforeach(this.battle.iships(), ship => {
|
|
|
|
if (ship.fleet.player != this.player) {
|
|
|
|
ship.setDead();
|
|
|
|
}
|
|
|
|
});
|
2015-04-23 22:36:57 +00:00
|
|
|
this.battle.endBattle(this.player.fleet);
|
|
|
|
});
|
2017-05-03 18:12:13 +00:00
|
|
|
this.inputs.bindCheat("x", "Lose current battle", () => {
|
2017-03-14 17:48:04 +00:00
|
|
|
iforeach(this.battle.iships(), ship => {
|
|
|
|
if (ship.fleet.player == this.player) {
|
|
|
|
ship.setDead();
|
|
|
|
}
|
|
|
|
});
|
2017-03-12 23:32:41 +00:00
|
|
|
this.battle.endBattle(first(this.battle.fleets, fleet => fleet.player != this.player));
|
|
|
|
});
|
2017-05-03 18:12:13 +00:00
|
|
|
this.inputs.bindCheat("a", "Use AI to play", () => {
|
2017-03-09 17:11:00 +00:00
|
|
|
if (this.interacting && this.battle.playing_ship) {
|
2017-02-21 21:16:18 +00:00
|
|
|
this.setInteractionEnabled(false);
|
|
|
|
this.battle.playAI(new TacticalAI(this.battle.playing_ship));
|
|
|
|
}
|
|
|
|
});
|
2017-02-19 21:33:07 +00:00
|
|
|
|
2017-02-21 22:38:31 +00:00
|
|
|
// Start processing the log
|
|
|
|
this.log_processor.start();
|
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();
|
|
|
|
|
2017-03-09 17:11:00 +00:00
|
|
|
this.log_processor.destroy();
|
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
|
|
|
}
|
|
|
|
|
|
|
|
// Method called when cursor starts hovering over a ship (or its icon)
|
2017-02-09 00:00:35 +00:00
|
|
|
cursorOnShip(ship: Ship): void {
|
2017-02-15 22:34:27 +00:00
|
|
|
if (!this.targetting || ship.alive) {
|
|
|
|
this.setShipHovered(ship);
|
|
|
|
}
|
2014-12-31 00:00:00 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
// Method called when cursor stops hovering over a ship (or its icon)
|
2017-02-09 00:00:35 +00:00
|
|
|
cursorOffShip(ship: Ship): void {
|
2014-12-31 00:00:00 +00:00
|
|
|
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();
|
2017-03-12 23:32:41 +00:00
|
|
|
} else if (this.ship_hovered && this.ship_hovered.getPlayer() == this.player && this.interacting) {
|
2017-02-27 23:36:12 +00:00
|
|
|
this.character_sheet.show(this.ship_hovered);
|
2017-03-05 23:29:02 +00:00
|
|
|
this.setShipHovered(null);
|
2014-12-31 00:00:00 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2014-12-31 00:00:00 +00:00
|
|
|
// Set the currently hovered ship
|
2017-03-09 17:11:00 +00:00
|
|
|
setShipHovered(ship: Ship | null): void {
|
2014-12-31 00:00:00 +00:00
|
|
|
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-05-14 23:00:36 +00:00
|
|
|
|
|
|
|
if (ship) {
|
|
|
|
this.ship_tooltip.setShip(ship);
|
|
|
|
} else {
|
|
|
|
this.ship_tooltip.hide();
|
|
|
|
}
|
|
|
|
|
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;
|
|
|
|
}
|
|
|
|
|
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
|
2017-03-09 17:11:00 +00:00
|
|
|
enterTargettingMode(): Targetting | null {
|
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;
|
|
|
|
}
|
2017-03-12 23:32:41 +00:00
|
|
|
|
|
|
|
/**
|
|
|
|
* End the battle and show the outcome dialog
|
|
|
|
*/
|
|
|
|
endBattle() {
|
|
|
|
if (this.battle.ended) {
|
|
|
|
this.setInteractionEnabled(false);
|
|
|
|
|
2017-03-15 22:00:15 +00:00
|
|
|
this.gameui.session.setBattleEnded();
|
2017-03-14 22:28:07 +00:00
|
|
|
|
2017-03-12 23:32:41 +00:00
|
|
|
let dialog = new OutcomeDialog(this, this.player, this.battle.outcome);
|
|
|
|
dialog.position.set(this.getMidWidth() - dialog.width / 2, this.getMidHeight() - dialog.height / 2);
|
|
|
|
this.outcome_layer.addChild(dialog);
|
|
|
|
} else {
|
|
|
|
console.error("Battle not ended !");
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Exit the battle, and go back to map
|
|
|
|
*/
|
|
|
|
exitBattle() {
|
|
|
|
this.player.exitBattle();
|
|
|
|
this.game.state.start('router');
|
|
|
|
}
|
2017-03-14 22:28:07 +00:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Revert the battle, and go back to map
|
|
|
|
*/
|
|
|
|
revertBattle() {
|
|
|
|
this.player.revertBattle();
|
|
|
|
this.game.state.start('router');
|
|
|
|
}
|
2014-12-29 00:00:00 +00:00
|
|
|
}
|
|
|
|
}
|