samravan · n4cr · Dec 29, 2020 · Dec 13, 2020 · Dec 20, 2020 · Dec 20, 2020
diff --git a/Week1/LESSONPLAN.md → Week1/AmirHossein/LESSONPLAN.md b/Week1/LESSONPLAN.md → Week1/AmirHossein/LESSONPLAN.md
diff --git a/Week1/MAKEME.md → Week1/AmirHossein/MAKEME.md b/Week1/MAKEME.md → Week1/AmirHossein/MAKEME.md
diff --git a/Week1/README.md → Week1/AmirHossein/README.md b/Week1/README.md → Week1/AmirHossein/README.md
diff --git a/Week1/assets/hyf-github-error.png → ...1/AmirHossein/assets/hyf-github-error.png b/Week1/assets/hyf-github-error.png → ...1/AmirHossein/assets/hyf-github-error.png
diff --git a/Week1/assets/hyf-github.png → Week1/AmirHossein/assets/hyf-github.png b/Week1/assets/hyf-github.png → Week1/AmirHossein/assets/hyf-github.png
diff --git a/Week1/homework/js-exercises/dogGallery.js → ...ssein/homework/js-exercises/dogGallery.js b/Week1/homework/js-exercises/dogGallery.js → ...ssein/homework/js-exercises/dogGallery.js
diff --git a/Week1/homework/js-exercises/getandomUser.js → ...ein/homework/js-exercises/getandomUser.js b/Week1/homework/js-exercises/getandomUser.js → ...ein/homework/js-exercises/getandomUser.js
diff --git a/Week1/homework/js-exercises/humor.js → ...mirHossein/homework/js-exercises/humor.js b/Week1/homework/js-exercises/humor.js → ...mirHossein/homework/js-exercises/humor.js
diff --git a/Week1/homework/js-exercises/index.html → ...rHossein/homework/js-exercises/index.html b/Week1/homework/js-exercises/index.html → ...rHossein/homework/js-exercises/index.html
diff --git a/Week1/traversy_ajax_crash/README.md → ...AmirHossein/traversy_ajax_crash/README.md b/Week1/traversy_ajax_crash/README.md → ...AmirHossein/traversy_ajax_crash/README.md
diff --git a/Week1/traversy_ajax_crash/ajax1.html → ...mirHossein/traversy_ajax_crash/ajax1.html b/Week1/traversy_ajax_crash/ajax1.html → ...mirHossein/traversy_ajax_crash/ajax1.html
diff --git a/Week1/traversy_ajax_crash/ajax1.js → .../AmirHossein/traversy_ajax_crash/ajax1.js b/Week1/traversy_ajax_crash/ajax1.js → .../AmirHossein/traversy_ajax_crash/ajax1.js
diff --git a/Week1/traversy_ajax_crash/ajax2.html → ...mirHossein/traversy_ajax_crash/ajax2.html b/Week1/traversy_ajax_crash/ajax2.html → ...mirHossein/traversy_ajax_crash/ajax2.html
diff --git a/Week1/traversy_ajax_crash/ajax2.js → .../AmirHossein/traversy_ajax_crash/ajax2.js b/Week1/traversy_ajax_crash/ajax2.js → .../AmirHossein/traversy_ajax_crash/ajax2.js
diff --git a/Week1/traversy_ajax_crash/ajax3.html → ...mirHossein/traversy_ajax_crash/ajax3.html b/Week1/traversy_ajax_crash/ajax3.html → ...mirHossein/traversy_ajax_crash/ajax3.html
diff --git a/Week1/traversy_ajax_crash/ajax3.js → .../AmirHossein/traversy_ajax_crash/ajax3.js b/Week1/traversy_ajax_crash/ajax3.js → .../AmirHossein/traversy_ajax_crash/ajax3.js
diff --git a/Week1/traversy_ajax_crash/sample.txt → ...mirHossein/traversy_ajax_crash/sample.txt b/Week1/traversy_ajax_crash/sample.txt → ...mirHossein/traversy_ajax_crash/sample.txt
diff --git a/Week1/traversy_ajax_crash/user.json → ...AmirHossein/traversy_ajax_crash/user.json b/Week1/traversy_ajax_crash/user.json → ...AmirHossein/traversy_ajax_crash/user.json
diff --git a/Week1/traversy_ajax_crash/users.json → ...mirHossein/traversy_ajax_crash/users.json b/Week1/traversy_ajax_crash/users.json → ...mirHossein/traversy_ajax_crash/users.json
diff --git a/Week2/AmirHossein/homework/js-exercises/doubleDigit.js b/Week2/AmirHossein/homework/js-exercises/doubleDigit.js
@@ -0,0 +1,11 @@
+function checkDoubleDigits(number) {
+    return new Promise((resolve, reject) => {
+        if(number > 10) {
+            resolve('The number is bigger than 10!');
+        } else {
+            reject('Error! The number is smaller than 10');
+        };
+    });
+
+}
+checkDoubleDigits(30).then(response => console.log(response));
diff --git a/Week2/AmirHossein/homework/js-exercises/johnWho.js b/Week2/AmirHossein/homework/js-exercises/johnWho.js
@@ -1,16 +1,21 @@
 const getAnonName = (firstName) => {
     return  new Promise((resolve, reject) => {
-        const fullName = `${firstName} Doe`
-        resolve(fullName)
-        console.log(fullName)
-
-
-
-        reject(new Error("You didn't pass in a first name!"))
+        const fullName = `${firstName} Doe`;
+        if(firstName) {
+        resolve(fullName);
+        } else {
+        reject(new Error("You didn't pass in a first name!"));
+        }
+    });
+};
+    getAnonName('Masood')
+        .then(response => {
+            console.log(response)
+        })
+        .catch(error => {
+            console.log(error)
+        })
 
