luci-mod-system: reimplement flashops as client side view

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

7 files changed, 595 insertions, 496 deletions

diff --git a/modules/luci-base/luasrc/sys.lua b/modules/luci-base/luasrc/sys.lua
index 5aede84848..f82cd78cb7 100644
--- a/modules/luci-base/luasrc/sys.lua
+++ b/modules/luci-base/luasrc/sys.lua
@@ -25,69 +25,6 @@ end
 
 exec = luci.util.exec
 
-function mounts()
-	local data = {}
-	local k = {"fs", "blocks", "used", "available", "percent", "mountpoint"}
-	local ps = luci.util.execi("df")
-
-	if not ps then
-		return
-	else
-		ps()
-	end
-
-	for line in ps do
-		local row = {}
-
-		local j = 1
-		for value in line:gmatch("[^%s]+") do
-			row[k[j]] = value
-			j = j + 1
-		end
-
-		if row[k[1]] then
-
-			-- this is a rather ugly workaround to cope with wrapped lines in
-			-- the df output:
-			--
-			--	/dev/scsi/host0/bus0/target0/lun0/part3
-			--                   114382024  93566472  15005244  86% /mnt/usb
-			--
-
-			if not row[k[2]] then
-				j = 2
-				line = ps()
-				for value in line:gmatch("[^%s]+") do
-					row[k[j]] = value
-					j = j + 1
-				end
-			end
-
-			table.insert(data, row)
-		end
-	end
-
-	return data
-end
-
-function mtds()
-	local data = {}
-
-	if fs.access("/proc/mtd") then
-		for l in io.lines("/proc/mtd") do
-			local d, s, e, n = l:match('^([^%s]+)%s+([^%s]+)%s+([^%s]+)%s+"([^%s]+)"')
-			if s and n then
-				local d = {}
-				d.size = tonumber(s, 16)
-				d.name = n
-				table.insert(data, d)
-			end
-		end
-	end
-
-	return data
-end
-
 -- containing the whole environment is returned otherwise this function returns
 -- the corresponding string value for the given name or nil if no such variable
 -- exists.
