editor.js

const preview=document.getElementById("preview"),previewContainer=document.getElementById("preview"),modalOverlay=document.getElementById("modal-overlay");let currentElement=null,currentState=JSON.parse(localStorage.getItem("currentState"))||{blocks:{},layout:[],sceleton:{config:defaultConfig}};currentState.blocks&&0!==Object.keys(currentState.blocks).length||(currentState.blocks=defaultBlocks),currentState.sceleton&&currentState.sceleton.config||(currentState.sceleton=currentState.sceleton||{},currentState.sceleton.config=defaultConfig);let blocks=currentState.blocks,savedConfig=currentState.sceleton.config||defaultConfig; function applyBodyClasses(){document.body.className = currentState.sceleton.bodyClasses;}function applyTailwindConfig(e){let t=document.querySelector("script[data-tailwind-config]");if(t)t.textContent=`tailwind.config = ${e};`;else{const t=document.createElement("script");t.setAttribute("data-tailwind-config",""),t.textContent=`tailwind.config = ${e};`,document.head.appendChild(t)}}function initializeBlockList(){Object.entries(blocks).forEach(([e,{content:t,title:n}])=>{const r=document.createElement("div"),o=document.createElement("div");o.className="relative w-full h-full";const i=document.createElement("div"),c=document.createElement("div");c.innerHTML=t||e,i.appendChild(c),o.appendChild(i),r.appendChild(o)})}function getBlockType(e){for(const[t,n]of Object.entries(blocks)){const r=document.createElement("div");r.innerHTML=n.content.trim();const o=r.firstElementChild;if(o.id&&e.id&&o.id===e.id)return t;if(n.title&&n.title===e.getAttribute("buildy"))return t;if(o.outerHTML.trim()===e.outerHTML.trim())return t}return"unknown"}function saveCurrentState(){currentState.layout=Array.from(preview.children).map(e=>{return{type:getBlockType(e.firstElementChild),content:e.firstElementChild.outerHTML}}),localStorage.setItem("currentState",JSON.stringify(currentState))}function loadSavedState(){const e=JSON.parse(localStorage.getItem("currentState"));e&&(blocks=(currentState=e).blocks,initializeBlockList(),currentState.layout.forEach(e=>{if(blocks[e.type]){const t=document.createElement("div");t.className="block-wrapper relative border border-gray-200 dark:border-gray-800",t.innerHTML=e.content,t.firstElementChild.setAttribute("buildy",blocks[e.type].title),preview.appendChild(t)}}),applyTailwindConfig(currentState.config))}applyTailwindConfig(savedConfig),document.addEventListener("DOMContentLoaded",()=>{const e=new Quill("#editor-area",{theme:"snow",formats:[],modules:{toolbar:false,keyboard:{bindings:{enter:{key:13,handler:function(){return!0}}}}}});function t(t){let n;currentElement=t,n=t.nodeType===Node.TEXT_NODE?t.textContent:t.innerHTML,e.setText(n),modalOverlay.classList.remove("hidden")}function n(){modalOverlay.classList.add("hidden")}function r(e){e&&e.nodeType!==Node.TEXT_NODE&&e.classList.remove("highlight-border")}function o(){document.querySelectorAll(".prose").forEach(function(e){e.addEventListener("click",function(n){currentElement=e,t(e.innerHTML)})})}!function(e){e.addEventListener("mouseover",function(t){const n=t.target;var r;n===e||n.nodeType===Node.TEXT_NODE&&!n.classList.contains("prose")||(r=n)&&r.nodeType!==Node.TEXT_NODE&&r.classList.add("highlight-border")}),e.addEventListener("mouseout",function(t){const n=t.target;n===e||n.nodeType===Node.TEXT_NODE&&!n.classList.contains("prose")||r(n)})}(previewContainer),previewContainer.addEventListener("click",function(e){const n=e.target;n!==previewContainer&&(n.nodeType!==Node.TEXT_NODE&&n.classList.contains("prose"),t(n),r(n))}),document.getElementById("save-edit").addEventListener("click",function(){if(currentElement){let t=e.getText().trim();currentElement.nodeType===Node.TEXT_NODE?currentElement.textContent=t:currentElement.innerHTML=t,console.log("Saved content:",currentElement.nodeType===Node.TEXT_NODE?currentElement.textContent:currentElement.innerHTML)}saveCurrentState(),n()}),e.clipboard.addMatcher(Node.ELEMENT_NODE,function(e,t){let n=e.textContent||e.innerText;return(new Delta).insert(n)}),document.getElementById("cancel-edit").addEventListener("click",function(){n()}),new MutationObserver(function(e){e.forEach(function(e){"childList"===e.type&&e.addedNodes.length>0&&o()})}).observe(previewContainer,{childList:!0,subtree:!0}),o(),window.addEventListener("message",function(e){"init"===e.data.type&&e.data.darkMode&&document.documentElement.classList.add("dark")}),"true"===localStorage.getItem("darkMode")&&document.documentElement.classList.add("dark"),loadSavedState();applyBodyClasses();});