improve channel import progress page

4 files changed, 153 insertions, 16 deletions

diff --git a/Zotlabs/Module/Import.php b/Zotlabs/Module/Import.php
index 38b64dd3c..52e4374c8 100644
--- a/Zotlabs/Module/Import.php
+++ b/Zotlabs/Module/Import.php
@@ -579,8 +579,10 @@ class Import extends Controller {
 			return '';
 		}
 
+		nav_set_selected('Channel Import');
+
 		$o = replace_macros(get_markup_template('channel_import.tpl'), array(
-			'$title' => t('Import Channel'),
+			'$title' => t('Channel Import'),
 			'$desc' => t('Use this form to import an existing channel from a different server/hub. You may retrieve the channel identity from the old server/hub via the network or provide an export file.'),
 			'$label_filename' => t('File to Upload'),
 			'$choice' => t('Or provide the old server/hub details'),
@@ -588,7 +590,7 @@ class Import extends Controller {
 			'$old_address' => ['old_address', t('Your old identity address (xyz@example.com)'), '', ''],
 			'$email' => ['email', t('Your old login email address'), '', ''],
 			'$password' => ['password', t('Your old login password'), '', ''],
-			'$import_posts' => ['import_posts', t('Import a few months of posts if possible (limited by available memory'), false, '', [t('No'), t('Yes')]],
+			'$import_posts' => ['import_posts', t('Import your items and files (limited by available memory)'), false, '', [t('No'), t('Yes')]],
 
 			'$common' => t('For either option, please choose whether to make this hub your new primary address, or whether your old location should continue this role. You will be able to post from either location, but only one can be marked as the primary location for files, photos, and media.'),
 
diff --git a/Zotlabs/Module/Import_progress.php b/Zotlabs/Module/Import_progress.php
index f255dcbe9..cc4f0c0ea 100644
--- a/Zotlabs/Module/Import_progress.php
+++ b/Zotlabs/Module/Import_progress.php
@@ -2,6 +2,7 @@
 namespace Zotlabs\Module;
 
 use Zotlabs\Lib\PConfig;
+use Zotlabs\Daemon\Master;
 
 class Import_progress extends \Zotlabs\Web\Controller {
 
@@ -18,48 +19,76 @@ class Import_progress extends \Zotlabs\Web\Controller {
 			return;
 		}
 
+		nav_set_selected('Channel Import');
+
 		// items
 		$c = PConfig::Get(local_channel(), 'import', 'content_progress');
 
 		if (!$c) {
-			$co = 'Item sync status: waiting to start...';
+			$cprogress = 'waiting to start...';
 		}
 		else {
+
+			if(argv(1) === 'restart_itemsync') {
+				Master::Summon($c['next_cmd']);
+				goaway('/import_progress');
+			}
+
 			$total_cpages = floor(intval($c['items_total']) / intval($c['items_page']));
-			if(!$total_cpages)
+			if(!$total_cpages) {
 				$total_cpages = 1; // because of floor
+			}
 
 			$cpage = $c['last_page'] + 1; // because page count start at 0
 
-			$co = 'Item sync status: ' .  floor((intval($cpage) * 100) / $total_cpages) . '%';
+			$cprogress = intval(floor((intval($cpage) * 100) / $total_cpages));
+
+
 		}
 
+		$cprogress_str = ((intval($cprogress)) ? $cprogress . '%' : $cprogress);
+
 		// files
 		$f = PConfig::Get(local_channel(), 'import', 'files_progress');
 
 		if (!$f) {
-			$fo = 'File sync status: waiting to start...';
+			$fprogress = 'waiting to start...';
 		}
 		else {
+
+			if(argv(1) === 'restart_filesync') {
+				Master::Summon($f['next_cmd']);
+				goaway('/import_progress');
+			}
+
 			$total_fpages = floor(intval($f['files_total']) / intval($f['files_page']));
-			if(!$total_fpages)
+			if(!$total_fpages) {
 				$total_fpages = 1;
+			}
 
 			$fpage = $f['last_page'] + 1;
 
-			$fo = 'File sync status: ' .  floor((intval($fpage) * 100) / $total_fpages) . '%';
+			$fprogress = intval(floor((intval($fpage) * 100) / $total_fpages));
+
 		}
 
-		$o .= '<h3>' . $co . '</h3>';
-		if (is_array($c))
-			$o .= '<pre>' . htmlspecialchars(print_array($c)) . '</pre>';
+		$fprogress_str = ((intval($fprogress)) ? $fprogress . '%' : $fprogress);
 
-		$o .= '<h3>' . $fo . '</h3>';
-		if (is_array($f))
-			$o .= '<pre>' . htmlspecialchars(print_array($f)) . '</pre>';
+		if(is_ajax()) {
+			$ret = [
+				'cprogress' => $cprogress,
+				'fprogress' => $fprogress
+			];
+
+			json_return_and_die($ret);
+		}
 
-		$o .= '<hr>';
-		$o .= '<h3>Refresh page for updates!</h3>';
+		$o = replace_macros(get_markup_template("import_progress.tpl"), [
+			'$cprogress_str' => $cprogress_str,
+			'$cprogress' => intval($cprogress),
+			'$fprogress_str' => $fprogress_str,
+			'$fprogress' => intval($fprogress),
+		]);
 
 		return $o;
 	}
diff --git a/view/js/mod_import_progress.js b/view/js/mod_import_progress.js
new file mode 100644
index 000000000..69e4c5242
--- /dev/null
+++ b/view/js/mod_import_progress.js
@@ -0,0 +1,64 @@
+$(document).ready(function() {
+
+	console.log('import_progress');
+
+	setInterval(get_progress, 5000);
+
+
+	function get_progress(){
+		console.log('get');
+
+		$.get('import_progress', function(data) {
+			update_progress(data);
+		});
+	}
+
+	function update_progress(data){
+		console.log('update');
+		console.log(data);
+		console.log(data.cprogress);
+		console.log(data.fprogress);
+
+
+		if (typeof data.cprogress == 'number') {
+			$('#cprogress-label').html(data.cprogress + '%');
+			$('#cprogress-bar').css('width', data.cprogress + '%');
+
+			if (data.cprogress == 100) {
+				$('#cprogress-resume').addClass('d-none');
+				$('#cprogress-complete').removeClass('d-none');
+				$('#cprogress-bar').removeClass('progress-bar-animated');
+			}
+			else if (data.cprogress < 100) {
+				$('#cprogress-resume').removeClass('d-none');
+				$('#cprogress-complete').addClass('d-none');
+				$('#cprogress-bar').addClass('progress-bar-animated');
+			}
+		}
+		else {
+			$('#cprogress-label').html(data.cprogress);
+			$('#cprogress-bar').css('width', '0%');
+
+		}
+
+		if (typeof data.fprogress == 'number') {
+			$('#fprogress-label').html(data.fprogress + '%');
+			$('#fprogress-bar').css('width', data.fprogress + '%');
+
+			if (data.fprogress == 100) {
+				$('#fprogress-resume').addClass('d-none');
+				$('#fprogress-complete').removeClass('d-none');
+				$('#fprogress-bar').removeClass('progress-bar-animated');
+			}
+			else if (data.fprogress < 100) {
+				$('#fprogress-resume').removeClass('d-none');
+				$('#fprogress-complete').addClass('d-none');
+				$('#fprogress-bar').addClass('progress-bar-animated');
+			}
+		}
+		else {
+			$('#fprogress-label').html(data.fprogress);
+			$('#fprogress-bar').css('width', '0%');
+		}
+	}
+});
diff --git a/view/tpl/import_progress.tpl b/view/tpl/import_progress.tpl
new file mode 100644
index 000000000..34a93e7c8
--- /dev/null
+++ b/view/tpl/import_progress.tpl
@@ -0,0 +1,42 @@
+<h3>Channel clone status: 100%</h3>
+
+<div>
+	<div class="progress mb-2">
+		<div class="progress-bar progress-bar-striped bg-primary" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
+	</div>
+	<div>
+		<span class="text-muted">Channel cloning completed!</span>
+	</div>
+</div>
+
+<hr>
+
+<h3>Item sync status: <span id="cprogress-label">{{$cprogress_str}}</span></h3>
+
+<div id="cprogress">
+	<div class="progress mb-2">
+		<div id="cprogress-bar" class="progress-bar progress-bar-striped bg-warning{{if $fprogress < 100}} progress-bar-animated{{/if}}" role="progressbar" style="width: {{$cprogress}}%" aria-valuenow="{{$cprogress}}" aria-valuemin="0" aria-valuemax="100"></div>
+	</div>
+	<div id="cprogress-resume" class="">
+		<a href="/import_progress/restart_itemsync">[ RESUME ]</a> <span class="text-muted">Only resume if sync stalled!</span>
+	</div>
+	<div id="cprogress-complete" class="d-none">
+		<span class="text-muted">Item sync completed!</span>
+	</div>
+</div>
+
+<hr>
+
+<h3>File sync status: <span id="fprogress-label">{{$fprogress_str}}</span></h3>
+
+<div id="fprogress">
+	<div  class="progress mb-2">
+		<div id="fprogress-bar" class="progress-bar progress-bar-striped bg-info{{if $fprogress < 100}} progress-bar-animated{{/if}}" role="progressbar" style="width: {{$fprogress}}%" aria-valuenow="{{$fprogress}}" aria-valuemin="0" aria-valuemax="100"></div>
+	</div>
+	<div id="fprogress-resume" class="{{if $fprogress == 100}}d-none{{/if}}">
+		<a href="/import_progress/restart_filesync">[ RESUME ]</a> <span class="text-muted">Only resume if sync stalled!</span>
+	</div>
+	<div id="fprogress-complete" class="{{if $fprogress < 100}}d-none{{/if}}">
+		<span class="text-muted">File sync completed!</span>
+	</div>
+</div>