Removed ship card on right side of screen during battles

Will be replaced later by a tooltip

TODO

@@ -2,4 +2,5 @@
 * Add a victory screen, with looting
 * Add retreat from battle
 * Refactor the tooltip system to use it more
-* Flash ship icons that receive damage
+* Flash ship icons that receive damage
+* Add an indicator for AP consumption in action bar

src/app/game/Battle.ts

@@ -91,8 +91,8 @@ module SpaceTac.Game {
         // Defines the initial ship positions of all engaged fleets
         placeShips(): void {
             this.first_turn = true;
-            this.placeFleetShips(this.fleets[0], 50, 310, 0);
-            this.placeFleetShips(this.fleets[1], 800, 310, Math.PI);
+            this.placeFleetShips(this.fleets[0], 50, 320, 0);
+            this.placeFleetShips(this.fleets[1], 1020, 320, Math.PI);
         }
 
         // Count the number of fleets still alive

src/app/game/specs/Battle.spec.ts

@@ -43,23 +43,23 @@ module SpaceTac.Game {
             battle.placeShips();
 
             expect(ship1.arena_x).toBeCloseTo(50, 0.0001);
-            expect(ship1.arena_y).toBeCloseTo(170, 0.0001);
+            expect(ship1.arena_y).toBeCloseTo(180, 0.0001);
             expect(ship1.arena_angle).toBeCloseTo(0, 0.0001);
 
             expect(ship2.arena_x).toBeCloseTo(50, 0.0001);
-            expect(ship2.arena_y).toBeCloseTo(310, 0.0001);
+            expect(ship2.arena_y).toBeCloseTo(320, 0.0001);
             expect(ship2.arena_angle).toBeCloseTo(0, 0.0001);
 
             expect(ship3.arena_x).toBeCloseTo(50, 0.0001);
-            expect(ship3.arena_y).toBeCloseTo(450, 0.0001);
+            expect(ship3.arena_y).toBeCloseTo(460, 0.0001);
             expect(ship3.arena_angle).toBeCloseTo(0, 0.0001);
 
-            expect(ship4.arena_x).toBeCloseTo(800, 0.0001);
-            expect(ship4.arena_y).toBeCloseTo(380, 0.0001);
+            expect(ship4.arena_x).toBeCloseTo(1020, 0.0001);
+            expect(ship4.arena_y).toBeCloseTo(390, 0.0001);
             expect(ship4.arena_angle).toBeCloseTo(Math.PI, 0.0001);
 
-            expect(ship5.arena_x).toBeCloseTo(800, 0.0001);
-            expect(ship5.arena_y).toBeCloseTo(240, 0.0001);
+            expect(ship5.arena_x).toBeCloseTo(1020, 0.0001);
+            expect(ship5.arena_y).toBeCloseTo(250, 0.0001);
             expect(ship5.arena_angle).toBeCloseTo(Math.PI, 0.0001);
         });
 

src/app/view/Preload.ts

@@ -37,13 +37,6 @@ module SpaceTac.View {
             this.loadImage("battle/actionpointsfull.png");
             this.loadImage("battle/arena/shipspritehover.png");
             this.loadImage("battle/arena/shipspriteplaying.png");
-            this.loadImage("battle/ship-card.png");
-            this.loadImage("battle/shipcard-ap-empty.png");
-            this.loadImage("battle/shipcard-ap-full.png");
-            this.loadImage("battle/shipcard-hull-empty.png");
-            this.loadImage("battle/shipcard-hull-full.png");
-            this.loadImage("battle/shipcard-shield-empty.png");
-            this.loadImage("battle/shipcard-shield-full.png");
             this.loadImage("battle/actions/move.png");
             this.loadImage("battle/actions/endturn.png");
             this.loadImage("battle/actions/fire-gatlinggun.png");

src/app/view/battle/Arena.ts

@@ -34,9 +34,12 @@ module SpaceTac.View {
 
             super(battleview.game);
 
+            var offset_x = 206;
+            var offset_y = 84;
+
             var background = new Phaser.Button(battleview.game, 0, 0, "battle-arena-background");
-            var expected_width = battleview.getWidth() - 416;
-            var expected_height = battleview.getHeight() - 100;
+            var expected_width = battleview.getWidth() - offset_x;
+            var expected_height = battleview.getHeight() - offset_y;
             background.scale.set(expected_width / background.width, expected_height / background.height);
             this.background = background;
 
@@ -53,7 +56,7 @@ module SpaceTac.View {
                 }
             }, null);
 
