Implements initial Matchmaking logic with Sockets

src/Game/game/machine/GameMachine.js

@@ -210,7 +210,7 @@ class Board {
     }
 
     isEmpty(position) {
-        return !!this.data[position];
+        return !this.data[position];
     }
 
     save() {

src/Game/game/machine/GameMachine.test.js

@@ -1,7 +1,8 @@
-let GameMachine = require('./GameMachine').GameMachine;
+let GameMachine = require('./GameMachine');
 let Moves = require('./GameMoves');
 let Card = require('./Card');
 
+console.log(GameMachine);
 var mac = new GameMachine();
 
 
@@ -37,4 +38,5 @@ mac.runMove(nnmove);
 mac.state.board.debug();
 mac.runMove(nnnmove);
 mac.state.board.debug();
+console.log(mac.state.board.data);
 

src/Game/game/machine/GameMoves.js

@@ -1,38 +1,46 @@
-class GameMove {	
-	constructor(type, data) {
-		this.type = type;
-		this.data = data;
-	}
-	verify() {}
-	performMove() {}
-};
+class GameMove {    
+    constructor(type, data) {
+        this.type = type;
+        this.data = data;
+    }
+    verify() {}
+    performMove() {}
+}
 GameMove.TYPES = {
-	PLACE: 1,
-	PLACE_AND_REVEAL: 2,
-	SELECT_CARDS: 0
+    PLACE: 1,
+    PLACE_AND_REVEAL: 2,
+    SELECT_CARDS: 0
 };
 
 
 class PlaceMove extends GameMove {
-	constructor(card, position, player) {
-		super(GameMove.TYPES.PLACE, {});
-		this.position = position;
-		this.card = card;
-		this.player = player;
-	}
-	verify(state) {
-		if (state.board.isEmpty(this.position)) {
-			throw Error('Not a valid move, there is already a card there!');
-		}
+    constructor(card, position, player) {
+        super(GameMove.TYPES.PLACE, {});
+        this.position = position;
+        this.card = card;
+        this.player = player;
+    }
+    verify(state) {
+        if (state.board.isEmpty(this.position)) {
+            throw Error('Not a valid move, there is already a card there!');
+        }
+
+        return true;
+    }
 
-		return true;
-	}
+    performMove(board) {
+        if(!board.isEmpty(this.position)) {
+            console.log(this.position);
+            console.log('Board');
+            console.log(board);
+            
 
-	performMove(board) {
-		board.putCard(this.card, this.position, this.player);
-	}
+            throw ('Tried to place a card on occupied holder!');
+        }
+        board.putCard(this.card, this.position, this.player);
+    }
 }
 
 module.exports = {
-	PlaceMove
+    PlaceMove
 };

src/Game/services/GameService.js

@@ -0,0 +1,47 @@
+import Game from '../game/';
+import SocketService from '../services/SocketService';
+
+class GameService {
+    constructor() {
+        this.state = {
+            cards: [],
+            salts: [],
+            setup: {}
+        };
+        this.stack = [];
+
+        this.__enablePersistence = true;
+    }
+
+    init(game) {
+        this.GameMachine = new Game.GameMachine();
+        this.stack = [];
+        this.state.cards = game.mycards.ids;
+        this.state.salts = game.mycards.salts;
+        this.state.setup = game.setup;
+
+        if(this.onInit) this.onInit();
+        SocketService.on('move', this.move);
+    }
+
+    move(data) {
+        // Game Machine perform internal Move
+
+        let {cardid, position, player} = data;
+
+        const card = new Game.Card(cardid);
+        const move = new Game.GameMoves.PlaceMove(card, position, player);
+        try{
+            this.GameMachine.performMove(move);
+        } catch(e) {
+            console.log(e);
+            throw e;
+        }
+        // require UI Update where a card is placed and Board updated
+        if(this.onUpdate) this.onUpdate(1);
+    }
+
+
+}
+
+export default new GameService();

src/Game/services/SocketService.js

@@ -3,12 +3,12 @@ import openSocket from 'socket.io-client';
 class SocketService {
 
     constructor() {
-        
     }
     openSocket(channel) {
         if(this.socket)
             this.socket.disconnect();
         this.socket = openSocket('http://localhost:3555/' + channel);
+        this.on = this.socket.on;
     }
 }
 

src/Game/views/buildings/Board.js

@@ -7,6 +7,7 @@ import CardHolder from '../base/CardHolder';
 // import CollectionHolder from '../base/CollectionHolder';
 import Injector from '../../services/Injector';
 import Text from '../misc/Text';
+import Card from '../base/Card';
 
 class BoardHandler extends GuiableContainer{
     constructor(props) {
@@ -47,8 +48,6 @@ class BoardHandler extends GuiableContainer{
         bg.scale.set(1.75);
         this.addChild(bg);
 
-
-
         this.holders = [];
         this.holders.push(new CardHolder({GameLayer, 'x': -220, 'y': -230, team: 0, id: 4}).scaleTo(BoardScale).onDrop((c) => this.placeCard(0, c)));
         this.holders.push(new CardHolder({GameLayer, 'x': -50, 'y': -230, team: 1, id: 5}).scaleTo(BoardScale).onDrop((c) => this.placeCard(1, c)));
@@ -68,6 +67,22 @@ class BoardHandler extends GuiableContainer{
         this.addChild(this.score);
     }
 
+    sync = (board) => {
+        const owners = board.owners;
+        const data = board.data;
+
+        this.holders.forEach((holder, index) => {
+            if ( data[index] && holder.isEmpty() ) {
+                const card = new Card(data[index]);
+                this.addChild(card);
+                card.attach(holder);
+            }
+            if ( data[index] ) {
+                holder.getCard().setTeam(owners[index]);
+            }
+        })
+    }
+
     updateScore() {
         let score = this.holders.reduce((a,b) => {
             if(!b.isEmpty()){

src/Game/views/buildings/Menu.js

@@ -9,6 +9,7 @@ import Text from '../misc/Text';
 import Button from '../misc/Button';
 
 import SocketService from '../../services/SocketService';
+import GameService from '../../services/GameService';
 
 const BlueURL = '/files/assets/cards/frame_blue.png';
 const BlueImage = PIXI.Texture.fromImage(BlueURL);
@@ -48,6 +49,11 @@ class Menu extends GuiableContainer{
         let play = new Button({  y:-100 , Text: {text: "Play"}});
         play.onClick((e) => {
             SocketService.openSocket('randomFree');
+            SocketService.on('joinGame', (game) => {
+                console.log('Joining Game...');
+                Injector.getByName('Navigator').goToGame();
+                GameService.init(game);
+            });
         });
 
         let collection = new Button({  y:50 , Text: {text: "Collection"}});

src/Game/views/demo/Board.js

@@ -1,33 +1,42 @@
 import * as PIXI from 'pixi.js';
 
-// import Card from '../base/Card';
-// import CardHolder from '../base/CardHolder';
 import BoardHandler from '../buildings/Board';
 import DeckHandler from '../buildings/Deck';
-// import Injector from '../../services/Injector';
+import GameService from '../../services/GameService';
+import UserService from '../../services/UserService';
+import SocketService from '../../services/SocketService';
 
 class BoardDemo extends PIXI.Container{
     constructor(props) {
         super();
 
         let {GameLayer} = props;
-
-
-        // let card = new Card({GameLayer, 'x': 100, 'y': -230, team: 0, id: 4}).scaleTo(0.27);
-        // card.parentLayer = Injector.getByName('MainLayer');
-        // this.addChild(card);
         
         let board = new BoardHandler({GameLayer, 'x': -250, 'y': 0 });
         this.addChild(board);
 
-        // let holder2 = new Card({'x':200,'y':100, 's': 0.7, id: 3});
-        // this.addChild(holder2);
-
         let deck = new DeckHandler({GameLayer, 'x': 380, 'y': 0});
         this.addChild(deck);
 
         this.board = board;
         this.deck = deck;
+
+        this.board.onCardPlaced = (position, card) => {
+            const move = {
+                cardid: card.id,
+                position: position,
+                player: UserService.getUsername()
+            };
+            SocketService.emit('broadcast', move);
+        }
+
+        GameService.onInit = () => {
+            this.deck.sync(GameService.cards);
+        }
+
+        GameService.onUpdate = () => {
+            this.board.sync(GameService.GameMachine.state.board);
+        }
     }
 
     _kill = () => {

src/Game/views/demo/Navigation.js

@@ -8,6 +8,7 @@ import Text from '../misc/Text';
 import Button from '../misc/Button';
 
 import Login from './Login';
+import BoardPlay from './Board';
 import Menu from '../buildings/Menu';
 
 
@@ -37,6 +38,11 @@ class Navigation extends PIXI.Container{
         this.current.update();
     }
 
+    goToGame = () => {
+        this.routes.Board = new BoardPlay(this.props);
+        this.go('Board');
+    }
+
     _kill = () => {
 
     }

src/Game/views/misc/Button.js

@@ -4,6 +4,8 @@ import { getParam } from '../../../helpers/url';
 
 import GuiableContainer from '../../../helpers/Guiable';
 
+
+
 const DefaultImageUrl = '/files/assets/ui/woodenbutton.png';
 const DefaultImage = PIXI.Texture.fromImage(DefaultImageUrl);