diff --git a/Aufgaben/Aufgabe_06_2020-06-03/script.js b/Aufgaben/Aufgabe_06_2020-06-03/script.js index b68bee4..f4ec20c 100644 --- a/Aufgaben/Aufgabe_06_2020-06-03/script.js +++ b/Aufgaben/Aufgabe_06_2020-06-03/script.js @@ -2,6 +2,8 @@ // Datensammlung für Produkte var Aufgabe06; (function (Aufgabe06) { + let shoppingPrice = 0; + let shoppingCount = 0; let categories = [ { title: "Special Offers!", @@ -154,9 +156,9 @@ var Aufgabe06; product.innerHTML = `

${categories[nummer].products[index].title}

- ${categories[nummer].products[index].price} ¥ - - + ${categories[nummer].products[index].price.toFixed(2).toLocaleString()} ¥ + +
Product

Size: ${categories[nummer].products[index].size}

@@ -168,24 +170,72 @@ var Aufgabe06; } } } - function myFunction() { - console.log("Ich wurde geklickt"); - for (let nummer = 0; nummer < categories.length; nummer++) { - let heading = document.querySelector(`#${categories[nummer].id}`); - document.querySelector("#übersicht").removeChild(heading); - /*let container: HTMLDivElement = document.createElement("div"); - container.classList.add("container"); - (document.querySelector("#übersicht")).appendChild(container); - - for (let index: number = 0; index < categories[nummer].products.length; index++) { - let product: HTMLDivElement = document.createElement("div"); - product.classList.add("product"); - product.innerHTML = ""; - container.appendChild(product); - } */ + function drawCategory(_catNumber) { + clearProducts(); + let heading = document.createElement("h1"); + heading.setAttribute("id", categories[_catNumber].id); + heading.innerHTML = `${categories[_catNumber].title}`; + document.querySelector("#übersicht").appendChild(heading); + let container = document.createElement("div"); + container.classList.add("container"); + document.querySelector("#übersicht").appendChild(container); + for (let index = 0; index < categories[_catNumber].products.length; index++) { + let product = document.createElement("div"); + product.classList.add("product"); + product.innerHTML = ` +

${categories[_catNumber].products[index].title}

+
+ ${categories[_catNumber].products[index].price} ¥ + + +
+ Product +

Size: ${categories[_catNumber].products[index].size}

+
+

${categories[_catNumber].products[index].description}

+
+ `; + //product.querySelector("button")!.setAttribute("productPrice", "${categories[catNumber].products[index].price}"); + container.appendChild(product); } } - document.querySelector("#special_a").addEventListener("click", myFunction); + function clearProducts() { + console.log("Ich wurde geklickt"); + for (let nummer = 0; nummer < categories.length; nummer++) { + let alles = document.querySelector("#übersicht"); + alles.innerHTML = ""; + } + } + document.querySelector("#special_a").addEventListener("click", drawSpecial); + document.querySelector("#bunt_a").addEventListener("click", drawBunt); + document.querySelector("#grün_a").addEventListener("click", drawGrün); + document.querySelector("#all_a").addEventListener("click", drawAll); + function drawSpecial() { + drawCategory(0); + } + function drawBunt() { + drawCategory(1); + } + function drawGrün() { + drawCategory(2); + } + function drawAll() { + clearProducts(); + printProducts(); + } + function money(_event) { + let target = _event.target; + let price = parseFloat(target.getAttribute("productPrice")); + console.log("Artikel-Preis: " + price + " ¥"); + shoppingPrice += price; + console.log("Shopping-Cart-Preis: " + shoppingPrice + " ¥"); + shoppingCount++; + document.querySelector("#shoppingCartNumber").innerHTML = shoppingCount.toLocaleString(); + } + const buttons = document.getElementsByClassName("addProduct"); + for (const button of buttons) { + button.addEventListener("click", money); + } })(Aufgabe06 || (Aufgabe06 = {})); // Folgender auskommentierter Code dient mir als Archiv für Gedankenansätze oder Verläufe. // Wenn dies nicht gerne gesehen ist, gebt mir kurz Bescheid und ich werde es entfernen diff --git a/Aufgaben/Aufgabe_06_2020-06-03/script.js.map b/Aufgaben/Aufgabe_06_2020-06-03/script.js.map index 6b7b7bd..2b8d89f 100644 --- a/Aufgaben/Aufgabe_06_2020-06-03/script.js.map +++ b/Aufgaben/Aufgabe_06_2020-06-03/script.js.map @@ -1 +1 @@ -{"version":3,"file":"script.js","sourceRoot":"","sources":["script.ts"],"names":[],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"script.js","sourceRoot":"","sources":["script.ts"],"names":[],"mappings":"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"} \ No newline at end of file diff --git a/Aufgaben/Aufgabe_06_2020-06-03/script.ts b/Aufgaben/Aufgabe_06_2020-06-03/script.ts index a1ee685..e69de29 100644 --- a/Aufgaben/Aufgabe_06_2020-06-03/script.ts +++ b/Aufgaben/Aufgabe_06_2020-06-03/script.ts @@ -1,258 +0,0 @@ -// Datensammlung für Produkte - -namespace Aufgabe06 { - - interface Product { - title: string; - price: number; - size: string; - imgName: string; - description: string; - } - - interface Category { - title: string; - id: string; - products: Product[]; - } - - let categories: Category[] = [ - { - title: "Special Offers!", - id: "special", - products: [ - { - title: "Color: Rainbow", - price: 3279.99, - size: "4m²", - imgName: "grass-rainbow-square.png", - description: "If you can't choose one color, go and catch them all!" - }, { - title: "Color: White", - price: 3279.99, - size: "4m²", - imgName: "grass-white.png", - description: "The appearance of many sparkling stars on your garden floor." - }, { - title: "Color: Black", - price: 3279.99, - size: "4m²", - imgName: "grass-black.png", - description: "Dark as the night. Be careful not to form a black hole!" - }, { - title: "Pattern: Murica", - price: 3279.99, - size: "4m²", - imgName: "grass-green-murica.png", - description: "Texas, Trump, Guns & Hamburgers" - }, { - title: "Pattern: Schachbrett", - price: 3279.99, - size: "4m²", - imgName: "grass-green-chess-square.png", - description: "Show your intellect on your own lawn and embarrass your opponents!" - } - ] - }, { - title: "Bunte Gräser", - id: "bunt", - products: [ - { - title: "Color: Green", - price: 2339.99, - size: "4m²", - imgName: "grass-green.png", - description: "The standard model in our range. Ensures a natural look and pleasant freshness in your living room!" - }, { - title: "Color: Desert", - price: 2339.99, - size: "4m²", - imgName: "grass-yellow.png", - description: "Summer, sun and oh my god, I'm hot! Are they pyramids in my garden ?!" - }, { - title: "Color: Beach", - price: 2339.99, - size: "4m²", - imgName: "grass-orange.png", - description: "Summer, sun and hot feelings!" - }, { - title: "Pattern: Hell", - price: 2339.99, - size: "4m²", - imgName: "grass-red.png", - description: "Look into the abyss that could await you after your death and invite guests to it!" - }, { - title: "Pattern: Unicorn", - price: 2339.99, - size: "4m²", - imgName: "grass-pink.png", - description: "PINK FLUFFY UNICORN, DANCING ON RAINBOWS (which you can also buy in here) !!!" - }, { - title: "Pattern: Grape", - price: 2339.99, - size: "4m²", - imgName: "grass-purple.png", - description: "It looks purple. Do you have to say more?" - }, { - title: "Pattern: Atlantic", - price: 2339.99, - size: "4m²", - imgName: "grass-blue.png", - description: "Blue like the ocean. A deep look and mysterious nature." - } - ] - }, { - title: "Green-Tones", - id: "grün", - products: [ - { - title: "Green: 3B", - price: 3499.99, - size: "10m²", - imgName: "grass-green-dark-3.png", - description: "Green in every way. Nothing more to know about it." - }, { - title: "Green: 2B", - price: 3499.99, - size: "10m²", - imgName: "grass-green-dark-2.png", - description: "Green in every way. Nothing more to know about it." - }, { - title: "Green: B", - price: 3499.99, - size: "10m²", - imgName: "grass-green-dark-1.png", - description: "Green in every way. Nothing more to know about it." - }, { - title: "Green: HB", - price: 2339.99, - size: "10m²", - imgName: "grass-green.png", - description: "The standard model in our range. Ensures a natural look and pleasant freshness in your living room!" - }, { - title: "Green: H", - price: 3499.99, - size: "10m²", - imgName: "grass-green-light-1.png", - description: "Green in every way. Nothing more to know about it." - }, { - title: "Green: 2H", - price: 3499.99, - size: "10m²", - imgName: "grass-green-light-2.png", - description: "Green in every way. Nothing more to know about it." - }, { - title: "Green: 3H", - price: 3499.99, - size: "10m²", - imgName: "grass-green-light-3.png", - description: "Green in every way. Nothing more to know about it." - } - ] - } - ]; - - printProducts(); - - //create Structure; - - function printProducts(): void { - for (let nummer: number = 0; nummer < categories.length; nummer++) { - - let heading: HTMLHeadingElement = document.createElement("h1"); - heading.setAttribute("id", categories[nummer].id); - heading.innerHTML = `${categories[nummer].title}`; - (document.querySelector("#übersicht")).appendChild(heading); - - let container: HTMLDivElement = document.createElement("div"); - container.classList.add("container"); - (document.querySelector("#übersicht")).appendChild(container); - - for (let index: number = 0; index < categories[nummer].products.length; index++) { - let product: HTMLDivElement = document.createElement("div"); - product.classList.add("product"); - product.innerHTML = ` -

${categories[nummer].products[index].title}

-
- ${categories[nummer].products[index].price} ¥ - - -
- Product -

Size: ${categories[nummer].products[index].size}

-
-

${categories[nummer].products[index].description}

-
- `; - container.appendChild(product); - } - - } - - } - - function myFunction(): void { - console.log("Ich wurde geklickt"); - for (let nummer: number = 0; nummer < categories.length; nummer++) { - - let heading: HTMLHeadingElement = (document.querySelector(`#${categories[nummer].id}`)); - (document.querySelector("#übersicht")).removeChild(heading); - - /*let container: HTMLDivElement = document.createElement("div"); - container.classList.add("container"); - (document.querySelector("#übersicht")).appendChild(container); - - for (let index: number = 0; index < categories[nummer].products.length; index++) { - let product: HTMLDivElement = document.createElement("div"); - product.classList.add("product"); - product.innerHTML = ""; - container.appendChild(product); - } */ - } - - } - - (document.querySelector("#special_a")).addEventListener("click", myFunction); - -} - -// Folgender auskommentierter Code dient mir als Archiv für Gedankenansätze oder Verläufe. -// Wenn dies nicht gerne gesehen ist, gebt mir kurz Bescheid und ich werde es entfernen - -/* -function zeichnen(tagArray: Tag[]): void { - for (let i: number = 0; i < tagArray.length ; i++){ - let title: HTMLElement = document.createElement(tagArray[i].tag); - title.innerHTML = "I bims title"; - title.classList.add("title"); - if (tagArray[i].image) { - title.setAttribute("src", "value"); - title.setAttribute("alt", "value"); - } - document.body.appendChild(title); - } -} -*/ - -/* -console.log("Hello Console"); -let theName: String = "Justin" + "Dretvic" + 20; -console.log(theName); -*/ - -/* -# Template für ein Produkt in HTML -
tag class -

Color: Rainbow

tag class content -
tag class - 3279,99 ¥ tag class content - tag content - tag content -
- Product tag attribute1 attribute2 -

Size: 4m²

tag class content -
tag class -

If you can't choose one color, go and catch them all!

tag content -
-
-*/ \ No newline at end of file diff --git a/Aufgaben/Aufgabe_06_2020-06-03/shop.css b/Aufgaben/Aufgabe_06_2020-06-03/shop.css index a5e8bfe..e54fc54 100644 --- a/Aufgaben/Aufgabe_06_2020-06-03/shop.css +++ b/Aufgaben/Aufgabe_06_2020-06-03/shop.css @@ -56,7 +56,7 @@ header #shopping_cart { border-radius: 40px; margin: 10px 5px 0px 5px; padding: 10px 0px; - width: 60px; + width: 100px; height: 30px; } diff --git a/Aufgaben/Aufgabe_06_2020-06-03/shop.html b/Aufgaben/Aufgabe_06_2020-06-03/shop.html index a0f9ed1..a9b6ec4 100644 --- a/Aufgaben/Aufgabe_06_2020-06-03/shop.html +++ b/Aufgaben/Aufgabe_06_2020-06-03/shop.html @@ -25,13 +25,14 @@
Categories
- +