-            this.position.set(196, 100);
+            this.position.set(offset_x, offset_y);
             this.addChild(this.background);
 
             this.range_hint = new RangeHint(this);

src/app/view/battle/BattleView.ts

@@ -24,12 +24,6 @@ module SpaceTac.View {
         // Targetting mode (null if we're not in this mode)
         targetting: Targetting;
 
-        // Card to display current playing ship
-        card_playing: ShipCard;
-
-        // Card to display hovered ship
-        card_hovered: ShipCard;
-
         // Ship list
         ship_list: ShipList;
 
@@ -50,7 +44,6 @@ module SpaceTac.View {
 
         // Lines used to highlight hovered ship
         private line_hover_left: Phaser.Graphics;
-        private line_hover_right: Phaser.Graphics;
 
         // Init the view, binding it to a specific battle
         init(player: Game.Player, battle: Game.Battle) {
@@ -63,7 +56,6 @@ module SpaceTac.View {
             this.log_processor = null;
             this.background = null;
             this.line_hover_left = null;
-            this.line_hover_right = null;
         }
 
         // Create view graphics
@@ -88,10 +80,8 @@ module SpaceTac.View {
             // Add UI elements
             this.action_bar = new ActionBar(this);
             this.ship_list = new ShipList(this);
-            this.card_playing = new ShipCard(this, 1066, 130);
-            this.card_hovered = new ShipCard(this, 1066, 424);
 
-            this.icon_waiting = new Phaser.Image(this.game, 640, 50, "battle-waiting", 0);
+            this.icon_waiting = new Phaser.Image(this.game, this.getWidth() / 2, 50, "battle-waiting", 0);
             this.icon_waiting.anchor.set(0.5, 0.5);
             this.icon_waiting.scale.set(0.5, 0.5);
             game.add.existing(this.icon_waiting);
@@ -100,9 +90,6 @@ module SpaceTac.View {
             this.line_hover_left = new Phaser.Graphics(this.game, 0, 0);
             this.line_hover_left.visible = false;
             game.add.existing(this.line_hover_left);
-            this.line_hover_right = new Phaser.Graphics(this.game, 0, 0);
-            this.line_hover_right.visible = false;
-            game.add.existing(this.line_hover_right);
 
             // Start processing the battle log
             this.log_processor = new LogProcessor(this);
@@ -139,26 +126,11 @@ module SpaceTac.View {
                 this.arena = null;
             }
 
-            if (this.card_playing) {
-                this.card_playing.destroy();
-                this.card_playing = null;
-            }
-
-            if (this.card_hovered) {
-                this.card_hovered.destroy();
-                this.card_hovered = null;
-            }
-
             if (this.line_hover_left) {
                 this.line_hover_left.destroy();
                 this.line_hover_left = null;
             }
 
-            if (this.line_hover_right) {
-                this.line_hover_right.destroy();
-                this.line_hover_right = null;
-            }
-
             this.battle = null;
 
             super.shutdown();
@@ -215,7 +187,6 @@ module SpaceTac.View {
         // Set the currently hovered ship
         setShipHovered(ship: Game.Ship): void {
             this.ship_hovered = ship;
-            this.card_hovered.setShip(ship === this.card_playing.ship ? null : ship);
             this.arena.setShipHovered(ship);
             this.ship_list.setHovered(ship);
             if (this.targetting) {
@@ -246,24 +217,12 @@ module SpaceTac.View {
                     this.line_hover_left.moveTo(start.x, start.y);
                     this.line_hover_left.lineTo(end.x, end.y);
 
-                    var card = this.ship_hovered === this.battle.playing_ship ? this.card_playing : this.card_hovered;
-                    start = spritehover.toGlobal(new PIXI.Point(spritehover.width / 2, 0));
-                    end = card.toGlobal(new PIXI.Point(0, card.height / 2));
-
-                    this.line_hover_right.clear();
-                    this.line_hover_right.lineStyle(2, 0xC7834A, 0.7);
-                    this.line_hover_right.moveTo(start.x, start.y);
-                    this.line_hover_right.lineTo(end.x, end.y);
-
                     Animation.fadeIn(this.game, this.line_hover_left, 200);
-                    Animation.fadeIn(this.game, this.line_hover_right, 200);
                 } else {
                     Animation.fadeOut(this.game, this.line_hover_left, 200);
-                    Animation.fadeOut(this.game, this.line_hover_right, 200);
                 }
             } else {
                 Animation.fadeOut(this.game, this.line_hover_left, 200);
-                Animation.fadeOut(this.game, this.line_hover_right, 200);
             }
         }
 

src/app/view/battle/LogProcessor.ts

@@ -74,7 +74,6 @@ module SpaceTac.View {
         private processShipChangeEvent(event: Game.ShipChangeEvent): void {
             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);
 
             this.view.setInteractionEnabled(this.battle.canPlay(this.view.player));
@@ -102,12 +101,6 @@ module SpaceTac.View {
             if (item) {
                 item.attributeChanged(event.attribute);
             }
-            if (event.ship === this.view.card_playing.ship) {
-                this.view.card_playing.attributeChanged(event.attribute);
-            }
-            if (event.ship === this.view.card_hovered.ship) {
-                this.view.card_hovered.attributeChanged(event.attribute);
-            }
         }
 
         // A ship died

src/app/view/battle/ShipCard.ts

@@ -1,77 +0,0 @@
-module SpaceTac.View {
-    "use strict";
-
-    // Card to display detailed information about a ship
-    export class ShipCard extends Phaser.Sprite {
-        // Displayed ship
-        ship: Game.Ship;
-
-        // Hull gauge
-        hull: ValueBar;
-
-        // Shield gauge
-        shield: ValueBar;
-
-        // AP gauge
-        ap: ValueBar;
-
-        // Ship portrait
-        portrait: Phaser.Image;
-
-        // Build an empty ship card
-        constructor(battleview: BattleView, x: number, y: number) {
-            super(battleview.game, x, y, "battle-ship-card");
-
-            this.ship = null;
-            this.visible = false;
-
-            this.portrait = null;
-
-            this.hull = ValueBar.newStyled(this.game, "battle-shipcard-hull", 122, 8, true);
-            this.addChild(this.hull);
-
-            this.shield = ValueBar.newStyled(this.game, "battle-shipcard-shield", 156, 8, true);
-            this.addChild(this.shield);
-
-            this.ap = ValueBar.newStyled(this.game, "battle-shipcard-ap", 189, 8, true);
-            this.addChild(this.ap);
-
-            battleview.ui.add(this);
-        }
-
-        // Set the currently displayed ship (null to hide)
-        setShip(ship: Game.Ship) {
-            this.ship = ship;
-            Animation.setVisibility(this.game, this, ship !== null, 200);
-
-            if (this.ship) {
-                this.updateAttributes();
-            }
-
-            if (this.portrait) {
-                this.portrait.destroy();
-            }
-            this.portrait = new Phaser.Image(this.game, 47, 47, "ship-scout-portrait", 0);
-            this.portrait.anchor.set(0.5, 0.5);
-            this.addChild(this.portrait);
-        }
-
-        // Update attributes from associated ship
-        updateAttributes() {
-            this.attributeChanged(this.ship.hull);
-            this.attributeChanged(this.ship.shield);
-            this.attributeChanged(this.ship.ap_current);
-        }
-
-        // Called when an attribute for this ship changed through the battle log
-        attributeChanged(attribute: Game.Attribute): void {
-            if (attribute.code === Game.AttributeCode.Hull) {
-                this.hull.setValue(attribute.current, attribute.maximal);
-            } else if (attribute.code === Game.AttributeCode.Shield) {
-                this.shield.setValue(attribute.current, attribute.maximal);
-            } else if (attribute.code === Game.AttributeCode.AP) {
-                this.ap.setValue(attribute.current, attribute.maximal);
-            }
-        }
-    }
-}