diff --git a/.vscode/launch.json b/.vscode/launch.json
new file mode 100644
index 0000000..ea1ec68
--- /dev/null
+++ b/.vscode/launch.json
@@ -0,0 +1,14 @@
+{
+ // Use IntelliSense to learn about possible attributes.
+ // Hover to view descriptions of existing attributes.
+ // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+ "version": "0.2.0",
+ "configurations": [
+ {
+ "type": "chrome",
+ "request": "launch",
+ "name": "Open index.html",
+ "file": "/Users/stephankok/Documents/School/api-voor-beginners/index.html"
+ }
+ ]
+}
\ No newline at end of file
diff --git a/index.html b/index.html
index 1d57f63..1991dd4 100644
--- a/index.html
+++ b/index.html
@@ -12,34 +12,11 @@
Iedereen
-
-
- Krijn Hoetmer
-
- website
-
-
-
- Sanne 't Hooft
-
- website
-
-
-
- Vasilis van Gemert
-
- website
-
-
-
- Cyd Stumpel
-
- website
-
diff --git a/scripts/everybody.js b/scripts/everybody.js
index dfd0d8d..1d72d68 100644
--- a/scripts/everybody.js
+++ b/scripts/everybody.js
@@ -5,10 +5,35 @@ const endpointSquad = 'items/person/?filter={"squads":{"squad_id":15}}';
-
-
-
-
+const everybodyURL = baseURL + endpointSquad;
+
+getData(everybodyURL).then(data => {
+ const allPeople = data.data;
+ let everybodysection = document.querySelector("section:nth-of-type(2)");
+
+ allPeople.forEach(person => {
+ let personName = person.name;
+ let personAvatar = person.avatar;
+ let personWebsite = person.website;
+
+ if (!personAvatar){
+ let randomNr = Math.floor(Math.random() * 5) + 1;
+ personAvatar = `images/placeholder${randomNr}.svg`;
+ }
+
+ if (!personWebsite){
+ personWebsite = fallbackWebsite;
+ }
+
+ let personHTML = `
+ ${personName}
+
+ website
+ `;
+
+ everybodysection.insertAdjacentHTML('beforeend', personHTML);
+ });
+})
diff --git a/scripts/myImage.js b/scripts/myImage.js
index 1d70792..5cf33fe 100644
--- a/scripts/myImage.js
+++ b/scripts/myImage.js
@@ -1,8 +1,26 @@
+const mySection = document.querySelector('section:nth-of-type(1)');
+getData(myURL).then( data219 => {
+ const myData = data219.data;
+ let myAvatar = myData.avatar;
+ let myName = myData.name;
+ if (!myAvatar){
+ myAvatar = "images/placeholder1.svg";
+ }
+
+ const myImg = document.createElement("img");
+
+
+ myImg.src = myAvatar;
+ myImg.alt = myName + "'s Avatar"
+
+ mySection.append(myImg);
+ console.log(myImg);
+})
diff --git a/scripts/myName.js b/scripts/myName.js
index 5b9452a..a42fcae 100644
--- a/scripts/myName.js
+++ b/scripts/myName.js
@@ -4,12 +4,31 @@
// iedereen: https://fdnd.directus.app/items/person/?fields=id,name,github_handle,avatar&filter={%22squads%22:{%22squad_id%22:{%22name%22:%22Minor%20Web%20Dev%22}}}&sort=name
const baseURL = 'https://fdnd.directus.app/';
-const endpointMe = 'items/person/67';
+const endpointMe = 'items/person/219';
+//Get complete url from the data you want
+const myURL = baseURL + endpointMe;
+console.log(myURL);
+//Call function " getData" for the data you need
+getData(myURL).then( data219 => {
+ //Fill wanted data in variables
+ let myName = data219.data.name;
+ let myBirthday = data219.data.birthdate;
+
+ //Find the needed sections in the html code
+ let mainH1 = document.querySelector("h1");
+ let subline = document.querySelector("h2");
+ //Fill the h1 with the given name
+ mainH1.textContent = myName;
+ subline.textContent = myBirthday;
+
+
+ console.log(data219.data);
+} );