diff --git a/Week1/homework/app.js b/Week1/homework/app.js
index a9b5f75d8..30ba13966 100644
--- a/Week1/homework/app.js
+++ b/Week1/homework/app.js
@@ -1,11 +1,184 @@
'use strict';
+{
+ let games = [
+ {
+ title: 'stardew_valley',
+ year: '2016',
+ company: 'ConcernedApe',
+ type: 'role play',
+ image: 'images/stardewvalley.jpg'
+ },
+ {
+ title: 'overwatch',
+ year: '2016',
+ company: 'blizzard',
+ type: 'shooter',
+ image: 'images/overwatch.png'
+ },
+ {
+ title: 'lineage',
+ year: '2003',
+ company: 'NCSOFT',
+ type: 'MMORPG',
+ image: 'images/lineage.png'
+ },
+ {
+ title: 'counter_strike',
+ year: '2000',
+ company: 'namco',
+ type: 'shooter',
+ image: 'images/counterstrike.jpg'
+ },
+ {
+ title: 'wow',
+ year: '2004',
+ company: "blizzard",
+ type: 'role play',
+ image: 'images/wow.jpg'
+ },
+ {
+ title: 'house_of_the_dead',
+ year: '1996',
+ company: 'sega',
+ type: 'light gun shooter',
+ image: 'images/hotd.jpg'
+ }
+ ]
+
+ document.body.onload = listGames;
+
+ function listGames() {
+ let ul = document.createElement('ul')
+ for (const game of games) {
+ let li = document.createElement('li');
+ li.innerHTML = `
${game.title}
`
+ li.innerHTML += `Year: ${game.year}
`
+ li.innerHTML += `Type: ${game.type}
`
+ li.innerHTML += `Company: ${game.company}
`
+ let cover = document.createElement("img");
+ cover.width = 250
+ cover.src = game.image;
+ li.appendChild(cover)
+ ul.appendChild(li);
+ }
+ document.body.appendChild(ul);
+ }
+}
+/* 'use strict';
+
+document.body.style.backgroundColor = "#AA0054";
+
{
- const bookTitles = [
- // Replace with your own book titles
- 'harry_potter_chamber_secrets',
- ];
+ const gameTitles = [
+ 'stardew_valley',
+ 'overwatch',
+ 'lineage',
+ 'counter_strike',
+ 'wow',
+ 'house_of_the_dead'
+ ];
+
+ let objGames = {
+ 'stardew_valley': {
+ properties: {
+ year: '2016',
+ company: 'ConcernedApe',
+ type: 'role play',
+ image: 'stardewvalley.jpg'
+ },
+ },
+ 'overwatch': {
+ properties: {
+ year: '2016',
+ company: 'blizzard',
+ type: 'shooter',
+ image: 'overwatch.png'
+ },
+ },
+ 'lineage': {
+ properties: {
+ year: '2003',
+ company: 'NCSOFT',
+ type: 'MMORPG',
+ image: 'lineage.png'
+ },
+ },
+ 'counter_strike': {
+ properties: {
+ year: '2000',
+ company: 'namco',
+ type: 'shooter',
+ image: 'counterstrike.jpg'
+ },
+ },
+ 'wow': {
+ properties: {
+ year: '2004',
+ company: "blizzard",
+ type: 'role play',
+ image: 'wow.jpg'
+ },
+ },
+ 'house_of_the_dead': {
+ properties: {
+ year: '1996',
+ company: 'sega',
+ type: 'light gun shooter',
+ image: 'hotd.jpg'
+ }
+ }
+ }
+
+
+
+ function listGamesOld() {
+
+
+ let ul = document.createElement('ul')
+ for (let i = 0; i < gameTitles.length; i++) {
+ let li = document.createElement('li');
+ li.textContent = gameTitles[i];
+ console.log()
+ ul.appendChild(li);
+
+ }
+
+ document.body.appendChild(ul);
+
+ }
+ document.body.onload = listGames;
+
+
+
+
+ function listGames() {
+
+ let i = 0;
+ let ul = document.createElement('ul')
+ let gameTitles = Object.keys(objGames);
+ let numberOfGames = gameTitles.length;
+ for (i = 0; i < numberOfGames; i++) {
+ console.log(gameTitles[i]);
+ console.log(objGames[gameTitles[i]]);
+ let li = document.createElement('li');
+ li.innerHTML = `${gameTitles[i]}
`
+ li.innerHTML += ` Year: ${objGames[gameTitles[i]].properties.year} `
+ li.innerHTML += ` Type: ${objGames[gameTitles[i]].properties.type} `
+ li.innerHTML += ` Company: ${objGames[gameTitles[i]].properties.company} `
+ let cover = document.createElement("img");
+ cover.src = objGames[gameTitles[i]].image;
+ li.innerHTML += `
${document.getElementById("albumCovers").appendChild(cover)}`;
+
+
+ ul.appendChild(li);
+
+ }
+
+ document.body.appendChild(ul);
+
+ }
- // Replace with your own code
- console.log(bookTitles);
}
+ */
+
diff --git a/Week1/homework/images/counterstrike.jpg b/Week1/homework/images/counterstrike.jpg
new file mode 100644
index 000000000..48440f953
Binary files /dev/null and b/Week1/homework/images/counterstrike.jpg differ
diff --git a/Week1/homework/images/hotd.jpg b/Week1/homework/images/hotd.jpg
new file mode 100644
index 000000000..6ecf8cc62
Binary files /dev/null and b/Week1/homework/images/hotd.jpg differ
diff --git a/Week1/homework/images/lineage.png b/Week1/homework/images/lineage.png
new file mode 100644
index 000000000..f8c4943c9
Binary files /dev/null and b/Week1/homework/images/lineage.png differ
diff --git a/Week1/homework/images/overwatch.png b/Week1/homework/images/overwatch.png
new file mode 100644
index 000000000..51387d528
Binary files /dev/null and b/Week1/homework/images/overwatch.png differ
diff --git a/Week1/homework/images/stardewvalley.jpg b/Week1/homework/images/stardewvalley.jpg
new file mode 100644
index 000000000..c898408f0
Binary files /dev/null and b/Week1/homework/images/stardewvalley.jpg differ
diff --git a/Week1/homework/images/wow.jpg b/Week1/homework/images/wow.jpg
new file mode 100644
index 000000000..d407b73f4
Binary files /dev/null and b/Week1/homework/images/wow.jpg differ
diff --git a/Week1/homework/index.html b/Week1/homework/index.html
index b22147cd1..51280cb86 100644
--- a/Week1/homework/index.html
+++ b/Week1/homework/index.html
@@ -1 +1,19 @@
-
\ No newline at end of file
+
+
+
+
+
+
+ Javascript 2
+
+
+
+ Games I like to play
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Week1/homework/style.css b/Week1/homework/style.css
index bab13ec23..f30aa52e7 100644
--- a/Week1/homework/style.css
+++ b/Week1/homework/style.css
@@ -1 +1,41 @@
-/* add your styling here */
\ No newline at end of file
+/* add your styling here */
+
+html {
+ background: rgb(172, 108, 73);
+ background: linear-gradient(0deg, rgba(172, 108, 73, 1) 0%, rgba(233, 176, 54, 1) 100%);
+}
+
+h2 {
+ color: rgb(5, 58, 58);
+ text-transform: uppercase;
+ text-decoration: underline;
+ font-family: sans-serif;
+}
+
+ul {
+ display: flex;
+ flex-direction: row;
+ margin-left: 25%;
+ padding: 5%;
+ flex-wrap: wrap;
+ list-style-type: none;
+}
+
+li {
+ align-content: center;
+ width: 50%;
+ flex-grow: 1;
+ font-family: sans-serif;
+ color: rgb(5, 58, 58);
+}
+
+img {
+ margin: 2%;
+}
+
+#main {
+ font-family: sans-serif;
+ text-align: center;
+ font-size: 3em;
+ color: rgb(5, 58, 58);
+}
\ No newline at end of file
diff --git a/Week2/example.html b/Week2/example.html
index 374f064c4..72c0fe92f 100644
--- a/Week2/example.html
+++ b/Week2/example.html
@@ -1,20 +1,25 @@
-
-
- Sample exercise
-
-
-
- Here is your advice for the day:
-
-
-
-
+
+
+
+ Sample exercise
+
+
+
+
+ Here is your advice for the day:
+
+
+
+
+
+