diff --git a/index.html b/index.html index 8ebb802..8931772 100644 --- a/index.html +++ b/index.html @@ -1,11 +1,13 @@ - + - + + Toddler Shop + @@ -15,10 +17,64 @@ - - - - + +
+ +
+ + + + + + + Home +
+ +
+ + + + + + + Home +
+ +
+ + + + + + + Home +
+ +
+ + + + + + + Home +
+ +
+ + + + + + + Home +
+ +
+ + + + diff --git a/scripts/main.js b/scripts/main.js index 03509c8..23196b9 100644 --- a/scripts/main.js +++ b/scripts/main.js @@ -2,6 +2,10 @@ var all_products let barcodeForm +const api_url = "http://127.0.0.1:8000" + +var to_fill_product_index = 0 + async function makeAPIRequest(request) { try { const response = await fetch(request); @@ -13,15 +17,15 @@ async function makeAPIRequest(request) { } async function loadProducts() { - const loadProductRequest = new Request("http://127.0.0.1:8000/products") + const loadProductRequest = new Request(api_url + "/products") all_products = await makeAPIRequest(loadProductRequest) console.log("Loaded products:", all_products) + barcodeForm = document.getElementById("barcode_form"); + barcodeForm.addEventListener("submit", (e) => { e.preventDefault(); - console.log('help') - const barcode = document.getElementById('barcode_input').value var chosen_product for (index = 0; index < all_products.length; index++) { @@ -31,15 +35,20 @@ async function loadProducts() { } barcode_input.value = "" + + const product_placeholders = document.getElementsByClassName('product_placeholder') + const chosen_product_placeholder = product_placeholders[to_fill_product_index] + var image_product = chosen_product_placeholder.getElementsByClassName('product_image')[0] + var price_product = chosen_product_placeholder.getElementsByClassName('product_price')[0] + + console.log(chosen_product_placeholder) + console.log(image_product) + console.log(price_product) + + image_product.setAttribute('href', api_url + "/icons/" + chosen_product.image_filename); + price_product.textContent = "\u20AC " + chosen_product.price - const product_image_placeholders = document.getElementsByClassName('product_image') - console.log(product_image_placeholders) - for (index = 0; index < product_image_placeholders.length; index++) { - console.log(product_image_placeholders[index].src) - if (product_image_placeholders[index].src == "") { - product_image_placeholders[index].src = chosen_product.image_url - return false - } - } + to_fill_product_index += 1 }); + }