2017-09-24 22:23:22 +00:00
|
|
|
module TK.SpaceTac.UI {
|
2015-01-02 00:00:00 +00:00
|
|
|
// Bar with all available action icons displayed
|
2015-02-22 00:00:00 +00:00
|
|
|
export class ActionBar extends Phaser.Group {
|
2015-01-02 00:00:00 +00:00
|
|
|
// Link to the parent battleview
|
2017-09-28 23:18:46 +00:00
|
|
|
battleview: BattleView
|
2015-01-02 00:00:00 +00:00
|
|
|
|
|
|
|
// List of action icons
|
2017-09-28 23:18:46 +00:00
|
|
|
actions: Phaser.Group
|
|
|
|
action_icons: ActionIcon[]
|
2015-01-02 00:00:00 +00:00
|
|
|
|
2017-09-28 23:18:46 +00:00
|
|
|
// Power indicator
|
|
|
|
power: Phaser.Group
|
|
|
|
power_icons: Phaser.Group
|
2015-01-18 00:00:00 +00:00
|
|
|
|
2017-02-12 18:54:09 +00:00
|
|
|
// Indicator of interaction disabled
|
2017-09-28 23:18:46 +00:00
|
|
|
icon_waiting: Phaser.Image
|
2017-02-12 18:54:09 +00:00
|
|
|
|
2015-01-22 00:00:00 +00:00
|
|
|
// Current ship, whose actions are displayed
|
2017-09-28 23:18:46 +00:00
|
|
|
ship: Ship | null
|
2015-01-22 00:00:00 +00:00
|
|
|
|
2017-02-12 18:54:09 +00:00
|
|
|
// Interactivity
|
2017-07-20 15:49:47 +00:00
|
|
|
interactive = true;
|
2017-02-12 18:54:09 +00:00
|
|
|
|
2015-01-02 00:00:00 +00:00
|
|
|
// Create an empty action bar
|
|
|
|
constructor(battleview: BattleView) {
|
2016-10-26 21:15:04 +00:00
|
|
|
super(battleview.game);
|
2017-01-08 22:04:07 +00:00
|
|
|
|
2015-01-02 00:00:00 +00:00
|
|
|
this.battleview = battleview;
|
2017-02-19 21:33:07 +00:00
|
|
|
this.action_icons = [];
|
2015-01-22 00:00:00 +00:00
|
|
|
this.ship = null;
|
2015-01-02 00:00:00 +00:00
|
|
|
|
2017-03-15 21:40:19 +00:00
|
|
|
battleview.layer_borders.add(this);
|
2015-01-02 00:00:00 +00:00
|
|
|
|
2015-02-22 00:00:00 +00:00
|
|
|
// Background
|
2017-06-08 17:32:57 +00:00
|
|
|
this.add(new Phaser.Image(this.game, 0, 0, "battle-actionbar-background", 0));
|
2015-02-22 00:00:00 +00:00
|
|
|
|
2017-09-28 23:18:46 +00:00
|
|
|
// Group for actions
|
|
|
|
this.actions = this.game.add.group(this, "actions");
|
|
|
|
this.actions.position.set(86, 6);
|
|
|
|
this.actions.add(new Phaser.Image(this.game, 0, 0, "battle-actionbar-actions-background"));
|
|
|
|
|
2017-02-19 21:33:07 +00:00
|
|
|
// Power bar
|
2017-09-28 23:18:46 +00:00
|
|
|
this.power = this.game.add.group(this, "power");
|
|
|
|
this.power.position.set(1468, 0);
|
|
|
|
this.power.add(battleview.newImage("battle-actionbar-power-background", 0, 6));
|
|
|
|
this.power_icons = this.game.add.group(this.power, "power icons");
|
|
|
|
this.power_icons.position.set(50, 14);
|
2015-02-28 00:00:00 +00:00
|
|
|
|
2017-09-28 23:18:46 +00:00
|
|
|
// Playing ship
|
|
|
|
this.add(battleview.newImage("battle-actionbar-ship", 1730, -2));
|
2017-02-12 18:54:09 +00:00
|
|
|
|
|
|
|
// Waiting icon
|
2017-09-10 21:43:27 +00:00
|
|
|
this.icon_waiting = new Phaser.Image(this.game, this.width / 2, this.height / 2, "common-waiting", 0);
|
2017-02-12 18:54:09 +00:00
|
|
|
this.icon_waiting.anchor.set(0.5, 0.5);
|
2017-09-10 21:43:27 +00:00
|
|
|
this.icon_waiting.animations.add("loop").play(9, true);
|
2017-06-08 17:32:57 +00:00
|
|
|
this.add(this.icon_waiting);
|
|
|
|
|
|
|
|
// Options button
|
2017-09-28 23:18:46 +00:00
|
|
|
let button = battleview.add.button(0, 0, "battle-actionbar-button-menu", () => battleview.showOptions(), null, 1, 0, 0, 1, this);
|
2017-06-08 17:32:57 +00:00
|
|
|
battleview.tooltip.bindStaticText(button, "Game options");
|
2017-02-12 18:54:09 +00:00
|
|
|
|
2017-02-19 21:33:07 +00:00
|
|
|
// Log processing
|
|
|
|
battleview.log_processor.register(event => {
|
2017-11-14 21:07:29 +00:00
|
|
|
if (!(event instanceof BaseBattleShipDiff) || !this.ship || !this.ship.is(event.ship_id)) {
|
|
|
|
return 0;
|
|
|
|
}
|
|
|
|
|
2017-11-14 00:07:06 +00:00
|
|
|
if (event instanceof ShipValueDiff) {
|
2017-11-14 21:07:29 +00:00
|
|
|
if (event.code == "power") {
|
|
|
|
this.updatePower();
|
|
|
|
this.action_icons.forEach(action => action.refresh());
|
2017-11-14 00:07:06 +00:00
|
|
|
}
|
|
|
|
} else if (event instanceof ShipAttributeDiff) {
|
2017-11-14 21:07:29 +00:00
|
|
|
if (event.code == "power_capacity") {
|
|
|
|
this.updatePower();
|
|
|
|
}
|
|
|
|
} else if (event instanceof ShipActionUsedDiff) {
|
|
|
|
this.action_icons.forEach(action => action.refresh());
|
|
|
|
} else if (event instanceof ShipActionToggleDiff) {
|
|
|
|
let action_icon = first(this.action_icons, icon => icon.action.is(event.action));
|
|
|
|
if (action_icon) {
|
|
|
|
action_icon.refresh();
|
2017-02-19 21:33:07 +00:00
|
|
|
}
|
2017-11-14 21:07:29 +00:00
|
|
|
} else if (event instanceof ShipCooldownDiff) {
|
|
|
|
let icons = this.action_icons.filter(icon => icon.action.equipment && icon.action.equipment.is(event.equipment));
|
|
|
|
icons.forEach(icon => icon.refresh());
|
2017-02-19 21:33:07 +00:00
|
|
|
}
|
2017-05-22 18:06:33 +00:00
|
|
|
return 0;
|
2017-02-19 21:33:07 +00:00
|
|
|
});
|
2017-07-20 15:49:47 +00:00
|
|
|
|
2017-11-14 00:07:06 +00:00
|
|
|
battleview.log_processor.watchForShipChange(ship => {
|
|
|
|
this.setShip(ship);
|
|
|
|
return 0;
|
|
|
|
});
|
2017-07-20 15:49:47 +00:00
|
|
|
this.setInteractive(false);
|
2017-02-12 18:54:09 +00:00
|
|
|
}
|
|
|
|
|
2017-05-30 22:40:28 +00:00
|
|
|
/**
|
|
|
|
* Check if an action is selected
|
|
|
|
*/
|
|
|
|
hasActionSelected(): boolean {
|
|
|
|
return any(this.action_icons, icon => icon.selected);
|
|
|
|
}
|
|
|
|
|
2017-02-12 18:54:09 +00:00
|
|
|
/**
|
|
|
|
* Set the interactivity state
|
|
|
|
*/
|
|
|
|
setInteractive(interactive: boolean) {
|
2017-06-13 15:39:56 +00:00
|
|
|
if (this.interactive != interactive) {
|
|
|
|
this.interactive = interactive;
|
2017-02-12 18:54:09 +00:00
|
|
|
|
2017-06-13 15:39:56 +00:00
|
|
|
this.battleview.animations.setVisible(this.icon_waiting, !this.interactive, 100);
|
2017-10-01 16:33:48 +00:00
|
|
|
this.battleview.animations.setVisible(this.power, interactive, 100, 1, 0.3);
|
|
|
|
this.battleview.animations.setVisible(this.actions, interactive, 100, 1, 0.3);
|
2017-06-13 15:39:56 +00:00
|
|
|
}
|
2017-02-12 18:54:09 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Called when an action shortcut key is pressed
|
|
|
|
*/
|
|
|
|
keyActionPressed(position: number) {
|
|
|
|
if (this.interactive) {
|
|
|
|
if (position < 0) {
|
2017-02-19 21:33:07 +00:00
|
|
|
this.action_icons[this.action_icons.length - 1].processClick();
|
2017-03-15 00:24:26 +00:00
|
|
|
} else if (position < this.action_icons.length - 1) {
|
2017-02-19 21:33:07 +00:00
|
|
|
this.action_icons[position].processClick();
|
2017-02-12 18:54:09 +00:00
|
|
|
}
|
|
|
|
}
|
2015-01-02 00:00:00 +00:00
|
|
|
}
|
|
|
|
|
2017-09-28 23:18:46 +00:00
|
|
|
/**
|
|
|
|
* Remove all the action icons
|
|
|
|
*/
|
2015-01-02 00:00:00 +00:00
|
|
|
clearAll(): void {
|
2017-09-28 23:18:46 +00:00
|
|
|
this.action_icons.forEach(action => action.destroy());
|
2017-02-19 21:33:07 +00:00
|
|
|
this.action_icons = [];
|
2015-01-02 00:00:00 +00:00
|
|
|
}
|
|
|
|
|
2017-09-28 23:18:46 +00:00
|
|
|
/**
|
|
|
|
* Add an action icon
|
|
|
|
*/
|
2017-02-09 00:00:35 +00:00
|
|
|
addAction(ship: Ship, action: BaseAction): ActionIcon {
|
2017-09-28 23:18:46 +00:00
|
|
|
var icon = new ActionIcon(this, ship, action, this.action_icons.length);
|
|
|
|
icon.moveTo(this.actions, 74 + this.action_icons.length * 138, 58);
|
2017-02-19 21:33:07 +00:00
|
|
|
this.action_icons.push(icon);
|
2015-03-03 00:00:00 +00:00
|
|
|
|
2015-01-02 00:00:00 +00:00
|
|
|
return icon;
|
|
|
|
}
|
|
|
|
|
2017-02-19 21:33:07 +00:00
|
|
|
/**
|
|
|
|
* Update the power indicator
|
|
|
|
*/
|
2017-06-21 23:32:18 +00:00
|
|
|
updatePower(move_power = 0, fire_power = 0): void {
|
2017-11-14 00:07:06 +00:00
|
|
|
let power_capacity = this.ship ? this.ship.getAttribute("power_capacity") : 0;
|
|
|
|
let power_value = this.ship ? this.ship.getValue("power") : 0;
|
|
|
|
|
2017-09-28 23:18:46 +00:00
|
|
|
let current_power = this.power_icons.children.length;
|
2017-02-19 21:33:07 +00:00
|
|
|
|
|
|
|
if (current_power > power_capacity) {
|
2017-10-01 18:16:41 +00:00
|
|
|
destroyChildren(this.power_icons, power_capacity, current_power);
|
2017-02-19 21:33:07 +00:00
|
|
|
} else if (power_capacity > current_power) {
|
2017-08-24 18:26:07 +00:00
|
|
|
range(power_capacity - current_power).forEach(i => {
|
|
|
|
let x = (current_power + i) % 5;
|
|
|
|
let y = ((current_power + i) - x) / 5;
|
|
|
|
let image = this.battleview.newImage("battle-actionbar-power-used", x * 43, y * 22);
|
2017-09-28 23:18:46 +00:00
|
|
|
this.power_icons.add(image);
|
2017-08-24 18:26:07 +00:00
|
|
|
});
|
2015-01-22 00:00:00 +00:00
|
|
|
}
|
2017-02-19 21:33:07 +00:00
|
|
|
|
2017-06-21 23:32:18 +00:00
|
|
|
let remaining_power = power_value - move_power - fire_power;
|
2017-09-28 23:18:46 +00:00
|
|
|
this.power_icons.children.forEach((obj, idx) => {
|
2017-02-19 21:33:07 +00:00
|
|
|
let img = <Phaser.Image>obj;
|
|
|
|
if (idx < remaining_power) {
|
2017-08-24 18:26:07 +00:00
|
|
|
this.battleview.changeImage(img, "battle-actionbar-power-available");
|
2017-06-21 23:32:18 +00:00
|
|
|
} else if (idx < remaining_power + move_power) {
|
2017-08-24 18:26:07 +00:00
|
|
|
this.battleview.changeImage(img, "battle-actionbar-power-move");
|
2017-06-21 23:32:18 +00:00
|
|
|
} else if (idx < power_value) {
|
2017-08-24 18:26:07 +00:00
|
|
|
this.battleview.changeImage(img, "battle-actionbar-power-fire");
|
2017-02-19 21:33:07 +00:00
|
|
|
} else {
|
2017-08-24 18:26:07 +00:00
|
|
|
this.battleview.changeImage(img, "battle-actionbar-power-used");
|
2017-02-19 21:33:07 +00:00
|
|
|
}
|
|
|
|
});
|
2015-01-22 00:00:00 +00:00
|
|
|
}
|
|
|
|
|
2017-02-19 21:33:07 +00:00
|
|
|
/**
|
2017-06-21 23:32:18 +00:00
|
|
|
* Temporarily set current action power usage.
|
2017-02-19 21:33:07 +00:00
|
|
|
*
|
|
|
|
* When an action is selected, this will fade the icons not available after the action would be done.
|
|
|
|
* This will also highlight power usage in the power bar.
|
|
|
|
*
|
2017-06-21 23:32:18 +00:00
|
|
|
* *move_power* and *fire_power* is the consumption of currently selected action/target.
|
2017-02-19 21:33:07 +00:00
|
|
|
*/
|
2017-06-21 23:32:18 +00:00
|
|
|
updateSelectedActionPower(move_power: number, fire_power: number, action: BaseAction): void {
|
2017-09-28 23:18:46 +00:00
|
|
|
this.action_icons.forEach(icon => icon.refresh(action, move_power + fire_power));
|
2017-06-21 23:32:18 +00:00
|
|
|
this.updatePower(move_power, fire_power);
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Temporarily set power status for a given move-fire simulation
|
|
|
|
*/
|
|
|
|
updateFromSimulation(action: BaseAction, simulation: MoveFireResult) {
|
|
|
|
if (simulation.complete) {
|
|
|
|
this.updateSelectedActionPower(simulation.total_move_ap, simulation.total_fire_ap, action);
|
|
|
|
} else {
|
|
|
|
this.updateSelectedActionPower(0, 0, action);
|
|
|
|
}
|
2015-02-26 00:00:00 +00:00
|
|
|
}
|
|
|
|
|
2017-02-19 21:33:07 +00:00
|
|
|
/**
|
|
|
|
* Set the bar to display a given ship
|
|
|
|
*/
|
2017-11-14 00:07:06 +00:00
|
|
|
setShip(ship: Ship | null): void {
|
2015-01-02 00:00:00 +00:00
|
|
|
this.clearAll();
|
|
|
|
|
2017-11-14 00:07:06 +00:00
|
|
|
if (ship && ship.getPlayer().is(this.battleview.player) && ship.alive) {
|
2015-02-16 00:00:00 +00:00
|
|
|
var actions = ship.getAvailableActions();
|
2017-02-09 00:00:35 +00:00
|
|
|
actions.forEach((action: BaseAction) => {
|
2017-01-19 16:47:55 +00:00
|
|
|
this.addAction(ship, action);
|
2015-02-16 00:00:00 +00:00
|
|
|
});
|
2015-01-22 00:00:00 +00:00
|
|
|
|
2015-02-16 00:00:00 +00:00
|
|
|
this.ship = ship;
|
|
|
|
} else {
|
|
|
|
this.ship = null;
|
|
|
|
}
|
2015-01-22 00:00:00 +00:00
|
|
|
|
2017-02-19 21:33:07 +00:00
|
|
|
this.updatePower();
|
|
|
|
this.setInteractive(this.ship != null);
|
2015-01-22 00:00:00 +00:00
|
|
|
}
|
|
|
|
|
2015-02-28 00:00:00 +00:00
|
|
|
// Called by an action icon when the action is selected
|
|
|
|
actionStarted(): void {
|
|
|
|
}
|
|
|
|
|
2015-01-22 00:00:00 +00:00
|
|
|
// Called by an action icon when the action has been applied
|
|
|
|
actionEnded(): void {
|
2015-02-04 00:00:00 +00:00
|
|
|
this.battleview.exitTargettingMode();
|
2017-09-28 23:18:46 +00:00
|
|
|
|
|
|
|
this.updatePower();
|
|
|
|
this.action_icons.forEach(action => action.refresh());
|
2015-01-02 00:00:00 +00:00
|
|
|
}
|
|
|
|
}
|
2015-01-07 00:00:00 +00:00
|
|
|
}
|