diff --git a/package.json b/package.json index c41a110ca19262f50af831518d2d2dc6098b0615..abdfa619e9426f7c982feea585be7add72473e18 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 7aef0711884fbc5af076fc2d62abd4dc61ad0d00..0d49216ce41726362c647e2ffed0ce4eded3abfd 100644 --- a/src/Router.js +++ b/src/Router.js @@ -2,7 +2,20 @@ export default class Router { static titleElement; static contentElement; static routes = []; - + + static #menuElement; + static set menuElement(element) { + this.#menuElement = element; + const link = document.querySelectorAll('header a'); + for (let i = 0; i < link.length; i++) { + link[i].addEventListener('click', e => { + e.preventDefault(); + console.log(link[i].getAttribute('href')); + Router.navigate(link[i].getAttribute('href')); + }); + } + } + static navigate(path) { const route = this.routes.find(route => route.path === path); if (route) { diff --git a/src/main.js b/src/main.js index 6148d2ba698b9b4314ca2f4afde288b429439f04..8a70feed118fd02906bc656ac19cf8d7d3407245 100644 --- a/src/main.js +++ b/src/main.js @@ -1,13 +1,29 @@ import Router from './Router'; import data from './data'; import PizzaList from './pages/PizzaList'; - +import Component from './components/Component'; Router.titleElement = document.querySelector('.pageTitle'); Router.contentElement = document.querySelector('.pageContent'); -const pizzaList = new PizzaList([]); -Router.routes = [{ path: '/', page: pizzaList, title: 'La carte' }]; +const pizzaList = new PizzaList([]), + aboutPage = new Component('section', null, 'Ce site est génial'), + 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' }, +]; +const link = document.querySelector('button'); // sélectionne le premier lien de la page + +link.addEventListener('click', event => { + event.preventDefault(); + document.querySelector('section').setAttribute('style', 'display:none'); + console.log(event); +}); Router.navigate('/'); // affiche une page vide pizzaList.pizzas = data; Router.navigate('/'); // affiche la liste des pizzas +document.querySelector('section').setAttribute('style',''); +Router.menuElement = document.querySelector('.mainMenu'); +