Merge pull request #5260 from dibdot/travelmate

luci-app-travelmate: sync with travelmate 2.0.5

applications/luci-app-travelmate/htdocs/luci-static/resources/view/travelmate/overview.js

@@ -10,18 +10,20 @@
 /*
 	button handling
 */
-async function handleAction(ev) {
+function handleAction(ev) {
+	var ifaceValue;
 	if (ev === 'restart') {
-		fs.exec_direct('/etc/init.d/travelmate', [ev])
+		ifaceValue = String(uci.get('travelmate', 'global', 'trm_iface') || 'trm_wwan');
+		return fs.exec('/sbin/ifup', [ifaceValue])
+			.then(fs.exec('/etc/init.d/travelmate', ['restart']))
 	}
 	if (ev === 'setup') {
-		var ifaceValue = String(uci.get('travelmate', 'global', 'trm_iface') || '');
+		ifaceValue = String(uci.get('travelmate', 'global', 'trm_iface') || '');
 		L.ui.showModal(_('Interface Wizard'), [
 			E('p', _('To use Travelmate, you have to set up an uplink interface once. This wizard creates an IPv4- and an IPv6 alias network interface with all required network- and firewall settings.')),
 			E('div', { 'class': 'left', 'style': 'display:flex; flex-direction:column' }, [
 				E('label', { 'class': 'cbi-input-text', 'style': 'padding-top:.5em' }, [
-				E('input', { 'class': 'cbi-input-text', 'id': 'iface', 'placeholder': 'trm_wwan', 'value': ifaceValue, 'maxlength': '15', 'spellcheck': 'false' }, [
+					E('input', { 'class': 'cbi-input-text', 'id': 'iface', 'placeholder': 'trm_wwan', 'value': ifaceValue, 'maxlength': '15', 'spellcheck': 'false' }),
-				]),
 					'\xa0\xa0\xa0',
 					_('The uplink interface name')
 				]),
@@ -48,7 +50,7 @@ async function handleAction(ev) {
 						var iface = document.getElementById('iface').value || 'trm_wwan',
 							zone = document.getElementById('zone').value || 'wan',
 							metric = document.getElementById('metric').value || '100';
-						L.resolveDefault(fs.exec_direct('/etc/init.d/travelmate', ['setup', iface, zone, metric]))
+						L.resolveDefault(fs.exec('/etc/init.d/travelmate', ['setup', iface, zone, metric]))
 							.then(function (res) {
 								if (res) {
 									ui.addNotification(null, E('p', res.trim() + '.'), 'error');
@@ -102,12 +104,12 @@ async function handleAction(ev) {
 								result.innerHTML = res.trim();
 							}
 							else {
-								result.innerHTML = _('The QR-Code could not be generated!');
+								result.textContent = _('The QR-Code could not be generated!');
 							}
 						});
 					}
 					else {
-						result.innerHTML = '';
+						result.textContent = '';
 					}
 				}
 			}, optionsAP);
@@ -206,12 +208,6 @@ return view.extend({
 						}
 					});
 				}
-				else {
-					if (status && status.classList.contains("spinning")) {
-						status.textContent = '-';
-						status.classList.remove("spinning");
-					}
-				}
 			});
 		}, 1);
 
