Remove project selected

This commit is contained in:
Synobbol 2023-08-16 14:01:21 +02:00
parent 5f55ed66bf
commit 82cce8f70b
4 changed files with 85 additions and 19 deletions

View File

@ -11,15 +11,16 @@
<h1>Todo List Plus</h1>
</header>
<main>
<h2>Projects</h2>
<h2>Projects:</h2>
<div>
<ul class="projectList">
<li><a href="project.html">DEFAULT PROJECT</a></li>
</ul>
</div>
<button class="show">Add project</button>
<div class="form" hidden>
<div class="form">
<input class="nameP" type="text" name="nameP" placeholder="name of your project">
<button id="addP">+</button>
</div>

83
main.js
View File

@ -21,39 +21,88 @@ const projectInput = document.querySelector(".show");
projectInput.addEventListener("click",()=>{
const form = document.querySelector(".form");
console.log(form.getAttributeNode("hidden"));
form.removeAttribute("hidden");
Display.toggleShow(form);
});
const project = document.getElementById("addP");
const add = document.getElementById("addP");
project.addEventListener("click", () =>{
add.addEventListener("click", () =>{
const projectName = document.querySelector(".nameP");
console.log(projectName.value);
const newProject = Project();
newProject.addName(projectName.value);
newProject.addName(projectName.value);
});
const Display = (() =>{
const toggleShow = (name) => {
if (name.style.display === "block") {
name.style.display = "none";
}
else {
name.style.display = "block";
}
}
const appendList = (node, array) => {
array.forEach(element => {
let child = node.appendChild(element);
return child;
});
}
const delNode = (node)=> {
console.log("Remove!");
node.remove();
}
return {toggleShow, appendList, delNode};
})();
const Storage = (() =>{
const setItems = (name) => {
}
const removeItems = () =>{
}
const clearStorage = () =>{
}
return {setItems, removeItems, clearStorage};
})();
const Project = (name) =>{
const getName = () => name;
//let listName = [];
const addName = (name) => {
let projectList = document.querySelector(".projectList");
let project = document.createElement("li");
let btn = document.createElement("button");
btn.innerText = `${name}`;
project.appendChild(btn);
projectList.appendChild(project);
}
const projectList = document.querySelector(".projectList");
const project = document.createElement("li");
const link = document.createElement("a");
link.setAttribute("href", "project.html");
link.innerText = `${name}`;
const btnDel = document.createElement("button");
btnDel.innerText = "-";
btnDel.addEventListener("click", ()=>{
Display.delNode(project);
});
let list = [link, btnDel];
Display.appendList(project,list);
projectList.appendChild(project);
console.log(pjctNames);
}
return {getName, addName};
}
const TodoList = () =>{
const TodoList = (name) =>{
const getName = () => name;
const addList = () =>{
}
}
const TodoItems = (title, description, dueDate, priority) =>{
const getTitle = () => title;

13
project.html Normal file
View File

@ -0,0 +1,13 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Project</title>
</head>
<body>
<div id = "container">
</div>
</body>
</html>

View File

@ -3,4 +3,7 @@ ul{
}
li {
list-style: none;
}
.form {
display: none;
}