gandalf/secubox-openwrt
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Add SecuBox portal header to Netifyd views

Browse Source 
Add unified SecuBox header navigation to all 5 Netifyd views:
- dashboard.js, devices.js, flows.js, applications.js, settings.js

Pattern: Wrap view content with secubox-page-wrapper and prepend
SbHeader.render() to hide LuCI sidebar when in portal context.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
CyberMind-FR 2026-01-09 16:02:07 +01:00
parent 9e1b841d98
commit a73157846e
5 changed files with 63 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/applications.js
View File

@ -4,6 +4,13 @@
'require ui';
'require dom';
'require secubox-netifyd/api as netifydAPI';
'require secubox-theme/theme as Theme';
'require secubox-portal/header as SbHeader';
var lang = (typeof L !== 'undefined' && L.env && L.env.lang) ||
(document.documentElement && document.documentElement.getAttribute('lang')) ||
(navigator.language ? navigator.language.split('-')[0] : 'en');
Theme.init({ language: lang });
return view.extend({
refreshInterval: 5,
@ -285,7 +292,7 @@ return view.extend({
var serviceRunning = status.running;
return E('div', { 'class': 'cbi-map' }, [
var view = E('div', { 'class': 'cbi-map' }, [
E('div', { 'style': 'display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem' }, [
E('h2', { 'name': 'content', 'style': 'margin: 0' }, [
E('i', { 'class': 'fa fa-cubes', 'style': 'margin-right: 0.5rem' }),
@ -352,6 +359,11 @@ return view.extend({
])
])
]);
var wrapper = E('div', { 'class': 'secubox-page-wrapper' });
wrapper.appendChild(SbHeader.render());
wrapper.appendChild(view);
return wrapper;
},
addFooter: function() {

12
package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/dashboard.js
View File

@ -4,6 +4,13 @@
'require ui';
'require dom';
'require secubox-netifyd/api as netifydAPI';
'require secubox-theme/theme as Theme';
'require secubox-portal/header as SbHeader';
var lang = (typeof L !== 'undefined' && L.env && L.env.lang) ||
(document.documentElement && document.documentElement.getAttribute('lang')) ||
(navigator.language ? navigator.language.split('-')[0] : 'en');
Theme.init({ language: lang });
return view.extend({
refreshInterval: 5,
@ -717,7 +724,10 @@ return view.extend({
dom.content(self.appsContainer, self.renderTopApplications(topApps));
dom.content(self.protosContainer, self.renderTopProtocols(topProtos));
return pageContent;
var wrapper = E('div', { 'class': 'secubox-page-wrapper' });
wrapper.appendChild(SbHeader.render());
wrapper.appendChild(pageContent);
return wrapper;
},
handleSaveApply: null,

14
package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/devices.js
View File

@ -4,6 +4,13 @@
'require ui';
'require dom';
'require rpc';
'require secubox-theme/theme as Theme';
'require secubox-portal/header as SbHeader';
var lang = (typeof L !== 'undefined' && L.env && L.env.lang) ||
(document.documentElement && document.documentElement.getAttribute('lang')) ||
(navigator.language ? navigator.language.split('-')[0] : 'en');
Theme.init({ language: lang });
var callGetDevices = rpc.declare({
object: 'luci.secubox-netifyd',
@ -324,7 +331,7 @@ return view.extend({
var serviceRunning = status.running;
return E('div', { 'style': 'max-width: 1400px; margin: 0 auto; padding: 24px' }, [
var view = E('div', { 'style': 'max-width: 1400px; margin: 0 auto; padding: 24px' }, [
// Header
E('div', { 'style': 'display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; flex-wrap: wrap; gap: 16px' }, [
E('div', { 'style': 'display: flex; align-items: center; gap: 12px' }, [
@ -395,6 +402,11 @@ return view.extend({
// CSS for pulse animation
E('style', {}, '@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }')
]);
var wrapper = E('div', { 'class': 'secubox-page-wrapper' });
wrapper.appendChild(SbHeader.render());
wrapper.appendChild(view);
return wrapper;
},
addFooter: function() {

14
package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/flows.js
View File

@ -4,6 +4,13 @@
'require ui';
'require dom';
'require secubox-netifyd/api as netifydAPI';
'require secubox-theme/theme as Theme';
'require secubox-portal/header as SbHeader';
var lang = (typeof L !== 'undefined' && L.env && L.env.lang) ||
(document.documentElement && document.documentElement.getAttribute('lang')) ||
(navigator.language ? navigator.language.split('-')[0] : 'en');
Theme.init({ language: lang });
return view.extend({
refreshInterval: 3,
@ -338,7 +345,7 @@ return view.extend({
var serviceRunning = status.running;
return E('div', { 'class': 'cbi-map' }, [
var view = E('div', { 'class': 'cbi-map' }, [
E('div', { 'style': 'display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem' }, [
E('h2', { 'name': 'content', 'style': 'margin: 0' }, [
E('i', { 'class': 'fa fa-stream', 'style': 'margin-right: 0.5rem' }),
@ -413,6 +420,11 @@ return view.extend({
])
])
]);
var wrapper = E('div', { 'class': 'secubox-page-wrapper' });
wrapper.appendChild(SbHeader.render());
wrapper.appendChild(view);
return wrapper;
},
addFooter: function() {

14
package/secubox/luci-app-secubox-netifyd/htdocs/luci-static/resources/view/secubox-netifyd/settings.js
View File

@ -5,6 +5,13 @@
'require ui';
'require rpc';
'require secubox-netifyd/api as netifydAPI';
'require secubox-theme/theme as Theme';
'require secubox-portal/header as SbHeader';
var lang = (typeof L !== 'undefined' && L.env && L.env.lang) ||
(document.documentElement && document.documentElement.getAttribute('lang')) ||
(navigator.language ? navigator.language.split('-')[0] : 'en');
Theme.init({ language: lang });
var callServiceList = rpc.declare({
object: 'service',
@ -743,6 +750,11 @@ return view.extend({
]);
};
return m.render();
return m.render().then(function(formEl) {
var wrapper = E('div', { 'class': 'secubox-page-wrapper' });
wrapper.appendChild(SbHeader.render());
wrapper.appendChild(formEl);
return wrapper;
});
}
});