From 872ac1215938e164025b03f447cb2525e652a371 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micha=C3=ABl=20Lemaire?= Date: Wed, 14 Jan 2015 01:00:00 +0100 Subject: [PATCH] Added a ShipList to hold ship icons in battle view --- src/scripts/game/Equipment.ts | 3 -- src/scripts/view/Preload.ts | 1 + src/scripts/view/battle/BattleView.ts | 10 ++--- src/scripts/view/battle/ShipList.ts | 58 +++++++++++++++++++++++++ src/scripts/view/battle/ShipListItem.ts | 9 ++-- 5 files changed, 67 insertions(+), 14 deletions(-) create mode 100644 src/scripts/view/battle/ShipList.ts diff --git a/src/scripts/game/Equipment.ts b/src/scripts/game/Equipment.ts index e292710..ad63766 100644 --- a/src/scripts/game/Equipment.ts +++ b/src/scripts/game/Equipment.ts @@ -23,8 +23,5 @@ module SpaceTac.Game { // Level requirement min_level: number; - - constructor() { - } } } diff --git a/src/scripts/view/Preload.ts b/src/scripts/view/Preload.ts index ddc2acf..38cf16d 100644 --- a/src/scripts/view/Preload.ts +++ b/src/scripts/view/Preload.ts @@ -13,6 +13,7 @@ module SpaceTac.View { this.load.image("ui-shiplist-own", "assets/images/battle/shiplist-own.png"); this.load.image("ui-shiplist-enemy", "assets/images/battle/shiplist-enemy.png"); this.load.image("ui-arena-background", "assets/images/battle/arena-background.png"); + this.load.image("ui-ship-card", "assets/images/battle/ship-card.png"); this.load.image("arena-ship", "assets/images/battle/ship01.png"); this.load.image("ui-bar-standard-background", "assets/images/ui/bars/standard-background.png"); this.load.image("ui-bar-standard-foreground", "assets/images/ui/bars/standard-foreground.png"); diff --git a/src/scripts/view/battle/BattleView.ts b/src/scripts/view/battle/BattleView.ts index f07eed7..b0de922 100644 --- a/src/scripts/view/battle/BattleView.ts +++ b/src/scripts/view/battle/BattleView.ts @@ -25,6 +25,9 @@ module SpaceTac.View { // Card to display hovered ship card_hovered: ShipCard; + // Ship list + ship_list: ShipList; + // Action bar action_bar: ActionBar; @@ -47,7 +50,6 @@ module SpaceTac.View { create() { var battleview = this; var game = this.game; - var player = this.player; game.stage.backgroundColor = 0x000000; @@ -61,14 +63,10 @@ module SpaceTac.View { // Add UI elements this.action_bar = new ActionBar(this); + this.ship_list = new ShipList(this); this.card_playing = new ShipCard(this, 500, 0); this.card_hovered = new ShipCard(this, 500, 300); - // Add ship buttons to UI - this.battle.play_order.forEach(function (ship: Game.Ship, rank: number) { - new ShipListItem(battleview, 0, rank * 50, ship, ship.getPlayer() === player); - }); - // Add a test progress bar var bar = ValueBar.newStandard(game, 300, 300); bar.setValue(50, 100); diff --git a/src/scripts/view/battle/ShipList.ts b/src/scripts/view/battle/ShipList.ts new file mode 100644 index 0000000..2803e81 --- /dev/null +++ b/src/scripts/view/battle/ShipList.ts @@ -0,0 +1,58 @@ +module SpaceTac.View { + "use strict"; + + // Bar with all playing ships, by play order + export class ShipList extends Phaser.Group { + // Link to the parent battleview + battleview: BattleView; + + // List of ship items + ships: ShipListItem[]; + + // Create an empty action bar + constructor(battleview: BattleView) { + this.battleview = battleview; + this.ships = []; + + super(battleview.game, battleview.ui); + battleview.ui.add(this); + + if (battleview.battle) { + this.setShipsFromBattle(battleview.battle); + } + this.update(); + } + + // Update the bar status (and position) + update() { + super.update(); + + this.y = 100; + } + + // Clear the action icons + clearAll(): void { + this.ships.forEach((ship: ShipListItem) => { + ship.destroy(); + }); + this.ships = []; + } + + // Set the ship list from a battle + setShipsFromBattle(battle: Game.Battle): void { + this.clearAll(); + battle.play_order.forEach((ship: Game.Ship) => { + this.addShip(ship); + }, this); + } + + // 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); + this.ships.push(result); + this.add(result); + return result; + } + } +} diff --git a/src/scripts/view/battle/ShipListItem.ts b/src/scripts/view/battle/ShipListItem.ts index a497169..f8fd92d 100644 --- a/src/scripts/view/battle/ShipListItem.ts +++ b/src/scripts/view/battle/ShipListItem.ts @@ -7,18 +7,17 @@ module SpaceTac.View { private ship: Game.Ship; // Create a ship button for the battle ship list - constructor(battleview: BattleView, x: number, y: number, ship: Game.Ship, owned: boolean) { + constructor(list: ShipList, x: number, y: number, ship: Game.Ship, owned: boolean) { this.ship = ship; - super(battleview.game, x, y, owned ? "ui-shiplist-own" : "ui-shiplist-enemy"); - battleview.ui.add(this); + super(list.battleview.game, x, y, owned ? "ui-shiplist-own" : "ui-shiplist-enemy"); this.input.useHandCursor = true; this.onInputOver.add(() => { - battleview.cursorOnShip(ship); + list.battleview.cursorOnShip(ship); }); this.onInputOut.add(() => { - battleview.cursorOffShip(ship); + list.battleview.cursorOffShip(ship); }); } }