1 files changed, 17 insertions, 5 deletions
diff --git a/phpBB/assets/javascript/installer.js b/phpBB/assets/javascript/installer.js
index c5909556c6..5f2c65c776 100644
--- a/phpBB/assets/javascript/installer.js
+++ b/phpBB/assets/javascript/installer.js
@@ -177,7 +177,7 @@
 	 * @param progressObject
 	 */
 	function setProgress(progressObject) {
-		var $statusText, $progressBar, $progressText, $progressFiller;
+		var $statusText, $progressBar, $progressText, $progressFiller, $progressFillerText;
 
 		if (progressObject.task_name.length) {
 			if (!progressBarTriggered) {
@@ -189,18 +189,23 @@
 				$progressBar.attr('id', 'progress-bar');
 				$progressText = $('<p />');
 				$progressText.attr('id', 'progress-bar-text');
-				$progressFiller = $('<span />');
+				$progressFiller = $('<div />');
 				$progressFiller.attr('id', 'progress-bar-filler');
-				$progressFiller.html($progressText);
+				$progressFillerText = $('<p />');
+				$progressFillerText.attr('id', 'progress-bar-filler-text');
 
 				$statusText = $('<p />');
 				$statusText.attr('id', 'progress-status-text');
 
+				$progressFiller.append($progressFillerText);
+				$progressBar.append($progressText);
 				$progressBar.append($progressFiller);
 
 				$progressBarWrapper.append($statusText);
 				$progressBarWrapper.append($progressBar);
 
+				$progressFillerText.css('width', $progressBar.width());
+
 				progressBarTriggered = true;
 			} else if (progressObject.hasOwnProperty('restart')) {
 				clearInterval(progressTimer);
@@ -210,6 +215,7 @@
 				$statusText = $('#progress-status-text');
 
 				$progressText.text('0%');
+				$progressFillerText.text('0%');
 				$progressFiller.css('width', '0%');
 
 				currentProgress = 0;
@@ -342,15 +348,20 @@
 	 *
 	 * @param $progressText
 	 * @param $progressFiller
+	 * @param $progressFillerText
 	 * @param progressLimit
 	 */
-	function incrementFiller($progressText, $progressFiller, progressLimit) {
+	function incrementFiller($progressText, $progressFiller, $progressFillerText, progressLimit) {
 		if (currentProgress >= progressLimit || currentProgress >= 100) {
 			clearInterval(progressTimer);
 			return;
 		}
 
+		var $progressBar = $('#progress-bar');
+
 		currentProgress++;
+		$progressFillerText.css('width', $progressBar.width());
+		$progressFillerText.text(currentProgress + '%');
 		$progressText.text(currentProgress + '%');
 		$progressFiller.css('width', currentProgress + '%');
 	}
@@ -362,13 +373,14 @@
 	 */
 	function incrementProgressBar(progressLimit) {
 		var $progressFiller = $('#progress-bar-filler');
+		var $progressFillerText = $('#progress-bar-filler-text');
 		var $progressText = $('#progress-bar-text');
 		var progressStart = $progressFiller.width() / $progressFiller.offsetParent().width() * 100;
 		currentProgress = Math.floor(progressStart);
 
 		clearInterval(progressTimer);
 		progressTimer = setInterval(function() {
-			incrementFiller($progressText, $progressFiller, progressLimit);
+			incrementFiller($progressText, $progressFiller, $progressFillerText, progressLimit);
 		}, 10);
 	}