Difuse/luci
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

luci-proto-wireguard: configuration import improvements

Browse source 
- Reword texts in import dialogs for better clarity, use different
   descriptions for full import and peer import

 - Allow importing configurations without [Peer] section

Signed-off-by: Jo-Philipp Wich <jo@mein.io>
This commit is contained in:
Jo-Philipp Wich 2022-07-23 20:24:09 +02:00
parent 4d6642b636
commit 2ae74b909b
1 changed files with 35 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

56
protocols/luci-proto-wireguard/htdocs/luci-static/resources/protocol/wireguard.js
View file

@ -188,7 +188,7 @@ return network.registerProtocol('wireguard', {
o = s.taboption('general', form.Button, '_import', _('Import configuration'), _('Imports settings from an existing WireGuard configuration file'));
o.inputtitle = _('Load configuration…');
o.onclick = function() {
return ss.handleConfigImport('client');
return ss.handleConfigImport('full');
};
// -- advanced --------------------------------------------------------------------
@ -292,8 +292,8 @@ return network.registerProtocol('wireguard', {
if (!stubValidator.apply('port', config.interface_listenport || '0'))
return _('ListenPort setting is invalid');
if (!config.peer_publickey || validateBase64(null, config.peer_publickey) !== true)
return _('PublicKey setting is missing or invalid');
if (config.peer_publickey != null && validateBase64(null, config.peer_publickey) !== true)
return _('PublicKey setting is invalid');
if (config.peer_presharedkey != null && validateBase64(null, config.peer_presharedkey) !== true)
return _('PresharedKey setting is invalid');
@ -339,7 +339,7 @@ return network.registerProtocol('wireguard', {
return;
}
if (mode == 'client') {
if (mode == 'full') {
var prv = s.formvalue(s.section, 'private_key');
if (prv && prv != config.interface_privatekey && !confirm(_('Overwrite the current settings with the imported configuration?')))
@ -411,11 +411,18 @@ return network.registerProtocol('wireguard', {
'dragover': this.handleDragConfig,
'drop': this.handleDropConfig.bind(this, mode)
}, [
E('p', _('To import a WireGuard client configuration, e.g. provided by a commercial VPN provider, drag the <em>*.conf</em> file or paste its contents into the text field below. The relevant settings will be automatically extracted from the configuration.')),
E([], (mode == 'full') ? [
E('p', _('Drag or paste a valid <em>*.conf</em> file below to configure the local WireGuard interface.'))
] : [
E('p', _('Paste or drag a WireGuard configuration (commonly <em>wg0.conf</em>) from another system below to create a matching peer entry allowing that system to connect to the local WireGuard interface.')),
E('p', _('To fully configure the local WireGuard interface from an existing (e.g. provider supplied) configuration file, use the <strong><a class="full-import" href="#">configuration import</a></strong> instead.'))
]),
E('p', [
E('textarea', {
'placeholder': _('Paste or drag WireGuard configuration file…'),
'style': 'height:5em;width:100%;white-space:pre'
'placeholder': (mode == 'full')
? _('Paste or drag supplied WireGuard configuration file…')
: _('Paste or drag WireGuard peer configuration (wg0.conf) file…'),
'style': 'height:5em;width:100%; white-space:pre'
})
]),
E('div', {
@ -424,18 +431,7 @@ return network.registerProtocol('wireguard', {
}, [''])
]);
mapNode.classList.add('hidden');
mapNode.nextElementSibling.classList.add('hidden');
headNode.appendChild(E('span', [ ' » ', _('Import configuration') ]));
mapNode.parentNode.appendChild(E([], [
nodes,
E('div', {
'class': 'right'
}, [
E('button', {
'class': 'btn',
'click': function() {
var cancelFn = function() {
nodes.parentNode.removeChild(nodes.nextSibling);
nodes.parentNode.removeChild(nodes);
mapNode.classList.remove('hidden');
@ -443,7 +439,29 @@ return network.registerProtocol('wireguard', {
headNode.removeChild(headNode.lastChild);
window.removeEventListener('dragover', handleWindowDragDropIgnore);
window.removeEventListener('drop', handleWindowDragDropIgnore);
};
var a = nodes.querySelector('a.full-import');
if (a) {
a.addEventListener('click', ui.createHandlerFn(this, function(mode) {
cancelFn();
this.handleConfigImport('full');
}));
}
mapNode.classList.add('hidden');
mapNode.nextElementSibling.classList.add('hidden');
headNode.appendChild(E('span', [ ' » ', (mode == 'full') ? _('Import configuration') : _('Import as peer') ]));
mapNode.parentNode.appendChild(E([], [
nodes,
E('div', {
'class': 'right'
}, [
E('button', {
'class': 'btn',
'click': cancelFn
}, [ _('Cancel') ]),
' ',
E('button', {