Loading website...
/...
No file selected
Live Preview
Planteer AI
Ready
Planteer AI is ready. Ask me to help build, edit, debug, explain, or improve your website.
Ready
`; } if ( lower.endsWith( ".css" ) ) { return `* { box-sizing: border-box; } body { margin: 0; min-height: 100vh; font-family: Arial, sans-serif; padding: 40px; }`; } if ( lower.endsWith( ".js" ) ) { return `console.log("Planteer website loaded.");`; } if ( lower.endsWith( ".json" ) ) { return `{ "name": "Planteer Website" }`; } return ""; } /* ========================================================== CREATE FOLDER ========================================================== */ function newFolder() { openModal( "New Folder", "Enter a folder path, such as assets or css/components.", "", value => { const path = normalizePath( value ); if (!path) { return; } if ( files.some( file => normalizePath( file.path ) === path && file.is_folder ) ) { showStatus( "That folder already exists." ); return; } files.push({ path, content: "", is_folder: true }); renderTree(); saveFile(); } ); } /* ========================================================== RENAME ========================================================== */ function renameSelected() { if (!selectedPath) { showStatus( "Select a file first." ); return; } openModal( "Rename File", "Enter the new path.", selectedPath, value => { const newPath = normalizePath( value ); if (!newPath) { return; } if ( files.some( file => normalizePath( file.path ) === newPath ) ) { showStatus( "That path already exists." ); return; } const file = files.find( item => normalizePath( item.path ) === selectedPath ); if (!file) { return; } file.path = newPath; selectedPath = newPath; renderTree(); renderTabs(); saveFile(); } ); } /* ========================================================== DELETE ========================================================== */ function deleteSelected() { if (!selectedPath) { showStatus( "Select a file first." ); return; } const path = selectedPath; openModal( "Delete File", "Type the path again to confirm deletion: " + path, "", value => { if ( value !== path ) { showStatus( "Deletion cancelled." ); return; } files = files.filter( file => normalizePath( file.path ) !== path ); selectedPath = null; editor.value = ""; renderTree(); renderTabs(); updatePreview(); saveFile(); } ); } /* ========================================================== MODAL ========================================================== */ function openModal( title, text, value, action ) { document.getElementById( "modalTitle" ).textContent = title; document.getElementById( "modalText" ).textContent = text; const input = document.getElementById( "modalInput" ); input.value = value; modalAction = action; document.getElementById( "modalBg" ).classList.add( "show" ); setTimeout( () => input.focus(), 50 ); } function closeModal() { document.getElementById( "modalBg" ).classList.remove( "show" ); modalAction = null; } function submitModal() { const input = document.getElementById( "modalInput" ); const value = input.value.trim(); const action = modalAction; closeModal(); if (action) { action(value); } } document .getElementById( "modalInput" ) .addEventListener( "keydown", event => { if ( event.key === "Enter" ) { submitModal(); } if ( event.key === "Escape" ) { closeModal(); } } ); /* ========================================================== LIVE PREVIEW ========================================================== */ function getFile( path ) { path = normalizePath( path ); return files.find( file => normalizePath( file.path ) === path && !file.is_folder ); } function updatePreview() { saveCurrentIntoMemory(); const index = getFile( "index.html" ); if (!index) { preview.srcdoc = `

No index.html

Create an index.html file to preview your website.

`; return; } let html = index.content || ""; const css = getFile( "style.css" ); const js = getFile( "script.js" ); if (css) { const cssTag = ``; if ( html.includes( "" ) ) { html = html.replace( "", cssTag + "" ); } else { html = cssTag + html; } } if (js) { const jsTag = `