72 lines
2.2 KiB
Plaintext
72 lines
2.2 KiB
Plaintext
<h2 class="title is-2">VODs</h2>
|
|
|
|
<% if (Array.isArray(data.vods) && data.vods.length > 0) { %>
|
|
<div class="table-container">
|
|
<table class="table is-striped is-hoverable is-fullwidth">
|
|
<thead>
|
|
<tr>
|
|
<th>Stream Date</th>
|
|
<th>VTubers</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<% for (const vod of data.vods) { %>
|
|
<tr>
|
|
<td>
|
|
<a href="/vods/<%= vod?.id %>" class="is-small is-link">
|
|
<%= vod?.get ? vod.get('streamDate') : vod?.streamDate ?? 'Unknown date' %>
|
|
</a>
|
|
</td>
|
|
<td>
|
|
<% const vtubers = vod?.get ? vod.get('expand')?.vtubers ?? [] : vod?.vtubers ?? []; %>
|
|
<% if (vtubers.length > 0) { %>
|
|
<% for (let i = 0; i < vtubers.length; i++) { %>
|
|
<%= vtubers[i]?.get ? vtubers[i].get('displayName') : vtubers[i]?.displayName ?? 'Unknown' %>
|
|
<%= i < vtubers.length - 1 ? ', ' : '' %>
|
|
<% } %>
|
|
<% } else { %>
|
|
None
|
|
<% } %>
|
|
</td>
|
|
</tr>
|
|
<% } %>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<!-- Pagination Controls -->
|
|
<% if (data.pagination && data.pagination.totalPages > 1) { %>
|
|
<nav class="pagination is-centered" role="navigation" aria-label="pagination">
|
|
<% const currentPage = data.pagination.page; %>
|
|
<% const totalPages = data.pagination.totalPages; %>
|
|
|
|
<!-- Previous Page -->
|
|
<% if (data.pagination.hasPrev) { %>
|
|
<a class="pagination-previous" href="?page=<%= currentPage - 1 %>&limit=<%= data.pagination.limit %>">Previous</a>
|
|
<% } else { %>
|
|
<a class="pagination-previous" disabled>Previous</a>
|
|
<% } %>
|
|
|
|
<!-- Next Page -->
|
|
<% if (data.pagination.hasNext) { %>
|
|
<a class="pagination-next" href="?page=<%= currentPage + 1 %>&limit=<%= data.pagination.limit %>">Next</a>
|
|
<% } else { %>
|
|
<a class="pagination-next" disabled>Next</a>
|
|
<% } %>
|
|
|
|
<!-- Page Numbers -->
|
|
<ul class="pagination-list">
|
|
<% for (let i = 1; i <= totalPages; i++) { %>
|
|
<li>
|
|
<a class="pagination-link <%= i === currentPage ? 'is-current' : '' %>" href="?page=<%= i %>&limit=<%= data.pagination.limit %>">
|
|
<%= i %>
|
|
</a>
|
|
</li>
|
|
<% } %>
|
|
</ul>
|
|
</nav>
|
|
<% } %>
|
|
|
|
<% } else { %>
|
|
<p>No VODs available.</p>
|
|
<% } %> |