Merge remote-tracking branch 'origin/pull/536'

README.md

@@ -224,24 +224,20 @@ Assign a default value for each instance-specific setting by passing environment
 
 Assign a default value for each user-modifiable setting by passing environment variables to Libreddit in the format `LIBREDDIT_DEFAULT_{Y}`. Replace `{Y}` with the setting name (see list below) in capital letters.
 
-| Name                                | Possible values                                                                                                                    | Default value |
+| Name                    | Possible values                                                                                     | Default value |
-|-------------------------------------|------------------------------------------------------------------------------------------------------------------------------------|---------------|
+|-------------------------|-----------------------------------------------------------------------------------------------------|---------------|
-| `THEME`                             | `["system", "light", "dark", "black", "dracula", "nord", "laserwave", "violet", "gold", "rosebox", "gruvboxdark", "gruvboxlight"]` | `system`      |
+| `THEME`                 | `["system", "light", "dark", "black", "dracula", "nord", "laserwave", "violet", "gold", "rosebox", "gruvboxdark", "gruvboxlight"]` | `system`      |
-| `FRONT_PAGE`                        | `["default", "popular", "all"]`                                                                                                    | `default`     |
+| `FRONT_PAGE`            | `["default", "popular", "all"]`                                                                     | `default`     |
-| `LAYOUT`                            | `["card", "clean", "compact"]`                                                                                                     | `card`        |
+| `LAYOUT`                | `["card", "clean", "compact"]`                                                                      | `card`        |
-| `WIDE`                              | `["on", "off"]`                                                                                                                    | `off`         |
+| `WIDE`                  | `["on", "off"]`                                                                                     | `off`         |
-| `POST_SORT`                         | `["hot", "new", "top", "rising", "controversial"]`                                                                                 | `hot`         |
+| `POST_SORT`             | `["hot", "new", "top", "rising", "controversial"]`                                                  | `hot`         |
-| `COMMENT_SORT`                      | `["confidence", "top", "new", "controversial", "old"]`                                                                             | `confidence`  |
+| `COMMENT_SORT`          | `["confidence", "top", "new", "controversial", "old"]`                                              | `confidence`  |
-| `SHOW_NSFW`                         | `["on", "off"]`                                                                                                                    | `off`         |
+| `SHOW_NSFW`             | `["on", "off"]`                                                                                     | `off`         |
-| `BLUR_NSFW`                         | `["on", "off"]`                                                                                                                    | `off`         |
+| `BLUR_NSFW`             | `["on", "off"]`                                                                                     | `off`         |
-| `USE_HLS`                           | `["on", "off"]`                                                                                                                    | `off`         |
+| `USE_HLS`               | `["on", "off"]`                                                                                     | `off`         |
-| `HIDE_HLS_NOTIFICATION`             | `["on", "off"]`                                                                                                                    | `off`         |
+| `HIDE_HLS_NOTIFICATION` | `["on", "off"]`                                                                                     | `off`         |
-| `AUTOPLAY_VIDEOS`                   | `["on", "off"]`                                                                                                                    | `off`         |
+| `AUTOPLAY_VIDEOS`       | `["on", "off"]`                                                                                     | `off`         |
-| `SUBSCRIPTIONS`                     | `+`-delimited list of subreddits (`sub1+sub2+sub3+...`)                                                                            | _(none)_      | 
+| `FIXED_NAVBAR`          | `["on", "off"]`                                                                                     | `on`          |
-| `HIDE_AWARDS`                       | `["on", "off"]`                                                                                                                    | `off`         |
-| `DISABLE_VISIT_REDDIT_CONFIRMATION` | `["on", "off"]`                                                                                                                    | `off`         |
-| `DISABLE_STATS_COLLECTION`          |  Any string to disable                                                                                                             | _(none)_      |
-| `HIDE_SCORE`                        | `["on", "off"]`                                                                                                                    | `off`         |
 
 You can also configure Libreddit with a configuration file. An example `libreddit.toml` can be found below:
 

src/settings.rs

