tonezone108 · tonezone108 · Oct 28, 2019 · Oct 30, 2019 · Oct 30, 2019
diff --git a/07week/AddressBook/index.html b/07week/AddressBook/index.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
+    <title>AddressBook</title>
+  </head>
+  <body>
+    check the console
+    <ul id="ListOfUsers" class="container"></ul>
+  </body>
+</html>
+<script src="./main.js"></script>
diff --git a/07week/AddressBook/main.js b/07week/AddressBook/main.js
@@ -0,0 +1,78 @@
+let arrayOfUsers = [];
+
+window.onload = function() {
+  getUsers();
+
+  // consolePosts();
+  // displayPhotoAndName();
+};
+
+const getUsers = () => {
+  let user;
+  fetch("https://randomuser.me/api/?results=5")
+    .then(res => res.json())
+    .then(function(jsonpayload) {
+      console.log(jsonpayload.results);
+      jsonpayload.results.forEach(function(user, index) {
+        let li = document.createElement("li");
+        let img = document.createElement("img");
+        let span = document.createElement("span");
+        let ul = document.getElementById("ListOfUsers");
+        let button = document.createElement("button");
+        button.innerText = "Show my email";
+        button.setAttribute("data-email", user.email);
+        img.setAttribute("src", user.picture.large);
+        span.innerText = `${user.name.title} ${user.name.first} ${user.name.last}`;
+        li.appendChild(img);
+        li.appendChild(span);
+        li.appendChild(button);
+        button.addEventListener("click", clickedButtonFunction);
+        ul.appendChild(li);
+      });
+    });
+
+  let clickedButtonFunction = function(event) {
+    var clickedButton = event.target;
+    console.log("the user was clicked ", clickedButton);
+    var email = clickedButton.getAttribute("data-email");
+    console.log("the email is", email);
+    var clickedLi = clickedButton.parentElement;
+    let emailSpan = document.createElement("li");
+    emailSpan.innerText = email;
+    clickedLi.appendChild(emailSpan);
+    clickedLi.removeChild(clickedButton);
+  };
+
+  const consolePosts = () => {
+    console.log("This is coming too early " + arrayOfUsers);
+  };
+
+  const displayPhotoAndName = () => {
+    //how do I reference an object, within a object, within a array and then store it into a html element?
+
+    const listElement = document.getElementById("users");
+    arrayOfUsers.map(user => {
+      const li = document.createElement("li");
+      const button = document.createElement("button");
+      button.innerHTML = "More Info";
+      button.addEventListener("click", function() {
+        moreInfo(user.id);
+      });
+      li.appendChild(
+        document.createTextNode(arrayOfUsers[0].user.name + " - ")
+      );
+      li.appendChild(button);
+      listElement.append(li);
+    });
+
+    // document.getElementById("photo").innerHTML = arrayOfUsers[0];
+  };
+
+  // var wrapper = $("#wrapper"),
+  //   container;
+  // for (var key in arrayOfUsers) {
+  //   container = $('<div id="users" class="container"></div>');
+  //   wrapper.append(container);
+  //   container.append('<div class="photo">' + arrayOfUsers[0].picture + "</div>");
+  //   container.append('<div class="name">' + key + "</div>");
+};
diff --git a/07week/CheckPoint2/dogeBall.md b/07week/CheckPoint2/dogeBall.md
@@ -0,0 +1,15 @@
+How we doing this:
+
+There will exist two separate classes.
+
+One class will make a player by adding to key's and values of people from list of people.
+
+One class will make a teamate out of a player by adding a key and value for team.
+
+A function will exits to basically move an entire key and its value from the list of people object, and then into the listOfPlayers array.
+
+Similarly another function will exist to move a player from the listofPlayers array and into either the redTeam or blueTeam array depening onf what the teammate class assigns to the player.
+
+The html page will have onclick buttons that will call functions that will remove content from the list of people list and place them into the player and team classes lists. Moving content around and assign people to player or teammate arrays.
+
+The javascript will basically serve to objects into arrays and then into another, to then be displayed in a new container designated to it while assigning new keys and values to the player object.
diff --git a/07week/CheckPoint2/index.html b/07week/CheckPoint2/index.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
+    <title>Dodge Ball</title>
+  </head>
+  <body>
+    <div>
+      <h4>List Of People</h4>
+      <ul id="people"></ul>
+    </div>
+    <button onclick="listPeopleChoices()">List People</button>
+    <div>
+      <h4>Dodge Ball Players</h4>
+      <ul id="players"></ul>
+    </div>
+    <div>
+      <h4>Blue Team</h4>
+      <ul id="blue"></ul>
+    </div>
+    <div>
+      <h4>Red Team</h4>
+      <ul id="red"></ul>
+    </div>
+    <script src="./main.js"></script>
+  </body>
+</html>