137 lines
3.6 KiB
JavaScript
137 lines
3.6 KiB
JavaScript
import {
|
|
Renderer
|
|
} from './render.js';
|
|
import {
|
|
EventHandler
|
|
} from './EventHandler.js';
|
|
import {
|
|
SocketHandler
|
|
} from './socket.js';
|
|
import {
|
|
Game
|
|
} from './Game.js';
|
|
import {
|
|
Card
|
|
} from './Card.js';
|
|
import {
|
|
Player
|
|
} from './Player.js';
|
|
|
|
|
|
const socketHandler = new SocketHandler('ws://localhost:8000');
|
|
socketHandler.onMessage({
|
|
cb: (type, data, e) => {
|
|
console.log(type, data, e);
|
|
|
|
}
|
|
});
|
|
|
|
export function triggerCreateGame() {
|
|
socketHandler.initGame().then(result => {
|
|
createGame(result);
|
|
});
|
|
}
|
|
|
|
export function triggerJoinGame(id) {
|
|
socketHandler.joinGame(id).then(result => {
|
|
createGame(result);
|
|
});
|
|
}
|
|
|
|
function createGame(data) {
|
|
socketHandler.initialized = true;
|
|
socketHandler.gameToken = data.gameID;
|
|
|
|
const game = new Game();
|
|
game.player.id = data.playerID;
|
|
game.activePlayerID = data.activePlayerID;
|
|
game.onCardPlayed = (card) => {
|
|
console.log(card);
|
|
socketHandler.playCard(card);
|
|
};
|
|
game.onCardDrawn = () => {
|
|
socketHandler.drawCard();
|
|
};
|
|
game.onColorSelected = (color) => {
|
|
socketHandler.selectColor(color);
|
|
};
|
|
|
|
if (data.players) {
|
|
data.players.forEach(player => game.playerJoined(new Player(game, player.playerID, player.playerName), player.cardCount));
|
|
}
|
|
|
|
game.init();
|
|
console.log(game);
|
|
|
|
game.player.setHand(data.hand.map(card => new Card(card.Color, card.Value, true)));
|
|
data.playingStack.forEach(card => {
|
|
game.playingStack.cards.unshift(new Card(card.Color, card.Value, true));
|
|
})
|
|
|
|
const canvas = document.getElementById('canvas');
|
|
const renderer = new Renderer(canvas, game);
|
|
renderer.setSize(window.innerWidth, window.innerHeight);
|
|
renderer.draw();
|
|
|
|
window.addEventListener('resize', () => {
|
|
console.log('test');
|
|
renderer.setSize(window.innerWidth, window.innerHeight);
|
|
});
|
|
|
|
const eventHandler = new EventHandler(canvas);
|
|
game.registerEventHandler(eventHandler);
|
|
|
|
socketHandler.onMessage({
|
|
type: 'game.joined',
|
|
cb: (type, data) => {
|
|
game.playerJoined(new Player(game, data.playerID, data.playerName), data.cardCount);
|
|
},
|
|
})
|
|
socketHandler.onMessage({
|
|
type: 'card.played',
|
|
cb: (type, data) => {
|
|
console.log(data);
|
|
|
|
game.playingStack.add(new Card(data.card.Color, data.card.Value, true));
|
|
},
|
|
});
|
|
socketHandler.onMessage({
|
|
type: 'card.color',
|
|
cb: (type, data) => {
|
|
console.log(data);
|
|
|
|
game.playingStack.setTopColor(data.color);
|
|
},
|
|
});
|
|
socketHandler.onMessage({
|
|
type: 'card.drawn',
|
|
cb: (type, data) => {
|
|
const player = game.players.find(p => p.id === data.playerID)
|
|
for (let i = 0; i < data.count; i++) {
|
|
player.addCard(new Card("", "", false));
|
|
}
|
|
},
|
|
});
|
|
socketHandler.onMessage({
|
|
type: 'color.choose',
|
|
cb: (type, data) => {
|
|
game.choosingColor = true;
|
|
},
|
|
});
|
|
socketHandler.onMessage({
|
|
type: 'turn.completed',
|
|
cb: (type, data) => {
|
|
game.choosingColor = false;
|
|
game.activePlayerID = data.activePlayerID;
|
|
game.clockwise = data.directionClockwise;
|
|
},
|
|
});
|
|
socketHandler.onMessage({
|
|
type: 'player.hand',
|
|
cb: (type, data) => {
|
|
console.log(data);
|
|
|
|
game.player.setHand(data.cards.map(card => new Card(card.Color, card.Value, true)));
|
|
},
|
|
})
|
|
} |