luci-mod-status: Adding scroll buttons on syslog and kernellog status pages

Signed-off-by: Ramon Van Gorkom <Ramon00c00@gmail.com>
This commit is contained in:
Ramon Van Gorkom 2024-02-11 11:51:45 +01:00 committed by Paul Donald
parent 23ebdb3bf9
commit eb6b2bdaae
2 changed files with 43 additions and 2 deletions

View file

@ -16,16 +16,36 @@ return view.extend({
return line.replace(/^<\d+>/, '');
});
var scrollDownButton = E('button', {
'id': 'scrollDownButton',
'class': 'cbi-button cbi-button-neutral',
}, _('Scroll to tail', 'scroll to bottom (the tail) of the log file')
);
scrollDownButton.addEventListener('click', function() {
window.scrollTo(0, document.body.scrollHeight);
});
var scrollUpButton = E('button', {
'id' : 'scrollUpButton',
'class': 'cbi-button cbi-button-neutral',
}, _('Scroll to head', 'scroll to top (the head) of the log file')
);
scrollUpButton.addEventListener('click', function() {
window.scrollTo(0, 0);
});
return E([], [
E('h2', {}, [ _('Kernel Log') ]),
E('div', { 'id': 'content_syslog' }, [
E('div', {'style': 'padding-bottom: 20px'}, [scrollDownButton]),
E('textarea', {
'id': 'syslog',
'style': 'font-size:12px',
'readonly': 'readonly',
'wrap': 'off',
'rows': loglines.length + 1
}, [ loglines.join('\n') ])
}, [ loglines.join('\n') ]),
E('div', {'style': 'padding-bottom: 20px'}, [scrollUpButton])
])
]);
},

View file

@ -21,16 +21,37 @@ return view.extend({
render: function(logdata) {
var loglines = logdata.trim().split(/\n/);
var scrollDownButton = E('button', {
'id': 'scrollDownButton',
'class': 'cbi-button cbi-button-neutral'
}, _('Scroll to tail', 'scroll to bottom (the tail) of the log file')
);
scrollDownButton.addEventListener('click', function() {
window.scrollTo(0, document.body.scrollHeight);
});
var scrollUpButton = E('button', {
'id' : 'scrollUpButton',
'class': 'cbi-button cbi-button-neutral'
}, _('Scroll to head', 'scroll to top (the head) of the log file')
);
scrollUpButton.addEventListener('click', function() {
window.scrollTo(0, 0);
});
return E([], [
E('h2', {}, [ _('System Log') ]),
E('div', { 'id': 'content_syslog' }, [
E('div', {'style': 'padding-bottom: 20px'}, [scrollDownButton]),
E('textarea', {
'id': 'syslog',
'style': 'font-size:12px',
'readonly': 'readonly',
'wrap': 'off',
'rows': loglines.length + 1
}, [ loglines.join('\n') ])
}, [ loglines.join('\n') ]),
E('div', {'style': 'padding-bottom: 20px'}, [scrollUpButton])
])
]);
},