little cleanup of the last commit
+ CSS adjustements
This commit is contained in:
@@ -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);
|
||||
}
|
||||
|
||||
|
||||
@@ -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")
|
||||
|
||||
@@ -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;
|
||||
};
|
||||
}
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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 */
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user