{"id":378,"date":"2026-07-12T11:03:56","date_gmt":"2026-07-12T11:03:56","guid":{"rendered":"https:\/\/freewebtools.co.in\/?page_id=378"},"modified":"2026-08-05T16:40:45","modified_gmt":"2026-08-05T16:40:45","slug":"course-file-generator","status":"publish","type":"page","link":"https:\/\/freewebtools.co.in\/index.php\/course-file-generator\/","title":{"rendered":"Editor"},"content":{"rendered":"\n<style data-wp-block-html=\"css\">\n\/* ==========================================================================\n   PART 2 \u2014 SCOPED CSS ONLY (WordPress Safe & Fully Responsive)\n   ========================================================================== *\/\n\n#uue_app_root, #uue_app_root * {\n    box-sizing: border-box;\n}\n\n\/* Base Theme Variables & Root Container *\/\n#uue_app_root {\n    --uue-bg-main: #1e1e1e;\n    --uue-bg-surface: #252526;\n    --uue-bg-hover: #2a2d2e;\n    --uue-bg-active: #37373d;\n    --uue-border: #333333;\n    --uue-border-subtle: #2d2d2d;\n    --uue-text-primary: #d4d4d4;\n    --uue-text-secondary: #858585;\n    --uue-text-muted: #6a6a6a;\n    --uue-accent: #007acc;\n    --uue-accent-hover: #0098ff;\n    --uue-accent-text: #ffffff;\n    --uue-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);\n    --uue-radius: 8px;\n    --uue-font-mono: 'Consolas', 'Monaco', monospace;\n    --uue-font-sans: 'Segoe UI', system-ui, sans-serif;\n\n    width: 100%;\n    height: 80vh;\n    min-height: 500px;\n    display: flex;\n    flex-direction: column;\n    background: var(--uue-bg-main);\n    color: var(--uue-text-primary);\n    border-radius: var(--uue-radius);\n    border: 1px solid var(--uue-border);\n    overflow: hidden;\n    position: relative;\n    font-family: var(--uue-font-sans);\n    font-size: 13px;\n    box-shadow: var(--uue-shadow);\n}\n\n\/* Light Theme Overrides *\/\n#uue_app_root.uue_theme_light {\n    --uue-bg-main: #ffffff;\n    --uue-bg-surface: #f3f3f3;\n    --uue-bg-hover: #e5e5e6;\n    --uue-bg-active: #dcdcdc;\n    --uue-border: #e0e0e0;\n    --uue-border-subtle: #eaeaea;\n    --uue-text-primary: #333333;\n    --uue-text-secondary: #666666;\n    --uue-text-muted: #999999;\n    --uue-accent: #0066cc;\n    --uue-accent-hover: #0052a3;\n    --uue-accent-text: #ffffff;\n    --uue-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);\n}\n\n\/* Header & Navigation Bar *\/\n#uue_header {\n    height: 48px;\n    background: var(--uue-bg-surface);\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 0 16px;\n    border-bottom: 1px solid var(--uue-border);\n    gap: 12px;\n    flex-shrink: 0;\n}\n\n.uue_header_left, .uue_header_right {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.uue_brand {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding-left: 4px;\n}\n\n#uue_filename {\n    color: var(--uue-text-primary);\n    font-weight: 600;\n    font-size: 13px;\n    padding: 2px 6px;\n    border-radius: 4px;\n    outline: none;\n    border: 1px dashed transparent;\n    transition: all 0.2s ease;\n}\n\n#uue_filename:hover {\n    border-color: var(--uue-text-secondary);\n    background: var(--uue-bg-hover);\n}\n\n#uue_filename:focus {\n    border-color: var(--uue-accent);\n    background: var(--uue-bg-main);\n}\n\n.uue_status_badge {\n    font-size: 10px;\n    background: rgba(0, 122, 204, 0.15);\n    color: var(--uue-accent);\n    padding: 2px 6px;\n    border-radius: 10px;\n    font-weight: 500;\n}\n\n\/* Professional Toolbar *\/\n#uue_toolbar {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n    flex: 1;\n    overflow-x: auto;\n    padding: 0 8px;\n    scrollbar-width: none; \/* Firefox *\/\n}\n\n#uue_toolbar::-webkit-scrollbar {\n    display: none; \/* Chrome\/Safari *\/\n}\n\n.uue_toolbar_group {\n    display: flex;\n    align-items: center;\n    gap: 2px;\n}\n\n.uue_toolbar_divider {\n    width: 1px;\n    height: 20px;\n    background: var(--uue-border);\n    margin: 0 6px;\n}\n\n.uue_toolbar_btn, .uue_btn {\n    background: transparent;\n    border: 1px solid transparent;\n    color: var(--uue-text-secondary);\n    padding: 6px 10px;\n    cursor: pointer;\n    border-radius: 4px;\n    font-size: 12px;\n    font-family: inherit;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: all 0.15s ease;\n}\n\n.uue_toolbar_btn:hover, .uue_btn:hover {\n    background: var(--uue-bg-hover);\n    color: var(--uue-text-primary);\n}\n\n.uue_toolbar_btn:active, .uue_btn:active {\n    background: var(--uue-bg-active);\n}\n\n.uue_icon_btn {\n    padding: 6px;\n    border-radius: 6px;\n}\n\n.uue_select {\n    background: var(--uue-bg-main);\n    color: var(--uue-text-primary);\n    border: 1px solid var(--uue-border);\n    border-radius: 4px;\n    padding: 4px 8px;\n    font-size: 11px;\n    outline: none;\n    cursor: pointer;\n}\n\n.uue_select:hover {\n    border-color: var(--uue-text-secondary);\n}\n\n\/* Main Layout Area *\/\n#uue_main {\n    flex: 1;\n    display: flex;\n    overflow: hidden;\n    position: relative;\n}\n\n\/* Collapsible Sidebar *\/\n#uue_sidebar {\n    width: 240px;\n    background: var(--uue-bg-surface);\n    border-right: 1px solid var(--uue-border);\n    display: flex;\n    flex-direction: column;\n    color: var(--uue-text-secondary);\n    font-size: 12px;\n    flex-shrink: 0;\n    transition: width 0.2s ease, transform 0.2s ease;\n}\n\n#uue_sidebar.collapsed {\n    width: 0;\n    transform: translateX(-100%);\n}\n\n.uue_sidebar_header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 12px 16px;\n    font-weight: 600;\n    letter-spacing: 0.5px;\n    border-bottom: 1px solid var(--uue-border-subtle);\n}\n\n.uue_sidebar_action_btn {\n    background: none;\n    border: none;\n    color: var(--uue-text-secondary);\n    cursor: pointer;\n    font-size: 16px;\n    padding: 0 4px;\n    border-radius: 2px;\n}\n\n.uue_sidebar_action_btn:hover {\n    color: var(--uue-text-primary);\n    background: var(--uue-bg-hover);\n}\n\n.uue_sidebar_tabs {\n    display: flex;\n    border-bottom: 1px solid var(--uue-border-subtle);\n    background: var(--uue-bg-main);\n}\n\n.uue_sidebar_tab {\n    flex: 1;\n    background: none;\n    border: none;\n    color: var(--uue-text-secondary);\n    padding: 8px 4px;\n    font-size: 11px;\n    cursor: pointer;\n    text-align: center;\n    border-bottom: 2px solid transparent;\n}\n\n.uue_sidebar_tab.active {\n    color: var(--uue-text-primary);\n    border-bottom-color: var(--uue-accent);\n    font-weight: 500;\n}\n\n.uue_sidebar_content {\n    flex: 1;\n    overflow-y: auto;\n    padding: 8px;\n}\n\n.uue_tree_item {\n    padding: 6px 10px;\n    border-radius: 4px;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    color: var(--uue-text-primary);\n    margin-bottom: 2px;\n}\n\n.uue_tree_item:hover {\n    background: var(--uue-bg-hover);\n}\n\n.uue_tree_item.active {\n    background: var(--uue-bg-active);\n}\n\n\/* Editor Surface & Engine Styling *\/\n#uue_editor_surface {\n    flex: 1;\n    position: relative;\n    display: flex;\n    background: var(--uue-bg-main);\n    overflow: hidden;\n}\n\n#uue_gutter {\n    width: 56px;\n    background: var(--uue-bg-surface);\n    color: var(--uue-text-muted);\n    text-align: right;\n    padding: 12px 10px 12px 6px;\n    font-family: var(--uue-font-mono);\n    font-size: 13px;\n    user-select: none;\n    overflow: hidden;\n    line-height: 1.6;\n    flex-shrink: 0;\n    border-right: 1px solid var(--uue-border-subtle);\n}\n\n#uue_textarea {\n    flex: 1;\n    background: transparent;\n    color: var(--uue-text-primary);\n    border: none;\n    padding: 12px;\n    font-family: var(--uue-font-mono);\n    font-size: 13px;\n    resize: none;\n    outline: none;\n    white-space: pre;\n    overflow: auto;\n    line-height: 1.6;\n    tab-size: 4;\n}\n\n\/* Status Bar *\/\n#uue_status {\n    height: 28px;\n    background: var(--uue-accent);\n    color: var(--uue-accent-text);\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 0 16px;\n    font-size: 11px;\n    flex-shrink: 0;\n    font-weight: 500;\n}\n\n.uue_status_left, .uue_status_right {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n}\n\n.uue_status_separator {\n    opacity: 0.5;\n}\n\n\/* Modals & Overlays System *\/\n.uue_modal_overlay {\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background: rgba(0, 0, 0, 0.6);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 1000;\n    backdrop-filter: blur(2px);\n    animation: uueFadeIn 0.2s ease;\n}\n\n.uue_modal {\n    background: var(--uue-bg-surface);\n    border: 1px solid var(--uue-border);\n    border-radius: var(--uue-radius);\n    width: 400px;\n    max-width: 90%;\n    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.5);\n    overflow: hidden;\n    animation: uueScaleUp 0.2s cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.uue_modal_header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 14px 16px;\n    border-bottom: 1px solid var(--uue-border);\n}\n\n.uue_modal_header h3 {\n    margin: 0;\n    font-size: 14px;\n    font-weight: 600;\n    color: var(--uue-text-primary);\n}\n\n.uue_modal_close {\n    background: none;\n    border: none;\n    color: var(--uue-text-secondary);\n    font-size: 18px;\n    cursor: pointer;\n    padding: 0 4px;\n    border-radius: 4px;\n}\n\n.uue_modal_close:hover {\n    color: var(--uue-text-primary);\n    background: var(--uue-bg-hover);\n}\n\n.uue_modal_body {\n    padding: 16px;\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n}\n\n.uue_input_group input {\n    width: 100%;\n    background: var(--uue-bg-main);\n    border: 1px solid var(--uue-border);\n    color: var(--uue-text-primary);\n    padding: 8px 12px;\n    border-radius: 4px;\n    outline: none;\n    font-size: 12px;\n}\n\n.uue_input_group input:focus {\n    border-color: var(--uue-accent);\n}\n\n.uue_modal_actions {\n    display: flex;\n    justify-content: flex-end;\n    gap: 8px;\n    margin-top: 4px;\n}\n\n.uue_modal_actions .uue_btn {\n    background: var(--uue-accent);\n    color: var(--uue-accent-text);\n    padding: 6px 14px;\n    border-radius: 4px;\n}\n\n.uue_modal_actions .uue_btn:hover {\n    background: var(--uue-accent-hover);\n}\n\n\/* Command Palette Specific *\/\n#uue_command_palette {\n    width: 500px;\n    max-height: 350px;\n    display: flex;\n    flex-direction: column;\n}\n\n.uue_modal_search_box {\n    padding: 12px;\n    border-bottom: 1px solid var(--uue-border);\n}\n\n.uue_modal_search_box input {\n    width: 100%;\n    background: var(--uue-bg-main);\n    border: 1px solid var(--uue-border);\n    color: var(--uue-text-primary);\n    padding: 10px 14px;\n    border-radius: 6px;\n    font-size: 13px;\n    outline: none;\n}\n\n.uue_command_list {\n    max-height: 250px;\n    overflow-y: auto;\n    padding: 4px;\n}\n\n.uue_command_item {\n    padding: 8px 12px;\n    border-radius: 4px;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    color: var(--uue-text-primary);\n}\n\n.uue_command_item:hover, .uue_command_item.active {\n    background: var(--uue-accent);\n    color: var(--uue-accent-text);\n}\n\n\/* Settings & Export Rows *\/\n.uue_setting_row {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    font-size: 12px;\n    color: var(--uue-text-primary);\n    padding: 4px 0;\n}\n\n.uue_export_options {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n\n.uue_export_choice {\n    width: 100%;\n    text-align: left;\n    background: var(--uue-bg-main);\n    border: 1px solid var(--uue-border);\n    color: var(--uue-text-primary);\n    padding: 10px 14px;\n    border-radius: 4px;\n    justify-content: flex-start;\n}\n\n.uue_export_choice:hover {\n    background: var(--uue-bg-hover);\n    border-color: var(--uue-accent);\n}\n\n\/* Animations *\/\n@keyframes uueFadeIn {\n    from { opacity: 0; }\n    to { opacity: 1; }\n}\n\n@keyframes uueScaleUp {\n    from { transform: scale(0.95); opacity: 0; }\n    to { transform: scale(1); opacity: 1; }\n}\n\n\/* Responsive Media Queries *\/\n@media (max-width: 768px) {\n    #uue_sidebar {\n        position: absolute;\n        height: 100%;\n        z-index: 10;\n        box-shadow: 4px 0 16px rgba(0,0,0,0.3);\n    }\n    #uue_sidebar.collapsed {\n        transform: translateX(-100%);\n        width: 240px;\n    }\n    #uue_toolbar {\n        display: none;\n    }\n}\n<\/style>\n\n<script data-wp-block-html=\"js\">\n(function() {\n    const root = document.getElementById('uue_app_root');\n    const area = document.getElementById('uue_textarea');\n    const gutter = document.getElementById('uue_gutter');\n    const pos = document.getElementById('uue_cursor_data');\n    const selectionData = document.getElementById('uue_selection_data');\n    const stats = document.getElementById('uue_stats_data');\n    const filenameDisplay = document.getElementById('uue_filename');\n    const sidebar = document.getElementById('uue_sidebar');\n    const modalOverlay = document.getElementById('uue_modal_overlay');\n    const searchModal = document.getElementById('uue_search_modal');\n    const commandPalette = document.getElementById('uue_command_palette');\n    const settingsPanel = document.getElementById('uue_settings_panel');\n    const exportPanel = document.getElementById('uue_export_panel');\n\n    let currentFileName = localStorage.getItem('uue_filename') || 'untitled.txt';\n    let undoStack = [];\n    let redoStack = [];\n    let isInternalChange = false;\n\n    filenameDisplay.innerText = currentFileName;\n\n    const SyncEngine = {\n        update: (recordHistory = true) => {\n            const text = area.value;\n            const lines = text.split('\\n');\n            gutter.innerHTML = lines.map((_, i) => i + 1).join('<br>');\n            \n            const start = area.selectionStart;\n            const end = area.selectionEnd;\n            const sub = text.substring(0, start);\n            const ln = sub.split('\\n').length;\n            const col = sub.split('\\n').pop().length + 1;\n            const selLen = Math.abs(end - start);\n            \n            pos.innerText = `Ln ${ln}, Col ${col}`;\n            if (selectionData) {\n                selectionData.innerText = selLen > 0 ? `Sel ${selLen}` : '';\n            }\n\n            const wordCount = text.trim() ? text.trim().split(\/\\s+\/).length : 0;\n            const charCount = text.length;\n            const readTime = Math.ceil(wordCount \/ 200);\n            stats.innerText = `Words: ${wordCount} | Chars: ${charCount} | Reading time: ${readTime} min`;\n            \n            localStorage.setItem('uue_persistent_data', text);\n            localStorage.setItem('uue_filename', currentFileName);\n\n            if (recordHistory && !isInternalChange) {\n                if (undoStack.length === 0 || undoStack[undoStack.length - 1] !== text) {\n                    undoStack.push(text);\n                    if (undoStack.length > 100) undoStack.shift();\n                    redoStack = [];\n                }\n            }\n        }\n    };\n\n    \/\/ Reactive event listeners\n    ['input', 'keyup', 'click', 'select'].forEach(eventType => {\n        area.addEventListener(eventType, () => SyncEngine.update(eventType === 'input'));\n    });\n\n    area.addEventListener('scroll', () => { \n        gutter.scrollTop = area.scrollTop; \n    });\n    \n    area.addEventListener('keydown', (e) => {\n        if (e.key === 'Tab') {\n            e.preventDefault();\n            const start = area.selectionStart;\n            const end = area.selectionEnd;\n            area.value = area.value.substring(0, start) + '    ' + area.value.substring(end);\n            area.selectionStart = area.selectionEnd = start + 4;\n            SyncEngine.update();\n        }\n\n        \/\/ Keyboard Shortcuts\n        if (e.ctrlKey || e.metaKey) {\n            if (e.key === 's') {\n                e.preventDefault();\n                window.UUE_App.save();\n            } else if (e.key === 'z' && !e.shiftKey) {\n                e.preventDefault();\n                window.UUE_App.undo();\n            } else if (e.key === 'y' || (e.key === 'z' && e.shiftKey)) {\n                e.preventDefault();\n                window.UUE_App.redo();\n            } else if (e.key === 'f') {\n                e.preventDefault();\n                window.UUE_App.openModal('search');\n            } else if (e.key === 'k') {\n                e.preventDefault();\n                window.UUE_App.openModal('palette');\n            } else if (e.key === 'b') {\n                e.preventDefault();\n                window.UUE_App.toggleSidebar();\n            }\n        }\n    });\n\n    \/\/ Toolbar & Command bindings\n    document.querySelectorAll('[data-command]').forEach(btn => {\n        btn.addEventListener('click', (e) => {\n            const cmd = btn.getAttribute('data-command');\n            if (window.UUE_App[cmd]) {\n                window.UUE_App[cmd]();\n            } else if (['bold', 'italic', 'underline', 'strikethrough'].includes(cmd)) {\n                window.UUE_App.formatText(cmd);\n            }\n        });\n    });\n\n    \/\/ Theme Toggle\n    document.getElementById('uue_theme_toggle_btn').addEventListener('click', () => {\n        if (root.classList.contains('uue_theme_dark')) {\n            root.classList.replace('uue_theme_dark', 'uue_theme_light');\n            localStorage.setItem('uue_theme', 'uue_theme_light');\n        } else {\n            root.classList.replace('uue_theme_light', 'uue_theme_dark');\n            localStorage.setItem('uue_theme', 'uue_theme_dark');\n        }\n    });\n\n    \/\/ Settings Toggle\n    document.getElementById('uue_settings_btn').addEventListener('click', () => {\n        window.UUE_App.openModal('settings');\n    });\n\n    \/\/ Sidebar Toggle\n    document.getElementById('uue_sidebar_toggle_btn').addEventListener('click', () => {\n        window.UUE_App.toggleSidebar();\n    });\n\n    \/\/ Modal Close handlers\n    document.querySelectorAll('.uue_modal_close').forEach(closeBtn => {\n        closeBtn.addEventListener('click', () => {\n            window.UUE_App.closeAllModals();\n        });\n    });\n\n    modalOverlay.addEventListener('click', (e) => {\n        if (e.target === modalOverlay) {\n            window.UUE_App.closeAllModals();\n        }\n    });\n\n    \/\/ Export Choices\n    document.querySelectorAll('.uue_export_choice').forEach(choice => {\n        choice.addEventListener('click', () => {\n            const format = choice.getAttribute('data-format');\n            window.UUE_App.executeExport(format);\n        });\n    });\n\n    window.UUE_App = {\n        toggleSidebar: () => {\n            sidebar.classList.toggle('collapsed');\n        },\n        openModal: (type) => {\n            modalOverlay.style.display = 'flex';\n            searchModal.style.display = 'none';\n            commandPalette.style.display = 'none';\n            settingsPanel.style.display = 'none';\n            exportPanel.style.display = 'none';\n\n            if (type === 'search') {\n                searchModal.style.display = 'block';\n                document.getElementById('uue_find_input').focus();\n            } else if (type === 'palette') {\n                commandPalette.style.display = 'flex';\n                document.getElementById('uue_command_input').focus();\n            } else if (type === 'settings') {\n                settingsPanel.style.display = 'block';\n            } else if (type === 'export') {\n                exportPanel.style.display = 'block';\n            }\n        },\n        closeAllModals: () => {\n            modalOverlay.style.display = 'none';\n        },\n        newFile: () => { \n            if (confirm('Clear workspace? Unsaved changes will be lost.')) { \n                area.value = ''; \n                currentFileName = 'untitled.txt';\n                filenameDisplay.innerText = currentFileName;\n                undoStack = [];\n                redoStack = [];\n                SyncEngine.update(); \n            } \n        },\n        open: () => {\n            document.getElementById('uue_import_input').click();\n        },\n        save: () => { \n            localStorage.setItem('uue_persistent_data', area.value); \n            localStorage.setItem('uue_filename', currentFileName);\n            const badge = document.getElementById('uue_save_status');\n            if(badge) {\n                badge.innerText = 'Saved';\n                setTimeout(() => badge.innerText = '', 2000);\n            }\n        },\n        export: () => {\n            window.UUE_App.openModal('export');\n        },\n        executeExport: (format) => {\n            let mime = 'text\/plain';\n            let ext = 'txt';\n            let content = area.value;\n\n            if (format === 'md') {\n                ext = 'md';\n                mime = 'text\/markdown';\n            } else if (format === 'html') {\n                ext = 'html';\n                mime = 'text\/html';\n                content = `<!DOCTYPE html><html><head><title>${currentFileName}<\/title><\/head><body><pre>${content}<\/pre><\/body><\/html>`;\n            } else if (format === 'print') {\n                window.print();\n                window.UUE_App.closeAllModals();\n                return;\n            }\n\n            const blob = new Blob([content], { type: mime });\n            const a = document.createElement('a');\n            a.href = URL.createObjectURL(blob);\n            a.download = currentFileName.replace(\/\\.[^\/.]+$\/, \"\") + '.' + ext;\n            a.click();\n            URL.revokeObjectURL(a.href);\n            window.UUE_App.closeAllModals();\n        },\n        import: (e) => {\n            const file = e.target.files[0];\n            if (!file) return;\n            currentFileName = file.name;\n            filenameDisplay.innerText = currentFileName;\n            const reader = new FileReader();\n            reader.onload = (ev) => { \n                area.value = ev.target.result; \n                SyncEngine.update(); \n            };\n            reader.readAsText(file);\n            e.target.value = '';\n        },\n        undo: () => {\n            if (undoStack.length > 1) {\n                isInternalChange = true;\n                redoStack.push(undoStack.pop());\n                area.value = undoStack[undoStack.length - 1];\n                SyncEngine.update(false);\n                isInternalChange = false;\n            }\n        },\n        redo: () => {\n            if (redoStack.length > 0) {\n                isInternalChange = true;\n                const nextState = redoStack.pop();\n                undoStack.push(nextState);\n                area.value = nextState;\n                SyncEngine.update(false);\n                isInternalChange = false;\n            }\n        },\n        formatText: (type) => {\n            const start = area.selectionStart;\n            const end = area.selectionEnd;\n            const selected = area.value.substring(start, end);\n            let wrapper = '';\n            if (type === 'bold') wrapper = '**';\n            else if (type === 'italic') wrapper = '*';\n            else if (type === 'underline') wrapper = '__';\n            else if (type === 'strikethrough') wrapper = '~~';\n\n            const replacement = wrapper + selected + wrapper;\n            area.value = area.value.substring(0, start) + replacement + area.value.substring(end);\n            area.selectionStart = start + wrapper.length;\n            area.selectionEnd = end + wrapper.length;\n            area.focus();\n            SyncEngine.update();\n        }\n    };\n\n    \/\/ Initialize saved theme & storage\n    const savedTheme = localStorage.getItem('uue_theme');\n    if (savedTheme) {\n        root.classList.replace(root.classList.contains('uue_theme_light') ? 'uue_theme_light' : 'uue_theme_dark', savedTheme);\n    }\n    const savedName = localStorage.getItem('uue_filename');\n    if (savedName) {\n        currentFileName = savedName;\n        filenameDisplay.innerText = currentFileName;\n    }\n    const savedData = localStorage.getItem('uue_persistent_data');\n    if (savedData !== null) {\n        area.value = savedData;\n        SyncEngine.update();\n    } else {\n        SyncEngine.update();\n    }\n})();\n<\/script>\n\n<div id=\"uue_app_root\" class=\"uue_theme_dark\">\n<style>\n    \/* Scoped CSS Namespace *\/\n    #uue_app_root, #uue_app_root * { box-sizing: border-box; }\n    #uue_app_root { width: 100%; height: 80vh; min-height: 500px; display: flex; flex-direction: column; background: #1e1e1e; border-radius: 8px; border: 1px solid #333; overflow: hidden; position: relative; font-family: 'Segoe UI', system-ui, sans-serif; }\n    \n    #uue_header { height: 40px; background: #252526; display: flex; align-items: center; padding: 0 15px; border-bottom: 1px solid #333; gap: 5px; flex-shrink: 0; }\n    #uue_main { flex: 1; display: flex; overflow: hidden; position: relative; }\n    #uue_sidebar { width: 200px; background: #252526; border-right: 1px solid #333; display: flex; flex-direction: column; color: #858585; font-size: 11px; padding: 10px; flex-shrink: 0; }\n    #uue_editor_surface { flex: 1; position: relative; display: flex; background: #1e1e1e; overflow: hidden; }\n    \n    #uue_gutter { width: 50px; background: #252526; color: #858585; text-align: right; padding: 10px 8px 10px 5px; font-family: 'Consolas', 'Monaco', monospace; font-size: 14px; user-select: none; overflow: hidden; line-height: 1.5; flex-shrink: 0; }\n    #uue_textarea { flex: 1; background: transparent; color: #d4d4d4; border: none; padding: 10px; font-family: 'Consolas', 'Monaco', monospace; font-size: 14px; resize: none; outline: none; white-space: pre; overflow: auto; line-height: 1.5; tab-size: 4; }\n    \n    #uue_status { height: 25px; background: #007acc; color: white; display: flex; align-items: center; padding: 0 15px; font-size: 11px; justify-content: space-between; flex-shrink: 0; }\n    .uue_btn { background: #3c3c3c; border: none; color: white; padding: 4px 10px; cursor: pointer; border-radius: 2px; font-size: 12px; }\n    .uue_btn:hover { background: #505050; }\n<\/style>\n\n<div id=\"uue_header\">\n    <button class=\"uue_btn\" onclick=\"UUE_App.newFile()\">New<\/button>\n    <button class=\"uue_btn\" onclick=\"UUE_App.save()\">Save<\/button>\n    <button class=\"uue_btn\" onclick=\"UUE_App.export()\">Export<\/button>\n    <input type=\"file\" id=\"uue_import_input\" style=\"display:none\" onchange=\"UUE_App.import(event)\">\n    <button class=\"uue_btn\" onclick=\"document.getElementById('uue_import_input').click()\">Import<\/button>\n    <span id=\"uue_filename\" style=\"margin-left:15px; color:#ccc; font-size:12px;\">untitled.txt<\/span>\n<\/div>\n\n<div id=\"uue_main\">\n    <div id=\"uue_sidebar\">EXPLORER<\/div>\n    <div id=\"uue_editor_surface\">\n        <div id=\"uue_gutter\">1<\/div>\n        <textarea id=\"uue_textarea\" spellcheck=\"false\" wrap=\"off\"><\/textarea>\n    <\/div>\n<\/div>\n\n<div id=\"uue_status\">\n    <div id=\"uue_cursor_data\">Ln 1, Col 1<\/div>\n    <div id=\"uue_stats_data\">Words: 0 | UTF-8<\/div>\n<\/div>\n\n<script>\n(function() {\n    const area = document.getElementById('uue_textarea');\n    const gutter = document.getElementById('uue_gutter');\n    const pos = document.getElementById('uue_cursor_data');\n    const stats = document.getElementById('uue_stats_data');\n    const filenameDisplay = document.getElementById('uue_filename');\n\n    let currentFileName = 'untitled.txt';\n\n    const SyncEngine = {\n        update: () => {\n            const text = area.value;\n            const lines = text.split('\\n');\n            gutter.innerHTML = lines.map((_, i) => i + 1).join('<br>');\n            \n            const offset = area.selectionStart;\n            const sub = text.substring(0, offset);\n            const ln = sub.split('\\n').length;\n            const col = sub.split('\\n').pop().length + 1;\n            \n            pos.innerText = `Ln ${ln}, Col ${col}`;\n            stats.innerText = `Words: ${text.trim() ? text.trim().split(\/\\s+\/).length : 0} | UTF-8`;\n            \n            localStorage.setItem('uue_persistent_data', text);\n            localStorage.setItem('uue_filename', currentFileName);\n        }\n    };\n\n    \/\/ Events for reactive syncing\n    ['input', 'keyup', 'click', 'select'].forEach(eventType => {\n        area.addEventListener(eventType, SyncEngine.update);\n    });\n\n    area.addEventListener('scroll', () => { \n        gutter.scrollTop = area.scrollTop; \n    });\n    \n    area.addEventListener('keydown', (e) => {\n        if (e.key === 'Tab') {\n            e.preventDefault();\n            const start = area.selectionStart;\n            const end = area.selectionEnd;\n            area.value = area.value.substring(0, start) + '    ' + area.value.substring(end);\n            area.selectionStart = area.selectionEnd = start + 4;\n            SyncEngine.update();\n        }\n    });\n\n    window.UUE_App = {\n        newFile: () => { \n            if(confirm('Clear workspace? Unsaved changes will be lost.')) { \n                area.value = ''; \n                currentFileName = 'untitled.txt';\n                filenameDisplay.innerText = currentFileName;\n                SyncEngine.update(); \n            } \n        },\n        save: () => { \n            localStorage.setItem('uue_persistent_data', area.value); \n            localStorage.setItem('uue_filename', currentFileName);\n            alert('Saved successfully to local storage.'); \n        },\n        export: () => {\n            const blob = new Blob([area.value], {type: 'text\/plain'});\n            const a = document.createElement('a');\n            a.href = URL.createObjectURL(blob);\n            a.download = currentFileName;\n            a.click();\n            URL.revokeObjectURL(a.href);\n        },\n        import: (e) => {\n            const file = e.target.files[0];\n            if (!file) return;\n            currentFileName = file.name;\n            filenameDisplay.innerText = currentFileName;\n            const reader = new FileReader();\n            reader.onload = (ev) => { \n                area.value = ev.target.result; \n                SyncEngine.update(); \n            };\n            reader.readAsText(file);\n            e.target.value = ''; \/\/ Reset input to allow re-importing the same file if needed\n        }\n    };\n\n    \/\/ Initialize state\n    const saved = localStorage.getItem('uue_persistent_data');\n    const savedName = localStorage.getItem('uue_filename');\n    if (savedName) {\n        currentFileName = savedName;\n        filenameDisplay.innerText = currentFileName;\n    }\n    if (saved) { \n        area.value = saved; \n        SyncEngine.update(); \n    } else {\n        SyncEngine.update();\n    }\n})();\n<\/script>\n<\/div>\n\n\n\n<div id=\"pro-editor-container-unique\" style=\"width:100%; height:600px; background:#1e1e1e; color:#d4d4d4; border-radius:8px; display:flex; flex-direction:column; overflow:hidden; font-family:monospace;\">\n    <div style=\"padding:10px; background:#252526; border-bottom:1px solid #333; display:flex; gap:10px; align-items:center;\">\n        <span style=\"font-weight:bold; color:#007acc;\">Pro Editor<\/span>\n        <button onclick=\"document.getElementById('pro-editor-area-unique').value = ''\" style=\"background:#333; color:white; border:none; padding:5px 10px; cursor:pointer;\">Clear<\/button>\n        <span id=\"pro-status-unique\" style=\"font-size:12px; color:#858585;\">Ready<\/span>\n    <\/div>\n    <textarea id=\"pro-editor-area-unique\" style=\"flex:1; background:#1e1e1e; color:#d4d4d4; border:none; padding:15px; font-family:monospace; font-size:14px; outline:none; resize:none;\" placeholder=\"Paste code or write notes here...\"><\/textarea>\n    <div style=\"padding:5px 15px; background:#007acc; color:white; font-size:12px; display:flex; justify-content:space-between;\">\n        <span id=\"pro-stats-unique\">Lines: 1<\/span>\n        <span>UTF-8<\/span>\n    <\/div>\n<\/div>\n\n<script>\n(function() {\n    const area = document.getElementById('pro-editor-area-unique');\n    const status = document.getElementById('pro-stats-unique');\n    const statusText = document.getElementById('pro-status-unique');\n\n    area.addEventListener('input', function() {\n        const lines = area.value.split('\\n').length;\n        status.innerText = 'Lines: ' + lines;\n        localStorage.setItem('pro_editor_data', area.value);\n    });\n\n    area.addEventListener('keydown', function(e) {\n        if (e.key === 'Tab') {\n            e.preventDefault();\n            const start = this.selectionStart;\n            this.value = this.value.substring(0, start) + \"    \" + this.value.substring(this.selectionEnd);\n            this.selectionStart = this.selectionEnd = start + 4;\n        }\n        if (e.ctrlKey && e.key === 's') {\n            e.preventDefault();\n            statusText.innerText = 'Saved to browser cache';\n            setTimeout(() => statusText.innerText = 'Ready', 2000);\n        }\n    });\n\n    const saved = localStorage.getItem('pro_editor_data');\n    if (saved) area.value = saved;\n})();\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>New Save Export Import untitled.txt EXPLORER 1 Ln 1, Col 1 Words: 0 | UTF-8 Pro Editor Clear Ready Lines: 1 UTF-8<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-378","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/pages\/378","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/comments?post=378"}],"version-history":[{"count":21,"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/pages\/378\/revisions"}],"predecessor-version":[{"id":916,"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/pages\/378\/revisions\/916"}],"wp:attachment":[{"href":"https:\/\/freewebtools.co.in\/index.php\/wp-json\/wp\/v2\/media?parent=378"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}