'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 max_events = 5;

const title_string = 'Nächste Events:';

const local_room = 'Hier';


const this_room = (config) => sol.optional(config.roomName);


const this_location = (config) => {
    const here = this_room(config);
    return sol.defined(here) ? html`@${here}` : html``;
};


const schedule_table_header = () =>
    html`
    <div class="schedule">
      <div class="title">${title_string}</div>
    </div>`;


const event_time = (event) => {
    const esd = sol.eventStartDate(event);
    const time = esd.setLocale('de').toLocaleString(luxon.DateTime.TIME_24_SIMPLE);
    return html`<div class="event-time">${time}</div>`;
};


const event_location = (event, config) => {
    const here_room = this_room(config);
    const event_room = sol.eventRoomName(event);

    let inner;
    if (sol.defined(here_room) && (event_room === here_room)) {
        inner = html`<div class="event-location this-room">${local_room}</div>`;
    } else {
        inner = html`<div class="event-location">${event_room}</div>`;
    }
    return inner;
};


const event_title = (event) => {
    const title = serv.fix_dash(sol.eventTitle(event));
    const ti = serv.track_index(sol.eventTrack(event));
    return html`<div class="event-title track-${ti}">${title}</div>`;
};


const event_speaker = (event) => {
    const speaker = serv.fix_dash(serv.person_names_concat(sol.eventPersons(event)));
    return html`<div class="event-speaker">${speaker}</div>`;
};


const schedule_table_event = (event, config) =>
    html`
    <div class="event">
      ${event_time(event)}
      ${event_location(event, config)}
      <div class="event-info">
        ${event_title(event)}
        ${event_speaker(event)}
      </div>
    </div>`;


const schedule_table_events = (events, config) =>
    html`
    <div class="events">
      ${events.map(e => schedule_table_event(e, config))}
    </div>`;


const schedule_table = (events, config) =>
    html`
    ${schedule_table_header()}
    ${schedule_table_events(events, config)}`;


const header = (config) =>
    html`<div class="room-location">${this_location(config)}</div>`;


const list_track = (track) =>
    html`<span class="track track-${serv.track_index(track)}">${track}</span>`;


const list_tracks = (tracks) =>
    html`<div class="track-info">${tracks.map(t => list_track(t))}</div>`;


const footer = (tracks, config) =>
    html`
    <div class="footer">
      ${list_tracks(tracks)}
      ${music.music_credits(config)}
    </div>`;


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

    if (sol.defined(data.scheduleData)) {
        const schedule = data.scheduleData;

        // const allDays = sol.allDays(schedule);
        // const currentDays = sol.currentDays(allDays, time);
        // const futureDays = sol.futureDays(allDays, time);
        // const nextDays = currentDays.concat(futureDays);

        // const nextDaysSorted = sol.sortDaysByStartDate(nextDays, time);
        // Hack: if we do not have a next day, all days are in the past and it does not matter.
        // const nextDay = nextDaysSorted.length > 0 ? nextDaysSorted[0] : allDays[0];

        const allEvents = sol.allEvents(schedule);
        const nextEvents = allEvents;
        //const nextEvents = allEventssol.eventsByDay(allEvents, nextDay);

        const dt = luxon.Duration.fromObject({minutes: 10});

        const startedEvents = sol.startedEvents(nextEvents, time, dt);
        const futureEvents = sol.futureEvents(nextEvents, time);

        // const upcomingEvents = futureEvents;
        // const upcomingEvents = sol.futureEvents(nextEvents, time);
        const upcomingEvents = sol.distinctEvents(startedEvents.concat(futureEvents));

        const upcomingEventsSorted = sol.sortEventsByStartDate(upcomingEvents);

        const allTracks = sol.allTracks(schedule);
        const tracks = allTracks.filter(t => t !== "Andere");

        // Take first n events
        const events = upcomingEventsSorted.slice(0, max_events);

        // Assemble dom
        const inner = html`
        <div class="slide">
          ${header(config)}
          ${schedule_table(events, config)}
          ${footer(tracks, config)}
        </div>`;

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


export {
    update_main_slide
};