From c1282f68339000f9cf7f1a279a16a71d1d181972 Mon Sep 17 00:00:00 2001 From: Sam Ireland Date: Sun, 3 Jan 2021 02:26:38 +0000 Subject: [PATCH] Start JS integration --- html/main.js | 23 +++++++++++++++++++++++ html/post.html | 2 +- html/saved.html | 6 +++++- html/style.css | 18 ++++++++++++++++++ html/upvoted.html | 2 +- save.py | 2 ++ utilities.py | 2 ++ 7 files changed, 52 insertions(+), 3 deletions(-) create mode 100644 html/main.js diff --git a/html/main.js b/html/main.js new file mode 100644 index 0000000..7c786f7 --- /dev/null +++ b/html/main.js @@ -0,0 +1,23 @@ +const toggleView = () => { + const postsSection = document.querySelector(".posts-section"); + const commentsSection = document.querySelector(".comments-section"); + if (commentsSection.style.display === "none") { + commentsSection.style.display = "block"; + postsSection.style.display = "none"; + } else { + postsSection.style.display = "block"; + commentsSection.style.display = "none"; + } +} + +window.addEventListener("load", function() { +const postsSection = document.querySelector(".posts-section"); +const commentsSection = document.querySelector(".comments-section"); +if (commentsSection) { + commentsSection.style.display = "none"; + const toggleButton = document.createElement("button"); + toggleButton.innerText = "toggle"; + toggleButton.addEventListener("click", toggleView); + document.body.insertBefore(toggleButton, postsSection); +} +}) \ No newline at end of file diff --git a/html/post.html b/html/post.html index e3053c4..8869b2c 100644 --- a/html/post.html +++ b/html/post.html @@ -3,8 +3,8 @@ <!--title--> + -
diff --git a/html/saved.html b/html/saved.html index 3601a36..cdd8177 100644 --- a/html/saved.html +++ b/html/saved.html @@ -3,12 +3,16 @@ Saved Posts + - +

Saved Posts

+
+

Saved Comments

+
\ No newline at end of file diff --git a/html/style.css b/html/style.css index 895b861..d49f806 100644 --- a/html/style.css +++ b/html/style.css @@ -121,4 +121,22 @@ h1 { font-weight: bold; font-size: 20px; padding: 8px 16px; +} + +button { + border: 1px solid #1abc9c60; + color: #1abc9c; + border-radius: 5px; + padding: 4px 8px;; + font-size: 12px; + cursor: pointer; + position: absolute; + right: 16px; + font-weight: bold; + top: 10px; + background-color: #1abc9c20; +} + +button:hover { + background-color: #1abc9c40; } \ No newline at end of file diff --git a/html/upvoted.html b/html/upvoted.html index 6f3c88f..09c0dd2 100644 --- a/html/upvoted.html +++ b/html/upvoted.html @@ -3,8 +3,8 @@ Upvoted Posts + -

Upvoted Posts

diff --git a/save.py b/save.py index acd7e1d..7a31a7d 100755 --- a/save.py +++ b/save.py @@ -93,6 +93,8 @@ with open(os.path.join("html", html_file)) as f: html = f.read() with open(os.path.join("html", "style.css")) as f: html = html.replace("", f"") +with open(os.path.join("html", "main.js")) as f: + html = html.replace("", f"") html = html.replace("", "\n".join(posts_html)) html = html.replace("", "\n".join(comments_html)) with open(os.path.join(location, html_file), "w") as f: diff --git a/utilities.py b/utilities.py index 7b9ee1d..d5973f8 100644 --- a/utilities.py +++ b/utilities.py @@ -178,6 +178,8 @@ def create_post_page_html(post, post_html): )) with open(os.path.join("html", "style.css")) as f: html = html.replace("", f"") + with open(os.path.join("html", "main.js")) as f: + html = html.replace("", f"") comments_html = [] post.comments.replace_more(limit=0) for comment in post.comments: