luci-base: add ui indicator when fallback theme is used

Add a ui indicator displaying error details when the configured theme
failed to load and the next available one is being used instead.

Signed-off-by: Jo-Philipp Wich <jo@mein.io>
This commit is contained in:
Jo-Philipp Wich 2022-10-27 11:13:49 +02:00
parent bd4bf6ac9b
commit 1eea6c0ce8
2 changed files with 20 additions and 0 deletions

View file

@ -137,6 +137,7 @@ export default function(env) {
if (status !== true) { if (status !== true) {
media = null; media = null;
self.env.media_error = status;
for (let k, v in uci.get_all('luci', 'themes')) { for (let k, v in uci.get_all('luci', 'themes')) {
if (substr(k, 0, 1) != '.') { if (substr(k, 0, 1) != '.') {

View file

@ -18,6 +18,25 @@
</script> </script>
{% endif %} {% endif %}
{% if (media_error): %}
<script type="text/javascript">
L.require('ui').then(function(ui) {
ui.showIndicator('media_error', _('Theme fallback'), function(ev) {
ui.showModal(_('Error loading theme'), [
E('p', [
_('A fallback is used since the configured theme failed to load with the error below.')
]),
E('hr'),
E('div', { 'style': 'white-space:pre-line' }, {{ sprintf('%J', trim(media_error)) }}),
E('div', { 'class': 'right' }, [
E('button', { 'class': 'btn cbi-button', 'click': ui.hideModal }, _('Dismiss'))
])
]);
});
});
</script>
{% endif %}
{% include(`themes/${theme}/footer`) %} {% include(`themes/${theme}/footer`) %}
<!-- Lua compatibility mode active: {{ lua_active ? 'yes' : 'no' }} --> <!-- Lua compatibility mode active: {{ lua_active ? 'yes' : 'no' }} -->