mirror of
https://github.com/kiddin9/op-packages.git
synced 2026-09-14 04:15:06 +08:00
🔥 Sync 2026-06-21 03:09:38
This commit is contained in:
github-actions[bot]
@@ -102,7 +102,8 @@ function setActiveBackend(name) {
|
||||
return fs.write('/etc/config/daede', '');
|
||||
}).then(function() { return fs.exec('/sbin/uci', ['set', 'daede.config=daede']); })
|
||||
.then(function() { return fs.exec('/sbin/uci', ['set', 'daede.config.active_backend=' + name]); })
|
||||
.then(function() { return fs.exec('/sbin/uci', ['commit', 'daede']); });
|
||||
.then(function() { return fs.exec('/sbin/uci', ['commit', 'daede']); })
|
||||
.then(function() { uci.set('daede', 'config', 'active_backend', name); });
|
||||
}
|
||||
|
||||
function detectBackend() {
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
'require view.daede.daed as daedView';
|
||||
|
||||
return view.extend({
|
||||
load: function() {
|
||||
_loadContext: function() {
|
||||
return backend.detectBackend().then(function(ctx) {
|
||||
return uci.load(ctx.backend.uci).catch(function() {}).then(function() {
|
||||
return ctx;
|
||||
@@ -18,22 +18,57 @@ return view.extend({
|
||||
});
|
||||
},
|
||||
|
||||
load: function() {
|
||||
return this._loadContext();
|
||||
},
|
||||
|
||||
render: function(ctx) {
|
||||
const self = this;
|
||||
const themeHref = Array.prototype.map.call(document.styleSheets, function(sheet) { return sheet.href || ''; }).join(' ');
|
||||
document.documentElement.setAttribute('data-daede-theme', /\/argon\//.test(themeHref) ? 'argon' : 'bootstrap');
|
||||
|
||||
/* themes signal dark differently — BootstrapDark sets data-darkmode,
|
||||
Argon just loads a dark stylesheet with no flag. Detect dark from the
|
||||
page background luminance and set data-darkmode so our dark rules
|
||||
(keyed on it) fire uniformly across every theme's dark mode. */
|
||||
Argon just loads a dark stylesheet with no flag. Read the first opaque
|
||||
background up the tree; a transparent body (CSS not applied yet) must
|
||||
NOT count as black, else argon light is misdetected as dark. */
|
||||
try {
|
||||
const bg = getComputedStyle(document.body).backgroundColor.match(/\d+/g);
|
||||
if (bg && (0.299 * bg[0] + 0.587 * bg[1] + 0.114 * bg[2]) < 128)
|
||||
document.documentElement.setAttribute('data-darkmode', 'true');
|
||||
const probe = [document.body, document.documentElement];
|
||||
for (let i = 0; i < probe.length; i++) {
|
||||
const m = getComputedStyle(probe[i]).backgroundColor.match(/[\d.]+/g);
|
||||
if (!m) continue;
|
||||
const a = m.length >= 4 ? parseFloat(m[3]) : 1;
|
||||
if (a < 0.1) continue; // transparent — keep looking
|
||||
if (0.299 * m[0] + 0.587 * m[1] + 0.114 * m[2] < 128)
|
||||
document.documentElement.setAttribute('data-darkmode', 'true');
|
||||
break; // first opaque background decides
|
||||
}
|
||||
} catch (e) {}
|
||||
|
||||
const redrawBackend = function(name, message) {
|
||||
self._backendHint = message;
|
||||
return self._loadContext()
|
||||
.then(function(nextCtx) { return self.render(nextCtx); })
|
||||
.then(function(nextRoot) {
|
||||
const current = document.querySelector('.dd-config-page');
|
||||
if (!current) return;
|
||||
Array.prototype.forEach.call(current.querySelectorAll('.dd-status-card'), function(card) {
|
||||
if (card._ddCleanup) card._ddCleanup();
|
||||
});
|
||||
current.replaceWith(nextRoot);
|
||||
if (self._backendHintTimer) clearTimeout(self._backendHintTimer);
|
||||
self._backendHintTimer = setTimeout(function() {
|
||||
self._backendHint = '';
|
||||
const hint = document.querySelector('.dd-config-page .dd-backend-help');
|
||||
if (hint) hint.textContent = '';
|
||||
}, 3500);
|
||||
});
|
||||
};
|
||||
|
||||
const listenAddr = uci.get('daed', 'config', 'listen_addr') || backend.BACKENDS.daed.defaultListen;
|
||||
const children = [
|
||||
E('style', {}, styles.CSS),
|
||||
widgets.renderStatusCard(ctx, listenAddr),
|
||||
widgets.renderBackendSwitcher(ctx)
|
||||
widgets.renderBackendSwitcher(ctx, redrawBackend, self._backendHint)
|
||||
].filter(function(node) { return !!node; });
|
||||
|
||||
if (!ctx.installed[ctx.name]) {
|
||||
@@ -49,7 +84,7 @@ return view.extend({
|
||||
return Promise.all(children.map(function(child) {
|
||||
return child && child.then ? child : Promise.resolve(child);
|
||||
})).then(function(nodes) {
|
||||
return E('div', { 'class': 'dd-wrap' }, nodes.filter(function(n) { return !!n; }));
|
||||
return E('div', { 'class': 'dd-wrap dd-config-page' }, nodes.filter(function(n) { return !!n; }));
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
@@ -250,7 +250,6 @@ return view.extend({
|
||||
const airportName = E('input', { 'class': 'dd-conv-airport-name', 'placeholder': _('Group name'), 'autocomplete': 'off' });
|
||||
const importButton = E('button', { 'class': 'cbi-button cbi-button-positive', 'disabled': 'disabled' }, _('Import node group'));
|
||||
const importTitle = E('h4', { 'class': 'dd-card-title' });
|
||||
const importDescription = E('p', { 'class': 'dd-settings-descr' });
|
||||
const airportNameLabel = E('label');
|
||||
const summary = E('div', { 'class': 'dd-conv-summary' });
|
||||
const groupSummary = E('div', { 'class': 'dd-conv-group-summary' });
|
||||
@@ -299,9 +298,6 @@ return view.extend({
|
||||
const updateResultSummary = function() {
|
||||
const isDaed = state.target === 'daed';
|
||||
importTitle.textContent = isDaed ? _('3. Import Subscription') : _('3. Import Node Group');
|
||||
importDescription.textContent = isDaed
|
||||
? _('Import selected nodes as one subscription and add it to the default proxy group.')
|
||||
: _('Import the selected nodes as one named group, so large airport node lists stay easy to manage.');
|
||||
airportNameLabel.textContent = isDaed ? _('Subscription name') : _('Group name');
|
||||
const compatible = state.results.filter(function(item) { return item.ok; }).length;
|
||||
const unsupported = state.results.length - compatible;
|
||||
@@ -775,7 +771,7 @@ return view.extend({
|
||||
return E('div', { 'class': 'dd-wrap dd-converter' }, [
|
||||
E('style', {}, styles.CSS),
|
||||
E('div', { 'class': 'dd-card dd-conv-card' }, [
|
||||
E('p', { 'class': 'dd-settings-descr' }, _('Convert Clash YAML into share links, preview the result, then import selected nodes into dae or daed. Inputs and credentials are not saved.')),
|
||||
E('p', { 'class': 'dd-settings-descr' }, _('Convert Clash YAML to share links and import the nodes you pick. Nothing is saved.')),
|
||||
E('h4', { 'class': 'dd-card-title' }, _('1. Input Clash YAML')),
|
||||
E('div', { 'class': 'dd-conv-url-row' }, [ urlInput, uaSelect, parseUrl ]),
|
||||
E('div', { 'class': 'dd-conv-or' }, _('or')),
|
||||
@@ -793,7 +789,6 @@ return view.extend({
|
||||
]),
|
||||
E('div', { 'class': 'dd-card dd-conv-card' }, [
|
||||
importTitle,
|
||||
importDescription,
|
||||
E('div', { 'class': 'dd-conv-import dd-conv-airport' }, [
|
||||
airportNameLabel,
|
||||
airportName,
|
||||
|
||||
@@ -167,6 +167,44 @@ function accordionizeSections(mapNode, openTitles) {
|
||||
}
|
||||
}
|
||||
|
||||
function organizeDaeSections(mapNode, openTitles) {
|
||||
accordionizeSections(mapNode, openTitles);
|
||||
|
||||
const advTitles = [ _('Groups'), _('Routing'), _('DNS'), _('Logging') ];
|
||||
const advWraps = [];
|
||||
mapNode.querySelectorAll('.dd-adv').forEach(function(w) {
|
||||
const t = w.querySelector('.dd-adv-bar span');
|
||||
if (t && advTitles.indexOf(t.textContent.trim()) >= 0) advWraps.push(w);
|
||||
});
|
||||
if (!advWraps.length) return;
|
||||
|
||||
const outerOpen = (openTitles || []).indexOf(_('Advanced settings')) >= 0;
|
||||
const outerBody = E('div', { 'class': 'dd-adv-body' });
|
||||
const outer = E('div', { 'class': 'dd-adv' + (outerOpen ? '' : ' dd-closed') }, [
|
||||
E('div', { 'class': 'dd-adv-bar' }, [
|
||||
E('span', {}, _('Advanced settings')),
|
||||
E('span', { 'class': 'dd-adv-chevron' }, '›')
|
||||
]),
|
||||
outerBody
|
||||
]);
|
||||
outer.firstChild.addEventListener('click', function() { outer.classList.toggle('dd-closed'); });
|
||||
advWraps[0].parentNode.insertBefore(outer, advWraps[0]);
|
||||
advWraps.forEach(function(w) { outerBody.appendChild(w); });
|
||||
}
|
||||
|
||||
function captureAccordionState(mapNode) {
|
||||
if (!mapNode) return [];
|
||||
return Array.prototype.map.call(
|
||||
mapNode.querySelectorAll('.dd-adv:not(.dd-closed) > .dd-adv-bar span:first-child'),
|
||||
function(node) { return node.textContent.trim(); }
|
||||
);
|
||||
}
|
||||
|
||||
function restoreAccordionState(mapNode, openTitles) {
|
||||
if (!mapNode || mapNode.querySelector('.dd-adv')) return;
|
||||
organizeDaeSections(mapNode, openTitles || []);
|
||||
}
|
||||
|
||||
/* Friendly form UI for the dae backend. Form is the source of truth: on save we
|
||||
commit the `dae` UCI package, then gen-dae-config.sh renders config.dae,
|
||||
validates it and hot-reloads. */
|
||||
@@ -175,8 +213,7 @@ function renderDaeForms(ctx) {
|
||||
m = new form.Map('dae', null, null);
|
||||
|
||||
/* Subscriptions */
|
||||
s = m.section(form.GridSection, 'subscription', _('Subscriptions'),
|
||||
_('Airport / subscription links. dae resolves them into the node pool.'));
|
||||
s = m.section(form.GridSection, 'subscription', _('Subscriptions'), null);
|
||||
s.addremove = true;
|
||||
s.anonymous = true;
|
||||
s.sortable = false;
|
||||
@@ -302,6 +339,7 @@ function renderDaeForms(ctx) {
|
||||
o.default = '1';
|
||||
|
||||
const status = E('span', { 'class': 'dd-editor-status' }, '');
|
||||
let renderSaveActions = function() {};
|
||||
let statusTimer = null;
|
||||
function flash(text, kind, hold) {
|
||||
status.textContent = text;
|
||||
@@ -316,6 +354,12 @@ function renderDaeForms(ctx) {
|
||||
- opts.start: after generate, enable + start dae (stopped → "Save and Start")
|
||||
- otherwise just save + generate; generate hot-reloads itself when dae runs */
|
||||
function doSave(opts, btns) {
|
||||
const settingsCard = status.closest('.dd-settings-card');
|
||||
const openTitles = captureAccordionState(settingsCard && settingsCard.querySelector('.cbi-map'));
|
||||
const restoreLiveAccordions = function() {
|
||||
const liveCard = status.closest('.dd-settings-card');
|
||||
restoreAccordionState(liveCard && liveCard.querySelector('.cbi-map'), openTitles);
|
||||
};
|
||||
btns.forEach(function(b) { b.disabled = true; });
|
||||
flash(_('Saving…'));
|
||||
/* ensure the singleton sections exist before parsing the form —
|
||||
@@ -326,6 +370,7 @@ function renderDaeForms(ctx) {
|
||||
if (!uci.get('dae', 'config')) uci.add('dae', 'dae', 'config');
|
||||
return m.save(null, true)
|
||||
.then(function() {
|
||||
restoreLiveAccordions();
|
||||
/* assign unique tags to any rows the user left blank */
|
||||
autofillTags('subscription', 'subscription');
|
||||
autofillTags('node', 'node');
|
||||
@@ -350,7 +395,6 @@ function renderDaeForms(ctx) {
|
||||
if (!opts.start) {
|
||||
/* generate already hot-reloaded if dae was running */
|
||||
flash(opts.okMsg || _('Saved'), 'ok');
|
||||
setTimeout(function() { window.location.reload(); }, 900);
|
||||
return;
|
||||
}
|
||||
flash(_('Starting…'));
|
||||
@@ -363,7 +407,7 @@ function renderDaeForms(ctx) {
|
||||
flash(_('Start failed: %s').format(r2.stderr || r2.stdout || ('exit ' + r2.code)), 'err', 9000);
|
||||
else {
|
||||
flash(_('Saved · started'), 'ok');
|
||||
setTimeout(function() { window.location.reload(); }, 900);
|
||||
renderSaveActions(true);
|
||||
}
|
||||
});
|
||||
})
|
||||
@@ -375,41 +419,18 @@ function renderDaeForms(ctx) {
|
||||
}
|
||||
flash(_('Save failed: %s').format(e.message || e), 'err', 9000);
|
||||
})
|
||||
.finally(function() { btns.forEach(function(b) { b.disabled = false; }); });
|
||||
.finally(function() {
|
||||
restoreLiveAccordions();
|
||||
btns.forEach(function(b) { b.disabled = false; });
|
||||
});
|
||||
}
|
||||
|
||||
return m.render().then(function(mapNode) {
|
||||
|
||||
/* beginner default: only Subscriptions starts open; nodes/groups/routing/dns/logging collapse */
|
||||
accordionizeSections(mapNode, [ _('Subscriptions') ]);
|
||||
organizeDaeSections(mapNode, [ _('Subscriptions') ]);
|
||||
|
||||
/* fold groups / routing / dns / logging under one "Advanced settings"
|
||||
collapsible so the everyday view is just subscriptions + nodes */
|
||||
const advTitles = [ _('Groups'), _('Routing'), _('DNS'), _('Logging') ];
|
||||
const advWraps = [];
|
||||
mapNode.querySelectorAll('.dd-adv').forEach(function(w) {
|
||||
const t = w.querySelector('.dd-adv-bar span');
|
||||
if (t && advTitles.indexOf(t.textContent.trim()) >= 0) advWraps.push(w);
|
||||
});
|
||||
if (advWraps.length) {
|
||||
const outerBody = E('div', { 'class': 'dd-adv-body' });
|
||||
const outer = E('div', { 'class': 'dd-adv dd-closed' }, [
|
||||
E('div', { 'class': 'dd-adv-bar' }, [
|
||||
E('span', {}, _('Advanced settings')),
|
||||
E('span', { 'class': 'dd-adv-chevron' }, '›')
|
||||
]),
|
||||
outerBody
|
||||
]);
|
||||
outer.firstChild.addEventListener('click', function() { outer.classList.toggle('dd-closed'); });
|
||||
advWraps[0].parentNode.insertBefore(outer, advWraps[0]);
|
||||
advWraps.forEach(function(w) { outerBody.appendChild(w); });
|
||||
}
|
||||
|
||||
const cardChildren = [
|
||||
E('h4', { 'class': 'dd-card-title' }, _('dae Configuration')),
|
||||
E('div', { 'class': 'dd-settings-descr' },
|
||||
_('Add a subscription or node, then save — it takes effect automatically.'))
|
||||
];
|
||||
const cardChildren = [ E('h4', { 'class': 'dd-card-title' }, _('dae Configuration')) ];
|
||||
cardChildren.push(mapNode);
|
||||
|
||||
/* state-aware primary action: running → one "Save and Apply"; stopped →
|
||||
@@ -458,23 +479,28 @@ function renderDaeForms(ctx) {
|
||||
}
|
||||
}
|
||||
|
||||
const actions = [];
|
||||
let btns;
|
||||
if (running) {
|
||||
const apply = E('button', { 'class': 'cbi-button cbi-button-positive' }, _('Save and Apply'));
|
||||
btns = [ apply ];
|
||||
apply.addEventListener('click', function(ev) { ev.preventDefault(); doSave({ okMsg: _('Saved · applied') }, btns); });
|
||||
actions.push(apply);
|
||||
} else {
|
||||
const saveOnly = E('button', { 'class': 'cbi-button' }, _('Save config'));
|
||||
const saveStart = E('button', { 'class': 'cbi-button cbi-button-positive' }, _('Save and Start'));
|
||||
btns = [ saveOnly, saveStart ];
|
||||
saveOnly.addEventListener('click', function(ev) { ev.preventDefault(); doSave({ okMsg: _('Saved') }, btns); });
|
||||
saveStart.addEventListener('click', function(ev) { ev.preventDefault(); doSave({ start: true }, btns); });
|
||||
actions.push(saveOnly, saveStart);
|
||||
}
|
||||
actions.push(status);
|
||||
cardChildren.push(E('div', { 'class': 'dd-editor-actions' }, actions));
|
||||
const actionsWrap = E('div', { 'class': 'dd-editor-actions' });
|
||||
renderSaveActions = function(isRunning) {
|
||||
while (actionsWrap.firstChild) actionsWrap.removeChild(actionsWrap.firstChild);
|
||||
let btns;
|
||||
if (isRunning) {
|
||||
const apply = E('button', { 'class': 'cbi-button cbi-button-positive' }, _('Save and Apply'));
|
||||
btns = [ apply ];
|
||||
apply.addEventListener('click', function(ev) { ev.preventDefault(); doSave({ okMsg: _('Saved · applied') }, btns); });
|
||||
actionsWrap.appendChild(apply);
|
||||
} else {
|
||||
const saveOnly = E('button', { 'class': 'cbi-button' }, _('Save config'));
|
||||
const saveStart = E('button', { 'class': 'cbi-button cbi-button-positive' }, _('Save and Start'));
|
||||
btns = [ saveOnly, saveStart ];
|
||||
saveOnly.addEventListener('click', function(ev) { ev.preventDefault(); doSave({ okMsg: _('Saved') }, btns); });
|
||||
saveStart.addEventListener('click', function(ev) { ev.preventDefault(); doSave({ start: true }, btns); });
|
||||
actionsWrap.appendChild(saveOnly);
|
||||
actionsWrap.appendChild(saveStart);
|
||||
}
|
||||
actionsWrap.appendChild(status);
|
||||
};
|
||||
renderSaveActions(running);
|
||||
cardChildren.push(actionsWrap);
|
||||
return E('div', { 'class': 'dd-card dd-settings-card' }, cardChildren);
|
||||
});
|
||||
});
|
||||
@@ -744,8 +770,6 @@ function renderDaeEditor() {
|
||||
|
||||
return E('div', { 'class': 'dd-card' }, [
|
||||
E('h4', { 'class': 'dd-card-title' }, _('Advanced / Manual Mode')),
|
||||
E('div', { 'class': 'dd-settings-descr' },
|
||||
_('Edit config.dae directly. Saving the form above regenerates the file and overwrites changes made here.')),
|
||||
(function() {
|
||||
var adv = E('div', { 'class': 'dd-adv dd-closed', style: 'margin-top:8px' }, [
|
||||
E('div', { 'class': 'dd-adv-bar' }, [
|
||||
@@ -756,7 +780,7 @@ function renderDaeEditor() {
|
||||
E('div', { 'class': 'dd-editor-hint', style: 'margin:0 0 10px' }, [
|
||||
E('b', {}, _('Text-only mode.')),
|
||||
' ',
|
||||
_('Edit config DSL — subscriptions, nodes, routing, DNS. Load template via Initialize. Replace placeholder URL before saving. Switch to daed for GUI.')
|
||||
_('Edit the dae DSL directly. Initialize loads a template. Use daed for a GUI.')
|
||||
]),
|
||||
phWarn,
|
||||
editWrap,
|
||||
|
||||
@@ -14,8 +14,7 @@ function renderDaedSettings() {
|
||||
s.addremove = false;
|
||||
s.anonymous = true;
|
||||
|
||||
o = s.option(form.Value, 'listen_addr', _('Listen Address'),
|
||||
_('Host:port that the daed WebUI and GraphQL API listen on.'));
|
||||
o = s.option(form.Value, 'listen_addr', _('Listen Address'));
|
||||
o.datatype = 'ipaddrport(1)';
|
||||
o.default = '0.0.0.0:2023';
|
||||
o.rmempty = false;
|
||||
@@ -32,7 +31,7 @@ function renderDaedSettings() {
|
||||
|
||||
return widgets.wrapSettingsCard(
|
||||
_('daede Settings'),
|
||||
_('A modern dashboard for dae. Subscriptions, nodes, routing and DNS are managed in the daed WebUI.'),
|
||||
null,
|
||||
m.render(),
|
||||
_('Log Advanced Settings'),
|
||||
['log_maxsize', 'log_maxbackups']
|
||||
|
||||
@@ -15,7 +15,8 @@ const CSS = [
|
||||
'.dd-log-card-title{font-size:11px;font-weight:600;opacity:.55;margin:0 0 8px;letter-spacing:.3px;text-transform:uppercase}',
|
||||
'.dd-log-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:0 0 8px;margin-bottom:8px;border-bottom:1px dashed rgba(128,128,128,.2)}',
|
||||
'.dd-log-toolbar label{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;cursor:pointer;margin:0;opacity:.85}',
|
||||
'.dd-log-toolbar input[type="checkbox"]{margin:0}',
|
||||
/* Argon shifts label>checkbox down by top:.4rem; reset so flex centers it with the text */
|
||||
'.dd-log-toolbar input[type="checkbox"]{position:static;top:auto;right:auto;margin:0}',
|
||||
'.dd-log-toolbar input[type="text"]{font-size:11.5px;padding:4px 8px;border-radius:5px;border:1px solid rgba(128,128,128,.28);background:transparent;color:inherit;min-width:160px}',
|
||||
'.dd-log-toolbar .dd-log-btn{font-size:11.5px;line-height:1.4;min-height:0;height:auto;padding:4px 12px;border-radius:5px;border:1px solid rgba(128,128,128,.28);background:transparent;color:inherit;cursor:pointer}',
|
||||
'.dd-log-toolbar .dd-log-btn:hover{background:rgba(128,128,128,.1)}',
|
||||
|
||||
@@ -6,7 +6,9 @@
|
||||
const CSS = [
|
||||
'.dd-wrap{padding:4px 0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif}',
|
||||
'.dd-card{border:1px solid rgba(0,0,0,.06);border-radius:10px;padding:9px 14px;margin-bottom:7px;box-shadow:0 2px 8px rgba(0,0,0,.03);background:rgba(255,255,255,.02)}',
|
||||
'.dd-card-title{font-size:11px;font-weight:600;opacity:.55;margin:0 0 8px;letter-spacing:.3px;text-transform:uppercase}',
|
||||
/* padding:0 neutralizes Argon's h4{padding:.75rem 1.25rem}, which otherwise
|
||||
indents the title 20px past the card body and looks misaligned */
|
||||
'.dd-card-title{font-size:11px;font-weight:600;opacity:.55;margin:0 0 8px;padding:0;letter-spacing:.3px;text-transform:uppercase}',
|
||||
'.dd-status-row{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:0}',
|
||||
'.dd-status-row .dd-grow{flex:1 1 auto}',
|
||||
'.dd-badge{display:inline-flex;align-items:center;gap:5px;padding:2px 10px;border-radius:999px;font-size:10.5px;font-weight:700;letter-spacing:.3px;border:1px solid transparent;line-height:1.3}',
|
||||
@@ -33,7 +35,7 @@ const CSS = [
|
||||
'.dd-switch-wrap{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}',
|
||||
'.dd-backend-card{padding:10px 14px}',
|
||||
'.dd-backend-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}',
|
||||
'.dd-backend-label{min-width:100px;font-size:12px;font-weight:600;opacity:.72}',
|
||||
'.dd-backend-label{flex:0 0 calc(200px - 10px);font-size:12px;font-weight:600;opacity:.72}',
|
||||
'.dd-backend-segment{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:7px;background:rgba(128,128,128,.10)}',
|
||||
'.dd-backend-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:78px;height:24px;padding:0 10px;border:0;border-radius:5px;background:transparent;color:inherit;font-size:11px;font-weight:500;opacity:.65;cursor:pointer;transition:background .18s ease,color .18s ease,opacity .18s ease}',
|
||||
'.dd-backend-btn:hover{background:rgba(128,128,128,.10)}',
|
||||
@@ -41,8 +43,16 @@ const CSS = [
|
||||
'.dd-backend-btn:disabled{opacity:.55;cursor:not-allowed}',
|
||||
'.dd-backend-state{font-size:10.5px;font-weight:500;opacity:.70;margin-left:2px}',
|
||||
'.dd-backend-btn.is-active .dd-backend-state{opacity:.85}',
|
||||
'.dd-backend-help{margin:6px 0 0 110px;font-size:11.5px;line-height:1.45;opacity:.66}',
|
||||
'@media (max-width:640px){.dd-backend-label{min-width:0;width:100%}.dd-backend-segment{width:100%}.dd-backend-btn{flex:1;min-width:0}.dd-backend-help{margin-left:0}}',
|
||||
'.dd-backend-help{margin:6px 0 0 200px;font-size:11.5px;line-height:1.45;opacity:.66}',
|
||||
'.dd-backend-help:empty{display:none}',
|
||||
'html[data-daede-theme="argon"] .dd-backend-label{flex-basis:calc(240px - 10px)}',
|
||||
'html[data-daede-theme="argon"] .dd-backend-help{margin-left:240px}',
|
||||
'html[data-daede-theme="argon"]:not([data-darkmode="true"]) .dd-config-page .dd-card{background:rgba(255,255,255,.78);border-color:rgba(50,50,93,.12);box-shadow:0 2px 8px rgba(50,50,93,.06)}',
|
||||
'html[data-daede-theme="argon"]:not([data-darkmode="true"]) .dd-config-page .dd-card-title{opacity:.78}',
|
||||
'html[data-daede-theme="argon"]:not([data-darkmode="true"]) .dd-config-page .dd-settings-card .cbi-value-title{opacity:1}',
|
||||
'html[data-daede-theme="argon"]:not([data-darkmode="true"]) .dd-config-page .dd-settings-card .cbi-value-field input,html[data-daede-theme="argon"]:not([data-darkmode="true"]) .dd-config-page .dd-settings-card .cbi-value-field select,html[data-daede-theme="argon"]:not([data-darkmode="true"]) .dd-config-page .dd-settings-card .cbi-value-field textarea{background:#fff!important;border-color:rgba(50,50,93,.24)!important}',
|
||||
'html[data-daede-theme="argon"]:not([data-darkmode="true"]) .dd-config-page .dd-adv-bar{background:rgba(50,50,93,.04);border-color:rgba(50,50,93,.14);opacity:.78}',
|
||||
'@media (max-width:640px){.dd-backend-label{flex-basis:100%!important;width:100%}.dd-backend-segment{width:100%}.dd-backend-btn{flex:1;min-width:0}.dd-backend-help{margin-left:0!important}}',
|
||||
/* daed/dae settings card —— LuCI form.Map 字体/边框对齐 dd 卡片体系 */
|
||||
'.dd-settings-card{padding:10px 14px}',
|
||||
'.dd-settings-card>h2,.dd-settings-card .cbi-map>h2,.dd-settings-card .cbi-section>h3{display:none}',
|
||||
@@ -50,6 +60,10 @@ const CSS = [
|
||||
'.dd-settings-descr{font-size:11.5px;opacity:.62;margin:0 0 8px;line-height:1.45}',
|
||||
'.dd-settings-card .cbi-section{margin:0;padding:0;background:transparent;border:0;box-shadow:none}',
|
||||
'.dd-settings-card .cbi-value{padding:6px 0;border:0;min-height:0}',
|
||||
/* Argon's .td.cbi-value-field padding + 40px .cbi-checkbox make table rows
|
||||
too tall — tighten both for our compact subscription/node tables */
|
||||
'.dd-settings-card .cbi-section-table-row>td{padding:6px 10px !important}',
|
||||
'.dd-settings-card .cbi-section-table-row .cbi-checkbox{height:20px !important;min-height:0 !important}',
|
||||
'.dd-settings-card .cbi-value-title{font-size:12.5px !important;font-weight:500;opacity:.85;padding:6px 12px 6px 0;min-width:140px}',
|
||||
'.dd-settings-card .cbi-value-field input,.dd-settings-card .cbi-value-field select,.dd-settings-card .cbi-value-field textarea{font-size:12.5px !important;padding:5px 8px;border-radius:5px;border:1px solid rgba(128,128,128,.28);background:transparent;color:inherit}',
|
||||
'.dd-settings-card .cbi-value-field input:focus,.dd-settings-card .cbi-value-field select:focus,.dd-settings-card .cbi-value-field textarea:focus{border-color:rgba(56,134,161,.7);outline:0;box-shadow:0 0 0 2px rgba(56,134,161,.15)}',
|
||||
@@ -92,10 +106,14 @@ const CSS = [
|
||||
'.dd-edit-wrap{position:relative}',
|
||||
'.dd-edit-wrap .dd-editor,.dd-edit-wrap .dd-hl{margin:0;padding:10px 12px;border-width:1px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;font-size:12px;line-height:1.5;letter-spacing:0;tab-size:4;white-space:pre-wrap;word-break:break-word;box-sizing:border-box}',
|
||||
'.dd-edit-wrap .dd-hl{position:absolute;inset:0;margin:0;overflow:hidden;border:1px solid transparent;border-radius:6px 6px 0 0;pointer-events:none;background:#f6f8fa;color:#3b4252;z-index:1}',
|
||||
'.dd-edit-wrap .dd-hl code{font:inherit;white-space:inherit;word-break:inherit;display:block}',
|
||||
/* reset Argon's code{background:var(--lighter)} so the overlay inherits the
|
||||
pre background uniformly — otherwise a dark pre shows as side bars */
|
||||
'.dd-edit-wrap .dd-hl code{font:inherit;white-space:inherit;word-break:inherit;display:block;background:transparent !important}',
|
||||
'.dd-edit-wrap .dd-editor-hl{position:relative;z-index:2;color:transparent !important;background:transparent !important;caret-color:#2f7288;border:1px solid rgba(128,128,128,.28)}',
|
||||
'.dd-edit-wrap .dd-editor-hl::placeholder{color:rgba(128,128,128,.55)}',
|
||||
'.dd-edit-wrap .dd-editor-hl::selection{background:rgba(56,134,161,.25)}',
|
||||
/* keep selected text transparent too — else the browser force-colors it and
|
||||
it ghosts over the highlight pre underneath */
|
||||
'.dd-edit-wrap .dd-editor-hl::selection{background:rgba(56,134,161,.25);color:transparent}',
|
||||
'.dh-c{color:#8a919a;font-style:italic}',
|
||||
'.dh-s{color:#2a8a4a}',
|
||||
'.dh-k{color:#9a3fb5;font-weight:600}',
|
||||
@@ -117,7 +135,8 @@ const CSS = [
|
||||
'.dd-editor-footer .dd-fb-ok{color:#3da66a;font-weight:600}',
|
||||
'body.dark .dd-editor-footer,html[data-theme="dark"] .dd-editor-footer,html[data-bs-theme="dark"] .dd-editor-footer,html[data-darkmode="true"] .dd-editor-footer{border-color:rgba(255,255,255,.1);background:rgba(255,255,255,.04)}',
|
||||
'body.dark .dd-editor-footer .dd-fb-warn,html[data-theme="dark"] .dd-editor-footer .dd-fb-warn,html[data-bs-theme="dark"] .dd-editor-footer .dd-fb-warn,html[data-darkmode="true"] .dd-editor-footer .dd-fb-warn{color:#e0b34a}',
|
||||
'.dd-insert-select{font-size:11.5px;padding:4px 8px;border-radius:5px;border:1px solid rgba(128,128,128,.35);background:transparent;color:inherit;cursor:pointer}',
|
||||
/* match the action buttons' size (h25 / 11px / 5px radius) for a consistent row */
|
||||
'.dd-insert-select{font-size:11px;line-height:1.4;height:25px;padding:0 10px;border-radius:5px;border:1px solid rgba(128,128,128,.35);background:transparent;color:inherit;cursor:pointer;box-sizing:border-box}',
|
||||
'.dd-insert-select:hover{border-color:rgba(56,134,161,.55)}',
|
||||
'.dd-editor-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px}',
|
||||
'.dd-editor-status{margin-left:auto;font-size:11.5px;opacity:0;transition:opacity .25s ease;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}',
|
||||
@@ -152,24 +171,9 @@ const CSS = [
|
||||
'body.dark .dd-card,html[data-theme="dark"] .dd-card,html[data-bs-theme="dark"] .dd-card,html[data-darkmode="true"] .dd-card{border-color:rgba(255,255,255,.08);background:rgba(255,255,255,.02)}',
|
||||
'body.dark .dd-adv-bar,html[data-theme="dark"] .dd-adv-bar,html[data-bs-theme="dark"] .dd-adv-bar,html[data-darkmode="true"] .dd-adv-bar{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.10)}',
|
||||
'body.dark .dd-settings-card .cbi-value-field input,body.dark .dd-settings-card .cbi-value-field select,body.dark .dd-settings-card .cbi-value-field textarea,html[data-theme="dark"] .dd-settings-card .cbi-value-field input,html[data-theme="dark"] .dd-settings-card .cbi-value-field select,html[data-theme="dark"] .dd-settings-card .cbi-value-field textarea,html[data-bs-theme="dark"] .dd-settings-card .cbi-value-field input,html[data-bs-theme="dark"] .dd-settings-card .cbi-value-field select,html[data-bs-theme="dark"] .dd-settings-card .cbi-value-field textarea,html[data-darkmode="true"] .dd-settings-card .cbi-value-field input,html[data-darkmode="true"] .dd-settings-card .cbi-value-field select,html[data-darkmode="true"] .dd-settings-card .cbi-value-field textarea{border-color:rgba(255,255,255,.18)}',
|
||||
// Argon dark sets no DOM attr (esp. follow-system) — mirror dark rules via @media
|
||||
'@media (prefers-color-scheme: dark){',
|
||||
'.dd-edit-wrap .dd-hl{color:#c8cdd6;background:#1e2228}',
|
||||
'.dd-edit-wrap .dd-editor-hl{caret-color:#7fd0e8}',
|
||||
'.dh-c{color:#6b7280}',
|
||||
'.dh-s{color:#7ec699}',
|
||||
'.dh-k{color:#c792ea}',
|
||||
'.dh-f{color:#82c4dd}',
|
||||
'.dh-o{color:#e0a35a}',
|
||||
'.dh-g{color:#ec6fa8}',
|
||||
'.dd-editor-footer{border-color:rgba(255,255,255,.1);background:rgba(255,255,255,.04)}',
|
||||
'.dd-editor-footer .dd-fb-warn{color:#e0b34a}',
|
||||
'.dd-ph-warn-title{color:#e0b34a}',
|
||||
'.dd-ph-list .dd-ph-ln{color:#f0c763;background:rgba(217,158,0,.22)}',
|
||||
'.dd-card{border-color:rgba(255,255,255,.08);background:rgba(255,255,255,.02)}',
|
||||
'.dd-adv-bar{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.10)}',
|
||||
'.dd-settings-card .cbi-value-field input,.dd-settings-card .cbi-value-field select,.dd-settings-card .cbi-value-field textarea{border-color:rgba(255,255,255,.18)}',
|
||||
'}',
|
||||
/* No prefers-color-scheme dark block: OS dark mode must NOT force a dark
|
||||
editor when the user picked a LIGHT theme. Dark styling is driven solely
|
||||
by data-darkmode (config.js reads the real page background). */
|
||||
/* status card line-2 meta (backend · pid), below the badge+toggle line */
|
||||
'.dd-status-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}',
|
||||
/* compact icon-only row actions — the 编辑/删除 text buttons are too wide
|
||||
@@ -196,6 +200,9 @@ const CSS = [
|
||||
'.dd-settings-card .cbi-section-table-row>td:nth-child(2){flex:1 1 auto !important}',
|
||||
'.dd-settings-card .cbi-section-table-row>td:nth-child(3){flex:0 0 auto !important;text-align:center}',
|
||||
'.dd-settings-card .cbi-section-table-row>td.cbi-section-actions{flex:0 0 auto !important;display:flex;gap:4px}',
|
||||
/* clear the floated title so a Flag description gets the full row width
|
||||
instead of wrapping around it (e.g. "局域网 / 私有地址不走代理。") */
|
||||
'.dd-settings-card .cbi-value-description,.dd-settings-card .cbi-value-helptext{clear:both;width:100%}',
|
||||
'}',
|
||||
'.dd-converter{width:100%!important;max-width:1180px;margin:0 auto}',
|
||||
'.dd-conv-card{padding:18px 20px;margin-bottom:12px}',
|
||||
|
||||
@@ -55,6 +55,8 @@ const CSS = [
|
||||
'.dd-geo-row{display:grid;grid-template-columns:96px 1fr;gap:10px;align-items:center;font-size:12px;padding:6px 0}',
|
||||
'.dd-geo-row label{opacity:.75;font-weight:600}',
|
||||
'.dd-geo-row input[type=text],.dd-geo-row select{font-size:12px;padding:4px 8px;border:1px solid rgba(128,128,128,.35);border-radius:5px;background:transparent;color:inherit;width:100%}',
|
||||
/* fixed width so the Source and Auto-update selects line up consistently */
|
||||
'.dd-geo-row select{width:180px;flex:0 0 auto}',
|
||||
'.dd-geo-chk{display:flex;align-items:center;gap:6px}',
|
||||
'.dd-geo-actions{margin-top:10px;display:flex;gap:10px;align-items:center}',
|
||||
'.dd-up-log{margin-top:10px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:11px;padding:10px;border:1px solid rgba(128,128,128,.14);border-radius:8px;max-height:200px;overflow:auto;white-space:pre-wrap;word-break:break-all;display:none;background:inherit;color:#4a8c63}',
|
||||
|
||||
@@ -8,6 +8,14 @@
|
||||
|
||||
function notifyAction() {}
|
||||
|
||||
function execChecked(command, args) {
|
||||
return fs.exec(command, args || []).then(function(res) {
|
||||
if (res && res.code !== 0)
|
||||
throw new Error((res.stderr || res.stdout || ('exit ' + res.code)).trim());
|
||||
return res;
|
||||
});
|
||||
}
|
||||
|
||||
function execInit(be, action) {
|
||||
return fs.exec(be.initd, [action]).then(function(res) {
|
||||
notifyAction(action, res);
|
||||
@@ -22,30 +30,43 @@ function rejectIfOtherRunning(be, running) {
|
||||
return Promise.reject(new Error(_('%s is already running. Stop %s before starting %s because both backends share the same eBPF/cgroup attachment.').format(other, other, be.name)));
|
||||
}
|
||||
|
||||
function toggleService(be, turnOn, running) {
|
||||
function toggleService(be, turnOn) {
|
||||
const enabled = turnOn ? '1' : '0';
|
||||
const action = turnOn ? 'start' : 'stop';
|
||||
|
||||
// Only guard on start: two backends share the eBPF/cgroup attachment, so
|
||||
// starting one while the other runs is unsafe. Stopping is always allowed.
|
||||
const guard = turnOn ? rejectIfOtherRunning(be, running) : Promise.resolve();
|
||||
const guard = turnOn
|
||||
? backend.detectRunning().then(function(running) { return rejectIfOtherRunning(be, running); })
|
||||
: Promise.resolve();
|
||||
|
||||
return guard
|
||||
.then(function() { return fs.exec('/sbin/uci', ['set', be.uci + '.config.enabled=' + enabled]); })
|
||||
.then(function() { return fs.exec('/sbin/uci', ['commit', be.uci]); })
|
||||
.then(function() { return execChecked('/sbin/uci', ['set', be.uci + '.config.enabled=' + enabled]); })
|
||||
.then(function() { return execChecked('/sbin/uci', ['commit', be.uci]); })
|
||||
.then(function() {
|
||||
if (turnOn)
|
||||
return fs.exec(be.initd, ['enable']);
|
||||
return fs.exec(be.initd, ['disable']);
|
||||
return execChecked(be.initd, ['enable']);
|
||||
return execChecked(be.initd, ['disable']);
|
||||
})
|
||||
.then(function() {
|
||||
if (turnOn && be.useNetns)
|
||||
return fs.exec('/sbin/ip', ['netns', 'del', 'daens']).catch(function() {});
|
||||
})
|
||||
.then(function() { return fs.exec(be.initd, [action]); });
|
||||
.then(function() { return execChecked(be.initd, [action]); });
|
||||
}
|
||||
|
||||
function renderBackendSwitcher(ctx) {
|
||||
function waitForService(be, turnOn, attempts) {
|
||||
return backend.serviceStatus(be.name).then(function(state) {
|
||||
if (!!state.running === turnOn)
|
||||
return state;
|
||||
if (attempts <= 0)
|
||||
throw new Error(turnOn ? _('Service did not start in time.') : _('Service did not stop in time.'));
|
||||
return new Promise(function(resolve) { setTimeout(resolve, 250); })
|
||||
.then(function() { return waitForService(be, turnOn, attempts - 1); });
|
||||
});
|
||||
}
|
||||
|
||||
function renderBackendSwitcher(ctx, onSwitched, initialHint) {
|
||||
if (!ctx.installed.dae && !ctx.installed.daed)
|
||||
return null;
|
||||
|
||||
@@ -57,7 +78,7 @@ function renderBackendSwitcher(ctx) {
|
||||
])
|
||||
]);
|
||||
const segment = wrap.querySelector('.dd-backend-segment');
|
||||
const hint = E('div', { 'class': 'dd-backend-help' }, _('Switching backend stops the current service first. Click start when you want the new backend to run.'));
|
||||
const hint = E('div', { 'class': 'dd-backend-help' }, initialHint || '');
|
||||
let busy = false;
|
||||
|
||||
const showHint = function(msg) {
|
||||
@@ -69,7 +90,8 @@ function renderBackendSwitcher(ctx) {
|
||||
|
||||
['dae', 'daed'].forEach(function(name) {
|
||||
if (running && running[name])
|
||||
stops.push(fs.exec(backend.BACKENDS[name].initd, ['stop']).catch(function() {}));
|
||||
stops.push(execChecked(backend.BACKENDS[name].initd, ['stop'])
|
||||
.then(function() { return waitForService(backend.BACKENDS[name], false, 40); }));
|
||||
});
|
||||
|
||||
if (stops.length)
|
||||
@@ -107,8 +129,9 @@ function renderBackendSwitcher(ctx) {
|
||||
.then(stopIfRunning)
|
||||
.then(function() { return backend.setActiveBackend(name); })
|
||||
.then(function() {
|
||||
showHint(_('Switched to %s. Click start when you want it to run.').format(name));
|
||||
setTimeout(function() { window.location.reload(); }, 650);
|
||||
const message = _('Switched to %s. Click start when you want it to run.').format(name);
|
||||
showHint(message);
|
||||
return onSwitched ? onSwitched(name, message) : null;
|
||||
})
|
||||
.catch(function(e) {
|
||||
busy = false;
|
||||
@@ -125,13 +148,16 @@ function renderBackendSwitcher(ctx) {
|
||||
|
||||
function renderStatusCard(ctx, listenAddr) {
|
||||
const be = ctx.backend;
|
||||
let busy = false;
|
||||
let lastError = '';
|
||||
let refreshGeneration = 0;
|
||||
const body = E('div', { 'id': 'dd-status-body' }, E('em', {}, _('Collecting data…')));
|
||||
const card = E('div', { 'class': 'dd-card' }, [
|
||||
const card = E('div', { 'class': 'dd-card dd-status-card' }, [
|
||||
E('h4', { 'class': 'dd-card-title' }, _('Service Status')),
|
||||
body
|
||||
]);
|
||||
|
||||
const render = function(state, running) {
|
||||
const render = function(state) {
|
||||
while (body.firstChild) body.removeChild(body.firstChild);
|
||||
|
||||
const badge = state.running
|
||||
@@ -145,14 +171,17 @@ function renderStatusCard(ctx, listenAddr) {
|
||||
if (state.running && state.pid)
|
||||
meta.push(E('span', { 'class': 'dd-meta' }, [ E('span', { 'class': 'dd-meta-label' }, 'PID'), state.pid ]));
|
||||
|
||||
const swErr = E('span', { 'class': 'dd-meta dd-err', 'style': 'display:none' }, '');
|
||||
const swErr = E('span', { 'class': 'dd-meta dd-err', 'style': lastError ? '' : 'display:none' }, lastError);
|
||||
const sw = E('button', { 'class': 'dd-switch' + (state.running ? ' is-on' : ''), 'type': 'button', 'aria-label': _('Toggle service') }, [
|
||||
E('span', { 'class': 'dd-switch-knob' })
|
||||
]);
|
||||
sw.addEventListener('click', function(ev) {
|
||||
ev.preventDefault();
|
||||
if (sw.disabled) return;
|
||||
if (busy) return;
|
||||
refreshGeneration++;
|
||||
busy = true;
|
||||
sw.disabled = true;
|
||||
lastError = '';
|
||||
swErr.style.display = 'none';
|
||||
const turnOn = !state.running;
|
||||
/* instant optimistic feedback — the start/stop chain (esp. dae's eBPF
|
||||
@@ -161,18 +190,17 @@ function renderStatusCard(ctx, listenAddr) {
|
||||
sw.classList.toggle('is-on', turnOn);
|
||||
const lbl = sw.parentNode && sw.parentNode.querySelector('.dd-switch-label');
|
||||
if (lbl) lbl.textContent = '…';
|
||||
toggleService(be, turnOn, running)
|
||||
/* refresh as soon as the command returns, not on the next poll
|
||||
tick — this is what made feedback feel laggy */
|
||||
.then(function() { return refresh(); })
|
||||
.catch(function(e) {
|
||||
/* revert the optimistic flip and show the reason inline */
|
||||
sw.classList.toggle('is-on', !turnOn);
|
||||
if (lbl) lbl.textContent = state.running ? 'ON' : 'OFF';
|
||||
swErr.textContent = _('Toggle failed: %s').format(e.message || e);
|
||||
swErr.style.display = '';
|
||||
toggleService(be, turnOn)
|
||||
.then(function() { return waitForService(be, turnOn, 40); })
|
||||
.then(function() {
|
||||
busy = false;
|
||||
return refresh(true);
|
||||
})
|
||||
.finally(function() { sw.disabled = false; });
|
||||
.catch(function(e) {
|
||||
busy = false;
|
||||
lastError = _('Toggle failed: %s').format(e.message || e);
|
||||
return refresh(true);
|
||||
});
|
||||
});
|
||||
|
||||
/* line 1: badge + toggle (always aligned, never wraps); line 2: meta */
|
||||
@@ -256,17 +284,19 @@ function renderStatusCard(ctx, listenAddr) {
|
||||
body.appendChild(E('div', { 'class': 'dd-actions' }, actions));
|
||||
};
|
||||
|
||||
const refresh = function() {
|
||||
return Promise.all([
|
||||
backend.serviceStatus(be.name),
|
||||
backend.detectRunning()
|
||||
]).then(function(r) {
|
||||
render(r[0], r[1]);
|
||||
const refresh = function(force) {
|
||||
if (busy && !force)
|
||||
return Promise.resolve();
|
||||
const generation = refreshGeneration;
|
||||
return backend.serviceStatus(be.name).then(function(state) {
|
||||
if (generation !== refreshGeneration || (busy && !force)) return;
|
||||
render(state);
|
||||
});
|
||||
};
|
||||
|
||||
poll.add(refresh);
|
||||
refresh();
|
||||
card._ddCleanup = function() { poll.remove(refresh); };
|
||||
return card;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user