From a292a5a99b6178da682ce7fcb45cfaaff6270f69 Mon Sep 17 00:00:00 2001
From: lg220310 <gaetan.ledoux@etu.univ-lehavre.fr>
Date: Fri, 16 Feb 2024 14:54:52 +0100
Subject: [PATCH] =?UTF-8?q?Rendu=20Ga=C3=A9tan=20Ledoux=20(lg220310)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 index.html  | 38 ++++++++++++++++++++++++++++++++++++--
 js/car.js   | 11 +++++++++++
 js/extra.js |  4 ++++
 3 files changed, 51 insertions(+), 2 deletions(-)
 create mode 100644 js/car.js
 create mode 100644 js/extra.js
diff --git a/index.html b/index.html
index be6da78..c669f63 100644
--- a/index.html
+++ b/index.html
@@ -3,6 +3,7 @@
 <head>
     <title>Page Title</title>
     <!-- Bootstrap CSS Link -->
+    <meta charset="utf-8">
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
 </head>
 <body>
@@ -32,18 +33,51 @@
 </div>
 
 <!-- include prototypes here -->
+<script src="js/car.js"></script>
+<script src="js/extra.js"></script>
 
 <script>
-
     function generateCar(image, make, model, description, price, category, year, mileage, extras) {
         //Create an array of Extra instances based on Extras names and prices
+        var extraInstances = [];
+
+        for (var i = 0; i < extras.length; i++) {
+            var extra = extras[i];
+            extraInstances.push(new Extra(extra.name, extra.price));
+        }
+
         // Create a new Car instance
+        return new Car(image, make, model, description, price, category, year, mileage, extras);
     }
 
-    function showHideExtra(btn,elt,car) {
+    Car.prototype.generateImage = function(elt) {
+        var img = document.createElement('img');
+        img.src = this.image;
+        img.alt = this.make + ' ' + this.model;
+        img.classList.add('card-img-top');
+        elt.appendChild(img);
+    };
 
+    function generateExtras(elt,car) {
+        car.extras.forEach(extra => {
+            const extraElement = document.createElement('ul');
+            extraElement.textContent = `${extra.name}: ${extra.price} €`;
+            elt.appendChild(extraElement);
+        });
     }
 
+    function showHideExtra(btn,elt,car) {
+        elt.classList.toggle('d-none');
+
+        if (elt.classList.contains('d-none')) {
+            btn.textContent = '+';
+        } else {
+            btn.textContent = '-';
+            elt.innerHTML = '';
+
+            generateExtras(elt,car);
+        }
+    }
 
 </script>
 
diff --git a/js/car.js b/js/car.js
new file mode 100644
index 0000000..70d474a
--- /dev/null
+++ b/js/car.js
@@ -0,0 +1,11 @@
+function Car(image, make, model, description, price, category, year, mileage, extras) {
+	this.image = image;
+	this.make = make;
+	this.model = model;
+	this.description = description;
+	this.price = price;
+	this.category = category;
+	this.year = year;
+	this.mileage = mileage;
+	this.extras = extras;
+}
\ No newline at end of file
diff --git a/js/extra.js b/js/extra.js
new file mode 100644
index 0000000..298f99a
--- /dev/null
+++ b/js/extra.js
@@ -0,0 +1,4 @@
+function Extra(name, price) {
+	this.name = name;
+	this.price = price;
+}
\ No newline at end of file
-- 
GitLab