diff --git a/modules/luci-base/root/usr/share/rpcd/acl.d/luci-base.json b/modules/luci-base/root/usr/share/rpcd/acl.d/luci-base.json
index af06d840d0..31c154cbcb 100644
--- a/modules/luci-base/root/usr/share/rpcd/acl.d/luci-base.json
+++ b/modules/luci-base/root/usr/share/rpcd/acl.d/luci-base.json
@@ -20,15 +20,22 @@
 	"luci-access": {
 		"description": "Grant access to basic LuCI procedures",
 		"read": {
+			"cgi-io": [ "backup", "download" ],
 			"file": {
 				"/": [ "list" ],
 				"/*": [ "list" ],
+				"/dev/mtdblock*": [ "read" ],
 				"/etc/crontabs/root": [ "read" ],
 				"/etc/dropbear/authorized_keys": [ "read" ],
 				"/etc/filesystems": [ "read" ],
 				"/etc/rc.local": [ "read" ],
+				"/etc/sysupgrade.conf": [ "read" ],
 				"/proc/filesystems": [ "read" ],
-				"/proc/sys/kernel/hostname": [ "read" ]
+				"/proc/mtd": [ "read" ],
+				"/proc/partitions": [ "read" ],
+				"/proc/sys/kernel/hostname": [ "read" ],
+				"/sys/devices/virtual/mtd/*/name": [ "read" ],
+				"/sys/devices/virtual/ubi/*/name": [ "read" ]
 			},
 			"ubus": {
 				"file": [ "list", "read", "stat" ],
@@ -42,13 +49,20 @@
 			"uci": [ "*" ]
 		},
 		"write": {
-			"cgi-io": [ "upload", "/etc/luci-uploads/*" ],
+			"cgi-io": [ "upload" ],
 			"file": {
 				"/etc/crontabs/root": [ "write" ],
 				"/etc/dropbear/authorized_keys": [ "write" ],
 				"/etc/luci-uploads/*": [ "write" ],
 				"/etc/rc.local": [ "write" ],
-				"/sbin/block": [ "exec" ]
+				"/etc/sysupgrade.conf": [ "write" ],
+				"/sbin/block": [ "exec" ],
+				"/sbin/firstboot": [ "exec" ],
+				"/sbin/reboot": [ "exec" ],
+				"/sbin/sysupgrade": [ "exec" ],
+				"/bin/tar": [ "exec" ],
+				"/tmp/backup.tar.gz": [ "write" ],
+				"/tmp/firmware.bin": [ "write" ]
 			},
 			"ubus": {
 				"file": [ "write", "remove", "exec" ],
diff --git a/modules/luci-mod-system/htdocs/luci-static/resources/view/system/flash.js b/modules/luci-mod-system/htdocs/luci-static/resources/view/system/flash.js
new file mode 100644
index 0000000000..c40a5d3c5a
--- /dev/null
+++ b/modules/luci-mod-system/htdocs/luci-static/resources/view/system/flash.js
@@ -0,0 +1,577 @@
+'use strict';
+'require form';
+'require rpc';
+
+var callFileStat, callFileRead, callFileWrite, callFileExec, callFileRemove;
+
+callFileStat = rpc.declare({
+	object: 'file',
+	method: 'stat',
+	params: [ 'path' ],
+	expect: { '': {} }
+});
+
+callFileRead = rpc.declare({
+	object: 'file',
+	method: 'read',
+	params: [ 'path' ],
+	expect: { data: '' },
+	filter: function(s) { return (s || '').trim() }
+});
+
+callFileWrite = rpc.declare({
+	object: 'file',
+	method: 'write',
+	params: [ 'path', 'data' ]
+});
+
+callFileExec = rpc.declare({
+	object: 'file',
+	method: 'exec',
+	params: [ 'command', 'params' ],
+	expect: { '': { code: -1 } }
+});
+
+callFileRemove = rpc.declare({
+	object: 'file',
+	method: 'remove',
+	params: [ 'path' ]
+});
+
+function pingDevice(proto, ipaddr) {
+	var target = '%s://%s%s?%s'.format(proto || 'http', ipaddr || window.location.host, L.resource('icons/loading.gif'), Math.random());
+
+	return new Promise(function(resolveFn, rejectFn) {
+		var img = new Image();
+
+		img.onload = resolveFn;
+		img.onerror = rejectFn;
+
+		window.setTimeout(rejectFn, 1000);
+
+		img.src = target;
+	});
+}
+
+function awaitReconnect(/* ... */) {
+	var ipaddrs = arguments.length ? arguments : [ window.location.host ];
+
+	window.setTimeout(function() {
+		L.Poll.add(function() {
+			var tasks = [], reachable = false;
+
+			for (var i = 0; i < 2; i++)
+				for (var j = 0; j < ipaddrs.length; j++)
+					tasks.push(pingDevice(i ? 'https' : 'http', ipaddrs[j])
+						.then(function(ev) { reachable = ev.target.src.replace(/^(https?:\/\/[^\/]+).*$/, '$1/') }, function() {}));
+
+			return Promise.all(tasks).then(function() {
+				if (reachable) {
+					L.Poll.stop();
+					window.location = reachable;
+				}
+			});
+		})
+	}, 5000);
+}
+
+function fileUpload(node, path) {
+	return new Promise(function(resolveFn, rejectFn) {
+		L.ui.showModal(_('Uploading file…'), [
+			E('p', _('Please select the file to upload.')),
+			E('div', { 'style': 'display:flex' }, [
+				E('div', { 'class': 'left', 'style': 'flex:1' }, [
+					E('input', {
+						type: 'file',
+						style: 'display:none',
+						change: function(ev) {
+							L.dom.parent(ev.target, '.modal').querySelector('.cbi-button-action.important').disabled = false;
+						}
+					}),
+					E('button', {
+						'class': 'btn',
+						'click': function(ev) {
+							ev.target.previousElementSibling.click();
+						}
+					}, [ _('Browse…') ])
+				]),
+				E('div', { 'class': 'right', 'style': 'flex:1' }, [
+					E('button', {
+						'class': 'btn',
+						'click': function() {
+							L.ui.hideModal();
+							rejectFn(new Error('Upload has been cancelled'));
+						}
+					}, [ _('Cancel') ]),
+					' ',
+					E('button', {
+						'class': 'btn cbi-button-action important',
+						'disabled': true,
+						'click': function(ev) {
+							var input = L.dom.parent(ev.target, '.modal').querySelector('input[type="file"]');
+
+							if (!input.files[0])
+								return;
+
+							var progress = E('div', { 'class': 'cbi-progressbar', 'title': '0%' }, E('div', { 'style': 'width:0' }));
+
+							L.ui.showModal(_('Uploading file…'), [ progress ]);
+
+							var data = new FormData();
+
+							data.append('sessionid', rpc.getSessionID());
+							data.append('filename', path);
+							data.append('filedata', input.files[0]);
+
+							L.Request.post('/cgi-bin/cgi-upload', data, {
+								timeout: 0,
+								progress: function(pev) {
+									var percent = (pev.loaded / pev.total) * 100;
+
+									node.data = '%.2f%%'.format(percent);
+
+									progress.setAttribute('title', '%.2f%%'.format(percent));
+									progress.firstElementChild.style.width = '%.2f%%'.format(percent);
+								}
+							}).then(function(res) {
+								var reply = res.json();
+
+								L.ui.hideModal();
+
+								if (L.isObject(reply) && reply.failure) {
+									L.ui.addNotification(null, E('p', _('Upload request failed: %s').format(reply.message)));
+									rejectFn(new Error(reply.failure));
+								}
+								else {
+									resolveFn(reply);
+								}
+							}, function(err) {
+								L.ui.hideModal();
+								rejectFn(err);
+							});
+						}
+					}, [ _('Upload') ])
+				])
+			])
+		]);
+	});
+}
+
+function findStorageSize(procmtd, procpart) {
+	var kernsize = 0, rootsize = 0, wholesize = 0;
+
+	procmtd.split(/\n/).forEach(function(ln) {
+		var match = ln.match(/^mtd\d+: ([0-9a-f]+) [0-9a-f]+ "(.+)"$/);
+
+		switch (match ? match[2] : '') {
+		case 'linux':
+		case 'firmware':
+			wholesize = parseInt(match[1], 16);
+			break;
+
+		case 'kernel':
+		case 'kernel0':
+			kernsize = parseInt(match[1], 16);
+			break;
+
+		case 'rootfs':
+		case 'rootfs0':
+		case 'ubi':
+		case 'ubi0':
+			rootsize = parseInt(match[1], 16);
+			break;
+		}
+	});
+
+	if (wholesize > 0)
+		return wholesize;
+	else if (kernsize > 0 && rootsize > kernsize)
+		return kernsize + rootsize;
+
+	procpart.split(/\n/).forEach(function(ln) {
+		var match = ln.match(/^\s*\d+\s+\d+\s+(\d+)\s+(\S+)$/);
+		if (match) {
+			var size = parseInt(match[1], 10);
+
+			if (!match[2].match(/\d/) && size > 2048 && wholesize == 0)
+				wholesize = size * 1024;
+		}
+	});
+
+	return wholesize;
+}
+
+
+var mapdata = { actions: {}, config: {} };
+
+return L.view.extend({
+	load: function() {
+		var max_mtd = 10, max_ubi = 2, max_ubi_vol = 4;
+		var tasks = [
+			callFileStat('/lib/upgrade/platform.sh'),
+			callFileRead('/proc/sys/kernel/hostname'),
+			callFileRead('/proc/mtd'),
+			callFileRead('/proc/partitions')
+		];
+
+		for (var i = 0; i < max_mtd; i++)
+			tasks.push(callFileRead('/sys/devices/virtual/mtd/mtd%d/name'.format(i)));
+
+		for (var i = 0; i < max_ubi; i++)
+			for (var j = 0; j < max_ubi_vol; j++)
+				tasks.push(callFileRead('/sys/devices/virtual/ubi/ubi%d/ubi%d_%d/name'.format(i, i, j)));
+
+		return Promise.all(tasks);
+	},
+
+	handleBackup: function(ev) {
+		var form = E('form', {
+			method: 'post',
+			action: '/cgi-bin/cgi-backup',
+			enctype: 'application/x-www-form-urlencoded'
+		}, E('input', { type: 'hidden', name: 'sessionid', value: rpc.getSessionID() }));
+
+		ev.currentTarget.parentNode.appendChild(form);
+
+		form.submit();
+		form.parentNode.removeChild(form);
+	},
+
+	handleReset: function(ev) {
+		if (!confirm(_('Do you really want to erase all settings?')))
+			return;
+
+		return callFileExec('/sbin/firstboot', [ '-r', '-y' ]).then(function(res) {
+			if (res.code != 0)
+				return L.ui.addNotification(null, E('p', _('The firstboot command failed with code %d').format(res.code)));
+
+			L.ui.showModal(_('Erasing...'), [
+				E('p', { 'class': 'spinning' }, _('The system is erasing the configuration partition now and will reboot itself when finished.'))
+			]);
+
+			awaitReconnect('192.168.1.1', 'openwrt.lan');
+		});
+	},
+
+	handleRestore: function(ev) {
+		return fileUpload(ev.target, '/tmp/backup.tar.gz')
+			.then(L.bind(function(btn, res) {
+				btn.firstChild.data = _('Checking archive…');
+				return callFileExec('/bin/tar', [ '-tzf', '/tmp/backup.tar.gz' ]);
+			}, this, ev.target))
+			.then(L.bind(function(btn, res) {
+				if (res.code != 0) {
+					L.ui.addNotification(null, E('p', _('The uploaded backup archive is not readable')));
+					return callFileRemove('/tmp/backup.tar.gz');
+				}
+
+				L.ui.showModal(_('Apply backup?'), [
+					E('p', _('The uploaded backup archive appears to be valid and contains the files listed below. Press "Continue" to restore the backup and reboot, or "Cancel" to abort the operation.')),
+					E('pre', {}, [ res.stdout ]),
+					E('div', { 'class': 'right' }, [
+						E('button', {
+							'class': 'btn',
+							'click': L.ui.createHandlerFn(this, function(ev) {
+								return callFileRemove('/tmp/backup.tar.gz').finally(L.ui.hideModal);
+							})
+						}, [ _('Cancel') ]), ' ',
+						E('button', {
+							'class': 'btn cbi-button-action important',
+							'click': L.ui.createHandlerFn(this, 'handleRestoreConfirm', btn)
+						}, [ _('Continue') ])
+					])
+				]);
+			}, this, ev.target))
+			.finally(L.bind(function(btn, input) {
+				btn.firstChild.data = _('Upload archive...');
+			}, this, ev.target));
+	},
+
+	handleRestoreConfirm: function(btn, ev) {
+		return callFileExec('/sbin/sysupgrade', [ '--restore-backup', '/tmp/backup.tar.gz' ])
+			.then(L.bind(function(btn, res) {
+				if (res.code != 0) {
+					L.ui.addNotification(null, [
+						E('p', _('The restore command failed with code %d').format(res.code)),
+						res.stderr ? E('pre', {}, [ res.stderr ]) : ''
+					]);
+					L.raise('Error', 'Unpack failed');
+				}
+
+				btn.firstChild.data = _('Rebooting…');
+				return callFileExec('/sbin/reboot');
+			}, this, ev.target))
+			.then(L.bind(function(res) {
+				if (res.code != 0) {
+					L.ui.addNotification(null, E('p', _('The reboot command failed with code %d').format(res.code)));
+					L.raise('Error', 'Reboot failed');
+				}
+
+				L.ui.showModal(_('Rebooting…'), [
+					E('p', { 'class': 'spinning' }, _('The system is rebooting now. If the restored configuration changed the current LAN IP address, you might need to reconnect manually.'))
+				]);
+
+				awaitReconnect(window.location.host, '192.168.1.1', 'openwrt.lan');
+			}, this))
+			.catch(function() { btn.firstChild.data = _('Upload archive...') });
+	},
+
+	handleBlock: function(hostname, ev) {
+		var mtdblock = L.dom.parent(ev.target, '.cbi-section').querySelector('[data-name="mtdselect"] select').value;
+		var form = E('form', {
+			'method': 'post',
+			'action': '/cgi-bin/cgi-download',
+			'enctype': 'application/x-www-form-urlencoded'
+		}, [
+			E('input', { 'type': 'hidden', 'name': 'sessionid', 'value': rpc.getSessionID() }),
+			E('input', { 'type': 'hidden', 'name': 'path',      'value': '/dev/mtdblock%d'.format(mtdblock) }),
+			E('input', { 'type': 'hidden', 'name': 'filename',  'value': '%s.mtd%d.bin'.format(hostname, mtdblock) })
+		]);
+
+		ev.currentTarget.parentNode.appendChild(form);
+
+		form.submit();
+		form.parentNode.removeChild(form);
+	},
+
+	handleSysupgrade: function(storage_size, ev) {
+		return fileUpload(ev.target.firstChild, '/tmp/firmware.bin')
+			.then(L.bind(function(btn, reply) {
+				btn.firstChild.data = _('Checking image…');
+
+				L.ui.showModal(_('Checking image…'), [
+					E('span', { 'class': 'spinning' }, _('Verifying the uploaded image file.'))
+				]);
+
+				return callFileExec('/sbin/sysupgrade', [ '--test', '/tmp/firmware.bin' ])
+					.then(function(res) { return [ reply, res ] });
+			}, this, ev.target))
+			.then(L.bind(function(btn, res) {
+				var keep = document.querySelector('[data-name="keep"] input[type="checkbox"]'),
+				    force = E('input', { type: 'checkbox' }),
+				    is_invalid = (res[1].code != 0),
+				    is_too_big = (storage_size > 0 && res[0].size > storage_size),
+				    body = [];
+
+				body.push(E('p', _('The flash image was uploaded. Below is the checksum and file size listed, compare them with the original file to ensure data integrity. <br /> Click "Proceed" below to start the flash procedure.')));
+				body.push(E('ul', {}, [
+					res[0].size ? E('li', {}, '%s: %1024.2mB'.format(_('Size'), res[0].size)) : '',
+					res[0].checksum ? E('li', {}, '%s: %s'.format(_('MD5'), res[0].checksum)) : '',
+					res[0].sha256sum ? E('li', {}, '%s: %s'.format(_('SHA256'), res[0].sha256sum)) : '',
+					E('li', {}, keep.checked ? _('Configuration files will be kept') : _('Caution: Configuration files will be erased'))
+				]));
+
+				if (is_invalid || is_too_big)
+					body.push(E('hr'));
+
+				if (is_too_big)
+					body.push(E('p', { 'class': 'alert-message' }, [
+						_('It appears that you are trying to flash an image that does not fit into the flash memory, please verify the image file!')
+					]));
+
+				if (is_invalid)
+					body.push(E('p', { 'class': 'alert-message' }, [
+						res[1].stderr ? res[1].stderr : '',
+						res[1].stderr ? E('br') : '',
+						res[1].stderr ? E('br') : '',
+						_('The uploaded image file does not contain a supported format. Make sure that you choose the generic image format for your platform.')
+					]));
+
+				if (is_invalid || is_too_big)
+					body.push(E('p', {}, E('label', { 'class': 'btn alert-message danger' }, [
+						force, ' ', _('Force upgrade'),
+						E('br'), E('br'),
+						_('Select \'Force upgrade\' to flash the image even if the image format check fails. Use only if you are sure that the firmware is correct and meant for your device!')
+					])));
+
+				var cntbtn = E('button', {
+					'class': 'btn cbi-button-action important',
+					'click': L.ui.createHandlerFn(this, 'handleSysupgradeConfirm', btn, keep.checked, force.checked),
+					'disabled': (is_invalid || is_too_big) ? true : null
+				}, [ _('Continue') ]);
+
+				body.push(E('div', { 'class': 'right' }, [
+					E('button', {
+						'class': 'btn',
+						'click': L.ui.createHandlerFn(this, function(ev) {
+							return callFileRemove('/tmp/firmware.bin').finally(L.ui.hideModal);
+						})
+					}, [ _('Cancel') ]), ' ', cntbtn
+				]));
+
+				force.addEventListener('change', function(ev) {
+					cntbtn.disabled = !ev.target.checked;
+				});
+
+				L.ui.showModal(_('Flash image?'), body);
+			}, this, ev.target))
+			.finally(L.bind(function(btn) {
+				btn.firstChild.data = _('Flash image...');
+			}, this, ev.target));
+	},
+
+	handleSysupgradeConfirm: function(btn, keep, force, ev) {
+		btn.firstChild.data = _('Flashing…');
+
+		L.ui.showModal(_('Flashing…'), [
+			E('p', { 'class': 'spinning' }, _('The system is flashing now.<br /> DO NOT POWER OFF THE DEVICE!<br /> Wait a few minutes before you try to reconnect. It might be necessary to renew the address of your computer to reach the device again, depending on your settings.'))
+		]);
+
+		var opts = [];
+
+		if (!keep)
+			opts.push('-n');
+
+		if (force)
+			opts.push('--force');
+
+		opts.push('/tmp/firmware.bin');
+
+		/* Currently the sysupgrade rpc call will not return, hence no promise handling */
+		callFileExec('/sbin/sysupgrade', opts);
+
+		awaitReconnect(window.location.host, '192.168.1.1', 'openwrt.lan');
+	},
+
+	handleBackupList: function(ev) {
+		return callFileExec('/sbin/sysupgrade', [ '--list-backup' ]).then(function(res) {
+			if (res.code != 0) {
+				L.ui.addNotification(null, [
+					E('p', _('The sysupgrade command failed with code %d').format(res.code)),
+					res.stderr ? E('pre', {}, [ res.stderr ]) : ''
+				]);
+				L.raise('Error', 'Sysupgrade failed');
+			}
+
+			L.ui.showModal(_('Backup file list'), [
+				E('p', _('Below is the determined list of files to backup. It consists of changed configuration files marked by opkg, essential base files and the user defined backup patterns.')),
+				E('ul', {}, (res.stdout || '').trim().split(/\n/).map(function(ln) { return E('li', {}, ln) })),
+				E('div', { 'class': 'right' }, [
+					E('button', {
+						'class': 'btn',
+						'click': L.ui.hideModal
+					}, [ _('Dismiss') ])
+				])
+			], 'cbi-modal');
+		});
+	},
+
+	handleBackupSave: function(m, ev) {
+		return m.save(function() {
+			return callFileWrite('/etc/sysupgrade.conf', mapdata.config.editlist.trim().replace(/\r\n/g, '\n') + '\n');
+		}).then(function() {
+			L.ui.addNotification(null, E('p', _('Contents have been saved.')), 'info');
+		}).catch(function(e) {
+			L.ui.addNotification(null, E('p', _('Unable to save contents: %s').format(e)));
+		});
+	},
+
+	render: function(rpc_replies) {
+		var has_sysupgrade = (rpc_replies[0].type == 'file'),
+		    hostname = rpc_replies[1],
+		    procmtd = rpc_replies[2],
+		    procpart = rpc_replies[3],
+		    has_rootfs_data = rpc_replies.slice(4).filter(function(n) { return n == 'rootfs_data' })[0],
+		    storage_size = findStorageSize(procmtd, procpart),
+		    m, s, o, ss;
+
+		m = new form.JSONMap(mapdata, _('Flash operations'));
+		m.tabbed = true;
+
+		s = m.section(form.NamedSection, 'actions', _('Actions'));
+
+
+		o = s.option(form.SectionValue, 'actions', form.NamedSection, 'actions', 'actions', _('Backup'), _('Click "Generate archive" to download a tar archive of the current configuration files.'));
+		ss = o.subsection;
+
+		o = ss.option(form.Button, 'dl_backup', _('Download backup'));
+		o.inputstyle = 'action important';
+		o.inputtitle = _('Generate archive');
+		o.onclick = this.handleBackup;
+
+
+		o = s.option(form.SectionValue, 'actions', form.NamedSection, 'actions', 'actions', _('Restore'), _('To restore configuration files, you can upload a previously generated backup archive here. To reset the firmware to its initial state, click "Perform reset" (only possible with squashfs images).'));
+		ss = o.subsection;
+
+		if (has_rootfs_data) {
+			o = ss.option(form.Button, 'reset', _('Reset to defaults'));
+			o.inputstyle = 'negative important';
+			o.inputtitle = _('Perform reset');
+			o.onclick = this.handleReset;
+		}
+
+		o = ss.option(form.Button, 'restore', _('Restore backup'), _('Custom files (certificates, scripts) may remain on the system. To prevent this, perform a factory-reset first.'));
+		o.inputstyle = 'action important';
+		o.inputtitle = _('Upload archive...');
+		o.onclick = L.bind(this.handleRestore, this);
+
+
+		o = s.option(form.SectionValue, 'actions', form.NamedSection, 'actions', 'actions', _('Save mtdblock contents'), _('Click "Save mtdblock" to download specified mtdblock file. (NOTE: THIS FEATURE IS FOR PROFESSIONALS! )'));
+		ss = o.subsection;
+
+		o = ss.option(form.ListValue, 'mtdselect', _('Choose mtdblock'));
+		procmtd.split(/\n/).forEach(function(ln) {
+			var match = ln.match(/^mtd(\d+): .+ "(.+?)"$/);
+			if (match)
+				o.value(match[1], match[2]);
+		});
+
+		o = ss.option(form.Button, 'mtddownload', _('Download mtdblock'));
+		o.inputstyle = 'action important';
+		o.inputtitle = _('Save mtdblock');
+		o.onclick = L.bind(this.handleBlock, this, hostname);
+
+
+		o = s.option(form.SectionValue, 'actions', form.NamedSection, 'actions', 'actions', _('Flash new firmware image'),
+			has_sysupgrade
+				? _('Upload a sysupgrade-compatible image here to replace the running firmware. Check "Keep settings" to retain the current configuration (requires a compatible firmware image).')
+				: _('Sorry, there is no sysupgrade support present; a new firmware image must be flashed manually. Please refer to the wiki for device specific install instructions.'));
+
+		ss = o.subsection;
+
+		if (has_sysupgrade) {
+			o = ss.option(form.Flag, 'keep', _('Keep settings'));
+			o.default = o.enabled;
+
+			o = ss.option(form.Button, 'sysupgrade', _('Image'));
+			o.inputstyle = 'action important';
+			o.inputtitle = _('Flash image...');
+			o.onclick = L.bind(this.handleSysupgrade, this, storage_size);
+		}
+
+
+		s = m.section(form.NamedSection, 'config', 'config', _('Configuration'), _('This is a list of shell glob patterns for matching files and directories to include during sysupgrade. Modified files in /etc/config/ and certain other configurations are automatically preserved.'));
+		s.render = L.bind(function(view /*, ... */) {
+			return form.NamedSection.prototype.render.apply(this, this.varargs(arguments, 1))
+				.then(L.bind(function(node) {
+					node.appendChild(E('div', { 'class': 'cbi-page-actions' }, [
+						E('button', {
+							'class': 'cbi-button cbi-button-save',
+							'click': L.ui.createHandlerFn(view, 'handleBackupSave', this.map)
+						}, [ _('Save') ])
+					]));
+
+					return node;
+				}, this));
+		}, s, this);
+
+		o = s.option(form.Button, 'showlist', _('Show current backup file list'));
+		o.inputstyle = 'action';
+		o.inputtitle = _('Open list...');
+		o.onclick = L.bind(this.handleBackupList, this);
+
+		o = s.option(form.TextValue, 'editlist');
+		o.forcewrite = true;
+		o.rows = 30;
+		o.load = function(section_id) {
+			return callFileRead('/etc/sysupgrade.conf');
+		};
+
+
+		return m.render();
+	},
+
+	handleSaveApply: null,
+	handleSave: null,
+	handleReset: null
+});
diff --git a/modules/luci-mod-system/luasrc/controller/admin/system.lua b/modules/luci-mod-system/luasrc/controller/admin/system.lua
index d6e1dc7815..c7d8ac5323 100644
--- a/modules/luci-mod-system/luasrc/controller/admin/system.lua
+++ b/modules/luci-mod-system/luasrc/controller/admin/system.lua
@@ -29,229 +29,12 @@ function index()
 		entry({"admin", "system", "leds"}, view("system/leds"), _("<abbr title=\"Light Emitting Diode\">LED</abbr> Configuration"), 60)
 	end
 
-	entry({"admin", "system", "flashops"}, call("action_flashops"), _("Backup / Flash Firmware"), 70)
-	entry({"admin", "system", "flashops", "reset"}, post("action_reset"))
-	entry({"admin", "system", "flashops", "backup"}, post("action_backup"))
-	entry({"admin", "system", "flashops", "backupmtdblock"}, post("action_backupmtdblock"))
-	entry({"admin", "system", "flashops", "backupfiles"}, form("admin_system/backupfiles"))
-
-	-- call() instead of post() due to upload handling!
-	entry({"admin", "system", "flashops", "restore"}, call("action_restore"))
-	entry({"admin", "system", "flashops", "sysupgrade"}, call("action_sysupgrade"))
+	entry({"admin", "system", "flash"}, view("system/flash"), _("Backup / Flash Firmware"), 70)
 
 	entry({"admin", "system", "reboot"}, template("admin_system/reboot"), _("Reboot"), 90)
 	entry({"admin", "system", "reboot", "call"}, post("action_reboot"))
 end
 
-local function image_supported(image)
-	return (os.execute("sysupgrade -T %q >/dev/null" % image) == 0)
-end
-
-local function image_checksum(image)
-	return (luci.sys.exec("md5sum %q" % image):match("^([^%s]+)"))
-end
-
-local function image_sha256_checksum(image)
-	return (luci.sys.exec("sha256sum %q" % image):match("^([^%s]+)"))
-end
-
-local function supports_sysupgrade()
-	return nixio.fs.access("/lib/upgrade/platform.sh")
-end
-
-local function supports_reset()
-	return (os.execute([[grep -sq "^overlayfs:/overlay / overlay " /proc/mounts]]) == 0)
-end
-
-local function storage_size()
-	local size = 0
-	if nixio.fs.access("/proc/mtd") then
-		for l in io.lines("/proc/mtd") do
-			local d, s, e, n = l:match('^([^%s]+)%s+([^%s]+)%s+([^%s]+)%s+"([^%s]+)"')
-			if n == "linux" or n == "firmware" then
-				size = tonumber(s, 16)
-				break
-			end
-		end
-	elseif nixio.fs.access("/proc/partitions") then
-		for l in io.lines("/proc/partitions") do
-			local x, y, b, n = l:match('^%s*(%d+)%s+(%d+)%s+([^%s]+)%s+([^%s]+)')
-			if b and n and not n:match('[0-9]') then
-				size = tonumber(b) * 1024
-				break
-			end
-		end
-	end
-	return size
-end
-
-
-function action_flashops()
-	--
-	-- Overview
-	--
-	luci.template.render("admin_system/flashops", {
-		reset_avail   = supports_reset(),
-		upgrade_avail = supports_sysupgrade()
-	})
-end
-
-function action_sysupgrade()
-	local fs = require "nixio.fs"
-	local http = require "luci.http"
-	local image_tmp = "/tmp/firmware.img"
-
-	local fp
-	http.setfilehandler(
-		function(meta, chunk, eof)
-			if not fp and meta and meta.name == "image" then
-				fp = io.open(image_tmp, "w")
-			end
-			if fp and chunk then
-				fp:write(chunk)
-			end
-			if fp and eof then
-				fp:close()
-			end
-		end
-	)
-
-	if not luci.dispatcher.test_post_security() then
-		fs.unlink(image_tmp)
-		return
-	end
-
-	--
-	-- Cancel firmware flash
-	--
-	if http.formvalue("cancel") then
-		fs.unlink(image_tmp)
-		http.redirect(luci.dispatcher.build_url('admin/system/flashops'))
-		return
-	end
-
-	--
-	-- Initiate firmware flash
-	--
-	local step = tonumber(http.formvalue("step")) or 1
-	if step == 1 then
-		local force = http.formvalue("force")
-		if image_supported(image_tmp) or force then
-			luci.template.render("admin_system/upgrade", {
-				checksum = image_checksum(image_tmp),
-				sha256ch = image_sha256_checksum(image_tmp),
-				storage  = storage_size(),
-				size     = (fs.stat(image_tmp, "size") or 0),
-				keep     = (not not http.formvalue("keep")),
-				force    = (not not http.formvalue("force"))
-			})
-		else
-			fs.unlink(image_tmp)
-			luci.template.render("admin_system/flashops", {
-				reset_avail   = supports_reset(),
-				upgrade_avail = supports_sysupgrade(),
-				image_invalid = true
-			})
-		end
-
-	--
-	-- Start sysupgrade flash
-	--
-	elseif step == 2 then
-		local keep = (http.formvalue("keep") == "1") and "" or "-n"
-		local force = (http.formvalue("force") == "1") and "-F" or ""
-		luci.template.render("admin_system/applyreboot", {
-			title = luci.i18n.translate("Flashing..."),
-			msg   = luci.i18n.translate("The system is flashing now.<br /> DO NOT POWER OFF THE DEVICE!<br /> Wait a few minutes before you try to reconnect. It might be necessary to renew the address of your computer to reach the device again, depending on your settings."),
-			addr  = (#keep > 0) and (#force > 0) and "192.168.1.1" or nil
-		})
-		luci.sys.process.exec({ "/bin/sh", "-c","sleep 1; killall dropbear uhttpd; sleep 1; /sbin/sysupgrade %s %s %q" %{ keep, force, image_tmp } }, nil, nil, true)
-	end
-end
-
-function action_backup()
-	luci.http.header('Content-Disposition', 'attachment; filename="backup-%s-%s.tar.gz"'
-		%{ luci.sys.hostname(), os.date("%Y-%m-%d") })
-
-	luci.http.prepare_content("application/x-targz")
-	luci.sys.process.exec({ "/sbin/sysupgrade", "--create-backup", "-" }, luci.http.write)
-end
-
-function action_backupmtdblock()
-	local mv = luci.http.formvalue("mtdblockname") or ""
-	local m, n = mv:match('^([^%s%./"]+)/%d+/(%d+)$')
-
-	if not m and n then
-		luci.http.status(400, "Bad Request")
-		return
-	end
-
-	luci.http.header('Content-Disposition', 'attachment; filename="backup-%s-%s-%s.bin"'
-		%{ luci.sys.hostname(), m, os.date("%Y-%m-%d") })
-
-	luci.http.prepare_content("application/octet-stream")
-	luci.sys.process.exec({ "/bin/dd", "if=/dev/mtd%s" % n, "conv=fsync,notrunc" }, luci.http.write)
-end
-
-function action_restore()
-	local fs = require "nixio.fs"
-	local http = require "luci.http"
-	local archive_tmp = "/tmp/restore.tar.gz"
-
-	local fp
-	http.setfilehandler(
-		function(meta, chunk, eof)
-			if not fp and meta and meta.name == "archive" then
-				fp = io.open(archive_tmp, "w")
-			end
-			if fp and chunk then
-				fp:write(chunk)
-			end
-			if fp and eof then
-				fp:close()
-			end
-		end
-	)
-
-	if not luci.dispatcher.test_post_security() then
-		fs.unlink(archive_tmp)
-		return
-	end
-
-	local upload = http.formvalue("archive")
-	if upload and #upload > 0 then
-		if os.execute("gunzip -t %q >/dev/null 2>&1" % archive_tmp) == 0 then
-			luci.template.render("admin_system/applyreboot")
-			os.execute("tar -C / -xzf %q >/dev/null 2>&1" % archive_tmp)
-			luci.sys.reboot()
-		else
-			luci.template.render("admin_system/flashops", {
-				reset_avail   = supports_reset(),
-				upgrade_avail = supports_sysupgrade(),
-				backup_invalid = true
-			})
-		end
-		return
-	end
-
-	http.redirect(luci.dispatcher.build_url('admin/system/flashops'))
-end
-
-function action_reset()
-	if supports_reset() then
-		luci.template.render("admin_system/applyreboot", {
-			title = luci.i18n.translate("Erasing..."),
-			msg   = luci.i18n.translate("The system is erasing the configuration partition now and will reboot itself when finished."),
-			addr  = "192.168.1.1"
-		})
-
-		luci.sys.process.exec({ "/bin/sh", "-c", "sleep 1; killall dropbear uhttpd; sleep 1; jffs2reset -y && reboot" }, nil, nil, true)
-		return
-	end
-
-	http.redirect(luci.dispatcher.build_url('admin/system/flashops'))
-end
-
 function action_reboot()
 	luci.sys.reboot()
 end
diff --git a/modules/luci-mod-system/luasrc/view/admin_system/backupfiles.htm b/modules/luci-mod-system/luasrc/view/admin_system/backupfiles.htm
deleted file mode 100644
index c1f3361ae2..0000000000
--- a/modules/luci-mod-system/luasrc/view/admin_system/backupfiles.htm
+++ /dev/null
@@ -1,10 +0,0 @@
-<%#
- Copyright 2008 Steven Barth <steven@midlink.org>
- Copyright 2008 Jo-Philipp Wich <jow@openwrt.org>
- Licensed to the public under the Apache License 2.0.
--%>
-
-<ul class="cbi-tabmenu">
-	<li class="cbi-tab-disabled"><a href="<%=url("admin/system/flashops")%>"><%:Actions%></a></li>
-	<li class="cbi-tab"><a href="#"><%:Configuration%></a></li>
-</ul>
diff --git a/modules/luci-mod-system/luasrc/view/admin_system/flashops.htm b/modules/luci-mod-system/luasrc/view/admin_system/flashops.htm
deleted file mode 100644
index 8204d38e34..0000000000
--- a/modules/luci-mod-system/luasrc/view/admin_system/flashops.htm
+++ /dev/null
@@ -1,137 +0,0 @@
-<%#
- Copyright 2008 Steven Barth <steven@midlink.org>
- Copyright 2008-2015 Jo-Philipp Wich <jow@openwrt.org>
- Licensed to the public under the Apache License 2.0.
--%>
-
-<%+header%>
-
-<h2 name="content"><%:Flash operations%></h2>
-
-<ul class="cbi-tabmenu">
-	<li class="cbi-tab"><a href="#"><%:Actions%></a></li>
-	<li class="cbi-tab-disabled"><a href="<%=url('admin/system/flashops/backupfiles')%>"><%:Configuration%></a></li>
-</ul>
-
-<div class="cbi-section">
-	<h3><%:Backup%></h3>
-	<div class="cbi-section-descr"><%:Click "Generate archive" to download a tar archive of the current configuration files.%></div>
-	<div class="cbi-section-node">
-		<form class="inline" method="post" action="<%=url('admin/system/flashops/backup')%>">
-			<input type="hidden" name="token" value="<%=token%>" />
-			<div class="cbi-value<% if not reset_avail then %> cbi-value-last<% end %>">
-				<label class="cbi-value-title" for="image"><%:Download backup%></label>
-				<div class="cbi-value-field">
-					<input class="cbi-button cbi-button-action important" type="submit" name="backup" value="<%:Generate archive%>" />
-				</div>
-			</div>
-		</form>
-	</div>
-
-	<h3><%:Restore%></h3>
-	<div class="cbi-section-descr"><%:To restore configuration files, you can upload a previously generated backup archive here. To reset the firmware to its initial state, click "Perform reset" (only possible with squashfs images).%></div>
-	<div class="cbi-section-node">
-		<% if reset_avail then %>
-		<form class="inline" method="post" action="<%=url('admin/system/flashops/reset')%>">
-			<input type="hidden" name="token" value="<%=token%>" />
-			<div class="cbi-value cbi-value-last">
-				<label class="cbi-value-title"><%:Reset to defaults%></label>
-				<div class="cbi-value-field">
-					<input onclick="return confirm('<%:Really reset all changes?%>')" class="cbi-button cbi-button-reset" type="submit" name="reset" value="<%:Perform reset%>" />
-				</div>
-			</div>
-		</form>
-		<% end %>
-		<form class="inline" method="post" action="<%=url('admin/system/flashops/restore')%>" enctype="multipart/form-data">
-			<div class="cbi-value cbi-value-last">
-				<label class="cbi-value-title" for="archive"><%:Restore backup%></label>
-				<div class="cbi-value-field">
-					<input type="hidden" name="token" value="<%=token%>" />
-					<input type="file" name="archive" id="archive" />
-					<input type="submit" class="cbi-button cbi-button-action important" name="restore" value="<%:Upload archive...%>" />
-					<% if reset_avail then %>
-						<div class="cbi-value-description"><%:Custom files (certificates, scripts) may remain on the system. To prevent this, perform a factory-reset first.%></div>
-					<% end %>
-				</div>
-			</div>
-		</form>
-		<% if backup_invalid then %>
-			<div class="cbi-section-error"><%:The backup archive does not appear to be a valid gzip file.%></div>
-		<% end %>
-	</div>
-
-	<% local mtds = require("luci.sys").mtds(); if #mtds > 0 then -%>
-	<h3><%:Save mtdblock contents%></h3>
-	<div class="cbi-section-descr"><%:Click "Save mtdblock" to download specified mtdblock file. (NOTE: THIS FEATURE IS FOR PROFESSIONALS! )%></div>
-	<div class="cbi-section-node">
-		<form class="inline" method="post" action="<%=url('admin/system/flashops/backupmtdblock')%>">
-			<input type="hidden" name="token" value="<%=token%>" />
-			<div class="cbi-value">
-				<label class="cbi-value-title" for="mtdblockname"><%:Choose mtdblock%></label>
-				<div class="cbi-value-field">
-					<select class="cbi-input-select" data-update="change" name="mtdblockname" id="mtdblockname">
-						<% for i, key in ipairs(mtds) do
-							if key and key.name ~= "rootfs_data" then -%>
-								<option<%=
-									attr("id", "mtdblockname-" .. key.name) ..
-									attr("value", key.name .. '/'.. key.size .. '/' .. i - 1) ..
-									attr("data-index", i) ..
-									ifattr(key.name == "linux" or key.name == "firmware", "selected", "selected")
-								%>><%=pcdata(key.name)%></option>
-						<%	end
-						 end -%>
-					</select>
-				</div>
-			</div>
-			<div class="cbi-value cbi-value-last<% if reset_avail then %> cbi-value-error<% end %>">
-				<label class="cbi-value-title" for="image"><%:Download mtdblock%></label>
-				<div class="cbi-value-field">
-					<input type="submit" class="cbi-button cbi-button-action important" value="<%:Save mtdblock%>" />
-				</div>
-			</div>
-		</form>
-	</div>
-	<% end %>
-
-</div>
-
-<div class="cbi-section">
-	<h3><%:Flash new firmware image%></h3>
-	<% if upgrade_avail then %>
-		<form method="post" action="<%=url('admin/system/flashops/sysupgrade')%>" enctype="multipart/form-data">
-			<input type="hidden" name="token" value="<%=token%>" />
-			<div class="cbi-section-descr"><%:Upload a sysupgrade-compatible image here to replace the running firmware. Check "Keep settings" to retain the current configuration (requires a compatible firmware image).%></div>
-			<div class="cbi-section-node">
-				<div class="cbi-value">
-					<label class="cbi-value-title" for="keep"><%:Keep settings%></label>
-					<div class="cbi-value-field">
-						<input type="checkbox" name="keep" id="keep" checked="checked" />
-					</div>
-				</div>
-				<% if image_invalid then %>
-				<div class="cbi-value">
-					<label class="cbi-value-title" for="force"><%:Force upgrade%></label>
-					<div class="cbi-value-field">
-						<input type="checkbox" name="force" id="force" />
-					</div>
-					<div class="cbi-section-error">
-						<%:The uploaded image file does not contain a supported format. Make sure that you choose the generic image format for your platform. %>
-						<%:Select 'Force upgrade' to flash the image even if the image format check fails. Use only if you are sure that the firmware is correct and meant for your device! %>
-					</div>
-				</div>
-				<% end %>
-				<div class="cbi-value cbi-value-last<% if image_invalid then %> cbi-value-error<% end %>">
-					<label class="cbi-value-title" for="image"><%:Image%></label>
-					<div class="cbi-value-field">
-						<input type="file" name="image" id="image" />
-						<input type="submit" class="cbi-button cbi-button-action important" value="<%:Flash image...%>" />
-					</div>
-				</div>
-			</div>
-		</form>
-	<% else %>
-		<div class="cbi-section-descr"><%:Sorry, there is no sysupgrade support present; a new firmware image must be flashed manually. Please refer to the wiki for device specific install instructions.%></div>
-	<% end %>
-</div>
-
-<%+footer%>
diff --git a/modules/luci-mod-system/luasrc/view/admin_system/upgrade.htm b/modules/luci-mod-system/luasrc/view/admin_system/upgrade.htm
deleted file mode 100644
index 597ddfd6bf..0000000000
--- a/modules/luci-mod-system/luasrc/view/admin_system/upgrade.htm
+++ /dev/null
@@ -1,65 +0,0 @@
-<%#
- Copyright 2008 Steven Barth <steven@midlink.org>
- Copyright 2008-2009 Jo-Philipp Wich <jow@openwrt.org>
- Licensed to the public under the Apache License 2.0.
--%>
-
-<%+header%>
-
-<h2 name="content"><%:Flash Firmware%> - <%:Verify%></h2>
-<p>
-	<%_ The flash image was uploaded.
-		Below is the checksum and file size listed,
-		compare them with the original file to ensure data integrity.<br />
-		Click "Proceed" below to start the flash procedure. %>
-
-	<% if storage > 0 and size > storage then %>
-		<br /><br />
-		<div class="error"><%:It appears that you are trying to
-			flash an image that does not fit into the flash memory, please verify
-			the image file! %></div>
-	<% end %>
-
-</p>
-
-<div class="cbi-section">
-	<ul>
-		<li><%:Checksum%><br />
-		<%:MD5%>: <code><%=checksum%></code><br />
-		<%:SHA256%>: <code><%=sha256ch%></code></li>
-		<li><%:Size%>: <%
-			local w = require "luci.tools.webadmin"
-			write(w.byte_format(size))
-
-			if storage > 0 then
-				write(luci.i18n.translatef(
-					" (%s available)",
-					w.byte_format(storage)
-				))
-			end
-		%></li>
-		<li><% if keep then %>
-			<%:Configuration files will be kept%>
-		<% else %>
-			<%:Caution: Configuration files will be erased%>
-		<% end %></li>
-		<% if force then %>
-		<li>
-			<%:Caution: System upgrade will be forced%>
-		</li>
-		<% end %>
-	</ul>
-</div>
-
-<div class="cbi-page-actions right">
-	<form class="inline" action="<%=REQUEST_URI%>" method="post">
-		<input type="hidden" name="token" value="<%=token%>" />
-		<input type="hidden" name="step" value="2" />
-		<input type="hidden" name="keep" value="<%=keep and "1" or ""%>" />
-		<input type="hidden" name="force" value="<%=force and "1" or ""%>" />
-		<input class="cbi-button cbi-button-reset" name="cancel" type="submit" value="<%:Cancel%>" />
-		<input class="cbi-button cbi-button-apply" type="submit" value="<%:Proceed%>" />
-	</form>
-</div>
-
-<%+footer%>