From fdeb7a09dc3719ca29652a3280ef682968448497 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micha=C3=ABl=20Lemaire?= Date: Thu, 7 Dec 2017 00:10:43 +0100 Subject: [PATCH] Added hotkey indicator over action icons --- TODO.md | 1 - graphics/exported/battle/actionbar/hotkey.png | Bin 0 -> 987 bytes graphics/ui/battle.svg | 65 ++++++++++++++++-- src/ui/battle/ActionIcon.ts | 57 ++++++++++----- 4 files changed, 99 insertions(+), 24 deletions(-) create mode 100644 graphics/exported/battle/actionbar/hotkey.png diff --git a/TODO.md b/TODO.md index 0bc8ddd..5638502 100644 --- a/TODO.md +++ b/TODO.md @@ -56,7 +56,6 @@ Battle * Add shortcut to perform only the "move" part of a move+fire simulation * Fix delay of shield/hull impact effects (should depend on weapon animation, and ship location) * Add a turn count marker in the ship list -* Resolve the confusion of action icon's power indicator with its keyboard shortcut * BattleChecks should be done proactively when all diffs have been simulated by an action, in addition to reactively after applying Ships models and equipments diff --git a/graphics/exported/battle/actionbar/hotkey.png b/graphics/exported/battle/actionbar/hotkey.png new file mode 100644 index 0000000000000000000000000000000000000000..5900f636ff616117865ef4c1dcbac6a8c7f36d63 GIT binary patch literal 987 zcmV<110?*3P)X1^@s6S>%lC00004b3#c}2nYxW zdAzLO_JJQQIVp7;NnZD(JzB7d?3JAbRU10im0N6nii@gj!1=TAFPLlx;T6 z%)A~nwzivQKa${cocDd7_s9F6dFRjav5&qYaTxytiQsDk<%~eqDggJ%dWGj%l6jX-xQk(rGkTjdyisKZEFu5EEei2QLpSe4(S`{^O$-5Bz zV*C4Hve|8e(b)`ae?K4+dAay#tDKfVSHiGKsDl8Sjvom1J%j96)EcfI2q3pK^}!2a z*z!}}v{St{eQn^0;RY0+QPv`E^s)+w%zzK&xD@c{uhp^dH_yDUgbyE|`~kpox0aW& ze&a@0IHs>3Zm9?e&qY%wp9LtJ<+ePs+oHrqzYfS%r&tu_I32?%YvC662!JKc_|^Nt zv;hQMI(1?R;42{E2EI^runI`HK_DPOQLoKa!>e1BwDq>uYcszEm7xN)ejG|8SzT?5 z$1RnhJ&&NAjjH3Hw^Os_gfcoakRn}M`%l~!3jf>| + + + + + + + + + + 1 + { + builder.text(`${(position + 1) % 10}`, 0, 0, { + size: 12, color: "#d1d1d1", shadow: true, center: true, vcenter: true + }); + }); + } // Bottom indicator - this.img_bottom = this.view.newImage("battle-actionbar-bottom-disabled", 0, 40); + this.img_bottom = builder.image("battle-actionbar-bottom-disabled", 0, 40); this.img_bottom.anchor.set(0.5); - this.container.addChild(this.img_bottom); - this.img_targetting = this.view.newImage("battle-actionbar-bottom-targetting", 0, 12); - this.img_targetting.anchor.set(0.5); - this.img_targetting.visible = false; - this.img_bottom.addChild(this.img_targetting); + builder.in(this.img_bottom, builder => { + this.img_targetting = builder.image("battle-actionbar-bottom-targetting", 0, 12); + this.img_targetting.anchor.set(0.5); + this.img_targetting.visible = false; + }); // Left indicator this.selected = false; - this.img_power = this.view.newImage("battle-actionbar-consumption-disabled", -46); + this.img_power = builder.image("battle-actionbar-consumption-disabled", -46); this.img_power.anchor.set(0.5); this.img_power.visible = false; - this.container.addChild(this.img_power); - this.text_power = new Phaser.Text(bar.game, 0, 4, "", { align: "left", font: "16pt SpaceTac", fill: "#ffdd4b" }); - this.text_power.setShadow(1, 1, "#000000"); - this.text_power.anchor.set(0.5); - this.img_power.addChild(this.text_power); + builder.in(this.img_power, builder => { + this.text_power = builder.text("", -2, 4, { + size: 16, color: "#ffdd4b", shadow: true, center: true, vcenter: true + }); + }); // Right indicator - this.img_sticky = this.view.newImage("battle-actionbar-sticky-untoggled", 46); + this.img_sticky = builder.image("battle-actionbar-sticky-untoggled", 46); this.img_sticky.anchor.set(0.5); this.img_sticky.visible = action instanceof ToggleAction; - this.container.addChild(this.img_sticky); // Events this.view.tooltip.bind(this.container, filler => { @@ -161,6 +173,7 @@ module TK.SpaceTac.UI { let toggled = (this.action instanceof ToggleAction) && this.action.activated; let fading = bool(this.action.checkCannotBeApplied(this.ship, this.ship.getValue("power") - power_consumption)); let cooldown = this.action.cooldown.heat; + let targetting = used !== null; if (this.action == used && this.action.cooldown.willOverheat()) { fading = true; cooldown = this.action.cooldown.cooling; @@ -191,6 +204,11 @@ module TK.SpaceTac.UI { this.img_action.alpha = disabled ? 0.2 : 1; } + // top + if (this.img_top && (targetting != this.targetting || disabled != this.disabled)) { + this.view.animations.setVisible(this.img_top, !targetting, 200, disabled ? 0.2 : 1); + } + // bottom if (disabled != this.disabled || toggled != this.toggled) { if (disabled) { @@ -240,9 +258,9 @@ module TK.SpaceTac.UI { this.view.changeImage(this.img_sticky, "battle-actionbar-sticky-overheat"); } range(Math.min(cooldown - 1, 4)).forEach(i => { - this.img_sticky.addChild(this.view.newImage("battle-actionbar-cooldown-one", -4, 2 - i * 7)); + this.img_sticky.addChild(this.view.newImage("battle-actionbar-cooldown-one", 0, 2 - i * 7)); }); - this.img_sticky.addChild(this.view.newImage("battle-actionbar-cooldown-front", -8, -20)); + this.img_sticky.addChild(this.view.newImage("battle-actionbar-cooldown-front", -4, -20)); this.img_sticky.visible = true; } else { this.img_sticky.visible = false; @@ -251,6 +269,7 @@ module TK.SpaceTac.UI { this.disabled = disabled; this.selected = selected; + this.targetting = targetting; this.fading = fading; this.toggled = toggled; this.cooldown = cooldown;