1
0
mirror of https://github.com/vrana/adminer.git synced 2025-08-07 23:27:17 +02:00

Plugins: Defer syntax highlighting

This commit is contained in:
Jakub Vrana
2025-04-07 14:23:35 +02:00
parent b0e5c1d6e4
commit 41c71f8854
2 changed files with 98 additions and 94 deletions

View File

@@ -24,14 +24,14 @@ class AdminerCodemirror {
.CodeMirror { border: 1px inset #ccc; resize: both; } .CodeMirror { border: 1px inset #ccc; resize: both; }
</style> </style>
<?php <?php
echo Adminer\script_src("$this->root/lib/codemirror$this->minified.js"); echo Adminer\script_src("$this->root/lib/codemirror$this->minified.js", true);
echo Adminer\script_src("$this->root/addon/runmode/runmode$this->minified.js"); echo Adminer\script_src("$this->root/addon/runmode/runmode$this->minified.js", true);
echo Adminer\script_src("$this->root/addon/hint/show-hint$this->minified.js"); echo Adminer\script_src("$this->root/addon/hint/show-hint$this->minified.js", true);
echo Adminer\script_src("$this->root/mode/javascript/javascript$this->minified.js"); echo Adminer\script_src("$this->root/mode/javascript/javascript$this->minified.js", true);
$tables = array_fill_keys(array_keys($tableStatuses), array()); $tables = array_fill_keys(array_keys($tableStatuses), array());
if (Adminer\support("sql")) { if (Adminer\support("sql")) {
echo Adminer\script_src("$this->root/mode/sql/sql$this->minified.js"); echo Adminer\script_src("$this->root/mode/sql/sql$this->minified.js", true);
echo Adminer\script_src("$this->root/addon/hint/sql-hint$this->minified.js"); echo Adminer\script_src("$this->root/addon/hint/sql-hint$this->minified.js", true);
if (isset($_GET["sql"]) || isset($_GET["trigger"]) || isset($_GET["check"])) { if (isset($_GET["sql"]) || isset($_GET["trigger"]) || isset($_GET["check"])) {
foreach (Adminer\driver()->allFields() as $table => $fields) { foreach (Adminer\driver()->allFields() as $table => $fields) {
foreach ($fields as $field) { foreach ($fields as $field) {
@@ -42,7 +42,8 @@ class AdminerCodemirror {
} }
?> ?>
<script <?php echo Adminer\nonce(); ?>> <script <?php echo Adminer\nonce(); ?>>
function getCmMode(el) { addEventListener('DOMContentLoaded', () => {
function getCmMode(el) {
const match = el.className.match(/(^|\s)jush-([^ ]+)/); const match = el.className.match(/(^|\s)jush-([^ ]+)/);
if (match) { if (match) {
const modes = { const modes = {
@@ -54,19 +55,19 @@ function getCmMode(el) {
}; };
return modes[match[2]] || 'text/x-' + match[2]; return modes[match[2]] || 'text/x-' + match[2];
} }
} }
adminerHighlighter = els => els.forEach(el => { adminerHighlighter = els => els.forEach(el => {
const mode = getCmMode(el); const mode = getCmMode(el);
if (mode) { if (mode) {
el.classList.add('cm-s-default'); el.classList.add('cm-s-default');
CodeMirror.runMode(el.textContent, mode, el); CodeMirror.runMode(el.textContent, mode, el);
} }
}); });
adminerHighlighter(qsa('code')); adminerHighlighter(qsa('code'));
for (const el of qsa('textarea')) { for (const el of qsa('textarea')) {
const mode = getCmMode(el); const mode = getCmMode(el);
if (mode) { if (mode) {
const width = el.clientWidth; const width = el.clientWidth;
@@ -90,7 +91,8 @@ for (const el of qsa('textarea')) {
setupSubmitHighlightInput(cm.getWrapperElement()); setupSubmitHighlightInput(cm.getWrapperElement());
el.onchange = () => cm.setValue(el.value); el.onchange = () => cm.setValue(el.value);
} }
} }
});
</script> </script>
<?php <?php
return true; return true;

View File

@@ -15,11 +15,12 @@ class AdminerMonaco {
} }
function syntaxHighlighting($tableStatuses) { function syntaxHighlighting($tableStatuses) {
echo Adminer\script_src("$this->root/loader.js"); echo Adminer\script_src("$this->root/loader.js", true);
?> ?>
<script <?php echo Adminer\nonce(); ?>> <script <?php echo Adminer\nonce(); ?>>
require.config({ paths: { vs: '<?php echo $this->root; ?>' } }); addEventListener('DOMContentLoaded', () => {
require(['vs/editor/editor.main'], function (monaco) { require.config({ paths: { vs: '<?php echo $this->root; ?>' } });
require(['vs/editor/editor.main'], function (monaco) {
adminerHighlighter = els => els.forEach(el => { adminerHighlighter = els => els.forEach(el => {
const lang = getMonacoLang(el); const lang = getMonacoLang(el);
if (lang) { if (lang) {
@@ -54,9 +55,9 @@ require(['vs/editor/editor.main'], function (monaco) {
]); ]);
} }
} }
}); });
function getMonacoLang(el) { function getMonacoLang(el) {
return ( return (
/jush-js/.test(el.className) ? 'javascript' : ( /jush-js/.test(el.className) ? 'javascript' : (
/jush-sql/.test(el.className) ? 'mysql' : ( /jush-sql/.test(el.className) ? 'mysql' : (
@@ -64,7 +65,8 @@ function getMonacoLang(el) {
/jush-(sqlite|mssql|oracle|clickhouse|firebird)/.test(el.className) ? 'sql' : ( /jush-(sqlite|mssql|oracle|clickhouse|firebird)/.test(el.className) ? 'sql' : (
'' ''
))))); )))));
} }
});
</script> </script>
<?php <?php
return true; return true;