little cleanup of the last commit

+ CSS adjustements
This commit is contained in:
LuckyLaszlo
2023-01-18 02:52:52 +01:00
parent d44576513e
commit b66a0f78c3
9 changed files with 64 additions and 28 deletions

View File

@@ -26,8 +26,9 @@ export class GameController {
@UseGuards(TwoFactorGuard)
async getMatchHistory(@Req() req, @Query('username') username: string, @Res() res)
{
console.log("DANS MATCH HISTORY")
console.log("usrrnmae" + username)
if (!username) {
username = req.user.username;
}
return this.gameService.getMatchHistory(username, res);
}

View File

@@ -62,12 +62,9 @@ export class GameService {
.where('history.playerOne.id = :userOne', {userOne : user.id})
.orWhere('history.playerTwo.id = :userTwo', {userTwo: user.id})
.getMany()
console.log("gZZZZZZZZZZZZamehistory")
console.log(...gameHistory)
let sendableHistory : SendableMatchHistory[] = []
for (const history of gameHistory)
{
console.log(history.playerOne.username + 'ssssssssss')
sendableHistory.push(new SendableMatchHistory(history))
}
console.log("sendable history")

View File

@@ -16,6 +16,6 @@ export class SendableMatchHistory {
this.playerOneUsername = matchHistory.playerOne.username;
this.playerTwoUsername = matchHistory.playerTwo.username;
this.playerOneResult = matchHistory.playerOneResult;
this.playerTwoResult = matchHistory.playerTwoResult;
this.playerTwoResult = matchHistory.playerTwoResult;
};
}

View File

@@ -305,11 +305,11 @@
{#if gameState.matchStarted && !gameState.matchEnded}
<div class="div_game">
<button class="pong_button" on:click={leaveMatch}>forfeit</button>
<button class="pong_button margin_top" on:click={leaveMatch}>forfeit</button>
</div>
{:else if !gameState.matchStarted}
<div class="div_game">
<button class="pong_button" on:click={leaveMatch}>leave matchmaking</button>
<button class="pong_button margin_top" on:click={leaveMatch}>leave matchmaking</button>
</div>
{/if}
{/if}
@@ -470,6 +470,11 @@ canvas {
}
.avatar {
height: 5vw;
width: 5vw;
width: 5vw;
margin-top: 2vw;
margin-bottom: -2vw;
}
button.margin_top {
margin-top: 1vw;
}
</style>

View File

@@ -144,7 +144,7 @@
{#if !gameState.matchEnded}
<div class="div_game">
<button class="pong_button" on:click={leaveMatch}>leave</button>
<button class="pong_button margin_top" on:click={leaveMatch}>leave</button>
</div>
{/if}
{/if}
@@ -171,11 +171,12 @@
</fieldset>
{#if matchList.length !== 0}
<menu id="match_list">
<!-- <menu id="match_list"> -->
{#each matchList as match}
<MatchOngoingElem match={match} on:click={(e) => initGameSpectator(match)} />
<br>
{/each}
</menu>
<!-- </menu> -->
{:else}
<p>no match ongoing</p>
{/if}
@@ -263,12 +264,16 @@ canvas {
font-size: 1vw;
padding: 10px;
}
#match_list {
font-family: 'Courier New', Courier, monospace;
font-size: 1vw;
}
/* #match_list {
text-align: center;
} */
.avatar {
height: 5vw;
width: 5vw;
margin-top: 2vw;
margin-bottom: -2vw;
}
button.margin_top {
margin-top: 1vw;
}
</style>

View File

@@ -38,7 +38,13 @@
}
#setting_button {
margin-top: 25px;
margin-top: 1vw;
font-family: "PressStart2P";
background-color: #618174;
border-color: #071013;
color: white;
border-width: 2px;
font-size: 1vw;
}
</style>

View File

@@ -90,18 +90,23 @@
div.outer{
max-width: 960px;
margin: 40px auto;
margin-top: 1vw;
}
/* The main part */
main{
max-width: 960px;
margin: 40px auto;
margin-top: 1vw;
text-align: center;
}
.avatar{
width: 15vw;
height: 15vw;
max-width: 130px;
max-height: 130px;
margin-bottom: 1vw;
}
/* The variable rich section */

View File

@@ -5,9 +5,9 @@
import type { MatchHistory } from "./Match";
export let user;
let matchList = [];
let matchList: MatchHistory[] = [];
onMount( async() => {
console.log(user.username + 'jjjjjjjjjjjjj')
matchList = await fetchMatchList(user.username);
console.log(matchList);
// matchList = await mockMatchList(user.username);
@@ -16,7 +16,6 @@
async function fetchMatchList(username: string)
{
let url = `http://${process.env.WEBSITE_HOST}:${process.env.WEBSITE_PORT}/api/v2/game/match/history?username=${username}`;
console.log(url + 'ffffffff')
return fetch(url)
.then((response) => {
if (!response.ok) {
@@ -96,7 +95,7 @@
<td>{match.playerTwoResult}</td>
{#await fetchAvatar(match.playerTwoUsername) then avatar}
<td>
<img class="avatar" src="{avatar}" alt="avatarOne">
<img class="avatar" src="{avatar}" alt="avatarTwo">
<br>
{match.playerTwoUsername}
</td>

View File

@@ -2,6 +2,7 @@
<script lang="ts">
import { onMount, onDestroy } from "svelte";
import { MatchOngoing, MatchOptions} from "./Match";
import { fetchAvatar } from "./utils.js";
export let match: MatchOngoing;
@@ -25,14 +26,31 @@
</script>
<!-- -->
<li>
<button on:click>
'{match.playerOneUsername}' VS '{match.playerTwoUsername}'
<br/> [{matchOptionsString}]
</button>
</li>
<div>
{#await fetchAvatar(match.playerOneUsername) then avatar}
<img class="avatar" src="{avatar}" alt="avatarOne">
{/await}
<button on:click class="match_elem">
'{match.playerOneUsername}' VS '{match.playerTwoUsername}'
<br/>
[{matchOptionsString}]
</button>
{#await fetchAvatar(match.playerTwoUsername) then avatar}
<img class="avatar" src="{avatar}" alt="avatarTwo">
{/await}
</div>
<!-- -->
<style>
.avatar {
width: 3vw;
height: 3vw;
margin-bottom: -1vw;
}
.match_elem {
margin: 1vw;
}
</style>