html5-infobeamer-dhcp/assets/js/custom/dom/upcoming-talk.js

124 lines
3.7 KiB
JavaScript

'use strict';
import * as sol from "../../solight/sol.js";
import * as serv from "../services/service.js";
import * as music from "./music.js";
const html = htm.bind(preact.h);
const nowString = 'Jetzt';
const minBioLength = 20;
const event_persons = (persons) =>
html`<div class="speakers">${serv.fix_dash(serv.person_names_concat(persons))}:</div>`;
const event_time = (event, time) => {
const esd = sol.eventStartDate(event);
const nowish = luxon.Interval.fromDateTimes(esd.minus({minutes: 1}), esd.plus({minutes: 1}));
const stime = nowish.contains(time) ?
nowString :
esd.setLocale('de').toRelative({base: time, unit: 'minutes'});
return html`<div class="starttime">${stime}</div>`;
};
const event_meta = (event, time) =>
html`
<div class="event-meta">
${event_persons(sol.eventPersons(event))}
<div class="title">${serv.fix_dash(sol.eventTitle(event))}</div>
<div class="subtitle">${sol.eventSubtitle(event)}</div>
${event_time(event, time)}
</div>`;
const event_description = (event) => {
const description = sol.eventAbstract(event);
const abstract = sol.eventAbstract(event);
const atext = sol.defined(abstract) ? abstract : "";
const dtext = sol.defined(description) ? description : "";
const text = atext.length >= dtext.length ? atext : dtext;
return html`
<div class="event-description">
<div class="event-description-title">Beschreibung:</div>
<div class="event-description-text" lang="de">${text}</div>
</div>`;
};
const event_content = (event) =>
html`<div class="event-content">${event_description(event)}</div>`;
const speaker_info = (speaker, count) => {
const name = serv.fix_dash(sol.personName(speaker));
const bio = sol.personBiography(speaker);
let inner;
if (sol.defined(bio) && bio.length >= minBioLength) {
inner = html`
<div class="speaker-info">
<div class="speaker-name">${name}</div>
<div class="speaker-bio speaker-count-${count}" lang="de">${bio}</div>
</div>`;
} else {
inner = html``;
}
return inner;
};
const speaker_meta = (event) => {
const speakers = sol.eventPersons(event);
const n = speakers.length;
return html`<div class="speaker-meta">${speakers.map(s => speaker_info(s, n))}</div>`;
};
const event_info = (event, time) =>
html`
<div class="upper">
${event_meta(event, time)}
</div>
<div class="lower">
${event_content(event)}
${speaker_meta(event)}
</div>`;
const footer = (config) =>
html`<div class="footer">${music.music_credits(config)}</div>`;
const update_main_slide = (data, time, config) => {
if (sol.defined(data.scheduleData)) {
const schedule = data.scheduleData;
const thisRoom = config.roomName;
const dt = luxon.Duration.fromObject({minutes: 6});
const events = sol.allEvents(schedule);
const eventsHere = sol.eventsByRoomName(events, thisRoom);
const startingEventsHere = sol.startingEvents(eventsHere, time, dt);
const currentEventsHere = sol.currentEvents(eventsHere, time);
const endedEventsHere = sol.endedEvents(eventsHere, time, dt);
const upcomingEventsHere = sol.distinctEvents(startingEventsHere.concat(currentEventsHere, endedEventsHere));
const inner = html`
<div class="slide">
${upcomingEventsHere.slice(0,1).map(e => event_info(e, time))}
${footer(config)}
</div>`;
// Add main slide to frame
const anchorElId = "main";
const el = document.getElementById(anchorElId);
preact.render(inner, el);
};
};
export {
update_main_slide
};