From ec44a383489cf8cb59ff10765d5ed3e82f22ee13 Mon Sep 17 00:00:00 2001
From: Bastien Cortequisse <bastien.cortequisse.etu@univ-lille.fr>
Date: Thu, 11 Feb 2021 11:47:48 +0100
Subject: [PATCH] C fini
---
package.json | 2 +-
src/Router.js | 18 ++++++++++++++++++
src/main.js | 37 +++++++++++++++++++++++++++++++++++--
3 files changed, 54 insertions(+), 3 deletions(-)
diff --git a/package.json b/package.json
index c41a110..abdfa61 100644
--- a/package.json
+++ b/package.json
@@ -6,7 +6,7 @@
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build": "webpack --mode=production",
- "watch": "webpack --mode=development --watch"
+ "watch": "webpack --mode=development --watch"
},
"author": "Thomas Fritsch <thomas.fritsch@univ-lille.fr> (https://gitlab.univ-lille.fr/thomas.fritsch)",
"homepage": "https://gitlab.univ-lille.fr/js",
diff --git a/src/Router.js b/src/Router.js
index 7aef071..85b62de 100644
--- a/src/Router.js
+++ b/src/Router.js
@@ -2,6 +2,7 @@ export default class Router {
static titleElement;
static contentElement;
static routes = [];
+ static #menuElement;
static navigate(path) {
const route = this.routes.find(route => route.path === path);
@@ -10,4 +11,21 @@ export default class Router {
this.contentElement.innerHTML = route.page.render();
}
}
+
+ static set menuElement(element) {
+ this.#menuElement = element;
+ // au clic sur n'importe quel lien contenu dans "element"
+ // déclenchez un appel à Router.navigate(path)
+ // où "path" est la valeur de l'attribut `href=".."` du lien cliqué
+ const tab = element.querySelectorAll('a');
+ for (let i = 0; i < tab.length; i++) {
+ tab[i].addEventListener('click', event => {
+ event.preventDefault();
+ console.log(
+ "tab[i].getAttribute('href')" + tab[i].getAttribute('href')
+ );
+ Router.navigate(tab[i].getAttribute('href'));
+ });
+ }
+ }
}
diff --git a/src/main.js b/src/main.js
index 6148d2b..b5b8507 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,13 +1,46 @@
import Router from './Router';
import data from './data';
import PizzaList from './pages/PizzaList';
+import Component from './components/Component.js';
Router.titleElement = document.querySelector('.pageTitle');
Router.contentElement = document.querySelector('.pageContent');
+document.querySelector('.logo').innerHTML +=
+ "<small>les pizzas c'est la vie</small>";
+
+console.log(
+ document.querySelector('footer > div > a ~ a').getAttribute('href')
+);
+
+document
+ .querySelector('header > nav > ul > li > a')
+ .setAttribute('class', 'active');
+
+document.querySelector('section').setAttribute('style', '');
+
+document
+ .querySelector('section > article > button')
+ .addEventListener('click', event => {
+ event.preventDefault();
+ document.querySelector('section').setAttribute('style', 'display:none');
+ });
+
const pizzaList = new PizzaList([]);
-Router.routes = [{ path: '/', page: pizzaList, title: 'La carte' }];
+const aboutPage = new Component('section', null, 'Ce site est génial');
+const pizzaForm = new Component(
+ 'section',
+ null,
+ 'Ici vous pourrez ajouter une pizza'
+);
+
+Router.routes = [
+ { path: '/', page: pizzaList, title: 'La carte' },
+ { path: '/a-propos', page: aboutPage, title: 'À propos' },
+ { path: '/ajouter-pizza', page: pizzaForm, title: 'Ajouter une pizza' },
+];
-Router.navigate('/'); // affiche une page vide
pizzaList.pizzas = data;
Router.navigate('/'); // affiche la liste des pizzas
+
+Router.menuElement = document.querySelector('.mainMenu');
--
GitLab