\n \n \n \n

\n \n \n \n \n \n

\n \n

\n \n \n

\n \n \n \n \n \n Lines: 0 | \n Chars: 0\n \n

\n \n

🌐

ওয়েবসাইট লোড করুন...

\n \n \n

\n \n

\n Ready - ওয়েবসাইট লোড করার জন্য প্রস্তুত\n \n

\n\n \n\n`;\n }\n \n // Load sample site\n function loadSampleSite() {\n const sampleHTML = `\n\n\n \n \n 🎨 Sample Website - নমুনা ওয়েবসাইট\n \n\n\n

\n \n \n

🚀 Features

This sample website includes various HTML elements that you can edit and modify.

\n \n

💡 Interactive

Click buttons, fill forms, and see how changes affect the website in real-time.

\n \n

📱 Responsive

This website is fully responsive and works on all devices and screen sizes.

\n \n

📝 Interactive Form

\n Name / নাম:\n \n

\n \n

\n Email:\n \n

\n \n

\n Country / দেশ:\n \n

\n \n

\n Message / বার্তা:\n \n

\n \n \n

\n \n \n\n`;\n \n originalHTML = sampleHTML;\n currentURL = 'sample://website';\n \n const frame = document.getElementById('previewFrame');\n const loading = document.getElementById('loading');\n \n const blob = new Blob([sampleHTML], { type: 'text/html' });\n const blobURL = URL.createObjectURL(blob);\n \n frame.src = blobURL;\n frame.style.display = 'block';\n loading.style.display = 'none';\n \n document.getElementById('htmlEditor').value = sampleHTML;\n updateStats();\n generateElementTree();\n \n document.getElementById('statusText').textContent = '✅ Sample website loaded - নমুনা ওয়েবসাইট লোড';\n document.getElementById('lastModified').textContent = new Date().toLocaleString('bn-BD');\n }\n \n // Create new HTML\n function createNewHTML() {\n const newHTML = `\n\n\n \n \n New HTML Document\n \n\n\n

🆕 New HTML Document

This is a new HTML document that you can edit.

আপনি এই HTML ডকুমেন্টটি এডিট করতে পারেন।

\n \n

Getting Started

Edit the HTML in the editor panel
Click \"Apply Changes\" to see updates
Use \"Format\" to beautify your code
Download your work when done

