modif couleur

ajout du graph aux details restos
2025-08-29 10:24:17 +02:00 · 2025-08-29 10:20:43 +02:00
8 changed files with 263 additions and 206 deletions
--- a/database.sqlite
+++ b/database.sqlite
--- a/modules/auth/google.js
+++ b/modules/auth/google.js
@ -1,14 +1,13 @@
 const axios = require("axios");

-const { getUserByGId } = require('../users/getUsers');
+const { getUserByDId } = require('../users/getUsers');
 const { postUser } = require('../users/postUsers');

 const CLIEN_ID = "71229835507-9413gbpdamv2qbcb2ov8oda2oqgcsk8q.apps.googleusercontent.com";
 const GOOGLE_SECRET = "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";
-const GOOGLE_REDIRECT_URI = "http://localhost:3000/auth/google/callback";
+const REDIRECT_URI = "http://localhost:3000/auth/google/callback";

-exports.handleGoogleAuth = async (req, res) => {
-    const code = req.query.code;
+exports.handleGoogleAuth = async (code, res) => {
    if (!code) return res.status(400).json({ error: "Code de validation manquant" });
    try {
        const params = new URLSearchParams();
@ -42,6 +41,8 @@ exports.handleGoogleAuth = async (req, res) => {
            const newUser = {
                username: userData.name || userData.email,
                google_id: userData.id,
+                email: userData.email,
+                avatar: userData.picture || null,
            };
            savedUser = await postUser(newUser);
        }
--- a/public/resto.css
+++ b/public/resto.css
@ -1,111 +0,0 @@
-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;
-}
--- a/routes.js
+++ b/routes.js
@ -3,11 +3,6 @@ const router = express.Router();

 // Page d'accueil
 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 });
 });

@ -22,17 +17,6 @@ router.get('/auth/discord', (req, res) => {

 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
 router.get('/logout', (req, res) => {
  req.session.destroy((err) => {
--- a/views/graphique.ejs
+++ b/views/graphique.ejs
@ -0,0 +1,76 @@
+<!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>   
--- a/views/index.ejs
+++ b/views/index.ejs
@ -1,5 +1,6 @@
 <div style="display:flex; justify-content: center; align-items: center;">
    <h2 style="margin-right: 20px;">L’EPICURIEN</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';" />
 </div>
 <div class="sections">
@ -7,7 +8,6 @@
    <div class="section">
        <h3>Restaurants les plus proches</h3>
        <div class="cards">
-            <a href="/resto/1" style="text-decoration:none; color:inherit;">
            <div class="card">
                <div class="card-info">
                    <h4>Le Canard Toulousain</h4>
@ -16,8 +16,6 @@
                </div>
                <img alt="Photo du restaurant" src="https://source.unsplash.com/100x100/?restaurant=1" />
            </div>
-            </a>
-            <a href="/resto/2" style="text-decoration:none; color:inherit;">
            <div class="card">
                <div class="card-info">
                    <h4>Chez Pépé Louis</h4>
@ -26,8 +24,6 @@
                </div>
                <img alt="Photo du restaurant" src="https://source.unsplash.com/100x100/?restaurant=2" />
            </div>
-            </a>
-            <a href="/resto/3" style="text-decoration:none; color:inherit;">
            <div class="card">
                <div class="card-info">
                    <h4>La Table Rose</h4>
@ -36,7 +32,6 @@
                </div>
                <img alt="Photo du restaurant" src="https://source.unsplash.com/100x100/?restaurant=3" />
            </div>
-            </a>
        </div>
    </div>

@ -44,7 +39,6 @@
    <div class="section">
        <h3>Restaurants les plus populaires</h3>
        <div class="cards">
-            <a href="/resto/4" style="text-decoration:none; color:inherit;">
            <div class="card">
                <div class="card-info">
                    <h4>Bistro Occitan</h4>
@ -53,8 +47,6 @@
                </div>
                <img alt="Photo du restaurant" src="https://source.unsplash.com/100x100/?restaurant=4" />
            </div>
-            </a>
-            <a href="/resto/5" style="text-decoration:none; color:inherit;">
            <div class="card">
                <div class="card-info">
                    <h4>L’Assiette du Sud</h4>
@ -63,8 +55,6 @@
                </div>
                <img alt="Photo du restaurant" src="https://source.unsplash.com/100x100/?restaurant=5" />
            </div>
-            </a>
-            <a href="/resto/6" style="text-decoration:none; color:inherit;">
            <div class="card">
                <div class="card-info">
                    <h4>Le Petit Cassoulet</h4>
@ -73,6 +63,5 @@
                </div>
                <img alt="Photo du restaurant" src="https://source.unsplash.com/100x100/?restaurant=6" />
            </div>
-            </a>
        </div>
    </div>
--- a/views/layout.ejs
+++ b/views/layout.ejs
@ -18,9 +18,7 @@
                <a href="/" class="logo-link">
                    <img src="/logo.png" alt="Logo L'EPICURIEN" class="logo" />
                </a>
-                <a href="/" class="">
                <h1 style="text-decoration: none; color: white;">L'EPICURIEN</h1>
-                </a>
            </div>
            <div class="header-center">
                <div class="search-bar">
--- a/views/resto.ejs
+++ b/views/resto.ejs
@ -1,23 +1,13 @@
-<link rel="stylesheet" href="/resto.css" />
-
+<body>
  <div class="restaurant-page">
    <!-- En-tête restaurant -->
    <div class="header">
      <div class="restaurant-info">
-        <h1>
-          Nom restaurant
-          <span class="heart">
-            <% if (user) { %>
-              ❤️
-            <% } else { %>
-              🤍
-            <% } %>
-          </span>
-        </h1>
+        <h1>Nom restaurant <span class="heart">❤️</span></h1>
        <p class="address">Adresse</p>
        <div class="rating">
          <span>⭐️⭐️⭐️⭐️⭐️</span>
-          <a href="#avis" class="btn">Voir tous les avis</a>
+          <button class="btn">Voir tous les avis</button>
        </div>
      </div>
      <div class="chart">
@ -50,7 +40,7 @@
    </div>

    <!-- Avis -->
-    <h2 class="reviews-title" id="avis">Avis</h2>
+    <h2 class="reviews-title">Avis</h2>
    <div class="reviews">
      <div class="review">
        <h3>Titre avis</h3>
@ -98,6 +88,136 @@
      </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>
Author	SHA1	Message	Date
DarkMax31	1096fb1a18	modif couleur	2025-08-29 10:24:17 +02:00
DarkMax31	4853271bfe	ajout du graph aux details restos	2025-08-29 10:20:43 +02:00