youtube_live_calendar/views/schedule.ejs

47 lines
1.8 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/css/schedule.css">
</head>
<%- include("partials/head") %>
<body>
<%- include("partials/header") %>
<div class="header-spacer"></div>
<div class="main-content">
<div class="content">
<div class="schedule-container">
<% Object.keys(groupedSchedules).forEach(date => { %>
<div class="date-header">
<%= dayjs(date).tz("Asia/Tokyo").format("YYYY年MM月DD日 (ddd)") %>
</div>
<div class="banners">
<% groupedSchedules[date].forEach(schedule => { %>
<%
const timeDifference = dayjs(schedule.start_time).diff(dayjs(), 'minute');
const isLive = timeDifference < 5 && timeDifference >= -60; // 配信開始5時間前1時間後
%>
<a href="https://www.youtube.com/watch?v=<%= schedule.video_id %>"
class="banner <%= isLive ? 'highlight-live' : '' %>"
target="_blank">
<div class="thumbnail">
<img src="<%= schedule.thumbnail_url || '/default-thumbnail.jpg' %>" alt="Thumbnail">
</div>
<div class="details">
<div class="time-channel">
<span class="time"><%= dayjs(schedule.start_time).tz("Asia/Tokyo").format("HH:mm") %></span>
<span class="channel-name">/ <%= schedule.Channel.name %></span>
</div>
<div class="title"><%= schedule.title %></div>
</div>
</a>
<% }) %>
</div>
<% }) %>
</div>
</div>
</div>
</body>
</html>