Postu göstər

Prohack

29 may 2026 23:00

Redaktə edilib

Salam dostlar,
Tamamilə yerli resurslarla, kənar ağır kitabxanalara (frameworks) ehtiyac duymadan işləyən, təmiz PHP, HTML5, CSS3 və Native JavaScript arxitekturasına sahib yeni layihəmi təqdim edirəm: Ultimate Studio v6.2.0.
Bu layihə xüsusilə veb proqramçılar və interfeys dizaynerləri üçün daxili skript mühərriki vasitəsilə komponentləri anlıq olaraq test etmək, virtual fayl sistemini idarə etmək və sürətli prototiplər çıxarmaq üçün nəzərdə tutulub.
🚀 Əsas Özəllikləri:Dinamik Virtual Fayl Sistemi: Brauzer yaddaşını və PHP sessiyalarını sinxronizasiya edərək daxili

.html

və

.css

faylları yarada, adlandıra və aralarında keçid edə bilərsiniz.
1000+ Matris Element Generatoru: Düymələr, glassmorphic effektlər, laser sliderlər, quantum progress barlar, kartlar və hazır form modulları.
Çoxşaxəli Enjeksiya Sistemi: Komponentləri kod redaktoruna həm klikləyərək, həm də Drag & Drop (sürüklə-burax) funksiyası ilə anında daxil etmək imkanı.
Avtomatik Mobil Görünüş Emulyatoru: Yazdığınız dizaynın mobil cihazlardakı (Viewport) və masaüstü ekranlardakı vəziyyətini tək kliklə real-vaxtda monitorinq etmə paneli.
Native Eksport Mexanizmi: Hazırladığınız kod strukturlarını anında lokal fayl kimi sisteminizə yükləmə dəstəyi.
Sıfır Dependencies: Tamamilə təmiz kod. Heç bir kənar API və ya xarici paketdən asılı deyil.
🛠️ Quraşdırılma:Kodu sadəcə yerli serverinizdə (XAMPP, WampServer və s.)

index.php

olaraq qeyd edin və brauzerdə işə salın. Heç bir əlavə konfiqurasiya tələb olunmur.
💻 Layihə Kodları:

