diff --git a/assets/css/user.css b/assets/css/user.css new file mode 100644 index 00000000..4ed00a59 --- /dev/null +++ b/assets/css/user.css @@ -0,0 +1,62 @@ +/* + * User pages CSS + * + * Used on all authenticated pages + * (subscriptions, account management, etc...) + * + * Part of invidious + * Copyright iv-org + * Licensed under AGPLv3 +*/ + +/* + * User menu +*/ + +.user-menu, .user-tab { + margin: 10px 10px 20px 15px; + padding: 0; + background-color: #262626; +} + + +.user-menu ul { + padding: 0; margin: 0; +} + +li.user-menu-tab { + padding: 2px 10px; + display: block; + border: 1px solid #7777; + border-bottom: none; +} +li.user-menu-tab:last-child { + border-bottom: 1px solid #7777; +} + +li.user-menu-tab p, +li.user-menu-tab a { + display: block; + padding: 2px; + margin: 8px 0; +} + +li.user-menu-tab a:focus { + outline: 1px solid #129fea; +} + +li.user-menu-tab.selected { + background-color: #363636; + font-weight: bold; + border: 1px solid #b0b0b0; +} + + +/* + * User "tab" (content container) +*/ + +.user-tab { + padding: 20px; + border: 1px solid #7777; +} diff --git a/src/invidious/frontend/user_menu.cr b/src/invidious/frontend/user_menu.cr new file mode 100644 index 00000000..9a486f70 --- /dev/null +++ b/src/invidious/frontend/user_menu.cr @@ -0,0 +1,112 @@ +module Invidious::Frontend::UserMenu + extend self + + # ------------------- + # Menu items + # ------------------- + + enum UserContentMenu + Subscriptions + WatchHistory + Playlists + end + + enum UserAccountMenu + Preferences + Account + ImportExport + LogOut + end + + private alias UserMenuItem = UserContentMenu | UserAccountMenu + + # ------------------- + # HTML templates + # ------------------- + + # Generates the following menu: + # + # ``` + #
+ # + #
+ # ``` + # + # The selected entry will have the "selected" class. + # + def make_menu(env : HTTP::Server::Context, selected_item : UserMenuItem) : String + # A capacity of 1500 is enough to store the HTML (empty) + # plus the URLs with parameters and the translated text. + str_builder = String::Builder.new(1500) + + # TODO: Get variables from HTTP env + locale = env.get("preferences").as(Preferences).locale + params = nil + + # Start of menu #1 + str_builder << <<-HTML +
+
+ HTML + + return str_builder.to_s + end +end diff --git a/src/invidious/user/preferences.cr b/src/invidious/user/preferences.cr index b3059403..cf643a8e 100644 --- a/src/invidious/user/preferences.cr +++ b/src/invidious/user/preferences.cr @@ -2,6 +2,43 @@ struct Preferences include JSON::Serializable include YAML::Serializable + # ------------------- + # Constants + # ------------------- + + SPEEDS = {2.0, 1.75, 1.5, 1.25, 1.0, 0.75, 0.5, 0.25} + + QUALITIES = {"dash", "hd720", "medium", "small"} + + DASH_QUALITIES = { + "auto", "best", "4320p", "2160p", "1440p", "1080p", + "720p", "480p", "360p", "240p", "144p", "worst", + } + + COMMENT_SOURCES = {"none", "youtube", "reddit"} + + THEMES = {"auto", "light", "dark"} + PLAYER_STYLES = {"invidious", "youtube"} + + FEED_OPTIONS = {"none", "Popular", "trending"} + FEED_OPTIONS_USER = {"none", "Popular", "trending", "Subscriptions", "Playlists"} + + HOMEPAGES = {"Search", "Popular", "trending"} + HOMEPAGES_USER = {"Search", "Popular", "trending", "Subscriptions", "Playlists"} + + SORT_OPTIONS = { + "published", + "published - reverse", + "alphabetically", + "alphabetically - reverse", + "channel name", + "channel name - reverse", + } + + # ------------------- + # Properties + # ------------------- + property annotations : Bool = CONFIG.default_user_preferences.annotations property annotations_subscribed : Bool = CONFIG.default_user_preferences.annotations_subscribed property autoplay : Bool = CONFIG.default_user_preferences.autoplay @@ -56,6 +93,10 @@ struct Preferences property volume : Int32 = CONFIG.default_user_preferences.volume property save_player_pos : Bool = CONFIG.default_user_preferences.save_player_pos + # ------------------- + # Converter modules + # ------------------- + module BoolToString def self.to_json(value : String, json : JSON::Builder) json.string value diff --git a/src/invidious/views/user/data_control.ecr b/src/invidious/views/user/data_control.ecr index 74ccc06c..e7234467 100644 --- a/src/invidious/views/user/data_control.ecr +++ b/src/invidious/views/user/data_control.ecr @@ -1,58 +1,70 @@ <% content_for "header" do %> <%= translate(locale, "Import and Export Data") %> - Invidious + <% end %> -
-
-
- <%= translate(locale, "Import") %> +
+
+ <%= Invidious::Frontend::UserMenu.make_menu(env, :import_export) %> +
-
- - -
+
+
-
- - -
+ +
+ <%= translate(locale, "Import") %> -
- - -
+
+ + +
-
- - -
+
+ + +
-
- - -
+
+ + +
-
- -
+
+ + +
- <%= translate(locale, "Export") %> +
+ + +
-
- <%= translate(locale, "Export subscriptions as OPML") %> -
+
+ +
-
- <%= translate(locale, "Export subscriptions as OPML (for NewPipe & FreeTube)") %> -
+ <%= translate(locale, "Export") %> + +
+ <%= translate(locale, "Export subscriptions as OPML") %> +
+ +
+ <%= translate(locale, "Export subscriptions as OPML (for NewPipe & FreeTube)") %> +
+ +
+ <%= translate(locale, "Export data as JSON") %> +
+
+ + +
+
-
- <%= translate(locale, "Export data as JSON") %> -
-
-
diff --git a/src/invidious/views/user/preferences.ecr b/src/invidious/views/user/preferences.ecr index dbb5e9db..48aac80c 100644 --- a/src/invidious/views/user/preferences.ecr +++ b/src/invidious/views/user/preferences.ecr @@ -40,20 +40,20 @@
@@ -61,9 +61,9 @@
<% end %> @@ -78,9 +78,9 @@ <% preferences.comments.each_with_index do |comments, index| %> <% end %> @@ -144,18 +144,18 @@
@@ -164,30 +164,34 @@ checked<% end %>> - <% if env.get?("user") %> - <% feed_options = {"", "Popular", "Trending", "Subscriptions", "Playlists"} %> - <% else %> - <% feed_options = {"", "Popular", "Trending"} %> - <% end %> + <%- + if env.get?("user") + feed_options = Preferences::FEED_OPTIONS_USER + homepages = Preferences::HOMEPAGES_USER + else + feed_options = Preferences::FEED_OPTIONS + homepages = Preferences::HOMEPAGES + end + -%>
- <% (feed_options.size - 1).times do |index| %> + <%- (feed_options.size - 1).times do |index| -%> - <% end %> + <%- end -%>
<% if env.get? "user" %>
@@ -224,9 +228,9 @@
@@ -263,21 +267,21 @@
- <% (feed_options.size - 1).times do |index| %> + <%- (feed_options.size - 1).times do |index| -%> - <% end %> + <%- end -%>