1
0
Fork 0

arena: Highlight ships targetted by current action

This commit is contained in:
Michaël Lemaire 2017-05-09 20:17:49 +02:00
parent d68f295f2d
commit 000dcbcfd8
8 changed files with 53 additions and 19 deletions

1
TODO
View file

@ -11,7 +11,6 @@
* Fix targetting not resetting when using action shortcuts
* Add battle statistics and/or critics in outcome dialog
* Ensure that tweens and particle emitters get destroyed once animation is done (or view changes)
* Highlight ships that will be included as target of current action
* Controls: Do not focus on ship while targetting for area effects (dissociate hover and target)
* Active effects are not enough visible in ship list (maybe better in arena ?)
* All things displayed in battle should be updated from LogProcess forwarding, not from current game state

Binary file not shown.

After

Width:  |  Height:  |  Size: 88 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

View file

@ -55,6 +55,8 @@ module TS.SpaceTac.UI {
this.loadImage("battle/arena/ship-playing-enemy.png");
this.loadImage("battle/arena/ship-playing-own.png");
this.loadImage("battle/arena/stasis.png");
this.loadImage("battle/arena/target.png");
this.loadImage("battle/arena/blast.png");
this.loadImage("battle/actions/move.png");
this.loadImage("battle/actions/endturn.png");
this.loadImage("battle/actions/fire-gatlinggun.png");

View file

@ -193,5 +193,12 @@ module TS.SpaceTac.UI {
console.error("Drone not found in arena for removal", drone);
}
}
/**
* Highlight ships that would be the target of current action
*/
highlightTargets(ships: Ship[]): void {
this.ship_sprites.forEach(sprite => sprite.setTargetted(contains(ships, sprite.ship)));
}
}
}

View file

