Merge pull request #1968 from syeopite/iss677

Add ability to expand/collapse description.

src/invidious/helpers/helpers.cr

@@ -50,6 +50,7 @@ struct ConfigPreferences
   property thin_mode : Bool = false
   property unseen_only : Bool = false
   property video_loop : Bool = false
+  property extend_desc : Bool = false
   property volume : Int32 = 100
 
   def to_tuple

src/invidious/users.cr

@@ -78,6 +78,7 @@ struct Preferences
   property thin_mode : Bool = CONFIG.default_user_preferences.thin_mode
   property unseen_only : Bool = CONFIG.default_user_preferences.unseen_only
   property video_loop : Bool = CONFIG.default_user_preferences.video_loop
+  property extend_desc : Bool = CONFIG.default_user_preferences.extend_desc
   property volume : Int32 = CONFIG.default_user_preferences.volume
 
   module BoolToString

src/invidious/videos.cr

@@ -242,6 +242,7 @@ struct VideoPreferences
   property speed : Float32 | Float64
   property video_end : Float64 | Int32
   property video_loop : Bool
+  property extend_desc : Bool
   property video_start : Float64 | Int32
   property volume : Int32
 end
@@ -1050,6 +1051,7 @@ def process_video_params(query, preferences)
   related_videos = query["related_videos"]?.try { |q| (q == "true" || q == "1").to_unsafe }
   speed = query["speed"]?.try &.rchop("x").to_f?
   video_loop = query["loop"]?.try { |q| (q == "true" || q == "1").to_unsafe }
+  extend_desc = query["extend_desc"]?.try { |q| (q == "true" || q == "1").to_unsafe }
   volume = query["volume"]?.try &.to_i?
 
   if preferences
@@ -1068,6 +1070,7 @@ def process_video_params(query, preferences)
     related_videos ||= preferences.related_videos.to_unsafe
     speed ||= preferences.speed
     video_loop ||= preferences.video_loop.to_unsafe
+    extend_desc ||= preferences.extend_desc.to_unsafe
     volume ||= preferences.volume
   end
 
@@ -1085,6 +1088,7 @@ def process_video_params(query, preferences)
   related_videos ||= CONFIG.default_user_preferences.related_videos.to_unsafe
   speed ||= CONFIG.default_user_preferences.speed
   video_loop ||= CONFIG.default_user_preferences.video_loop.to_unsafe
+  extend_desc ||= CONFIG.default_user_preferences.extend_desc.to_unsafe
   volume ||= CONFIG.default_user_preferences.volume
 
   annotations = annotations == 1
@@ -1095,6 +1099,7 @@ def process_video_params(query, preferences)
   local = local == 1
   related_videos = related_videos == 1
   video_loop = video_loop == 1
+  extend_desc = extend_desc == 1
 
   if CONFIG.disabled?("dash") && quality == "dash"
     quality = "high"
@@ -1141,6 +1146,7 @@ def process_video_params(query, preferences)
     speed:              speed,
     video_end:          video_end,
     video_loop:         video_loop,
+    extend_desc:        extend_desc,
     video_start:        video_start,
     volume:             volume,
   })

src/invidious/views/preferences.ecr

@@ -106,6 +106,12 @@
                 <input name="annotations" id="annotations" type="checkbox" <% if preferences.annotations %>checked<% end %>>
             </div>
 
+            <div class="pure-control-group">
+                <label for="extend_desc"><%= translate(locale, "Automatically extend video description: ") %></label>
+                <input name="extend_desc" id="extend_desc" type="checkbox" <% if preferences.extend_desc %>checked<% end %>>
+            </div>
+
+
             <legend><%= translate(locale, "Visual preferences") %></legend>
 
             <div class="pure-control-group">

src/invidious/views/watch.ecr

@@ -25,6 +25,19 @@
 <link rel="alternate" href="https://www.youtube.com/watch?v=<%= video.id %>">
 <%= rendered "components/player_sources" %>
 <title><%= HTML.escape(video.title) %> - Invidious</title>
+
+<!-- Description expansion also updates the 'Show more' button to 'Show less' so
+we're going to need to do it here in order to allow for translations.
+ -->
+<style>
+#descexpansionbutton + label > a::after {
+    content: "<%= translate(locale, "Show more") %>"
+}
+
+#descexpansionbutton:checked + label > a::after {
+    content: "<%= translate(locale, "Show less") %>"
+}
+</style>
 <% end %>
 
 <script id="video_data" type="application/json">
@@ -227,8 +240,18 @@
                 <% end %>
             </p>
 
-            <div>
-                <%= video.description_html %>
+            <div id="description-box"> <!-- Description -->
+                <% if video.description.size < 200 || params.extend_desc %>
+                    <%= video.description_html %>
+                <% else %>
+                    <input id="descexpansionbutton" type="checkbox"/>
+                    <label for="descexpansionbutton" style="order: 1;">
+                        <a></a>
+                    </label>
+                    <div id="descriptionWrapper">
+                        <%= video.description_html %>
+                    </div>
+                <% end %>
             </div>
 
             <hr>