luci-mod-network: reimplement diagnostics page as client side view

Signed-off-by: Jo-Philipp Wich <jo@mein.io>

1 files changed, 137 insertions, 0 deletions

diff --git a/modules/luci-mod-network/htdocs/luci-static/resources/view/network/diagnostics.js b/modules/luci-mod-network/htdocs/luci-static/resources/view/network/diagnostics.js
new file mode 100644
index 0000000000..ee2a466151
--- /dev/null
+++ b/modules/luci-mod-network/htdocs/luci-static/resources/view/network/diagnostics.js
@@ -0,0 +1,137 @@
+'use strict';
+'require fs';
+'require ui';
+'require uci';
+
+return L.view.extend({
+	handleCommand: function(exec, args) {
+		var buttons = document.querySelectorAll('.diag-action > .cbi-button');
+
+		for (var i = 0; i < buttons.length; i++)
+			buttons[i].setAttribute('disabled', 'true');
+
+		return fs.exec(exec, args).then(function(res) {
+			var out = document.querySelector('.command-output');
+			    out.style.display = '';
+
+			L.dom.content(out, [ res.stdout || '', res.stderr || '' ]);
+		}).catch(function(err) {
+			ui.addNotification(null, E('p', [ err ]))
+		}).finally(function() {
+			for (var i = 0; i < buttons.length; i++)
+				buttons[i].removeAttribute('disabled');
+		});
+	},
+
+	handlePing: function(ev, cmd) {
+		var exec = cmd || 'ping',
+		    addr = ev.currentTarget.parentNode.previousSibling.value,
+		    args = (exec == 'ping') ? [ '-c', '5', '-W', '1', addr ] : [ '-c', '5', addr ];
+
+		return this.handleCommand(exec, args);
+	},
+
+	handleTraceroute: function(ev, cmd) {
+		var exec = cmd || 'traceroute',
+		    addr = ev.currentTarget.parentNode.previousSibling.value,
+		    args = (exec == 'traceroute') ? [ '-q', '1', '-w', '1', '-n', addr ] : [ '-q', '1', '-w', '2', '-n', addr ];
+
+		return this.handleCommand(exec, args);
+	},
+
+	handleNslookup: function(ev, cmd) {
+		var addr = ev.currentTarget.parentNode.previousSibling.value;
+
+		return this.handleCommand('nslookup', [ addr ]);
+	},
+
+	load: function() {
+		return Promise.all([
+			L.resolveDefault(fs.stat('/bin/ping6'), {}),
+			L.resolveDefault(fs.stat('/usr/bin/ping6'), {}),
+			L.resolveDefault(fs.stat('/bin/traceroute6'), {}),
+			L.resolveDefault(fs.stat('/usr/bin/traceroute6'), {}),
+			uci.load('luci')
+		]);
+	},
+
+	render: function(res) {
+		var has_ping6 = res[0].path || res[1].path,
+		    has_traceroute6 = res[2].path || res[3].path,
+			dns_host = uci.get('luci', 'diag', 'dns') || 'openwrt.org',
+			ping_host = uci.get('luci', 'diag', 'ping') || 'openwrt.org',
+			route_host = uci.get('luci', 'diag', 'route') || 'openwrt.org';
+
+		return E([], [
+			E('h2', {}, [ _('Network Utilities') ]),
+			E('div', { 'class': 'table' }, [
+				E('div', { 'class': 'tr' }, [
+					E('div', { 'class': 'td left' }, [
+						E('input', {
+							'style': 'margin:5px 0',
+							'type': 'text',
+							'value': ping_host
+						}),
+						E('span', { 'class': 'diag-action' }, [
+							has_ping6 ? new ui.ComboButton('ping', {
+								'ping': '%s %s'.format(_('IPv4'), _('Ping')),
+								'ping6': '%s %s'.format(_('IPv6'), _('Ping')),
+							}, {
+								'click': ui.createHandlerFn(this, 'handlePing'),
+								'classes': {
+									'ping': 'cbi-button cbi-button-action',
+									'ping6': 'cbi-button cbi-button-action'
+								}
+							}).render() : E('button', {
+								'class': 'cbi-button cbi-button-action',
+								'click': ui.createHandlerFn(this, 'handlePing')
+							}, [ _('Ping') ])
+						])
+					]),
+
+					E('div', { 'class': 'td left' }, [
+						E('input', {
+							'style': 'margin:5px 0',
+							'type': 'text',
+							'value': route_host
+						}),
+						E('span', { 'class': 'diag-action' }, [
+							has_traceroute6 ? new ui.ComboButton('traceroute', {
+								'traceroute': '%s %s'.format(_('IPv4'), _('Traceroute')),
+								'traceroute6': '%s %s'.format(_('IPv6'), _('Traceroute')),
+							}, {
+								'click': ui.createHandlerFn(this, 'handleTraceroute'),
+								'classes': {
+									'traceroute': 'cbi-button cbi-button-action',
+									'traceroute6': 'cbi-button cbi-button-action'
+								}
+							}).render() : E('button', {
+								'class': 'cbi-button cbi-button-action',
+								'click': ui.createHandlerFn(this, 'handleTraceroute')
+							}, [ _('Traceroute') ])
+						])
+					]),
+
+					E('div', { 'class': 'td left' }, [
+						E('input', {
+							'style': 'margin:5px 0',
+							'type': 'text',
+							'value': dns_host
+						}),
+						E('span', { 'class': 'diag-action' }, [
+							E('button', {
+								'class': 'cbi-button cbi-button-action',
+								'click': ui.createHandlerFn(this, 'handleNslookup')
+							}, [ _('Nslookup') ])
+						])
+					])
+				])
+			]),
+			E('pre', { 'class': 'command-output', 'style': 'display:none' })
+		]);
+	},
+
+	handleSaveApply: null,
+	handleSave: null,
+	handleReset: null
+});