@@ -222,30 +218,38 @@ return view.extend({
 		s.render = L.bind(function (view, section_id) {
 			return E('div', { 'class': 'cbi-section' }, [
 				E('h3', _('Information')),
-				E('div', { 'class': 'cbi-value', 'style': 'margin-bottom:5px' }, [
+				E('div', { 'class': 'cbi-value' }, [
 					E('label', { 'class': 'cbi-value-title', 'style': 'padding-top:0rem' }, _('Status / Version')),
-				E('div', { 'class': 'cbi-value-field', 'id': 'status', 'style': 'font-weight: bold;margin-bottom:5px;color:#37c' },'-')]),
+					E('div', { 'class': 'cbi-value-field spinning', 'id': 'status', 'style': 'color:#37c' }, '\xa0')
-				E('div', { 'class': 'cbi-value', 'style': 'margin-bottom:5px' }, [
+				]),
+				E('div', { 'class': 'cbi-value' }, [
 					E('label', { 'class': 'cbi-value-title', 'style': 'padding-top:0rem' }, _('Station ID')),
-				E('div', { 'class': 'cbi-value-field', 'id': 'station_id', 'style': 'font-weight: bold;margin-bottom:5px;color:#37c' },'-')]),
+					E('div', { 'class': 'cbi-value-field', 'id': 'station_id', 'style': 'color:#37c' }, '-')
-				E('div', { 'class': 'cbi-value', 'style': 'margin-bottom:5px' }, [
+				]),
+				E('div', { 'class': 'cbi-value' }, [
 					E('label', { 'class': 'cbi-value-title', 'style': 'padding-top:0rem' }, _('Station MAC')),
-				E('div', { 'class': 'cbi-value-field', 'id': 'station_mac', 'style': 'font-weight: bold;margin-bottom:5px;color:#37c' },'-')]),
+					E('div', { 'class': 'cbi-value-field', 'id': 'station_mac', 'style': 'color:#37c' }, '-')
-				E('div', { 'class': 'cbi-value', 'style': 'margin-bottom:5px' }, [
+				]),
+				E('div', { 'class': 'cbi-value' }, [
 					E('label', { 'class': 'cbi-value-title', 'style': 'padding-top:0rem' }, _('Station Interface')),
-				E('div', { 'class': 'cbi-value-field', 'id': 'station_interface', 'style': 'font-weight: bold;margin-bottom:5px;color:#37c' },'-')]),
+					E('div', { 'class': 'cbi-value-field', 'id': 'station_interface', 'style': 'color:#37c' }, '-')
-				E('div', { 'class': 'cbi-value', 'style': 'margin-bottom:5px' }, [
+				]),
+				E('div', { 'class': 'cbi-value' }, [
 					E('label', { 'class': 'cbi-value-title', 'style': 'padding-top:0rem' }, _('WPA Flags')),
-				E('div', { 'class': 'cbi-value-field', 'id': 'wpa_flags', 'style': 'font-weight: bold;margin-bottom:5px;color:#37c' },'-')]),
+					E('div', { 'class': 'cbi-value-field', 'id': 'wpa_flags', 'style': 'color:#37c' }, '-')
-				E('div', { 'class': 'cbi-value', 'style': 'margin-bottom:5px' }, [
+				]),
+				E('div', { 'class': 'cbi-value' }, [
 					E('label', { 'class': 'cbi-value-title', 'style': 'padding-top:0rem' }, _('Run Flags')),
-				E('div', { 'class': 'cbi-value-field', 'id': 'run_flags', 'style': 'font-weight: bold;margin-bottom:5px;color:#37c' },'-')]),
+					E('div', { 'class': 'cbi-value-field', 'id': 'run_flags', 'style': 'color:#37c' }, '-')
-				E('div', { 'class': 'cbi-value', 'style': 'margin-bottom:5px' }, [
+				]),
+				E('div', { 'class': 'cbi-value' }, [
 					E('label', { 'class': 'cbi-value-title', 'style': 'padding-top:0rem' }, _('Ext. Hooks')),
-				E('div', { 'class': 'cbi-value-field', 'id': 'ext_hooks', 'style': 'font-weight: bold;margin-bottom:5px;color:#37c' },'-')]),
+					E('div', { 'class': 'cbi-value-field', 'id': 'ext_hooks', 'style': 'color:#37c' }, '-')
-				E('div', { 'class': 'cbi-value', 'style': 'margin-bottom:5px' }, [
+				]),
+				E('div', { 'class': 'cbi-value' }, [
 					E('label', { 'class': 'cbi-value-title', 'style': 'padding-top:0rem' }, _('Last Run')),
-				E('div', { 'class': 'cbi-value-field', 'id': 'run', 'style': 'font-weight: bold;margin-bottom:5px;color:#37c' },'-')]),
+					E('div', { 'class': 'cbi-value-field', 'id': 'run', 'style': 'color:#37c' }, '-')
+				]),
 				E('div', { class: 'right' }, [
 					E('button', {
 						'class': 'cbi-button cbi-button-apply',
@@ -261,7 +265,14 @@ return view.extend({
 					}, [_('AP QR-Codes...')]),
 					'\xa0',
 					E('button', {
-						'class': 'cbi-button cbi-button-reset',
+						'class': 'cbi-button cbi-button-negative',
+						'click': ui.createHandlerFn(this, function () {
+							return handleAction('restart');
+						})
+					}, [_('Restart Interface')]),
+					'\xa0',
+					E('button', {
+						'class': 'cbi-button cbi-button-negative',
 						'click': ui.createHandlerFn(this, function () {
 							return handleAction('setup');
 						})
@@ -278,7 +289,6 @@ return view.extend({
 		s.addremove = false;
 		s.tab('general', _('General Settings'));
 		s.tab('additional', _('Additional Settings'));
-		s.tab('adv_vpn', _('VPN Settings'), _('Please note: VPN connections require the separate setup of the <em>Wireguard</em> or <em>OpenVPN</em> package.<br /><p>&#xa0;</p>'));
 		s.tab('adv_email', _('E-Mail Settings'), _('Please note: E-Mail notifications require the separate setup of the <em>mstmp</em> package.<br /><p>&#xa0;</p>'));
 
 		/*
@@ -290,8 +300,11 @@ return view.extend({
 		o = s.taboption('general', form.Flag, 'trm_debug', _('Verbose Debug Logging'), _('Enable verbose debug logging in case of any processing errors.'));
 		o.rmempty = false;
 
-		o = s.taboption('general', form.Value, 'trm_radio', _('Radio Selection'), _('Restrict travelmate to a single radio or change the overall scanning order (e.g. \'radio1 radio0\').'));
+		o = s.taboption('general', form.Value, 'trm_radio', _('Radio Selection'), _('Restrict travelmate to a single radio or change the overall scanning order.'));
-		o.placeholder = 'radio0';
+		o.value('radio0', _('use the first radio only (radio0)'));
+		o.value('radio1', _('use the second radio only (radio1)'));
+		o.value('radio0 radio1', _('use both radios, normal sort order (radio0 radio1)'));
+		o.value('radio1 radio0', _('use both radios, reverse sort order (radio1 radio0)'));
 		o.rmempty = true;
 
 		o = s.taboption('general', form.Flag, 'trm_captive', _('Captive Portal Detection'), _('Check the internet availability, handle captive portal redirections and keep the uplink connection \'alive\'.'));
@@ -307,13 +320,19 @@ return view.extend({
 		o.default = 1;
 		o.rmempty = false;
 
+		o = s.taboption('general', form.Flag, 'trm_randomize', _('Randomize MAC Addresses'), _('Generate a random unicast MAC address for each uplink connection.'));
+		o.default = 0;
+		o.rmempty = false;
+
 		o = s.taboption('general', form.Flag, 'trm_autoadd', _('AutoAdd Open Uplinks'), _('Automatically add open uplinks like hotel captive portals to your wireless config.'));
 		o.default = 0;
 		o.rmempty = false;
 
-		o = s.taboption('general', form.Flag, 'trm_randomize', _('Randomize MAC Addresses'), _('Generate a random unicast MAC address for each uplink connection.'));
+		o = s.taboption('general', form.Value, 'trm_maxautoadd', _('Limit AutoAdd'), _('Limit the maximum number of automatically added open uplinks. To disable this limitation set it to \'0\'.'));
-		o.default = 0;
+		o.depends('trm_autoadd', '1');
-		o.rmempty = false;
+		o.placeholder = '5';
+		o.datatype = 'range(0,30)';
+		o.rmempty = true;
 
 		/*
 			additional settings tab
@@ -349,19 +368,20 @@ return view.extend({
 		o.rmempty = true;
 
 		o = s.taboption('additional', form.ListValue, 'trm_captiveurl', _('Captive Portal URL'), _('The selected URL will be used for connectivity- and captive portal checks.'));
-		o.value('http://captive.apple.com', 'Apple (default)');
+		o.value('http://detectportal.firefox.com', 'Firefox (default)');
 		o.value('http://connectivity-check.ubuntu.com', 'Ubuntu');
+		o.value('http://captive.apple.com', 'Apple');
 		o.value('http://connectivitycheck.android.com/generate_204', 'Google');
 		o.value('http://www.msftncsi.com/ncsi.txt', 'Microsoft');
 		o.optional = true;
 		o.rmempty = true;
 
 		o = s.taboption('additional', form.ListValue, 'trm_useragent', _('User Agent'), _('The selected user agent will be used for connectivity- and captive portal checks.'));
-		o.value('Mozilla/5.0 (X11; Linux x86_64; rv:80.0) Gecko/20100101 Firefox/80.0', 'Firefox (default)');
+		o.value('Mozilla/5.0 (X11; Linux x86_64; rv:90.0) Gecko/20100101 Firefox/90.0', 'Firefox (default)');
-		o.value('Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/85.0.4183.83 Safari/537.36', 'Chromium');
+		o.value('Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.131 Safari/537.36', 'Chromium');
-		o.value('Mozilla/5.0 (iPhone; CPU iPhone OS 13_7 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) CriOS/85.0.4183.92 Mobile/15E148 Safari/604.1', 'Safari');
+		o.value('Mozilla/5.0 (Macintosh; Intel Mac OS X 11_5_1) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.1.2 Safari/605.1.15', 'Safari');
-		o.value('Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/85.0.4183.83 Safari/537.36 Edg/85.0.564.44', 'Edge');
+		o.value('Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.131 Safari/537.36 Edg/92.0.902.55', 'Edge');
-		o.value('Mozilla/5.0 (Linux; Android 10; SM-G970F) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/85.0.4183.81 Mobile Safari/537.36 OPR/59.1.2926.54067', 'Opera');
+		o.value('Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.131 Safari/537.36 OPR/77.0.4054.277', 'Opera');
 		o.optional = true;
 		o.rmempty = true;
 
@@ -374,30 +394,6 @@ return view.extend({
 		o.optional = true;
 		o.rmempty = true;
 
-		/*
-			advanced vpn settings tab
-		*/
-		o = s.taboption('adv_vpn', form.Flag, 'trm_vpn', _('VPN Hook'), _('Automatically handle VPN (re-) connections.'));
-		o.rmempty = false;
-
-		o = s.taboption('adv_vpn', form.ListValue, 'trm_vpnservice', _('VPN Service'));
-		o.depends('trm_vpn', '1');
-		o.value('wireguard');
-		o.value('openvpn');
-		o.rmempty = true;
-
-		o = s.taboption('adv_vpn', widgets.NetworkSelect, 'trm_vpniface', _('VPN Interface'), _('The logical vpn network interface, e.g. \'wg0\' or \'tun0\'.'));
-		o.depends('trm_vpn', '1');
-		o.unspecified = false;
-		o.nocreate = true;
-		o.rmempty = true;
-
-		o = s.taboption('adv_vpn', widgets.DeviceSelect, 'trm_landevice', _('LAN Device'), _('The lan network device, e.g. \'br-lan\'.'));
-		o.depends('trm_vpn', '1');
-		o.unspecified = false;
-		o.nocreate = true;
-		o.rmempty = true;
-
 		/*
 			advanced email settings tab
 		*/

applications/luci-app-travelmate/htdocs/luci-static/resources/view/travelmate/stations.js

@@ -8,11 +8,38 @@
 'require network';
 'require tools.widgets as widgets';
 
+/*
+	change the status of travelmate stations
+*/
+function handleToggle(sid) {
+	var w_device, w_ssid, w_bssid, t_sections, row, element, value, enabled;
+
+	w_device = uci.get('wireless', sid, 'device');
+	w_ssid = uci.get('wireless', sid, 'ssid');
+	w_bssid = uci.get('wireless', sid, 'bssid');
+	t_sections = uci.sections('travelmate', 'uplink');
+
+	for (var i = 0; i < t_sections.length; i++) {
+		if (t_sections[i].device === w_device && t_sections[i].ssid === w_ssid && t_sections[i].bssid === w_bssid) {
+			value = t_sections[i]['enabled'];
+			value = (value == 0 ? 1 : 0);
+			enabled = (value == 0 ? 'No' : 'Yes');
+			uci.set('travelmate', t_sections[i]['.name'], 'enabled', value);
+			uci.save().then(function () {
+				row = document.querySelector('.cbi-section-table-row[data-sid="%s"]'.format(sid));
+				element = row.querySelector('.cbi-value-field');
+				element.textContent = enabled;
+				row.setAttribute('style', 'opacity: 0.5; color: #37c !important;');
+			});
+		}
+	}
+}
+
 /*
 	remove wireless and stale travelmate sections
 */
 function handleRemove(sid) {
-	var w_sections, t_sections, match, changes;
+	var w_sections, t_sections, match, row;
 
 	uci.remove('wireless', sid);
 	w_sections = uci.sections('wireless', 'wifi-iface');
@@ -29,14 +56,17 @@ function handleRemove(sid) {
 			uci.remove('travelmate', t_sections[i]['.name']);
 		}
 	}
-	uci.save();
+	return uci.save().then(function () {
+		row = document.querySelector('.cbi-section-table-row[data-sid="%s"]'.format(sid));
+		row.setAttribute('style', 'opacity: 0.5; color: #a22 !important;');
+	});
 }
 
 /*
 	add missing travelmate sections
 */
 function handleSectionsAdd(iface) {
-	var w_sections, t_sections, match, changes;
+	var w_sections, t_sections, match;
 
 	w_sections = uci.sections('wireless', 'wifi-iface');
 	t_sections = uci.sections('travelmate', 'uplink');
@@ -106,7 +136,7 @@ function handleStatus() {
 	poll.add(function () {
 		L.resolveDefault(fs.stat('/var/state/travelmate.refresh'), null).then(function (res) {
 			if (res) {
-				L.resolveDefault(fs.read_direct('/var/state/travelmate.refresh'), null).then(function(res) {
+				L.resolveDefault(fs.read_direct('/var/state/travelmate.refresh'), null).then(async function (res) {
 					fs.remove('/var/state/travelmate.refresh');
 					if (res && res === 'ui_reload') {
 						location.reload();
@@ -116,18 +146,17 @@ function handleStatus() {
 							uci.unload('wireless');
 							uci.unload('travelmate');
 						}
-						return Promise.all([
+						await Promise.all([
 							uci.load('wireless'),
 							uci.load('travelmate')
-						]).then(function() {
+						]);
-							var item, value,
+						var rows, item, value;
-							container = document.querySelectorAll('.cbi-section-table-row[data-sid]');
+						rows = document.querySelectorAll('.cbi-section-table-row[data-sid]');
-							for (var i = 0; i < container.length; i++) {
+						for (var i = 0; i < rows.length; i++) {
-								item  = container[i].querySelector('.cbi-value-field[data-title="Enabled"]');
+							item = rows[i].querySelector('.cbi-value-field[data-title="Enabled"]');
-								value = handleSectionsVal('get', container[i].getAttribute('data-sid'), 'enabled');
+							value = handleSectionsVal('get', rows[i].getAttribute('data-sid'), 'enabled');
 							item.textContent = (value == 0 ? 'No' : 'Yes');
 						}
-						});
 					}
 				});
 			}
@@ -187,12 +216,13 @@ function handleStatus() {
 return view.extend({
 	load: function () {
 		return Promise.all([
+			L.resolveDefault(fs.exec_direct('/etc/init.d/travelmate', ['assoc']), {}),
 			uci.load('wireless'),
 			uci.load('travelmate')
 		]);
 	},
 
-	render: function() {
+	render: function (result) {
 		var m, s, o,
 			iface = uci.get('travelmate', 'global', 'trm_iface') || 'trm_wwan';
 
@@ -207,6 +237,7 @@ return view.extend({
 		};
 		s.tab('wireless', _('Wireless Settings'));
 		s.tab('travelmate', _('Travelmate Settings'));
+		s.tab('vpn', _('VPN Settings'));
 		s.renderRowActions = function (section_id) {
 			var btns;
 			btns = [
@@ -221,11 +252,16 @@ return view.extend({
 					'title': _('Edit this network'),
 					'click': ui.createHandlerFn(this, 'renderMoreOptionsModal', section_id)
 				}, _('Edit')),
+				E('button', {
+					'class': 'cbi-button cbi-button-apply',
+					'title': _('Enable/Disable this network'),
+					'click': ui.createHandlerFn(this, handleToggle, section_id)
+				}, _('On/Off')),
 				E('button', {
 					'class': 'cbi-button cbi-button-negative remove',
-					'title': _('Delete this network'),
+					'title': _('Remove this network'),
 					'click': ui.createHandlerFn(this, handleRemove, section_id)
-				}, _('Del'))
+				}, _('Remove'))
 			];
 			return E('td', { 'class': 'td middle cbi-section-actions' }, E('div', btns));
 		};
@@ -401,6 +437,11 @@ return view.extend({
 		/*
 			modal travelmate tab
 		*/
+		var mac, mac_array = [];
+		if (result[0]) {
+			mac_array = result[0].trim().split('\n');
+		}
+
 		o = s.taboption('travelmate', form.Value, '_ssid', _('SSID'));
 		o.modalonly = true;
 		o.uciconfig = 'travelmate';
@@ -445,6 +486,49 @@ return view.extend({
 			return handleSectionsVal('get', section_id, 'con_end');
 		}
 
+		o = s.taboption('travelmate', form.Flag, '_opensta', _('Auto Added Open Uplink'),
+			_('This option is selected by default if this uplink was added automatically and counts as \'Open Uplink\'.'));
+		o.rmempty = true;
+		o.modalonly = true;
+		o.uciconfig = 'travelmate';
+		o.ucisection = 'uplink';
+		o.ucioption = 'opensta';
+		o.cfgvalue = function (section_id) {
+			return handleSectionsVal('get', section_id, 'opensta');
+		}
+		o.write = function (section_id, value) {
+			return handleSectionsVal('set', section_id, 'opensta', value);
+		}
+		o.remove = function (section_id, value) {
+			return handleSectionsVal('set', section_id, 'opensta', value);
+		}
+
+		o = s.taboption('travelmate', form.Value, '_macaddr', _('MAC Address'),
+			_('Use the specified MAC address for this uplink.'));
+		for (var i = 0; i < mac_array.length; i++) {
+			if (mac_array[i].match(/^\s+([0-9A-Fa-f]{2}[:]?){5}[0-9A-Fa-f]{2}/)) {
+				mac = mac_array[i].slice(4).trim();
+				o.value(mac);
+			}
+		}
+		o.modalonly = true;
+		o.uciconfig = 'travelmate';
+		o.ucisection = 'uplink';
+		o.ucioption = 'macaddr';
+		o.nocreate = false;
+		o.unspecified = true;
+		o.rmempty = true;
+		o.datatype = 'macaddr';
+		o.cfgvalue = function (section_id) {
+			return handleSectionsVal('get', section_id, 'macaddr');
+		}
+		o.write = function (section_id, value) {
+			return handleSectionsVal('set', section_id, 'macaddr', value);
+		}
+		o.remove = function (section_id, value) {
+			return handleSectionsVal('set', section_id, 'macaddr', value);
+		}
+
 		o = s.taboption('travelmate', form.Value, '_con_start_expiry', _('Connection Start Expiry'),
 			_('Automatically disable the uplink after <em>n</em> minutes, e.g. for timed connections.<br /> \
 			The default of \'0\' disables this feature.'));
@@ -538,6 +622,56 @@ return view.extend({
 			return handleSectionsVal('del', section_id, 'script_args');
 		}
 
+		/*
+			modal vpn tab
+		*/
+		o = s.taboption('vpn', form.Flag, '_vpn', _('VPN Hook'), _('Automatically handle VPN connections.<br /> \
+			Please note: This feature requires the additional configuration of <em>Wireguard</em> or <em>OpenVPN</em>.'));
+		o.rmempty = true;
+		o.modalonly = true;
+		o.uciconfig = 'travelmate';
+		o.ucisection = 'uplink';
+		o.ucioption = 'vpn';
+		o.cfgvalue = function (section_id) {
+			return handleSectionsVal('get', section_id, 'vpn');
+		}
+		o.write = function (section_id, value) {
+			return handleSectionsVal('set', section_id, 'vpn', value);
+		}
+		o.remove = function (section_id, value) {
+			return handleSectionsVal('set', section_id, 'vpn', value);
+		}
+
+		o = s.taboption('vpn', form.ListValue, '_vpnservice', _('VPN Service'));
+		o.value('wireguard');
+		o.value('openvpn');
+		o.optional = true;
+		o.modalonly = true;
+		o.uciconfig = 'travelmate';
+		o.ucisection = 'uplink';
+		o.ucioption = 'vpnservice';
+		o.cfgvalue = function (section_id) {
+			return handleSectionsVal('get', section_id, 'vpnservice');
+		}
+		o.write = function (section_id, value) {
+			return handleSectionsVal('set', section_id, 'vpnservice', value);
+		}
+
+		o = s.taboption('vpn', widgets.NetworkSelect, '_vpniface', _('VPN Interface'), _('The logical vpn network interface, e.g. \'wg0\' or \'tun0\'.'));
+		o.unspecified = false;
+		o.nocreate = true;
+		o.optional = true;
+		o.modalonly = true;
+		o.uciconfig = 'travelmate';
+		o.ucisection = 'uplink';
+		o.ucioption = 'vpniface';
+		o.cfgvalue = function (section_id) {
+			return handleSectionsVal('get', section_id, 'vpniface');
+		}
+		o.write = function (section_id, value) {
+			return handleSectionsVal('set', section_id, 'vpniface', value);
+		}
+
 		/*
 			scan buttons
 		*/
@@ -551,7 +685,7 @@ return view.extend({
 					radio = radios[i].sid;
 					if (radio) {
 						btns.push(E('button', {
-							'class': 'cbi-button cbi-button-apply',
+							'class': 'cbi-button cbi-button-positive',
 							'id': radio,
 							'click': ui.createHandlerFn(this, 'handleScan', radio)
 						}, [_('Scan on ' + radio + '...')]),
@@ -598,8 +732,8 @@ return view.extend({
 
 			return L.resolveDefault(fs.exec_direct('/etc/init.d/travelmate', ['scan', radio]), null)
 				.then(L.bind(function (res) {
-				if (res) {
 					var lines, strength, channel, encryption, tbl_encryption, bssid, ssid, tbl_ssid, rows = [];
+					if (res) {
 						lines = res.trim().split('\n');
 						for (var i = 0; i < lines.length; i++) {
 							if (lines[i].match(/^\s+[0-9]/)) {
@@ -680,16 +814,16 @@ return view.extend({
 									]);
 								}
 							}
-						else if (lines[i] === '::: No scan results') {
+							else if (lines[i] === '::: Empty resultset') {
 								rows.push([
-								'No scan results'
+									'No scan results (empty resultset)'
 								]);
 							}
 						}
 					}
 					else {
 						rows.push([
-						'No scan results'
+							'No scan results (timeout)'
 						]);
 					}
 					cbi_update_table(table, rows);
@@ -700,7 +834,6 @@ return view.extend({
 			modal 'add' dialog
 		*/
 		s.handleAdd = function (radio, iface, ssid, bssid, encryption, ev) {
-			ui.hideModal;
 			var m2, s2, o2;
 
 			m2 = new form.Map('wireless'),
@@ -830,7 +963,7 @@ return view.extend({
 						'\xa0',
 						E('button', {
 							'class': 'cbi-button cbi-button-positive important',
-							'click': ui.createHandlerFn(this, 'handleSave', m2)
+							'click': ui.createHandlerFn(this, 'handleCommit', m2)
 						}, _('Save'))
 					])
 				]);
@@ -840,7 +973,7 @@ return view.extend({
 		/*
 			save new uplink
 		*/
-		s.handleSave = function(map, ev) {
+		s.handleCommit = function (map, ev) {
 			var w_sections = uci.sections('wireless', 'wifi-iface'),
 				device = L.toArray(map.lookupOption('device', '_add_trm'))[0].formvalue('_add_trm'),
 				network = L.toArray(map.lookupOption('network', '_add_trm'))[0].formvalue('_add_trm'),
@@ -884,8 +1017,14 @@ return view.extend({
 			uci.set('wireless', new_sid, 'key', password);
 			uci.set('wireless', new_sid, 'disabled', '1');
 			handleSectionsAdd(network);
-			uci.save();
+			uci.save()
-			ui.hideModal();
+				.then(L.bind(this.map.load, this.map))
+				.then(L.bind(this.map.reset, this.map))
+				.then(function () {
+					var row = document.querySelector('.cbi-section-table-row[data-sid="%s"]'.format(new_sid));
+					row.setAttribute('style', 'opacity: 0.5; color: #4a4 !important;');
+				})
+				.then(ui.hideModal)
 		};
 		return m.render();
 	},

applications/luci-app-travelmate/root/usr/share/rpcd/acl.d/luci-app-travelmate.json

@@ -16,8 +16,10 @@
 				"/tmp/trm_runtime.json": [ "read" ],
 				"/sbin/logread -e trm-": [ "exec" ],
 				"/usr/sbin/logread -e trm-": [ "exec" ],
+				"/usr/sbin/ifup *": [ "exec" ],
 				"/etc/init.d/travelmate reload" : [ "exec" ],
 				"/etc/init.d/travelmate restart" : [ "exec" ],
+				"/etc/init.d/travelmate assoc" : [ "exec" ],
 				"/etc/init.d/travelmate setup [0-9a-z_]* [0-9a-z_]* [0-9]*" : [ "exec" ],
 				"/etc/init.d/travelmate scan radio[0-9]" : [ "exec" ],
 				"/usr/bin/qrencode --inline --8bit --type=SVG --output=- *" : [ "exec" ]