Merge pull request #23677 from owncloud/db-schema-migration-feedback

Show individual sql schema migration steps during upgrade - on web as…

5 files changed, 146 insertions, 24 deletions

diff --git a/core/ajax/update.php b/core/ajax/update.php
index 4d8fe19f168..631a8a7871c 100644
--- a/core/ajax/update.php
+++ b/core/ajax/update.php
@@ -26,6 +26,8 @@
  * along with this program.  If not, see <http://www.gnu.org/licenses/>
  *
  */
+use Symfony\Component\EventDispatcher\GenericEvent;
+
 set_time_limit(0);
 require_once '../../lib/base.php';
 
@@ -53,6 +55,18 @@ if (OC::checkUpgrade(false)) {
 	$incompatibleApps = [];
 	$disabledThirdPartyApps = [];
 
+	$dispatcher = \OC::$server->getEventDispatcher();
+	$dispatcher->addListener('\OC\DB\Migrator::executeSql', function($event) use ($eventSource, $l) {
+		if ($event instanceof GenericEvent) {
+			$eventSource->send('success', (string)$l->t('[%d / %d]: %s', [$event[0], $event[1], $event->getSubject()]));
+		}
+	});
+	$dispatcher->addListener('\OC\DB\Migrator::checkTable', function($event) use ($eventSource, $l) {
+		if ($event instanceof GenericEvent) {
+			$eventSource->send('success', (string)$l->t('[%d / %d]: Checking table %s', [$event[0], $event[1], $event->getSubject()]));
+		}
+	});
+
 	$updater->listen('\OC\Updater', 'maintenanceEnabled', function () use ($eventSource, $l) {
 		$eventSource->send('success', (string)$l->t('Turned on maintenance mode'));
 	});
diff --git a/core/command/upgrade.php b/core/command/upgrade.php
index c45984d7a30..cbb1f26f938 100644
--- a/core/command/upgrade.php
+++ b/core/command/upgrade.php
@@ -34,9 +34,11 @@ use OC\Updater;
 use OCP\IConfig;
 use OCP\ILogger;
 use Symfony\Component\Console\Command\Command;
+use Symfony\Component\Console\Helper\ProgressBar;
 use Symfony\Component\Console\Input\InputInterface;
 use Symfony\Component\Console\Output\OutputInterface;
 use Symfony\Component\Console\Input\InputOption;
+use Symfony\Component\EventDispatcher\GenericEvent;
 
 class Upgrade extends Command {
 
@@ -135,6 +137,34 @@ class Upgrade extends Command {
 			$updater->setSimulateStepEnabled($simulateStepEnabled);
 			$updater->setUpdateStepEnabled($updateStepEnabled);
 			$updater->setSkip3rdPartyAppsDisable($skip3rdPartyAppsDisable);
+			$dispatcher = \OC::$server->getEventDispatcher();
+			$progress = new ProgressBar($output);
+			$progress->setFormat(" %message%\n %current%/%max% [%bar%] %percent:3s%%");
+			$listener = function($event) use ($progress, $output) {
+				if ($event instanceof GenericEvent) {
+					$message = $event->getSubject();
+					if (OutputInterface::VERBOSITY_NORMAL < $output->getVerbosity()) {
+						$output->writeln(' Checking table ' . $message);
+					} else {
+						if (strlen($message) > 60) {
+							$message = substr($message, 0, 57) . '...';
+						}
+						$progress->setMessage($message);
+						if ($event[0] === 1) {
+							$output->writeln('');
+							$progress->start($event[1]);
+						}
+						$progress->setProgress($event[0]);
+						if ($event[0] === $event[1]) {
+							$progress->setMessage('Done');
+							$progress->finish();
+							$output->writeln('');
+						}
+					}
+				}
+			};
+			$dispatcher->addListener('\OC\DB\Migrator::executeSql', $listener);
+			$dispatcher->addListener('\OC\DB\Migrator::checkTable', $listener);
 
 			$updater->listen('\OC\Updater', 'maintenanceEnabled', function () use($output) {
 				$output->writeln('<info>Turned on maintenance mode</info>');
diff --git a/core/css/update.css b/core/css/update.css
new file mode 100644
index 00000000000..b1e086af3fd
--- /dev/null
+++ b/core/css/update.css
@@ -0,0 +1,26 @@
+#update-progress-icon {
+	height: 32px;
+	margin: 10px;
+	background-size: 32px;
+}
+
+#update-progress-message {
+	margin-bottom: 10px;
+}
+
+.update-show-detailed {
+	padding: 13px;
+	display: block;
+}
+
+#body-login .update a.update-show-detailed {
+	border-bottom: inherit;
+}
+
+#update-progress-detailed {
+	text-align: left;
+}
+
+#body-login .warning.hidden {
+	display: none;
+}
\ No newline at end of file
diff --git a/core/js/update.js b/core/js/update.js
index 77ac1bb20ff..31b97c56894 100644
--- a/core/js/update.js
+++ b/core/js/update.js
@@ -28,38 +28,47 @@
 
 			this._started = true;
 
+			var self = this;
+
 			$(window).on('beforeunload.inprogress', function () {
 				return t('core', 'The upgrade is in progress, leaving this page might interrupt the process in some environments.');
 			});
 
