diff --git a/assets/css/default.css b/assets/css/default.css index a7496981..aebd563c 100644 --- a/assets/css/default.css +++ b/assets/css/default.css @@ -32,6 +32,29 @@ a.pure-button-primary:hover { color: #fff; } +div.thumbnail { + position: relative; +} + +img.thumbnail { + width: 100%; + left: 0; + top: 0; +} + +.length { + z-index: 100; + position: absolute; + background-color: rgba(35, 35, 35, 0.75); + color: #fff; + border-radius: 2px; + padding: 2px; + font-size: 16px; + font-family: sans-serif; + right: 0.5em; + bottom: -0.5em; +} + /* * Navbar */ diff --git a/src/invidious/channels.cr b/src/invidious/channels.cr index 09e8f522..4d9d89c8 100644 --- a/src/invidious/channels.cr +++ b/src/invidious/channels.cr @@ -15,6 +15,11 @@ class ChannelVideo ucid: String, author: String, }) + + # TODO: Add length_seconds to channel_video + def length_seconds + return 0 + end end def get_channel(id, client, db, refresh = true, pull_all_videos = true) diff --git a/src/invidious/helpers/utils.cr b/src/invidious/helpers/utils.cr index dab8e0e9..174f2993 100644 --- a/src/invidious/helpers/utils.cr +++ b/src/invidious/helpers/utils.cr @@ -40,6 +40,23 @@ def decode_length_seconds(string) return length_seconds end +def recode_length_seconds(time) + if time <= 0 + return "" + else + time = time.seconds + text = "#{time.minutes.to_s.rjust(2, '0')}:#{time.seconds.to_s.rjust(2, '0')}" + + if time.hours > 0 + text = "#{time.hours.to_s.rjust(2, '0')}:#{text}" + end + + text = text.lchop('0') + + return text + end +end + def decode_time(string) time = string.try &.to_f? diff --git a/src/invidious/videos.cr b/src/invidious/videos.cr index 2e1a828c..72dbe9fb 100644 --- a/src/invidious/videos.cr +++ b/src/invidious/videos.cr @@ -451,6 +451,10 @@ class Video return description end + def length_seconds + return self.info["length_seconds"].to_i + end + add_mapping({ id: String, info: { diff --git a/src/invidious/views/components/item.ecr b/src/invidious/views/components/item.ecr index db319d82..6560ab4c 100644 --- a/src/invidious/views/components/item.ecr +++ b/src/invidious/views/components/item.ecr @@ -22,7 +22,10 @@ <% if env.get?("user") && env.get("user").as(User).preferences.thin_mode %> <% else %> - +
+ +

<%= recode_length_seconds(item.videos[0].length_seconds) %>

+
<% end %>

<%= item.title %>

@@ -35,23 +38,45 @@ <% if env.get?("user") && env.get("user").as(User).preferences.thin_mode %> <% else %> - +
+ +

<%= recode_length_seconds(item.length_seconds) %>

+
<% end %>

<%= item.title %>

<%= item.author %>

- <% else %> - <% if item.responds_to?(:playlists) && !item.playlists.empty? %> - <% params = "&list=#{item.playlists[0]}" %> - <% else %> - <% params = nil %> - <% end %> - + <% when PlaylistVideo %> + <% if env.get?("user") && env.get("user").as(User).preferences.thin_mode %> <% else %> - +
+ +

<%= recode_length_seconds(item.length_seconds) %>

+
+ <% end %> +

<%= item.title %>

+
+ <% if item.responds_to?(:live_now) && item.live_now %> +

LIVE

+ <% end %> +

+ <%= item.author %> +

+ + <% if Time.now - item.published > 1.minute %> +
Shared <%= recode_date(item.published) %> ago
+ <% end %> + <% else %> + + <% if env.get?("user") && env.get("user").as(User).preferences.thin_mode %> + <% else %> +
+ +

<%= recode_length_seconds(item.length_seconds) %>

+
<% end %>

<%= item.title %>

diff --git a/src/invidious/views/watch.ecr b/src/invidious/views/watch.ecr index 9424bd10..6af7e10a 100644 --- a/src/invidious/views/watch.ecr +++ b/src/invidious/views/watch.ecr @@ -137,7 +137,10 @@ "> <% if preferences && preferences.thin_mode %> <% else %> - /mqdefault.jpg"> +
+ /mqdefault.jpg"> +

<%= recode_length_seconds(rv["length_seconds"]?.try &.to_i? || 0) %>

+
<% end %>

<%= rv["title"] %>