feat: update navigation links and add new pages for improved user experience
All checks were successful
DEPLOY / deploy (push) Successful in 12s
All checks were successful
DEPLOY / deploy (push) Successful in 12s
- Change "Surprise :)" link to "Vibe check" across multiple HTML files for consistency and clarity. - Add a new "about.html" page to provide information about the author. - Introduce a new "quizz.html" page for user interaction and engagement. - Create new project pages for "Lieutenant Champignon" and "Pong" to showcase additional projects. - Remove outdated project pages and links to streamline the project section. - Add new assets including images and PDFs to enhance content presentation. - Update JavaScript functions for form validation and score calculation in the quizz page. - Improve styling in CSS for better visual hierarchy and layout consistency.
This commit is contained in:
parent
5ed9f72230
commit
904d8daee6
2
TP3.html
2
TP3.html
@ -13,7 +13,7 @@
|
||||
<a href="/" class="header_button">Home Page</a>
|
||||
<a href="/projects.html" class="header_button">Projets</a>
|
||||
<a href="/about.html" class="header_button">A propos de moi</a>
|
||||
<a href="/surprise.html" class="header_button">Surprise :)</a>
|
||||
<a href="/quizz" class="header_button">Vibe check</a>
|
||||
<a href="https://djalim.fr" class="header_button">Blog Perso</a>
|
||||
</div>
|
||||
<button
|
||||
|
||||
2
TP4.html
2
TP4.html
@ -13,7 +13,7 @@
|
||||
<a href="/" class="header_button">Home Page</a>
|
||||
<a href="/projects.html" class="header_button">Projets</a>
|
||||
<a href="/about.html" class="header_button">A propos de moi</a>
|
||||
<a href="/surprise.html" class="header_button">Surprise :)</a>
|
||||
<a href="/quizz" class="header_button">Vibe check</a>
|
||||
<a href="https://djalim.fr" class="header_button">Blog Perso</a>
|
||||
</div>
|
||||
<button
|
||||
|
||||
2
TP5.html
2
TP5.html
@ -17,7 +17,7 @@
|
||||
<a href="/" class="header_button">Home Page</a>
|
||||
<a href="/projects.html" class="header_button">Projets</a>
|
||||
<a href="/about.html" class="header_button">A propos de moi</a>
|
||||
<a href="/surprise.html" class="header_button">Surprise :)</a>
|
||||
<a href="/quizz" class="header_button">Vibe check</a>
|
||||
<a href="https://djalim.fr" class="header_button">Blog Perso</a>
|
||||
</div>
|
||||
<button
|
||||
|
||||
4
TP6.html
4
TP6.html
@ -17,7 +17,7 @@
|
||||
<a href="/" class="header_button">Home Page</a>
|
||||
<a href="/projects.html" class="header_button">Projets</a>
|
||||
<a href="/about.html" class="header_button">A propos de moi</a>
|
||||
<a href="/surprise.html" class="header_button">Surprise :)</a>
|
||||
<a href="/quizz" class="header_button">Vibe check</a>
|
||||
<a href="https://djalim.fr" class="header_button">Blog Perso</a>
|
||||
</div>
|
||||
<button
|
||||
@ -46,10 +46,12 @@
|
||||
<div id="lastSpins"></div>
|
||||
<p id="spinCounter"></p>
|
||||
<div id="report">
|
||||
<p id="nbq"></p>
|
||||
<p id="winrate"></p>
|
||||
<p id="winpercentage"></p>
|
||||
<p id="gains"></p>
|
||||
</div>
|
||||
<a href="/static/rapport.pdf" class="header_button">Rapport</a>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
|
||||
@ -12,7 +12,7 @@
|
||||
<a href="/" class="header_button">Home Page</a>
|
||||
<a href="/projects.html" class="header_button">Projets</a>
|
||||
<a href="/about.html" class="header_button">A propos de moi</a>
|
||||
<a href="/surprise.html" class="header_button">Surprise :)</a>
|
||||
<a href="/quizz" class="header_button">Vibe check</a>
|
||||
<a href="https://djalim.fr" class="header_button">Blog Perso</a>
|
||||
</div>
|
||||
<button
|
||||
@ -35,11 +35,19 @@
|
||||
>
|
||||
</p>
|
||||
<br />
|
||||
<a class="header_button" href="/static/CV 2025.pdf"
|
||||
>CV format pdf</a
|
||||
>
|
||||
<h2>Formation</h2>
|
||||
<ul>
|
||||
<li>Bac : (2021) Bac General NSI_MATH</li>
|
||||
<li>
|
||||
BUT : (2024) BUT informatique :Conception d’applications
|
||||
BUT Info Aix : (2024) BUT informatique :Conception
|
||||
d’applications
|
||||
</li>
|
||||
<li>
|
||||
Polytech Marseille : (2024-2027) Cycle ingenieur
|
||||
informatique
|
||||
</li>
|
||||
</ul>
|
||||
<br />
|
||||
@ -49,6 +57,10 @@
|
||||
Stage : (2018) DOSI -IUT Digne-les-Bains : Administrateur
|
||||
réseaux et systèmes
|
||||
</li>
|
||||
<li>
|
||||
Stage : (2019) CYBERCAFE-Games Digne-les-Bains : Assemblage
|
||||
d'ordinateurs
|
||||
</li>
|
||||
<li>
|
||||
Stage : (2023) INRAE - Le Tholonet : Développement de
|
||||
logiciel d’aide à la recherche
|
||||
@ -1,7 +1,7 @@
|
||||
<!doctype html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<title>Homepage</title>
|
||||
<title>Flexbox blocs</title>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="stylesheet" href="/static/style.css" />
|
||||
<script src="/static/js/utils.js" defer></script>
|
||||
@ -12,7 +12,7 @@
|
||||
<a href="/" class="header_button">Home Page</a>
|
||||
<a href="/projects.html" class="header_button">Projets</a>
|
||||
<a href="/about.html" class="header_button">A propos de moi</a>
|
||||
<a href="/surprise.html" class="header_button">Surprise :)</a>
|
||||
<a href="/quizz" class="header_button">Vibe check</a>
|
||||
<a href="https://djalim.fr" class="header_button">Blog Perso</a>
|
||||
</div>
|
||||
<button
|
||||
|
||||
@ -12,7 +12,7 @@
|
||||
<a href="/" class="header_button">Home Page</a>
|
||||
<a href="/projects.html" class="header_button">Projets</a>
|
||||
<a href="/about.html" class="header_button">A propos de moi</a>
|
||||
<a href="/surprise.html" class="header_button">Surprise :)</a>
|
||||
<a href="/quizz" class="header_button">Vibe check</a>
|
||||
<a href="https://djalim.fr" class="header_button">Blog Perso</a>
|
||||
</div>
|
||||
<button
|
||||
|
||||
@ -12,7 +12,7 @@
|
||||
<a href="/" class="header_button">Home Page</a>
|
||||
<a href="/projects.html" class="header_button">Projets</a>
|
||||
<a href="/about.html" class="header_button">A propos de moi</a>
|
||||
<a href="/surprise.html" class="header_button">Surprise :)</a>
|
||||
<a href="/quizz" class="header_button">Vibe check</a>
|
||||
<a href="https://djalim.fr" class="header_button">Blog Perso</a>
|
||||
</div>
|
||||
<button
|
||||
@ -40,7 +40,7 @@
|
||||
|
||||
<a href="/TP5.html" class="box project">
|
||||
<h2>TP5</h2>
|
||||
<p>A groceery list that is stored in your browser</p>
|
||||
<p>A grocery list that is stored in your browser</p>
|
||||
</a>
|
||||
|
||||
<a href="/TP6.html" class="box project">
|
||||
@ -53,6 +53,18 @@
|
||||
<p>A flexbox example</p>
|
||||
</a>
|
||||
|
||||
<a href="/projects/snake.html" class="box project">
|
||||
<h2>Snake</h2>
|
||||
<p>A snake game</p>
|
||||
</a>
|
||||
|
||||
<a href="/projects/pong.html" class="box project">
|
||||
<h2>Pong</h2>
|
||||
<p>A pong game</p>
|
||||
</a>
|
||||
|
||||
<hr />
|
||||
|
||||
<div id="title">
|
||||
<h1>Mes projets</h1>
|
||||
</div>
|
||||
@ -70,31 +82,13 @@
|
||||
</a>
|
||||
<a href="/projects/superspaceinvader.html" class="box project">
|
||||
<h2>Super Space Invader</h2>
|
||||
<p>A space invader made in C</p>
|
||||
<p>A space invader made in C</p> </a
|
||||
><a href="/projects/lieutenantchampignon.html" class="box project">
|
||||
<h2>Lieutenant Champignon</h2>
|
||||
<p>A Captain Toad clone made in unity in five days</p>
|
||||
</a>
|
||||
<a href="/projects/httpserver.html" class="box project">
|
||||
<h2>Simple Http server</h2>
|
||||
<p>A work in progress lightweight HTTP server made in C++</p>
|
||||
</a>
|
||||
<a href="/projects/clipsync.html" class="box project">
|
||||
<h2>ClipSync</h2>
|
||||
<p>
|
||||
A linux deamon and an android app to sync clipboard beteen
|
||||
devices
|
||||
</p>
|
||||
</a>
|
||||
<a href="/projects/truthinquiry.html" class="box project">
|
||||
<h2>TruthInquiry</h2>
|
||||
<p>
|
||||
A serious game made in Flask about facial expression and a
|
||||
murder
|
||||
</p>
|
||||
</a>
|
||||
<a href="/projects/retrodb.html" class="box project">
|
||||
<h2>The Great Retro library</h2>
|
||||
<p>
|
||||
A website where you can play all your favorites retro games
|
||||
</p>
|
||||
<a href="https://git.djalim.fr/DjalimSimaila" class="box project">
|
||||
<h2>More Projects</h2>
|
||||
</a>
|
||||
</main>
|
||||
|
||||
|
||||
@ -16,7 +16,7 @@
|
||||
<a href="/" class="header_button">Home Page</a>
|
||||
<a href="/projects.html" class="header_button">Projets</a>
|
||||
<a href="/about.html" class="header_button">A propos de moi</a>
|
||||
<a href="/surprise.html" class="header_button">Surprise :)</a>
|
||||
<a href="/quizz" class="header_button">Vibe check</a>
|
||||
<a href="https://djalim.fr" class="header_button">Blog Perso</a>
|
||||
</div>
|
||||
<button
|
||||
|
||||
63
projects/lieutenantchampignon.html
Normal file
63
projects/lieutenantchampignon.html
Normal file
@ -0,0 +1,63 @@
|
||||
<!doctype html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<title>
|
||||
Lieutenant Champignon - Super explorateur des Enfers - DeluXe Black
|
||||
Edition VS Dark Roger
|
||||
</title>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="stylesheet" href="/static/style.css" />
|
||||
<script src="/static/js/utils.js" defer></script>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
||||
/>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div class="links">
|
||||
<a href="/" class="header_button">Home Page</a>
|
||||
<a href="/projects.html" class="header_button">Projets</a>
|
||||
<a href="/about.html" class="header_button">A propos de moi</a>
|
||||
<a href="/quizz" class="header_button">Vibe check</a>
|
||||
<a href="https://djalim.fr" class="header_button">Blog Perso</a>
|
||||
</div>
|
||||
<button
|
||||
id="display_header_links"
|
||||
onclick="toggle_all_header_links()"
|
||||
>
|
||||
▼
|
||||
</button>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<h1>
|
||||
Lieutenant Champignon - Super explorateur des Enfers - DeluXe
|
||||
Black Edition VS Dark Roger Featuring "No One" from the serie My
|
||||
Little Pony
|
||||
</h1>
|
||||
<img
|
||||
src="/static/assets/images/lcsededbevdrfnoftsmlp.png"
|
||||
style="width: 80%"
|
||||
/>
|
||||
<p>
|
||||
Lieutenant Champignon is a Captain Toad clone made in 5 days in
|
||||
Unity for a Game Making course
|
||||
</p>
|
||||
<img src="/static/assets/images/Map.png" style="width: 80%" />
|
||||
<a
|
||||
href="
|
||||
https://git.djalim.fr/DjalimSimaila/LieutenantChampignon"
|
||||
><u>source code</u></a
|
||||
>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<p>
|
||||
Fait par Djalim Simaila et sa haine de l'HTML, CSS, mais pas du
|
||||
JavaScript ♥️
|
||||
</p>
|
||||
<p>©2025</p>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,7 +1,7 @@
|
||||
<!doctype html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<title>Crazy Space</title>
|
||||
<title>Pokemon Kreye</title>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="stylesheet" href="/static/style.css" />
|
||||
<script src="/static/js/utils.js" defer></script>
|
||||
@ -9,14 +9,6 @@
|
||||
rel="stylesheet"
|
||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
||||
/>
|
||||
<script language="javascript" defer>
|
||||
function init() {
|
||||
const iframe = document.getElementById("iframe");
|
||||
const iframeContent = iframe.contentWindow.document;
|
||||
iframeContent.body.getElementById("game").style.borderRadius =
|
||||
"10px";
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
@ -24,7 +16,7 @@
|
||||
<a href="/" class="header_button">Home Page</a>
|
||||
<a href="/projects.html" class="header_button">Projets</a>
|
||||
<a href="/about.html" class="header_button">A propos de moi</a>
|
||||
<a href="/surprise.html" class="header_button">Surprise :)</a>
|
||||
<a href="/quizz" class="header_button">Vibe check</a>
|
||||
<a href="https://djalim.fr" class="header_button">Blog Perso</a>
|
||||
</div>
|
||||
<button
|
||||
@ -49,23 +41,33 @@
|
||||
WARNING THIS GAME WAS MADE BY A TEENAGER AT THE TIME, THE HUMOR
|
||||
IS GROSS
|
||||
</h1>
|
||||
<iframe
|
||||
src="https://retrodb.djalim.fr/emulator?rom_id=1&console_core=gba"
|
||||
<div
|
||||
style="
|
||||
width: 600px;
|
||||
height: 496px;
|
||||
border: none;
|
||||
& html body div div#game.ejs_parent {
|
||||
border-radius: 10px;
|
||||
}
|
||||
width: 584px;
|
||||
height: 480px;
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
"
|
||||
id="iframe"
|
||||
onload="init()"
|
||||
allowfullscreen
|
||||
title="Pokemon kreye edition player"
|
||||
allow="web-share"
|
||||
>
|
||||
</iframe>
|
||||
<iframe
|
||||
src="https://retrodb.djalim.fr/emulator?rom_id=1&console_core=gba"
|
||||
style="
|
||||
width: 600px;
|
||||
height: 496px;
|
||||
position: relative;
|
||||
top: -8px;
|
||||
left: -8px;
|
||||
border: none;
|
||||
& html body div div#game.ejs_parent {
|
||||
border-radius: 10px;
|
||||
}
|
||||
"
|
||||
allowfullscreen
|
||||
title="Pokemon kreye edition player"
|
||||
allow="web-share"
|
||||
>
|
||||
</iframe>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
|
||||
255
projects/pong.html
Normal file
255
projects/pong.html
Normal file
@ -0,0 +1,255 @@
|
||||
<!doctype html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<title>Homepage</title>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="stylesheet" href="/static/style.css" />
|
||||
<script src="/static/js/utils.js" defer></script>
|
||||
<script language="javascript" defer>
|
||||
function getSinus(angle) {
|
||||
return Math.sin(angle);
|
||||
}
|
||||
|
||||
function getCosinus(angle) {
|
||||
return Math.cos(angle);
|
||||
}
|
||||
|
||||
class Player {
|
||||
constructor(
|
||||
x,
|
||||
y,
|
||||
width,
|
||||
height,
|
||||
color,
|
||||
speed,
|
||||
upKey,
|
||||
downKey,
|
||||
canvas,
|
||||
) {
|
||||
this.x = x;
|
||||
this.y = y;
|
||||
this.width = width;
|
||||
this.height = height;
|
||||
this.color = color;
|
||||
this.speed = speed;
|
||||
this.upKey = upKey;
|
||||
this.downKey = downKey;
|
||||
this.movingUp = false;
|
||||
this.movingDown = false;
|
||||
this.points = 0;
|
||||
this.canvas = canvas;
|
||||
}
|
||||
|
||||
draw(ctx) {
|
||||
ctx.fillStyle = this.color;
|
||||
ctx.fillRect(this.x, this.y, this.width, this.height);
|
||||
}
|
||||
|
||||
moveUp() {
|
||||
this.y -= this.speed;
|
||||
}
|
||||
moveDown() {
|
||||
this.y += this.speed;
|
||||
}
|
||||
move() {
|
||||
if (this.movingUp && this.y > 0) {
|
||||
this.moveUp();
|
||||
}
|
||||
if (
|
||||
this.movingDown &&
|
||||
this.y < this.canvas.height - this.height
|
||||
) {
|
||||
this.moveDown();
|
||||
}
|
||||
}
|
||||
updateKeys(event) {
|
||||
this.movingUp =
|
||||
event.key == this.upKey && event.type == "keydown";
|
||||
this.movingDown =
|
||||
event.key == this.downKey && event.type == "keydown";
|
||||
}
|
||||
}
|
||||
|
||||
class Ball {
|
||||
constructor(x, y, radius, color, speed) {
|
||||
this.x = x;
|
||||
this.y = y;
|
||||
this.radius = radius;
|
||||
this.color = color;
|
||||
this.horizontal_speed = speed;
|
||||
this.vertical_speed = speed;
|
||||
this.default_speed = speed;
|
||||
this.angle = Math.random() * 2 * Math.PI;
|
||||
}
|
||||
|
||||
reset() {
|
||||
this.angle = Math.random() * 2 * Math.PI;
|
||||
this.x = 450;
|
||||
this.y = 250;
|
||||
this.horizontal_speed = this.default_speed;
|
||||
this.vertical_speed = this.default_speed;
|
||||
}
|
||||
|
||||
draw(ctx) {
|
||||
ctx.beginPath();
|
||||
ctx.arc(this.x, this.y, this.radius, 0, 2 * Math.PI);
|
||||
ctx.fillStyle = this.color;
|
||||
ctx.fill();
|
||||
}
|
||||
|
||||
move() {
|
||||
this.x += this.horizontal_speed * getCosinus(this.angle);
|
||||
this.y += this.vertical_speed * getSinus(this.angle);
|
||||
}
|
||||
}
|
||||
|
||||
class Game {
|
||||
constructor(background_color, circle_color) {
|
||||
this.background_color = background_color;
|
||||
this.circle_color = circle_color;
|
||||
this.canvas = document.createElement("canvas");
|
||||
this.canvas.width = 900;
|
||||
this.canvas.height = 500;
|
||||
this.canvas.style.border = "5px solid #44475a";
|
||||
this.canvas.style.borderRadius = "10px";
|
||||
this.canvas.style.margin = "auto";
|
||||
this.canvas.style.display = "block";
|
||||
this.canvas.style.width = "70%";
|
||||
document.querySelector("main").appendChild(this.canvas);
|
||||
this.ctx = this.canvas.getContext("2d");
|
||||
this.ball = new Ball(450, 250, 20, this.circle_color, 3);
|
||||
this.Player1 = new Player(
|
||||
10,
|
||||
0,
|
||||
20,
|
||||
100,
|
||||
"white",
|
||||
3,
|
||||
"z",
|
||||
"s",
|
||||
this.canvas,
|
||||
);
|
||||
this.Player2 = new Player(
|
||||
870,
|
||||
0,
|
||||
20,
|
||||
100,
|
||||
"white",
|
||||
3,
|
||||
"ArrowUp",
|
||||
"ArrowDown",
|
||||
this.canvas,
|
||||
);
|
||||
}
|
||||
|
||||
colorBackground() {
|
||||
this.ctx.fillStyle = this.background_color;
|
||||
this.ctx.fillRect(0, 0, 900, 500);
|
||||
this.ctx.fillStyle = "white";
|
||||
this.ctx.font = "30px Arial";
|
||||
this.ctx.fillText(this.Player1.points, 100, 50);
|
||||
this.ctx.fillText(this.Player2.points, 800, 50);
|
||||
}
|
||||
|
||||
draw() {
|
||||
this.ball.draw(this.ctx);
|
||||
this.Player1.draw(this.ctx);
|
||||
this.Player2.draw(this.ctx);
|
||||
}
|
||||
|
||||
colision() {
|
||||
// Player collisions
|
||||
if (
|
||||
this.ball.x + this.ball.radius >= this.Player2.x &&
|
||||
this.ball.y >= this.Player2.y &&
|
||||
this.ball.y <= this.Player2.y + this.Player2.height
|
||||
) {
|
||||
this.ball.horizontal_speed *= -1.1;
|
||||
}
|
||||
|
||||
if (
|
||||
this.ball.x - this.ball.radius <=
|
||||
this.Player1.x + this.Player1.width &&
|
||||
this.ball.y >= this.Player1.y &&
|
||||
this.ball.y <= this.Player1.y + this.Player1.height
|
||||
) {
|
||||
this.ball.horizontal_speed *= -1.1;
|
||||
}
|
||||
// Wall collisions
|
||||
if (
|
||||
this.ball.x + this.ball.radius >= 900 ||
|
||||
this.ball.x - this.ball.radius <= 0
|
||||
) {
|
||||
if (this.ball.x + this.ball.radius >= 900) {
|
||||
this.Player1.points += 1;
|
||||
} else {
|
||||
this.Player2.points += 1;
|
||||
}
|
||||
this.ball.reset();
|
||||
}
|
||||
if (
|
||||
this.ball.y + this.ball.radius >= 500 ||
|
||||
this.ball.y - this.ball.radius <= 0
|
||||
) {
|
||||
this.ball.vertical_speed *= -1;
|
||||
}
|
||||
}
|
||||
|
||||
step() {
|
||||
this.colorBackground();
|
||||
this.draw();
|
||||
this.ball.move();
|
||||
this.colision();
|
||||
this.Player1.move();
|
||||
this.Player2.move();
|
||||
//this.Player1.y = this.ball.y - this.Player1.height / 2;
|
||||
this.Player2.y = this.ball.y - this.Player2.height / 2;
|
||||
}
|
||||
}
|
||||
|
||||
function loadGame() {
|
||||
const game = new Game("#282a36", "#6272a4");
|
||||
|
||||
document.addEventListener("keydown", function (event) {
|
||||
game.Player1.updateKeys(event);
|
||||
game.Player2.updateKeys(event);
|
||||
});
|
||||
document.addEventListener("keyup", function (event) {
|
||||
game.Player1.updateKeys(event);
|
||||
game.Player2.updateKeys(event);
|
||||
});
|
||||
|
||||
setInterval(() => game.step(), 1);
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body onload="loadGame()">
|
||||
<header>
|
||||
<div class="links">
|
||||
<a href="/" class="header_button">Home Page</a>
|
||||
<a href="/projects.html" class="header_button">Projets</a>
|
||||
<a href="/about.html" class="header_button">A propos de moi</a>
|
||||
<a href="/quizz" class="header_button">Vibe check</a>
|
||||
<a href="https://djalim.fr" class="header_button">Blog Perso</a>
|
||||
</div>
|
||||
<button
|
||||
id="display_header_links"
|
||||
onclick="toggle_all_header_links()"
|
||||
>
|
||||
▼
|
||||
</button>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<p>Left player: z to go up and s to go down</p>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<p>
|
||||
Fait par Djalim Simaila et sa haine de l'HTML, CSS, mais pas du
|
||||
JavaScript ♥️
|
||||
</p>
|
||||
<p>©2025</p>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,7 +1,7 @@
|
||||
<!doctype html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<title>Crazy Space</title>
|
||||
<title>Pycord</title>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="stylesheet" href="/static/style.css" />
|
||||
<script src="/static/js/utils.js" defer></script>
|
||||
@ -16,7 +16,7 @@
|
||||
<a href="/" class="header_button">Home Page</a>
|
||||
<a href="/projects.html" class="header_button">Projets</a>
|
||||
<a href="/about.html" class="header_button">A propos de moi</a>
|
||||
<a href="/surprise.html" class="header_button">Surprise :)</a>
|
||||
<a href="/quizz" class="header_button">Vibe check</a>
|
||||
<a href="https://djalim.fr" class="header_button">Blog Perso</a>
|
||||
</div>
|
||||
<button
|
||||
@ -34,7 +34,10 @@
|
||||
<br />
|
||||
It uses npyscreen as a tui library and Mysql as a database.
|
||||
</p>
|
||||
<a>source code</a>
|
||||
<img src="/static/assets/images/pycord menu.png" />
|
||||
<a href="https://git.djalim.fr/DjalimSimaila/Pycord"
|
||||
><u>source code</u></a
|
||||
>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
|
||||
175
projects/script.js
Normal file
175
projects/script.js
Normal file
@ -0,0 +1,175 @@
|
||||
function getSinus(angle) {
|
||||
return Math.sin(angle);
|
||||
}
|
||||
|
||||
function getCosinus(angle) {
|
||||
return Math.cos(angle);
|
||||
}
|
||||
|
||||
class Player {
|
||||
constructor(x, y, width, height, color, speed, upKey, downKey) {
|
||||
this.x = x;
|
||||
this.y = y;
|
||||
this.width = width;
|
||||
this.height = height;
|
||||
this.color = color;
|
||||
this.speed = speed;
|
||||
this.upKey = upKey;
|
||||
this.downKey = downKey;
|
||||
this.points = 0;
|
||||
}
|
||||
|
||||
draw(ctx) {
|
||||
ctx.fillStyle = this.color;
|
||||
ctx.fillRect(this.x, this.y, this.width, this.height);
|
||||
}
|
||||
|
||||
moveUp() {
|
||||
this.y -= this.speed;
|
||||
}
|
||||
moveDown() {
|
||||
this.y += this.speed;
|
||||
}
|
||||
move(event) {
|
||||
if (event.key == this.upKey) {
|
||||
this.moveUp();
|
||||
}
|
||||
if (event.key == this.downKey) {
|
||||
this.moveDown();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
class Ball {
|
||||
constructor(x, y, radius, color, speed) {
|
||||
this.x = x;
|
||||
this.y = y;
|
||||
this.radius = radius;
|
||||
this.color = color;
|
||||
this.horizontal_speed = speed;
|
||||
this.vertical_speed = speed;
|
||||
this.angle = Math.random() * 2 * Math.PI;
|
||||
}
|
||||
|
||||
reset() {
|
||||
this.angle = Math.random() * 2 * Math.PI;
|
||||
this.x = 450;
|
||||
this.y = 250;
|
||||
this.horizontal_speed = 5;
|
||||
this.vertical_speed = 5;
|
||||
}
|
||||
|
||||
draw(ctx) {
|
||||
ctx.beginPath();
|
||||
ctx.arc(this.x, this.y, this.radius, 0, 2 * Math.PI);
|
||||
ctx.fillStyle = this.color;
|
||||
ctx.fill();
|
||||
}
|
||||
|
||||
move() {
|
||||
this.x += this.horizontal_speed * getCosinus(this.angle);
|
||||
this.y += this.vertical_speed * getSinus(this.angle);
|
||||
}
|
||||
}
|
||||
|
||||
class Game {
|
||||
constructor(background_color, circle_color) {
|
||||
this.background_color = background_color;
|
||||
this.circle_color = circle_color;
|
||||
this.canvas = document.createElement("canvas");
|
||||
this.canvas.width = 900;
|
||||
this.canvas.height = 500;
|
||||
this.canvas.style.border = "5px solid #44475a";
|
||||
this.canvas.style.borderRadius = "10px";
|
||||
this.canvas.style.margin = "auto";
|
||||
this.canvas.style.display = "block";
|
||||
this.canvas.style.width = "70%";
|
||||
document.body.appendChild(this.canvas);
|
||||
this.ctx = this.canvas.getContext("2d");
|
||||
this.ball = new Ball(450, 250, 20, this.circle_color, 5);
|
||||
this.Player1 = new Player(10, 0, 20, 100, "white", 15, "z", "s");
|
||||
this.Player2 = new Player(
|
||||
870,
|
||||
0,
|
||||
20,
|
||||
100,
|
||||
"white",
|
||||
15,
|
||||
"ArrowUp",
|
||||
"ArrowDown"
|
||||
);
|
||||
}
|
||||
|
||||
colorBackground() {
|
||||
this.ctx.fillStyle = this.background_color;
|
||||
this.ctx.fillRect(0, 0, 900, 500);
|
||||
this.ctx.fillStyle = "white";
|
||||
this.ctx.font = "30px Arial";
|
||||
this.ctx.fillText(this.Player1.points, 100, 50);
|
||||
this.ctx.fillText(this.Player2.points, 800, 50);
|
||||
}
|
||||
|
||||
draw() {
|
||||
this.ball.draw(this.ctx);
|
||||
this.Player1.draw(this.ctx);
|
||||
this.Player2.draw(this.ctx);
|
||||
}
|
||||
|
||||
colision() {
|
||||
// Player collisions
|
||||
if (
|
||||
this.ball.x + this.ball.radius >= this.Player2.x &&
|
||||
this.ball.y >= this.Player2.y &&
|
||||
this.ball.y <= this.Player2.y + this.Player2.height
|
||||
) {
|
||||
this.ball.horizontal_speed *= -1;
|
||||
}
|
||||
|
||||
if (
|
||||
this.ball.x - this.ball.radius <=
|
||||
this.Player1.x + this.Player1.width &&
|
||||
this.ball.y >= this.Player1.y &&
|
||||
this.ball.y <= this.Player1.y + this.Player1.height
|
||||
) {
|
||||
this.ball.horizontal_speed *= -1;
|
||||
}
|
||||
// Wall collisions
|
||||
if (
|
||||
this.ball.x + this.ball.radius >= 900 ||
|
||||
this.ball.x - this.ball.radius <= 0
|
||||
) {
|
||||
if (this.ball.x + this.ball.radius >= 900) {
|
||||
this.Player1.points += 1;
|
||||
} else {
|
||||
this.Player2.points += 1;
|
||||
}
|
||||
this.ball.reset();
|
||||
}
|
||||
if (
|
||||
this.ball.y + this.ball.radius >= 500 ||
|
||||
this.ball.y - this.ball.radius <= 0
|
||||
) {
|
||||
this.ball.vertical_speed *= -1;
|
||||
}
|
||||
}
|
||||
|
||||
step() {
|
||||
this.colorBackground();
|
||||
this.draw();
|
||||
this.ball.move();
|
||||
this.colision();
|
||||
this.Player1.y = this.ball.y - this.Player1.height / 2;
|
||||
this.Player2.y = this.ball.y - this.Player2.height / 2;
|
||||
}
|
||||
}
|
||||
|
||||
const game = new Game("#282a36", "#6272a4");
|
||||
|
||||
document.addEventListener("keypress", function (event) {
|
||||
game.Player1.move(event);
|
||||
});
|
||||
document.addEventListener("keydown", function (event) {
|
||||
game.Player2.move(event);
|
||||
});
|
||||
|
||||
setInterval(() => game.step(), 1);
|
||||
231
projects/snake.html
Normal file
231
projects/snake.html
Normal file
@ -0,0 +1,231 @@
|
||||
<!doctype html>
|
||||
<body style="background-color: #282a36; margin: 0; width: 100vw; height: 100vh">
|
||||
<h2
|
||||
id="status"
|
||||
style="
|
||||
color: white;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
text-align: center;
|
||||
"
|
||||
></h2>
|
||||
<canvas
|
||||
style="
|
||||
border-radius: 10px;
|
||||
display: flex;
|
||||
margin: auto;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
"
|
||||
id="canvas"
|
||||
></canvas>
|
||||
</body>
|
||||
<script>
|
||||
class Game {
|
||||
constructor() {
|
||||
const { width, height } = document
|
||||
.getElementById("canvas")
|
||||
.getBoundingClientRect();
|
||||
document.getElementById("canvas").setAttribute("width", width);
|
||||
document.getElementById("canvas").setAttribute("height", height);
|
||||
this.boxSize = 15;
|
||||
this.canvasWidth = width;
|
||||
this.canvasHeight = height;
|
||||
this.p = 0;
|
||||
this.score = 0;
|
||||
this.board = new Board(
|
||||
this.canvasWidth,
|
||||
this.canvasHeight,
|
||||
this.boxSize,
|
||||
this.p,
|
||||
);
|
||||
this.snake = new Snake(0, 0);
|
||||
this.apple = new Apple(0, 0);
|
||||
this.gridWidth = this.canvasWidth / this.boxSize;
|
||||
this.gridHeight = this.canvasHeight / this.boxSize;
|
||||
this.LastInput = "ArrowDown";
|
||||
this.input = "ArrowDown";
|
||||
}
|
||||
|
||||
init() {
|
||||
let x = Math.floor(Math.random() * this.gridWidth);
|
||||
let y = Math.floor(Math.random() * this.gridHeight);
|
||||
this.apple.position = [x, y];
|
||||
this.board.drawBoard();
|
||||
document.addEventListener("keydown", (event) => {
|
||||
const keyName = event.key;
|
||||
if (
|
||||
keyName === "ArrowUp" ||
|
||||
keyName === "ArrowDown" ||
|
||||
keyName === "ArrowLeft" ||
|
||||
keyName === "ArrowRight"
|
||||
) {
|
||||
this.input = keyName;
|
||||
}
|
||||
});
|
||||
this.update();
|
||||
}
|
||||
|
||||
computeMovement(keypressed) {
|
||||
this.snake.tail.push(this.snake.head);
|
||||
if (
|
||||
(keypressed === "ArrowUp" && this.LastInput == "ArrowDown") ||
|
||||
(keypressed === "ArrowDown" && this.LastInput == "ArrowUp") ||
|
||||
(keypressed === "ArrowLeft" &&
|
||||
this.LastInput == "ArrowRight") ||
|
||||
(keypressed === "ArrowRight" && this.LastInput == "ArrowLeft")
|
||||
) {
|
||||
keypressed = this.LastInput;
|
||||
} else {
|
||||
this.LastInput = keypressed;
|
||||
}
|
||||
switch (keypressed) {
|
||||
case "ArrowUp":
|
||||
this.snake.head = [
|
||||
this.snake.head[0],
|
||||
this.snake.head[1] - 1,
|
||||
];
|
||||
break;
|
||||
case "ArrowDown":
|
||||
this.snake.head = [
|
||||
this.snake.head[0],
|
||||
this.snake.head[1] + 1,
|
||||
];
|
||||
break;
|
||||
case "ArrowLeft":
|
||||
this.snake.head = [
|
||||
this.snake.head[0] - 1,
|
||||
this.snake.head[1],
|
||||
];
|
||||
break;
|
||||
case "ArrowRight":
|
||||
this.snake.head = [
|
||||
this.snake.head[0] + 1,
|
||||
this.snake.head[1],
|
||||
];
|
||||
break;
|
||||
default:
|
||||
console.log("Should not happen");
|
||||
break;
|
||||
}
|
||||
if (
|
||||
this.snake.head[0] >= this.gridWidth ||
|
||||
this.snake.head[0] < 0 ||
|
||||
this.snake.head[1] >= this.gridHeight ||
|
||||
this.snake.head[1] < 0
|
||||
)
|
||||
this.dead = true;
|
||||
|
||||
this.snake.tail.forEach((box) => {
|
||||
if (
|
||||
box[0] === this.snake.head[0] &&
|
||||
box[1] === this.snake.head[1]
|
||||
) {
|
||||
this.dead = true;
|
||||
}
|
||||
});
|
||||
|
||||
if (
|
||||
this.snake.head[0] === this.apple.position[0] &&
|
||||
this.snake.head[1] === this.apple.position[1]
|
||||
) {
|
||||
this.snake.tailLenght++;
|
||||
this.score++;
|
||||
let x = Math.floor(Math.random() * this.gridWidth);
|
||||
let y = Math.floor(Math.random() * this.gridHeight);
|
||||
this.apple.position = [x, y];
|
||||
}
|
||||
|
||||
while (this.snake.tail.length > this.snake.tailLenght) {
|
||||
this.snake.tail.shift(0);
|
||||
}
|
||||
}
|
||||
|
||||
update() {
|
||||
this.computeMovement(this.input);
|
||||
this.board.clear();
|
||||
//this.board.drawScore(this.score);
|
||||
this.board.drawSnake(this.snake);
|
||||
this.board.drawApple(this.apple);
|
||||
this.board.drawBoard();
|
||||
if (!this.dead)
|
||||
setTimeout(() => {
|
||||
this.update();
|
||||
}, 100);
|
||||
else {
|
||||
document.getElementById("status").textContent =
|
||||
"PERDU, n'hesite pas a recommencer :)";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
class Apple {
|
||||
constructor(x, y) {
|
||||
this.color = "#6272a4";
|
||||
this.position = [x, y];
|
||||
}
|
||||
}
|
||||
|
||||
class Snake {
|
||||
constructor(x, y) {
|
||||
this.color = "#bd93f9";
|
||||
this.head = [x, y];
|
||||
this.tailLenght = 1;
|
||||
this.tail = [[x, y]];
|
||||
}
|
||||
}
|
||||
|
||||
class Board {
|
||||
constructor(canvasWidth, canvasHeight, boxSize, padding) {
|
||||
this.canvasWidth = canvasWidth;
|
||||
this.canvasHeight = canvasHeight;
|
||||
this.boxSize = boxSize;
|
||||
this.p = padding;
|
||||
this.canvas = document.getElementById("canvas");
|
||||
this.context = canvas.getContext("2d");
|
||||
}
|
||||
clear() {
|
||||
this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
|
||||
}
|
||||
drawBoard() {
|
||||
for (let x = 0; x <= this.canvasWidth; x += this.boxSize) {
|
||||
this.context.moveTo(0 + x + this.p, this.p);
|
||||
this.context.lineTo(0 + x + this.p, this.canvasHeight + this.p);
|
||||
}
|
||||
|
||||
for (let x = 0; x <= this.canvasHeight; x += this.boxSize) {
|
||||
this.context.moveTo(this.p, 0 + x + this.p);
|
||||
this.context.lineTo(this.canvasWidth + this.p, 0 + x + this.p);
|
||||
}
|
||||
this.context.strokeStyle = "#44475a";
|
||||
this.context.stroke();
|
||||
}
|
||||
fillBox(x, y, color) {
|
||||
this.context.fillStyle = color;
|
||||
this.context.fillRect(
|
||||
x * this.boxSize + this.p,
|
||||
y * this.boxSize + this.p,
|
||||
this.boxSize,
|
||||
this.boxSize,
|
||||
);
|
||||
}
|
||||
drawScore(score) {
|
||||
this.context.font = "200px serif";
|
||||
this.context.strokeText(score, 280, 370);
|
||||
}
|
||||
drawApple(apple) {
|
||||
this.fillBox(apple.position[0], apple.position[1], apple.color);
|
||||
}
|
||||
drawSnake(snake) {
|
||||
this.fillBox(snake.head[0], snake.head[1], snake.color);
|
||||
snake.tail.forEach((box) => {
|
||||
this.fillBox(box[0], box[1], snake.color);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
g = new Game();
|
||||
g.init();
|
||||
</script>
|
||||
@ -0,0 +1,56 @@
|
||||
<!doctype html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<title>Super Space Invader : Turbo Apocalypse DELUXE VS. GOD</title>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="stylesheet" href="/static/style.css" />
|
||||
<script src="/static/js/utils.js" defer></script>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
||||
/>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div class="links">
|
||||
<a href="/" class="header_button">Home Page</a>
|
||||
<a href="/projects.html" class="header_button">Projets</a>
|
||||
<a href="/about.html" class="header_button">A propos de moi</a>
|
||||
<a href="/quizz" class="header_button">Vibe check</a>
|
||||
<a href="https://djalim.fr" class="header_button">Blog Perso</a>
|
||||
</div>
|
||||
<button
|
||||
id="display_header_links"
|
||||
onclick="toggle_all_header_links()"
|
||||
>
|
||||
▼
|
||||
</button>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<h1>Super Space Invader : Turbo Apocalypse DELUXE VS. GOD</h1>
|
||||
<img src="/static/assets/images/ssitadvg.png" style="width: 80%" />
|
||||
Super space invader : tadbvs is a space invader clone made in C++
|
||||
and mingl as a graphic library
|
||||
<p>
|
||||
<br />
|
||||
It has a two sets of sprites and features God, He break the
|
||||
fourth wall and sends aliens straight at you.
|
||||
</p>
|
||||
<img src="/static/assets/images/mainMenu.png" />
|
||||
<img src="/static/assets/images/gameplay.png" />
|
||||
<a
|
||||
href="https://git.djalim.fr/DjalimSimaila/SuperSpaceInvaderTurboApocalypseVsGOD"
|
||||
><u>source code</u></a
|
||||
>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<p>
|
||||
Fait par Djalim Simaila et sa haine de l'HTML, CSS, mais pas du
|
||||
JavaScript ♥️
|
||||
</p>
|
||||
<p>©2025</p>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
102
quizz.html
Normal file
102
quizz.html
Normal file
@ -0,0 +1,102 @@
|
||||
<!doctype html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<title>Quizz</title>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="stylesheet" href="/static/style.css" />
|
||||
<script src="/static/js/utils.js" defer></script>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
||||
/>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div class="links">
|
||||
<a href="/" class="header_button">Home Page</a>
|
||||
<a href="/projects.html" class="header_button">Projets</a>
|
||||
<a href="/about.html" class="header_button">A propos de moi</a>
|
||||
<a href="/quizz" class="header_button">Vibe check</a>
|
||||
<a href="https://djalim.fr" class="header_button">Blog Perso</a>
|
||||
</div>
|
||||
<button
|
||||
id="display_header_links"
|
||||
onclick="toggle_all_header_links()"
|
||||
>
|
||||
▼
|
||||
</button>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<h1>Vibe Check</h1>
|
||||
<form name="vibe" action="javascript:;" onsubmit="validate()">
|
||||
<p>First you need to introduce yourself</p>
|
||||
<label for="fname">First name:</label>
|
||||
<input type="text" id="fname" name="fname" /><br />
|
||||
<label for="lname">Last name:</label>
|
||||
<input type="text" id="lname" name="lname" /><br />
|
||||
<label for="birth">birthdate:</label>
|
||||
<input type="text" id="birth" name="birth" /><br />
|
||||
<label for="email">email:</label>
|
||||
<input type="text" id="email" name="email" /><br />
|
||||
<label for="phone">phone number:</label>
|
||||
<input type="text" id="phone" name="phone" /><br />
|
||||
<p>Now, answer thoses questions</p>
|
||||
<label for="os-select">What's your os ?</label>
|
||||
<select name="os-select" id="os-select">
|
||||
<option value="linux">Linux based os</option>
|
||||
<option value="windows">Windows</option>
|
||||
<option value="macos">MacOs</option>
|
||||
<option value="god's os">TempleOs</option>
|
||||
<option value="tetrisos">TetrisOs</option>
|
||||
</select>
|
||||
<br />
|
||||
<p>Who created Minecraft ?</p>
|
||||
<input type="radio" id="db" name="mc_creator" value="db" />
|
||||
<label for="html">DinnerBone</label><br />
|
||||
<input type="radio" id="jeb" name="mc_creator" value="jeb" />
|
||||
<label for="css">Jeb</label><br />
|
||||
<input
|
||||
type="radio"
|
||||
id="notch"
|
||||
name="mc_creator"
|
||||
value="notch"
|
||||
/>
|
||||
<label for="css">Notch</label><br />
|
||||
<input type="radio" id="miku" name="mc_creator" value="miku" />
|
||||
<label for="javascript">Hatsune Miku</label>
|
||||
<br />
|
||||
<br />
|
||||
<label for="phone">What is the best vocaloid song</label><br />
|
||||
<input type="text" id="voca" name="voca" /><br />
|
||||
<label for="phone">What is your worth in euro</label><br />
|
||||
<input type="number" id="worth" name="worth" />
|
||||
<br /><br />
|
||||
<a class="header_button" href="https://humainavendre.com/"
|
||||
>Calculate it here</a
|
||||
>
|
||||
<br />
|
||||
<label for="sns-select">Best social media app ?</label>
|
||||
<select name="sns-select" id="sns-select">
|
||||
<option value="Twitter">Twitter</option>
|
||||
<option value="X">X</option>
|
||||
<option value="Facebook">Facebook</option>
|
||||
<option value="My Space">Myspace</option>
|
||||
<option value="Club Pinguin">Club Pinguin</option>
|
||||
<option value="TikTok">TikTok</option></select
|
||||
><br />
|
||||
<button type="submit" value="Submit">
|
||||
Pass the vibe check
|
||||
</button>
|
||||
</form>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<p>
|
||||
Fait par Djalim Simaila et sa haine de l'HTML, CSS, mais pas du
|
||||
JavaScript ♥️
|
||||
</p>
|
||||
<p>©2025</p>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
BIN
static/CV 2025.pdf
Normal file
BIN
static/CV 2025.pdf
Normal file
Binary file not shown.
BIN
static/assets/images/Map.png
Normal file
BIN
static/assets/images/Map.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 321 KiB |
BIN
static/assets/images/gameplay.png
Normal file
BIN
static/assets/images/gameplay.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 493 KiB |
BIN
static/assets/images/lcsededbevdrfnoftsmlp.png
Normal file
BIN
static/assets/images/lcsededbevdrfnoftsmlp.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 MiB |
BIN
static/assets/images/mainMenu.png
Normal file
BIN
static/assets/images/mainMenu.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 263 KiB |
BIN
static/assets/images/pycord menu.png
Normal file
BIN
static/assets/images/pycord menu.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
BIN
static/assets/images/ssitadvg.png
Normal file
BIN
static/assets/images/ssitadvg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 862 KiB |
@ -149,6 +149,7 @@ function processSpin() {
|
||||
delete qualifyingNumbers[number];
|
||||
}
|
||||
}
|
||||
console.log(spinArray[currentSpin]);
|
||||
console.log(potentialQualifyingNumbers);
|
||||
console.log(qualifyingNumbers);
|
||||
console.log(winingNumbers);
|
||||
@ -183,7 +184,10 @@ function showReport() {
|
||||
gains += number[1];
|
||||
});
|
||||
|
||||
document.getElementById("winrate").textContent = winrate;
|
||||
document.getElementById("winpercentage").textContent = winpercentage;
|
||||
document.getElementById("nbq").textContent =
|
||||
"Number of qualifying numbers : " + numberOfQualifying;
|
||||
document.getElementById("winrate").textContent = "wirate : " + winrate;
|
||||
document.getElementById("winpercentage").textContent =
|
||||
"win percentage : " + winpercentage;
|
||||
document.getElementById("gains").textContent = gains;
|
||||
}
|
||||
|
||||
@ -13,3 +13,66 @@ function toggle_all_header_links() {
|
||||
? "▲"
|
||||
: "▼";
|
||||
}
|
||||
|
||||
function validate() {
|
||||
let fname = document.getElementById("fname").value.trim();
|
||||
let lname = document.getElementById("lname").value.trim();
|
||||
let birth = document.getElementById("birth").value.trim();
|
||||
let email = document.getElementById("email").value.trim();
|
||||
let phone = document.getElementById("phone").value.trim();
|
||||
let mcCreator = document.querySelector("input[name='mc_creator']:checked");
|
||||
let worth = document.getElementById("worth").value.trim();
|
||||
|
||||
let emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
||||
let phonePattern = /^\+?[0-9]{7,15}$/;
|
||||
let birthPattern = /^(\d{4})-(\d{2})-(\d{2})$/; // Format YYYY-MM-DD
|
||||
|
||||
if (fname === "" || lname === "") {
|
||||
alert("First name and last name are required.");
|
||||
return;
|
||||
}
|
||||
|
||||
if (!birthPattern.test(birth)) {
|
||||
alert("Please enter a valid birthdate in YYYY-MM-DD format.");
|
||||
return;
|
||||
}
|
||||
|
||||
if (!emailPattern.test(email)) {
|
||||
alert("Please enter a valid email address.");
|
||||
return;
|
||||
}
|
||||
|
||||
if (!phonePattern.test(phone)) {
|
||||
alert("Please enter a valid phone number.");
|
||||
return;
|
||||
}
|
||||
|
||||
if (!mcCreator) {
|
||||
alert("Please select the creator of Minecraft.");
|
||||
return;
|
||||
}
|
||||
|
||||
if (worth === "" || isNaN(worth) || worth < 0) {
|
||||
alert("Please enter a valid worth in euros.");
|
||||
return;
|
||||
}
|
||||
calculateScore();
|
||||
}
|
||||
function calculateScore() {
|
||||
let score = 0;
|
||||
let os = document.getElementById("os-select").value;
|
||||
let mcCreator = document.querySelector(
|
||||
"input[name='mc_creator']:checked",
|
||||
).value;
|
||||
let voca = document.getElementById("voca").value.trim().toLowerCase();
|
||||
let worth = parseFloat(document.getElementById("worth").value);
|
||||
let sns = document.getElementById("sns-select").value;
|
||||
|
||||
if (os === "linux") score += 1;
|
||||
if (mcCreator === "miku") score += 1;
|
||||
if (voca === "electric angel") score += 1;
|
||||
if (worth > 5000000) score += 1;
|
||||
if (sns === "Twitter") score += 1;
|
||||
|
||||
alert("Your score is: " + score + "/5");
|
||||
}
|
||||
|
||||
BIN
static/rapport.pdf
Normal file
BIN
static/rapport.pdf
Normal file
Binary file not shown.
@ -38,6 +38,14 @@ ul {
|
||||
}
|
||||
}
|
||||
|
||||
hr {
|
||||
margin: 1rem 0;
|
||||
border: none;
|
||||
border-top: solid 1px var(--color-text);
|
||||
min-width: 80px;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
body {
|
||||
color: var(--color-text);
|
||||
display: flex;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user