arena: Migrated some images to sheets
BIN
out/assets/images/battle/arena/gauges.png
Normal file
After Width: | Height: | Size: 6.7 KiB |
Before Width: | Height: | Size: 410 B |
Before Width: | Height: | Size: 413 B |
BIN
out/assets/images/battle/arena/ship-frames.png
Normal file
After Width: | Height: | Size: 9.8 KiB |
Before Width: | Height: | Size: 2.6 KiB |
Before Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 261 B |
Before Width: | Height: | Size: 266 B |
Before Width: | Height: | Size: 469 B |
Before Width: | Height: | Size: 464 B |
Before Width: | Height: | Size: 340 B |
Before Width: | Height: | Size: 2.6 KiB |
Before Width: | Height: | Size: 1.1 KiB |
BIN
out/assets/images/battle/arena/small-indicators.png
Normal file
After Width: | Height: | Size: 811 B |
Before Width: | Height: | Size: 5.4 KiB |
Before Width: | Height: | Size: 2.7 KiB |
|
@ -36,20 +36,10 @@ module TS.SpaceTac.UI {
|
|||
this.loadSheet("battle/actionbar/button-menu.png", 79, 132);
|
||||
this.loadImage("battle/arena/background.png");
|
||||
this.loadImage("battle/arena/ap-indicator.png");
|
||||
this.loadImage("battle/arena/ship-normal-enemy.png");
|
||||
this.loadImage("battle/arena/ship-normal-own.png");
|
||||
this.loadImage("battle/arena/ship-playing-enemy.png");
|
||||
this.loadImage("battle/arena/ship-playing-own.png");
|
||||
this.loadImage("battle/arena/ship-hull-base.png");
|
||||
this.loadImage("battle/arena/ship-hull-full.png");
|
||||
this.loadImage("battle/arena/ship-shield-base.png");
|
||||
this.loadImage("battle/arena/ship-shield-full.png");
|
||||
this.loadImage("battle/arena/ship-effect-good.png");
|
||||
this.loadImage("battle/arena/ship-effect-bad.png");
|
||||
this.loadImage("battle/arena/ship-power.png");
|
||||
this.loadImage("battle/arena/stasis.png");
|
||||
this.loadImage("battle/arena/target.png");
|
||||
this.loadImage("battle/arena/blast.png");
|
||||
this.loadSheet("battle/arena/gauges.png", 19, 93);
|
||||
this.loadSheet("battle/arena/small-indicators.png", 10, 10);
|
||||
this.loadSheet("battle/arena/ship-frames.png", 70, 70);
|
||||
this.loadImage("battle/shiplist/background.png");
|
||||
this.loadImage("battle/shiplist/item-background.png");
|
||||
this.loadImage("battle/shiplist/damage.png");
|
||||
|
|
|
@ -57,30 +57,28 @@ module TS.SpaceTac.UI {
|
|||
this.add(this.sprite);
|
||||
|
||||
// Add stasis effect
|
||||
this.stasis = new Phaser.Image(this.game, 0, 0, "battle-arena-stasis");
|
||||
this.stasis = new Phaser.Image(this.game, 0, 0, "battle-arena-ship-frames", 2);
|
||||
this.stasis.anchor.set(0.5, 0.5);
|
||||
this.stasis.visible = false;
|
||||
this.add(this.stasis);
|
||||
|
||||
// Add target effect
|
||||
this.target = new Phaser.Image(this.game, 0, 0, "battle-arena-target");
|
||||
this.target = new Phaser.Image(this.game, 0, 0, "battle-arena-ship-frames", 5);
|
||||
this.target.anchor.set(0.5, 0.5);
|
||||
this.target.visible = false;
|
||||
this.add(this.target);
|
||||
|
||||
// Add playing effect
|
||||
this.frame = new Phaser.Image(this.game, 0, 0, `battle-arena-ship-normal-${this.enemy ? "enemy" : "own"}`, 0);
|
||||
this.frame = new Phaser.Image(this.game, 0, 0, "battle-arena-ship-frames", this.enemy ? 0 : 1);
|
||||
this.frame.anchor.set(0.5, 0.5);
|
||||
this.add(this.frame);
|
||||
|
||||
// HSP display
|
||||
this.hull = new ValueBar(this.game, -59, -47, "battle-arena-ship-hull-base", true);
|
||||
this.hull.setBarImage("battle-arena-ship-hull-full", 3);
|
||||
this.hull = ValueBar.newStyled(this.game, "battle-arena-gauges", -59, -47, true, 0);
|
||||
this.hull.setValue(this.ship.getValue("hull"), this.ship.getAttribute("hull_capacity"));
|
||||
this.toggle_hull = this.battleview.animations.newVisibilityToggle(this.hull, 200, false);
|
||||
this.add(this.hull);
|
||||
this.shield = new ValueBar(this.game, 40, -47, "battle-arena-ship-shield-base", true);
|
||||
this.shield.setBarImage("battle-arena-ship-shield-full", 3);
|
||||
this.shield = ValueBar.newStyled(this.game, "battle-arena-gauges", 40, -47, true, 2);
|
||||
this.shield.setValue(this.ship.getValue("shield"), this.ship.getAttribute("shield_capacity"));
|
||||
this.toggle_shield = this.battleview.animations.newVisibilityToggle(this.shield, 200, false);
|
||||
this.add(this.shield);
|
||||
|
@ -201,7 +199,7 @@ module TS.SpaceTac.UI {
|
|||
// Set the playing state on this ship
|
||||
// This will toggle the "playing" indicator
|
||||
setPlaying(playing: boolean) {
|
||||
this.frame.loadTexture(`battle-arena-ship-${playing ? "playing" : "normal"}-${this.enemy ? "enemy" : "own"}`);
|
||||
this.frame.frame = (playing ? 3 : 0) + (this.enemy ? 0 : 1);
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -282,7 +280,7 @@ module TS.SpaceTac.UI {
|
|||
let positions = UITools.evenlySpace(70, 10, count);
|
||||
|
||||
effects.forEach((effect, index) => {
|
||||
let dot = new Phaser.Image(this.game, positions[index] - 40, -47, `battle-arena-ship-effect-${effect.isBeneficial() ? "good" : "bad"}`);
|
||||
let dot = new Phaser.Image(this.game, positions[index] - 40, -47, "battle-arena-small-indicators", effect.isBeneficial() ? 1 : 0);
|
||||
this.active_effects_display.add(dot);
|
||||
});
|
||||
}
|
||||
|
@ -297,7 +295,7 @@ module TS.SpaceTac.UI {
|
|||
if (power) {
|
||||
let positions = UITools.evenlySpace(70, 10, power);
|
||||
range(power).forEach(index => {
|
||||
let dot = new Phaser.Image(this.game, positions[index] - 40, 40, "battle-arena-ship-power");
|
||||
let dot = new Phaser.Image(this.game, positions[index] - 40, 40, "battle-arena-small-indicators", 2);
|
||||
this.power.add(dot);
|
||||
});
|
||||
}
|
||||
|
|
|
@ -26,7 +26,7 @@ module TS.SpaceTac.UI {
|
|||
|
||||
this.ship = ship;
|
||||
|
||||
this.player_indicator = new Phaser.Image(this.game, 42, 52, owned ? "battle-arena-ship-normal-own" : "battle-arena-ship-normal-enemy");
|
||||
this.player_indicator = new Phaser.Image(this.game, 42, 52, "battle-arena-ship-frames", owned ? 1 : 0);
|
||||
this.player_indicator.anchor.set(0.5, 0.5);
|
||||
this.player_indicator.angle = 90;
|
||||
this.addChild(this.player_indicator);
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
module TS.SpaceTac.UI {
|
||||
// Bar to display a value (like a progress bar)
|
||||
export class ValueBar extends Phaser.Sprite {
|
||||
export class ValueBar extends Phaser.Image {
|
||||
// Vertical orientation
|
||||
vertical: boolean;
|
||||
|
||||
|
@ -14,7 +14,7 @@ module TS.SpaceTac.UI {
|
|||
private proportional: number;
|
||||
|
||||
// Sprite of internal bar (inside the background sprite)
|
||||
private bar_sprite: Phaser.Sprite;
|
||||
private bar_sprite: Phaser.Image;
|
||||
private bar_sprite_rect: Phaser.Rectangle;
|
||||
private bar_sprite_offset: number;
|
||||
|
||||
|
@ -26,16 +26,16 @@ module TS.SpaceTac.UI {
|
|||
}
|
||||
|
||||
// Create a quick styled bar
|
||||
static newStyled(game: Phaser.Game, base_key: string, x: number, y: number, vertical: boolean = false): ValueBar {
|
||||
var result = new ValueBar(game, x, y, base_key + "-empty", vertical);
|
||||
result.setBarImage(base_key + "-full");
|
||||
static newStyled(game: Phaser.Game, base_key: string, x: number, y: number, vertical = false, frame = 0): ValueBar {
|
||||
var result = new ValueBar(game, x, y, base_key, vertical, frame);
|
||||
result.setBarImage(base_key, 0, 0, frame + 1);
|
||||
return result;
|
||||
}
|
||||
|
||||
// Build an value bar sprite
|
||||
// background is the key to the image to use as background
|
||||
constructor(game: Phaser.Game, x: number, y: number, background: string, vertical: boolean = false) {
|
||||
super(game, x, y, background);
|
||||
constructor(game: Phaser.Game, x: number, y: number, background: string, vertical = false, frame = 0) {
|
||||
super(game, x, y, background, frame);
|
||||
|
||||
this.vertical = vertical;
|
||||
|
||||
|
@ -43,8 +43,8 @@ module TS.SpaceTac.UI {
|
|||
}
|
||||
|
||||
// Set an image to use for the bar
|
||||
setBarImage(key: string, offset_x: number = 0, offset_y: number = 0): void {
|
||||
this.bar_sprite = new Phaser.Sprite(this.game, offset_x, offset_y, key);
|
||||
setBarImage(key: string, offset_x = 0, offset_y = 0, frame = 0): void {
|
||||
this.bar_sprite = new Phaser.Image(this.game, offset_x, offset_y, key, frame);
|
||||
this.bar_sprite_rect = new Phaser.Rectangle(0, 0, this.bar_sprite.width, this.bar_sprite.height);
|
||||
this.bar_sprite_offset = this.vertical ? offset_y : offset_x;
|
||||
this.addChild(this.bar_sprite);
|
||||
|
|