💻 محرر الأكواد المتقدم

محرر أكواد احترافي مع معاينة مباشرة لـ HTML, CSS, JavaScript

المعاينة المباشرة
Console
تم الحفظ!
`; previewDoc.open(); previewDoc.write(code); previewDoc.close(); } function addConsoleLog(type, message) { const consoleDiv = document.getElementById('console'); const logDiv = document.createElement('div'); logDiv.className = `console-log console-${type}`; const timestamp = new Date().toLocaleTimeString(); logDiv.textContent = `[${timestamp}] ${message}`; consoleDiv.appendChild(logDiv); consoleDiv.scrollTop = consoleDiv.scrollHeight; } function clearConsole() { document.getElementById('console').innerHTML = ''; } function clearAll() { if (confirm('هل أنت متأكد من مسح جميع الأكواد؟')) { document.getElementById('htmlCode').value = ''; document.getElementById('cssCode').value = ''; document.getElementById('jsCode').value = ''; runCode(); showNotification('تم مسح جميع الأكواد'); } } function downloadCode() { const html = document.getElementById('htmlCode').value; const css = document.getElementById('cssCode').value; const js = document.getElementById('jsCode').value; const fullCode = ` My Project ${html} `; const blob = new Blob([fullCode], { type: 'text/html' }); const url = URL.createObjectURL(blob); const a = document.createElement('a'); a.href = url; a.download = 'project.html'; a.click(); URL.revokeObjectURL(url); showNotification('تم تحميل المشروع بنجاح!'); } function toggleFullscreen() { const container = document.querySelector('.editor-container'); if (!document.fullscreenElement) { container.requestFullscreen(); } else { document.exitFullscreen(); } } function debounce(func, wait) { let timeout; return function executedFunction(...args) { const later = () => { clearTimeout(timeout); func(...args); }; clearTimeout(timeout); timeout = setTimeout(later, wait); }; } function showNotification(message, type = 'success') { const notification = document.getElementById('notification'); const notificationText = document.getElementById('notificationText'); notification.className = `notification notification-${type}`; notificationText.textContent = message; notification.classList.add('show'); setTimeout(() => { notification.classList.remove('show'); }, 3000); }