-			this.addMessage(t(
+			$('#update-progress-title').html(t(
 				'core',
-				'Updating {productName} to version {version}, this may take a while.', {
-					productName: options.productName || 'ownCloud',
+				'Updating to {version}', {
 					version: options.version
-				}),
-				'bold'
-			).append('<br />'); // FIXME: these should be ul/li with CSS paddings!
+				})
+			);
 
 			var updateEventSource = new OC.EventSource(OC.webroot+'/core/ajax/update.php');
 			updateEventSource.listen('success', function(message) {
-				$('<span>').append(message).append('<br />').appendTo($el);
+				self.setMessage(message);
 			});
 			updateEventSource.listen('notice', function(message) {
-				$('<span>').addClass('error').append(message).append('<br />').appendTo($el);
+				self.setPermanentMessage(message);
 				hasWarnings = true;
 			});
 			updateEventSource.listen('error', function(message) {
+				$('#update-progress-message').hide();
+				$('#update-progress-icon')
+					.addClass('icon-error-white')
+					.removeClass('icon-loading-dark');
 				message = message || t('core', 'An error occurred.');
 				$(window).off('beforeunload.inprogress');
-				$('<span>').addClass('error').append(message).append('<br />').appendTo($el);
+				self.setErrorMessage(message);
 				message = t('core', 'Please reload the page.');
 				$('<span>').addClass('error').append('<a href=".">'+message+'</a><br />').appendTo($el);
 				updateEventSource.close();
 			});
 			updateEventSource.listen('failure', function(message) {
 				$(window).off('beforeunload.inprogress');
-				$('<span>').addClass('error').append(message).append('<br />').appendTo($el);
+				$('#update-progress-message').hide();
+				$('#update-progress-icon')
+					.addClass('icon-error-white')
+					.removeClass('icon-loading-dark');
+
+				self.setErrorMessage(message);
 				var span = $('<span>')
 					.addClass('bold');
 				if(message === 'Exception: Updates between multiple major versions and downgrades are unsupported.') {
@@ -74,17 +83,23 @@
 			updateEventSource.listen('done', function() {
 				$(window).off('beforeunload.inprogress');
 
+				$('#update-progress-message').hide();
+
+				$('#update-progress-icon')
+					.addClass('icon-checkmark-white')
+					.removeClass('icon-loading-dark');
+
 				if (hasWarnings) {
-					$('<span>').addClass('bold')
-						.append('<br />')
-						.append(t('core', 'The update was successful. There were warnings.'))
-						.appendTo($el);
+					$el.find('.update-show-detailed').before(
+						$('<span>')
+							.append('<br />')
+							.append(t('core', 'The update was successful. There were warnings.'))
+					);
 					var message = t('core', 'Please reload the page.');
-					$('<span>').append('<br />').append(message).append('<br />').appendTo($el);
+					$('<span>').append(message).append('<br />').appendTo($el);
 				} else {
 					// FIXME: use product name
-					$('<span>').addClass('bold')
-						.append('<br />')
+					$('<span>')
 						.append(t('core', 'The update was successful. Redirecting you to ownCloud now.'))
 						.appendTo($el);
 					setTimeout(function () {
@@ -94,10 +109,33 @@
 			});
 		},
 
-		addMessage: function(message, className) {
-			var $span = $('<span>');
-			$span.addClass(className).append(message).append('<br />').appendTo(this.$el);
-			return $span;
+		setMessage: function(message) {
+			$('#update-progress-message').html(message);
+			$('#update-progress-detailed')
+				.append($('<span>'))
+				.append(message)
+				.append($('<br>'));
+		},
+
+		setPermanentMessage: function(message) {
+			$('#update-progress-message').html(message);
+			$('#update-progress-message-warnings')
+				.show()
+				.append($('<ul>').append(message));
+			$('#update-progress-detailed')
+				.append($('<span>'))
+				.append(message)
+				.append($('<br>'));
+		},
+		
+		setErrorMessage: function (message) {
+			$('#update-progress-message-error')
+				.show()
+				.html(message);
+			$('#update-progress-detailed')
+				.append($('<span>'))
+				.append(message)
+				.append($('<br>'));
 		}
 	};
 
@@ -106,13 +144,19 @@
 $(document).ready(function() {
 	$('.updateButton').on('click', function() {
 		var $updateEl = $('.update');
-		var $progressEl = $('.updateProgress');
+		var $progressEl = $('.update-progress');
 		$progressEl.removeClass('hidden');
 		$('.updateOverview').addClass('hidden');
+		$('#update-progress-message-error').hide();
+		$('#update-progress-message-warnings').hide();
 		OC.Update.start($progressEl, {
 			productName: $updateEl.attr('data-productname'),
-			version: $updateEl.attr('data-version'),
+			version: $updateEl.attr('data-version')
 		});
 		return false;
 	});
+	$('.update-show-detailed').on('click', function() {
+		$('#update-progress-detailed').toggleClass('hidden');
+		return false;
+	});
 });
diff --git a/core/templates/update.admin.php b/core/templates/update.admin.php
index 75815de84bc..24b2beec6da 100644
--- a/core/templates/update.admin.php
+++ b/core/templates/update.admin.php
@@ -41,5 +41,13 @@
 		</div>
 	</div>
 
-	<div class="updateProgress hidden"></div>
+	<div class="update-progress hidden">
+		<h2 id="update-progress-title"></h2>
+		<div id="update-progress-icon" class="icon-loading-dark"></div>
+		<p id="update-progress-message-error" class="warning hidden"></p>
+		<ul id="update-progress-message-warnings" class="warning hidden"></ul>
+		<p id="update-progress-message"></p>
+		<a class="update-show-detailed"><?php p($l->t( 'Detailed logs' )); ?> <img class="svg" src="<?php print_unescaped(image_path('', 'actions/caret.svg')); ?>" /></a>
+		<div id="update-progress-detailed" class="hidden warning"></div>
+	</div>
 </div>