@ -16,6 +16,9 @@ module TS.SpaceTac.UI {
// Statis effect
stasis: Phaser.Image;
// Target effect
target: Phaser.Image;
// Hover effect
hover: Phaser.Image;
@ -40,12 +43,18 @@ module TS.SpaceTac.UI {
this.sprite.scale.set(64 / this.sprite.width);
this.addChild(this.sprite);
// Add ship sprite
// Add stasis effect
this.stasis = new Phaser.Image(this.game, 0, 0, "battle-arena-stasis");
this.stasis.anchor.set(0.5, 0.5);
this.stasis.visible = false;
this.addChild(this.stasis);
// Add target effect
this.target = new Phaser.Image(this.game, 0, 0, "battle-arena-target");
this.target.anchor.set(0.5, 0.5);
this.target.visible = false;
this.addChild(this.target);
// Add playing effect
this.frame = new Phaser.Image(this.game, 0, 0, `battle-arena-ship-normal-${this.enemy ? "enemy" : "own"}`, 0);
this.frame.anchor.set(0.5, 0.5);
@ -75,7 +84,9 @@ module TS.SpaceTac.UI {
// Set the hovered state on this ship
// This will toggle the hover effect
setHovered(hovered: boolean) {
this.battleview.animations.setVisible(this.hover, hovered, 200);
if (!this.target.visible) {
this.battleview.animations.setVisible(this.hover, hovered, 200);
}
}
// Set the playing state on this ship
@ -84,6 +95,18 @@ module TS.SpaceTac.UI {
this.frame.loadTexture(`battle-arena-ship-${playing ? "playing" : "normal"}-${this.enemy ? "enemy" : "own"}`);
}
/**
* Set the ship as target of current action
*
* This will toggle the visibility of target indicator
*/
setTargetted(targetted: boolean): void {
if (targetted) {
this.battleview.animations.setVisible(this.hover, false, 1);
}
this.target.visible = targetted;
}
/**
* Activate the dead effect (stasis)
*/

View file

@ -60,10 +60,8 @@ module TS.SpaceTac.UI {
// Draw a circle, hinting available range
private draw(circle: Phaser.Circle): void {
this.circle.clear();
this.circle.lineStyle(5, 0x862080, 0.4);
this.circle.beginFill(0xD860D0, 0.2);
this.circle.lineStyle(5, 0xffffff, 0.2);
this.circle.drawCircle(circle.x, circle.y, circle.diameter);
this.circle.endFill();
this.circle.visible = true;
}
}

View file

@ -12,7 +12,7 @@ module TS.SpaceTac.UI {
// Circle for effect radius
blast_radius: number;
blast: Phaser.Graphics;
blast: Phaser.Image;
// Signal to receive hovering events
targetHovered: Phaser.Signal;
@ -38,7 +38,8 @@ module TS.SpaceTac.UI {
// Visual effects
if (battleview) {
this.blast = new Phaser.Graphics(battleview.game, 0, 0);
this.blast = new Phaser.Image(battleview.game, 0, 0, "battle-arena-blast");
this.blast.anchor.set(0.5, 0.5);
this.blast.visible = false;
battleview.arena.add(this.blast);
this.line_initial = new Phaser.Graphics(battleview.game, 0, 0);
@ -68,6 +69,9 @@ module TS.SpaceTac.UI {
this.blast.destroy();
}
this.ap_indicators.forEach(indicator => indicator.destroy());
if (this.battleview) {
this.battleview.arena.highlightTargets([]);
}
}
// Set AP indicators to display at fixed interval along the line
@ -81,7 +85,7 @@ module TS.SpaceTac.UI {
if (this.battleview) {
if (this.source && this.target_initial) {
this.line_initial.clear();
this.line_initial.lineStyle(2, 0xFF0000);
this.line_initial.lineStyle(3, 0x666666);
this.line_initial.moveTo(this.source.x, this.source.y);
this.line_initial.lineTo(this.target_initial.x, this.target_initial.y);
this.line_initial.visible = true;
@ -91,7 +95,7 @@ module TS.SpaceTac.UI {
if (this.source && this.target_corrected) {
this.line_corrected.clear();
this.line_corrected.lineStyle(3, 0x00FF00);
this.line_corrected.lineStyle(6, this.ap_interval ? 0xe09c47 : 0xDC6441);
this.line_corrected.moveTo(this.source.x, this.source.y);
this.line_corrected.lineTo(this.target_corrected.x, this.target_corrected.y);
this.line_corrected.visible = true;
@ -100,14 +104,16 @@ module TS.SpaceTac.UI {
}
if (this.target_corrected && this.blast_radius) {
this.blast.clear();
this.blast.lineStyle(5, 0x208620, 0.4);
this.blast.beginFill(0x60D860, 0.2);
this.blast.drawCircle(this.target_corrected.x, this.target_corrected.y, this.blast_radius * 2);
this.blast.endFill();
this.blast.position.set(this.target_corrected.x, this.target_corrected.y);
this.blast.scale.set(this.blast_radius * 2 / 365);
this.blast.visible = true;
let targets = this.battleview.battle.collectShipsInCircle(this.target_corrected, this.blast_radius, true);
this.battleview.arena.highlightTargets(targets);
} else {
this.blast.visible = false;
this.battleview.arena.highlightTargets(this.target_corrected && this.target_corrected.ship ? [this.target_corrected.ship] : []);
}
this.updateApIndicators();
@ -116,14 +122,14 @@ module TS.SpaceTac.UI {
// Update the AP indicators display
updateApIndicators() {
if (!this.battleview || !this.source || !this.target_corrected) {
if (!this.battleview || !this.source) {
return;
}
// Get indicator count
let count = 0;
let distance = 0;
if (this.line_corrected.visible && this.ap_interval > 0) {
if (this.line_corrected.visible && this.ap_interval > 0 && this.target_corrected) {
distance = this.target_corrected.getDistanceTo(Target.newFromLocation(this.source.x, this.source.y)) - 0.00001;
count = Math.ceil(distance / this.ap_interval);
}
@ -132,7 +138,6 @@ module TS.SpaceTac.UI {
while (this.ap_indicators.length < count) {
let indicator = new Phaser.Image(this.battleview.game, 0, 0, "battle-arena-ap-indicator");
indicator.anchor.set(0.5, 0.5);
indicator.scale.set(0.5, 0.5);
this.battleview.arena.addChild(indicator);
this.ap_indicators.push(indicator);
}
@ -142,7 +147,7 @@ module TS.SpaceTac.UI {
}
// Spread indicators
if (count > 0 && distance > 0) {
if (count > 0 && distance > 0 && this.target_corrected) {
let source = this.source;
let dx = this.ap_interval * (this.target_corrected.x - source.x) / distance;
let dy = this.ap_interval * (this.target_corrected.y - source.y) / distance;