Compare commits

..

5 commits

Author SHA1 Message Date
ExostFlash
144dfaf8c8 modif 2025-08-29 10:43:49 +02:00
ExostFlash
fbd10c6fd5 modif all 2025-08-29 10:33:03 +02:00
ExostFlash
b04045ca8e modif 2025-08-29 10:26:00 +02:00
ExostFlash
b7e37108cd modif page resto 2025-08-29 10:18:09 +02:00
DarkMax31
d9c975ec2f tentavive page restos 2025-08-29 09:52:42 +02:00
8 changed files with 206 additions and 263 deletions

Binary file not shown.

View file

@ -1,13 +1,14 @@
const axios = require("axios"); const axios = require("axios");
const { getUserByDId } = require('../users/getUsers'); const { getUserByGId } = require('../users/getUsers');
const { postUser } = require('../users/postUsers'); const { postUser } = require('../users/postUsers');
const CLIEN_ID = "71229835507-9413gbpdamv2qbcb2ov8oda2oqgcsk8q.apps.googleusercontent.com"; const CLIEN_ID = "71229835507-9413gbpdamv2qbcb2ov8oda2oqgcsk8q.apps.googleusercontent.com";
const GOOGLE_SECRET = "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"; const GOOGLE_SECRET = "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";
const REDIRECT_URI = "http://localhost:3000/auth/google/callback"; const GOOGLE_REDIRECT_URI = "http://localhost:3000/auth/google/callback";
exports.handleGoogleAuth = async (code, res) => { exports.handleGoogleAuth = async (req, res) => {
const code = req.query.code;
if (!code) return res.status(400).json({ error: "Code de validation manquant" }); if (!code) return res.status(400).json({ error: "Code de validation manquant" });
try { try {
const params = new URLSearchParams(); const params = new URLSearchParams();
@ -41,8 +42,6 @@ exports.handleGoogleAuth = async (code, res) => {
const newUser = { const newUser = {
username: userData.name || userData.email, username: userData.name || userData.email,
google_id: userData.id, google_id: userData.id,
email: userData.email,
avatar: userData.picture || null,
}; };
savedUser = await postUser(newUser); savedUser = await postUser(newUser);
} }

111
public/resto.css Normal file
View file

@ -0,0 +1,111 @@
main {
text-align: left !important;
}
.restaurant-page {
width: 90%;
max-width: 1200px;
margin: auto;
}
.header {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-top: 20px;
}
.restaurant-info h1 {
margin: 0;
font-size: 24px;
}
.heart {
display: inline-flex;
align-items: center;
justify-content: center;
background: #ececec;
border-radius: 50%;
width: 32px;
height: 32px;
font-size: 20px;
margin-left: 8px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.rating {
display: flex;
align-items: center;
margin: 10px 0;
gap: 10px;
}
.btn {
background: #999;
border: none;
color: white;
padding: 5px 10px;
cursor: pointer;
}
.chart-placeholder {
width: 200px;
height: 200px;
background: #eee;
display: flex;
align-items: center;
justify-content: center;
font-size: 12px;
}
.main-image {
width: 100%;
height: 200px;
background: #ccc;
margin: 20px 0;
}
.description {
background: #f9f9f9;
padding: 15px;
margin-bottom: 20px;
}
.gallery {
display: flex;
justify-content: space-between;
margin-bottom: 30px;
}
.gallery-item {
width: 32%;
height: 150px;
background: #ddd;
}
.reviews-title {
background: #eee;
padding: 10px;
margin: 0;
}
.reviews {
display: flex;
flex-direction: column;
gap: 20px;
margin: 20px 0;
}
.review {
background: #f5f5f5;
padding: 15px;
border: 1px solid #ddd;
}
.review h3 {
margin-top: 0;
}
.review-rating div {
margin-top: 5px;
}

View file

@ -3,6 +3,11 @@ const router = express.Router();
// Page d'accueil // Page d'accueil
router.get('/', (req, res) => { router.get('/', (req, res) => {
res.render('index', { user: req.session.user });
});
// Page resto
router.get('/resto/:id', (req, res) => {
res.render('resto', { user: req.session.user }); res.render('resto', { user: req.session.user });
}); });
@ -17,6 +22,17 @@ router.get('/auth/discord', (req, res) => {
router.get('/auth/discord/callback', require('./modules/auth/discord').handleDiscordAuth); router.get('/auth/discord/callback', require('./modules/auth/discord').handleDiscordAuth);
// Auth Google
router.get('/auth/google', (req, res) => {
const clientId = '71229835507-9413gbpdamv2qbcb2ov8oda2oqgcsk8q.apps.googleusercontent.com';
const redirectUri = 'http://localhost:3000/auth/google/callback';
const scope = 'https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/userinfo.profile';
const googleAuthUrl = `https://accounts.google.com/o/oauth2/auth?client_id=${clientId}&redirect_uri=${encodeURIComponent(redirectUri)}&response_type=code&scope=${encodeURIComponent(scope)}`;
res.redirect(googleAuthUrl);
});
router.get('/auth/google/callback', require('./modules/auth/google').handleGoogleAuth);
// Déconnexion // Déconnexion
router.get('/logout', (req, res) => { router.get('/logout', (req, res) => {
req.session.destroy((err) => { req.session.destroy((err) => {
@ -28,4 +44,4 @@ router.get('/logout', (req, res) => {
}); });
}); });
module.exports = router; module.exports = router;

View file

@ -1,76 +0,0 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Diagramme Radar avec Chart.js</title>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
</head>
<body>
<div style="width: 35%; margin: 0 auto;">
<canvas id="radarChart"></canvas>
</div>
<script>
const ctx = document.getElementById('radarChart').getContext('2d');
const radarChart = new Chart(ctx, {
type: 'radar',
data: {
labels: ['Qualité des plats', 'Ambiance', 'Accessibilité', 'Service', 'Tradition'],
datasets: [
{
label: 'Moyenne des notes',
data: [4.7, 4.6, 4.4, 4.3, 4.8],
fill: true,
backgroundColor: 'rgba(25, 80, 233, 0.2)',
borderColor: 'rgb(25, 80, 233, 10)',
pointBackgroundColor: 'rgb(55, 99, 132)',
pointBorderColor: '#fff',
pointHoverBackgroundColor: '#fff',
pointHoverBorderColor: 'rgb(255, 99, 132)',
pointStyle: 'circle',
pointRadius: 5,
pointRotation: 0,
},
]
},
options: {
plugins: {
legend: {
display: false
},
tooltip: {
callbacks: {
label: function(context) {
let label = context.dataset.label || '';
if (label) {
label += ': ';
}
label += context.formattedValue;
return label;
}
}
}
},
scales: {
r: {
max: 5,
min: 0,
ticks: {
stepSize: 1,
callback: function(value, index, values) {
return value.toFixed(1);
}
}
}
},
elements: {
line: {
borderWidth: 3
}
}
}
});
</script>
</body>
</html>

View file

@ -1,6 +1,5 @@
<div style="display:flex; justify-content: center; align-items: center;"> <div style="display:flex; justify-content: center; align-items: center;">
<h2 style="margin-right: 20px;">LEPICURIEN</h2> <h2 style="margin-right: 20px;">LEPICURIEN</h2>
<!-- Vérification du logo : le fichier "logo.png" doit être présent dans le dossier public ou assets -->
<img style="height: 70px; width: 70px; object-fit: contain;" alt="Logo de l'entreprise" src="logo.png" onerror="this.onerror=null;this.src='https://via.placeholder.com/70?text=Logo';" /> <img style="height: 70px; width: 70px; object-fit: contain;" alt="Logo de l'entreprise" src="logo.png" onerror="this.onerror=null;this.src='https://via.placeholder.com/70?text=Logo';" />
</div> </div>
<div class="sections"> <div class="sections">
@ -8,30 +7,36 @@
<div class="section"> <div class="section">
<h3>Restaurants les plus proches</h3> <h3>Restaurants les plus proches</h3>
<div class="cards"> <div class="cards">
<div class="card"> <a href="/resto/1" style="text-decoration:none; color:inherit;">
<div class="card-info"> <div class="card">
<h4>Le Canard Toulousain</h4> <div class="card-info">
<p>12 Rue du Capitole, 31000 Toulouse</p> <h4>Le Canard Toulousain</h4>
<p>Avis général</p> <p>12 Rue du Capitole, 31000 Toulouse</p>
<p>Avis général</p>
</div>
<img alt="Photo du restaurant" src="https://source.unsplash.com/100x100/?restaurant=1" />
</div> </div>
<img alt="Photo du restaurant" src="https://source.unsplash.com/100x100/?restaurant=1" /> </a>
</div> <a href="/resto/2" style="text-decoration:none; color:inherit;">
<div class="card"> <div class="card">
<div class="card-info"> <div class="card-info">
<h4>Chez Pépé Louis</h4> <h4>Chez Pépé Louis</h4>
<p>8 Avenue de la Garonne, 31000 Toulouse</p> <p>8 Avenue de la Garonne, 31000 Toulouse</p>
<p>Avis général</p> <p>Avis général</p>
</div>
<img alt="Photo du restaurant" src="https://source.unsplash.com/100x100/?restaurant=2" />
</div> </div>
<img alt="Photo du restaurant" src="https://source.unsplash.com/100x100/?restaurant=2" /> </a>
</div> <a href="/resto/3" style="text-decoration:none; color:inherit;">
<div class="card"> <div class="card">
<div class="card-info"> <div class="card-info">
<h4>La Table Rose</h4> <h4>La Table Rose</h4>
<p>25 Rue Saint-Rome, 31000 Toulouse</p> <p>25 Rue Saint-Rome, 31000 Toulouse</p>
<p>Avis général</p> <p>Avis général</p>
</div>
<img alt="Photo du restaurant" src="https://source.unsplash.com/100x100/?restaurant=3" />
</div> </div>
<img alt="Photo du restaurant" src="https://source.unsplash.com/100x100/?restaurant=3" /> </a>
</div>
</div> </div>
</div> </div>
@ -39,29 +44,35 @@
<div class="section"> <div class="section">
<h3>Restaurants les plus populaires</h3> <h3>Restaurants les plus populaires</h3>
<div class="cards"> <div class="cards">
<div class="card"> <a href="/resto/4" style="text-decoration:none; color:inherit;">
<div class="card-info"> <div class="card">
<h4>Bistro Occitan</h4> <div class="card-info">
<p>5 Place Wilson, 31000 Toulouse</p> <h4>Bistro Occitan</h4>
<p>Avis général</p> <p>5 Place Wilson, 31000 Toulouse</p>
<p>Avis général</p>
</div>
<img alt="Photo du restaurant" src="https://source.unsplash.com/100x100/?restaurant=4" />
</div> </div>
<img alt="Photo du restaurant" src="https://source.unsplash.com/100x100/?restaurant=4" /> </a>
</div> <a href="/resto/5" style="text-decoration:none; color:inherit;">
<div class="card"> <div class="card">
<div class="card-info"> <div class="card-info">
<h4>LAssiette du Sud</h4> <h4>LAssiette du Sud</h4>
<p>17 Allée Jean Jaurès, 31000 Toulouse</p> <p>17 Allée Jean Jaurès, 31000 Toulouse</p>
<p>Avis général</p> <p>Avis général</p>
</div>
<img alt="Photo du restaurant" src="https://source.unsplash.com/100x100/?restaurant=5" />
</div> </div>
<img alt="Photo du restaurant" src="https://source.unsplash.com/100x100/?restaurant=5" /> </a>
</div> <a href="/resto/6" style="text-decoration:none; color:inherit;">
<div class="card"> <div class="card">
<div class="card-info"> <div class="card-info">
<h4>Le Petit Cassoulet</h4> <h4>Le Petit Cassoulet</h4>
<p>3 Rue des Filatiers, 31000 Toulouse</p> <p>3 Rue des Filatiers, 31000 Toulouse</p>
<p>Avis général</p> <p>Avis général</p>
</div>
<img alt="Photo du restaurant" src="https://source.unsplash.com/100x100/?restaurant=6" />
</div> </div>
<img alt="Photo du restaurant" src="https://source.unsplash.com/100x100/?restaurant=6" /> </a>
</div>
</div> </div>
</div> </div>

View file

@ -18,7 +18,9 @@
<a href="/" class="logo-link"> <a href="/" class="logo-link">
<img src="/logo.png" alt="Logo L'EPICURIEN" class="logo" /> <img src="/logo.png" alt="Logo L'EPICURIEN" class="logo" />
</a> </a>
<h1 style="text-decoration: none; color: white;">L'EPICURIEN</h1> <a href="/" class="">
<h1 style="text-decoration: none; color: white;">L'EPICURIEN</h1>
</a>
</div> </div>
<div class="header-center"> <div class="header-center">
<div class="search-bar"> <div class="search-bar">

View file

@ -1,18 +1,28 @@
<body> <link rel="stylesheet" href="/resto.css" />
<div class="restaurant-page">
<div class="restaurant-page">
<!-- En-tête restaurant --> <!-- En-tête restaurant -->
<div class="header"> <div class="header">
<div class="restaurant-info"> <div class="restaurant-info">
<h1>Nom restaurant <span class="heart">❤️</span></h1> <h1>
Nom restaurant
<span class="heart">
<% if (user) { %>
❤️
<% } else { %>
🤍
<% } %>
</span>
</h1>
<p class="address">Adresse</p> <p class="address">Adresse</p>
<div class="rating"> <div class="rating">
<span>⭐️⭐️⭐️⭐️⭐️</span> <span>⭐️⭐️⭐️⭐️⭐️</span>
<button class="btn">Voir tous les avis</button> <a href="#avis" class="btn">Voir tous les avis</a>
</div> </div>
</div> </div>
<div class="chart"> <div class="chart">
<div class="chart-placeholder"> <div class="chart-placeholder">
<canvas id="radarChart"></canvas> <canvas id="radarChart"></canvas>
</div> </div>
</div> </div>
</div> </div>
@ -40,7 +50,7 @@
</div> </div>
<!-- Avis --> <!-- Avis -->
<h2 class="reviews-title">Avis</h2> <h2 class="reviews-title" id="avis">Avis</h2>
<div class="reviews"> <div class="reviews">
<div class="review"> <div class="review">
<h3>Titre avis</h3> <h3>Titre avis</h3>
@ -88,136 +98,6 @@
</div> </div>
</div> </div>
<!-- Footer -->
<footer>
<a href="#">Mentions légales</a>
<a href="#">Politique de confidentialité</a>
<a href="#">CGU</a>
</footer>
</div>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background: #fff;
}
.restaurant-page {
width: 90%;
max-width: 1200px;
margin: auto;
}
.header {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-top: 20px;
}
.restaurant-info h1 {
margin: 0;
font-size: 24px;
}
.heart {
color: red;
}
.rating {
display: flex;
align-items: center;
margin: 10px 0;
gap: 10px;
}
.btn {
background: #999;
border: none;
color: white;
padding: 5px 10px;
cursor: pointer;
}
.chart-placeholder {
width: 200px;
height: 200px;
background: #eee;
display: flex;
align-items: center;
justify-content: center;
font-size: 12px;
}
.main-image {
width: 100%;
height: 200px;
background: #ccc;
margin: 20px 0;
}
.description {
background: #f9f9f9;
padding: 15px;
margin-bottom: 20px;
}
.gallery {
display: flex;
justify-content: space-between;
margin-bottom: 30px;
}
.gallery-item {
width: 32%;
height: 150px;
background: #ddd;
}
.reviews-title {
background: #eee;
padding: 10px;
margin: 0;
}
.reviews {
display: flex;
flex-direction: column;
gap: 20px;
margin: 20px 0;
}
.review {
background: #f5f5f5;
padding: 15px;
border: 1px solid #ddd;
}
.review h3 {
margin-top: 0;
}
.review-rating div {
margin-top: 5px;
}
footer {
background: #eee;
padding: 10px;
text-align: center;
display: flex;
justify-content: space-around;
margin-top: 30px;
}
footer a {
text-decoration: none;
color: black;
}
</style>
</body>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script> <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script> <script>
@ -283,4 +163,4 @@
} }
}); });
}); });
</script> </script>