Le panier – Javascript

–diag de classe–
–JS–
–cdn–
–JQ recup valeur-
–classe JS–
–session JS–

Intro

  • réaliser le diagramme de classe  de l’application

Partie 1

Livrable gitlab : ristoo/mission3/…

  • réaliser un fichier bonjour.js qui affiche bonjour grâce à Js et Hello en console, inclure ce fichier dans bonjour.php.
console.log("Hello");
  • importer le cdn de JQuery
  • afficher le nom d’une boisson lors de la sélection de celui ci sur boissons.php

 

Partie 2

Livrable gitlab : ristoo/mission3/…

  • dans function.js permettre lors du click de la souris sur un dessert de l’ajouter au panier.
    • on créer la classe dessert avec un nom et un id
    • on récupère le nom et l’id avec JQuery
    • on créer un objet dessert avec les données
    • on ajoute l’objet à un tableau panier
    • on sauvegarde le tableau dans une session javascript
class Fruit{
  constructor(couleur, grammes) {
    this.couleur= couleur;
     this.grammes= grammes;
  }
  
  get kilo(){
    return this.grammes/1000;
  }
}
let monFruit = new Fruit();
console.log(monFruit.kilo);
  • permettre l’ajout des boissons
  • permettre l’ajout des plats

 

Partie 3

Livrable gitlab : ristoo/mission3/…

  • afficher l’ensemble du panier sur le coté droit de la page boissons
    • réaliser une div avec un id
    • récupérer le tableau dans la session
    • grâce à une boucle js, générer une ligne HTML dans cette div avec le nom du produit
  • ajouter le panier aux autres pages desserts et plats

 

Remarque : il nous manque une information essentiel pour notre panier, le prix. Nous le gérerons par la suite.

 

panier 1