CodeYourFuture · Leidagandy · Apr 26, 2020 · Apr 26, 2020 · Apr 27, 2020 · May 1, 2020
diff --git a/week-9/Homework/mandatory/1-practice/2-code-reading.md b/week-9/Homework/mandatory/1-practice/2-code-reading.md
@@ -14,6 +14,8 @@ Take a look at the following code:
 ```
 
 Explain why line 4 and line 6 output different numbers.
+// In line 1 a global variable is declared and assigned the value of 1, it will be available everywhere in the application.
+// In line 3 a new local variable is declared and assigned the value of 2. This a new variable which happens to have the same name, x. It will be available only inside this function. They are different variables with different values.
 
 ## Question 2
 
@@ -32,7 +34,9 @@ console.log(f1())
 console.log(y)
 ```
 
-What will be the output of this code. Explain your answer in 50 words or less.
+What will be the output of this code.// Explain your answer in 50 words or less.
+Line 30 will print 10 to the console because x is a global variable.
+Line 34 will print y is not defined, this is because y is a local variable only accessible inside the functiion. So this x it is out of scope for the console.log called on line 6. The function itself should return undefined.
 
 ## Question 3
 
@@ -47,7 +51,7 @@ function f1(val) {
 }
 
 f1(x);
-console.log(x);
+console.log(x); (I am not sure why it outputs 9)
 
 const y = { x: 9 };
 
@@ -57,7 +61,7 @@ function f2(val) {
 }
 
 f2(y);
-console.log(y);
+console.log(y);// Returns 10. y is a parameter of function f2, it was declared and initialised with the value of 9 (line 56). Function f2 added 1 to x property and this updated y to 10 because why is equal to the value of the x property.
 ```
 
 What will be the output of this code. Explain your answer in 50 words or less.
diff --git a/week-9/Homework/mandatory/1-practice/app.js b/week-9/Homework/mandatory/1-practice/app.js
@@ -0,0 +1,45 @@
+window.addEventListener("load", () => {
+  let lon;
+  let lat;
+  let temperatureDescription = document.querySelector(
+    ".temperature-description"
+  );
+  let temperatureDegree = document.querySelector(".temperature-degree");
+  let locationTimezone = document.querySelector(".location-timezone");
+  let temperatureSection = document.querySelector(".temperature");
+  let temperatureSpan = document.querySelector(".temperature span");
+
+  if (navigator.geolocation) {
+    navigator.geolocation.getCurrentPosition((position) => {
+      console.log(position);
+      lon = position.coords.longitude;
+      lat = position.coords.latitude;
+
+      const api = `https://api.openweathermap.org/data/2.5/weather?lat=${lat}&lon=${lon}&appid=529112615b6aef3609d4abccfeb0e297&units=metric`;
+      fetch(api)
+        .then((response) => {
+          return response.json();
+        })
+        .then((data) => {
+          const temperature = data.main.temp;
+          const summary = data.weather[0].description;
+          //Set DOM elements from the API
+          temperatureDegree.textContent = temperature;
+          temperatureDescription.textContent = summary;
+          locationTimezone.textContent = data.name;
+          //formula for Farenheit
+          let farenheit = temperature * (9 / 5) + 32;
+          //change temperature from Celsius to Farenheit
+          temperatureSection.addEventListener("click", () => {
+            if (temperatureSpan.textContent === "C") {
+              temperatureDegree.textContent = farenheit.toFixed(2);
+              temperatureSpan.textContent = "F";
+            } else {
+              temperatureDegree.textContent = temperature;
+              temperatureSpan.textContent = "C";
+            }
+          });
+        });
+    });
+  }
+});
diff --git a/week-9/Homework/mandatory/1-practice/index.html b/week-9/Homework/mandatory/1-practice/index.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="stylesheet" href="style.css" />
+    <title>Weather</title>
+  </head>
+  <body>
+    <div class="location">
+      <h1 class="location-timezone">Timezone</h1>
+      <p id="icon">Icon</p>
+    </div>
+    <div class="temperature">
+      <div class="degree-section">
+        <h2 class="temperature-degree">34</h2>
+        <span>C</span>
+      </div>
+      <div class="temperature-description">It is freezing cold</div>
+    </div>
+
+    <script src="app.js"></script>
+  </body>
+</html>
diff --git a/week-9/Homework/mandatory/1-practice/style.css b/week-9/Homework/mandatory/1-practice/style.css
@@ -0,0 +1,38 @@
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+body {
+  height: 100vh;
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  align-items: center;
+  background: linear-gradient(rgb(47, 150, 163), rgb(48, 62, 143));
+  font-family: sans-serif;
+  color: white;
+}
+.location,
+.temperature {
+  height: 30vh;
+  width: 50%;
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+}
+.temperature {
+  flex-direction: column;
+}
+.degree-section {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+}
+degree-section span {
+  margin: 10px;
+  font-size: 30px;
+}
+.degree-section h2 {
+  font-size: 40px;
+}
diff --git a/week-9/Homework/mandatory/2-exercises/1-shopping-cart.js b/week-9/Homework/mandatory/2-exercises/1-shopping-cart.js
@@ -10,9 +10,17 @@ The output of running your code should be:
 */
 
 class ShoppingCart {
-  // Add your code here
-
+  constructor() {
+    this.cart = [];
+  }
+  addItem(item) {
+    this.cart.push(item);
+  }
+  listItems() {
+    this.cart.forEach((item) => console.log(item));
+  }
   cartContains() {
+    console.log(this.cart);
     // Use console.log() to output everything contained in your cart
   }
 }

