games/spacetac
games/spacetac
1
0
Fork 0
Code Releases Activity

Added hotkey indicator over action icons

Browse source
This commit is contained in:
Michaël Lemaire 2017-12-07 00:10:43 +01:00
parent 8e3339d6f4
commit fdeb7a09dc
4 changed files with 99 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
TODO.md
View file

@ -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

BIN
graphics/exported/battle/actionbar/hotkey.png Normal file
View file

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 987 B

65
graphics/ui/battle.svg
View file

@ -2323,6 +2323,38 @@
y1="-40.707054"
x2="462.69446"
y2="-40.707054" />
<filter
style="color-interpolation-filters:sRGB"
inkscape:label="Digit shadow"
id="filter10663-67">
<feFlood
flood-opacity="0.709804"
flood-color="rgb(0,0,0)"
result="flood"
id="feFlood10653-5" />
<feComposite
in="flood"
in2="SourceGraphic"
operator="in"
result="composite1"
id="feComposite10655-3" />
<feGaussianBlur
in="composite1"
stdDeviation="0"
result="blur"
id="feGaussianBlur10657-5" />
<feOffset
dx="1"
dy="1"
result="offset"
id="feOffset10659-6" />
<feComposite
in="SourceGraphic"
in2="offset"
operator="over"
result="composite2"
id="feComposite10661-2" />
</filter>
</defs>
<sodipodi:namedview
id="base"
@ -2331,11 +2363,11 @@
borderopacity="1"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:zoom="11.313709"
inkscape:cx="796.46023"
inkscape:cy="-149.64343"
inkscape:zoom="2.0000001"
inkscape:cx="197.39944"
inkscape:cy="173.77059"
inkscape:document-units="px"
inkscape:current-layer="g5614-1"
inkscape:current-layer="g5660"
showgrid="false"
units="px"
showguides="true"
@ -5990,6 +6022,31 @@
id="use5490"
width="100%"
height="100%" />
<g
id="g5660">
<path
inkscape:transform-center-y="4.66115"
inkscape:export-ydpi="96"
inkscape:export-xdpi="96"
inkscape:export-filename="/home/michael/workspace/perso/spacetac/graphics/exported/battle/actionbar/hotkey.png"
sodipodi:nodetypes="cccc"
inkscape:connector-curvature="0"
id="path10152-3"
d="M 187.62339,97.555404 171.47679,75.11135 h 32.2931 z"
inkscape:transform-center-x="-1.8e-06"
style="display:inline;fill:#1d5664;fill-opacity:1;fill-rule:evenodd;stroke:#287583;stroke-width:1.7288481;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;enable-background:new" />
<text
xml:space="preserve"
style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:45px;line-height:23.4375px;font-family:DAGGERSQUARE;-inkscape-font-specification:DAGGERSQUARE;letter-spacing:0px;word-spacing:0px;display:inline;fill:#d1d1d1;fill-opacity:1;stroke:none;stroke-width:0.9375px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;filter:url(#filter10663-67);enable-background:new"
x="185.90334"
y="89.096222"
id="text9927-9"><tspan
sodipodi:role="line"
id="tspan9925-1"
x="185.90334"
y="89.096222"
style="font-size:16px;fill:#d1d1d1;fill-opacity:1;stroke-width:0.9375px">1</tspan></text>
</g>
</g>
</g>
<g

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 321 KiB

After

Width:  |  Height:  |  Size: 323 KiB

57
src/ui/battle/ActionIcon.ts
View file

@ -21,10 +21,12 @@ module TK.SpaceTac.UI {
disabled = true
selected = false
toggled = false
targetting = false
cooldown = 0
// Images
img_targetting: Phaser.Image
img_top: Phaser.Image | null = null
img_bottom: Phaser.Image
img_power: Phaser.Image
img_sticky: Phaser.Image
@ -45,39 +47,49 @@ module TK.SpaceTac.UI {
this.ship = ship;
this.action = action;
let builder = new UIBuilder(this.view, this.container);
// Action icon
let icon = this.view.getFirstImage(`action-${action.code}`, `equipment-${action.equipment ? action.equipment.code : "---"}`);
this.img_action = this.view.newImage(icon);
this.img_action = builder.image([`action-${action.code}`, `equipment-${action.equipment ? action.equipment.code : "---"}`]);
this.img_action.anchor.set(0.5);
this.img_action.scale.set(0.35);
this.img_action.alpha = 0.2;
this.container.addChild(this.img_action);
// Hotkey indicator
if (!(action instanceof EndTurnAction)) {
this.img_top = builder.image("battle-actionbar-hotkey", 0, -47);
this.img_top.anchor.set(0.5);
builder.in(this.img_top, builder => {
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;