diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..973492c
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,8 @@
+{
+ "cSpell.words": [
+ "Corneliu",
+ "Porumboiu",
+ "Whannell",
+ "codepen"
+ ]
+}
\ No newline at end of file
diff --git a/InClass/Callbacks/exercise-1/exercise.js b/InClass/Callbacks/exercise-1/exercise.js
index 40f06b0..d17c2e2 100644
--- a/InClass/Callbacks/exercise-1/exercise.js
+++ b/InClass/Callbacks/exercise-1/exercise.js
@@ -5,9 +5,53 @@ EXERCISE 1
Task 1
Using setTimeout, change the background colour of the page after 5 seconds (5000 milliseconds).
+
Task 2
Update your code to make the colour change every 5 seconds to something different. Hint: try searching for setInterval. Complete the exercises in this CodePen
Prefer to work on a codepen? https://codepen.io/makanti/pen/abOreLg
================
-*/
\ No newline at end of file
+*/
+
+// Exercise 1 -Syllabus
+const greekGods = [
+ "Aphrodite",
+ "Ares",
+ "Artemis",
+ "Athena",
+ "Poseidon",
+ "Zeus",
+];
+
+// before running the code in your browser, discuss the expected order of each loop
+
+// synchronous - loop through the array of greek gods and print the index numbers and values to the console, e.g. '1. Ares'
+greekGods.forEach((item, i) => console.log(i, item));
+// asynchronous - same as before but the index and the value of the god at position 2 in array should be printed after 2 seconds. Use: setTimeout()
+greekGods.forEach((element, i) => {
+ setTimeout(() => {
+ if (i === 2) {
+ console.log(i, element);
+ }
+ }, 2000);
+ if (i === 2) {
+ return;
+ }
+ console.log(i, element);
+});
+
+const body = document.querySelector("body");
+// Task 1
+setTimeout(() => {
+ body.style.backgroundColor = "blue";
+}, 5000);
+
+// Task 2
+let colours = ["red", "blue", "green", "purple"];
+
+let change = 0;
+setInterval(() => {
+ if (change === colours.length) change = 0;
+ body.style.backgroundColor = colours[change];
+ change++;
+}, 5000);
diff --git a/InClass/Callbacks/exercise-2/exercise.js b/InClass/Callbacks/exercise-2/exercise.js
index eca9595..2e8725c 100644
--- a/InClass/Callbacks/exercise-2/exercise.js
+++ b/InClass/Callbacks/exercise-2/exercise.js
@@ -63,8 +63,35 @@ const movies = [
// create showMovies function
+const contentDiv = document.getElementById("all-movies");
+const spanEl = document.getElementById("movies-number");
+
+const showMovies = (movie) => {
+ movie.forEach((item) => {
+ let pTag = document.createElement("p");
+ contentDiv.appendChild(pTag);
+ pTag.innerHTML = `${item.title} - ${item.director}`;
+ spanEl.innerHTML = `${movies.length}`;
+ });
+};
+showMovies(movies);
// create a new movie object for your favorite movie
+const newMovie = {
+ title: "47 Ronin",
+ director: "Carl Rinsch",
+ type: "action",
+ haveWatched: true,
+};
+
// create addMovies function
+
+const addMovie = (movie) => {
+ setTimeout(() => {
+ movie.push(newMovie);
+ showMovies(movies.slice(-1));
+ }, 2000);
+};
+addMovie(movies);
diff --git a/InClass/Callbacks/exercise-2/index.html b/InClass/Callbacks/exercise-2/index.html
index bc9654c..7e45ce2 100644
--- a/InClass/Callbacks/exercise-2/index.html
+++ b/InClass/Callbacks/exercise-2/index.html
@@ -24,6 +24,7 @@ My movies
+