From d7381ca1b17313391936a44e4aa4defd0e60b759 Mon Sep 17 00:00:00 2001 From: sleepypimp Date: Sun, 9 May 2021 19:40:10 -0700 Subject: [PATCH 1/2] Final --- components/journal-entry.js | 26 ++++++++++++++++++++++++++ scripts/script.js | 18 +++++++++++++++--- 2 files changed, 41 insertions(+), 3 deletions(-) diff --git a/components/journal-entry.js b/components/journal-entry.js index e80ad95..e2b9271 100644 --- a/components/journal-entry.js +++ b/components/journal-entry.js @@ -74,6 +74,13 @@ class JournalEntry extends HTMLElement { // CODE GOES HERE + this.shadowRoot.title = entry.title; + this.shadowRoot.querySelector(".entry-title").innerHTML = entry.title; + this.shadowRoot.date = entry.date; + this.shadowRoot.querySelector(".entry-date").innerHTML = entry.date; + this.shadowRoot.content = entry.content; + this.shadowRoot.querySelector(".entry-content").innerHTML = entry.content; + if (entry.image) { let entryImage; /* @@ -85,6 +92,18 @@ class JournalEntry extends HTMLElement { // CODE GOES HERE vvv + entryImage = document.createElement('img'); + entryImage.className = "entry-image"; + entryImage.src = entry.image.src; + entryImage.alt = entry.image.alt; + this.shadowRoot.image = entryImage; + this.shadowRoot.querySelector(".entry").append(entryImage); + + + + + + @@ -110,6 +129,13 @@ class JournalEntry extends HTMLElement { */ // CODE GOES HERE vvv + entryAudio = document.createElement('audio'); + entryAudio.className = 'entry-audio'; + entryAudio.src = entry.audio; + entryAudio.controls = true; + + this.shadowRoot.audio = entryAudio; + this.shadowRoot.querySelector('.entry').append(entryAudio); diff --git a/scripts/script.js b/scripts/script.js index 054c06c..cb9e804 100644 --- a/scripts/script.js +++ b/scripts/script.js @@ -16,10 +16,10 @@ document.addEventListener('DOMContentLoaded', () => { * the current entry for each journal-entry element. */ - let url = "" // SET URL + let url = "https://cse110lab6.herokuapp.com/entries" // SET URL fetch(url) - .then( /* FILL IN RESPONSE HANDLING HERE */ ) + .then(response => response.json()/* FILL IN RESPONSE HANDLING HERE */ ) .then(entries => { entries.forEach((entry) => { @@ -27,9 +27,21 @@ document.addEventListener('DOMContentLoaded', () => { // CODE GOES HERE vvv - + + newPost = document.createElement('journal-entry'); + newPost.entry = entry; + const main = document.getElementsByTagName('main'); + main[0].appendChild(newPost); + + + + + + + + From acb6a444b6688a8011b564d59c7466d56cb08ca0 Mon Sep 17 00:00:00 2001 From: SleepyPimp <60827779+SleepyPimp@users.noreply.github.com> Date: Sun, 9 May 2021 19:42:50 -0700 Subject: [PATCH 2/2] Update README.md Donzo --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index e69de29..7463cb4 100644 --- a/README.md +++ b/README.md @@ -0,0 +1 @@ +Website: https://sleepypimp.github.io/Lab6/