mirror of
https://github.com/KeyZox71/knl_meowscendence.git
synced 2025-10-14 10:54:45 +02:00
「🏗️」 wip: work in progress, not done yet.
This commit is contained in:
@ -16,7 +16,7 @@
|
||||
|
||||
<nav class="bg-white dark:bg-neutral-800 mx-8 rounded-b-xl shadow-md px-4 sm:px-6 lg:px-8 flex justify-end h-16 items-center space-x-6 m-">
|
||||
<a class="text-neutral-900 hover:text-neutral-700 dark:text-white dark:hover:text-neutral-400" href="/" data-link>home</a>
|
||||
<a class="text-neutral-900 hover:text-neutral-700 dark:text-white dark:hover:text-neutral-400" href="/login" data-link>login</a>
|
||||
<a id="profile-button" class="text-neutral-900 hover:text-neutral-700 dark:text-white dark:hover:text-neutral-400" href="/login" data-link>login</a>
|
||||
</nav>
|
||||
|
||||
<div id="app" class="flex-1 flex items-center justify-center">
|
||||
|
@ -1,4 +1,41 @@
|
||||
const navigationManager = url => {
|
||||
export async function isLogged(): boolean {
|
||||
let uuid_req = await fetch("http://localhost:3001/me", {
|
||||
method: "GET",
|
||||
credentials: "include",
|
||||
});
|
||||
if (uuid_req.status == 200)
|
||||
{
|
||||
let uuid = await uuid_req.json();
|
||||
document.cookie = `uuid=${uuid.user};max-age=${60*60*24*7}`;
|
||||
|
||||
const old_button = document.getElementById("profile-button");
|
||||
const logged_dropdown = document.createElement("button");
|
||||
logged_dropdown.innerHTML = "logged in, more like locked in ahah i'm gonna kill myself the 12th of October";
|
||||
logged_dropdown.classList.add("text-neutral-900", "hover:text-neutral-700", "dark:text-white", "dark:hover:text-neutral-400");
|
||||
logged_dropdown.id = "profile-button";
|
||||
|
||||
// add the dropdown button and the dropdown logic
|
||||
|
||||
old_button.replaceWith(logged_dropdown);
|
||||
return true;
|
||||
}
|
||||
else // 401
|
||||
{
|
||||
document.cookie = `uuid=;max-age=0`;
|
||||
const old_button = document.getElementById("profile-button");
|
||||
const login_button = document.createElement("a");
|
||||
login_button.id = "profile-button";
|
||||
login_button.text = "login";
|
||||
login_button.classList.add("text-neutral-900", "hover:text-neutral-700", "dark:text-white", "dark:hover:text-neutral-400");
|
||||
login_button.href = "/login";
|
||||
login_button.setAttribute("data-link", "");
|
||||
|
||||
old_button.replaceWith(login_button);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
export const navigationManager = url => {
|
||||
history.pushState(null, null, url);
|
||||
router();
|
||||
};
|
||||
@ -14,6 +51,8 @@ const routes = [
|
||||
|
||||
{ path: "/login", view: () => import("./views/LoginPage.ts") },
|
||||
{ path: "/register", view: () => import("./views/RegisterPage.ts") },
|
||||
|
||||
{ path: "/tetris", view: () => import("./views/Tetris.ts") },
|
||||
];
|
||||
|
||||
const router = async () => {
|
||||
@ -30,7 +69,7 @@ const router = async () => {
|
||||
if (view)
|
||||
view.running = false;
|
||||
|
||||
console.log(match);
|
||||
//console.log(match);
|
||||
|
||||
const module = await match.route.view();
|
||||
view = new module.default();
|
||||
@ -42,6 +81,7 @@ const router = async () => {
|
||||
window.addEventListener("popstate", router);
|
||||
|
||||
document.addEventListener("DOMContentLoaded", () => {
|
||||
isLogged();
|
||||
|
||||
document.body.addEventListener("click", e=> {
|
||||
if (e.target.matches("[data-link]"))
|
||||
|
@ -59,9 +59,9 @@ export default class extends Aview {
|
||||
document.addEventListener("keyup", e => { keys[e.key] = false; });
|
||||
|
||||
function movePaddles() {
|
||||
if (keys["w"] && leftPaddleY > 0)
|
||||
if ((keys["w"] || keys["W"]) && leftPaddleY > 0)
|
||||
leftPaddleY -= paddleSpeed * elapsed;
|
||||
if (keys["s"] && leftPaddleY < canvas.height - paddleHeight)
|
||||
if ((keys["s"] || keys["S"]) && leftPaddleY < canvas.height - paddleHeight)
|
||||
leftPaddleY += paddleSpeed * elapsed;
|
||||
if (keys["ArrowUp"] && rightPaddleY > 0)
|
||||
rightPaddleY -= paddleSpeed * elapsed;
|
||||
@ -116,7 +116,14 @@ export default class extends Aview {
|
||||
p1_score++;
|
||||
|
||||
if (p1_score === 3 || p2_score === 3)
|
||||
{
|
||||
// ------------------------------------------------------------------------------------------------------------------------------------------
|
||||
//
|
||||
// insert the fetch to the ScoreStore api here
|
||||
//
|
||||
// ------------------------------------------------------------------------------------------------------------------------------------------
|
||||
match_over = true;
|
||||
}
|
||||
else
|
||||
{
|
||||
countdown = 3;
|
||||
@ -191,7 +198,6 @@ export default class extends Aview {
|
||||
moveBall();
|
||||
}
|
||||
draw();
|
||||
console.log(game_playing);
|
||||
if (!game_playing)
|
||||
startCountdown();
|
||||
if (this.running)
|
||||
@ -210,6 +216,12 @@ export default class extends Aview {
|
||||
countdownTimer = performance.now();
|
||||
});
|
||||
|
||||
// --------------------------------------------------------------------------------------------------------------------------------------------------------
|
||||
//
|
||||
// insert logic to set both names
|
||||
//
|
||||
// --------------------------------------------------------------------------------------------------------------------------------------------------------
|
||||
|
||||
requestAnimationFrame(gameLoop);
|
||||
}
|
||||
}
|
||||
|
@ -1,4 +1,5 @@
|
||||
import Aview from "./Aview.ts"
|
||||
import { isLogged, navigationManager } from "../main.ts"
|
||||
|
||||
export default class extends Aview {
|
||||
|
||||
@ -31,28 +32,33 @@ export default class extends Aview {
|
||||
const password = (document.getElementById("password") as HTMLInputElement).value;
|
||||
|
||||
try {
|
||||
const response = await fetch("http://localhost:3001/login", {
|
||||
const data_req = await fetch("http://localhost:3001/login", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json", },
|
||||
credentials: "include",
|
||||
body: JSON.stringify({ user: username, password: password }),
|
||||
});
|
||||
const data = await response.json();
|
||||
const data = await data_req.json();
|
||||
|
||||
if (response.status === 200)
|
||||
if (data_req.status === 200)
|
||||
{
|
||||
isLogged();
|
||||
navigationManager("/");
|
||||
}
|
||||
else if (response.status === 400)
|
||||
else if (data_req.status === 400)
|
||||
{
|
||||
document.getElementById("login-error-message").innerHTML = "error: " + data.error;
|
||||
document.getElementById("login-error-message").classList.remove("hidden");
|
||||
}
|
||||
else
|
||||
{
|
||||
throw new Error("invalid response");
|
||||
}
|
||||
|
||||
}
|
||||
catch (error)
|
||||
{
|
||||
console.log(error);
|
||||
console.error(error);
|
||||
document.getElementById("login-error-message").innerHTML = "error: server error, try again later...";
|
||||
document.getElementById("login-error-message").classList.remove("hidden");
|
||||
}
|
||||
|
@ -1,4 +1,5 @@
|
||||
import Aview from "./Aview.ts"
|
||||
import { isLogged, navigationManager } from "../main.ts"
|
||||
|
||||
export default class extends Aview {
|
||||
|
||||
@ -15,7 +16,7 @@ export default class extends Aview {
|
||||
|
||||
<input type="text" id="username" placeholder="username" class="bg-white text-neutral-900 border rounded-md w-full px-4 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500"></input>
|
||||
<input type="password" id="password" placeholder="password" class="bg-white text-neutral-900 border w-full px-4 py-2 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"></input>
|
||||
|
||||
<p id="login-error-message" class="hidden text-red-700 dark:text-red-500"></p>
|
||||
<button id="register-button" type="submit" class="bg-blue-600 text-white hover:bg-blue-500 w-full py-2 rounded-md transition-colors">register</button>
|
||||
|
||||
<a class="text-gray-400 dark:text-gray-600 underline" href="/login" data-link>
|
||||
@ -31,28 +32,40 @@ export default class extends Aview {
|
||||
const password = (document.getElementById("password") as HTMLInputElement).value;
|
||||
|
||||
try {
|
||||
const response = await fetch("http://localhost:3001/register", {
|
||||
const data_req = await fetch("http://localhost:3001/register", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json", },
|
||||
credentials: "include",
|
||||
body: JSON.stringify({ user: username, password: password }),
|
||||
});
|
||||
const data = await response.json();
|
||||
const data = await data_req.json();
|
||||
|
||||
if (response.status === 200)
|
||||
if (data_req.status === 200)
|
||||
{
|
||||
let uuid_req = await fetch("http://localhost:3001/me", {
|
||||
method: "GET",
|
||||
credentials: "include",
|
||||
});
|
||||
let uuid = await uuid_req.json();
|
||||
document.cookie = `uuid=${uuid.user};max-ages=${60*60*24*7}`;
|
||||
console.log(document.cookie);
|
||||
isLogged();
|
||||
navigationManager("/");
|
||||
}
|
||||
else if (response.status === 400)
|
||||
else if (data_req.status === 400)
|
||||
{
|
||||
document.getElementById("login-error-message").innerHTML = "error: " + data.error;
|
||||
document.getElementById("login-error-message").classList.remove("hidden");
|
||||
}
|
||||
else
|
||||
{
|
||||
throw new Error("invalid response");
|
||||
}
|
||||
|
||||
}
|
||||
catch (error)
|
||||
{
|
||||
console.log(error);
|
||||
console.error(error);
|
||||
document.getElementById("login-error-message").innerHTML = "error: server error, try again later...";
|
||||
document.getElementById("login-error-message").classList.remove("hidden");
|
||||
}
|
||||
|
Reference in New Issue
Block a user