mirror of
https://github.com/Kunsi/pretalx-plugin-broadcast-tools
synced 2024-11-21 11:51:02 +00:00
add basic "room timer" page
This commit is contained in:
parent
c0b3bdb55e
commit
9d92add067
GPG key ID:
12E3D2136B818350
7 changed files with 169 additions and 4 deletions
|
|
@ -10,6 +10,7 @@ body {
|
|||
background-color: black;
|
||||
}
|
||||
|
||||
/* room info *********************************************/
|
||||
#broadcast_tools_room_info {
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
|
|
@ -52,6 +53,7 @@ body {
|
|||
margin-top: 1em;
|
||||
}
|
||||
|
||||
/* lower thirds ******************************************/
|
||||
#broadcast_tools_lower_thirds_box {
|
||||
width: 1020px;
|
||||
|
||||
|
|
@ -79,3 +81,37 @@ body {
|
|||
font-size: 1.8vh;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* room timer ********************************************/
|
||||
#broadcast_tools_room_timer_header {
|
||||
padding: 2em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#broadcast_tools_room_timer_title {
|
||||
font-size: 8vh;
|
||||
margin-bottom: 0.2em;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#broadcast_tools_room_timer_speaker {
|
||||
font-size: 6vh;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
#broadcast_tools_room_timer_scheduledata {
|
||||
font-size: 3vh;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
#broadcast_tools_room_timer_timeleft {
|
||||
font-size: 20vh;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#broadcast_tools_room_timer_progressbar {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
height: 2em;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -110,11 +110,11 @@ function xhr_get(url, callback_func) {
|
|||
|
||||
function update_schedule() {
|
||||
xhr_get('../event.json', function(text) {
|
||||
console.log("events: " + text);
|
||||
console.debug("events: " + text);
|
||||
event_info = JSON.parse(text);
|
||||
});
|
||||
xhr_get('../schedule.json', function(text) {
|
||||
console.log("schedule: " + text);
|
||||
console.debug("schedule: " + text);
|
||||
data = JSON.parse(text);
|
||||
if ('error' in data) {
|
||||
console.error(data['error']);
|
||||
|
|
|
|||
|
|
@ -0,0 +1,90 @@
|
|||
function update_room_info() {
|
||||
room_name = get_room_name();
|
||||
|
||||
if (!event_info) {
|
||||
console.warn("Waiting for event info ...");
|
||||
return
|
||||
}
|
||||
|
||||
box = document.getElementById('broadcast_tools_room_timer');
|
||||
header = document.getElementById('broadcast_tools_room_timer_header');
|
||||
title = document.getElementById('broadcast_tools_room_timer_title');
|
||||
speaker = document.getElementById('broadcast_tools_room_timer_speaker');
|
||||
scheduledata = document.getElementById('broadcast_tools_room_timer_scheduledata');
|
||||
timeleft = document.getElementById('broadcast_tools_room_timer_timeleft');
|
||||
progressbar = document.getElementById('broadcast_tools_room_timer_progressbar');
|
||||
|
||||
box.style.backgroundColor = event_info['color'];
|
||||
|
||||
if (!schedule) {
|
||||
speaker.innerHTML = 'Waiting for schedule ...';
|
||||
return
|
||||
}
|
||||
|
||||
if ('error' in schedule) {
|
||||
title.innerHTML = 'Error';
|
||||
speaker.innerHTML = schedule['error'].join('<br>');
|
||||
return
|
||||
}
|
||||
|
||||
if (schedule['rooms'].length > 1 && !schedule['rooms'].includes(room_name)) {
|
||||
title.innerHTML = 'Error';
|
||||
speaker.innerHTML = 'Invalid room_name. Valid names: ' + schedule['rooms'].join(', ');
|
||||
return
|
||||
}
|
||||
|
||||
current_talk = get_current_talk(60);
|
||||
next_talk = get_next_talk();
|
||||
|
||||
if (current_talk) {
|
||||
title.innerHTML = current_talk['title'];
|
||||
speaker.innerHTML = current_talk['persons'].join(', ');
|
||||
scheduledata.innerHTML = format_time_from_pretalx(current_talk['start']);
|
||||
scheduledata.innerHTML += ' - ';
|
||||
scheduledata.innerHTML += format_time_from_pretalx(current_talk['end']);
|
||||
|
||||
now = new Date();
|
||||
scheduled_start = new Date(current_talk['start']);
|
||||
scheduled_end = new Date(current_talk['end']);
|
||||
|
||||
if (scheduled_end < now) {
|
||||
timeleft.innerHTML = '0';
|
||||
progressbar.style.width = '0';
|
||||
} else {
|
||||
diff = scheduled_end - now;
|
||||
let diff_s = Math.floor(Math.floor(diff / 1000) % 60/10);
|
||||
let diff_m = Math.floor(diff / 1000 / 60) % 60;
|
||||
|
||||
timeleft.innerHTML = diff_m + 'min ' + diff_s + '0sec';
|
||||
|
||||
total_time = scheduled_end - scheduled_start;
|
||||
progressbar.style.width = (((diff/total_time)*100)-100)*-1 + 'vw';
|
||||
}
|
||||
|
||||
if (current_talk['track']) {
|
||||
header.style.backgroundColor = current_talk['track']['color'];
|
||||
progressbar.style.backgroundColor = current_talk['track']['color'];
|
||||
} else {
|
||||
header.style.backgroundColor = null;
|
||||
progressbar.style.backgroundColor = event_info['color'];
|
||||
}
|
||||
} else {
|
||||
title.innerHTML = room_name;
|
||||
scheduledata.innerHTML = '';
|
||||
timeleft.innerHTML = '';
|
||||
progressbar.style.width = '0';
|
||||
|
||||
if (next_talk) {
|
||||
speaker.innerHTML = format_time_from_pretalx(next_talk['start']) + ' ' + next_talk['title'];
|
||||
|
||||
if (next_talk['track']) {
|
||||
header.style.backgroundColor = next_talk['track']['color'];
|
||||
} else {
|
||||
header.style.backgroundColor = null;
|
||||
}
|
||||
} else {
|
||||
speaker.innerHTML = '';
|
||||
}
|
||||
}
|
||||
}
|
||||
window.setInterval(update_room_info, 1000);
|
||||
|
|
@ -11,7 +11,7 @@
|
|||
<thead class="thead-light">
|
||||
<tr>
|
||||
<th scope="col">{% translate "room" %}</th>
|
||||
<th scope="col" colspan="2">{% translate "Feature" %}</th>
|
||||
<th scope="col" colspan="3">{% translate "Feature" %}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
|
|
@ -20,6 +20,7 @@
|
|||
<th scope="row">{{ room.name }}</th>
|
||||
<td><a href="{% url 'plugins:pretalx_broadcast_tools:lowerthirds' request.event.slug %}#{{ room.uuid }}">{% translate "Lower Thirds" %}</a></td>
|
||||
<td><a href="{% url 'plugins:pretalx_broadcast_tools:room_info' request.event.slug %}#{{ room.uuid }}">{% translate "Room Info" %}</a></td>
|
||||
<td><a href="{% url 'plugins:pretalx_broadcast_tools:room_timer' request.event.slug %}#{{ room.uuid }}">{% translate "Room Timer" %}</a></td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,25 @@
|
|||
{% load static %}
|
||||
{% load compress %}
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="content-type" content="text/html" charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
|
||||
<title>{{ request.event.name }} room timer</title>
|
||||
<script src="{% static "pretalx_broadcast_tools/generic.js" %}"></script>
|
||||
<script src="{% static "pretalx_broadcast_tools/room_timer.js" %}"></script>
|
||||
<link rel="stylesheet" href="{% static "pretalx_broadcast_tools/frontend.css" %}" />
|
||||
{% if request.event and request.event.custom_css %}
|
||||
<link rel="stylesheet" type="text/css" href="{{ request.event.custom_css.url }}"/>
|
||||
{% endif %}
|
||||
</head>
|
||||
<body id="broadcast_tools_room_timer">
|
||||
<div id="broadcast_tools_room_timer_header">
|
||||
<h2 id="broadcast_tools_room_timer_title">Loading ...</h2>
|
||||
<h3 id="broadcast_tools_room_timer_speaker">Content should appear soon. If not, please verify you have Javascript enabled.</h3>
|
||||
<p id="broadcast_tools_room_timer_scheduledata"></p>
|
||||
</div>
|
||||
<p id="broadcast_tools_room_timer_timeleft"></p>
|
||||
<p id="broadcast_tools_room_timer_progressbar"> </p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -4,7 +4,11 @@ from .views.event_info import BroadcastToolsEventInfoView
|
|||
from .views.orga import BroadcastToolsOrgaView
|
||||
from .views.qr import BroadcastToolsFeedbackQrCodeSvg, BroadcastToolsPublicQrCodeSvg
|
||||
from .views.schedule import BroadcastToolsScheduleView
|
||||
from .views.static_html import BroadcastToolsLowerThirdsView, BroadcastToolsRoomInfoView
|
||||
from .views.static_html import (
|
||||
BroadcastToolsLowerThirdsView,
|
||||
BroadcastToolsRoomInfoView,
|
||||
BroadcastToolsRoomTimerView,
|
||||
)
|
||||
from .views.voctomix_export import BroadcastToolsLowerThirdsVoctomixDownloadView
|
||||
|
||||
urlpatterns = [
|
||||
|
|
@ -47,6 +51,11 @@ urlpatterns = [
|
|||
BroadcastToolsRoomInfoView.as_view(),
|
||||
name="room_info",
|
||||
),
|
||||
path(
|
||||
"room-timer/",
|
||||
BroadcastToolsRoomTimerView.as_view(),
|
||||
name="room_timer",
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
|
|
|||
|
|
@ -7,3 +7,7 @@ class BroadcastToolsLowerThirdsView(TemplateView):
|
|||
|
||||
class BroadcastToolsRoomInfoView(TemplateView):
|
||||
template_name = "pretalx_broadcast_tools/room_info.html"
|
||||
|
||||
|
||||
class BroadcastToolsRoomTimerView(TemplateView):
|
||||
template_name = "pretalx_broadcast_tools/room_timer.html"
|
||||
|
|
|
|||
Loading…
Reference in a new issue