[FIX] отображение ошибок в UI, фикс экранирования

src/main/webapp/index.html

@@ -102,7 +102,7 @@
         <button class="uk-button uk-button-default start_import" style="width: 250px;" >Импортировать</button>
 
         <div id="modal-center" class="uk-flex-top" uk-modal>
-            <div class="uk-modal-dialog uk-modal-body uk-margin-auto-vertical">
+            <div class="uk-modal-dialog uk-modal-body uk-margin-auto-vertical"  style="width: 50%;">
 
                 <button class="uk-modal-close-default" type="button" uk-close></button>
 
@@ -111,7 +111,7 @@
 
                 <div class="uk-form-label">Сообщения и ошибки:</div>
                 <div class="uk-margin">
-                    <textarea class="uk-textarea" id="errors-area" rows="8" placeholder="..."></textarea>
+                    <textarea class="uk-textarea" id="errors-area" rows="13" placeholder="..."></textarea>
                 </div>
             </div>
         </div>

src/main/webapp/index.js

@@ -3,37 +3,70 @@ var isInProcess = false;
 function showProcess(firstmessage, iserror){
 
 
-    UIkit.modal($("#modal-center")).show();
-    if(firstmessage)  $("#errors-area").val(firstmessage);
+    var df = UIkit.modal($("#modal-center"));
+    df.bgClose = false;
+    df.show();
 
-    var progressbar = $("#js-progressbar");
     var errorsfield = $("#errors-area");
 
+    if(firstmessage)  errorsfield.val(firstmessage);
+
+    var progressbar = $("#js-progressbar");
+
     if(!iserror){
         //отправляем запрос за прогрессом и возникшими ошибками каждые 5 секунд, пока прогресс обработки записей не достигнет 100%
         var percentage = 0;
 
-        $.ajax({
-            url: window.location.origin + "/import/api/registry/info",
-            type: 'GET',
-            success: function (data) {
-                errorsfield.val(data.errors);
-
-                percentage = data.count / (data.total / 100);
-                progressbar.val(percentage);
-                if (data.count === data.total) return;
-            },
-            error: function (error) {
-                errorsfield.val(error.responseText);
+        var timerId = setInterval(function(){
+
+            if(percentage >= 100){
+                clearInterval(timerId);
                 isInProcess = false;
+                return;
             }
 
-        });
+            $.ajax({
+                url: window.location.origin + "/import/api/registry/info",
+                type: 'GET',
+                success: function (data) {
+                    var str = "";
+                    data.errors.forEach(function(item){
+                        str += item;
+                    });
+                    errorsfield.val(str);
+
+                    percentage = data.count / (data.total / 100);
+                    progressbar.val(percentage);
+                    if (data.count === data.total) return;
+                },
+                error: function (error) {
+                    try {
+                        var str2 = "";
+                        var json = JSON.parse(error.responseText);
+                        json.errors.forEach(function (item) {
+                            str2 += item;
+                        });
+                        errorsfield.val(str2);
+
+                        percentage = data.count / (data.total / 100);
+                        progressbar.val(percentage);
+                        if (data.count === data.total) return;
+                    } catch(e){
+                        errorsfield.val(e);
+                        clearInterval(timerId);
+                        isInProcess = false;
+                        return;
+                    }
+                }
+            });
+
+        }, 3000);
 
     }
 
 };
 
+
 $(document).ready(function(){
     $("#spin").hide();
 
@@ -67,6 +100,8 @@ $(document).ready(function(){
 
     $(".start_import").click(function(){
 
+        $("#js-progressbar").val(0);
+
         if(isInProcess){
             showProcess();
         } else {