changements pour l'env (encore) + corrections de quelques bugs dans game_server
This commit is contained in:
16
srcs/requirements/svelte/api_front/package-lock.json
generated
16
srcs/requirements/svelte/api_front/package-lock.json
generated
@@ -8,6 +8,7 @@
|
||||
"name": "svelte-app",
|
||||
"version": "1.0.0",
|
||||
"dependencies": {
|
||||
"dotenv": "^16.0.3",
|
||||
"sirv-cli": "^2.0.0",
|
||||
"socket.io-client": "^4.5.4",
|
||||
"svelte-spa-router": "^3.3.0"
|
||||
@@ -17,6 +18,7 @@
|
||||
"@rollup/plugin-node-resolve": "^11.0.0",
|
||||
"@rollup/plugin-typescript": "^8.0.0",
|
||||
"@tsconfig/svelte": "^2.0.0",
|
||||
"@types/node": "^18.11.18",
|
||||
"rollup": "^2.3.4",
|
||||
"rollup-plugin-css-only": "^3.1.0",
|
||||
"rollup-plugin-livereload": "^2.0.0",
|
||||
@@ -267,9 +269,9 @@
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@types/node": {
|
||||
"version": "18.11.9",
|
||||
"resolved": "https://registry.npmjs.org/@types/node/-/node-18.11.9.tgz",
|
||||
"integrity": "sha512-CRpX21/kGdzjOpFsZSkcrXMGIBWMGNIHXXBVFSH+ggkftxg+XYP20TESbh+zFvFj3EQOl5byk0HTRn1IL6hbqg==",
|
||||
"version": "18.11.18",
|
||||
"resolved": "https://registry.npmjs.org/@types/node/-/node-18.11.18.tgz",
|
||||
"integrity": "sha512-DHQpWGjyQKSHj3ebjFI/wRKcqQcdR+MoFBygntYOZytCqNfkd2ZC4ARDJ2DQqhjH5p85Nnd3jhUJIXrszFX/JA==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@types/pug": {
|
||||
@@ -522,6 +524,14 @@
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/dotenv": {
|
||||
"version": "16.0.3",
|
||||
"resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.0.3.tgz",
|
||||
"integrity": "sha512-7GO6HghkA5fYG9TYnNxi14/7K9f5occMlp3zXAuSxn7CKCxt9xbNWG7yF8hTCSUchlfWSe3uLmlPfigevRItzQ==",
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
}
|
||||
},
|
||||
"node_modules/engine.io-client": {
|
||||
"version": "6.2.3",
|
||||
"resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-6.2.3.tgz",
|
||||
|
||||
@@ -13,6 +13,7 @@
|
||||
"@rollup/plugin-node-resolve": "^11.0.0",
|
||||
"@rollup/plugin-typescript": "^8.0.0",
|
||||
"@tsconfig/svelte": "^2.0.0",
|
||||
"@types/node": "^18.11.18",
|
||||
"rollup": "^2.3.4",
|
||||
"rollup-plugin-css-only": "^3.1.0",
|
||||
"rollup-plugin-livereload": "^2.0.0",
|
||||
@@ -25,6 +26,7 @@
|
||||
"typescript": "^4.0.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"dotenv": "^16.0.3",
|
||||
"sirv-cli": "^2.0.0",
|
||||
"socket.io-client": "^4.5.4",
|
||||
"svelte-spa-router": "^3.3.0"
|
||||
|
||||
@@ -30,6 +30,7 @@ function serve() {
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
export default {
|
||||
input: 'src/main.ts',
|
||||
output: {
|
||||
|
||||
@@ -1,5 +0,0 @@
|
||||
<script context="module">
|
||||
export const Domain = "transcendance";
|
||||
export const Port = "8080";
|
||||
export const PortIo = "8080";
|
||||
</script>
|
||||
3
srcs/requirements/svelte/api_front/src/Constantes.ts
Normal file
3
srcs/requirements/svelte/api_front/src/Constantes.ts
Normal file
@@ -0,0 +1,3 @@
|
||||
export const Domain = "transcendance";
|
||||
export const Port = "8080";
|
||||
export const PortIo = Port;
|
||||
@@ -1,4 +1,7 @@
|
||||
import App from './App.svelte';
|
||||
import dotenv from 'dotenv';
|
||||
|
||||
dotenv.config();
|
||||
const app = new App({
|
||||
target: document.body,
|
||||
props: {
|
||||
@@ -6,4 +9,4 @@ const app = new App({
|
||||
}
|
||||
});
|
||||
export default app;
|
||||
//# sourceMappingURL=main.js.map
|
||||
//# sourceMappingURL=main.js.map
|
||||
|
||||
@@ -7,4 +7,4 @@ const app = new App({
|
||||
}
|
||||
});
|
||||
|
||||
export default app;
|
||||
export default app;
|
||||
|
||||
@@ -3,13 +3,13 @@
|
||||
import { push } from "svelte-spa-router";
|
||||
import { onMount } from 'svelte';
|
||||
import { get } from "svelte/store";
|
||||
import { Domain, Port } from "../Constantes.svelte";
|
||||
import { Domain, Port } from "../Constantes";
|
||||
|
||||
|
||||
let user;
|
||||
|
||||
onMount(async () => {
|
||||
user = await fetch(`http://${Domain}:${Port}/api/v2/user`)
|
||||
user = await fetch(`http://${process.env.WEBSITE_HOST}:${Port}/api/v2/user`)
|
||||
.then((resp) => resp.json())
|
||||
|
||||
// i mean i could do a failed to load user or some shit, maybe with a .catch or something? but atm why bother
|
||||
|
||||
@@ -1,19 +1,7 @@
|
||||
<script lang="ts">
|
||||
import { onMount } from "svelte";
|
||||
import { push } from "svelte-spa-router";
|
||||
import { Domain, Port } from "../Constantes.svelte";
|
||||
|
||||
// onMount( async() => {
|
||||
// await fetch(`http://${Domain}:${Port}/api/v2/auth/2fa/generate`,
|
||||
// {
|
||||
// method: 'POST',
|
||||
// })
|
||||
// .then(response => {return response.blob()})
|
||||
// .then(blob => {
|
||||
// const url = URL.createObjectURL(blob);
|
||||
// qrCodeImg = url;
|
||||
// });
|
||||
// });
|
||||
import { Domain, Port } from "../Constantes";
|
||||
|
||||
|
||||
let qrCodeImg;
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
import { onMount, onDestroy } from "svelte";
|
||||
import Header from '../../pieces/Header.svelte';
|
||||
import { fade, fly } from 'svelte/transition';
|
||||
import { Domain, Port } from "../../Constantes.svelte";
|
||||
import { Domain, Port } from "../../Constantes";
|
||||
|
||||
import * as pong from "./client/pong";
|
||||
import { gameState } from "./client/ws";
|
||||
@@ -90,6 +90,7 @@
|
||||
hiddenGame = false;
|
||||
}
|
||||
// TODO: Un "else" peut-être ? Si pas de token on fait un truc ?
|
||||
// Si on ne rentre pas dans le else if, du coup il ne se passe rien.
|
||||
}
|
||||
|
||||
const initGameForInvitedPlayer = async(invitation : any) =>
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
import Header from '../../pieces/Header.svelte';
|
||||
import MatchListElem from "../../pieces/MatchListElem.svelte";
|
||||
import { fade, fly } from 'svelte/transition';
|
||||
import { Domain, Port } from "../../Constantes.svelte";
|
||||
import { Domain, Port } from "../../Constantes";
|
||||
|
||||
import * as pongSpectator from "./client/pongSpectator";
|
||||
import { gameState } from "./client/ws";
|
||||
@@ -17,36 +17,38 @@
|
||||
//Game's stuff client side only
|
||||
const gameAreaId = "game_area";
|
||||
let sound = "off";
|
||||
const dummyMatchList = [
|
||||
{
|
||||
gameSessionId: gameSessionIdPLACEHOLDER,
|
||||
matchOptions: pongSpectator.MatchOptions.noOption,
|
||||
playerOneUsername: "toto",
|
||||
playerTwoUsername: "bruno",
|
||||
},
|
||||
{
|
||||
gameSessionId: gameSessionIdPLACEHOLDER,
|
||||
matchOptions: pongSpectator.MatchOptions.multiBalls,
|
||||
playerOneUsername: "pl1",
|
||||
playerTwoUsername: "pl2",
|
||||
},
|
||||
{
|
||||
gameSessionId: "id6543",
|
||||
matchOptions: pongSpectator.MatchOptions.movingWalls | pongSpectator.MatchOptions.multiBalls,
|
||||
playerOneUsername: "bertand",
|
||||
playerTwoUsername: "cassandre",
|
||||
},
|
||||
{
|
||||
gameSessionId: "id3452",
|
||||
matchOptions: pongSpectator.MatchOptions.multiBalls,
|
||||
playerOneUsername: "madeleine",
|
||||
playerTwoUsername: "jack",
|
||||
},
|
||||
];
|
||||
let matchList = dummyMatchList;
|
||||
// const dummyMatchList = [
|
||||
// {
|
||||
// gameSessionId: gameSessionIdPLACEHOLDER,
|
||||
// matchOptions: pongSpectator.MatchOptions.noOption,
|
||||
// playerOneUsername: "toto",
|
||||
// playerTwoUsername: "bruno",
|
||||
// },
|
||||
// {
|
||||
// gameSessionId: gameSessionIdPLACEHOLDER,
|
||||
// matchOptions: pongSpectator.MatchOptions.multiBalls,
|
||||
// playerOneUsername: "pl1",
|
||||
// playerTwoUsername: "pl2",
|
||||
// },
|
||||
// {
|
||||
// gameSessionId: "id6543",
|
||||
// matchOptions: pongSpectator.MatchOptions.movingWalls | pongSpectator.MatchOptions.multiBalls,
|
||||
// playerOneUsername: "bertand",
|
||||
// playerTwoUsername: "cassandre",
|
||||
// },
|
||||
// {
|
||||
// gameSessionId: "id3452",
|
||||
// matchOptions: pongSpectator.MatchOptions.multiBalls,
|
||||
// playerOneUsername: "madeleine",
|
||||
// playerTwoUsername: "jack",
|
||||
// },
|
||||
// ];
|
||||
let matchList = [];
|
||||
|
||||
//html boolean for pages
|
||||
let hiddenGame = true;
|
||||
let hiddenMatchList = false;
|
||||
|
||||
|
||||
onMount( async() => {
|
||||
user = await fetch(`http://${Domain}:${Port}/api/v2/user`)
|
||||
@@ -54,7 +56,13 @@
|
||||
allUsers = await fetch(`http://${Domain}:${Port}/api/v2/user/all`)
|
||||
.then( x => x.json() );
|
||||
// WIP: fetch for match list here
|
||||
matchList = dummyMatchList;
|
||||
const responseForMatchList = await fetch(`http://${Domain}:${Port}/api/v2/game/match/all`)
|
||||
const jsonForMatchList = await responseForMatchList.json();
|
||||
matchList = jsonForMatchList;
|
||||
console.log("matchList");
|
||||
if (matchList.length <= 0)
|
||||
hiddenMatchList = true;
|
||||
console.log(matchList);
|
||||
})
|
||||
|
||||
onDestroy( async() => {
|
||||
@@ -70,11 +78,16 @@
|
||||
resetPage();
|
||||
};
|
||||
|
||||
function resetPage() {
|
||||
async function resetPage() {
|
||||
hiddenGame = true;
|
||||
pongSpectator.destroy();
|
||||
// WIP: fetch for match list here
|
||||
matchList = dummyMatchList;
|
||||
matchList = await fetch(`http://${Domain}:${Port}/api/v2/game/match/all`)
|
||||
.then( x => x.json() );
|
||||
console.log("matchList");
|
||||
if (matchList.length <= 0)
|
||||
hiddenMatchList = true;
|
||||
console.log(matchList);
|
||||
};
|
||||
|
||||
</script>
|
||||
@@ -93,7 +106,10 @@
|
||||
<div id="div_game">
|
||||
<div id="game_options">
|
||||
<fieldset>
|
||||
<legend>options</legend>
|
||||
{#if hiddenMatchList}
|
||||
<legend>no match available</legend>
|
||||
{:else}
|
||||
<legend>options</legend>
|
||||
<div>
|
||||
<p>sound :</p>
|
||||
<input type="radio" id="sound_on" name="sound_selector" bind:group={sound} value="on">
|
||||
@@ -101,13 +117,15 @@
|
||||
<input type="radio" id="sound_off" name="sound_selector" bind:group={sound} value="off">
|
||||
<label for="sound_off">off</label>
|
||||
</div>
|
||||
<menu id="match_list">
|
||||
{#each matchList as match}
|
||||
<MatchListElem match={match} on:click={(e) => initGameSpectator(match.gameServerIdOfTheMatch, match.gameOptions)} />
|
||||
{/each}
|
||||
</menu>
|
||||
{/if}
|
||||
</fieldset>
|
||||
</div>
|
||||
<menu id="match_list">
|
||||
{#each matchList as match}
|
||||
<MatchListElem match={match} on:click={(e) => initGameSpectator(match.gameSessionId, match.matchOptions)} />
|
||||
{/each}
|
||||
</menu>
|
||||
|
||||
</div>
|
||||
{:else}
|
||||
<div id="div_game">
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<script lang="ts">
|
||||
import { onMount, onDestroy } from "svelte";
|
||||
import Header from "../../pieces/Header.svelte";
|
||||
import { Domain, Port } from "../../Constantes.svelte";
|
||||
import { Domain, Port } from "../../Constantes";
|
||||
|
||||
//user's stuff
|
||||
let currentUser;
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
|
||||
import { onMount } from 'svelte';
|
||||
import GenerateUserDisplay from '../../pieces/GenerateUserDisplay.svelte';
|
||||
import { Domain, Port } from "../../Constantes.svelte";
|
||||
import { Domain, Port } from "../../Constantes";
|
||||
|
||||
import Chat from '../../pieces/chat/Chat.svelte';
|
||||
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
|
||||
import { onMount } from "svelte";
|
||||
import { binding_callbacks } from "svelte/internal";
|
||||
import { Domain, Port } from "../../Constantes.svelte";
|
||||
import { Domain, Port } from "../../Constantes";
|
||||
import Button from "../../pieces/Button.svelte";
|
||||
import DisplayAUser from "../../pieces/DisplayAUser.svelte";
|
||||
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
import Card from '../../pieces/Card.svelte';
|
||||
import {onMount} from 'svelte';
|
||||
import { push } from 'svelte-spa-router';
|
||||
import { Domain, Port } from "../../Constantes.svelte";
|
||||
import { Domain, Port } from "../../Constantes";
|
||||
import Button from '../../pieces/Button.svelte';
|
||||
|
||||
let user;
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
|
||||
import { onMount } from 'svelte';
|
||||
import GenerateUserDisplay from './GenerateUserDisplay.svelte';
|
||||
import { Domain, Port } from "../Constantes.svelte";
|
||||
import { Domain, Port } from "../Constantes";
|
||||
// import {updateGeneratedUser} from './GenerateUserDisplay.svelte';
|
||||
|
||||
export let aUsername;
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<script lang="ts">
|
||||
|
||||
import { onMount } from 'svelte';
|
||||
import { Domain, Port } from "../Constantes.svelte";
|
||||
import { Domain, Port } from "../Constantes";
|
||||
|
||||
export let user;
|
||||
export let primary;
|
||||
@@ -43,7 +43,7 @@
|
||||
|
||||
let index = 0, interval = 1000;
|
||||
|
||||
const rand = (min, max) =>
|
||||
const rand = (min, max) =>
|
||||
Math.floor(Math.random() * (max - min + 1)) + min;
|
||||
|
||||
// it's unhappy that "star" isn't typeset, no idea what to do about it...
|
||||
@@ -65,7 +65,7 @@
|
||||
for (let i = 0; i < 3; i++) {
|
||||
setTimeout(() => {
|
||||
animate(stars[i]);
|
||||
|
||||
|
||||
setInterval(() => animate(stars[i]), 1000);
|
||||
}, index++ * (interval / 3))
|
||||
}
|
||||
@@ -80,7 +80,7 @@
|
||||
<!-- <img class="icon" src="{user.image_url}" alt="default user icon"> -->
|
||||
<img class="avatar" src="{avatar}" alt="default user icon">
|
||||
<div class="username">{user.username}</div>
|
||||
<div class="rank">Rank:
|
||||
<div class="rank">Rank:
|
||||
<span class="glitter">
|
||||
<span bind:this={stars[0]} class="glitter-star">
|
||||
<svg viewBox="0 0 512 512">
|
||||
@@ -166,7 +166,7 @@
|
||||
/* Glittery Star Stuff */
|
||||
|
||||
|
||||
:root {
|
||||
:root {
|
||||
--purple: rgb(123, 31, 162);
|
||||
--violet: rgb(103, 58, 183);
|
||||
--pink: rgb(244, 143, 177);
|
||||
@@ -177,7 +177,7 @@
|
||||
from {
|
||||
background-position: 0% center;
|
||||
}
|
||||
|
||||
|
||||
to {
|
||||
background-position: -200% center;
|
||||
}
|
||||
@@ -187,7 +187,7 @@
|
||||
from, to {
|
||||
transform: scale(0);
|
||||
}
|
||||
|
||||
|
||||
50% {
|
||||
transform: scale(1);
|
||||
}
|
||||
@@ -197,7 +197,7 @@
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
|
||||
to {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
@@ -242,7 +242,7 @@
|
||||
var(--purple)
|
||||
);
|
||||
background-size: 200%;
|
||||
|
||||
|
||||
/* Keep these for Safari and chrome */
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<script lang="ts">
|
||||
import { push } from "svelte-spa-router";
|
||||
import { location } from 'svelte-spa-router';
|
||||
import { Domain, Port } from "../Constantes.svelte";
|
||||
import { Domain, Port } from "../Constantes";
|
||||
|
||||
import active from 'svelte-spa-router/active'
|
||||
// or i could leave them all and not display if they're active?
|
||||
|
||||
@@ -4,8 +4,8 @@
|
||||
import { MatchOptions } from "../pages/game/client/pongSpectator";
|
||||
|
||||
export let match: {
|
||||
gameSessionId: string,
|
||||
matchOptions: MatchOptions,
|
||||
gameServerIdOfTheMatch: string,
|
||||
gameOptions: MatchOptions,
|
||||
playerOneUsername: string,
|
||||
playerTwoUsername: string
|
||||
};
|
||||
@@ -13,14 +13,14 @@
|
||||
let matchOptionsString = "";
|
||||
|
||||
onMount( async() => {
|
||||
if (match.matchOptions === MatchOptions.noOption) {
|
||||
if (match.gameOptions === MatchOptions.noOption) {
|
||||
matchOptionsString = "standard";
|
||||
}
|
||||
else {
|
||||
if (match.matchOptions & MatchOptions.multiBalls) {
|
||||
if (match.gameOptions & MatchOptions.multiBalls) {
|
||||
matchOptionsString += "multi balls";
|
||||
}
|
||||
if (match.matchOptions & MatchOptions.movingWalls) {
|
||||
if (match.gameOptions & MatchOptions.movingWalls) {
|
||||
if (matchOptionsString) { matchOptionsString += ", "; }
|
||||
matchOptionsString += "moving walls";
|
||||
}
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<script lang="ts">
|
||||
|
||||
import Layouts from './Chat_layouts.svelte';
|
||||
import { Domain, PortIo } from "../../Constantes.svelte";
|
||||
import { Domain, PortIo } from "../../Constantes";
|
||||
export let color = "transparent";
|
||||
|
||||
/* web sockets with socket.io
|
||||
|
||||
Reference in New Issue
Block a user