diff --git a/Week1/homework/js-exercises/dogPhotoex.js b/Week1/homework/js-exercises/dogPhotoex.js
new file mode 100644
index 000000000..144f9cd12
--- /dev/null
+++ b/Week1/homework/js-exercises/dogPhotoex.js
@@ -0,0 +1,59 @@
+"use strict";
+
+const buttonWithXhr = document.getElementById('xhr');
+const buttonWithAxios = document.getElementById('axios');
+const ul = document.querySelector('ul');
+ul.style.listStyleType = "none";
+
+buttonWithAxios.onclick = getImgWithAxios;
+buttonWithXhr.onclick = getImgWithXhr;
+
+function getImgWithXhr() {
+ const xhr = new XMLHttpRequest();
+ const url = "https://dog.ceo/api/breeds/image/random"
+ xhr.responseType = "json";
+
+ xhr.onload = function () {
+ if (xhr.status >= 200 && xhr.status < 400) {
+ const li = document.createElement('li');
+ li.innerHTML = `
+ 
+ `;
+ ul.appendChild(li);
+ } else {
+ console.log("Error", xhr.status)
+ }
+ }
+ xhr.onerror = function (error) {
+ console.log('Network error', error)
+ }
+ xhr.open("GET", url);
+ xhr.send();
+}
+
+// using AXIOS//
+function getImgWithAxios() {
+ const secondUrl = "https://dog.ceo/api/breeds/image/random";
+
+ axios.get(secondUrl)
+ .then(function (response) {
+ //with success
+ const li = document.createElement('li');
+ li.innerHTML = `
+ 
+ `;
+ ul.appendChild(li);
+
+ })
+ // in case of error
+ .catch(function (error) {
+ console.log(error);
+ });
+}
+
+document.getElementById('dogPhotoGallery').addEventListener('click', function () {
+ ul.innerHTML = "";
+ document.getElementById('dogPhotoGallery2').style.display = "block";
+ document.getElementById('programmerHumor2').style.display = 'none';
+});
+
diff --git a/Week1/homework/js-exercises/index.html b/Week1/homework/js-exercises/index.html
new file mode 100644
index 000000000..3a7dac02e
--- /dev/null
+++ b/Week1/homework/js-exercises/index.html
@@ -0,0 +1,35 @@
+
+
+
+
+
+
+ Codestin Search App
+
+
+
+
+
+
+
+
+
with XML http request
+
![]()
+
+
with AXIOS
+
![]()
+
+ ${repoCont.login}
+ ${repoCont.contributions}
+ ` ,
+ class: "contributorsDetail"
+ });
+ })
}
}
diff --git a/homework-classes/HeaderView.js b/homework-classes/HeaderView.js
index 11f9c8971..1012b1595 100755
--- a/homework-classes/HeaderView.js
+++ b/homework-classes/HeaderView.js
@@ -23,7 +23,7 @@
* @param {Object[]} repos An array of repository objects.
*/
render(repos) {
- createAndAppend('div', this.header, { text: this.account.name });
+ createAndAppend('h2', this.header, { text: 'HYF Repositories', id: 'hyf-header' });
this.select = createAndAppend('select', this.header, {
class: 'repo-select',
autofocus: 'autofocus',
diff --git a/homework-classes/RepoView.js b/homework-classes/RepoView.js
index 073166fea..4d35ca4d6 100755
--- a/homework-classes/RepoView.js
+++ b/homework-classes/RepoView.js
@@ -19,8 +19,19 @@
* @param {Object} repo A repository object.
*/
render(repo) {
- // TODO: replace this comment and the console.log with your own code
- console.log('RepoView', repo);
+ this.container.innerHTML = "";
+ createAndAppend('div', this.container, {
+ text:
+ ` Repository :
+ ${repo.name}
+ Description :
+ ${(repo.description === null) ? 'No description, website, or topics provided.' : repo.description}
+ Forks :
+ ${repo.forks}
+ Updated :
+ ${new Date(repo.updated_at).toLocaleString()}
`,
+ class: "repoDetail"
+ });
}
}
diff --git a/homework-classes/Util.js b/homework-classes/Util.js
index dc5d79a87..5833ad081 100755
--- a/homework-classes/Util.js
+++ b/homework-classes/Util.js
@@ -14,7 +14,7 @@
parent.appendChild(elem);
Object.entries(options).forEach(([key, value]) => {
if (key === 'text') {
- elem.textContent = value;
+ elem.innerHTML = value;
} else {
elem.setAttribute(key, value);
}
diff --git a/homework-classes/index.html b/homework-classes/index.html
index ad75b0d08..d831d77d6 100755
--- a/homework-classes/index.html
+++ b/homework-classes/index.html
@@ -1,33 +1,30 @@
-
-
-
-
-
-
-
-
-
- Codestin Search App
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+ Codestin Search App
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+