-    })
 
 
-};
 
-getAnonName()
diff --git a/Week2/AmirHossein/homework/pokemon-app/.vscode/settings.json b/Week2/AmirHossein/homework/pokemon-app/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}
diff --git a/Week2/AmirHossein/homework/pokemon-app/index.html b/Week2/AmirHossein/homework/pokemon-app/index.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Pokemon-app</title>
+</head>
+<body>
+<!-- <select name="" id="">
+    <option value=""></option>
+</select> -->
+
+<script src="script.js"></script>
+</body>
+</html>
diff --git a/Week2/AmirHossein/homework/pokemon-app/script.js b/Week2/AmirHossein/homework/pokemon-app/script.js
@@ -0,0 +1,49 @@
+window.onload = main;
+function main() {
+    const url = 'https://pokeapi.co/api/v2/pokemon/?limit=20&offset=20'
+    const btn = document.createElement('button');
+    btn.innerHTML = 'Get Pokemon!'
+    document.body.appendChild(btn);
+    const select = document.createElement('select');
+    document.body.appendChild(select);
+    btn.addEventListener('click', () => [
+        fetchData(url, select)
+    ]);
+}
+
+function addPokemonToDOM(data, select) {
+    data.results.forEach(element => {
+        const option = document.createElement('option');
+        option.innerHTML = element.name;
+        option.value = element.name;
+        select.appendChild(option);
+
+    });
+    let image = document.createElement('img');
+    select.addEventListener('input', () => {
+        data.results.forEach(element => {
+            if(select.value == element.name) {
+                const pokUrl = element.url;
+                image.src = ''
+                fetch(pokUrl)
+                .then(response => response.json())
+                .then(data => {
+                    image.src = data.sprites.front_default;
+                    document.body.appendChild(image);
+                })
+                .catch(error => console.log(error))
+            }
+
+
+        })
+    } )
+}
+
+function fetchData(url, select) {
+    fetch(url)
+    .then(res => res.json())
+    .then(data => addPokemonToDOM(data, select))
+    .catch(error => console.log(error));
+
+}
+
diff --git a/hackyourrepo-app/hyf.png → hackyourrepo-app/AmirHossein/hyf.png b/hackyourrepo-app/hyf.png → hackyourrepo-app/AmirHossein/hyf.png
diff --git a/hackyourrepo-app/AmirHossein/index.html b/hackyourrepo-app/AmirHossein/index.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
+    />
+    <meta name="theme-color" content="#000000" />
+    <meta name="apple-mobile-web-app-capable" content="yes" />
+    <meta name="mobile-web-app-capable" content="yes" />
+    <meta name="format-detection" content="telephone=no" />
+    <link rel="apple-touch-icon" href="./hyf.png" />
+    <link rel="shortcut icon" type="image/png" href="./hyf.png" />
+    <title>HackYourRepo</title>
+    <link
+      href="https://fonts.googleapis.com/css?family=Roboto:400,700"
+      rel="stylesheet"
+    />
+    <link rel="stylesheet" href="./style.css" />
+  </head>
+  <body>
+
+
+
+    <script src="./script.js"></script>
+  </body>
+</html>
diff --git a/hackyourrepo-app/index.html → hackyourrepo-app/AmirHossein/index2.html b/hackyourrepo-app/index.html → hackyourrepo-app/AmirHossein/index2.html
@@ -19,7 +19,7 @@
     />
     <link rel="stylesheet" href="./style.css" />
   </head>
