diff --git a/week-8/Homework/mandatory/1-practice/1-practice.md b/week-8/Homework/mandatory/1-practice/1-practice.md index a9faddab5..b211bf6b9 100644 --- a/week-8/Homework/mandatory/1-practice/1-practice.md +++ b/week-8/Homework/mandatory/1-practice/1-practice.md @@ -26,6 +26,8 @@ The following endpoint is publicly available from Github +an API returns data in one of two possible formats: Extensible Markup Language (XML) and JavaScript Object Notation (JSON). + 2. What would you put in the following fields? `{owner}`, `{repo}`, `{pull_number}`? diff --git a/week-8/Homework/mandatory/2-fetch-exercise/exercise.js b/week-8/Homework/mandatory/2-fetch-exercise/exercise.js index fb3a39c2a..9fff4b946 100644 --- a/week-8/Homework/mandatory/2-fetch-exercise/exercise.js +++ b/week-8/Homework/mandatory/2-fetch-exercise/exercise.js @@ -17,10 +17,11 @@ Open index.html in your browser. Every time you refresh the page, a different greeting should be displayed in the box. */ -fetch('*** Write the API address here ***') - .then(function(response) { - return response.text(); - }) - .then(function(greeting) { - // Write the code to display the greeting text here - }); \ No newline at end of file +fetch("https://codeyourfuture.herokuapp.com/api/greetings") + .then(function (response) { + return response.text(); + }) + .then(function (greeting) { + document.getElementById("greeting-text").textContent = greeting; + // Write the code to display the greeting text here + }); diff --git a/week-8/Homework/mandatory/2-fetch-exercise/index.html b/week-8/Homework/mandatory/2-fetch-exercise/index.html index e3c9aa43c..923296047 100644 --- a/week-8/Homework/mandatory/2-fetch-exercise/index.html +++ b/week-8/Homework/mandatory/2-fetch-exercise/index.html @@ -1,28 +1,28 @@ - + - - - CodeYourFuture - Fetch - - - - + + + CodeYourFuture - Fetch + + + + - -

A greeting in a random language...

-

+ +

A greeting in a random language...

+

- - - \ No newline at end of file + + + diff --git a/week-8/Homework/mandatory/3-dog-photo-gallery/index.html b/week-8/Homework/mandatory/3-dog-photo-gallery/index.html new file mode 100644 index 000000000..a74fef4b5 --- /dev/null +++ b/week-8/Homework/mandatory/3-dog-photo-gallery/index.html @@ -0,0 +1,131 @@ + + + + + + a randomized dog photo gallery! + + +
+

Random Dog Image Generator!

+
+
+ + +
+ + +
+
+ + + + diff --git a/week-8/Homework/mandatory/3-dog-photo-gallery/script.js b/week-8/Homework/mandatory/3-dog-photo-gallery/script.js new file mode 100644 index 000000000..f4d41934e --- /dev/null +++ b/week-8/Homework/mandatory/3-dog-photo-gallery/script.js @@ -0,0 +1,47 @@ +// var button = document.createElement("button"); +// button.innerHTML = "click for a random dog photo"; + +// // 2. Append somewhere +// var body = document.getElementsByTagName("body"); +// body.appendChild(button); + +// //3. Add event handler +// var cont = document.getElementById("container"); +// var ul = document.createElement("ul"); +// var li = document.createElement("li"); +// ul.appendChild(li); +// cont.appendChild(ul); + +// button.addEventListener("click", function () { +// fetch("https://dog.ceo/api/breeds/image/random"); + +// .then((response) => response.json()) +// .then((data) => +// return (li.innerHTML = `< img src = "${data.file}" />`); +// }); + +const dogImage1 = document.getElementById("dog-img1"); +const dogButton1 = document.getElementById("btn1-dog"); +const dogButton2 = document.getElementById("btn2-dog"); +const dogImage2 = document.getElementById("dog-img2"); + +dogButton1.addEventListener("click", fetchDogImage1); +dogButton2.addEventListener("click", fetchDogImage2); + +function fetchDogImage1() { + fetch("https://dog.ceo/api/breeds/image/random") + .then((response) => response.json()) + .then((data) => { + dogImage1.innerHTML = ``; + }); + //.catch ((error) => Alert("there is an error")); +} + +function fetchDogImage2() { + fetch("https://dog.ceo/api/breeds/image/random") + .then((response) => response.json()) + .then((data) => { + dogImage2.innerHTML = ``; + }); + // .catch ((error) => Alert("there is an error")); +} diff --git a/week-8/Homework/mandatory/3-dog-photo-gallery/style.css b/week-8/Homework/mandatory/3-dog-photo-gallery/style.css new file mode 100644 index 000000000..e69de29bb diff --git a/week-8/Homework/mandatory/4-programmer-humour/index.html b/week-8/Homework/mandatory/4-programmer-humour/index.html new file mode 100644 index 000000000..0ae5c329b --- /dev/null +++ b/week-8/Homework/mandatory/4-programmer-humour/index.html @@ -0,0 +1,15 @@ + + + + + + CodeYourFuture - programmer-humour + + + + + + + + + diff --git a/week-8/Homework/mandatory/4-programmer-humour/script.js b/week-8/Homework/mandatory/4-programmer-humour/script.js new file mode 100644 index 000000000..f5cf9162f --- /dev/null +++ b/week-8/Homework/mandatory/4-programmer-humour/script.js @@ -0,0 +1,8 @@ +fetch(`https://xkcd.now.sh/?comic=latest`) + .then((response) => response.json()) + .then((response) => { + document.getElementById("image").src = response.img; + }); + .catch ((error) => console.log(error)); +// .catch((error)=> alert (error)); + diff --git a/week-8/Homework/mandatory/4-programmer-humour/style.css b/week-8/Homework/mandatory/4-programmer-humour/style.css new file mode 100644 index 000000000..e69de29bb