From e62d33ccaed7742b3ed15bc5472fa9422f28d251 Mon Sep 17 00:00:00 2001 From: NKIPSC <15067635+NKIPSC@users.noreply.github.com> Date: Mon, 26 Sep 2022 19:35:23 -0600 Subject: [PATCH] Blur NSFW posts. Reimplementation of libreddit/libreddit#482. Co-authored by: Daniel Valentine --- app.json | 3 +++ src/client.rs | 6 +---- src/settings.rs | 3 ++- src/utils.rs | 2 ++ static/style.css | 45 ++++++++++++++++++++++++++------ templates/post.html | 38 +++++++++++++++------------ templates/settings.html | 7 ++++- templates/utils.html | 57 ++++++++++++++++++++++++----------------- 8 files changed, 107 insertions(+), 54 deletions(-) diff --git a/app.json b/app.json index 8573671..fd41fc8 100644 --- a/app.json +++ b/app.json @@ -32,6 +32,9 @@ "LIBREDDIT_DEFAULT_SHOW_NSFW": { "required": false }, + "LIBREDDIT_DEFAULT_BLUR_NSFW": { + "required": false + }, "LIBREDDIT_USE_HLS": { "required": false }, diff --git a/src/client.rs b/src/client.rs index 92b5529..da78304 100644 --- a/src/client.rs +++ b/src/client.rs @@ -46,11 +46,7 @@ pub async fn canonical_path(path: String) -> Result, String> { res .headers() .get(header::LOCATION) - .map(|val| percent_encode(val.as_bytes(), CONTROLS) - .to_string() - .trim_start_matches(REDDIT_URL_BASE) - .to_string() - ), + .map(|val| percent_encode(val.as_bytes(), CONTROLS).to_string().trim_start_matches(REDDIT_URL_BASE).to_string()), ) } diff --git a/src/settings.rs b/src/settings.rs index 9cdd266..0fd2640 100644 --- a/src/settings.rs +++ b/src/settings.rs @@ -19,7 +19,7 @@ struct SettingsTemplate { // CONSTANTS -const PREFS: [&str; 10] = [ +const PREFS: [&str; 11] = [ "theme", "front_page", "layout", @@ -27,6 +27,7 @@ const PREFS: [&str; 10] = [ "comment_sort", "post_sort", "show_nsfw", + "blur_nsfw", "use_hls", "hide_hls_notification", "autoplay_videos", diff --git a/src/utils.rs b/src/utils.rs index a458cd8..0f15537 100644 --- a/src/utils.rs +++ b/src/utils.rs @@ -462,6 +462,7 @@ pub struct Preferences { pub layout: String, pub wide: String, pub show_nsfw: String, + pub blur_nsfw: String, pub hide_hls_notification: String, pub use_hls: String, pub autoplay_videos: String, @@ -493,6 +494,7 @@ impl Preferences { layout: setting(&req, "layout"), wide: setting(&req, "wide"), show_nsfw: setting(&req, "show_nsfw"), + blur_nsfw: setting(&req, "blur_nsfw"), use_hls: setting(&req, "use_hls"), hide_hls_notification: setting(&req, "hide_hls_notification"), autoplay_videos: setting(&req, "autoplay_videos"), diff --git a/static/style.css b/static/style.css index 1552c22..ba07fc2 100644 --- a/static/style.css +++ b/static/style.css @@ -716,22 +716,39 @@ a.search_subreddit:hover { font-weight: bold; } -.post_media_image, .post .__NoScript_PlaceHolder__, .post_media_video, .gallery { +.post_media_content, .post .__NoScript_PlaceHolder__, .gallery { max-width: calc(100% - 40px); grid-area: post_media; margin: 15px auto 5px auto; + width: auto; height: auto; + overflow: hidden; } - -.post_media_video.short { - max-height: 512px; +.post_media_video { width: auto; + height: auto; + max-width: 100%; + max-height: 512px; + display: block; + margin: auto; } .post_media_image.short svg, .post_media_image.short img{ - max-height: 512px; width: auto; + height: auto; + max-width: 100%; + max-height: 512px; + display: block; + margin: auto; +} + +.post_nsfw_blur { + filter: blur(1.5rem); +} + +.post_nsfw_blur:hover { + filter: none; } .post_media_image svg{ @@ -827,13 +844,25 @@ a.search_subreddit:hover { margin: 5px; } -.post_thumbnail svg { +.post_thumbnail div { grid-area: 1 / 1 / 2 / 2; - width: 100%; - height: auto; object-fit: cover; align-self: center; justify-self: center; + overflow: hidden; +} + +.post_thumbnail div svg { + width: 100%; + height: auto; +} + +.post_thumbnail span { + z-index: 0; +} + +.thumb_nsfw_blur { + filter: blur(0.3rem) } .post_thumbnail.no_thumbnail { diff --git a/templates/post.html b/templates/post.html index e447eb3..8f12131 100644 --- a/templates/post.html +++ b/templates/post.html @@ -68,27 +68,33 @@ {% if post.post_type == "image" %} - - - - - Post image - - - +
+ + + + + Post image + + + +
{% else if post.post_type == "video" || post.post_type == "gif" %} {% if prefs.use_hls == "on" && !post.media.alt_url.is_empty() %} - +
+ +
{% else %} - +
+ +
{% call utils::render_hls_notification(post.permalink[1..]) %} {% endif %} {% else if post.post_type == "gallery" %} diff --git a/templates/settings.html b/templates/settings.html index 60ee109..ed5809d 100644 --- a/templates/settings.html +++ b/templates/settings.html @@ -54,6 +54,11 @@ +
+ + + +
@@ -110,7 +115,7 @@

Note: settings and subscriptions are saved in browser cookies. Clearing your cookies will reset them.


-

You can restore your current settings and subscriptions after clearing your cookies using this link.

+

You can restore your current settings and subscriptions after clearing your cookies using this link.

diff --git a/templates/utils.html b/templates/utils.html index 7864200..110dcbe 100644 --- a/templates/utils.html +++ b/templates/utils.html @@ -94,27 +94,36 @@ {% if (prefs.layout.is_empty() || prefs.layout == "card") && post.post_type == "image" %} - - - - - Post image - - - +
+ + + + + Post image + + + +
{% else if (prefs.layout.is_empty() || prefs.layout == "card") && post.post_type == "gif" %} - +
+ +
{% else if (prefs.layout.is_empty() || prefs.layout == "card") && post.post_type == "video" %} {% if prefs.use_hls == "on" && !post.media.alt_url.is_empty() %} - +
+ +
{% else %} - +
+ +
{% call render_hls_notification(format!("{}%23{}", &self.url[1..].replace("&", "%26").replace("+", "%2B"), post.id)) %} {% endif %} {% else if post.post_type != "self" %} @@ -125,12 +134,14 @@ {% else %} - - - - Thumbnail - - +
+ + + + Thumbnail + + +
{% endif %} {% if post.post_type == "link" %}{{ post.domain }}{% else %}{{ post.post_type }}{% endif %}