it

Mind mapping tool

Inserisci qui il tuo testo...

Mind Mapping Tool
#mindmap { width: 100%; height: 500px; border: 1px solid black; } .node { position: absolute; width: 100px; height: 100px; background-color: #eee; border: 1px solid black; } .node.active { background-color: #ddd; } .node:hover { cursor: pointer; }
var mindmap = document.getElementById("mindmap"); var nodes = []; var activeNode = null; var nodeCount = 0; mindmap.addEventListener("click", function(e) { if (e.target.classList.contains("node")) { if (activeNode) { activeNode.classList.remove("active"); } activeNode = e.target; activeNode.classList.add("active"); } }); document.getElementById("addNode").addEventListener("click", function() { var newNode = document.createElement("div"); newNode.classList.add("node"); newNode.id = "node-" + nodeCount; newNode.style.top = Math.random() * 400 + "px"; newNode.style.left = Math.random() * 800 + "px"; mindmap.appendChild(newNode); nodes.push(newNode); nodeCount++; }); document.getElementById("deleteNode").addEventListener("click", function() { if (activeNode) { mindmap.removeChild(activeNode); nodes.splice(nodes.indexOf(activeNode), 1); activeNode = null; } }); document.getElementById("editNode").addEventListener("click", function() { if (activeNode) { var text = prompt("Enter new node text:"); activeNode.innerHTML = text; } });
// Select the DOM elements for the mind map and the buttons const mindmap = document.getElementById("mindmap"); const addNodeBtn = document.getElementById("addNode"); const deleteNodeBtn = document.getElementById("deleteNode"); const editNodeBtn = document.getElementById("editNode"); // Define a function to add a new node to the mind map function addNode() { // Create a new node element const node = document.createElement("div"); node.classList.add("node"); node.textContent = "New Node"; // Add the node to the mind map mindmap.appendChild(node); } // Define a function to delete the last node from the mind map function deleteNode() { // Find the last child node of the mind map and remove it const lastNode = mindmap.lastChild; if (lastNode) { mindmap.removeChild(lastNode); } } // Define a function to edit the text content of the last node in the mind map function editNode() { // Find the last child node of the mind map and prompt the user to enter new text content const lastNode = mindmap.lastChild; if (lastNode) { const newText = prompt("Enter new text for the node", lastNode.textContent); if (newText) { lastNode.textContent = newText; } } } // Add event listeners to the buttons to trigger the corresponding functions when clicked addNodeBtn.addEventListener("click", addNode); deleteNodeBtn.addEventListener("click", deleteNode); editNodeBtn.addEventListener("click", editNode);