diff --git a/graphics/ui/ui.blend b/graphics/ui/ui.blend index 960d5d8..8317d8a 100644 Binary files a/graphics/ui/ui.blend and b/graphics/ui/ui.blend differ diff --git a/src/assets/images/battle/arena/background.png b/src/assets/images/battle/arena/background.png index 0214c71..7347a64 100644 Binary files a/src/assets/images/battle/arena/background.png and b/src/assets/images/battle/arena/background.png differ diff --git a/src/assets/images/battle/shiplist-base.png b/src/assets/images/battle/shiplist-base.png new file mode 100644 index 0000000..5f07c16 Binary files /dev/null and b/src/assets/images/battle/shiplist-base.png differ diff --git a/src/assets/images/battle/shiplist-enemy.png b/src/assets/images/battle/shiplist-enemy.png index b6e7033..1ee3efa 100644 Binary files a/src/assets/images/battle/shiplist-enemy.png and b/src/assets/images/battle/shiplist-enemy.png differ diff --git a/src/assets/images/battle/shiplist-normal.png b/src/assets/images/battle/shiplist-normal.png new file mode 100644 index 0000000..f872602 Binary files /dev/null and b/src/assets/images/battle/shiplist-normal.png differ diff --git a/src/assets/images/battle/shiplist-own.png b/src/assets/images/battle/shiplist-own.png index 1f04547..573f366 100644 Binary files a/src/assets/images/battle/shiplist-own.png and b/src/assets/images/battle/shiplist-own.png differ diff --git a/src/assets/images/battle/shiplist-playing.png b/src/assets/images/battle/shiplist-playing.png new file mode 100644 index 0000000..5b37d90 Binary files /dev/null and b/src/assets/images/battle/shiplist-playing.png differ diff --git a/src/scripts/game/Battle.ts b/src/scripts/game/Battle.ts index fb21411..ca7ba5f 100644 --- a/src/scripts/game/Battle.ts +++ b/src/scripts/game/Battle.ts @@ -65,8 +65,8 @@ module SpaceTac.Game { // Defines the initial ship positions of all engaged fleets placeShips(): void { this.first_turn = true; - this.placeFleetShips(this.fleets[0], 100, 300, 0); - this.placeFleetShips(this.fleets[1], 950, 300, Math.PI); + this.placeFleetShips(this.fleets[0], 50, 300, 0); + this.placeFleetShips(this.fleets[1], 800, 300, Math.PI); } // End the current ship turn, passing control to the next one in play order diff --git a/src/scripts/game/specs/Battle.spec.ts b/src/scripts/game/specs/Battle.spec.ts index 44f6f8a..c6b65ba 100644 --- a/src/scripts/game/specs/Battle.spec.ts +++ b/src/scripts/game/specs/Battle.spec.ts @@ -42,23 +42,23 @@ module SpaceTac.Game { var battle = new Battle(fleet1, fleet2); battle.placeShips(); - expect(ship1.arena_x).toBeCloseTo(100, 0.0001); + expect(ship1.arena_x).toBeCloseTo(50, 0.0001); expect(ship1.arena_y).toBeCloseTo(150, 0.0001); expect(ship1.arena_angle).toBeCloseTo(0, 0.0001); - expect(ship2.arena_x).toBeCloseTo(100, 0.0001); + expect(ship2.arena_x).toBeCloseTo(50, 0.0001); expect(ship2.arena_y).toBeCloseTo(300, 0.0001); expect(ship2.arena_angle).toBeCloseTo(0, 0.0001); - expect(ship3.arena_x).toBeCloseTo(100, 0.0001); + expect(ship3.arena_x).toBeCloseTo(50, 0.0001); expect(ship3.arena_y).toBeCloseTo(450, 0.0001); expect(ship3.arena_angle).toBeCloseTo(0, 0.0001); - expect(ship4.arena_x).toBeCloseTo(950, 0.0001); + expect(ship4.arena_x).toBeCloseTo(800, 0.0001); expect(ship4.arena_y).toBeCloseTo(375, 0.0001); expect(ship4.arena_angle).toBeCloseTo(Math.PI, 0.0001); - expect(ship5.arena_x).toBeCloseTo(950, 0.0001); + expect(ship5.arena_x).toBeCloseTo(800, 0.0001); expect(ship5.arena_y).toBeCloseTo(225, 0.0001); expect(ship5.arena_angle).toBeCloseTo(Math.PI, 0.0001); }); diff --git a/src/scripts/view/Preload.ts b/src/scripts/view/Preload.ts index 0b4377a..ed5ae40 100644 --- a/src/scripts/view/Preload.ts +++ b/src/scripts/view/Preload.ts @@ -12,6 +12,9 @@ module SpaceTac.View { // Load assets this.load.image("battle-background", "assets/images/battle/background.jpg"); + this.load.image("battle-shiplist-base", "assets/images/battle/shiplist-base.png"); + this.load.image("battle-shiplist-normal", "assets/images/battle/shiplist-normal.png"); + this.load.image("battle-shiplist-playing", "assets/images/battle/shiplist-playing.png"); this.load.image("battle-shiplist-own", "assets/images/battle/shiplist-own.png"); this.load.image("battle-shiplist-enemy", "assets/images/battle/shiplist-enemy.png"); this.load.image("battle-arena-background", "assets/images/battle/arena/background.png"); diff --git a/src/scripts/view/battle/Arena.ts b/src/scripts/view/battle/Arena.ts index ed05a43..1de71f0 100644 --- a/src/scripts/view/battle/Arena.ts +++ b/src/scripts/view/battle/Arena.ts @@ -31,7 +31,7 @@ module SpaceTac.View { super(battleview.game); var background = new Phaser.Button(battleview.game, 0, 0, "battle-arena-background"); - var expected_width = 1280 - 252; + var expected_width = 1280 - 416; var expected_height = 720 - 100; background.scale.set(expected_width / background.width, expected_height / background.height); this.background = background; @@ -49,7 +49,7 @@ module SpaceTac.View { } }, null); - this.position.set(32, 100); + this.position.set(196, 100); this.addChild(this.background); this.init(); diff --git a/src/scripts/view/battle/LogProcessor.ts b/src/scripts/view/battle/LogProcessor.ts index 189398e..9cc9ab3 100644 --- a/src/scripts/view/battle/LogProcessor.ts +++ b/src/scripts/view/battle/LogProcessor.ts @@ -59,6 +59,7 @@ module SpaceTac.View { // Playing ship changed private processShipChangeEvent(event: Game.ShipChangeEvent) { this.view.arena.setShipPlaying(event.target.ship); + this.view.ship_list.setPlaying(event.target.ship); this.view.card_playing.setShip(event.target.ship); this.view.action_bar.setShip(event.target.ship); } diff --git a/src/scripts/view/battle/ShipList.ts b/src/scripts/view/battle/ShipList.ts index 5e365d9..6f423c5 100644 --- a/src/scripts/view/battle/ShipList.ts +++ b/src/scripts/view/battle/ShipList.ts @@ -9,10 +9,14 @@ module SpaceTac.View { // List of ship items ships: ShipListItem[]; + // Playing ship + playing: ShipListItem; + // Create an empty action bar constructor(battleview: BattleView) { this.battleview = battleview; this.ships = []; + this.playing = null; super(battleview.game, battleview.ui); battleview.ui.add(this); @@ -27,7 +31,7 @@ module SpaceTac.View { update() { super.update(); - this.y = 100; + this.y = 76; } // Clear the action icons @@ -49,7 +53,7 @@ module SpaceTac.View { // Add a ship icon addShip(ship: Game.Ship): ShipListItem { var owned = ship.getPlayer() === this.battleview.player; - var result = new ShipListItem(this, 0, this.ships.length * 50, ship, owned); + var result = new ShipListItem(this, 0, this.ships.length * 80, ship, owned); this.ships.push(result); this.add(result); return result; @@ -66,5 +70,16 @@ module SpaceTac.View { }); return found; } + + // Set the currently playing ship + setPlaying(ship: Game.Ship): void { + if (this.playing) { + this.playing.setPlaying(false); + } + this.playing = this.findItem(ship); + if (this.playing) { + this.playing.setPlaying(true); + } + } } } diff --git a/src/scripts/view/battle/ShipListItem.ts b/src/scripts/view/battle/ShipListItem.ts index 7eb5834..f7835ea 100644 --- a/src/scripts/view/battle/ShipListItem.ts +++ b/src/scripts/view/battle/ShipListItem.ts @@ -12,11 +12,20 @@ module SpaceTac.View { // Shield display shield: ValueBar; + // Playing indicator + layer_playing: Phaser.Image; + + // Non-playing indicator + layer_normal: Phaser.Image; + + // Enemy indicator + layer_enemy: Phaser.Image; + // Create a ship button for the battle ship list constructor(list: ShipList, x: number, y: number, ship: Game.Ship, owned: boolean) { this.ship = ship; - super(list.battleview.game, x, y, owned ? "battle-shiplist-own" : "battle-shiplist-enemy"); + super(list.battleview.game, x, y, "battle-shiplist-base"); this.input.useHandCursor = true; this.onInputOver.add(() => { @@ -26,11 +35,21 @@ module SpaceTac.View { list.battleview.cursorOffShip(ship); }); - this.hull = ValueBar.newStandard(list.battleview.game, 40, 0); + this.layer_playing = new Phaser.Image(this.game, 0, 0, "battle-shiplist-playing", 0); + this.layer_playing.alpha = 0; + this.addChild(this.layer_playing); + + this.layer_normal = new Phaser.Image(this.game, 0, 0, "battle-shiplist-normal", 0); + this.addChild(this.layer_normal); + + this.layer_enemy = new Phaser.Image(this.game, 0, 0, owned ? "battle-shiplist-own" : "battle-shiplist-enemy", 0); + this.addChild(this.layer_enemy); + + this.hull = ValueBar.newStandard(list.battleview.game, 85, 28); this.hull.scale.set(0.1, 0.1); this.addChild(this.hull); - this.shield = ValueBar.newStandard(list.battleview.game, 40, 20); + this.shield = ValueBar.newStandard(list.battleview.game, 85, 46); this.shield.scale.set(0.1, 0.1); this.addChild(this.shield); } @@ -43,5 +62,15 @@ module SpaceTac.View { this.shield.setValue(attribute.current, attribute.maximal); } } + + // Set the playing status + setPlaying(playing: boolean) { + var tween1 = this.game.tweens.create(this.layer_playing); + tween1.to({alpha: playing ? 1 : 0}); + tween1.start(); + var tween2 = this.game.tweens.create(this.layer_normal); + tween2.to({alpha: playing ? 0 : 1}); + tween2.start(); + } } }