Merge pull request #4754 from Ansuel/improvesysupg

luci-mod-system: improve sysupgrade page

modules/luci-mod-system/htdocs/luci-static/resources/view/system/flash.js

@@ -204,8 +204,13 @@ return view.extend({
 					.then(function(res) { reply.push(res); return reply; });
 			}, this, ev.target))
 			.then(L.bind(function(btn, res) {
-				var keep = E('input', { type: 'checkbox' }),
+				/* sysupgrade opts table  [0]:checkbox element [1]:check condition [2]:args to pass */
-				    force = E('input', { type: 'checkbox' }),
+				var opts = {
+				    keep : [ E('input', { type: 'checkbox' }), false, '-n' ],
+				    force : [ E('input', { type: 'checkbox' }), true, '--force' ],
+				    skip_orig : [ E('input', { type: 'checkbox' }), true, '-u' ],
+				    backup_pkgs : [ E('input', { type: 'checkbox' }), true, '-k' ],
+				    },
 				    is_valid = res[1].valid,
 				    is_forceable = res[1].forceable,
 				    allow_backup = res[1].allow_backup,
@@ -220,7 +225,7 @@ return view.extend({
 				]));
 
 				body.push(E('p', {}, E('label', { 'class': 'btn' }, [
-					keep, ' ', _('Keep settings and retain the current configuration')
+					opts.keep[0], ' ', _('Keep settings and retain the current configuration')
 				])));
 
 				if (!is_valid || is_too_big)
@@ -239,28 +244,46 @@ return view.extend({
 						_('The uploaded image file does not contain a supported format. Make sure that you choose the generic image format for your platform.')
 					]));
 
-				if (!allow_backup)
+				if (!allow_backup) {
 					body.push(E('p', { 'class': 'alert-message' }, [
 						_('The uploaded firmware does not allow keeping current configuration.')
 					]));
+					opts.keep[0].disabled = true;
+				} else {
+					opts.keep[0].checked = true;
 
-				if (allow_backup)
+					body.push(E('p', {}, E('label', { 'class': 'btn' }, [
-					keep.checked = true;
+						opts.skip_orig[0], ' ', _('Skip from backup files that are equal to those in /rom')
-				else
+					])));
-					keep.disabled = true;
 
-
+					body.push(E('p', {}, E('label', { 'class': 'btn' }, [
-				if ((!is_valid || is_too_big) && is_forceable)
+						opts.backup_pkgs[0], ' ', _('Include in backup a list of current installed packages at /etc/backup/installed_packages.txt')
-					body.push(E('p', { 'class': 'alert-message danger' }, [
+					])));
-						force, ' ', _('Force upgrade: 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': ui.createHandlerFn(this, 'handleSysupgradeConfirm', btn, keep, force),
+					'click': ui.createHandlerFn(this, 'handleSysupgradeConfirm', btn, opts),
-					'disabled': (!is_valid || is_too_big) ? true : null
 				}, [ _('Continue') ]);
 
+				if (res[2].code != 0) {
+					body.push(E('p', { 'class': 'alert-message danger' }, E('label', {}, [
+						_('Image check failed:'),
+						E('br'), E('br'),
+						res[2].stderr
+					])));
+				};
+
+				if ((!is_valid || is_too_big || res[2].code != 0) && is_forceable) {
+					body.push(E('p', {}, E('label', { 'class': 'btn alert-message danger' }, [
+						opts.force[0], ' ', _('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!')
+					])));
+					cntbtn.disabled = true;
+				};
+
+
 				body.push(E('div', { 'class': 'right' }, [
 					E('button', {
 						'class': 'btn',
@@ -270,10 +293,16 @@ return view.extend({
 					}, [ _('Cancel') ]), ' ', cntbtn
 				]));
 
-				force.addEventListener('change', function(ev) {
+				opts.force[0].addEventListener('change', function(ev) {
 					cntbtn.disabled = !ev.target.checked;
 				});
 
+				opts.keep[0].addEventListener('change', function(ev) {
+					opts.skip_orig[0].disabled = !ev.target.checked;
+					opts.backup_pkgs[0].disabled = !ev.target.checked;
+
+				});
+
 				ui.showModal(_('Flash image?'), body);
 			}, this, ev.target))
 			.catch(function(e) { ui.addNotification(null, E('p', e.message)) })
@@ -282,27 +311,26 @@ return view.extend({
 			}, this, ev.target));
 	},
 
-	handleSysupgradeConfirm: function(btn, keep, force, ev) {
+	handleSysupgradeConfirm: function(btn, opts, ev) {
 		btn.firstChild.data = _('Flashing…');
 
 		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 = [];
+		var args = [];
 
-		if (!keep.checked)
+		for (var key in opts)
-			opts.push('-n');
+			/* if checkbox == condition add args to sysupgrade */
+			if (opts[key][0].checked == opts[key][1])
+				args.push(opts[key][2]);
 
-		if (force.checked)
+		args.push('/tmp/firmware.bin');
-			opts.push('--force');
-
-		opts.push('/tmp/firmware.bin');
 
 		/* Currently the sysupgrade rpc call will not return, hence no promise handling */
-		fs.exec('/sbin/sysupgrade', opts);
+		fs.exec('/sbin/sysupgrade', args);
 
-		if (keep.checked)
+		if (opts['keep'][0].checked)
 			ui.awaitReconnect(window.location.host);
 		else
 			ui.awaitReconnect('192.168.1.1', 'openwrt.lan');

modules/luci-mod-system/root/usr/share/rpcd/acl.d/luci-mod-system.json

@@ -140,7 +140,13 @@
 				"/sbin/reboot": [ "exec" ],
 				"/sbin/sysupgrade --force /tmp/firmware.bin": [ "exec" ],
 				"/sbin/sysupgrade -n --force /tmp/firmware.bin": [ "exec" ],
+				"/sbin/sysupgrade --force -k /tmp/firmware.bin": [ "exec" ],
+				"/sbin/sysupgrade --force -u /tmp/firmware.bin": [ "exec" ],
+				"/sbin/sysupgrade --force -u -k /tmp/firmware.bin": [ "exec" ],
 				"/sbin/sysupgrade -n /tmp/firmware.bin": [ "exec" ],
+				"/sbin/sysupgrade -k /tmp/firmware.bin": [ "exec" ],
+				"/sbin/sysupgrade -u /tmp/firmware.bin": [ "exec" ],
+				"/sbin/sysupgrade -u -k /tmp/firmware.bin": [ "exec" ],
 				"/sbin/sysupgrade --restore-backup /tmp/backup.tar.gz": [ "exec" ],
 				"/sbin/sysupgrade --test /tmp/firmware.bin": [ "exec" ],
 				"/sbin/sysupgrade /tmp/firmware.bin": [ "exec" ],

themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css

@@ -1752,6 +1752,7 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner {
 	border-style: solid;
 	border-radius: 4px;
 	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
+	white-space: unset;
 }
 
 .alert-message .close {

themes/luci-theme-material/htdocs/luci-static/material/cascade.css

@@ -189,7 +189,7 @@ button,
 select,
 input,
 .cbi-dropdown {
-	height: 1.8rem;
+	min-height: 1.8rem;
 	padding: 0;
 	color: rgba(0, 0, 0, .87);
 	border: 0;
@@ -1661,6 +1661,7 @@ body:not(.Interfaces) .cbi-rowstyle-2:first-child {
 
 .modal ul {
 	margin-left: 2.2em;
+	word-break: break-word;
 }
 
 .modal li {
@@ -1673,23 +1674,20 @@ body:not(.Interfaces) .cbi-rowstyle-2:first-child {
 	word-break: break-word;
 }
 
-.modal .label {
+.modal label.btn {
-	font-size: .6rem;
+	display: flex;
-	font-weight: normal;
+	align-items: center;
-	padding: .1rem .3rem;
+	white-space: normal;
-	padding-bottom: 0;
+	text-align: left;
-	cursor: default;
+	text-transform: none;
-	border-radius: 0;
+	padding-bottom: 0.2rem;
+	padding-top: 0.2rem;
 }
 
-.modal .label.warning {
+.modal label.warning {
 	background-color: #f0ad4e !important;
 }
 
-.modal .btn {
-	padding: .3rem .6rem;
-}
-
 .modal.cbi-modal {
 	max-width: 90%;
 	max-height: none;
@@ -2124,11 +2122,7 @@ span[data-tooltip] .label {
 
 label > input[type="checkbox"],
 label > input[type="radio"] {
-	position: relative;
+	margin-right: 0.8rem;
-	top: .4rem;
-	right: .2rem;
-	margin: 0;
-	vertical-align: bottom;
 }
 
 label[data-index][data-depends] {

themes/luci-theme-openwrt/htdocs/luci-static/openwrt.org/cascade.css

@@ -658,7 +658,7 @@ img.cbi-image-button {
 	text-align: center;
 	font-weight: bold;
 	line-height: 12px;
-	height: 22px;
+	min-height: 22px;
 	line-height: 20px;
 	box-sizing: border-box;
 	cursor: pointer;