\n \n \n\n`;\n \n originalHTML = newHTML;\n currentURL = 'new://document';\n \n const frame = document.getElementById('previewFrame');\n const loading = document.getElementById('loading');\n \n const blob = new Blob([newHTML], { type: 'text/html' });\n const blobURL = URL.createObjectURL(blob);\n \n frame.src = blobURL;\n frame.style.display = 'block';\n loading.style.display = 'none';\n \n document.getElementById('htmlEditor').value = newHTML;\n updateStats();\n generateElementTree();\n \n document.getElementById('statusText').textContent = '✅ New HTML created - নতুন HTML তৈরি';\n document.getElementById('lastModified').textContent = new Date().toLocaleString('bn-BD');\n }\n \n // Toggle editor visibility\n function toggleEditor() {\n const sidebar = document.getElementById('sidebar');\n const editorContainer = document.getElementById('editorContainer');\n const toggleBtn = document.getElementById('editorToggle');\n \n editorVisible = !editorVisible;\n \n if (editorVisible) {\n sidebar.style.display = 'flex';\n editorContainer.style.display = 'flex';\n toggleBtn.textContent = '👁️ Preview';\n toggleBtn.title = 'Switch to preview mode';\n } else {\n sidebar.style.display = 'none';\n editorContainer.style.display = 'none';\n toggleBtn.textContent = '✏️ এডিটর';\n toggleBtn.title = 'Switch to editor mode';\n }\n }\n \n // Apply HTML changes\n function applyChanges() {\n const editor = document.getElementById('htmlEditor');\n const frame = document.getElementById('previewFrame');\n const statusText = document.getElementById('statusText');\n \n try {\n const modifiedHTML = editor.value;\n const blob = new Blob([modifiedHTML], { type: 'text/html' });\n const blobURL = URL.createObjectURL(blob);\n \n frame.src = blobURL;\n generateElementTree();\n \n statusText.textContent = 'Changes applied - পরিবর্তন প্রয়োগ করা হয়েছে';\n document.getElementById('lastModified').textContent = new Date().toLocaleString('bn-BD');\n } catch (error) {\n alert('HTML এ ত্রুটি আছে! অনুগ্রহ করে চেক করুন।');\n console.error('Error applying changes:', error);\n }\n }\n \n // Reset to original HTML\n function resetHTML() {\n if (confirm('আপনি কি নিশ্চিত যে আসল HTML এ ফিরে যেতে চান?')) {\n document.getElementById('htmlEditor').value = originalHTML;\n applyChanges();\n updateStats();\n }\n }\n \n // Download modified HTML\n function downloadHTML() {\n const editor = document.getElementById('htmlEditor');\n const blob = new Blob([editor.value], { type: 'text/html' });\n const url = URL.createObjectURL(blob);\n \n const a = document.createElement('a');\n a.href = url;\n a.download = 'modified-website.html';\n document.body.appendChild(a);\n a.click();\n document.body.removeChild(a);\n URL.revokeObjectURL(url);\n }\n \n // Beautify HTML\n function beautifyHTML() {\n const editor = document.getElementById('htmlEditor');\n let html = editor.value;\n \n // Simple HTML beautification\n html = html.replace(/>\\n<');\n html = html.replace(/\\n\\s*\\n/g, '\\n');\n \n const lines = html.split('\\n');\n let indentLevel = 0;\n const indentSize = 2;\n \n const beautified = lines.map(line => {\n const trimmed = line.trim();\n if (!trimmed) return '';\n \n if (trimmed.startsWith('')) {\n indentLevel++;\n }\n \n return indented;\n }).join('\\n');\n \n editor.value = beautified;\n updateStats();\n }\n \n // Update editor statistics\n function updateStats() {\n const editor = document.getElementById('htmlEditor');\n const content = editor.value;\n \n document.getElementById('lineCount').textContent = content.split('\\n').length;\n document.getElementById('charCount').textContent = content.length;\n }\n \n // Generate HTML element tree\n function generateElementTree() {\n const treeContainer = document.getElementById('elementTree');\n const editor = document.getElementById('htmlEditor');\n \n try {\n const parser = new DOMParser();\n const doc = parser.parseFromString(editor.value, 'text/html');\n \n treeContainer.innerHTML = '';\n generateTreeNode(doc.documentElement, treeContainer, 0);\n } catch (error) {\n treeContainer.innerHTML = '

HTML parsing error

';\n }\n }\n \n // Generate tree node recursively\n function generateTreeNode(element, container, depth) {\n if (element.nodeType === Node.ELEMENT_NODE) {\n const div = document.createElement('div');\n div.className = 'tree-item tag';\n div.style.marginLeft = (depth * 15) + 'px';\n div.textContent = `<${element.tagName.toLowerCase()}>`;\n div.onclick = () => selectElement(div, element);\n container.appendChild(div);\n \n // Add attributes\n for (let attr of element.attributes) {\n const attrDiv = document.createElement('div');\n attrDiv.className = 'tree-item attribute';\n attrDiv.style.marginLeft = ((depth + 1) * 15) + 'px';\n attrDiv.textContent = `${attr.name}=\"${attr.value}\"`;\n container.appendChild(attrDiv);\n }\n \n // Add child nodes\n for (let child of element.childNodes) {\n if (child.nodeType === Node.TEXT_NODE && child.textContent.trim()) {\n const textDiv = document.createElement('div');\n textDiv.className = 'tree-item text';\n textDiv.style.marginLeft = ((depth + 1) * 15) + 'px';\n textDiv.textContent = `\"${child.textContent.trim().substring(0, 30)}...\"`;\n container.appendChild(textDiv);\n } else if (child.nodeType === Node.ELEMENT_NODE) {\n generateTreeNode(child, container, depth + 1);\n }\n }\n }\n }\n \n // Select element in tree\n function selectElement(div, element) {\n // Remove previous selection\n document.querySelectorAll('.tree-item.selected').forEach(item => {\n item.classList.remove('selected');\n });\n \n // Add selection to current item\n div.classList.add('selected');\n \n // Highlight in editor (basic implementation)\n const editor = document.getElementById('htmlEditor');\n const tagName = element.tagName.toLowerCase();\n const content = editor.value;\n const regex = new RegExp(`<${tagName}[^>]*>`, 'i');\n const match = content.match(regex);\n \n if (match) {\n const start = content.indexOf(match[0]);\n editor.focus();\n editor.setSelectionRange(start, start + match[0].length);\n }\n }\n \n // Keyboard shortcuts\n document.addEventListener('keydown', function(e) {\n if (e.ctrlKey || e.metaKey) {\n switch(e.key) {\n case 's':\n e.preventDefault();\n downloadHTML();\n break;\n case 'Enter':\n e.preventDefault();\n applyChanges();\n break;\n case 'e':\n e.preventDefault();\n toggleEditor();\n break;\n }\n }\n });\n \n // Auto-load sample on page load\n window.addEventListener('load', function() {\n setTimeout(() => {\n loadSampleSite();\n }, 1000);\n });\n \n\n`;\n\n return new Response(html, {\n headers: {\n 'Content-Type': 'text/html; charset=utf-8',\n },\n });\n}","deleted","label",[98],"permalink","https://www.val.town/x/Cfvvvvv/untitled-2292/code/browser.ts","extension","actionData","errors"]