mirror of
https://github.com/iv-org/invidious.git
synced 2024-12-05 04:59:12 +05:30
Add CSS element for compilation video
This commit is contained in:
broquemonsieur
parent
128d541323
commit
2a9789cc1e
@ -761,8 +761,16 @@ h1, h2, h3, h4, h5, p,
|
||||
}
|
||||
|
||||
div.compilation-video-panel {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
color: #d9d9d9;
|
||||
padding: 28.125%;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
img.compilation-video-panel {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
object-fit: cover;
|
||||
}
|
||||
@ -86,6 +86,7 @@ module Invidious::Routing
|
||||
get "/create_compilation", Routes::Compilations, :new
|
||||
post "/create_compilation", Routes::Compilations, :create
|
||||
post "/compilation_ajax", Routes::Compilations, :compilation_ajax
|
||||
get "/add_compilation_items", Routes::Compilations, :add_compilation_items_page
|
||||
end
|
||||
|
||||
def register_iv_playlist_routes
|
||||
|
||||
@ -8,6 +8,7 @@ module Invidious::Search
|
||||
# Types specific to Invidious
|
||||
Subscriptions # Search user subscriptions
|
||||
Playlist # "Add playlist item" search
|
||||
Compilation # "Add compilation item" search
|
||||
end
|
||||
|
||||
getter type : Type = Type::Regular
|
||||
@ -75,6 +76,12 @@ module Invidious::Search
|
||||
#
|
||||
@filters, _, @query, _ = Filters.from_legacy_filters(@raw_query)
|
||||
#
|
||||
when .compilation?
|
||||
# In "add compilation item" mode, filters are parsed from the query
|
||||
# string itself (legacy), and the channel is ignored.
|
||||
#
|
||||
@filters, _, @query, _ = Filters.from_legacy_filters(@raw_query)
|
||||
#
|
||||
when .subscriptions?, .regular?
|
||||
if params["sp"]?
|
||||
# Parse the `sp` URL parameter (youtube compatibility)
|
||||
@ -112,7 +119,7 @@ module Invidious::Search
|
||||
return items if self.empty_raw_query?
|
||||
|
||||
case @type
|
||||
when .regular?, .playlist?
|
||||
when .regular?, .playlist?, .compilation?
|
||||
items = Processors.regular(self)
|
||||
#
|
||||
when .channel?
|
||||
|
||||
@ -6,3 +6,99 @@
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="/feed/compilation/<%= compid %>" />
|
||||
<% end %>
|
||||
|
||||
<div class="pure-g h-box">
|
||||
<div class="pure-u-2-3">
|
||||
<h3><%= title %></h3>
|
||||
<% if compilation.is_a? InvidiousCompilation %>
|
||||
<b>
|
||||
<% if compilation.author == user.try &.email %>
|
||||
<a href="/feed/compilations"><%= author %></a> |
|
||||
<% else %>
|
||||
<%= author %> |
|
||||
<% end %>
|
||||
<%= translate_count(locale, "generic_videos_count", compilation.video_count) %> |
|
||||
<%= translate(locale, "Updated `x` ago", recode_date(compilation.updated, locale)) %> |
|
||||
<% case compilation.as(InvidiousCompilation).privacy when %>
|
||||
<% when CompilationPrivacy::Unlisted %>
|
||||
<i class="icon ion-ios-unlock"></i> <%= translate(locale, "Unlisted") %>
|
||||
<% when CompilationPrivacy::Private %>
|
||||
<i class="icon ion-ios-lock"></i> <%= translate(locale, "Private") %>
|
||||
<% end %>
|
||||
</b>
|
||||
<% else %>
|
||||
<b>
|
||||
<a href="/channel/<%= compilation.ucid %>"><%= author %></a> |
|
||||
<%= translate_count(locale, "generic_videos_count", compilation.video_count) %> |
|
||||
<%= translate(locale, "Updated `x` ago", recode_date(compilation.updated, locale)) %>
|
||||
</b>
|
||||
<% end %>
|
||||
</div>
|
||||
<div class="pure-u-1-3" style="text-align:right">
|
||||
<h3>
|
||||
<div class="pure-g user-field">
|
||||
<% if compilation.is_a?(InvidiousCompilation) && compilation.author == user.try &.email %>
|
||||
<div class="pure-u-1-3"><a href="/edit_compilation?list=<%= compid %>"><i class="icon ion-md-create"></i></a></div>
|
||||
<div class="pure-u-1-3"><a href="/delete_compilation?list=<%= compid %>"><i class="icon ion-md-trash"></i></a></div>
|
||||
<% else %>
|
||||
<% if !Invidious::Database::Compilations.exists?(compilation.id) %>
|
||||
<div class="pure-u-1-3"><a href="/delete_compilation?list=<%= compid %>"><i class="icon ion-md-trash"></i></a></div>
|
||||
<% end %>
|
||||
<% end %>
|
||||
<div class="pure-u-1-3"><a href="/feed/compilation/<%= compid %>"><i class="icon ion-logo-rss"></i></a></div>
|
||||
</div>
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="h-box">
|
||||
<div id="descriptionWrapper"><%= compilation.description_html %></div>
|
||||
</div>
|
||||
|
||||
<% if compilation.is_a?(InvidiousCompilation) && compilation.author == user.try &.email %>
|
||||
<div class="h-box" style="text-align:right">
|
||||
<h3>
|
||||
<a href="/add_compilation_items?list=<%= compid %>"><i class="icon ion-md-add"></i></a>
|
||||
</h3>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<div class="h-box">
|
||||
<hr>
|
||||
</div>
|
||||
|
||||
<% if compilation.is_a?(InvidiousCompilation) && compilation.author == user.try &.email %>
|
||||
<script id="compilation_data" type="application/json">
|
||||
<%=
|
||||
{
|
||||
"csrf_token" => URI.encode_www_form(env.get?("csrf_token").try &.as(String) || "")
|
||||
}.to_pretty_json
|
||||
%>
|
||||
</script>
|
||||
<script src="/js/compilation_widget.js?v=<%= ASSET_COMMIT %>"></script>
|
||||
<% end %>
|
||||
|
||||
<div class="pure-g">
|
||||
<% videos.each do |compilation_video| %>
|
||||
<%= rendered "components/compilation_video" %>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<script src="/js/watched_indicator.js"></script>
|
||||
|
||||
<div class="pure-g h-box">
|
||||
<div class="pure-u-1 pure-u-lg-1-5">
|
||||
<% if page > 1 %>
|
||||
<a href="/compilation?complist=<%= compilation.id %>&page=<%= page - 1 %>">
|
||||
<%= translate(locale, "Previous page") %>
|
||||
</a>
|
||||
<% end %>
|
||||
</div>
|
||||
<div class="pure-u-1 pure-u-lg-3-5"></div>
|
||||
<div class="pure-u-1 pure-u-lg-1-5" style="text-align:right">
|
||||
<% if page_count != 1 && page < page_count %>
|
||||
<a href="/compilation?complist=<%= compilation.id %>&page=<%= page + 1 %>">
|
||||
<%= translate(locale, "Next page") %>
|
||||
</a>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
15
src/invidious/views/components/compilation_video.ecr
Normal file
15
src/invidious/views/components/compilation_video.ecr
Normal file
@ -0,0 +1,15 @@
|
||||
<div class="pure-u-1 pure-u-md-1">
|
||||
<div class="h-box">
|
||||
<div style="display:flex; justify-content:flex-start; width:calc(100% - 20px); height:100px; border:1px solid black; margin: 10px; background: #d9d9d9;">
|
||||
<div style="display:flex; flex-direction:column; justify-content:space-between;">
|
||||
<svg style="width:20px; height:50%; background-color: beige; margin: 10px;">
|
||||
<path d="M7.41 15.41 12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path>
|
||||
</svg>
|
||||
<svg style="width:20px; height:50%; background-color: beige; margin: 10px;">
|
||||
<path d="M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z"></path>
|
||||
</svg>
|
||||
</div>
|
||||
<img loading="lazy" style="margin:10px;" src="/vi/<%= compilation_video.id %>/mqdefault.jpg" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -102,13 +102,78 @@
|
||||
<p dir="auto"><b><%= HTML.escape(item.author) %><% if !item.is_a?(InvidiousCompilation) && !item.is_a?(InvidiousPlaylist) && !item.author_verified.nil? && item.author_verified %> <i class="icon ion ion-md-checkmark-circle"></i><% end %></b></p>
|
||||
</a>
|
||||
<% when CompilationVideo %>
|
||||
<a style="width:100%" href="/watch?v=<%= item.id %>&list=<%= item.compid %>&index=<%= item.index %>">
|
||||
<div style="width:100%; height:50px; border:1px solid black;">
|
||||
<!-- <a style="width:100%" href="/watch?v=<%= item.id %>&list=<%= item.compid %>&index=<%= item.index %>">
|
||||
<% if !env.get("preferences").as(Preferences).thin_mode %>
|
||||
<div class="compilation-video-panel">
|
||||
<div class="thumbnail">
|
||||
<img loading="lazy" tabindex="-1" class="thumbnail" src="/vi/<%= item.id %>/mqdefault.jpg" alt="" />
|
||||
|
||||
<% if compid_form = env.get?("remove_compilation_items") %>
|
||||
<form data-onsubmit="return_false" action="/compilation_ajax?action_remove_video=1&set_video_id=<%= item.index %>&compilation_id=<%= compid_form %>&referer=<%= env.get("current_page") %>" method="post">
|
||||
<input type="hidden" name="csrf_token" value="<%= HTML.escape(env.get?("csrf_token").try &.as(String) || "") %>">
|
||||
<p class="watched">
|
||||
<button type="submit" style="all:unset" data-onclick="remove_compilation_item" data-index="<%= item.index %>" data-compid="<%= compid_form %>"><i class="icon ion-md-trash"></i></button>
|
||||
</p>
|
||||
</form>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
<p dir="auto"><%= HTML.escape(item.title) %></p>
|
||||
</a> -->
|
||||
</div>
|
||||
<% when PlaylistVideo %>
|
||||
<a style="width:100%" href="/watch?v=<%= item.id %>&list=<%= item.plid %>&index=<%= item.index %>">
|
||||
<% if !env.get("preferences").as(Preferences).thin_mode %>
|
||||
<div class="thumbnail">
|
||||
<img loading="lazy" tabindex="-1" class="thumbnail" src="/vi/<%= item.id %>/mqdefault.jpg" alt="" />
|
||||
|
||||
<% if plid_form = env.get?("remove_playlist_items") %>
|
||||
<form data-onsubmit="return_false" action="/playlist_ajax?action_remove_video=1&set_video_id=<%= item.index %>&playlist_id=<%= plid_form %>&referer=<%= env.get("current_page") %>" method="post">
|
||||
<input type="hidden" name="csrf_token" value="<%= HTML.escape(env.get?("csrf_token").try &.as(String) || "") %>">
|
||||
<p class="watched">
|
||||
<button type="submit" style="all:unset" data-onclick="remove_playlist_item" data-index="<%= item.index %>" data-plid="<%= plid_form %>"><i class="icon ion-md-trash"></i></button>
|
||||
</p>
|
||||
</form>
|
||||
<% end %>
|
||||
|
||||
<% if item.responds_to?(:live_now) && item.live_now %>
|
||||
<p class="length"><i class="icon ion-ios-play-circle"></i> <%= translate(locale, "LIVE") %></p>
|
||||
<% elsif item.length_seconds != 0 %>
|
||||
<p class="length"><%= recode_length_seconds(item.length_seconds) %></p>
|
||||
<% end %>
|
||||
|
||||
<% if item_watched %>
|
||||
<div class="watched-overlay"></div>
|
||||
<div class="watched-indicator" data-length="<%= item.length_seconds %>" data-id="<%= item.id %>"></div>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
<p dir="auto"><%= HTML.escape(item.title) %></p>
|
||||
</a>
|
||||
|
||||
<div class="video-card-row flexible">
|
||||
<div class="flex-left"><a href="/channel/<%= item.ucid %>">
|
||||
<p class="channel-name" dir="auto"><%= HTML.escape(item.author) %></p>
|
||||
</a></div>
|
||||
<% endpoint_params = "?v=#{item.id}&list=#{item.plid}" %>
|
||||
<%= rendered "components/video-context-buttons" %>
|
||||
</div>
|
||||
|
||||
<div class="video-card-row flexible">
|
||||
<div class="flex-left">
|
||||
<% if item.responds_to?(:premiere_timestamp) && item.premiere_timestamp.try &.> Time.utc %>
|
||||
<p dir="auto"><%= translate(locale, "Premieres in `x`", recode_date((item.premiere_timestamp.as(Time) - Time.utc).ago, locale)) %></p>
|
||||
<% elsif Time.utc - item.published > 1.minute %>
|
||||
<p dir="auto"><%= translate(locale, "Shared `x` ago", recode_date(item.published, locale)) %></p>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<% if item.responds_to?(:views) && item.views %>
|
||||
<div class="flex-right">
|
||||
<p dir="auto"><%= translate_count(locale, "generic_views_count", item.views || 0, NumberFormatting::Short) %></p>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
<% when Category %>
|
||||
<% else %>
|
||||
<%-
|
||||
@ -157,6 +222,13 @@
|
||||
<button type="submit" class="pure-button pure-button-secondary low-profile"
|
||||
data-onclick="add_playlist_item" data-id="<%= item.id %>" data-plid="<%= plid_form %>"><i class="icon ion-md-add"></i></button>
|
||||
</form>
|
||||
<% elsif compid_form = env.get? "add_compilation_items" %>
|
||||
<form data-onsubmit="return_false" action="/compilation_ajax?action_add_video=1&video_id=<%= item.id %>&compilation_id=<%= compid_form %>&referer=<%= env.get("current_page") %>" method="post">
|
||||
<input type="hidden" name="csrf_token" value="<%= HTML.escape(env.get?("csrf_token").try &.as(String) || "") %>">
|
||||
<p class="watched">
|
||||
<button type="submit" style="all:unset" data-onclick="add_compilation_item" data-id="<%= item.id %>" data-compid="<%= compid_form %>"><i class="icon ion-md-add"></i></button>
|
||||
</p>
|
||||
</form>
|
||||
<%- elsif item.is_a?(PlaylistVideo) && (plid_form = env.get?("remove_playlist_items")) -%>
|
||||
<%- form_parameters = "action_remove_video=1&set_video_id=#{item.index}&playlist_id=#{plid_form}&referer=#{env.get("current_page")}" -%>
|
||||
<form data-onsubmit="return_false" action="/playlist_ajax?<%= form_parameters %>" method="post">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user