rparodi/ft_transcendence
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fixes: cleanup things and added a title on every page

Browse source
This commit is contained in:
Maieul BOYER 2026-01-13 15:41:09 +01:00 • committed by Maix0
parent a1a896daf2
commit 9e431e9c6c
9 changed files with 36 additions and 38 deletions
Download patch file Download diff file Expand all files Collapse all files

2
frontend/index.html
View file

@ -36,7 +36,7 @@
<a href="/signin" class="hover:bg-gray-700 rounded-md px-3 py-2">👤 Signin</a>
<a href="/ttt" class="hover:bg-gray-700 rounded-md px-3 py-2">⭕ Tic-Tac-Toe</a>
<a href="/pong" class="hover:bg-gray-700 rounded-md px-3 py-2">▮•▮ Ping Pong</a>
<a href="/contact" class="hover:bg-gray-700 rounded-md px-3 py-2">⚙️ Settings</a>
<a href="/tour" class="hover:bg-gray-700 rounded-md px-3 py-2">🏆 Tournaments</a>
<a href="/logout" class="hover:bg-gray-700 rounded-md px-3 py-2">🚪 Logout</a>
</nav>
</aside>

9
frontend/src/auth.ts
View file

@ -2,7 +2,7 @@ import { showError } from "@app/toast";
import client from "@app/api";
import cookie from "js-cookie";
import { ensureWindowState, isNullish } from "@app/utils";
import { navigateTo } from "./routing";
import { handleRoute, navigateTo } from "./routing";
cookie.remove("pkce");
@ -28,6 +28,7 @@ declare module "ft_state" {
interface State {
user: User | null;
_headerProfile: boolean;
_reloadOnAuthChange: boolean;
}
}
@ -95,6 +96,12 @@ if (!window.__state._headerProfile) {
});
window.__state._headerProfile = true;
}
window.__state._reloadOnAuthChange ??= false;
if (!window.__state._reloadOnAuthChange) {
document.addEventListener("ft:userChange", () => handleRoute());
window.__state._reloadOnAuthChange = true;
}
updateHeaderProfile();
Object.assign(window as any, { getUser, setUser, updateUser, isLogged });

0
frontend/src/pages/about/about.html
View file

12
frontend/src/pages/about/about.ts
View file

@ -1,12 +0,0 @@
import { addRoute, setTitle } from "@app/routing";
import page from './about.html?raw'
async function route(_url: string, _args: { [k: string]: string }): Promise<string> {
setTitle('About us')
return page;
}
addRoute('/about', route)

2
frontend/src/pages/pong/pong.ts
View file