-  <body>
+<body>
     <div class="container">
       <section id="header">
         <p>HYF Repositories</p>
@@ -68,7 +68,7 @@
             <img src="https://avatars3.githubusercontent.com/u/3985124?v=4" alt="" class="userPhoto" width="50px">
             <a href="" class="userName">isalga</a>
             <div class="badge">9</div>
-            </div>
+          </div>
           <div class="card small-card">
             <img src="https://avatars3.githubusercontent.com/u/3985124?v=4" alt="" class="userPhoto" width="50px">
             <a href="" class="userName">isalga</a>
@@ -82,6 +82,5 @@
 
 
 
-    <script src="./script.js"></script>
-  </body>
-</html>
+    <!-- <script src="./script.js"></script> -->
+  </body>
diff --git a/hackyourrepo-app/AmirHossein/script.js b/hackyourrepo-app/AmirHossein/script.js
@@ -0,0 +1,149 @@
+"use strict";
+
+/*
+  Write here your JavaScript for HackYourRepo!
+*/
+window.onload = main;
+
+function main() {
+  const url = 'https://api.github.com/orgs/HackYourFuture/repos?per_page=100'; // The repositories API
+  const elFactory = (type, attributes, ...children) => {    // Function for creating elements
+    const el = document.createElement(type);
+    let key;
+    for (key in attributes) {
+      el.setAttribute(key, attributes[key]);
+    };
+
+    children.forEach(child => {
+      if (typeof child === 'string') {
+        el.appendChild(document.createTextNode(child));
+      } else {
+        el.appendChild(child);
+      }
+    });
+
+    return el
+  };
+
+  const container = elFactory('div', {class: 'container'});
+  const header = elFactory('section', {id: 'header'},
+    elFactory('p', {}, 'HYF Repositories'),
+    elFactory('select', {class: 'selectMenu'}
+    ));
+  const bottomBox = elFactory('div', {class: 'bottom-box'});
+  const errorBox = elFactory('div', {id: 'error'});
+  const leftSide = elFactory('section', {id: 'left-side'});
+  const card = elFactory('div', {class: 'card'},    // Cards that inserted to the left box.
+      elFactory('table', {},
+        elFactory('tr', {},
+          elFactory('td', {class: 'col-left'}, 'Repositories: '),
+          elFactory('td', {class: 'col-right rep-text'}, elFactory('a', {href: '#', class: 'repo-link'}, ))),
+        elFactory('tr', {},
+          elFactory('td', {class: 'col-left'}, 'Description: '),
+          elFactory('td', {class: 'col-right rep-description'}, '')),
+        elFactory('tr', {},
+          elFactory('td', {class: 'col-left'}, 'Forks: '),
+          elFactory('td', {class: 'col-right rep-fork'}, '')),
+        elFactory('tr', {},
+          elFactory('td', {class: 'col-left'}, 'Update: '),
+          elFactory('td', {class: 'col-right rep-update'}, ''))));
+
+  const rightSide = elFactory('section', {id: 'right-side'},
+    elFactory('div', {id: 'contributor'}, 'Contributors'));
+  const select = header.querySelector('select');
+  const cardName = elFactory('div', {id: 'cardNameBox'}); // Box to add small cards of contributors
+  container.appendChild(header);
+  container.appendChild(errorBox);
+  bottomBox.appendChild(leftSide);
+  bottomBox.appendChild(rightSide);
+  leftSide.appendChild(card);
+  rightSide.appendChild(cardName);
+  container.appendChild(bottomBox);
+  document.body.appendChild(container)
+
+  // Adding repository names to the select element.
+  function addrepoNames(data) {
+    data.forEach(element => {
+      const option = elFactory('option', {value: ''})
+      option.innerHTML = element.name;
+      option.value = element.name;
+
+      select.appendChild(option);
+    });
+
+    // Function to fetch data for items in select elemen.
+    select.addEventListener('input', () => {
+      document.querySelector('#left-side').style.display = 'block';
+      document.querySelector('#contributor').style.display = 'block';
+      cardName.innerHTML = ''
+      // IF the value of option is equal to element name this function will work.
+      // Despite showing error this section still works! I don't know how should I fix it.
+      data.forEach(element => {
+        if(select.value == element.name) {
+          // Adding items to description part
+          const repoDescription = card.querySelector('.rep-description');
+          const repoName = card.querySelector('.repo-link');
+          const forks = card.querySelector('.rep-fork');
+          const update = card.querySelector('.rep-update');
+          repoDescription.innerHTML = element.description;
+          repoName.innerHTML = element.name;
+          repoName.href = element.html_url;
+          forks.innerHTML = element.forks;
+          update.innerHTML = element.updated_at;
+
+          const contributorsUrl = element.contributors_url;   // URL of contributors
+          fetch(contributorsUrl)
+          .then(response => response.json())
+
+          // Creat and adding contributors name to the right side of the page.
+          .then(data2 => {
+            data2.forEach(element2 => {
+              const smallCard = elFactory('div', {class: 'card small-card'},
+              elFactory('img', {src: '', class: 'userPhoto', width: '50px'}),
+              elFactory('a', {href: '', class: 'userName'}, ''),
+              elFactory('div', {class: 'badge'}, ''));
+              const userName = smallCard.querySelector('.userName');
+              const image = smallCard.querySelector('img');
+              const badge = smallCard.querySelector('.badge');
+              image.src = element2.avatar_url;
+              userName.innerHTML = element2.login;
+              userName.href = element2.html_url;
+              badge.innerHTML = element2.contributions;
+              document.getElementById('error').style.display = 'none';
+              cardName.appendChild(smallCard)
+            })
+            })
+            .catch(error => {
+              errorBox.innerHTML = error;
+              document.getElementById('error').style.display = 'block';
+            })
+            console.log(container)
+        }
+      })
+    })
+
+  };
+  function fetchData() {
+    fetch(url)
+    .then(res => res.json())
+    .then(data => addrepoNames(data))
+    .catch(error => {
+      errorBox.innerHTML = error;
+      document.getElementById('error').style.display = 'block';
+    })
+  }
+  fetchData();
+
+}
+
+
+
+
+
+
+
+
+
+
+
+