@@ -19,7 +19,7 @@ struct SettingsTemplate {
 
 // CONSTANTS
 
-const PREFS: [&str; 14] = [
+const PREFS: [&str; 13] = [
 	"theme",
 	"front_page",
 	"layout",
@@ -31,6 +31,7 @@ const PREFS: [&str; 14] = [
 	"use_hls",
 	"hide_hls_notification",
 	"autoplay_videos",
+	"fixed_navbar",
 	"hide_awards",
 	"hide_score",
 	"disable_visit_reddit_confirmation",

src/utils.rs

@@ -572,7 +572,7 @@ pub struct Preferences {
 	pub hide_hls_notification: String,
 	pub use_hls: String,
 	pub autoplay_videos: String,
-	pub disable_visit_reddit_confirmation: String,
+	pub fixed_navbar: String,
 	pub comment_sort: String,
 	pub post_sort: String,
 	pub subscriptions: Vec<String>,
@@ -607,7 +607,7 @@ impl Preferences {
 			use_hls: setting(&req, "use_hls"),
 			hide_hls_notification: setting(&req, "hide_hls_notification"),
 			autoplay_videos: setting(&req, "autoplay_videos"),
-			disable_visit_reddit_confirmation: setting(&req, "disable_visit_reddit_confirmation"),
+			fixed_navbar: setting_or_default(&req, "fixed_navbar", "on".to_string()),
 			comment_sort: setting(&req, "comment_sort"),
 			post_sort: setting(&req, "post_sort"),
 			subscriptions: setting(&req, "subscriptions").split('+').map(String::from).filter(|s| !s.is_empty()).collect(),
@@ -769,6 +769,16 @@ pub fn setting(req: &Request<Body>, name: &str) -> String {
 		.to_string()
 }
 
+// Retrieve the value of a setting by name or the default value
+pub fn setting_or_default(req: &Request<Body>, name: &str, default: String) -> String {
+	let value = setting(req, name);
+	if !value.is_empty() {
+		value
+	} else {
+		default
+	}
+}
+
 // Detect and redirect in the event of a random subreddit
 pub async fn catch_random(sub: &str, additional: &str) -> Result<Response<Body>, String> {
 	if sub == "random" || sub == "randnsfw" {

static/style.css

@@ -100,6 +100,9 @@ pre, form, fieldset, table, th, td, select, input {
 body {
 	background: var(--background);
 	font-size: 15px;
+}
+
+body.fixed_navbar {
 	padding-top: 60px;
 	padding-bottom: var(--footer-height);
 	min-height: calc(100vh - 60px);
@@ -122,8 +125,12 @@ nav {
 	z-index: 2;
 	top: 0;
 	padding: 5px 15px;
+	margin-bottom: 10px;
 	min-height: 40px;
 	width: calc(100% - 30px);
+}
+
+nav.fixed_navbar {
 	position: fixed;
 }
 
@@ -1566,10 +1573,7 @@ td, th {
 /* Mobile */
 
 @media screen and (max-width: 800px) {
-	body {
+	body.fixed_navbar { padding-top: 120px }
-		padding-top: 120px;
-		padding-bottom: var(--footer-height);
-	}
 
 	main {
 		flex-direction: column-reverse;
@@ -1612,10 +1616,8 @@ td, th {
 }
 
 @media screen and (max-width: 480px) {
-	body {
+	body.fixed_navbar { padding-top: 100px; }
-		padding-top: 100px;
+	#version { display: none; }
-		padding-bottom: var(--footer-height);
-	}
 
 	.post {
 		grid-template: 	"post_header post_header post_thumbnail" auto

templates/base.html

@@ -27,9 +27,11 @@
 	<body class="
 		{% if prefs.layout != "" %}{{ prefs.layout }}{% endif %}
 		{% if prefs.wide == "on" %} wide{% endif %}
-		{% if prefs.theme != "system" %} {{ prefs.theme }}{% endif %}">
+		{% if prefs.theme != "system" %} {{ prefs.theme }}{% endif %}
+		{% if prefs.fixed_navbar == "on" %} fixed_navbar{% endif %}">
 		<!-- NAVIGATION BAR -->
-		<nav>
+		<nav class="
+			{% if prefs.fixed_navbar == "on" %} fixed_navbar{% endif %}">
 			<div id="logo">
 				<a id="libreddit" href="/"><span id="lib">lib</span><span id="reddit">reddit.</span></a>
 				{% block subscriptions %}{% endblock %}

templates/settings.html

@@ -11,6 +11,61 @@
 	<div id="settings">
 	<form action="/settings" method="POST">
 		<div class="prefs">
+			<legend>Appearance</legend>
+			<div id="theme">
+				<label for="theme">Theme:</label>
+				<select name="theme"> 
+					{% call utils::options(prefs.theme, prefs.available_themes, "system") %}
+				</select>
+			</div>
+			<legend>Interface</legend>
+			<div id="front_page">
+				<label for="front_page">Front page:</label>
+				<select name="front_page"> 
+					{% call utils::options(prefs.front_page, ["default", "popular", "all"], "default") %}
+				</select>
+			</div>
+			<div id="layout">
+				<label for="layout">Layout:</label>
+				<select name="layout"> 
+					{% call utils::options(prefs.layout, ["card", "clean", "compact"], "card") %}
+				</select>
+			</div>
+			<div id="wide">
+				<label for="wide">Wide UI:</label>
+				<input type="hidden" value="off" name="wide">
+				<input type="checkbox" name="wide" {% if prefs.wide == "on" %}checked{% endif %}>
+			</div>
+			<legend>Content</legend>
+			<div id="post_sort">
+				<label for="post_sort" title="Applies only to subreddit feeds">Default subreddit post sort:</label>
+				<select name="post_sort"> 
+					{% call utils::options(prefs.post_sort, ["hot", "new", "top", "rising", "controversial"], "hot") %}
+				</select>
+			</div>
+			<div id="comment_sort">
+				<label for="comment_sort">Default comment sort:</label>
+				<select name="comment_sort"> 
+					{% call utils::options(prefs.comment_sort, ["confidence", "top", "new", "controversial", "old"], "confidence") %}
+				</select>
+			</div>
+			<div id="show_nsfw">
+				<label for="show_nsfw">Show NSFW posts:</label>
+				<input type="hidden" value="off" name="show_nsfw">
+				<input type="checkbox" name="show_nsfw" {% if prefs.show_nsfw == "on" %}checked{% endif %}>
+			</div>
+			<div id="autoplay_videos">
+				<label for="autoplay_videos">Autoplay videos</label>
+				<input type="hidden" value="off" name="autoplay_videos">
+				<input type="checkbox" name="autoplay_videos" {% if prefs.autoplay_videos == "on" %}checked{% endif %}>
+			</div>
+			<div id="fixed_navbar">
+				<label for="fixed_navbar">Keep navbar fixed</label>
+				<input type="hidden" value="off" name="fixed_navbar">
+				<input type="checkbox" name="fixed_navbar" {% if prefs.fixed_navbar == "on" %}checked{% endif %}>
+			</div>
+			<div id="use_hls">
+				<label for="use_hls">Use HLS for videos
 			<fieldset>
 				<legend>Appearance</legend>
 				<div class="prefs-group">
@@ -71,6 +126,11 @@
 					<input type="hidden" value="off" name="autoplay_videos">
 					<input type="checkbox" name="autoplay_videos" id="autoplay_videos" {% if prefs.autoplay_videos == "on" %}checked{% endif %}>
 				</div>
+        <div class="prefs-group">
+					<label for="fixed_navbar">Keep navbar fixed</label>
+        	<input type="hidden" value="off" name="fixed_navbar">
+        	<input type="checkbox" name="fixed_navbar" {% if prefs.fixed_navbar == "on" %}checked{% endif %}>
+        </div>
 				<div class="prefs-group">
 					<label for="use_hls">Use HLS for videos</label>
 					<details id="feeds">
@@ -137,7 +197,7 @@
 
 	<div id="settings_note">
 		<p><b>Note:</b> settings and subscriptions are saved in browser cookies. Clearing your cookies will reset them.</p><br>
-    <p>You can restore your current settings and subscriptions after clearing your cookies using <a href="/settings/restore/?theme={{ prefs.theme }}&front_page={{ prefs.front_page }}&layout={{ prefs.layout }}&wide={{ prefs.wide }}&post_sort={{ prefs.post_sort }}&comment_sort={{ prefs.comment_sort }}&show_nsfw={{ prefs.show_nsfw }}&blur_nsfw={{ prefs.blur_nsfw }}&use_hls={{ prefs.use_hls }}&hide_hls_notification={{ prefs.hide_hls_notification }}&hide_awards={{ prefs.hide_awards }}&hide_score={{ prefs.hide_score }}&disable_visit_reddit_confirmation={{ prefs.disable_visit_reddit_confirmation }}&subscriptions={{ prefs.subscriptions.join("%2B") }}&autoplay_videos={{ prefs.autoplay_videos }}&filters={{ prefs.filters.join("%2B") }}">this link</a>.</p>
+		<p>You can restore your current settings and subscriptions after clearing your cookies using <a href="/settings/restore/?theme={{ prefs.theme }}&front_page={{ prefs.front_page }}&layout={{ prefs.layout }}&wide={{ prefs.wide }}&post_sort={{ prefs.post_sort }}&comment_sort={{ prefs.comment_sort }}&show_nsfw={{ prefs.show_nsfw }}&use_hls={{ prefs.use_hls }}&hide_hls_notification={{ prefs.hide_hls_notification }}&hide_awards={{ prefs.hide_awards }}&fixed_navbar={{ prefs.fixed_navbar }}&subscriptions={{ prefs.subscriptions.join("%2B") }}&filters={{ prefs.filters.join("%2B") }}">this link</a>.</p>
 	</div>
 </div>