Add progress bar to import create

Web/Scripts/Shared/ImportCreate.js

@@ -1,12 +1,17 @@
 function importLogs(userFullName) {
 	$('.import-status').html('<span class="label">Pending</span');
+	var total = $("#logs > tbody > tr:not(.complete)").length;
 	$('#page-import-status').html('<span class="label label-warning"><i class="fa fa-spinner fa-spin"></i> Import In Progress</span> <strong>Keep page open until complete.</strong>');
-
+	$('#page-import-status').after('<div class="progress progress-striped active"><div class="bar" style="width:0%"></div><div>');
+	
 	submitNext();
 	var errorCount = 0;
 
 	function submitNext() {
 		var $logs = $("#logs > tbody > tr:not(.complete)");
+		var percentComplete = Math.round( (1 - ($logs.length / total)) * 100 );
+		$('.progress .bar').attr('style', 'width:' + percentComplete + '%');
+
 		if ($logs.length > 0) {
 			var $row = $($logs[0]);
 			var data = $('form', $row).serialize();
@@ -28,6 +33,7 @@
 						$('.import-message', $row).text(result.Message);
 						$('.import-status', $row).append(" " + result.Action);
 						errorCount++;
+						$('.progress .bar').addClass('bar-warning');
 					}
 					else if (result.Status == "Duplicate") {
 						$('.import-status', $row).html('<span class="label label-inverse">Duplicate</span');
@@ -39,8 +45,11 @@
 				}
 			});
 		} else {
+			$('.progress').removeClass('progress-striped');
+			$('.progress').removeClass('active');
 			if (errorCount == 0) {
 				$('#page-import-status').html('<span class="label">Complete</span> without errors.');
+				$('.progress .bar').addClass('bar-success');
 			} else {
 				$('#page-import-status').html('<span class="label label-warning">Complete</span> but with errors. See details below.');
 			}