diff --git a/Week1/homework/app.js b/Week1/homework/app.js
index ffef836dc..a0fdcece2 100644
--- a/Week1/homework/app.js
+++ b/Week1/homework/app.js
@@ -1,11 +1,88 @@
'use strict';
{
+ /*
const bookTitles = [
- // Replace with your own book titles
- 'harry_potter_chamber_secrets'
- ];
+ 'the_mirage',
+ 'the_beginning_and_the_end',
+ 'palace_walk',
+ 'palace_of_desire',
+ 'sugar_street',
+ 'the_pub_of_the_black_cat',
+ 'the_thief_and_the_dogs',
+ 'autumn-quail',
+ 'the-search',
+ 'the-beggar'
+ ];
+ function main() {
+ const container = document.getElementById('page_content');
+ const list = document.createElement('ul');
+ container.appendChild(list);
+ for (let i = 0; i < bookTitles.length; i++) {
+ const bookName = document.createElement('li');
+ bookName.innerHTML = bookTitles[i];
+ list.appendChild(bookName);
+ }
+ }
+ */
- // Replace with your own code
- console.log(bookTitles);
+ const books = {
+ the_nose: { title: 'The Nose', language: 'Arabic (translated from Russian)', author: 'Nikolai Gogol', year: '1836' },
+ the_overcoat: { title: 'The Overcoat', language: 'Arabic (translated from Russian)', author: 'Nikolai Gogol', year: '1842' },
+ the_collected_works: { title: 'The Collected Works', language: 'Arabic (translated from Russian)', author: 'Anton Chekhov' },
+ palace_of_desire: { title: 'Palace of Desire', language: 'Arabic', author: 'Naguib Mahfouz', year: '1957' },
+ sugar_street: { title: 'Sugar Street', language: 'Arabic', author: 'Naguib Mahfouz', year: '1957' },
+ children_of_gebelawi: { title: 'Children of Gebelawi', language: 'Arabic', author: 'Naguib Mahfouz', year: '1959' },
+ the_thief_and_the_dogs: { title: 'The Thief and the Dogs', language: 'Arabic', author: 'Naguib Mahfouz', year: '1961' },
+ autumn_quail: { title: 'Autumn Quail', language: 'Arabic', author: 'Naguib Mahfouz', year: '1962' },
+ a_tale_of_two_cities: { title: 'A tale of Two Cities', language: 'English', author: 'Charles Dickens', year: '1859' },
+ the_happy_prince: { title: 'The Happy Prince', language: 'English', author: 'Oscar Wilde', year: '1888' }
+ };
+
+ function main() {
+ const container = document.getElementById('page_content');
+ const topHeader = document.createElement('h1');
+ topHeader.innerHTML = 'Books I have Read';
+ container.appendChild(topHeader);
+
+ for (const key in books) {
+ const header = document.createElement('h2');
+ header.innerHTML = key.replace(/_/g, ' ');
+ container.appendChild(header);
+ const list = document.createElement('ul');
+ list.setAttribute('id', key);
+ container.appendChild(list);
+ const arr = books[key];
+
+ for (const key in arr) {
+ const details = document.createElement('li');
+ details.innerHTML = key + ' : ' + arr[key];
+ list.appendChild(details);
+ }
+ }
+
+ const covers = {
+ the_nose: './img/the_nose.jpg',
+ the_overcoat: './img/the_overcoat.jpg',
+ the_collected_works: './img/the_collected_works.jpg',
+ palace_of_desire: './img/palace_of_desire.jpg',
+ sugar_street: './img/sugar_street.jpg',
+ children_of_gebelawi: './img/children_of_gebelawi.jpg',
+ the_thief_and_the_dogs: './img/the_thief_and_the_dogs.jpg',
+ autumn_quail: './img/autumn_quail.jpg',
+ a_tale_of_two_cities: './img/a_tale_of_two_cities.jpg',
+ the_happy_prince: './img/the_happy_prince.jpg'
+ };
+
+ for (const key in covers) {
+ const image = document.createElement('img');
+ image.setAttribute('src', covers[key]);
+ image.setAttribute('alt', 'cover_photo_for_a_book_named_' + key);
+ const listedImage = document.createElement('li');
+ listedImage.appendChild(image);
+ document.getElementById(key).appendChild(listedImage);
+ }
+ }
+
+ window.addEventListener('load', main);
}
diff --git a/Week1/homework/img/a_tale_of_two_cities.jpg b/Week1/homework/img/a_tale_of_two_cities.jpg
new file mode 100644
index 000000000..6d172f382
Binary files /dev/null and b/Week1/homework/img/a_tale_of_two_cities.jpg differ
diff --git a/Week1/homework/img/autumn_quail.jpg b/Week1/homework/img/autumn_quail.jpg
new file mode 100644
index 000000000..4e2107436
Binary files /dev/null and b/Week1/homework/img/autumn_quail.jpg differ
diff --git a/Week1/homework/img/children_of_gebelawi.jpg b/Week1/homework/img/children_of_gebelawi.jpg
new file mode 100644
index 000000000..56ac555db
Binary files /dev/null and b/Week1/homework/img/children_of_gebelawi.jpg differ
diff --git a/Week1/homework/img/palace_of_desire.jpg b/Week1/homework/img/palace_of_desire.jpg
new file mode 100644
index 000000000..a8fc63b8c
Binary files /dev/null and b/Week1/homework/img/palace_of_desire.jpg differ
diff --git a/Week1/homework/img/sugar_street.jpg b/Week1/homework/img/sugar_street.jpg
new file mode 100644
index 000000000..11f20cb38
Binary files /dev/null and b/Week1/homework/img/sugar_street.jpg differ
diff --git a/Week1/homework/img/the_collected_works.jpg b/Week1/homework/img/the_collected_works.jpg
new file mode 100644
index 000000000..8cb510f78
Binary files /dev/null and b/Week1/homework/img/the_collected_works.jpg differ
diff --git a/Week1/homework/img/the_happy_prince.jpg b/Week1/homework/img/the_happy_prince.jpg
new file mode 100644
index 000000000..aefeffac2
Binary files /dev/null and b/Week1/homework/img/the_happy_prince.jpg differ
diff --git a/Week1/homework/img/the_nose.jpg b/Week1/homework/img/the_nose.jpg
new file mode 100644
index 000000000..83039e219
Binary files /dev/null and b/Week1/homework/img/the_nose.jpg differ
diff --git a/Week1/homework/img/the_overcoat.jpg b/Week1/homework/img/the_overcoat.jpg
new file mode 100644
index 000000000..fe4b147be
Binary files /dev/null and b/Week1/homework/img/the_overcoat.jpg differ
diff --git a/Week1/homework/img/the_thief_and_the_dogs.jpg b/Week1/homework/img/the_thief_and_the_dogs.jpg
new file mode 100644
index 000000000..15f8e451a
Binary files /dev/null and b/Week1/homework/img/the_thief_and_the_dogs.jpg differ
diff --git a/Week1/homework/index.html b/Week1/homework/index.html
index b22147cd1..10c444abc 100644
--- a/Week1/homework/index.html
+++ b/Week1/homework/index.html
@@ -1 +1,15 @@
-
\ No newline at end of file
+
+
+
+
+
+ Books I have read
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Week1/homework/style.css b/Week1/homework/style.css
index bab13ec23..93cdacd5e 100644
--- a/Week1/homework/style.css
+++ b/Week1/homework/style.css
@@ -1 +1,43 @@
-/* add your styling here */
\ No newline at end of file
+@import url('https://fonts.googleapis.com/css?family=Raleway');
+* {
+ list-style-type: none;
+ margin: 0;
+ padding: 0;
+}
+body {
+ font-family: 'Raleway', sans-serif;
+ background-color: rgb(255,242,215);
+}
+li {
+ font-size: 1.5rem;
+ text-align: center;
+ line-height: 3.5rem;
+ color: rgb(73,52,43);
+}
+li:first-letter {text-transform: uppercase;}
+h1 {
+ text-align: center;
+ font-size: 3rem;
+ padding-top: 3.5rem;
+ padding-bottom: 1.5rem;
+ color: rgb(73,122,99);
+ font-weight: normal;
+}
+h2 {
+ text-transform: capitalize;
+ text-align: center;
+ font-size: 2.5rem;
+ padding-top: 2rem;
+ padding-bottom: 1.5rem;
+ color: rgb(150,152,190);
+ font-weight: normal;
+}
+img {
+ width: 350px;
+ padding: 3rem;
+}
+#page_content::after {
+ content: "";
+ display: block;
+ height: 50px;
+}
\ No newline at end of file