Add data-jump-time attribute to chapters component

Allows automatically jumping to specified time instead of reloading the
page.
This commit is contained in:
syeopite 2023-08-21 14:54:37 -07:00
parent 08d82cc749
commit 00d16dff1f
No known key found for this signature in database
GPG Key ID: A73C186DA3955A1A
1 changed files with 6 additions and 6 deletions

View File

@ -6,20 +6,20 @@
<% chapters.each do | chapter | %> <% chapters.each do | chapter | %>
<%- start_in_seconds = chapter.start_ms.milliseconds.total_seconds.to_i %> <%- start_in_seconds = chapter.start_ms.milliseconds.total_seconds.to_i %>
<a href="/watch?v=<%-= video.id %>&t=<%=start_in_seconds %>"> <a href="/watch?v=<%-= video.id %>&t=<%=start_in_seconds %>">
<div class="chapter"> <div class="chapter" data-onclick="jump_to_time" data-jump-time="<%=start_in_seconds%>">
<div class="thumbnail"> <div class="thumbnail">
<%- if !env.get("preferences").as(Preferences).thin_mode -%> <%- if !env.get("preferences").as(Preferences).thin_mode -%>
<img loading="lazy" class="thumbnail" src="<%-=URI.parse(chapter.thumbnails[-1]["url"].to_s).request_target %>" alt="" /> <img loading="lazy" class="thumbnail" src="<%-=URI.parse(chapter.thumbnails[-1]["url"].to_s).request_target %>" alt="" data-onclick="jump_to_time" data-jump-time="<%=start_in_seconds%>"/>
<%- else -%> <%- else -%>
<div class="thumbnail-placeholder"></div> <div class="thumbnail-placeholder" data-onclick="jump_to_time" data-jump-time="<%=start_in_seconds%>"></div>
<%- end -%> <%- end -%>
</div> </div>
<%- if start_in_seconds > 0 -%> <%- if start_in_seconds > 0 -%>
<p><%-= recode_length_seconds(start_in_seconds) -%></p> <p data-onclick="jump_to_time" data-jump-time="<%=start_in_seconds%>"><%-= recode_length_seconds(start_in_seconds) -%></p>
<%- else -%> <%- else -%>
<p>0:00</p> <p data-onclick="jump_to_time" data-jump-time="<%=start_in_seconds%>">0:00</p>
<%- end -%> <%- end -%>
<p><%-=chapter.title-%></p> <p data-onclick="jump_to_time" data-jump-time="<%=start_in_seconds%>"><%-=chapter.title-%></p>
</div> </div>
</a> </a>
<% end %> <% end %>