diff --git a/Week1/LESSONPLAN.md b/Week1/AmirHossein/LESSONPLAN.md similarity index 100% rename from Week1/LESSONPLAN.md rename to Week1/AmirHossein/LESSONPLAN.md diff --git a/Week1/MAKEME.md b/Week1/AmirHossein/MAKEME.md similarity index 100% rename from Week1/MAKEME.md rename to Week1/AmirHossein/MAKEME.md diff --git a/Week1/README.md b/Week1/AmirHossein/README.md similarity index 100% rename from Week1/README.md rename to Week1/AmirHossein/README.md diff --git a/Week1/assets/hyf-github-error.png b/Week1/AmirHossein/assets/hyf-github-error.png similarity index 100% rename from Week1/assets/hyf-github-error.png rename to Week1/AmirHossein/assets/hyf-github-error.png diff --git a/Week1/assets/hyf-github.png b/Week1/AmirHossein/assets/hyf-github.png similarity index 100% rename from Week1/assets/hyf-github.png rename to Week1/AmirHossein/assets/hyf-github.png diff --git a/Week1/homework/js-exercises/dogGallery.js b/Week1/AmirHossein/homework/js-exercises/dogGallery.js similarity index 100% rename from Week1/homework/js-exercises/dogGallery.js rename to Week1/AmirHossein/homework/js-exercises/dogGallery.js diff --git a/Week1/homework/js-exercises/getandomUser.js b/Week1/AmirHossein/homework/js-exercises/getandomUser.js similarity index 100% rename from Week1/homework/js-exercises/getandomUser.js rename to Week1/AmirHossein/homework/js-exercises/getandomUser.js diff --git a/Week1/homework/js-exercises/humor.js b/Week1/AmirHossein/homework/js-exercises/humor.js similarity index 100% rename from Week1/homework/js-exercises/humor.js rename to Week1/AmirHossein/homework/js-exercises/humor.js diff --git a/Week1/homework/js-exercises/index.html b/Week1/AmirHossein/homework/js-exercises/index.html similarity index 100% rename from Week1/homework/js-exercises/index.html rename to Week1/AmirHossein/homework/js-exercises/index.html diff --git a/Week1/traversy_ajax_crash/README.md b/Week1/AmirHossein/traversy_ajax_crash/README.md similarity index 100% rename from Week1/traversy_ajax_crash/README.md rename to Week1/AmirHossein/traversy_ajax_crash/README.md diff --git a/Week1/traversy_ajax_crash/ajax1.html b/Week1/AmirHossein/traversy_ajax_crash/ajax1.html similarity index 100% rename from Week1/traversy_ajax_crash/ajax1.html rename to Week1/AmirHossein/traversy_ajax_crash/ajax1.html diff --git a/Week1/traversy_ajax_crash/ajax1.js b/Week1/AmirHossein/traversy_ajax_crash/ajax1.js similarity index 100% rename from Week1/traversy_ajax_crash/ajax1.js rename to Week1/AmirHossein/traversy_ajax_crash/ajax1.js diff --git a/Week1/traversy_ajax_crash/ajax2.html b/Week1/AmirHossein/traversy_ajax_crash/ajax2.html similarity index 100% rename from Week1/traversy_ajax_crash/ajax2.html rename to Week1/AmirHossein/traversy_ajax_crash/ajax2.html diff --git a/Week1/traversy_ajax_crash/ajax2.js b/Week1/AmirHossein/traversy_ajax_crash/ajax2.js similarity index 100% rename from Week1/traversy_ajax_crash/ajax2.js rename to Week1/AmirHossein/traversy_ajax_crash/ajax2.js diff --git a/Week1/traversy_ajax_crash/ajax3.html b/Week1/AmirHossein/traversy_ajax_crash/ajax3.html similarity index 100% rename from Week1/traversy_ajax_crash/ajax3.html rename to Week1/AmirHossein/traversy_ajax_crash/ajax3.html diff --git a/Week1/traversy_ajax_crash/ajax3.js b/Week1/AmirHossein/traversy_ajax_crash/ajax3.js similarity index 100% rename from Week1/traversy_ajax_crash/ajax3.js rename to Week1/AmirHossein/traversy_ajax_crash/ajax3.js diff --git a/Week1/traversy_ajax_crash/sample.txt b/Week1/AmirHossein/traversy_ajax_crash/sample.txt similarity index 100% rename from Week1/traversy_ajax_crash/sample.txt rename to Week1/AmirHossein/traversy_ajax_crash/sample.txt diff --git a/Week1/traversy_ajax_crash/user.json b/Week1/AmirHossein/traversy_ajax_crash/user.json similarity index 100% rename from Week1/traversy_ajax_crash/user.json rename to Week1/AmirHossein/traversy_ajax_crash/user.json diff --git a/Week1/traversy_ajax_crash/users.json b/Week1/AmirHossein/traversy_ajax_crash/users.json similarity index 100% rename from Week1/traversy_ajax_crash/users.json rename to Week1/AmirHossein/traversy_ajax_crash/users.json diff --git a/Week2/AmirHossein/homework/js-exercises/doubleDigit.js b/Week2/AmirHossein/homework/js-exercises/doubleDigit.js new file mode 100644 index 000000000..2a975f4f2 --- /dev/null +++ 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)); \ No newline at end of file diff --git a/Week2/AmirHossein/homework/js-exercises/johnWho.js b/Week2/AmirHossein/homework/js-exercises/johnWho.js index a99b02cf4..90d5ca82a 100644 --- 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() \ No newline at end of file diff --git a/Week2/AmirHossein/homework/pokemon-app/.vscode/settings.json b/Week2/AmirHossein/homework/pokemon-app/.vscode/settings.json new file mode 100644 index 000000000..6f3a2913e --- /dev/null +++ b/Week2/AmirHossein/homework/pokemon-app/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "liveServer.settings.port": 5501 +} \ No newline at end of file diff --git a/Week2/AmirHossein/homework/pokemon-app/index.html b/Week2/AmirHossein/homework/pokemon-app/index.html new file mode 100644 index 000000000..b4614f847 --- /dev/null +++ b/Week2/AmirHossein/homework/pokemon-app/index.html @@ -0,0 +1,15 @@ + + + + + + Pokemon-app + + + + + + + \ No newline at end of file diff --git a/Week2/AmirHossein/homework/pokemon-app/script.js b/Week2/AmirHossein/homework/pokemon-app/script.js new file mode 100644 index 000000000..fc5382c91 --- /dev/null +++ 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 b/hackyourrepo-app/AmirHossein/hyf.png old mode 100755 new mode 100644 similarity index 100% rename from hackyourrepo-app/hyf.png rename to hackyourrepo-app/AmirHossein/hyf.png diff --git a/hackyourrepo-app/AmirHossein/index.html b/hackyourrepo-app/AmirHossein/index.html new file mode 100644 index 000000000..654eee321 --- /dev/null +++ b/hackyourrepo-app/AmirHossein/index.html @@ -0,0 +1,28 @@ + + + + + + + + + + + + HackYourRepo + + + + + + + + + + diff --git a/hackyourrepo-app/index.html b/hackyourrepo-app/AmirHossein/index2.html old mode 100755 new mode 100644 similarity index 97% rename from hackyourrepo-app/index.html rename to hackyourrepo-app/AmirHossein/index2.html index c17533242..c1690d406 --- a/hackyourrepo-app/index.html +++ b/hackyourrepo-app/AmirHossein/index2.html @@ -19,7 +19,7 @@ /> - +
+
isalga @@ -82,6 +82,5 @@ - - - + + \ No newline at end of file diff --git a/hackyourrepo-app/AmirHossein/script.js b/hackyourrepo-app/AmirHossein/script.js new file mode 100644 index 000000000..a283717af --- /dev/null +++ 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(); + +} + + + + + + + + + + + + diff --git a/hackyourrepo-app/style.css b/hackyourrepo-app/AmirHossein/style.css old mode 100755 new mode 100644 similarity index 75% rename from hackyourrepo-app/style.css rename to hackyourrepo-app/AmirHossein/style.css index 64627fdfd..2cf35bd15 --- a/hackyourrepo-app/style.css +++ b/hackyourrepo-app/AmirHossein/style.css @@ -6,6 +6,12 @@ padding: 0; box-sizing: border-box; +} +.container { + width: 80%; + margin: 0 auto; + + } #header { @@ -17,52 +23,70 @@ padding: 20px; } -p { - margin-right: 30px; -} -.container { - width: 80%; - margin: 0 auto; +#error { + width: auto; + margin-top: 5px; + padding: 10px; + box-shadow: + 0px 20px 30px 0px rgba(0, 0, 0, 0.05), + 0px 4px 4px 0 rgba(0, 0, 0, .15), + 1px 2px 2px 0 rgba(0, 0, 0, .2); + background-color: lightpink; + color: black; + display: none; +} +p { + margin-right: 30px; } .bottom-box { - display: flex; flex-direction: row; height: auto; + } #left-side { margin-top: 10px; width: 50%; + display: none; } + .card { margin-left: 5px; margin-top: 5px; box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.05), - 0px 4px 4px 0 rgba(0, 0, 0, .15), - 1px 2px 2px 0 rgba(0, 0, 0, .2); + 0px 0px 4px 0px rgba(0, 0, 0, .15), + 1px 2px 2px 0px rgba(0, 0, 0, .2); font-size: 2vmin; } + .card .col-right { padding-left: 30px; padding-right: 25px; + font-size: 0.9rem; } -.col-left { + +.col-left { + font-weight: bold; + font-size: 0.9rem; padding: 5px 0 0 5px; } + + #right-side { width: 50%; } + #contributor { margin-top: 10px; margin-left:0.4rem; @@ -73,12 +97,16 @@ p { border: 1px solid rgba(0, 0, 0, 0.12); border-bottom: none; height: 3em; + display: none; + } + .small-card { display: flex; justify-content: flex-start; align-items: center; margin: 0.4rem; + font-size: 0.9rem; } img { margin: 1rem; @@ -92,5 +120,5 @@ img { border-radius: 4px; margin-right: 1rem; margin-top: 1.3rem; - padding: 0.1rem 0.8rem; + padding: 0.2rem 0.4rem; } diff --git a/hackyourrepo-app/script.js b/hackyourrepo-app/script.js deleted file mode 100755 index 705924282..000000000 --- a/hackyourrepo-app/script.js +++ /dev/null @@ -1,26 +0,0 @@ -"use strict"; - -/* - Write here your JavaScript for HackYourRepo! -*/ -const placeholderRepos = [ - { - name: 'SampleRepo1', - description: 'This repository is meant to be a sample', - forks: 5, - updated: '2020-05-27 12:00:00', - }, - { - name: 'AndAnotherOne', - description: 'Another sample repo! Can you believe it?', - forks: 9, - updated: '2020-05-27 12:00:00', - }, - { - name: 'HYF-Is-The-Best', - description: - "This repository contains all things HackYourFuture. That's because HYF is amazing!!!!", - forks: 130, - updated: '2020-05-27 12:00:00', - }, -]; \ No newline at end of file