valentin/schafkopf-bot
1
0
Fork 0
mirror of https://github.com/Vale54321/schafkopf-bot.git synced 2025-12-16 03:39:34 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Message types and server2 (#46)

Browse Source 
* fixed building issue

* fixed building issue
This commit is contained in:
Valentin Heiserer
2024-04-23 22:09:22 +02:00
committed by GitHub
parent a0a1cfaa4a
commit 2cd8359518
4 changed files with 196 additions and 187 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
.github/workflows/buildAndTest.yml vendored
View File

@@ -12,6 +12,23 @@ jobs:
steps: steps:
- uses: actions/checkout@v4 - uses: actions/checkout@v4
- name: Use Node.js
uses: actions/setup-node@v4
with:
node-version: '20.x'
- name: Install Frontend dependencies
run: npm install
working-directory: Frontend
- name: Create .env file
run: echo "VITE_APP_WEBSOCKET_IP=localhost" > .env
working-directory: Frontend
- name: Build Frontend
run: npm run build
working-directory: Frontend
- name: Set up JDK 21 - name: Set up JDK 21
uses: actions/setup-java@v4 uses: actions/setup-java@v4

10
Frontend/src/pages/DedicatedGame.vue
View File

@@ -29,11 +29,11 @@ function joinGame(): void {
} }
function sendCard(cardInput: Card): void { function sendCard(cardInput: Card): void {
const index = botCards.value.findIndex(card => card === cardInput); const index = botCards.value!.findIndex(card => card === cardInput);
// If card exists in the array, remove it // If card exists in the array, remove it
if (index !== -1) { if (index !== -1) {
botCards.value.splice(index, 1); botCards.value!.splice(index, 1);
} }
backendConnection.sendMessage(MessageType.PLAYER_CARD, {card: cardInput}); backendConnection.sendMessage(MessageType.PLAYER_CARD, {card: cardInput});
} }
@@ -90,11 +90,11 @@ onMounted(() => {
const messageListener = (message: string) => { const messageListener = (message: string) => {
const message1: BackendMessage = JSON.parse(message); const message1: BackendMessage = JSON.parse(message);
console.log(message1) console.log(message1)
if (message1.message_type === "GAME_STATE") { if (message1.message_type === "GAME_STATE" && "gamestate" in message1.content) {
console.log(message1.content) console.log(message1.content)
showGameState(message1.content) showGameState(message1.content.gamestate)
} }
if (message1.message_type === "ONLINE_PLAYER_HAND") { if (message1.message_type === "ONLINE_PLAYER_HAND" && "cards" in message1.content) {
botCards.value = message1.content.cards; botCards.value = message1.content.cards;
console.log(message1.content.cards) console.log(message1.content.cards)
} }

348
Frontend/src/pages/LocalGame.vue
View File

@@ -1,186 +1,186 @@
<script lang="ts" setup> <script lang="ts" setup>
import {onMounted, ref} from 'vue'; // import {onMounted, ref} from 'vue';
//
import {scg} from 'ioc-service-container'; // import {scg} from 'ioc-service-container';
import CardComp from '../components/CardComponent.vue'; // import CardComp from '../components/CardComponent.vue';
import {BackendMessage, Card, GamePhase, GameState} from "../BackendMessage"; // import {BackendMessage, Card, GamePhase, GameState} from "../BackendMessage";
//
const backendConnection = scg("BackendConnection"); // const backendConnection = scg("BackendConnection");
//
//
const messageFromServer = ref<string[]>([]); // const messageFromServer = ref<string[]>([]);
//
const gameStateText = ref<string>("Schafkopf"); // const gameStateText = ref<string>("Schafkopf");
const gameInfoText = ref<string>(""); // const gameInfoText = ref<string>("");
//
const socket = ref<WebSocket | null>(); // const socket = ref<WebSocket | null>();
const tableCards = ref<Card[]>([]); // const tableCards = ref<Card[]>([]);
const botCards = ref(0); // const botCards = ref(0);
const trickCard = ref<Card>(); // const trickCard = ref<Card>();
//
const showGameSelect = ref(true); // const showGameSelect = ref(true);
//
//
function startSimulation(): void { // function startSimulation(): void {
sendMessageToServer("startsimulation"); // sendMessageToServer("startsimulation");
//
} // }
//
function startDedicated(): void { // function startDedicated(): void {
sendMessageToServer("startdedicated"); // sendMessageToServer("startdedicated");
//
} // }
//
//
function stopSimulation(): void { // function stopSimulation(): void {
sendMessageToServer("stopsimulation"); // sendMessageToServer("stopsimulation");
} // }
//
function showTrumpf(): void { // function showTrumpf(): void {
tableCards.value = []; // tableCards.value = [];
sendMessageToServer("showtrumpf"); // sendMessageToServer("showtrumpf");
} // }
//
function showFarben(): void { // function showFarben(): void {
tableCards.value = []; // tableCards.value = [];
sendMessageToServer("showfarben"); // sendMessageToServer("showfarben");
} // }
//
function setGame(game: string): void { // function setGame(game: string): void {
sendMessageToServer(game); // sendMessageToServer(game);
} // }
//
//
function sendMessageToServer(message: string) { // function sendMessageToServer(message: string) {
if (socket.value) { // if (socket.value) {
socket.value.send(message); // socket.value.send(message);
console.log("Sent message to server:", message); // console.log("Sent message to server:", message);
} // }
} // }
//
function showGameState(gamestate: GameState) { // function showGameState(gamestate: GameState) {
//
//
switch (gamestate.gamePhase) { // switch (gamestate.gamePhase) {
case GamePhase.GAME_START: // case GamePhase.GAME_START:
gameStateText.value = "Spiel startet"; // gameStateText.value = "Spiel startet";
showGameSelect.value = false; // showGameSelect.value = false;
botCards.value = 8; // botCards.value = 8;
break; // break;
case GamePhase.TRICK_START: // case GamePhase.TRICK_START:
gameStateText.value = "Runde startet"; // gameStateText.value = "Runde startet";
tableCards.value = []; // tableCards.value = [];
trickCard.value = undefined // trickCard.value = undefined
gameInfoText.value = ""; // gameInfoText.value = "";
break; // break;
case GamePhase.WAIT_FOR_CARD: // case GamePhase.WAIT_FOR_CARD:
gameStateText.value = "Spieler " + gamestate.currentPlayer + " muss eine Karte legen."; // gameStateText.value = "Spieler " + gamestate.currentPlayer + " muss eine Karte legen.";
break; // break;
case GamePhase.PLAYER_CARD: // case GamePhase.PLAYER_CARD:
gameStateText.value = "Spieler " + gamestate.currentPlayer + " hat eine Karte gespielt."; // gameStateText.value = "Spieler " + gamestate.currentPlayer + " hat eine Karte gespielt.";
if (gamestate.currentPlayer === 0) { // if (gamestate.currentPlayer === 0) {
botCards.value-- // botCards.value--
} // }
if (gamestate.trumpf) { // if (gamestate.trumpf) {
gameInfoText.value = "TRUMPF"; // gameInfoText.value = "TRUMPF";
} else { // } else {
gameInfoText.value = gamestate.color?.toString() ?? "ERROR"; // gameInfoText.value = gamestate.color?.toString() ?? "ERROR";
} // }
tableCards.value.push(gamestate.card!); // tableCards.value.push(gamestate.card!);
//
//
break; // break;
case GamePhase.PLAYER_TRICK: // case GamePhase.PLAYER_TRICK:
gameStateText.value = "Spieler " + gamestate.currentPlayer + " sticht."; // gameStateText.value = "Spieler " + gamestate.currentPlayer + " sticht.";
trickCard.value = gamestate.card // trickCard.value = gamestate.card
break; // break;
case GamePhase.GAME_STOP: // case GamePhase.GAME_STOP:
showGameSelect.value = true; // showGameSelect.value = true;
break; // break;
default: // default:
gameStateText.value = "Fehler"; // gameStateText.value = "Fehler";
//
} // }
//
} // }
//
onMounted(() => { // onMounted(() => {
socket.value = backendConnection.getWebSocket(); // socket.value = backendConnection.getWebSocket();
//
const messageListener = (message: string) => { // const messageListener = (message: string) => {
const message1: BackendMessage = JSON.parse(message); // const message1: BackendMessage = JSON.parse(message);
console.log(message1) // console.log(message1)
if ('gamestate' in message1) { // if ('gamestate' in message1) {
console.log(message1.gamestate) // console.log(message1.gamestate)
showGameState(message1.gamestate) // showGameState(message1.gamestate)
} // }
}; // };
//
backendConnection.addMessageListener(messageListener); // backendConnection.addMessageListener(messageListener);
}); // });
</script> </script>
<template> <template>
<div> <!-- <div>-->
<div v-for="message in messageFromServer" :key="message">{{ message }}</div> <!-- <div v-for="message in messageFromServer" :key="message">{{ message }}</div>-->
<div v-if="showGameSelect"> <!-- <div v-if="showGameSelect">-->
<!-- <div class="flex gap-2 place-content-center">--> <!-- &lt;!&ndash; <div class="flex gap-2 place-content-center">&ndash;&gt;-->
<!-- <button @click="setGame('setgame:sauspiel')">Sauspiel</button>--> <!-- &lt;!&ndash; <button @click="setGame('setgame:sauspiel')">Sauspiel</button>&ndash;&gt;-->
<!-- <button @click="setGame('setgame:herzsolo')">herzsolo</button>--> <!-- &lt;!&ndash; <button @click="setGame('setgame:herzsolo')">herzsolo</button>&ndash;&gt;-->
<!-- <button @click="setGame('setgame:eichelsolo')">eichelsolo</button>--> <!-- &lt;!&ndash; <button @click="setGame('setgame:eichelsolo')">eichelsolo</button>&ndash;&gt;-->
<!-- <button @click="setGame('setgame:blattsolo')">blattsolo</button>--> <!-- &lt;!&ndash; <button @click="setGame('setgame:blattsolo')">blattsolo</button>&ndash;&gt;-->
<!-- <button @click="setGame('setgame:schellsolo')">schellsolo</button>--> <!-- &lt;!&ndash; <button @click="setGame('setgame:schellsolo')">schellsolo</button>&ndash;&gt;-->
<!-- <button @click="setGame('setgame:eichelwenz')">eichelwenz</button>--> <!-- &lt;!&ndash; <button @click="setGame('setgame:eichelwenz')">eichelwenz</button>&ndash;&gt;-->
<!-- <button @click="setGame('setgame:blattwenz')">blattwenz</button>--> <!-- &lt;!&ndash; <button @click="setGame('setgame:blattwenz')">blattwenz</button>&ndash;&gt;-->
<!-- <button @click="setGame('setgame:herzwenz')">herzwenz</button>--> <!-- &lt;!&ndash; <button @click="setGame('setgame:herzwenz')">herzwenz</button>&ndash;&gt;-->
<!-- <button @click="setGame('setgame:schellwenz')">schellwenz</button>--> <!-- &lt;!&ndash; <button @click="setGame('setgame:schellwenz')">schellwenz</button>&ndash;&gt;-->
<!-- <button @click="setGame('setgame:eichelgeier')">eichelgeier</button>--> <!-- &lt;!&ndash; <button @click="setGame('setgame:eichelgeier')">eichelgeier</button>&ndash;&gt;-->
<!-- <button @click="setGame('setgame:blattgeier')">blattgeier</button>--> <!-- &lt;!&ndash; <button @click="setGame('setgame:blattgeier')">blattgeier</button>&ndash;&gt;-->
<!-- <button @click="setGame('setgame:herzgeier')">herzgeier</button>--> <!-- &lt;!&ndash; <button @click="setGame('setgame:herzgeier')">herzgeier</button>&ndash;&gt;-->
<!-- <button @click="setGame('setgame:schellgeier')">schellgeier</button>--> <!-- &lt;!&ndash; <button @click="setGame('setgame:schellgeier')">schellgeier</button>&ndash;&gt;-->
<!-- <button @click="setGame('setgame:geier')">Geier</button>--> <!-- &lt;!&ndash; <button @click="setGame('setgame:geier')">Geier</button>&ndash;&gt;-->
<!-- <button @click="setGame('setgame:wenz')">Wenz</button>--> <!-- &lt;!&ndash; <button @click="setGame('setgame:wenz')">Wenz</button>&ndash;&gt;-->
<!-- </div>--> <!-- &lt;!&ndash; </div>&ndash;&gt;-->
<!-- <div class="flex gap-2 place-content-center">--> <!-- &lt;!&ndash; <div class="flex gap-2 place-content-center">&ndash;&gt;-->
<!-- <button @click="showFarben">Zeige alle Farben</button>--> <!-- &lt;!&ndash; <button @click="showFarben">Zeige alle Farben</button>&ndash;&gt;-->
<!-- <button @click="showTrumpf">Zeige alle Trumpfkarten</button>--> <!-- &lt;!&ndash; <button @click="showTrumpf">Zeige alle Trumpfkarten</button>&ndash;&gt;-->
<!-- </div>--> <!-- &lt;!&ndash; </div>&ndash;&gt;-->
<div class="flex gap-2 place-content-center"> <!-- <div class="flex gap-2 place-content-center">-->
<button class="v-button" @click="startSimulation">Starten</button> <!-- <button class="v-button" @click="startSimulation">Starten</button>-->
<button class="v-button" @click="stopSimulation">Stoppen</button> <!-- <button class="v-button" @click="stopSimulation">Stoppen</button>-->
</div> <!-- </div>-->
</div> <!-- </div>-->
<div v-else> <!-- <div v-else>-->
<div class="flex gap-2 place-content-center"> <!-- <div class="flex gap-2 place-content-center">-->
<button class="v-button" @click="stopSimulation">Stoppen</button> <!-- <button class="v-button" @click="stopSimulation">Stoppen</button>-->
</div> <!-- </div>-->
<h1 class=" top-52 text-white font-bold text-6xl absolute text-center w-full">{{ gameInfoText }}</h1> <!-- <h1 class=" top-52 text-white font-bold text-6xl absolute text-center w-full">{{ gameInfoText }}</h1>-->
<h1 class=" top-64 text-white font-bold text-6xl absolute text-center w-full">{{ gameStateText }}</h1> <!-- <h1 class=" top-64 text-white font-bold text-6xl absolute text-center w-full">{{ gameStateText }}</h1>-->
<div v-if="tableCards.length > 0"> <!-- <div v-if="tableCards.length > 0">-->
<!-- <div class="grid grid-cols-4 place-content-center">--> <!-- &lt;!&ndash; <div class="grid grid-cols-4 place-content-center">&ndash;&gt;-->
<!-- <CardComp v-for="card in tableCards" :card="card" class="md" />--> <!-- &lt;!&ndash; <CardComp v-for="card in tableCards" :card="card" class="md" />&ndash;&gt;-->
<!-- </div>--> <!-- &lt;!&ndash; </div>&ndash;&gt;-->
<CardComp v-if="tableCards.length > 0" :card="tableCards[0]" class="absolute card1 md"/> <!-- <CardComp v-if="tableCards.length > 0" :card="tableCards[0]" class="absolute card1 md"/>-->
<CardComp v-if="tableCards.length > 1" :card="tableCards[1]" class="absolute card2 md"/> <!-- <CardComp v-if="tableCards.length > 1" :card="tableCards[1]" class="absolute card2 md"/>-->
<CardComp v-if="tableCards.length > 2" :card="tableCards[2]" class="absolute card3 md"/> <!-- <CardComp v-if="tableCards.length > 2" :card="tableCards[2]" class="absolute card3 md"/>-->
<CardComp v-if="tableCards.length > 3" :card="tableCards[3]" class="absolute card4 md"/> <!-- <CardComp v-if="tableCards.length > 3" :card="tableCards[3]" class="absolute card4 md"/>-->
</div> <!-- </div>-->
<div class="absolute left-0 top-1/2 transform -translate-y-1/2"> <!-- <div class="absolute left-0 top-1/2 transform -translate-y-1/2">-->
<CardComp v-if="trickCard" :card="trickCard" class="xl"/> <!-- <CardComp v-if="trickCard" :card="trickCard" class="xl"/>-->
</div> <!-- </div>-->
<div class="absolute bottom-0 w-full"> <!-- <div class="absolute bottom-0 w-full">-->
<div class="flex flex-row gap-3 w-fit mx-auto justify-center"> <!-- <div class="flex flex-row gap-3 w-fit mx-auto justify-center">-->
<CardComp v-for="i in botCards" :key="i" :card="Card.BACK" class="sm"/> <!-- <CardComp v-for="i in botCards" :key="i" :card="Card.BACK" class="sm"/>-->
</div> <!-- </div>-->
</div> <!-- </div>-->
</div> <!-- </div>-->
</div> <!-- </div>-->
<router-view/> <!-- <router-view/>-->
</template> </template>
<style lang="scss"> <style lang="scss">
$card-height: 24rem; $card-height: 24rem;

8
Frontend/src/services/BackendConnection.ts
View File

@@ -1,21 +1,13 @@
import {MessageType} from "../BackendMessage.ts"; import {MessageType} from "../BackendMessage.ts";
interface JsonMessage {
origin: string;
message: any; // Adjust 'any' type as per your expected message structure
}
export class BackendConnection { export class BackendConnection {
private readonly webSocket: WebSocket; private readonly webSocket: WebSocket;
private messageListeners: ((message: string) => void)[] = []; private messageListeners: ((message: string) => void)[] = [];
private backendUri: string;
constructor(backendUri: string) { constructor(backendUri: string) {
this.backendUri = backendUri;
this.webSocket = new WebSocket(backendUri); this.webSocket = new WebSocket(backendUri);
// Registering event listener for message reception // Registering event listener for message reception