diff --git a/TODO b/TODO index b7a8ede..5dfce28 100644 --- a/TODO +++ b/TODO @@ -1,7 +1,9 @@ * Floor movement power usage, and show it on the displayed line * Add auto-move to attack * Re-style cancel button and allow to cancel by clicking the action again -* Add equipment and active effects on ship tooltip +* Fix "thinking" icon in actionbar not rotating +* Add equipment info (or summary) in ship tooltip +* Handle effects overflowing ship tooltip when too numerous * Add effect description on action tooltip * Mobile: display tooltips on hold * Mobile: targetting in two times, using a draggable target indicator diff --git a/graphics/ui/battle.svg b/graphics/ui/battle.svg index be63249..7ee3120 100644 --- a/graphics/ui/battle.svg +++ b/graphics/ui/battle.svg @@ -17,7 +17,7 @@ version="1.1" inkscape:version="0.91 r13725" sodipodi:docname="battle.svg" - inkscape:export-filename="/home/michael/workspace/perso/spacetac/out/assets/images/battle/actionbar.png" + inkscape:export-filename="/tmp/whole.png" inkscape:export-xdpi="90" inkscape:export-ydpi="90"> + inkscape:snap-to-guides="true" + inkscape:object-nodes="false" + inkscape:snap-intersection-paths="false" + inkscape:object-paths="false"> + + + + + + y="379" + inkscape:export-filename="/home/michael/workspace/perso/spacetac/out/assets/images/battle/ship-tooltip-effect.png" + inkscape:export-xdpi="90" + inkscape:export-ydpi="90" /> + y="386" + inkscape:export-filename="/home/michael/workspace/perso/spacetac/out/assets/images/battle/ship-tooltip-effect.png" + inkscape:export-xdpi="90" + inkscape:export-ydpi="90" /> Power recovery -1 (2 turns) + + + Shield +50 (1 turn) { this.processClick(); diff --git a/src/view/battle/EffectDisplay.ts b/src/view/battle/EffectDisplay.ts deleted file mode 100644 index 21b30f5..0000000 --- a/src/view/battle/EffectDisplay.ts +++ /dev/null @@ -1,13 +0,0 @@ -module SpaceTac.View { - // Icon to display an effect currently applied on a ship - export class EffectDisplay extends Phaser.Image { - constructor(game: Phaser.Game, effect: Game.TemporaryEffect) { - var key = "battle-effect-" + effect.getFullCode(); - super(game, 0, 0, key, 0); - - var style = {font: "bold 12px Arial", fill: "#d0d020"}; - var duration = new Phaser.Text(this.game, 0, 0, effect.duration.toString(), style); - this.addChild(duration); - } - } -} diff --git a/src/view/battle/ShipListItem.ts b/src/view/battle/ShipListItem.ts index 0d6d723..25b240a 100644 --- a/src/view/battle/ShipListItem.ts +++ b/src/view/battle/ShipListItem.ts @@ -61,7 +61,6 @@ module SpaceTac.View { this.addChild(this.energy); this.active_effects = new Phaser.Group(this.game); - this.active_effects.position.set(63, 9); this.addChild(this.active_effects); this.updateAttributes(); @@ -78,9 +77,13 @@ module SpaceTac.View { // Update effects applied on the ship updateEffects() { this.active_effects.removeAll(true); - this.ship.temporary_effects.forEach((effect: Game.TemporaryEffect) => { - var icon = new EffectDisplay(this.game, effect); - this.active_effects.addChild(icon); + var count = this.ship.temporary_effects.length; + var spacing = (8 * (count - 1) > 72) ? 72 / (count - 1) : 8; + this.ship.temporary_effects.forEach((effect, index) => { + var x = 46 - (count - 1) * spacing / 2 + index * spacing; + var badge = new Phaser.Image(this.game, x, 85, `battle-shiplist-effect-${effect.isBeneficial() ? "good" : "bad"}`); + badge.anchor.set(0.5, 0.5); + this.active_effects.addChild(badge); }); } diff --git a/src/view/battle/ShipTooltip.ts b/src/view/battle/ShipTooltip.ts index d2d4346..ae3029e 100644 --- a/src/view/battle/ShipTooltip.ts +++ b/src/view/battle/ShipTooltip.ts @@ -12,6 +12,7 @@ module SpaceTac.View { attr_human: Phaser.Text; attr_gravity: Phaser.Text; attr_time: Phaser.Text; + active_effects: Phaser.Group; constructor(parent: BattleView) { super(parent.game, 0, 0, "battle-ship-tooltip-own"); @@ -58,6 +59,9 @@ module SpaceTac.View { this.attr_time.anchor.set(0.5, 0.5); this.addChild(this.attr_time); + this.active_effects = new Phaser.Group(this.game); + this.addChild(this.active_effects); + parent.ui.add(this); } @@ -97,11 +101,31 @@ module SpaceTac.View { this.attr_human.setText(ship.cap_human.current.toString()); this.attr_gravity.setText(ship.cap_gravity.current.toString()); this.attr_time.setText(ship.cap_time.current.toString()); + this.active_effects.removeAll(true); + ship.temporary_effects.forEach((effect, index) => { + this.addEffect(effect, index); + }); Animation.fadeIn(this.game, this, 200, 0.9); } else { Animation.fadeOut(this.game, this, 200); } } + + // Add a temporary effect display + addEffect(effect: Game.TemporaryEffect, index = 0) { + var effect_group = new Phaser.Image(this.game, 27, 243 + 60 * index, "battle-ship-tooltip-effect"); + this.active_effects.addChild(effect_group); + + var effect_icon = new Phaser.Image(this.game, 30, effect_group.height / 2, `battle-effect-${effect.getFullCode()}`); + effect_icon.anchor.set(0.5, 0.5); + effect_group.addChild(effect_icon); + + var text = `${effect.getDescription()} (${effect.duration} turns)`; + var color = effect.isBeneficial() ? "afe9c6" : "#e9afaf"; + var effect_text = new Phaser.Text(this.game, 60, effect_group.height / 2, text, { font: "16pt Arial", fill: color }); + effect_text.anchor.set(0, 0.5); + effect_group.addChild(effect_text); + } } }