Advertisement
Dragomana

Task Menager

May 27th, 2022
732
331 days
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. function solve() {
  2.  
  3.     let inputTask = document.getElementById('task')
  4.     let inputDescript = document.getElementById('description')
  5.     let inputDate = document.getElementById('date')
  6.     let btnAdd = document.getElementById('add')
  7.     let divOpenSection = document.querySelector('main > div > section:nth-child(2) > div:nth-child(2)')
  8.     let divInProgress = document.getElementById('in-progress')
  9.     let divComplete = document.querySelector('main > div > section:nth-child(4) > div:nth-child(2)')
  10.     // inputTask.value = 'JS Advanced'
  11.     // inputDescript.value = 'DOM'
  12.     // inputDate.value = '12.12.2022'
  13.     btnAdd.addEventListener('click', addTask)
  14.  
  15.     function addTask(e) {
  16.         e.preventDefault()
  17.         if (inputTask.value == "" || inputDate.value == "" || inputDescript.value == '') {
  18.             return
  19.         }
  20.         console.log("ok");
  21.         let articleSecOpen = document.createElement('article')
  22.         let h3OpenSec = document.createElement('h3')
  23.         let pOpenSec = document.createElement('p')
  24.         let pDateOpenSec = document.createElement('p')
  25.         let divOpenSec = document.createElement('div')
  26.         let btnStart = document.createElement('button')
  27.         let btnDelete = document.createElement('button')
  28.  
  29.         h3OpenSec.textContent = inputTask.value
  30.         pOpenSec.textContent = `Description: ${inputDescript.value}`
  31.         pDateOpenSec.textContent = `Due Date: ${inputDate.value}`  
  32.         divOpenSec.classList.add('flex')
  33.         btnStart.textContent = 'Start'
  34.         btnStart.classList.add('green')
  35.         btnDelete.textContent = 'Delete'
  36.         btnDelete.classList.add('red')
  37.  
  38.         divOpenSec.appendChild(btnStart)
  39.         divOpenSec.appendChild(btnDelete)
  40.         articleSecOpen.appendChild(h3OpenSec)
  41.         articleSecOpen.appendChild(pOpenSec)
  42.         articleSecOpen.appendChild(pDateOpenSec)
  43.         articleSecOpen.appendChild(divOpenSec)
  44.         divOpenSection.appendChild(articleSecOpen)
  45.  
  46.         btnStart.addEventListener('click', moveToInProgress)
  47.         btnDelete.addEventListener('click', removeFromOpenSec)
  48.     }
  49.  
  50.     function moveToInProgress(e) {
  51.         let btnDelInProgress = document.createElement('button')
  52.         btnDelInProgress.classList.add('red')
  53.         btnDelInProgress.textContent = 'Delete'
  54.         let btnFinish = document.createElement('button')
  55.         btnFinish.classList.add('orange')
  56.         btnFinish.textContent = 'Finish'
  57.  
  58.         let div = e.target.parentNode
  59.         div.innerHTML = ''
  60.         let article = div.parentNode
  61.         div.appendChild(btnDelInProgress)
  62.         div.appendChild(btnFinish)
  63.  
  64.         divInProgress.appendChild(article)
  65.  
  66.         btnDelInProgress.addEventListener('click', deleteArticle)
  67.         btnFinish.addEventListener('click', moveToComplete)
  68.     }
  69.  
  70.     function removeFromOpenSec(e) {
  71.         e.target.parentNode.parentNode.remove()
  72.     }
  73.  
  74.     function moveToComplete(e) {
  75.         const div = e.target.parentNode
  76.         const article = div.parentNode
  77.         div.remove()
  78.         divComplete.appendChild(article)
  79.     }
  80.  
  81.     function deleteArticle(e) {
  82.         e.target.parentNode.parentNode.remove()
  83.     }
  84. }
Advertisement
RAW Paste Data Copied
Advertisement