Added "Read More" button for video descriptions

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 descriptions: ") %></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

@@ -228,7 +228,18 @@
             </p>
 
             <div>
+                <% if video.description.size < 200 || params.extend_desc %>
                     <%= video.description_html %>
+                <% else %>
+                    <div style="overflow: hidden;height: 8.3em;" id="descriptionWrapper">
+                        <%= video.description_html %>
+                    </div>
+                    <div class="pure-u-23-24">
+                        <p>
+                            <a href="javascript:void(0)" onclick="read_more_description(this)"><%= translate(locale, "Read more") %></a>
+                        </p>
+                    </div>
+                <% end %>
             </div>
 
             <hr>