Nouvelle version, simplifiée
This commit is contained in:
BIN
public/.DS_Store
vendored
Normal file
BIN
public/.DS_Store
vendored
Normal file
Binary file not shown.
BIN
public/Minecraft.ttf
Normal file
BIN
public/Minecraft.ttf
Normal file
Binary file not shown.
BIN
public/minecraft_logo_icon_168974.png
Normal file
BIN
public/minecraft_logo_icon_168974.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 92 KiB |
6
public/script.js
Normal file
6
public/script.js
Normal file
@@ -0,0 +1,6 @@
|
||||
|
||||
function afficherLaSuite() {
|
||||
document.getElementById("nouveau-participant").setAttribute("type", "text");
|
||||
document.getElementById("bouton-continuer").setAttribute("display", "inline");
|
||||
}
|
||||
|
||||
@@ -1,16 +1,38 @@
|
||||
@font-face {
|
||||
font-family: 'Minecraft';
|
||||
src: url('Minecraft.ttf') format('truetype');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.titre, .sous-titre {
|
||||
font-family: 'Poppins', Geneva, Verdana, sans-serif;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.titre {
|
||||
font-size: xx-large;
|
||||
font-weight: bold;
|
||||
color: red;
|
||||
}
|
||||
|
||||
.sous-titre {
|
||||
color: #6c757d
|
||||
}
|
||||
|
||||
.tableau ul {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
text-align: left;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.tableau li {
|
||||
width: 80px;
|
||||
}
|
||||
.tableau li:nth-child(2) {
|
||||
.tableau li:nth-child(1) {
|
||||
width: 200px;
|
||||
}
|
||||
.tableau li:nth-child(3) {
|
||||
.tableau li:nth-child(2) {
|
||||
width: 20px;
|
||||
}
|
||||
.tableau li {
|
||||
@@ -18,12 +40,14 @@
|
||||
list-style-type: none;
|
||||
padding: 0px 4px;
|
||||
align-self: center;
|
||||
text-align: left;
|
||||
}
|
||||
figure {
|
||||
margin: 4px 0px !important;
|
||||
}
|
||||
|
||||
.tableau li a:link {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.tableau ul:nth-child(even) {
|
||||
background-color: #fff3f3;
|
||||
@@ -58,13 +82,14 @@ ul > li > a {
|
||||
|
||||
img {
|
||||
height: 80px !important;
|
||||
transition: transform .1s;
|
||||
transition: transform .4s;
|
||||
}
|
||||
|
||||
img:hover{
|
||||
img:hover {
|
||||
-ms-transform: scale(5); /* IE 9 */
|
||||
-webkit-transform: scale(5); /* Safari 3-8 */
|
||||
transform: scale(5);
|
||||
transition: .4s;
|
||||
}
|
||||
|
||||
.offrants {
|
||||
@@ -85,3 +110,37 @@ img:hover{
|
||||
text-align: center;
|
||||
font-size: x-large;
|
||||
}
|
||||
|
||||
.participant {
|
||||
width: 200px;
|
||||
margin-top: 15px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
/* Résultats du vote */
|
||||
.general {
|
||||
width: 70%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: lightgreen;
|
||||
}
|
||||
|
||||
.logo img {
|
||||
margin: 15px;
|
||||
transition: none !important;
|
||||
transform: none !important;
|
||||
}
|
||||
|
||||
.emoticon {
|
||||
font-size: 78px;
|
||||
margin: 15px;
|
||||
}
|
||||
|
||||
.vote {
|
||||
width: inherit;
|
||||
font-family: "Minecraft";
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
margin-top: 25px;;
|
||||
}
|
||||
@@ -1,67 +1,35 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Cadeaux de Noël pour Louisa</title>
|
||||
<link rel="stylesheet" href="/styles.css">
|
||||
<title>Notre liste d'envies</title>
|
||||
<link rel="stylesheet" href="../styles.css">
|
||||
<link href="/css/bootstrap.min.css" rel="stylesheet">
|
||||
</head>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container mt-4">
|
||||
<div class="mt-4 p-5 bg-danger text-white rounded">
|
||||
<h1>Liste des cadeaux pour Louisa</h1>
|
||||
<p>{{ message }}</p>
|
||||
</div>
|
||||
<p class="titre">Notre liste d'envies</p>
|
||||
<p class="sous-titre">A court d'idée pour un cadeau ? De quoi vous inspirer...</p>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
|
||||
<div class="tableau">
|
||||
<ul style="display: none">
|
||||
<li> </li>
|
||||
<li> </li>
|
||||
<li> </li>
|
||||
<li>Qui va l'offrir ?</li>
|
||||
<li>Statut</li>
|
||||
<li>Noël ou son anniv' ?</li>
|
||||
<li>Emballé ?</li>
|
||||
</ul>
|
||||
{{#each cadeaux}}
|
||||
<ul>
|
||||
<li><a href="{{this.lien}}" target="_blank">Voir le produit</a></li>
|
||||
<li>
|
||||
<figure class="figure">
|
||||
<img src="{{this.photo}}" class="figure-img img-fluid rounded" alt="Pas d'image" ob>
|
||||
<figcaption class="figure-caption">{{this.libelle}}</figcaption>
|
||||
<figcaption class="figure-caption"><a href="{{this.lien}}" target="_blank">{{this.libelle}}</a></figcaption>
|
||||
</figure>
|
||||
</li>
|
||||
<li>{{this.prix}} €</li>
|
||||
<li>{{#if this.acheteur}}{{this.acheteur}}
|
||||
<li>{{#if this.acheteur}}Réservé par {{this.acheteur}}
|
||||
{{else}}<a href="/choix-offrant?cadeau={{this.id}}" class="btn">Le réserver</a>{{/if}}
|
||||
</li>
|
||||
<li>
|
||||
<div class="form-check form-switch">
|
||||
{{#if this.achete}}
|
||||
<label class="form-check-label">Déja acheté{{#equals this.responsableAchat "Les parents"}}{{#unless this.paye}}<br>A rembourser{{/unless}}{{/equals}}</label>
|
||||
{{else}}
|
||||
<label class="form-check-label">A acheter{{#equals this.responsableAchat "Les parents"}}{{#unless this.paye}}<br>A rembourser{{/unless}}{{/equals}}</label>
|
||||
{{/if}}
|
||||
</div>
|
||||
<li>{{#if this.pourNoel}}Noël{{else}}Anniversaire{{/if}}</li>
|
||||
<li>
|
||||
{{#if this.achete}}
|
||||
{{#if this.emballe}}
|
||||
<label class="form-check-label">Emballé</label>
|
||||
{{else}}
|
||||
<label class="form-check-label"><b>A emballer</b></label>
|
||||
{{/if}}
|
||||
{{else}}
|
||||
|
||||
{{/if}}
|
||||
</li>
|
||||
</ul>
|
||||
{{/each}}
|
||||
</div>
|
||||
|
||||
@@ -1,30 +1,31 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Qui êtes-vous ?</title>
|
||||
<title>Réservation pour Louisa</title>
|
||||
<link rel="stylesheet" href="/styles.css">
|
||||
<link href="/css/bootstrap.min.css" rel="stylesheet">
|
||||
<script src="/js/script.js"></script>
|
||||
</head>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container mt-4">
|
||||
<div class="mt-4 p-5 bg-danger text-white rounded">
|
||||
<h1>Qui êtes-vous ?</h1>
|
||||
<div class="mt-4 p-3 bg-danger text-white rounded">
|
||||
<h1>Qui es-tu ?</h1>
|
||||
<p>{{ message }}</p>
|
||||
</div>
|
||||
<input type="hidden" name="cadeau" id="cadeau-reg" value="{{cadeau}}">
|
||||
<div class="card" style="width: 30rem;">
|
||||
<div class="card-body">
|
||||
{{#each listeOffrants}}
|
||||
<div class="mb-3">
|
||||
<a href="reservation?cadeau={{../cadeau}}&offrant={{this.id}}" class="btn btn-primary offrants">{{this.prenom}}</a>
|
||||
<div class="saisie-offrant">
|
||||
<form action="/reservation" method="GET">
|
||||
<input type="hidden" name="cadeau" id="cadeau" value="{{cadeau}}">
|
||||
<input type="text" name="offrant" id="offrant" class="participant" placeholder="Saisissez votre prénom" required>
|
||||
<input type="submit" id="btn-continuer" class="btn btn-primary" value="Continuer">
|
||||
</form>
|
||||
</div>
|
||||
{{/each}}
|
||||
</div>
|
||||
<a href="/" class="btn btn-secondary">Retour aux cadeaux</a>
|
||||
<a href="/" class="btn btn-secondary"><< Annuler (retour aux cadeaux)</a>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
|
||||
@@ -1,85 +1,47 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Réserver un des cadeaux</title>
|
||||
<title>Réservation pour Louisa</title>
|
||||
<link rel="stylesheet" href="/styles.css">
|
||||
<link href="/css/bootstrap.min.css" rel="stylesheet">
|
||||
</head>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container mt-4">
|
||||
<div class="mt-4 p-5 bg-danger text-white rounded">
|
||||
<h1>Réserver ce cadeau</h1>
|
||||
<div class="mt-4 p-3 bg-danger text-white rounded">
|
||||
<h1>Merci {{offrant}} : voici le cadeau que tu as sélectionné</h1>
|
||||
<p>{{ message }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container mt-4">
|
||||
<div class="card" style="width: 40rem;">
|
||||
<div class="card-header">{{infosCadeaux.libelle}}</div>
|
||||
<div class="card">
|
||||
<div class="card-header">{{infosCadeau.libelle}}</div>
|
||||
<div class="card-body">
|
||||
<form action="/confirm-reservation" method="POST">
|
||||
<input type="hidden" name="cadeau" id="cadeau-id" value="{{infosCadeaux.id}}">
|
||||
<input type="hidden" name="offrant" id="offrant-id" value="{{offrant.id}}">
|
||||
<input type="hidden" name="cadeau" id="cadeau-id" value="{{infosCadeau.id}}">
|
||||
<input type="hidden" name="offrant" id="offrant-id" value="{{offrant}}">
|
||||
<div class="mb-3">
|
||||
<img src="{{infosCadeaux.photo}}" class="image">
|
||||
<img src="{{infosCadeau.photo}}" class="image">
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="responsable-reg" class="form-label">Qui es-tu ?</label>
|
||||
<input type="text" disabled id="offrant-reg" name="offrant" value="{{offrant.prenom}}">
|
||||
<p class="depenses">Pour l'instant, tu as déjà dépensé : {{totalAchats}}€</p>
|
||||
</div>
|
||||
<br>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Le cadeau a-t-il déjà été acheté ?</label>
|
||||
<div class="form-check form-check-inline">
|
||||
<input class="form-check-input" type="radio" name="achete" id="achete1" value="1" {{#if infosCadeaux.achete}}checked{{/if}}>
|
||||
<label class="form-check-label" for="achete1">Oui</label>
|
||||
</div>
|
||||
<div class="form-check form-check-inline">
|
||||
<input class="form-check-input" type="radio" name="achete" id="achete2" value="0" {{#unless infosCadeaux.achete}}checked{{/unless}}>
|
||||
<label class="form-check-label" for="achete2">Non</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="responsable-reg" class="form-label">Qui doit s'occuper de l'achat (toi y compris) ?</label>
|
||||
<select name="responsableAchat" id="acheteur-reg" required class="form-select" aria-label="Default select example">
|
||||
<option value="" disabled selected>Choisir dans la liste</option>
|
||||
{{#each listeResponsables}}
|
||||
<option value="{{this.id}}">{{this.prenom}}</option>
|
||||
{{/each}}
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Si quelqu'un d'autre doit acheter le cadeau, avez-vous déjà remboursé cette personne ?</label>
|
||||
<div class="form-check form-check-inline">
|
||||
<input class="form-check-input" type="radio" name="paye" id="paye1" value="1" {{#if infosCadeaux.paye}}checked{{/if}}>
|
||||
<label class="form-check-label" for="paye1">Oui</label>
|
||||
</div>
|
||||
<div class="form-check form-check-inline">
|
||||
<input class="form-check-input" type="radio" name="paye" id="paye2" value="0" {{#unless infosCadeaux.paye}}checked{{/unless}}>
|
||||
<label class="form-check-label" for="paye2">Non</label>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Pour quelle occasion veux-tu l'offrir ?</label>
|
||||
<div class="form-check form-check-inline">
|
||||
<input class="form-check-input" type="radio" name="occasion" id="occasion1" value="1" {{#if infosCadeaux.pourNoel}}checked{{/if}}>
|
||||
<input class="form-check-input" type="radio" name="occasion" id="occasion1" value="1" {{#if infosCadeau.pourNoel}}checked{{/if}}>
|
||||
<label class="form-check-label" for="occasion1">Pour Noël</label>
|
||||
</div>
|
||||
<div class="form-check form-check-inline">
|
||||
<input class="form-check-input" type="radio" name="occasion" id="occasion2" value="0" {{#unless infosCadeaux.pourNoel}}checked{{/unless}}>
|
||||
<input class="form-check-input" type="radio" name="occasion" id="occasion2" value="0" {{#unless infosCadeau.pourNoel}}checked{{/unless}}>
|
||||
<label class="form-check-label" for="occasion2">Pour son anniversaire</label>
|
||||
</div>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary">Enregistrer</button>
|
||||
<a href="/" class="btn btn-secondary">Retour aux cadeaux</a>
|
||||
<button type="submit" class="btn btn-primary">Continuer</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<a href="/" class="btn btn-secondary"><< Annuler (retour aux cadeaux)</a>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -9,11 +9,14 @@
|
||||
</head>
|
||||
</head>
|
||||
<body>
|
||||
<br><br>
|
||||
<div class="vote">{{#if present}}😁{{else}}☹️{{/if}} {{enfant}} {{#unless present}}ne{{/unless}} sera {{#unless present}}pas{{/unless}} là à l'anniversaire de Louisa le 17 décembre </div>
|
||||
<br>
|
||||
<br>
|
||||
{{#unless present}}<div class="vote-sm">Si vous changez d'avis, vous pouvez toujours nous contacter au <a href="tel:06.22.88.28.80">06.22.88.28.80</a> ou au <a href="tel:06.52.90.38.10">06.52.90.38.10</a></div>{{/unless}}
|
||||
{{#if present}}<div class="vote-sm">Louisa a hâte de retrouver ses copains pour cette occasion !!</div>{{/if}}
|
||||
<div class="general">
|
||||
<span class="logo">
|
||||
<img src="/minecraft_logo_icon_168974.png">
|
||||
</span>
|
||||
<span class="vote">{{enfant}} {{#unless present}}ne{{/unless}} sera {{#unless present}}pas{{/unless}} la a l'anniversaire<br>de Louisa le 14 decembre 2024</span>
|
||||
<span class="emoticon">
|
||||
{{#if present}}😁{{else}}☹️{{/if}}
|
||||
</span>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
60
wishlist.js
60
wishlist.js
@@ -6,6 +6,10 @@ const path = require("path")
|
||||
const publicDir = path.join(__dirname, './public')
|
||||
var bodyParser = require('body-parser')
|
||||
|
||||
/* Pour le Javascript embarqué */
|
||||
app.use('/js', express.static(__dirname + './../public'));
|
||||
|
||||
|
||||
/* Connexion à la BDD MySQL */
|
||||
dotenv.config({ path: './.env'})
|
||||
const db = mysql.createConnection({
|
||||
@@ -23,7 +27,6 @@ db.connect((error) => {
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
app.set('view engine', 'hbs');
|
||||
app.use(express.static(publicDir));
|
||||
/* Pour utiliser le bootstrap local */
|
||||
@@ -48,7 +51,7 @@ hbs.registerHelper('equals', isEqual);
|
||||
|
||||
app.get("/", (req, res) => {
|
||||
|
||||
db.query('SELECT c.id as "id", c.libelle as "libelle", c.prix, c.photo as "photo", c.lien, p.prenom as "acheteur", c.achete as "achete", c.paye as "paye", p2.prenom as "responsableAchat", c.pour_noel as "pourNoel", c.emballe as "emballe" FROM cadeau c LEFT OUTER JOIN participations pc on pc.cadeau = c.id LEFT OUTER JOIN participant p on p.id = pc.offrant LEFT OUTER JOIN participant p2 on p2.id = pc.responsable_achat ORDER BY c.pour_noel, c.prix', async (error, resultCadeaux) => {
|
||||
db.query('SELECT c.id as "id", c.libelle as "libelle", c.prix, c.photo as "photo", c.lien, pc.offrant as "acheteur", c.pour_noel as "pourNoel" FROM cadeau c LEFT OUTER JOIN participations pc on pc.cadeau = c.id ORDER BY c.pour_noel, c.prix', async (error, resultCadeaux) => {
|
||||
let message;
|
||||
|
||||
if(error){
|
||||
@@ -66,70 +69,35 @@ app.get("/", (req, res) => {
|
||||
app.get("/choix-offrant", (req, res) => {
|
||||
let cadeau = req.query.cadeau;
|
||||
|
||||
db.query('SELECT id, prenom FROM participant ORDER BY prenom', async (error, result) => {
|
||||
if(error) {
|
||||
console.log(error);
|
||||
}
|
||||
if (result && result.length > 0) {
|
||||
res.render('offrant', { "cadeau" : cadeau, "listeOffrants": result});
|
||||
}
|
||||
})
|
||||
res.render('offrant', { "cadeau" : cadeau});
|
||||
})
|
||||
|
||||
|
||||
app.get("/reservation", (req, res) => {
|
||||
|
||||
let reqCadeau = req.query.cadeau;
|
||||
let reqOffrant = req.query.offrant;
|
||||
let totalAchats;
|
||||
let cadeau = req.query.cadeau;
|
||||
let offrant = req.query.offrant;
|
||||
|
||||
db.query('SELECT id, libelle, prix, photo, lien, achete, paye, pour_noel as "pourNoel" FROM cadeau WHERE id = ?', [reqCadeau], async (error, infosCadeau) => {
|
||||
db.query('SELECT id, libelle, prix, photo, lien, pour_noel as "pourNoel" FROM cadeau WHERE id = ?', [cadeau], async (error, infosCadeau) => {
|
||||
if(error) {
|
||||
console.log(error);
|
||||
}
|
||||
if (infosCadeau.length > 0) {
|
||||
db.query('SELECT COALESCE(sum(c.prix),0) as "total" FROM cadeau c RIGHT OUTER JOIN participations pc ON pc.cadeau = c.id INNER JOIN participant p ON p.id = pc.offrant WHERE p.id=?', [reqOffrant], async (error, result) => {
|
||||
if(error) {
|
||||
console.log(error);
|
||||
}
|
||||
if (result && result.length > 0) {
|
||||
totalAchats = result[0]
|
||||
}
|
||||
|
||||
db.query('SELECT id, prenom FROM participant WHERE id=?', [reqOffrant], async (error, result) => {
|
||||
if(error) {
|
||||
console.log(error);
|
||||
}
|
||||
if (result && result.length > 0) {
|
||||
offrant = result[0];
|
||||
}
|
||||
res.render('reservation', { "infosCadeau": infosCadeau[0], "offrant" : offrant });
|
||||
});
|
||||
|
||||
db.query('SELECT id, prenom FROM participant ORDER BY prenom', async (error, listeResponsables) => {
|
||||
if(error) {
|
||||
console.log(error);
|
||||
}
|
||||
res.render('reservation', { "infosCadeaux": infosCadeau[0],
|
||||
"offrant" : offrant,
|
||||
"totalAchats": totalAchats.total,
|
||||
"listeResponsables" : listeResponsables} );
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
|
||||
|
||||
app.post("/confirm-reservation", (req, res) => {
|
||||
const { cadeau, offrant, achete, paye, occasion, responsableAchat } = req.body
|
||||
const { cadeau, offrant, occasion } = req.body
|
||||
|
||||
db.query('UPDATE cadeau SET achete=?, paye=?, pour_noel=? WHERE ID=?', [achete, paye, occasion, cadeau], function (err, result) {
|
||||
db.query('UPDATE cadeau SET pour_noel=? WHERE ID=?', [occasion, cadeau], function (err, result) {
|
||||
if (err) throw err;
|
||||
console.log("1 record updated");
|
||||
});
|
||||
|
||||
db.query('INSERT INTO participations (offrant, cadeau, responsable_achat) VALUES (?, ?, ?)', [offrant, cadeau, responsableAchat], function (err, result) {
|
||||
db.query('INSERT INTO participations (offrant, cadeau) VALUES (?, ?)', [offrant, cadeau], function (err, result) {
|
||||
if (err) throw err;
|
||||
console.log("1 record inserted");
|
||||
});
|
||||
@@ -143,7 +111,7 @@ app.get("/presence-anniversaire", (req, res) => {
|
||||
var child_process = require("child_process");
|
||||
let enfant = req.query.e;
|
||||
let present = req.query.p;
|
||||
let messageNotif = enfant + (present == 'true' ? "" : " ne") + " sera" + (present == 'true' ? "" : " pas") + " là le 17 décembre";
|
||||
let messageNotif = enfant + (present == 'true' ? "" : " ne") + " sera" + (present == 'true' ? "" : " pas") + " là le 14 décembre 2024";
|
||||
|
||||
db.query("DELETE FROM anniversaire WHERE enfant = ?", [enfant], function (err, result) {
|
||||
if (err) throw err;
|
||||
|
||||
Reference in New Issue
Block a user