diff --git a/week-9/Homework/mandatory/2-exercises/2-convertion.js b/week-9/Homework/mandatory/2-exercises/2-convertion.js
@@ -22,6 +22,15 @@
 */
 
 // Write your code here
+class Person {
+  constructor(personName) {
+    this.name = personName;
+  }
+
+  greeting() {
+    console.log("Hi I am " + this.name + ".");
+  }
+}
 
 // Do not edit this section
 const simon = new Person("simon");

diff --git a/week-9/Homework/mandatory/2-exercises/3-atm.js b/week-9/Homework/mandatory/2-exercises/3-atm.js
@@ -12,8 +12,27 @@
  */
 
 class ATM {
-    // Add your code here
+  constructor() {
+    this.balance = 100;
+  }
+
+  make_deposit(money) {
+    this.balance += money;
+  }
+
+  check_balance() {
+    this.balance;
+  }
 
+  make_withdrawl(money) {
+    if (this.balance >= money) {
+      this.balance -= money;
+    } else {
+      `you dont have enough funds, try a smaller amount`;
+    }
+
+    // Add your code here
+  }
 }
 
 let atm = new ATM(); // Create the ATM
@@ -22,4 +41,4 @@ atm.make_deposit(200);
 atm.check_balance();
 atm.make_withdrawl(100);
 
-atm.make_withdrawl(500); // Your ATM should be able to handle this scenario
+atm.make_withdrawl(500); // Your ATM should be able to handle this scenario
diff --git a/week-9/Homework/mandatory/2-exercises/4-music-player.js b/week-9/Homework/mandatory/2-exercises/4-music-player.js
@@ -1,7 +1,8 @@
 /*
 
 
-Task 1: Complete the below code to create a music player that will run through a playlist of songs and output to the console as described in the comments.
+Task 1: Complete the below code to create a music player that will run through 
+a playlist of songs and output to the console as described in the comments.
 
 Task 2: Add some extra logic to handle these 2 scenarios:
 - Trying to call myMusicPlayer.play() if there are no songs in the playlist
@@ -18,36 +19,61 @@ This means the order the songs are played in will be random, but each song will
 
  */
 
-
 class MusicPlayer {
-    // Add your code here
-
+  constructor() {
+    this.playlist = [];
+    this.index = 0;
+  }
+  add(title, artist) {
+    this.playlist.push({ title, artist });
+  }
+
+  play() {
+    if (this.playlist.length === 0) {
+      console.log("Your playlist is empty. Add new songs!");
+    } else {
+      console.log(
+        `Currently playing: ${this.playlist[this.index].title} by ${
+          this.playlist[this.index].artist
+        }`
+      );
+    }
+  }
+
+  skip() {
+    this.index++;
+    if (this.index <= this.playlist.length - 1) {
+      console.log(
+        `Currently playing: ${this.playlist[this.index].title} by ${
+          this.playlist[this.index].artist
+        }`
+      );
+    }
+  }
+
+  previous() {
+    this.index -= 1;
+    console.log(
+      `Currently playing: ${this.playlist[this.index].title} by ${
+        this.playlist[this.index].artist
+      }`
+    );
+  }
 }
 
 let myMusicPlayer = new MusicPlayer(); // Create an empty playlist
 
 // Add some songs to your playlist
-myMusicPlayer.add("Bohemian Rhapsody","Queen");
-myMusicPlayer.add("Yesterday","The Beatles");
-myMusicPlayer.add("Vogue","Madonna");
-
-myMusicPlayer.play();      // Output: "Currently playing: Bohemian Rhapsody by Queen"
-
-myMusicPlayer.skip();      // Output: "Currently playing: Yesterday by The Beatles"
-
-myMusicPlayer.previous();  // Output: "Currently playing: Bohemian Rhapsody by Queen"
-
-myMusicPlayer.skip();      // Output: "Currently playing: Yesterday by The Beatles"
-
-myMusicPlayer.skip();      // Output: "Currently playing: Vogue by Madonna"
-
-
-
-
-
-
+myMusicPlayer.add("Bohemian Rhapsody", "Queen");
+myMusicPlayer.add("Yesterday", "The Beatles");
+myMusicPlayer.add("Vogue", "Madonna");
 
+myMusicPlayer.play(); // Output: "Currently playing: Bohemian Rhapsody by Queen"
 
+myMusicPlayer.skip(); // Output: "Currently playing: Yesterday by The Beatles"
 
+myMusicPlayer.previous(); // Output: "Currently playing: Bohemian Rhapsody by Queen"
 
+myMusicPlayer.skip(); // Output: "Currently playing: Yesterday by The Beatles"
 
+myMusicPlayer.skip(); // Output: "Currently playing: Vogue by Madonna"