Added mouse move capture on arena background (for space targets)
BIN
src/assets/images/battle/arena-background.png
Normal file
After Width: | Height: | Size: 138 B |
Before Width: | Height: | Size: 76 KiB After Width: | Height: | Size: 76 KiB |
Before Width: | Height: | Size: 139 B After Width: | Height: | Size: 139 B |
Before Width: | Height: | Size: 140 B After Width: | Height: | Size: 140 B |
|
@ -8,9 +8,10 @@ module SpaceTac.View {
|
||||||
this.load.setPreloadSprite(this.preloadBar);
|
this.load.setPreloadSprite(this.preloadBar);
|
||||||
|
|
||||||
// Load assets
|
// Load assets
|
||||||
this.load.image("ui-shiplist-own", "assets/images/ui/shiplist-own.png");
|
this.load.image("ui-shiplist-own", "assets/images/battle/shiplist-own.png");
|
||||||
this.load.image("ui-shiplist-enemy", "assets/images/ui/shiplist-enemy.png");
|
this.load.image("ui-shiplist-enemy", "assets/images/battle/shiplist-enemy.png");
|
||||||
this.load.image("arena-ship", "assets/images/arena/ship01.png");
|
this.load.image("ui-arena-background", "assets/images/battle/arena-background.png");
|
||||||
|
this.load.image("arena-ship", "assets/images/battle/ship01.png");
|
||||||
}
|
}
|
||||||
|
|
||||||
create() {
|
create() {
|
||||||
|
|
31
src/scripts/view/battle/Arena.ts
Normal file
|
@ -0,0 +1,31 @@
|
||||||
|
module SpaceTac.View {
|
||||||
|
// Graphical representation of a battle
|
||||||
|
// This is the area in the BattleView that will display ships with their real positions
|
||||||
|
export class Arena extends Phaser.Group {
|
||||||
|
background: Phaser.Image;
|
||||||
|
private input_callback: any;
|
||||||
|
|
||||||
|
constructor(battleview: BattleView) {
|
||||||
|
super(battleview.game);
|
||||||
|
|
||||||
|
var background = new Phaser.Image(battleview.game, 0, 0, 'ui-arena-background');
|
||||||
|
background.scale.set(5, 5);
|
||||||
|
background.inputEnabled = true;
|
||||||
|
this.background = background;
|
||||||
|
|
||||||
|
// Watch mouse move to capture hovering over background
|
||||||
|
this.input_callback = this.game.input.addMoveCallback((pointer) => {
|
||||||
|
var point = new Phaser.Point();
|
||||||
|
if (battleview.game.input.hitTest(background, pointer, point)) {
|
||||||
|
battleview.cursorInSpace(point.x, point.y);
|
||||||
|
}
|
||||||
|
}, null);
|
||||||
|
|
||||||
|
this.add(this.background);
|
||||||
|
}
|
||||||
|
|
||||||
|
destroy() {
|
||||||
|
this.game.input.deleteMoveCallback(this.input_callback);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -12,7 +12,7 @@ module SpaceTac.View {
|
||||||
ui: UIGroup;
|
ui: UIGroup;
|
||||||
|
|
||||||
// Battleground container
|
// Battleground container
|
||||||
arena: Phaser.Group;
|
arena: Arena;
|
||||||
|
|
||||||
// Targetting mode (null if we're not in this mode)
|
// Targetting mode (null if we're not in this mode)
|
||||||
targetting: Targetting;
|
targetting: Targetting;
|
||||||
|
@ -44,13 +44,11 @@ module SpaceTac.View {
|
||||||
var game = this.game;
|
var game = this.game;
|
||||||
var player = this.player;
|
var player = this.player;
|
||||||
|
|
||||||
|
this.arena = new Arena(battleview);
|
||||||
|
game.add.existing(this.arena);
|
||||||
|
|
||||||
this.ui = new UIGroup(game);
|
this.ui = new UIGroup(game);
|
||||||
game.add.existing(this.ui);
|
game.add.existing(this.ui);
|
||||||
var ui = this.ui;
|
|
||||||
|
|
||||||
this.arena = new Phaser.Group(game);
|
|
||||||
game.add.existing(this.arena);
|
|
||||||
var arena = this.arena;
|
|
||||||
|
|
||||||
this.card_playing = new ShipCard(this, 500, 0);
|
this.card_playing = new ShipCard(this, 500, 0);
|
||||||
this.card_hovered = new ShipCard(this, 500, 300);
|
this.card_hovered = new ShipCard(this, 500, 300);
|
||||||
|
@ -113,6 +111,13 @@ module SpaceTac.View {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Method called when cursor moves in space
|
||||||
|
cursorInSpace(x: number, y: number): void {
|
||||||
|
if (!this.ship_hovered) {
|
||||||
|
console.log("In space", x, y);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// Set the currently hovered ship
|
// Set the currently hovered ship
|
||||||
setShipHovered(ship: Game.Ship): void {
|
setShipHovered(ship: Game.Ship): void {
|
||||||
this.ship_hovered = ship;
|
this.ship_hovered = ship;
|
||||||
|
|
|
@ -10,6 +10,7 @@ module SpaceTac.View {
|
||||||
|
|
||||||
battleview.arena.add(this);
|
battleview.arena.add(this);
|
||||||
|
|
||||||
|
this.input.useHandCursor = true;
|
||||||
this.onInputOver.add(() => {
|
this.onInputOver.add(() => {
|
||||||
battleview.cursorOnShip(ship);
|
battleview.cursorOnShip(ship);
|
||||||
});
|
});
|
||||||
|
|
|
@ -11,6 +11,7 @@ module SpaceTac.View {
|
||||||
super(battleview.game, x, y, owned ? 'ui-shiplist-own' : 'ui-shiplist-enemy');
|
super(battleview.game, x, y, owned ? 'ui-shiplist-own' : 'ui-shiplist-enemy');
|
||||||
battleview.ui.add(this);
|
battleview.ui.add(this);
|
||||||
|
|
||||||
|
this.input.useHandCursor = true;
|
||||||
this.onInputOver.add(() => {
|
this.onInputOver.add(() => {
|
||||||
battleview.cursorOnShip(ship);
|
battleview.cursorOnShip(ship);
|
||||||
});
|
});
|
||||||
|
|