From e7ff7dc01f3b307e1c54d6122c2fd2aa4a0da6df Mon Sep 17 00:00:00 2001
From: oscarigu <38469752+Oscarigu@users.noreply.github.com>
Date: Mon, 29 Sep 2025 21:02:27 +0200
Subject: [PATCH 1/2] solve lab
---
javascript/index.js | 157 ++++++++++++++++++++++++++++++++++++++------
1 file changed, 136 insertions(+), 21 deletions(-)
diff --git a/javascript/index.js b/javascript/index.js
index 9f30552db..7ed7b6b49 100644
--- a/javascript/index.js
+++ b/javascript/index.js
@@ -4,37 +4,152 @@
// 🚨🚨🚨 Comment out the below code before you start working on the code
// Out of sync
- getInstruction("mashedPotatoes", 0, (step1) => {
- document.querySelector("#mashedPotatoes").innerHTML += `${step1}`;
- }, (error) => console.log(error));
-
- getInstruction("mashedPotatoes", 1, (step2) => {
- document.querySelector("#mashedPotatoes").innerHTML += `${step2}`;
- }, (error) => console.log(error));
-
- getInstruction("mashedPotatoes", 2, (step3) => {
- document.querySelector("#mashedPotatoes").innerHTML += `${step3}`;
- }, (error) => console.log(error));
-
- getInstruction("mashedPotatoes", 3, (step4) => {
- document.querySelector("#mashedPotatoes").innerHTML += `${step4}`;
- }, (error) => console.log(error));
-
- getInstruction("mashedPotatoes", 4, (step5) => {
- document.querySelector("#mashedPotatoes").innerHTML += `${step5}`;
- document.querySelector("#mashedPotatoesImg").removeAttribute("hidden");
- }, (error) => console.log(error));
+// getInstruction("mashedPotatoes", 0, (step1) => {
+// document.querySelector("#mashedPotatoes").innerHTML += `${step1}`;
+// }, (error) => console.log(error));
+
+// getInstruction("mashedPotatoes", 1, (step2) => {
+// document.querySelector("#mashedPotatoes").innerHTML += `${step2}`;
+// }, (error) => console.log(error));
+// getInstruction("mashedPotatoes", 2, (step3) => {
+// document.querySelector("#mashedPotatoes").innerHTML += `${step3}`;
+// }, (error) => console.log(error));
+// getInstruction("mashedPotatoes", 3, (step4) => {
+// document.querySelector("#mashedPotatoes").innerHTML += `${step4}`;
+// }, (error) => console.log(error));
+
+// getInstruction("mashedPotatoes", 4, (step5) => {
+// document.querySelector("#mashedPotatoes").innerHTML += `${step5}`;
+// document.querySelector("#mashedPotatoesImg").removeAttribute("hidden");
+// }, (error) => console.log(error));
// Iteration 1 - using callbacks
// ...
+getInstruction(
+ "mashedPotatoes",
+ 0,
+ (step1) => {
+ document.querySelector("#mashedPotatoes").innerHTML += `${step1}`;
+ getInstruction(
+ "mashedPotatoes",
+ 0,
+ (step1) => {
+ document.querySelector(
+ "#mashedPotatoes"
+ ).innerHTML += `${step1}`;
+ getInstruction(
+ "mashedPotatoes",
+ 2,
+ (step3) => {
+ document.querySelector(
+ "#mashedPotatoes"
+ ).innerHTML += `${step3}`;
+
+ getInstruction(
+ "mashedPotatoes",
+ 3,
+ (step4) => {
+ document.querySelector(
+ "#mashedPotatoes"
+ ).innerHTML += `${step4}`;
+
+ getInstruction(
+ "mashedPotatoes",
+ 4,
+ (step5) => {
+ document.querySelector(
+ "#mashedPotatoes"
+ ).innerHTML += `${step5}`;
+ document
+ .querySelector("#mashedPotatoesImg")
+ .removeAttribute("hidden");
+
+ document.querySelector(
+ "#mashedPotatoes"
+ ).innerHTML += `Mashed potatoes are ready!`;
+ },
+ (error) => console.log(error)
+ );
+ },
+ (error) => console.log(error)
+ );
+ },
+ (error) => console.log(error)
+ );
+ },
+ (error) => console.log(error)
+ );
+ },
+ (error) => console.log(error)
+);
// Iteration 2 - using promises
// ...
+obtainInstruction("steak", 0)
+ .then((step0) => {
+ document.querySelector("#steak").innerHTML += `${step0}`;
+ return obtainInstruction("steak", 1);
+ })
+ .then((step1) => {
+ document.querySelector("#steak").innerHTML += `${step1}`;
+ return obtainInstruction("steak", 2);
+ })
+ .then((step2) => {
+ document.querySelector("#steak").innerHTML += `${step2}`;
+ return obtainInstruction("steak", 3);
+ })
+ .then((step3) => {
+ document.querySelector("#steak").innerHTML += `${step3}`;
+ return obtainInstruction("steak", 4);
+ })
+ .then((step4) => {
+ document.querySelector("#steak").innerHTML += `${step4}`;
+ return obtainInstruction("steak", 5);
+ })
+ .then((step5) => {
+ document.querySelector("#steak").innerHTML += `${step5}`;
+ return obtainInstruction("steak", 6);
+ })
+ .then((step6) => {
+ document.querySelector("#steak").innerHTML += `${step6}`;
+ document.querySelector("#steak").innerHTML += `steak is ready!`;
+ document.querySelector("#steakImg").removeAttribute("hidden");
+ return obtainInstruction("steak", 7);
+ })
+ .catch((err) => {
+ console.log(err);
+ });
+// ... Your code here
// Iteration 3 using async/await
// ...
+async function makeBroccoli() {
+ try {
+ const step0 = await obtainInstruction("broccoli", 0);
+ document.querySelector("#broccoli").innerHTML += `${step0}`;
+ const step1 = await obtainInstruction("broccoli", 1);
+ document.querySelector("#broccoli").innerHTML += `${step1}`;
+ const step2 = await obtainInstruction("broccoli", 2);
+ document.querySelector("#broccoli").innerHTML += `${step2}`;
+ const step3 = await obtainInstruction("broccoli", 3);
+ document.querySelector("#broccoli").innerHTML += `${step3}`;
+ const step4 = await obtainInstruction("broccoli", 4);
+ document.querySelector("#broccoli").innerHTML += `${step4}`;
+ const step5 = await obtainInstruction("broccoli", 5);
+ document.querySelector("#broccoli").innerHTML += `${step5}`;
+ const step6 = await obtainInstruction("broccoli", 6);
+ document.querySelector("#broccoli").innerHTML += `${step6}`;
+ document.querySelector(
+ "#broccoli"
+ ).innerHTML += `Broccoli is ready!`;
+ document.querySelector("#broccoliImg").removeAttribute("hidden");
+ } catch (err) {
+ console.log(err);
+ }
+}
+makeBroccoli();
// Bonus 2 - Promise all
-// ...
\ No newline at end of file
+// ...
From 3df5efb4041b5b6bc4100854cffe8a8c37cc490e Mon Sep 17 00:00:00 2001
From: oscarigu <38469752+Oscarigu@users.noreply.github.com>
Date: Mon, 29 Sep 2025 21:06:44 +0200
Subject: [PATCH 2/2] solve
---
javascript/index.js | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/javascript/index.js b/javascript/index.js
index 7ed7b6b49..e81de80d4 100644
--- a/javascript/index.js
+++ b/javascript/index.js
@@ -34,7 +34,7 @@ getInstruction(
document.querySelector("#mashedPotatoes").innerHTML += `${step1}`;
getInstruction(
"mashedPotatoes",
- 0,
+ 1,
(step1) => {
document.querySelector(
"#mashedPotatoes"