<?php
error_reporting(0);
session_start();
$prohackEnv = [
    "engine_name" => "Prohack Ultimate Studio",
    "version" => "6.2.0-PRO",
    "token" => md5(session_id())
];
?>
<!DOCTYPE html>
<html lang="az">
<head>
    <meta charset="UTF-8">
    <title><?php echo $prohackEnv['engine_name']; ?></title>
    <style>
        :root {
            --prohack-bg-base: #010409;
            --prohack-bg-side: #0b0f17;
            --prohack-bg-top: #0e1420;
            --prohack-border: #1b2436;
            --prohack-accent: #0ea5e9;
            --prohack-accent-hover: #38bdf8;
            --prohack-danger: #ef4444;
            --prohack-text: #f8fafc;
        }
        body {
            margin: 0; padding: 0;
            font-family: 'Consolas', 'Segoe UI', monospace;
            background: var(--prohack-bg-base);
            color: var(--prohack-text);
            height: 100vh;
            display: flex;
            flex-direction: column;
            overflow: hidden;
            user-select: none;
        }
        .prohack-app-header {
            background: var(--prohack-bg-top);
            padding: 8px 16px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            border-bottom: 1px solid var(--prohack-border);
            height: 35px;
        }
        .prohack-identity { display: flex; align-items: center; gap: 10px; }
        .prohack-ico { width: 22px; height: 22px; background: #2563eb; border-radius: 4px; display: flex; align-items: center; justify-content: center; font-weight: bold; font-size: 13px; color: #fff; box-shadow: 0 0 10px var(--prohack-accent); }
        .prohack-title-string { font-size: 12px; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; color: #94a3b8; }
        .prohack-layout-body {
            display: flex;
            flex: 1;
            height: calc(100vh - 71px);
        }
        .prohack-sidebar-panel {
            width: 340px;
            background: var(--prohack-bg-side);
            border-right: 1px solid var(--prohack-border);
            display: flex;
            flex-direction: column;
        }
        .prohack-archive-section {
            padding: 12px;
            border-bottom: 1px solid var(--prohack-border);
            background: #05080e;
        }
        .prohack-section-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 11px;
            font-weight: bold;
            color: #64748b;
            text-transform: uppercase;
            margin-bottom: 8px;
        }
        .prohack-file-tree {
            display: flex;
            flex-direction: column;
            gap: 4px;
            max-height: 120px;
            overflow-y: auto;
        }
        .prohack-tree-node {
            padding: 7px 10px;
            background: #0c111c;
            border: 1px solid var(--prohack-border);
            border-radius: 4px;
            font-size: 12px;
            cursor: pointer;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .prohack-tree-node.prohack-node-active {
            border-color: var(--prohack-accent);
            color: var(--prohack-accent);
            background: #0f1a2e;
        }
        .prohack-btn-small {
            background: #1e293b;
            border: none;
            color: #fff;
            padding: 2px 6px;
            border-radius: 4px;
            cursor: pointer;
            font-size: 12px;
        }
        .prohack-btn-small:hover { background: var(--prohack-accent); }
        .prohack-tabs-container {
            display: flex;
            flex-wrap: wrap;
            background: #03060a;
            border-bottom: 1px solid var(--prohack-border);
        }
        .prohack-tab-item {
            flex: 1;
            min-width: 80px;
            padding: 10px 2px;
            background: transparent;
            border: none;
            color: #475569;
            font-size: 10px;
            font-weight: bold;
            cursor: pointer;
            text-transform: uppercase;
            text-align: center;
        }
        .prohack-tab-item.prohack-tab-active {
            color: var(--prohack-accent);
            background: var(--prohack-bg-side);
            border-bottom: 2px solid var(--prohack-accent);
        }
        .prohack-search-container { padding: 8px 12px; background: #060910; }
        .prohack-search-container input {
            width: 100%; padding: 6px 10px;
            background: #010204; border: 1px solid var(--prohack-border);
            border-radius: 4px; color: #fff; font-size: 12px; outline: none; box-sizing: border-box;
        }
        .prohack-scroller-panel { flex: 1; overflow-y: auto; padding: 10px; }
        
        .prohack-asset-card {
            background: #0e1422; border: 1px solid var(--prohack-border);
            padding: 10px; border-radius: 4px; margin-bottom: 6px;
            cursor: grab; font-size: 12px; display: flex;
            justify-content: space-between; align-items: center;
        }
        .prohack-asset-card:hover { border-color: var(--prohack-accent); color: var(--prohack-accent); background: #131c2f; }
        .prohack-asset-badge { font-size: 8px; background: #010204; padding: 2px 5px; border-radius: 3px; color: #64748b; font-weight: bold; }
        .prohack-workspace-center { flex: 1; display: flex; flex-direction: column; background: var(--prohack-bg-base); border-right: 1px solid var(--prohack-border); }
        .prohack-editor-header {
            background: #060910; padding: 6px 15px; font-size: 11px;
            color: #64748b; display: flex; justify-content: space-between; align-items: center;
            border-bottom: 1px solid var(--prohack-border); height: 24px;
        }
        .prohack-control-btn {
            background: #1e293b; border: 1px solid var(--prohack-border);
            color: #94a3b8; padding: 3px 10px; border-radius: 4px; cursor: pointer; font-size: 11px; font-weight: bold;
            margin-left: 4px;
        }
        .prohack-control-btn:hover { color: #fff; border-color: var(--prohack-accent); }
        .prohack-textarea-container { flex: 1; display: flex; }
        textarea.prohack-editor-area {
            flex: 1; background: #010205; border: none;
            color: #34d399; font-family: 'Consolas', monospace; font-size: 13px;
            padding: 15px; resize: none; outline: none; line-height: 1.6; box-sizing: border-box;
        }
        .prohack-preview-container { flex: 1; display: flex; flex-direction: column; background: #0b0f19; position: relative; }
        .prohack-preview-header {
            background: #060910; padding: 6px 15px; font-size: 11px;
            color: #64748b; border-bottom: 1px solid var(--prohack-border); height: 24px;
            display: flex; justify-content: space-between; align-items: center;
        }
        .prohack-preview-body {
            flex: 1; display: flex; justify-content: center; align-items: center; overflow: auto; background: #111625; padding: 10px;
        }
        iframe.prohack-monitor { 
            width: 100%; height: 100%; border: none; background: #fff;
            transition: width 0.3s ease, height 0.3s ease, border-radius 0.3s ease;
        }
        iframe.prohack-monitor.prohack-mode-mobile {
            width: 375px; height: 667px; border: 12px solid #000; border-radius: 24px; box-shadow: 0 20px 50px rgba(0,0,0,0.6);
        }
        .prohack-drop-glow { background: #051224 !important; }
        .prohack-app-footer {
            background: #060910; padding: 4px 16px; font-size: 11px; color: #475569;
            display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--prohack-border); height: 18px;
        }
    </style>
</head>
<body>
    <header class="prohack-app-header">
        <div class="prohack-identity">
            <div class="prohack-ico">P</div>
            <div class="prohack-title-string">Prohack IDE Engine</div>
        </div>
        <div style="font-size: 11px; color: #334155;">Token Alpha: <?php echo $prohackEnv['token']; ?></div>
    </header>
    <div class="prohack-layout-body">
        
        <div class="prohack-sidebar-panel">
            <div class="prohack-archive-section">
                <div class="prohack-section-header">
                    <span>Layihə Faylları</span>
                    <button class="prohack-btn-small" onclick="prohackCreateFile()">+</button>
                </div>
                <div class="prohack-file-tree" id="prohackFilesWrapper"></div>
            </div>
            <div class="prohack-tabs-container">
                <button class="prohack-tab-item prohack-tab-active" id="phtab-buttons" onclick="prohackSwitchTab('buttons')">Düymə</button>
                <button class="prohack-tab-item" id="phtab-fx" onclick="prohackSwitchTab('fx')">FX</button>
                <button class="prohack-tab-item" id="phtab-sliders" onclick="prohackSwitchTab('sliders')">Slider</button>
                <button class="prohack-tab-item" id="phtab-loaders" onclick="prohackSwitchTab('loaders')">Loader</button>
                <button class="prohack-tab-item" id="phtab-cards" onclick="prohackSwitchTab('cards')">Kartlar</button>
                <button class="prohack-tab-item" id="phtab-forms" onclick="prohackSwitchTab('forms')">Formlar</button>
            </div>
            
            <div class="prohack-search-container">
                <input type="text" id="prohackSearchInput" placeholder="Axtarış..." oninput="prohackFilterAssets()">
            </div>
            
            <div class="prohack-scroller-panel" id="prohackListContainer"></div>
        </div>
        <div class="prohack-workspace-center">
            <div class="prohack-editor-header">
                <span id="prohackCurrentFileLabel">index.html</span>
                <div>
                    <button class="prohack-control-btn" onclick="prohackInsertBaseTemplate()" style="color:#34d399;">+ Şablon Yüklə</button>
                    <button class="prohack-control-btn" onclick="prohackClearEditor()" style="color:var(--prohack-danger);">Təmizlə</button>
                    <button class="prohack-control-btn" onclick="prohackDownloadActiveFile()">Eksport Et</button>
                </div>
            </div>
            <div class="prohack-textarea-container">
                <textarea id="prohackCodeEditor" class="prohack-editor-area" placeholder="Kodu bura daxil edin, komponentlərin üzərinə klikləyin və ya sürükləyin..."></textarea>
            </div>
        </div>
        <div class="prohack-preview-container">
            <div class="prohack-preview-header">
                <span id="prohackAddressBar" style="color:var(--prohack-accent); font-weight:bold;">index.html</span>
                <div>
                    <button class="prohack-control-btn" id="prohackViewToggleBtn" onclick="prohackToggleView()">Cihaz: Masaüstü</button>
                </div>
            </div>
            <div class="prohack-preview-body">
                <iframe id="prohackLiveFrame" class="prohack-monitor"></iframe>
            </div>
        </div>
    </div>
    <footer class="prohack-app-footer">
        <div>Sistem: Aktiv [PHP Session Managed]</div>
        <div id="prohackTracker">Son Əməliyyat: index.html</div>
    </footer>
    <script>
        let prohackVirtualSystem = {
            "index.html": `<div class="prohack-navbar">\n  <a href="index.html" class="active">Ana Səhifə</a>\n  <a href="product.html">Məhsullar</a>\n</div>\n\n<div class="prohack-hero">\n  <h1> Prohack Engine v1</h1>\n  <p>Sistem bərpa olundu və bütün funksiyalar artırıldı. Komponentlərə klikləyərək dərhal əlavə edə bilərsiniz.</p>\n</div>`,
            "product.html": `<div class="prohack-navbar">\n  <a href="index.html">Ana Səhifə</a>\n  <a href="product.html" class="active">Məhsullar</a>\n</div>\n\n<div class="prohack-hero">\n  <h1>Məhsullar Bölməsi</h1>\n  <p>Prohack modulları ilə təchiz olunmuş kataloq.</p>\n</div>`,
            "style.css": `body {\n  background: #030712;\n  color: #f3f4f6;\n  font-family: 'Segoe UI', sans-serif;\n  padding: 20px;\n  margin:0;\n}\n.prohack-navbar {\n  display: flex;\n  gap: 15px;\n  background: #0f172a;\n  padding: 12px;\n  border-radius: 8px;\n  margin-bottom: 25px;\n  border: 1px solid #1e293b;\n}\n.prohack-navbar a {\n  color: #94a3b8;\n  text-decoration: none;\n  font-weight: 600;\n}\n.prohack-navbar a.active {\n  color: #0ea5e9;\n}\n.prohack-hero {\n  background: #0f172a;\n  padding: 40px;\n  border-radius: 12px;\n  text-align: center;\n  border: 1px solid #1e293b;\n}`
        };
        let prohackCurrentFile = "index.html";
        let prohackPreviewTarget = "index.html";
        let prohackCurrentCategory = "buttons";
        let prohackMobileMode = false;
        const prohackEditorInstance = document.getElementById('prohackCodeEditor');
        const prohackMonitorFrame = document.getElementById('prohackLiveFrame');
        const prohackLibrary = {
            buttons: [],
            fx: [],
            sliders: [],
            loaders: [],
            cards: [],
            forms: []
        };
        const prohackColorMatrix = [
            { color: "#0ea5e9", dark: "#0c4a6e", rgb: "14, 165, 233" },
            { color: "#a855f7", dark: "#581c87", rgb: "168, 85, 247" },
            { color: "#10b981", dark: "#064e3b", rgb: "16, 185, 129" },
            { color: "#f43f5e", dark: "#881337", rgb: "244, 63, 94" }
        ];
        // 1000+ Genişləndirilmiş Komponent Generator Arxitekturası
        for(let i = 1; i <= 200; i++) {
            let col = prohackColorMatrix[i % prohackColorMatrix.length];
            prohackLibrary.buttons.push({
                name: `🔥 Neon Button Block ${i}`,
                tag: "PH-BTN",
                code: `<button class="ph-btn-${i}">Action ${i}</button>\n<style>\n.ph-btn-${i} {\n  background: #000;\n  color: ${col.color};\n  border: 2px solid ${col.color};\n  padding: 12px 24px;\n  border-radius: ${i % 8}px;\n  font-weight: bold;\n  cursor: pointer;\n  box-shadow: 0 0 ${i % 15}px rgba(${col.rgb}, 0.5);\n}\n.ph-btn-${i}:hover {\n  background: ${col.color};\n  color: #000;\n}\n</style>\n`
            });
        }
        for(let i = 1; i <= 200; i++) {
            let col = prohackColorMatrix[i % prohackColorMatrix.length];
            prohackLibrary.fx.push({
                name: `💎 Glassmorphic Card ${i}`,
                tag: "PH-FX",
                code: `<div class="ph-fx-${i}"><h3>Module Node ${i}</h3><p>Dinamik kaskad emulyasiyası.</p></div>\n<style>\n.ph-fx-${i} {\n  padding: 20px;\n  background: rgba(255, 255, 255, 0.02);\n  backdrop-filter: blur(10px);\n  border: 1px solid rgba(${col.rgb}, 0.15);\n  border-top: 3px solid ${col.color};\n  border-radius: 8px;\n  margin: 10px 0;\n}\n</style>\n`
            });
        }
        for(let i = 1; i <= 200; i++) {
            let col = prohackColorMatrix[i % prohackColorMatrix.length];
            prohackLibrary.sliders.push({
                name: `🎯 Laser Range Control ${i}`,
                tag: "PH-SLD",
                code: `<input type="range" class="ph-sld-${i}" min="1" max="100" value="${30 + (i % 50)}">\n<style>\n.ph-sld-${i} {\n  -webkit-appearance: none;\n  width: 100%;\n  max-width: 250px;\n  background: #1e293b;\n  height: ${4 + (i % 4)}px;\n  border-radius: 4px;\n}\n.ph-sld-${i}::-webkit-slider-thumb {\n  -webkit-appearance: none;\n  width: 16px;\n  height: 16px;\n  background: ${col.color};\n  border-radius: 50%;\n  box-shadow: 0 0 8px ${col.color};\n  cursor: pointer;\n}\n</style>\n`
            });
        }
        for(let i = 1; i <= 200; i++) {
            let col = prohackColorMatrix[i % prohackColorMatrix.length];
            prohackLibrary.loaders.push({
                name: `⌛ Quantum Progress ${i}`,
                tag: "PH-LDR",
                code: `<div class="ph-ldr-${i}"></div>\n<style>\n.ph-ldr-${i} {\n  width: ${24 + (i % 16)}px;\n  height: ${24 + (i % 16)}px;\n  border: 3px solid rgba(${col.rgb}, 0.1);\n  border-top-color: ${col.color};\n  border-radius: 50%;\n  animation: ph-rot-${i} ${0.5 + (i % 4) * 0.1}s linear infinite;\n}\n@keyframes ph-rot-${i} {\n  to { transform: rotate(360deg); }\n}\n</style>\n`
            });
        }
        for(let i = 1; i <= 100; i++) {
            let col = prohackColorMatrix[i % prohackColorMatrix.length];
            prohackLibrary.cards.push({
                name: `📦 Product Showcase Card ${i}`,
                tag: "PH-CRD",
                code: `<div class="ph-crd-${i}">\n  <div class="img-sim">${i}</div>\n  <h4>Card Element ${i}</h4>\n  <button>İncələ</button>\n</div>\n<style>\n.ph-crd-${i} {\n  background: #0f172a;\n  border: 1px solid var(--prohack-border);\n  padding: 15px;\n  border-radius: 8px;\n  width: 220px;\n  display: inline-block;\n  margin: 10px;\n}\n.ph-crd-${i} .img-sim { height: 100px; background: ${col.dark}; border-radius: 4px; display: flex; align-items: center; justify-content: center; color: ${col.color}; }\n.ph-crd-${i} button { width:100%; margin-top:10px; background:${col.color}; border:none; padding:6px; color:#000; font-weight:bold; border-radius:4px; }\n</style>\n`
            });
        }
        for(let i = 1; i <= 100; i++) {
            let col = prohackColorMatrix[i % prohackColorMatrix.length];
            prohackLibrary.forms.push({
                name: `🎛️ Input Form Layer ${i}`,
                tag: "PH-FRM",
                code: `<div class="ph-frm-${i}">\n  <label>Data Field ${i}</label>\n  <input type="text" placeholder="Daxil edin...">\n</div>\n<style>\n.ph-frm-${i} {\n  margin: 15px 0;\n}\n.ph-frm-${i} label { display:block; font-size:12px; margin-bottom:5px; color:${col.color}; }\n.ph-frm-${i} input { width:100%; max-width:300px; padding:8px; background:#0f172a; border:1px solid #1e293b; color:#fff; border-radius:4px; }\n.ph-frm-${i} input:focus { border-color:${col.color}; outline:none; }\n</style>\n`
            });
        }
        function prohackUpdateFilesUI() {
            const wrapper = document.getElementById('prohackFilesWrapper');
            wrapper.innerHTML = "";
            for(let fName in prohackVirtualSystem) {
                const item = document.createElement('div');
                item.className = `prohack-tree-node ${fName === prohackCurrentFile ? 'prohack-node-active' : ''}`;
                item.innerHTML = `<span>📄 ${fName}</span>`;
                item.addEventListener('click', () => prohackSwitchFile(fName));
                wrapper.appendChild(item);
            }
        }
        function prohackCreateFile() {
            const name = prompt("Yeni faylın adını təyin edin (məs: core.html):");
            if(name && name.trim() !== "") {
                const cleanName = name.trim();
                if(!prohackVirtualSystem[cleanName]) {
                    prohackVirtualSystem[cleanName] = "";
                    document.getElementById('prohackTracker').innerText = `Son Əgəliyyat: ${cleanName} yaradıldı`;
                    prohackUpdateFilesUI();
                    prohackSwitchFile(cleanName);
                }
            }
        }
        function prohackSwitchFile(fileName) {
            prohackVirtualSystem[prohackCurrentFile] = prohackEditorInstance.value;
            prohackCurrentFile = fileName;
            document.getElementById('prohackCurrentFileLabel').innerText = fileName;
            prohackEditorInstance.value = prohackVirtualSystem[fileName];
            prohackUpdateFilesUI();
            if(fileName.endsWith('.html')) {
                prohackPreviewTarget = fileName;
            }
            prohackSyncEngine();
        }
        function prohackSwitchTab(catName) {
            prohackCurrentCategory = catName;
            document.querySelectorAll('.prohack-tab-item').forEach(t => t.classList.remove('prohack-tab-active'));
            document.getElementById(`phtab-${catName}`).classList.add('prohack-tab-active');
            prohackRenderSidebar();
        }
        function prohackRenderSidebar() {
            const container = document.getElementById('prohackListContainer');
            container.innerHTML = "";
            const items = prohackLibrary[prohackCurrentCategory];
            items.forEach(item => {
                const node = document.createElement('div');
                node.className = 'prohack-asset-card';
                node.setAttribute('draggable', 'true');
                node.innerHTML = `<span>${item.name}</span> <span class="prohack-asset-badge">${item.tag}</span>`;
                
                node.addEventListener('dragstart', (e) => {
                    e.dataTransfer.setData('text/plain', item.code);
                });
                node.addEventListener('click', () => {
                    prohackInjectCodeAtCursor(item.code);
                });
                container.appendChild(node);
            });
        }
        function prohackInjectCodeAtCursor(codeToInject) {
            const start = prohackEditorInstance.selectionStart;
            const end = prohackEditorInstance.selectionEnd;
            const text = prohackEditorInstance.value;
            prohackEditorInstance.value = text.substring(0, start) + codeToInject + text.substring(end);
            prohackSyncEngine();
        }
        function prohackClearEditor() {
            if(confirm("Redaktoru tam təmizləmək istəyirsiniz?")) {
                prohackEditorInstance.value = "";
                prohackSyncEngine();
            }
        }
        function prohackInsertBaseTemplate() {
            const template = `<!DOCTYPE html>\n<html lang="az">\n<head>\n  <meta charset="UTF-8">\n  <title>Prohack Build</title>\n</head>\n<body>\n\n  <!-- Kodları bura daxil edin -->\n\n</body>\n</html>`;
            prohackInjectCodeAtCursor(template);
        }
        function prohackToggleView() {
            const btn = document.getElementById('prohackViewToggleBtn');
            prohackMobileMode = !prohackMobileMode;
            if(prohackMobileMode) {
                prohackMonitorFrame.classList.add('prohack-mode-mobile');
                btn.innerText = "Cihaz: Mobil";
            } else {
                prohackMonitorFrame.classList.remove('prohack-mode-mobile');
                btn.innerText = "Cihaz: Masaüstü";
            }
            prohackSyncEngine();
        }
        function prohackSyncEngine() {
            prohackVirtualSystem[prohackCurrentFile] = prohackEditorInstance.value;
            const doc = prohackMonitorFrame.contentDocument || prohackMonitorFrame.contentWindow.document;
            let pageHTML = prohackVirtualSystem[prohackPreviewTarget] || "";
            let globalCSS = `<style>${prohackVirtualSystem['style.css'] || ""}</style>`;
            let viewportMeta = '<meta name="viewport" content="width=device-width, initial-scale=1.0">';
            
            let interceptScript = `
            <script>
                document.querySelectorAll('a').forEach(link => {
                    link.addEventListener('click', (e) => {
                        const href = link.getAttribute('href');
                        if(href && !href.startsWith('http')) {
                            e.preventDefault();
                            window.parent.postMessage({ type: 'prohack-navigation', page: href }, '*');
                        }
                    });
                });
            <\/script>
            `;
            doc.open();
            doc.write(viewportMeta + globalCSS + pageHTML + interceptScript);
            doc.close();
            document.getElementById('prohackAddressBar').innerText = prohackPreviewTarget;
        }
        prohackEditorInstance.addEventListener('input', prohackSyncEngine);
        window.addEventListener('message', (e) => {
            if(e.data && e.data.type === 'prohack-navigation') {
                if(prohackVirtualSystem[e.data.page] !== undefined) {
                    prohackPreviewTarget = e.data.page;
                    prohackSyncEngine();
                }
            }
        });
        function prohackDownloadActiveFile() {
            const blob = new Blob([prohackEditorInstance.value], { type: "text/plain;charset=utf-8" });
            const link = document.createElement("a");
            link.href = URL.createObjectURL(blob);
            link.download = prohackCurrentFile;
            link.click();
        }
        function prohackFilterAssets() {
            const q = document.getElementById('prohackSearchInput').value.toLowerCase();
            document.querySelectorAll('.prohack-asset-card').forEach(box => {
                box.style.display = box.innerText.toLowerCase().includes(q) ? 'flex' : 'none';
            });
        }
        prohackEditorInstance.addEventListener('dragover', (e) => { e.preventDefault(); prohackEditorInstance.classList.add('prohack-drop-glow'); });
        prohackEditorInstance.addEventListener('dragleave', () => { prohackEditorInstance.classList.remove('prohack-drop-glow'); });
        prohackEditorInstance.addEventListener('drop', (e) => {
            e.preventDefault();
            prohackEditorInstance.classList.remove('prohack-drop-glow');
            const codeData = e.dataTransfer.getData('text/plain');
            if(codeData) {
                prohackInjectCodeAtCursor(codeData);
            }
        });
        prohackEditorInstance.value = prohackVirtualSystem["index.html"];
        prohackUpdateFilesUI();
        prohackSwitchTab('buttons');
        prohackSyncEngine();
    </script>
</body>
</html>

Mövzuya qayıt
Forum