@ -79,7 +79,7 @@ function pongClient(
_url: string,
_args: RouteHandlerParams,
): RouteHandlerReturn {
setTitle("Pong Game Page");
setTitle("Pong Game");
const urlParams = new URLSearchParams(window.location.search);
let game_req_join = urlParams.get("game");
// todo:

13
frontend/src/pages/pongHistory/pongHistory.ts
View file

@ -1,8 +1,9 @@
import { addRoute, type RouteHandlerParams, type RouteHandlerReturn } from "@app/routing";
import { addRoute, navigateTo, setTitle, type RouteHandlerParams, type RouteHandlerReturn } from "@app/routing";
import page from './pongHistory.html?raw';
import { isNullish } from "@app/utils";
import client from "@app/api";
import { updateUser } from "@app/auth";
import { showError } from "@app/toast";
function getHHMM(d: Date): string {
@ -12,23 +13,23 @@ function getHHMM(d: Date): string {
}
async function pongHistory(_url: string, args: RouteHandlerParams): Promise<RouteHandlerReturn> {
setTitle("Pong Matches");
if (isNullish(args.userid))
args.userid = 'me';
let user = await updateUser();
if (isNullish(user)) {
return { html: '<span> You aren\'t logged in </span>' };
return { html: '<span> You aren\'t logged in </span>', postInsert: () => { showError("You must be logged in !"); navigateTo("/") } };
}
let userInfoRes = await client.getUser({ user: args.userid });
if (userInfoRes.kind !== 'success')
{
return { html: '<span> You tried to open a game history with no data :(</span>' };
if (userInfoRes.kind !== 'success') {
return { html: '<span> You tried to open a game history with no data :(</span>', postInsert: () => { showError("We found no data"); navigateTo("/") } };
}
let userInfo = userInfoRes.payload;
let res = await client.pongHistory({ user: args.userid });
if (res.kind === 'failure' || res.kind === 'notLoggedIn') {
// todo: make a real page on no data
return { html: '<span> You tried to open a game history with no data :(</span>' };
return { html: '<span> You tried to open a game history with no data :(</span>', postInsert: () => { showError("We found no data"); navigateTo("/") } };
}
let games = res.payload.data;
games.reverse();

4
frontend/src/pages/tourHistory/tourHistory.ts
View file

@ -1,4 +1,4 @@
import { addRoute, navigateTo, type RouteHandlerParams, type RouteHandlerReturn } from "@app/routing";
import { addRoute, navigateTo, setTitle, type RouteHandlerParams, type RouteHandlerReturn } from "@app/routing";
import pageAll from './tourHistoryAll.html?raw';
import pageSingle from './tourHistorySingle.html?raw';
import { isNullish } from "@app/utils";
@ -14,7 +14,7 @@ function getHHMM(d: Date): string {
}
async function tourHistoryAll(_url: string, args: RouteHandlerParams): Promise<RouteHandlerReturn> {
setTitle("Tournaments");
let data = await client.tournamentList();
if (data.kind !== 'success') {
showError(`Failed to fetch data`);

3
frontend/src/pages/ttt/ttt.ts
View file

@ -1,5 +1,5 @@
import "./ttt.css"
import {addRoute, type RouteHandlerReturn} from "@app/routing";
import {addRoute, setTitle, type RouteHandlerReturn} from "@app/routing";
import tttPage from "./ttt.html?raw";
import {showError, showInfo} from "@app/toast";
import {io} from "socket.io-client";
@ -41,6 +41,7 @@ type CurrentGameInfo = GameUpdate & { lastState: GameUpdate['gameState'] | null
// Route handler for the Tic-Tac-Toe page.
// Instantiates the game logic and binds UI events.
async function handleTTT(): Promise<RouteHandlerReturn> {
setTitle("Tic Tac Toe");
const msgNotifTimeOut = 4 * 1000;
const socket: Socket = getSocket();
void socket;

13
frontend/src/pages/tttHistory/tttHistory.ts
View file

@ -1,8 +1,9 @@
import { addRoute, type RouteHandlerParams, type RouteHandlerReturn } from "@app/routing";
import { addRoute, navigateTo, setTitle, type RouteHandlerParams, type RouteHandlerReturn } from "@app/routing";
import page from './tttHistory.html?raw';
import { isNullish } from "@app/utils";
import client from "@app/api";
import { updateUser } from "@app/auth";
import { showError } from "@app/toast";
function getHHMM(d: Date): string {
@ -24,23 +25,23 @@ function statusColor(side:'X'|'O',status: string): string {
}
async function tttHistory(_url: string, args: RouteHandlerParams): Promise<RouteHandlerReturn> {
setTitle("Tic Tac Toe Games");
if (isNullish(args.userid))
args.userid = 'me';
let user = await updateUser();
if (isNullish(user)) {
return { html: '<span> You aren\'t logged in </span>' };
return { html: '<span> You aren\'t logged in </span>', postInsert: () => { showError("You must be logged in !"); navigateTo("/") } };
}
let userInfoRes = await client.getUser({ user: args.userid });
if (userInfoRes.kind !== 'success')
{
return { html: '<span> You tried to open a game history with no data :(</span>' };
if (userInfoRes.kind !== 'success') {
return { html: '<span> You tried to open a game history with no data :(</span>', postInsert: () => { showError("We found no data"); navigateTo("/") } };
}
let userInfo = userInfoRes.payload;
let res = await client.tttHistory({ user: args.userid });
if (res.kind === 'failure' || res.kind === 'notLoggedIn') {
// todo: make a real page on no data
return { html: '<span> You tried to open a game history with no data :(</span>' };
return { html: '<span> You tried to open a game history with no data :(</span>', postInsert: () => { showError("We found no data"); navigateTo("/") } };
}
let games = res.payload.data;
games.reverse();