script.mjs

import { getUserIds } from "./common.mjs";
import { addData, getData } from "./storage.mjs";
import {
  calculateRevisionDates,
  formatDate,
  stringifiedTodayDate,
  upcomingItems,
} from "./dates.js";

const state = {
  selectedUserId: null,
  agenda: [],
};

const elements = {
  userSelect: null,
  statusMessage: null,
  topicForm: null,
  topicNameInput: null,
  topicDateInput: null,
  agendaList: null,
};

window.onload = function () {
  const users = getUserIds();
  elements.userSelect = document.getElementById("user-select");
  elements.statusMessage = document.getElementById("status-message");
  elements.topicForm = document.getElementById("add-topic");
  elements.topicNameInput = document.getElementById("topic-name");
  elements.topicDateInput = document.getElementById("topic-date");
  elements.agendaList = document.getElementById("agenda-list");

  elements.topicDateInput.value = stringifiedTodayDate();
  populateUserDropdown(users);
  elements.userSelect.addEventListener("change", handleUserSelection);
  elements.topicForm.addEventListener("submit", submitTopic);
};

function populateUserDropdown(users) {
  for (const user of users) {
    const option = document.createElement("option");
    option.value = user;
    option.textContent = `User ${user}`;
    elements.userSelect.appendChild(option);
  }
}

function handleUserSelection(event) {
  state.selectedUserId = event.target.value;
  if (!state.selectedUserId) {
    state.agenda = [];
    elements.agendaList.textContent = "";
    elements.statusMessage.textContent = "Select a user to see their agenda";
    return;
  }
  state.agenda = getData(state.selectedUserId) || [];
  renderAgenda();
}

function submitTopic(event) {
  event.preventDefault();

  if (!state.selectedUserId) {
    elements.statusMessage.textContent = "Select a user before adding a topic";
    return;
  }

  const topicData = new FormData(elements.topicForm);

  const topicName = topicData.get("topic-name").trim();
  const isDaplicate = state.agenda.some((item) => item.topic === topicName);
  if (!topicName) {
    elements.statusMessage.textContent = "Topic name can not be empty";
    return;
  }
  if (isDaplicate) {
    elements.statusMessage.textContent = "Topic already exist";
    return;
  }
  const topicDate = topicData.get("topic-date");
  const revisionDates = calculateRevisionDates(topicDate);
  const items = revisionDates.map((date) => {
    return { topic: topicName, date: date };
  });

  addData(state.selectedUserId, items);
  state.agenda = getData(state.selectedUserId);
  renderAgenda();
  elements.topicForm.reset();
  elements.topicDateInput.value = stringifiedTodayDate();
}

function renderAgenda() {
  if (!state.selectedUserId) {
    return;
  }
  elements.agendaList.textContent = "";
  const upcomingAgendaItems = upcomingItems(state.agenda);
  if (upcomingAgendaItems.length === 0) {
    elements.statusMessage.textContent = "No agenda found for the current user";
  } else {
    elements.statusMessage.textContent = "";
  }
  upcomingAgendaItems.forEach((agendaItem) => {
    const itemList = document.createElement("li");
    itemList.textContent = `${agendaItem.topic} --- ${agendaItem.date}`;
    elements.agendaList.appendChild(itemList);
  });
}