01. Task Manager Exam may 2020

function taskManager() {
  const makeEl = (type, text, clazz) => {
    const el = document.createElement(type);
    if (text !== null) {
      el.textContent = text;
    }
    if (clazz !== null) {
      el.setAttribute('class', clazz);
    }
    return el;
  };

  const addToSection = (section, art) => {
    sectionMap[section].children[1].appendChild(art);
    return art;
  };

  const deleteArticle = (e) => {
    const art = e.target.parentNode.parentNode;
    art.remove();
    return art;
  };

  const removeButtons = (art) => {
    const btnDiv = art.children[3];
    art.removeChild(btnDiv);
    return art;
  };

  const btn = this.document.getElementById('add');
  const sections = document.getElementsByTagName('section');

  let sectionMap = {
    open: sections[1],
    inProgress: sections[2],
    complete: sections[3],
  };

  btn.addEventListener('click', (e) => {
    e.preventDefault();

    const title = document.getElementById('task').value;
    const description = document.getElementById('description').value;
    const date = document.getElementById('date').value;
    const dateRegex = new RegExp('^\\d{4}\\.\\d{2}\\.\\d{2}$');

    if (title === '' || description === '' || !dateRegex.test(date)) {
      console.log('Error');
      return;
    }

    const art = document.createElement('article');

    art.appendChild(makeEl('h3', title, null));
    art.appendChild(makeEl('p', `Description: ${description}`, null));
    art.appendChild(makeEl('p', `Due Date: ${date}`, null));

    const btnDiv = makeEl('div', null, 'flex');
    const startBtn = makeEl('button', 'Start', 'green');

    startBtn.addEventListener('click', (e) => {
      const artRemove = removeButtons(deleteArticle(e));
      const btnDiv = makeEl('div', null, 'flex');
      const delBtn = makeEl('button', 'Delete', 'red');

      delBtn.addEventListener('click', (e) => {
        deleteArticle(e);
      });

      btnDiv.appendChild(delBtn);

      const finishBtn = makeEl('button', 'Finish', 'orange');
      finishBtn.addEventListener('click', (e) => {
        addToSection('complete', removeButtons(deleteArticle(e)));
      });

      btnDiv.appendChild(finishBtn);
      artRemove.appendChild(btnDiv);
      addToSection('inProgress', artRemove);
    });

    btnDiv.appendChild(startBtn);

    const delBtn = makeEl('button', 'Delete', 'red');
    delBtn.addEventListener('click', (e) => {
      deleteArticle(e);
    });

    btnDiv.appendChild(delBtn);
    art.appendChild(btnDiv);
    addToSection('open', art);
  });
}