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

Added ship tooltip on battle splash

This commit is contained in:
Michaël Lemaire 2018-06-06 23:00:22 +02:00
parent 296a9d6839
commit 513e82b487
9 changed files with 44 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
data/stage1/image/translucent.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 169 B

BIN
data/stage2/image/battle/overlay.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 201 B

25
src/ui/battle/BattleSplash.ts
View File

@ -26,7 +26,9 @@ module TK.SpaceTac.UI {
this.fleet1.ships.forEach((ship, index) => {
let ship_card = builder.image("battle-splash-ship-card", -86 + index * 96, -72, true);
let ship_portrait = builder.in(ship_card).image(`ship-${ship.model.code}-portrait`, 0, 0, true);
let ship_portrait = builder.in(ship_card).button(`ship-${ship.model.code}-portrait`, 0, 0, undefined, filler => ShipTooltip.fillInfo(filler, ship), undefined, {
center: true
});
ship_portrait.setScale(0.3);
});
});
@ -41,7 +43,9 @@ module TK.SpaceTac.UI {
this.fleet2.ships.forEach((ship, index) => {
let ship_card = builder.image("battle-splash-ship-card", -86 + index * 96, -72, true);
let ship_portrait = builder.in(ship_card).image(`ship-${ship.model.code}-portrait`, 0, 0, true);
let ship_portrait = builder.in(ship_card).button(`ship-${ship.model.code}-portrait`, 0, 0, undefined, filler => ShipTooltip.fillInfo(filler, ship), undefined, {
center: true
});
ship_portrait.setAngle(180);
ship_portrait.setScale(0.3);
});
@ -72,10 +76,16 @@ module TK.SpaceTac.UI {
/**
* Create an overlay, returns when it is clicked
*/
overlay(builder: UIBuilder): Promise<UIButton> {
overlay(builder: UIBuilder): Promise<void> {
return new Promise(resolve => {
let overlay = builder.button("battle-overlay", this.view.getMidWidth(), this.view.getMidHeight(), () => resolve(overlay), undefined, undefined, { center: true });
overlay.setScale(this.view.getWidth() / overlay.width, this.view.getHeight() / overlay.height);
let overlay = builder.overlay({
color: 0x000000,
alpha: 0.5,
on_click: () => {
overlay.destroy();
resolve();
}
});
});
}
@ -90,10 +100,7 @@ module TK.SpaceTac.UI {
let components = this.components(builder.in(container), container);
return Promise.all([
overlay.then(overlayobj => {
container.visible = false;
overlayobj.destroy();
}),
overlay.then(() => container.setVisible(false)),
components
]).then(() => {
container.destroy();

22
src/ui/battle/ShipTooltip.ts
View File

@ -23,18 +23,29 @@ module TK.SpaceTac.UI {
builder.configure(10, 6, this.battleview.arena.getBoundaries());
ShipTooltip.fillInfo(builder, ship, this.battleview.battle, this.battleview.player);
let sprite = this.battleview.arena.findShipSprite(ship);
if (sprite) {
this.container.show(UITools.getBounds(sprite.frame_owner));
}
}
static fillInfo(builder: TooltipBuilder, ship: Ship, battle?: Battle, player?: Player): boolean {
let portrait_bg = builder.image("battle-tooltip-ship-portrait", 0, 0);
builder.in(portrait_bg, builder => {
let portrait = builder.image(`ship-${ship.model.code}-portrait`, 1, 1);
portrait.setScale(0.75);
});
let enemy = !this.battleview.player.is(ship.fleet.player);
let enemy = player && !player.is(ship.fleet.player);
builder.text(ship.getName(), 230, 0, { color: enemy ? "#cc0d00" : "#ffffff", size: 22, bold: true });
if (ship.alive) {
let turns = this.battleview.battle.getPlayOrder(ship);
builder.text((turns == 0) ? "Playing" : ((turns == 1) ? "Plays next" : `Plays in ${turns} turns`), 230, 36, { color: "#cccccc", size: 18 });
if (battle) {
let turns = battle.getPlayOrder(ship);
builder.text((turns == 0) ? "Playing" : ((turns == 1) ? "Plays next" : `Plays in ${turns} turns`), 230, 36, { color: "#cccccc", size: 18 });
}
ShipTooltip.addValue(builder, 0, "#eb4e4a", "attribute-hull_capacity", ship.getValue("hull"), ship.getAttribute("hull_capacity"));
ShipTooltip.addValue(builder, 1, "#2ad8dc", "attribute-shield_capacity", ship.getValue("shield"), ship.getAttribute("shield_capacity"));
@ -65,10 +76,7 @@ module TK.SpaceTac.UI {
{ color: "#a899db", size: 20, center: true, vcenter: true });
}
let sprite = this.battleview.arena.findShipSprite(ship);
if (sprite) {
this.container.show(UITools.getBounds(sprite.frame_owner));
}
return true;
}
private static addValue(builder: UIBuilder, idx: number, color: string, icon: string, val: number, max?: number) {

4
src/ui/character/CharacterSheet.ts
View File

@ -70,7 +70,7 @@ module TK.SpaceTac.UI {
this.xhidden = -this.view.getWidth();
this.container.x = this.xhidden;
this.image_portrait = this.builder.image("translucent", 435, 271, true);
this.image_portrait = this.builder.image("common-transparent", 435, 271, true);
this.builder.image("character-entry", 24, 740);
@ -223,7 +223,7 @@ module TK.SpaceTac.UI {
builder.in(builder.container("actions"), builder => {
let actions = ship.model.getActions(1, []);
actions.forEach(action => {
let button = builder.button("translucent", 0, 66, undefined, action.getEffectsDescription());
let button = builder.button("common-transparent", 0, 66, undefined, action.getEffectsDescription());
builder.in(button, builder => {
let icon = builder.image(`action-${action.code}`);

4
src/ui/character/CharacterUpgrade.spec.ts
View File

@ -60,10 +60,10 @@ module TK.SpaceTac.UI.Specs {
check.equals(display.getIcon(), "action-testaction");
upgrade.actions = [];
check.equals(display.getIcon(), "translucent");
check.equals(display.getIcon(), "common-transparent");
upgrade.effects = [new DamageEffect(10)];
check.equals(display.getIcon(), "translucent");
check.equals(display.getIcon(), "common-transparent");
upgrade.effects = [
new DamageEffect(10),

4
src/ui/character/CharacterUpgrade.ts
View File

@ -105,10 +105,10 @@ module TK.SpaceTac.UI {
if (attr && (attr instanceof AttributeEffect || attr instanceof AttributeMultiplyEffect)) {
return `attribute-${attr.attrcode}`;
} else {
return "translucent";
return "common-transparent";
}
} else {
return "translucent";
return "common-transparent";
}
}
}

6
src/ui/common/UIDialog.spec.ts
View File

@ -9,14 +9,14 @@ module TK.SpaceTac.UI.Specs {
let dialog1 = new UIDialog(view, "fake");
check.in("one dialog", check => {
check.equals(view.dialogs_layer.length, 2);
check.equals(view.dialogs_layer.list[0] instanceof UIImage, true);
check.equals(view.dialogs_layer.list[0] instanceof UIOverlay, true);
check.same(view.dialogs_layer.list[1], dialog1.base);
});
let dialog2 = new UIDialog(view, "fake");
check.in("two dialogs", check => {
check.equals(view.dialogs_layer.length, 3);
check.equals(view.dialogs_layer.list[0] instanceof UIImage, true);
check.equals(view.dialogs_layer.list[0] instanceof UIOverlay, true);
check.same(view.dialogs_layer.list[1], dialog1.base);
check.same(view.dialogs_layer.list[2], dialog2.base);
});
@ -25,7 +25,7 @@ module TK.SpaceTac.UI.Specs {
check.in("one dialog closed", check => {
check.equals(view.dialogs_layer.length, 2);
check.equals(view.dialogs_layer.list[0] instanceof UIImage, true);
check.equals(view.dialogs_layer.list[0] instanceof UIOverlay, true);
check.same(view.dialogs_layer.list[1], dialog2.base);
});

7
src/ui/common/UIDialog.ts
View File

@ -36,9 +36,10 @@ module TK.SpaceTac.UI {
* Add an input-capturing overlay
*/
addOverlay(layer: UIContainer): void {
let overlay = new UIBuilder(this.view, layer).image("translucent");
overlay.setInteractive();
overlay.setScale(this.view.getWidth() / overlay.width, this.view.getHeight() / overlay.height);
new UIBuilder(this.view, layer).overlay({
color: 0x888888,
alpha: 0.3
});
}
/**