ultima51x · January 5, 2020 08:36 · Jan 5, 2020
diff --git a/cars.html b/cars.html
@@ -0,0 +1,17 @@
+<html>
+  <head>
+    <title>Cars</title>
+  </head>
+  <body>
+    <ul data-car-list="true">
+    </ul>
+    <script type="text/javascript" src="cars.js"></script>
+  </body>
+</html>
+
+<!--
+  Criteria
+  * Is it sorted right?
+  * Is there 10?
+  * Is the string right?
+-->
diff --git a/cars.js b/cars.js
@@ -0,0 +1,52 @@
+class CarsData {
+  constructor() {
+    this.datasource = 'https://gist.github.com/scottburton11/66a921c458f9500a773a6b0ac65006df/raw/629bfd6a3125e3428bd85a53231bd8018c407a65/Javascript%2520Working%2520With%2520Data%2520Challenge%2520data';
+  }
+
+  // promise
+  carData() {
+    return fetch(this.datasource).then((resp) => resp.json())
+  }
+
+  finalList() {
+    return this.carData().then((json) => {
+      const carList = json.map(elem => new Car(elem))
+      const final = carList.
+                filter(elem => elem.coolFactor() >= 7).
+                sort((a, b) => b.total() - a.total()).
+                slice(0, 10)
+      return final
+    })
+  }
+}
+
+class Car {
+  constructor(obj) {
+    this.data = obj
+  }
+
+  fullName() {
+    return `${this.data['Year']} ${this.data['Make']} ${this.data['Model']}`
+  }
+
+  coolFactor() {
+    return parseInt(this.data['Cool Factor'])
+  }
+
+  total() {
+    return parseInt(this.data['Total Score'])
+  }
+
+  markup() {
+    const elem = document.createElement('li')
+    elem.appendChild(document.createTextNode(`${this.fullName()} - ${this.total()} - ${this.coolFactor()}`))
+    return elem
+  }
+}
+
+(function() {
+  const cars = new CarsData().finalList().then((list) => {
+    const listTag = document.querySelector('[data-car-list]')
+    list.forEach(car => listTag.appendChild(car.markup()))
+  });
+})();
No results found