Browse Source

Dynamically load Codemirror theme when requested rather than loading all at beginning

2.22
Franck Paul 8 months ago
parent
commit
042d389297
Signed by: franck
GPG Key ID: BC0939B7E6CF71E7
  1. 9
      plugins/themeEditor/_admin.php
  2. 17
      plugins/themeEditor/js/theme.js

9
plugins/themeEditor/_admin.php

@ -55,6 +55,7 @@ class themeEditorBehaviors
{
// Add fieldset for plugin options
$core->auth->user_prefs->addWorkspace('interface');
$current_theme = $core->auth->user_prefs->interface->colorsyntax_theme ?? 'default';
$themes_list = dcPage::getCodeMirrorThemes();
$themes_combo = [__('Default') => ''];
@ -78,7 +79,7 @@ class themeEditorBehaviors
'colorsyntax_theme',
$themes_combo,
[
'default' => $core->auth->user_prefs->interface->colorsyntax_theme,
'default' => $current_theme,
]
) .
'</p>';
@ -88,8 +89,8 @@ class themeEditorBehaviors
echo '</div>';
echo '<div class="col">';
echo dcPage::jsLoadCodeMirror('', false, ['javascript']);
foreach ($themes_list as $theme) {
echo dcPage::cssLoad('js/codemirror/theme/' . $theme . '.css');
if ($current_theme !== 'default') {
echo dcPage::cssLoad('js/codemirror/theme/' . $current_theme . '.css');
}
echo '
<textarea id="codemirror" name="codemirror" readonly="true">
@ -106,7 +107,7 @@ function findSequence(goal) {
return find(1, "1");
}</textarea>';
echo
dcPage::jsJson('theme_editor_current', ['theme' => $core->auth->user_prefs->interface->colorsyntax_theme != '' ? $core->auth->user_prefs->interface->colorsyntax_theme : 'default']) .
dcPage::jsJson('theme_editor_current', ['theme' => $current_theme]) .
dcPage::jsModuleLoad('themeEditor/js/theme.js');
echo '</div>';
echo '</div>';

17
plugins/themeEditor/js/theme.js

@ -17,9 +17,24 @@ $(() => {
editor.refresh();
});
let themes_loaded = ['default'];
if (current.theme !== 'default') {
themes_loaded.push(current.theme);
}
$('#colorsyntax_theme').on('change', () => {
const input = document.getElementById('colorsyntax_theme');
editor.setOption('theme', input.options[input.selectedIndex].value || 'default');
const theme = input.options[input.selectedIndex].value || 'default';
// Dynamically load theme if not default and not already loaded
if (!themes_loaded.includes(theme)) {
const href = `js/codemirror/theme/${theme}.css`;
const style = document.createElement('link');
style.setAttribute('rel', 'stylesheet');
style.setAttribute('type', 'text/css');
style.setAttribute('href', href);
document.getElementsByTagName('head')[0].append(style);
themes_loaded.push(theme);
}
editor.setOption('theme', theme);
editor.refresh();
});
});

Loading…
Cancel
Save