html5-infobeamer-aalen-geekend-23/assets/js/custom/dom/upcoming-talk.js

'use strict';

import * as sol from "../../solight/sol.js";

import * as serv from "../services/general.js";
import * as tiserv from "../services/timeText.js";


const html = htm.bind(preact.h);

const minBioLength = 20;

const event_persons = (persons) =>
    html`<div class="speakers">${serv.fix_dash(serv.person_names_concat(persons))}:</div>`;


const event_remaining_time_abs_rel = (event, time) => {
    const dt = luxon.Duration.fromObject({minutes: 11});
    return sol.isEndingEvent(event, time, dt) ?
        tiserv.event_relative_end_time_string(event, time) :
        tiserv.event_absolute_end_time_string(event, time);
};

const event_time_abs_rel = (event, time) =>
      sol.isFutureEvent(event, time) ?
      tiserv.event_relative_fuzzy_start_time_string(event, time) :
      event_remaining_time_abs_rel(event, time);

const event_time = (event, time) => {
    const ti = serv.type_index(sol.eventType(event));
    const timestr = ti !== 0 ?
          tiserv.event_relative_fuzzy_start_time_string(event, time) :
          event_time_abs_rel(event, time);
    return html`<div class="starttime">${timestr}</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">Description:</div>
      <div class="event-description-text" lang="en">${text}</div>
    </div>`;
};

const event_content = (event) =>
    html`<div class="event-content">${event_description(event)}</div>`;

const speaker_info = (speaker) => {
    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" lang="en">${bio}</div>
        </div>`;
    } else {
        inner = html``;
    }
    return inner;
};

const speaker_meta = (event) => {
    const speakers = sol.eventPersons(event);
    return html`<div class="speaker-meta">${speakers.map(s => speaker_info(s))}</div>`;
};

const event_info = (event, time) => {
    const ti = serv.type_index(sol.eventType(event));
    return html`
    <div class="upper type-${ti}">
      ${event_meta(event, time)}
    </div>
    <div class="lower type-${ti}">
      ${event_content(event)}
      ${speaker_meta(event)}
    </div>`;
};


const update_main_slide = (data, time, config) => {
    // console.group("Updating Main Slide with:");
    // console.info(data);
    // console.info(time);
    // console.info(config);
    // console.groupEnd();

    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 eventsSorted = sol.sortEventsByStartDate(events);
        const eventsHere = sol.eventsByRoomName(eventsSorted, 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));

        // Assemble dom
        const inner = html`
        <div class="slide">
        ${upcomingEventsHere.slice(0,1).map(e => event_info(e, time))}
        </div>`;

        // Add main slide to frame
        const anchorElId = "main";
        const el = document.getElementById(anchorElId);
        preact.render(inner, el);
    };
};


export {
    update_main_slide
};