feat: devweb - update index.html to index.jsp

This commit is contained in:
kmitresse
2024-06-12 18:38:45 +02:00
parent 59daaec37d
commit adbb673045
6 changed files with 51 additions and 116 deletions
@@ -14,7 +14,7 @@ import jakarta.servlet.http.HttpServletResponse;
import java.io.IOException;
import uppa.project.web.translation.Translator;
@WebServlet(name = "indexServlet", value = "/index")
@WebServlet(name = "indexServlet", value = {"/index"})
public class IndexServlet extends HttpServlet {
public void init() {
@@ -33,7 +33,6 @@ public class IndexServlet extends HttpServlet {
request.getSession().setAttribute("language", "FR");
request.getSession().setAttribute("translator", Translator.generateTranslator(request.getSession(), request.getServletContext()));
}
request.setAttribute("current", "index");
request.getRequestDispatcher("/WEB-INF/pages/index.jsp").forward(request, response);
}
@@ -1,23 +1,30 @@
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ page import="uppa.project.Global" %>
<%@ page import="uppa.project.web.translation.Translator" %>
<%@ page import="java.text.MessageFormat" %>
<%@taglib prefix="layout" tagdir="/WEB-INF/tags/layouts" %>
<%@taglib prefix="component" tagdir="/WEB-INF/tags/components" %>
<%@taglib prefix="form" tagdir="/WEB-INF/tags/forms" %>
<% Translator translator =(Translator)session.getAttribute("translator");%>
<layout:base title="Accueil">
<component:hero>
<p class="title is-2 mb-4 has-text-white">Plongez dans l'excitation de ${Global.APP_NAME}!</p>
<p style="max-width: 30em;" class="mb-6 subtitle has-text-white">
Défiez votre réactivité et dominez le jeu avec des amis dans cette course effrénée aux cartes !
Rejoignez maintenant pour vivre l'adrénaline.
</p>
<jsp:attribute name="head">
<script defer type="module" src="${pageContext.request.contextPath}/static/js/rewriteUrl.js"></script>
</jsp:attribute>
<jsp:body>
<component:hero>
<p class="title is-2 mb-4 has-text-white">${MessageFormat.format(translator.translate('index_main_sentence'), Global.APP_NAME)}</p>
<p style="max-width: 30em;" class="mb-6 subtitle has-text-white">
${MessageFormat.format(translator.translate('index_description'), Global.APP_NAME)}
</p>
<div class="buttons">
<a class="button is-light is-primary is-large" href="${pageContext.request.contextPath}/register">S'inscrire</a>
<a class="button is-primary is-large has-text-white" href="${pageContext.request.contextPath}/login">
Se connecter
</a>
</div>
</component:hero>
<div class="buttons">
<a class="button is-light is-primary is-large" href="${pageContext.request.contextPath}/register">${translator.translate('register_title')}</a>
<a class="button is-primary is-large has-text-white" href="${pageContext.request.contextPath}/login">
${translator.translate('login_title')}
</a>
</div>
</component:hero>
</jsp:body>
</layout:base>
@@ -13,7 +13,7 @@
<% } else { %>
<a class="navbar-item" href="${pageContext.request.contextPath}/">
<a class="navbar-item" href="${pageContext.request.contextPath}/index">
<img src="${pageContext.request.contextPath}/static/img/CardsRushLogoBlack.svg" height="260" alt="Logo">
</a>
@@ -1,11 +1,11 @@
{
"index_main" : {
"EN" : "Dive into the excitement of CardRush!",
"FR" : "Plongez dans l'excitation de CardRush!"
"index_main_sentence" : {
"EN": "Dive into the excitement of {0}!",
"FR" : "Plongez dans l''excitation de {0}!"
},
"index_description" : {
"EN": "Challenge your reactivity and dominate the game with friends in this fast-paced card race! Join now to experience the adrenaline.",
"FR": "Défiez votre réactivité et dominez le jeu avec des amis dans cette course effrénée aux cartes ! Rejoignez maintenant pour vivre l'adrénaline."
"EN": "Challenge your reactivity and dominate the game with friends in this fast-paced card race! Join now to experience the adrenaline of {0}.",
"FR": "Défiez votre réactivité et dominez le jeu avec des amis dans cette course effrénée aux cartes ! Rejoignez maintenant pour vivre l''adrénaline de {0}."
},
"navbar_login" : {
"EN": "Login",
@@ -23,6 +23,10 @@
"EN": "Profile",
"FR": "Profil"
},
"footer" : {
"EN": "<strong>{0}</strong> by Kevin Mitressé & Lucàs Vabre. UPPA M1-TI 2024",
"FR": "<strong>{0}</strong> par Kevin Mitressé & Lucàs Vabre. UPPA M1-TI 2024"
},
"user_username" : {
"EN": "Username",
"FR": "Nom d'utilisateur"
@@ -484,8 +488,8 @@
"FR": "Salle de jeu"
},
"game_room_players_list" : {
"EN": "Players list in the game",
"FR": "Liste des joueurs dans la partie"
"EN": "List of participants",
"FR": "Liste des participants"
},
"game_room_connected_users_list" : {
"EN": "List of connected users",
+5 -91
View File
@@ -1,97 +1,11 @@
<!DOCTYPE html>
<html class="has-navbar-fixed-top">
<head>
<title>Card Rush</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@1.0.0/css/bulma.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css">
<style>
:root {
--bulma-primary-h: 0;
--bulma-primary-s: 70%;
--bulma-primary-l: 35%;
}
.hero {
background: url("/project_war_exploded/static/img/Home.svg") lightgray 50% / cover no-repeat;
}
</style>
</head>
<script defer type="text/javascript">
let contextPath = window.location.href.substring(0, window.location.href.lastIndexOf("/") + 1);
console.log(contextPath);
window.location.href = contextPath + "index";
</script></head>
<body>
<nav class="navbar is-fixed-top" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a class="navbar-item" href="/project_war_exploded/">
<img src="/project_war_exploded/static/img/CardsRushLogoBlack.svg" height="260">
</a>
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="navbarMenu">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="navbarMenu" class="navbar-menu">
<div class="navbar-end">
<div class="navbar-item">
<a href="/project_war_exploded/register" class="is-fullwidth button is-primary has-text-white">Inscription</a>
</div>
<div class="navbar-item">
<a href="/project_war_exploded/login" class="is-fullwidth button is-light">Connexion</a>
</div>
</div>
</div>
</nav>
<script type="module" defer>
// Récupération de tous les éléments de classe "navbar-burger"
const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);
// Ajout d'un eventListener sur chaque élément
$navbarBurgers.forEach(el => {
el.addEventListener('click', () => {
// Récupération de la cible à partir de l'attribut "data-target"
const target = el.dataset.target;
const $target = document.getElementById(target);
// Toggle de la classe "is-active" sur les éléments
el.classList.toggle('is-active');
$target.classList.toggle('is-active');
});
});
</script>
<section class="hero is-primary is-fullheight-with-navbar">
<div class="hero-body">
<div class="container">
<p class="title is-2 mb-4 has-text-white">Plongez dans l'excitation de CardRush!</p>
<p style="max-width: 30em;" class="mb-6 subtitle has-text-white ">Défiez votre réactivité et dominez le jeu avec des amis dans cette course effrénée aux cartes ! Rejoignez maintenant pour vivre l'adrénaline.</p>
<div class="buttons">
<a class="button is-light is-primary is-large" href="/project_war_exploded/register">S'inscrire</a>
<a class="button is-primary is-large has-text-white" href="/project_war_exploded/login">Se connecter</a>
</div>
</div>
</div>
</section>
<footer class="footer">
<div class="content has-text-centered">
<p>
<strong>Cards Rush</strong> par Kevin Mitressé & Lucàs Vabre. UPPA M1-TI 2024
</p>
</div>
</footer>
</body>
</html>
@@ -0,0 +1,11 @@
function updateUrl(url) {
// Mettre à jour l'URL sans recharger la page
history.replaceState(null, null, url);
}
let contextPath = window.location.href.substring(0, window.location.href.lastIndexOf("/") + 1);
console.log(contextPath);
// Mettre à jour l'URL initiale au chargement de la page
updateUrl(contextPath);