diff --git a/2-copy-of-code/lesson-18/data/orders.js b/2-copy-of-code/lesson-18/data/orders.js index 782cd63..101d721 100644 --- a/2-copy-of-code/lesson-18/data/orders.js +++ b/2-copy-of-code/lesson-18/data/orders.js @@ -7,4 +7,16 @@ export function addOrder(order) { function saveToStorage() { localStorage.setItem('orders', JSON.stringify(orders)); -} \ No newline at end of file +} + +export function getOrder(orderId) { + let matchingOrder; + + orders.forEach((order) => { + if (order.id === orderId) { + matchingOrder = order; + } + }); + + return matchingOrder; +} diff --git a/2-copy-of-code/lesson-18/scripts/tracking.js b/2-copy-of-code/lesson-18/scripts/tracking.js new file mode 100644 index 0000000..01bb36a --- /dev/null +++ b/2-copy-of-code/lesson-18/scripts/tracking.js @@ -0,0 +1,65 @@ +import {getOrder} from '../data/orders.js'; +import {getProduct, loadProductsFetch} from '../data/products.js'; +import dayjs from 'https://unpkg.com/dayjs@1.11.10/esm/index.js'; + +async function loadPage() { + await loadProductsFetch(); + + const url = new URL(window.location.href); + const orderId = url.searchParams.get('orderId'); + const productId = url.searchParams.get('productId'); + + const order = getOrder(orderId); + const product = getProduct(productId); + + // Get additional details about the product like + // the estimated delivery time. + let productDetails; + order.products.forEach((details) => { + if (details.productId === product.id) { + productDetails = details; + } + }); + + const trackingHTML = ` + + View all orders + + +
+ Arriving on ${ + dayjs(productDetails.estimatedDeliveryTime).format('dddd, MMMM D') + } +
+ +
+ ${product.name} +
+ +
+ Quantity: ${productDetails.quantity} +
+ + + +
+
+ Preparing +
+
+ Shipped +
+
+ Delivered +
+
+ +
+
+
+ `; + + document.querySelector('.js-order-tracking').innerHTML = trackingHTML; +} + +loadPage(); diff --git a/2-copy-of-code/lesson-18/tracking.html b/2-copy-of-code/lesson-18/tracking.html index 02e0969..6aadeae 100755 --- a/2-copy-of-code/lesson-18/tracking.html +++ b/2-copy-of-code/lesson-18/tracking.html @@ -52,47 +52,10 @@
-
- - View all orders - - -
- Arriving on Monday, June 13 -
- -
- Black and Gray Athletic Cotton Socks - 6 Pairs -
- -
- Quantity: 1 -
- - - -
-
- Preparing -
-
- Shipped -
-
- Delivered -
-
- -
-
-
+
- +