2017-02-09 00:00:35 +00:00
|
|
|
module TS.SpaceTac.UI {
|
2014-12-31 00:00:00 +00:00
|
|
|
// Icon to activate a ship capability (move, fire...)
|
2014-12-31 00:00:00 +00:00
|
|
|
export class ActionIcon extends Phaser.Button {
|
2015-01-22 00:00:00 +00:00
|
|
|
// Link to the parent bar
|
2017-05-22 16:29:04 +00:00
|
|
|
bar: ActionBar
|
2015-01-02 00:00:00 +00:00
|
|
|
|
|
|
|
// Link to the parent battle view
|
2017-05-22 16:29:04 +00:00
|
|
|
battleview: BattleView
|
2015-01-02 00:00:00 +00:00
|
|
|
|
|
|
|
// Related ship
|
2017-05-22 16:29:04 +00:00
|
|
|
ship: Ship
|
2015-01-02 00:00:00 +00:00
|
|
|
|
|
|
|
// Related game action
|
2017-05-22 16:29:04 +00:00
|
|
|
action: BaseAction
|
2015-01-02 00:00:00 +00:00
|
|
|
|
2015-02-26 00:00:00 +00:00
|
|
|
// True if the action can be used
|
2017-05-22 16:29:04 +00:00
|
|
|
active: boolean
|
2015-02-26 00:00:00 +00:00
|
|
|
|
2017-01-19 23:39:13 +00:00
|
|
|
// True if the action is selected for use
|
2017-05-22 16:29:04 +00:00
|
|
|
selected: boolean
|
2017-01-19 23:39:13 +00:00
|
|
|
|
2015-02-26 00:00:00 +00:00
|
|
|
// True if an action is currently selected, and this one won't be available after its use
|
2017-05-22 16:29:04 +00:00
|
|
|
fading: boolean
|
2015-02-26 00:00:00 +00:00
|
|
|
|
2015-01-06 00:00:00 +00:00
|
|
|
// Current targetting
|
2017-05-22 16:29:04 +00:00
|
|
|
private targetting: Targetting | null
|
2015-01-06 00:00:00 +00:00
|
|
|
|
2015-02-04 00:00:00 +00:00
|
|
|
// Action icon - image representing the action
|
2017-05-22 16:29:04 +00:00
|
|
|
private layer_icon: Phaser.Image
|
2015-02-04 00:00:00 +00:00
|
|
|
|
2015-01-29 00:00:00 +00:00
|
|
|
// Layer applied when the action is active
|
2017-05-22 16:29:04 +00:00
|
|
|
private layer_active: Phaser.Image
|
2015-01-29 00:00:00 +00:00
|
|
|
|
2017-01-19 23:39:13 +00:00
|
|
|
// Layer applied when the action is selected
|
2017-05-22 16:29:04 +00:00
|
|
|
private layer_selected: Phaser.Image
|
2017-01-19 23:39:13 +00:00
|
|
|
|
2017-05-16 23:12:05 +00:00
|
|
|
// Cooldown indicators
|
2017-05-22 16:29:04 +00:00
|
|
|
private cooldown: Phaser.Image
|
|
|
|
private cooldown_count: Phaser.Text
|
2017-05-16 23:12:05 +00:00
|
|
|
|
2015-01-02 00:00:00 +00:00
|
|
|
// Create an icon for a single ship action
|
2017-05-16 23:12:05 +00:00
|
|
|
constructor(bar: ActionBar, x: number, y: number, ship: Ship, action: BaseAction, position: number) {
|
2017-08-24 18:26:07 +00:00
|
|
|
super(bar.game, x, y, bar.battleview.getImageInfo("battle-actionbar-icon").key, () => this.processClick(),
|
|
|
|
undefined, bar.battleview.getImageInfo("battle-actionbar-icon").frame, bar.battleview.getImageInfo("battle-actionbar-icon").frame);
|
2017-01-12 23:57:28 +00:00
|
|
|
|
2015-01-22 00:00:00 +00:00
|
|
|
this.bar = bar;
|
2015-01-02 00:00:00 +00:00
|
|
|
this.battleview = bar.battleview;
|
|
|
|
this.ship = ship;
|
|
|
|
this.action = action;
|
|
|
|
|
2017-08-24 18:26:07 +00:00
|
|
|
bar.actions.add(this);
|
|
|
|
|
|
|
|
// Icon layer
|
|
|
|
let icon = this.battleview.getFirstImage(`action-${action.code}`, `equipment-${action.equipment ? action.equipment.code : "---"}`);
|
|
|
|
this.layer_icon = new Phaser.Image(this.game, this.width / 2, this.height / 2, icon.key, icon.frame);
|
|
|
|
this.layer_icon.anchor.set(0.5, 0.5);
|
|
|
|
this.layer_icon.scale.set(0.35, 0.35);
|
|
|
|
this.addChild(this.layer_icon);
|
2015-01-02 00:00:00 +00:00
|
|
|
|
2015-01-29 00:00:00 +00:00
|
|
|
// Active layer
|
2015-02-26 00:00:00 +00:00
|
|
|
this.active = false;
|
2017-08-24 18:26:07 +00:00
|
|
|
this.layer_active = this.battleview.newImage("battle-actionbar-icon-available", this.width / 2, this.height / 2);
|
2017-01-19 23:39:13 +00:00
|
|
|
this.layer_active.anchor.set(0.5, 0.5);
|
2015-02-26 00:00:00 +00:00
|
|
|
this.layer_active.visible = false;
|
2015-02-04 00:00:00 +00:00
|
|
|
this.addChild(this.layer_active);
|
|
|
|
|
2017-01-19 23:39:13 +00:00
|
|
|
// Selected layer
|
|
|
|
this.selected = false;
|
2017-08-24 18:26:07 +00:00
|
|
|
this.layer_selected = this.battleview.newImage("battle-actionbar-icon-selected", this.width / 2, this.height / 2);
|
2017-01-19 23:39:13 +00:00
|
|
|
this.layer_selected.anchor.set(0.5, 0.5);
|
|
|
|
this.layer_selected.visible = false;
|
|
|
|
this.addChild(this.layer_selected);
|
|
|
|
|
2017-05-16 23:12:05 +00:00
|
|
|
// Cooldown layer
|
2017-08-24 18:26:07 +00:00
|
|
|
this.cooldown = this.battleview.newImage("battle-actionbar-icon-cooldown", this.width / 2, this.height / 2);
|
2017-05-22 16:29:04 +00:00
|
|
|
this.cooldown.anchor.set(0.5, 0.5);
|
2017-08-15 22:30:19 +00:00
|
|
|
this.cooldown_count = new Phaser.Text(this.game, 0, 0, "", { align: "center", font: "bold 34pt SpaceTac", fill: "#aaaaaa" });
|
2017-07-19 17:46:04 +00:00
|
|
|
this.cooldown_count.anchor.set(0.5, 0.45);
|
2017-05-22 16:29:04 +00:00
|
|
|
this.cooldown.addChild(this.cooldown_count);
|
|
|
|
this.addChild(this.cooldown);
|
2017-01-19 00:17:24 +00:00
|
|
|
|
|
|
|
// Events
|
2017-05-16 23:12:05 +00:00
|
|
|
this.battleview.tooltip.bind(this, filler => {
|
|
|
|
ActionTooltip.fill(filler, this.ship, this.action, position);
|
|
|
|
return true;
|
|
|
|
});
|
2015-01-29 00:00:00 +00:00
|
|
|
|
|
|
|
// Initialize
|
2017-02-16 18:24:21 +00:00
|
|
|
this.updateActiveStatus(true);
|
2017-05-16 23:12:05 +00:00
|
|
|
this.updateCooldownStatus();
|
2015-01-02 00:00:00 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
// Process a click event on the action icon
|
2015-02-04 00:00:00 +00:00
|
|
|
processClick(): void {
|
2017-02-12 18:54:09 +00:00
|
|
|
if (!this.bar.interactive) {
|
|
|
|
return;
|
|
|
|
}
|
2017-03-07 19:27:46 +00:00
|
|
|
if (this.action.checkCannotBeApplied(this.ship)) {
|
2015-01-06 00:00:00 +00:00
|
|
|
return;
|
|
|
|
}
|
2017-07-19 23:22:18 +00:00
|
|
|
|
|
|
|
this.battleview.audio.playOnce("ui-button-click");
|
|
|
|
|
2017-01-19 23:39:13 +00:00
|
|
|
if (this.selected) {
|
|
|
|
this.bar.actionEnded();
|
|
|
|
return;
|
|
|
|
}
|
2015-01-02 00:00:00 +00:00
|
|
|
|
2015-02-04 00:00:00 +00:00
|
|
|
// End any previously selected action
|
|
|
|
this.bar.actionEnded();
|
2015-02-28 00:00:00 +00:00
|
|
|
this.bar.actionStarted();
|
2015-02-04 00:00:00 +00:00
|
|
|
|
2015-03-03 00:00:00 +00:00
|
|
|
// Update range hint
|
2017-06-21 23:32:18 +00:00
|
|
|
if (this.battleview.arena.range_hint && this.action instanceof MoveAction) {
|
2017-05-30 22:40:28 +00:00
|
|
|
this.battleview.arena.range_hint.update(this.ship, this.action);
|
2017-03-09 17:11:00 +00:00
|
|
|
}
|
2015-03-03 00:00:00 +00:00
|
|
|
|
2017-01-19 23:39:13 +00:00
|
|
|
// Set the selected state
|
|
|
|
this.setSelected(true);
|
2015-02-04 00:00:00 +00:00
|
|
|
|
2015-01-06 00:00:00 +00:00
|
|
|
if (this.action.needs_target) {
|
2017-03-09 17:11:00 +00:00
|
|
|
let sprite = this.battleview.arena.findShipSprite(this.ship);
|
|
|
|
if (sprite) {
|
|
|
|
// Switch to targetting mode (will apply action when a target is selected)
|
2017-06-21 23:32:18 +00:00
|
|
|
this.targetting = this.battleview.enterTargettingMode(this.action);
|
2017-01-19 18:33:56 +00:00
|
|
|
}
|
2015-01-06 00:00:00 +00:00
|
|
|
} else {
|
2015-02-04 00:00:00 +00:00
|
|
|
// No target needed, apply action immediately
|
2015-01-06 00:00:00 +00:00
|
|
|
this.processSelection(null);
|
|
|
|
}
|
2015-01-06 00:00:00 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
// Called when a target is selected
|
2017-03-09 17:11:00 +00:00
|
|
|
processSelection(target: Target | null): void {
|
2017-03-07 19:27:46 +00:00
|
|
|
if (this.action.apply(this.ship, target)) {
|
2015-01-22 00:00:00 +00:00
|
|
|
this.bar.actionEnded();
|
2015-01-06 00:00:00 +00:00
|
|
|
}
|
2014-12-31 00:00:00 +00:00
|
|
|
}
|
2015-01-29 00:00:00 +00:00
|
|
|
|
2015-02-04 00:00:00 +00:00
|
|
|
// Called to clear the current state
|
|
|
|
resetState(): void {
|
|
|
|
if (this.targetting) {
|
|
|
|
this.targetting = null;
|
|
|
|
}
|
2017-01-19 23:39:13 +00:00
|
|
|
this.setSelected(false);
|
2017-05-16 23:12:05 +00:00
|
|
|
this.updateCooldownStatus();
|
2015-02-04 00:00:00 +00:00
|
|
|
this.updateActiveStatus();
|
2017-02-07 19:15:21 +00:00
|
|
|
this.updateFadingStatus(this.ship.values.power.get());
|
2017-05-30 22:40:28 +00:00
|
|
|
this.battleview.arena.range_hint.clear();
|
2015-02-04 00:00:00 +00:00
|
|
|
}
|
|
|
|
|
2017-01-19 23:39:13 +00:00
|
|
|
// Set the selected state on this icon
|
|
|
|
setSelected(selected: boolean) {
|
|
|
|
this.selected = selected;
|
2017-04-10 17:38:33 +00:00
|
|
|
this.battleview.animations.setVisible(this.layer_selected, this.selected, 300);
|
2017-05-22 16:29:04 +00:00
|
|
|
this.updateCooldownStatus();
|
2017-01-19 23:39:13 +00:00
|
|
|
}
|
|
|
|
|
2017-05-16 23:12:05 +00:00
|
|
|
// Update the cooldown status
|
|
|
|
updateCooldownStatus(): void {
|
2017-05-22 16:29:04 +00:00
|
|
|
let remaining = this.action.getUsesBeforeOverheat();
|
|
|
|
if (this.selected && remaining == 1) {
|
|
|
|
// will overheat, hint at the cooldown time
|
|
|
|
let cooldown = this.action.getCooldownDuration(true);
|
2017-08-24 18:26:07 +00:00
|
|
|
this.battleview.changeImage(this.cooldown, "battle-actionbar-icon-cooldown");
|
2017-05-22 16:29:04 +00:00
|
|
|
this.cooldown.scale.set(0.7);
|
|
|
|
this.cooldown_count.text = `${cooldown}`;
|
|
|
|
this.battleview.animations.setVisible(this.cooldown, true, 300);
|
|
|
|
} else if (remaining == 0) {
|
|
|
|
// overheated, show cooldown time
|
|
|
|
let cooldown = this.action.getCooldownDuration(false);
|
2017-08-24 18:26:07 +00:00
|
|
|
this.battleview.changeImage(this.cooldown, "battle-actionbar-icon-cooldown");
|
2017-05-22 16:29:04 +00:00
|
|
|
this.cooldown.scale.set(1);
|
|
|
|
this.cooldown_count.text = `${cooldown}`;
|
|
|
|
this.battleview.animations.setVisible(this.cooldown, true, 300);
|
2017-07-19 17:46:04 +00:00
|
|
|
} else if (this.action instanceof ToggleAction && this.action.activated) {
|
2017-08-24 18:26:07 +00:00
|
|
|
this.battleview.changeImage(this.cooldown, "battle-actionbar-icon-toggled");
|
2017-07-19 17:46:04 +00:00
|
|
|
this.cooldown.scale.set(1);
|
|
|
|
this.cooldown_count.text = "";
|
|
|
|
this.battleview.animations.setVisible(this.cooldown, true, 300);
|
2017-05-22 16:29:04 +00:00
|
|
|
} else {
|
|
|
|
this.battleview.animations.setVisible(this.cooldown, false, 300);
|
2017-05-16 23:12:05 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2015-01-29 00:00:00 +00:00
|
|
|
// Update the active status, from the action canBeUsed result
|
2017-02-16 18:24:21 +00:00
|
|
|
updateActiveStatus(force = false): void {
|
2017-01-13 00:28:23 +00:00
|
|
|
var old_active = this.active;
|
2017-03-07 19:27:46 +00:00
|
|
|
this.active = !this.action.checkCannotBeApplied(this.ship);
|
2017-02-16 18:24:21 +00:00
|
|
|
if (force || (this.active != old_active)) {
|
2017-04-10 17:38:33 +00:00
|
|
|
this.battleview.animations.setVisible(this.layer_active, this.active, 500);
|
2017-01-13 00:28:23 +00:00
|
|
|
this.game.tweens.create(this.layer_icon).to({ alpha: this.active ? 1 : 0.3 }, 500).start();
|
|
|
|
this.input.useHandCursor = this.active;
|
|
|
|
}
|
2015-02-26 00:00:00 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
// Update the fading status, given an hypothetical remaining AP
|
2017-05-18 21:14:41 +00:00
|
|
|
updateFadingStatus(remaining_ap: number, action: BaseAction | null = null): void {
|
2017-05-16 23:12:05 +00:00
|
|
|
let old_fading = this.fading;
|
2017-05-18 21:14:41 +00:00
|
|
|
let overheat = (action == this.action && this.action.equipment !== null && this.action.equipment.cooldown.willOverheat());
|
2017-05-16 23:12:05 +00:00
|
|
|
this.fading = this.active && (this.action.checkCannotBeApplied(this.ship, remaining_ap) != null || overheat);
|
2017-01-13 00:28:23 +00:00
|
|
|
if (this.fading != old_fading) {
|
2017-04-10 17:38:33 +00:00
|
|
|
this.battleview.animations.setVisible(this.layer_active, this.active && !this.fading, 500);
|
2017-01-13 00:28:23 +00:00
|
|
|
}
|
2015-01-29 00:00:00 +00:00
|
|
|
}
|
2014-12-31 00:00:00 +00:00
|
|
|
}
|
2015-01-07 00:00:00 +00:00
|
|
|
}
|