view release on metacpan or  search on metacpan

include/chandra/chandra_devtools.h  view on Meta::CPAN

/*
 * chandra_devtools.h - DevTools JS constant and helpers
 * Included from Chandra.xs
 */

#ifndef CHANDRA_DEVTOOLS_H
#define CHANDRA_DEVTOOLS_H

static const char Chandra__DevTools__js_code_str[] =
    "(function() {\n"
    "    if (window.__chandraDevTools) return;\n"
    "\n"
    "    var dt = window.__chandraDevTools = {\n"
    "        visible: false,\n"
    "        errors: [],\n"
    "        panel: null,\n"
    "        currentTab: 'console',\n"
    "\n"
    "        init: function() {\n"
    "            this.panel = document.createElement('div');\n"
    "            this.panel.id = '__chandra-devtools';\n"
    "            this.panel.style.cssText = 'position:fixed;bottom:0;left:0;right:0;height:250px;' +\n"
    "                'background:#1e1e2e;color:#cdd6f4;font-family:monospace;font-size:12px;' +\n"
    "                'border-top:2px solid #89b4fa;z-index:999999;display:none;overflow:hidden;';\n"
    "\n"
    "            var header = document.createElement('div');\n"
    "            header.style.cssText = 'display:flex;align-items:center;padding:4px 8px;' +\n"
    "                'background:#313244;border-bottom:1px solid #45475a;';\n"
    "\n"
    "            var title = document.createElement('span');\n"
    "            title.style.cssText = 'flex:1;font-weight:bold;color:#89b4fa;';\n"
    "            title.textContent = 'Chandra DevTools';\n"
    "            header.appendChild(title);\n"
    "\n"
    "            var tabs = ['Console', 'Bindings', 'Elements'];\n"
    "            var self = this;\n"
    "            tabs.forEach(function(tab) {\n"
    "                var btn = document.createElement('button');\n"
    "                btn.textContent = tab;\n"
    "                btn.className = '__cdt-tab';\n"
    "                btn.setAttribute('data-tab', tab.toLowerCase());\n"
    "                btn.style.cssText = 'background:none;border:1px solid #45475a;color:#cdd6f4;' +\n"
    "                    'padding:2px 8px;margin:0 2px;cursor:pointer;border-radius:3px;font-size:11px;';\n"
    "                btn.onclick = function() { self.showTab(tab.toLowerCase()); };\n"
    "                header.appendChild(btn);\n"
    "            });\n"
    "\n"
    "            var reloadBtn = document.createElement('button');\n"
    "            reloadBtn.textContent = '\\u27F3 Reload';\n"
    "            reloadBtn.style.cssText = 'background:none;border:1px solid #45475a;color:#a6e3a1;' +\n"
    "                'padding:2px 8px;margin:0 2px;cursor:pointer;border-radius:3px;font-size:11px;';\n"
    "            reloadBtn.onclick = function() {\n"
    "                if (window.chandra) window.chandra.invoke('__devtools_reload', []);\n"
    "            };\n"
    "            header.appendChild(reloadBtn);\n"
    "\n"
    "            var clearBtn = document.createElement('button');\n"
    "            clearBtn.textContent = '\\u2718 Clear';\n"
    "            clearBtn.style.cssText = 'background:none;border:1px solid #45475a;color:#f9e2af;' +\n"
    "                'padding:2px 8px;margin:0 2px;cursor:pointer;border-radius:3px;font-size:11px;';\n"
    "            clearBtn.onclick = function() { self.clearConsole(); };\n"
    "            header.appendChild(clearBtn);\n"
    "\n"
    "            var closeBtn = document.createElement('button');\n"
    "            closeBtn.textContent = '\\u2715';\n"
    "            closeBtn.style.cssText = 'background:none;border:none;color:#f38ba8;padding:2px 6px;' +\n"
    "                'cursor:pointer;font-size:14px;margin-left:4px;';\n"
    "            closeBtn.onclick = function() { self.toggle(); };\n"
    "            header.appendChild(closeBtn);\n"
    "\n"
    "            this.panel.appendChild(header);\n"
    "\n"
    "            this.content = document.createElement('div');\n"
    "            this.content.style.cssText = 'height:calc(100% - 30px);overflow-y:auto;padding:8px;';\n"
    "            this.panel.appendChild(this.content);\n"
    "\n"
    "            document.body.appendChild(this.panel);\n"
    "\n"
    "            document.addEventListener('keydown', function(e) {\n"
    "                if (e.key === 'F12' || (e.ctrlKey && e.shiftKey && e.key === 'I')) {\n"
    "                    e.preventDefault();\n"
    "                    self.toggle();\n"
    "                }\n"
    "            });\n"
    "\n"
    "            var origError = console.error;\n"
    "            console.error = function() {\n"
    "                origError.apply(console, arguments);\n"
    "                var msg = Array.prototype.slice.call(arguments).join(' ');\n"
    "                self.addError(msg);\n"
    "            };\n"
    "\n"
    "            window.addEventListener('error', function(e) {\n"
    "                self.addError(e.message + ' at ' + e.filename + ':' + e.lineno);\n"
    "            });\n"
    "\n"
    "            this.showTab('console');\n"
    "        },\n"
    "\n"
    "        toggle: function() {\n"
    "            this.visible = !this.visible;\n"
    "            this.panel.style.display = this.visible ? 'block' : 'none';\n"
    "        },\n"
    "\n"
    "        show: function() {\n"
    "            this.visible = true;\n"
    "            this.panel.style.display = 'block';\n"
    "        },\n"
    "\n"
    "        hide: function() {\n"
    "            this.visible = false;\n"
    "            this.panel.style.display = 'none';\n"
    "        },\n"
    "\n"
    "        addError: function(msg) {\n"
    "            this.errors.push({ time: new Date().toLocaleTimeString(), message: msg, level: 'error' });\n"
    "            if (this.currentTab === 'console') this.showTab('console');\n"
    "        },\n"
    "\n"
    "        addLog: function(level, msg) {\n"
    "            this.errors.push({ time: new Date().toLocaleTimeString(), message: msg, level: level });\n"
    "            if (this.currentTab === 'console') this.showTab('console');\n"
    "        },\n"
    "\n"
    "        showTab: function(tab) {\n"
    "            this.currentTab = tab;\n"
    "            var html = '';\n"