function solve() { let sections=Array.from(document.getElementsByTagName('section')); let open=sections[1]; let inProgress=sections[2]; let finished=sections[3]; console.log(open,inProgress,finished); let inputs=Array.from(document.getElementsByTagName("input")); console.log(inputs) let taskInput=inputs[0]; let descInput=document.getElementById("description") let dateInput=inputs[1]; let addBtn=document.getElementById('add'); addBtn.addEventListener("click",addToOpen); function addToOpen(e){ e.preventDefault(); console.log('add to open clicked'); let task=taskInput.value; let description=descInput.value; let dueDate=dateInput.value; console.log(description) if (task.length>0&&description.length>0&& dueDate.length>0){ console.log('inputs are fine, lets go'); let taskObj={ttask:task,tdescription:description,tdueDate:dueDate} let taskArticle=document.createElement("article"); let taskH=document.createElement("h3"); taskH.textContent=task; let descP=document.createElement("p"); descP.textContent=`Description: ${description}`; let dateP=document.createElement("p"); dateP.textContent=`Due Date: ${dueDate}`; let buttonsDiv=document.createElement("div"); buttonsDiv.className="flex"; let startBtn=document.createElement("button"); startBtn.textContent="Start"; startBtn.className="green"; startBtn.addEventListener("click", ()=>(moveTaskToInProgres(taskObj,taskArticle))); let delBtn=document.createElement("button"); delBtn.textContent="Delete"; delBtn.className="red"; delBtn.addEventListener("click",()=>(deleteArticle(taskArticle))); buttonsDiv.appendChild(startBtn); buttonsDiv.appendChild(delBtn); taskArticle.appendChild(taskH); taskArticle.appendChild(descP); taskArticle.appendChild(dateP); taskArticle.appendChild(buttonsDiv) open.appendChild(taskArticle) taskInput.value=""; dateInput.value=""; descInput.value=""; } } function deleteArticle(art){ art.remove(); } function moveTaskToInProgres(taskObj,aToDelete){ //let taskObj={ttask:task,tdescription:description,tdueDate:dueDate} let taskArticle=document.createElement("article"); let taskH=document.createElement("h3"); taskH.textContent=taskObj.ttask; let descP=document.createElement("p"); descP.textContent=`Description: ${taskObj.tdescription}`; let dateP=document.createElement("p"); dateP.textContent=`Due Date: ${taskObj.tdueDate}`; let buttonsDiv=document.createElement("div"); buttonsDiv.className="flex"; let delBtn=document.createElement("button"); delBtn.textContent="Delete"; delBtn.className="red"; delBtn.addEventListener("click",()=>(deleteArticle(taskArticle))); let finishBtn=document.createElement("button"); finishBtn.textContent="Finish"; finishBtn.className="orange"; finishBtn.addEventListener("click", ()=>(moveTaskToFinished(taskObj,taskArticle))); buttonsDiv.appendChild(delBtn); buttonsDiv.appendChild(finishBtn); taskArticle.appendChild(taskH); taskArticle.appendChild(descP); taskArticle.appendChild(dateP); taskArticle.appendChild(buttonsDiv) inProgress.appendChild(taskArticle); aToDelete.remove(); } function moveTaskToFinished(obj, artToDelete){ let taskArticle=document.createElement("article"); let taskH=document.createElement("h3"); taskH.textContent=obj.ttask; let descP=document.createElement("p"); descP.textContent=`Description: ${obj.tdescription}`; let dateP=document.createElement("p"); dateP.textContent=`Due Date: ${obj.tdueDate}`; taskArticle.appendChild(taskH); taskArticle.appendChild(descP); taskArticle.appendChild(dateP); finished.appendChild(taskArticle); artToDelete.remove(); } }