Add modal restore dialog

src/views/app.html

@@ -204,6 +204,26 @@
   </div>
 </div>
 
+<!-- Modal restore app -->
+<div class="modal fade" id="restoreModal" tabindex="-1" role="dialog">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h4 class="modal-title">
+          Restore - {{ app.fqdn }}
+        </h4>
+      </div>
+      <div class="modal-body" style="padding: 0 15px">
+        <p>This will restore this app to the data from <b>{{ restore.backup.creationTime | prettyDate }}</b></p>
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+        <button type="button" class="btn btn-success" ng-click="restore.submit()"><i class="fas fa-history" ng-hide="restore.busy"></i><i class="fa fa-circle-notch fa-spin" ng-show="clone.busy"></i>  Restore</button>
+      </div>
+    </div>
+  </div>
+</div>
+
 <!-- Modal clone app -->
 <div class="modal fade" id="cloneModal" tabindex="-1" role="dialog">
   <div class="modal-dialog">
@@ -703,10 +723,8 @@
                   <td><div uib-tooltip="{{ backup.creationTime | prettyLongDate }}">{{ backup.creationTime | prettyDate }}</div></td>
                   <td>{{ backup.version }}</td>
                   <td class="text-right no-wrap" style="vertical-align: bottom">
-                    <button class="btn btn-xs btn-default" ng-hide="backup.ackRestore" ng-click="clone.show(backup)" uib-tooltip="Clone from this Backup"><i class="far fa-clone"></i></button>
+                    <button class="btn btn-xs btn-default" ng-click="clone.show(backup)" uib-tooltip="Clone from this Backup"><i class="far fa-clone"></i></button>
-                    <button class="btn btn-xs btn-danger" ng-hide="backup.ackRestore" ng-disabled="app.taskId" ng-click="backup.ackRestore = true" uib-tooltip="Restore to this Backup"><i class="fas fa-history"></i></button>
+                    <button class="btn btn-xs btn-danger" ng-click="restore.show(backup)" ng-disabled="app.taskId" uib-tooltip="Restore to this Backup"><i class="fas fa-history"></i></button>
-                    <button class="btn btn-xs btn-danger" ng-show="backup.ackRestore" ng-click="backups.restore(backup)">Yes restore now</button>
-                    <button class="btn btn-xs btn-default" ng-show="backup.ackRestore" ng-click="backup.ackRestore = false">Back</button>
                   </td>
                 </tr>
               </tbody>

src/views/app.js

@@ -648,16 +648,6 @@ angular.module('Application').controller('AppController', ['$scope', '$location'
                     $scope.backups.busy = false;
                 }, 1000);
             });
-        },
-
-        restore: function (backup) {
-            Client.restoreApp($scope.app.id, backup.id, function (error) {
-                if (error) return Client.error(error);
-
-                backup.ackRestore = false;
-
-                refreshApp();
-            });
         }
     };
 
@@ -721,6 +711,36 @@ angular.module('Application').controller('AppController', ['$scope', '$location'
         }
     };
 
+    $scope.restore = {
+        busy: false,
+        error: {},
+
+        backup: null,
+
+        show: function (backup) {
+            $scope.restore.error = {};
+            $scope.restore.backup = backup;
+
+            $('#restoreModal').modal('show');
+        },
+
+        submit: function () {
+            $scope.restore.busy = true;
+
+            Client.restoreApp($scope.app.id, $scope.restore.backup.id, function (error) {
+                if (error) {
+                    Client.error(error);
+                    $scope.restore.busy = false;
+                    return;
+                }
+
+                $('#restoreModal').modal('hide');
+
+                refreshApp();
+            });
+        }
+    };
+
     $scope.clone = {
         busy: false,
         error: {},