// Entry point: wire the page up and start.
//
// Modules import only from modules earlier in this list:
//   util, api, store, settings, player, clips, analysis, day, list, nav, main
// Keep it that way. A module that needs something from a later one reaches it
// through the DOM (openClipInFile clicks the day toggle) rather than an import.

import {$} from './util.js';
import {getConfig} from './api.js';
import {initSettings} from './settings.js';
import {initClipBar} from './clips.js';
import {initNav} from './nav.js';
import {load, applyFilters, pollStatus} from './list.js';

initClipBar();
initNav();

$('refresh-btn').addEventListener('click', () => load({speak: true}));

let filterDebounce;
$('filter-name').addEventListener('input', () => {
  clearTimeout(filterDebounce);
  filterDebounce = setTimeout(() => applyFilters({speak: true}), 400);
});
$('filter-from').addEventListener('change', () => applyFilters({speak: true}));
$('filter-to').addEventListener('change', () => applyFilters({speak: true}));
$('filter-clear').addEventListener('click', () => {
  $('filter-name').value = '';
  $('filter-from').value = '';
  $('filter-to').value   = '';
  applyFilters({speak: true});
});

getConfig().catch(() => ({})).then(initSettings)
  .finally(() => load().then(() => setInterval(pollStatus, 5000)));