TDI-Dashboard/static/js/logs.js

(function(){
  var search      = document.getElementById('log-search');
  var typeChecks  = document.querySelectorAll('.type-filter');
  var pnContainer = document.getElementById('filter-process-names');
  var pgSelect    = document.getElementById('pg-run-select');
  var dateFrom    = document.getElementById('filter-date-from');
  var dateTo      = document.getElementById('filter-date-to');
  var filterBtn   = document.getElementById('filter-date-btn');

  var STORAGE_KEY        = 'logs_pn_filter';
  var STORAGE_KEY_DATE   = 'logs_date_filter';
  var STORAGE_KEY_ACTIVE = 'logs_date_active';

  function toIsoDate(d) { return d.toISOString().slice(0, 10); }

  // ── Restore / default date range ──────────────────────────────────────────
  function loadSavedDates() {
    try { return JSON.parse(sessionStorage.getItem(STORAGE_KEY_DATE) || 'null'); } catch(e) { return null; }
  }
  function saveDates() {
    try {
      sessionStorage.setItem(STORAGE_KEY_DATE, JSON.stringify({
        from: dateFrom ? dateFrom.value : '',
        to:   dateTo   ? dateTo.value   : '',
      }));
      sessionStorage.setItem(STORAGE_KEY_ACTIVE, '1');
    } catch(e) {}
  }

  var dateActive = (function() {
    try { return sessionStorage.getItem(STORAGE_KEY_ACTIVE) === '1'; } catch(e) { return false; }
  })();

  var savedDates = loadSavedDates();
  if (savedDates) {
    if (dateFrom) dateFrom.value = savedDates.from || '';
    if (dateTo)   dateTo.value   = savedDates.to   || '';
  } else {
    var today = new Date();
    var twoWeeksAgo = new Date(today); twoWeeksAgo.setDate(today.getDate() - 14);
    if (dateFrom) dateFrom.value = toIsoDate(twoWeeksAgo);
    if (dateTo)   dateTo.value   = toIsoDate(today);
  }

  // ── Process-name checkboxes (built from pagination select options) ─────────
  var names = [];
  if (pgSelect) {
    Array.from(pgSelect.options).forEach(function(opt) {
      var n = opt.getAttribute('data-process-name');
      if (n && names.indexOf(n) === -1) names.push(n);
    });
    names.sort();
  }

  function loadSaved() {
    try { return JSON.parse(sessionStorage.getItem(STORAGE_KEY) || '{}'); } catch(e) { return {}; }
  }
  function saveState() {
    var state = {};
    Object.keys(pnChecks).forEach(function(n){ state[n] = pnChecks[n].checked; });
    try { sessionStorage.setItem(STORAGE_KEY, JSON.stringify(state)); } catch(e) {}
  }

  var pnChecks = {};
  var saved = loadSaved();
  if (pnContainer) {
    names.forEach(function(name) {
      var lbl = document.createElement('label');
      var chk = document.createElement('input');
      chk.type    = 'checkbox';
      chk.checked = (saved[name] !== undefined) ? saved[name] : true;
      chk.addEventListener('change', function(){ console.log('[logs] process filter changed:', name, this.checked); saveState(); filterSelect(); });
      pnChecks[name] = chk;
      lbl.appendChild(chk);
      lbl.appendChild(document.createTextNode(' ' + name));
      pnContainer.appendChild(lbl);
    });
  }

  // Store all options once at init — source of truth for rebuilding the select
  var allOptions = pgSelect
    ? Array.from(pgSelect.options).map(function(o) { return o; })
    : [];

  // ── Pagination select filter (process_name + date) ────────────────────────
  function filterSelect() {
    if (!pgSelect) return;
    var from       = dateActive && dateFrom ? dateFrom.value : '';
    var to         = dateActive && dateTo   ? dateTo.value   : '';
    var currentVal = pgSelect.value;

    while (pgSelect.options.length) pgSelect.remove(0);

    var currentVisible = false;
    allOptions.forEach(function(opt) {
      var pn     = opt.getAttribute('data-process-name') || '';
      var date   = opt.getAttribute('data-date') || '';
      var pnOk   = pnChecks[pn] ? pnChecks[pn].checked : true;
      var dateOk = (!from || !date || (date >= from && date <= to));
      if (pnOk && dateOk) {
        pgSelect.appendChild(opt);
        if (opt.value === currentVal) currentVisible = true;
      }
    });

    if (!currentVisible && pgSelect.options.length > 0) {
      location.href = '/logs?run=' + pgSelect.options[0].value;
    }
  }

  // ── Table row filter (type + search + date) ───────────────────────────────
  function applyFilter() {
    var q      = search ? search.value.toLowerCase() : '';
    var from   = dateActive && dateFrom ? dateFrom.value : '';
    var to     = dateActive && dateTo   ? dateTo.value   : '';
    var active = {};
    typeChecks.forEach(function(c){ if (c.checked) active[c.value] = 1; });
    document.querySelectorAll('tbody tr').forEach(function(tr) {
      var type   = tr.dataset.type || '';
      var text   = tr.textContent.toLowerCase();
      var date   = tr.getAttribute('data-date') || '';
      var dateOk = (!from || date >= from) && (!to || date <= to);
      tr.style.display = (active[type] && text.indexOf(q) >= 0 && dateOk) ? '' : 'none';
    });
  }

  // ── Filter button — saves dates then applies both filters ─────────────────
  if (filterBtn) {
    filterBtn.addEventListener('click', function() {
      console.log('[logs] filtra clicked — from:', dateFrom && dateFrom.value, 'to:', dateTo && dateTo.value);
      dateActive = true;
      saveDates();
      applyFilter();
      filterSelect();
    });
  }

  if (search) search.addEventListener('input', function() {
    console.log('[logs] search input:', search.value);
    applyFilter();
  });
  typeChecks.forEach(function(c){ c.addEventListener('change', function() {
    console.log('[logs] type filter changed:', c.value, '->', c.checked);
    applyFilter();
  }); });

  if (pgSelect) pgSelect.addEventListener('change', function() {
    console.log('[logs] run selected:', pgSelect.value);
  });

  // Initial apply (uses restored dates)
  applyFilter();
  filterSelect();
})();