From 0b6eef6c93f1cf9109554b1dac1e77204899a8d4 Mon Sep 17 00:00:00 2001
From: Davide Alberani <da@erlug.linux.it>
Date: Sun, 3 May 2015 17:33:52 +0200
Subject: [PATCH] modal dialog to confirm destructive actions

---
 angular_app/events-list.html          |  1 +
 angular_app/js/controllers.js         | 58 +++++++++++++++++++++++----
 angular_app/modal-confirm-action.html | 16 ++++++++
 angular_app/persons-list.html         |  1 +
 4 files changed, 68 insertions(+), 8 deletions(-)
 create mode 100644 angular_app/modal-confirm-action.html

diff --git a/angular_app/events-list.html b/angular_app/events-list.html
index 2b35f66..8954154 100644
--- a/angular_app/events-list.html
+++ b/angular_app/events-list.html
@@ -25,6 +25,7 @@
                 </div>
             </form>
 
+            <div ng-include=" 'modal-confirm-action.html' " class="hidden"></div>
             <table class="table table-striped">
                 <thead>
                     <tr>
diff --git a/angular_app/js/controllers.js b/angular_app/js/controllers.js
index 5b55814..f02f962 100644
--- a/angular_app/js/controllers.js
+++ b/angular_app/js/controllers.js
@@ -38,15 +38,44 @@ eventManControllers.controller('DatetimePickerCtrl', ['$scope',
 );
 
 
-eventManControllers.controller('EventsListCtrl', ['$scope', 'Event',
-    function ($scope, Event) {
+/* Controller for modals. */
+eventManControllers.controller('ModalConfirmInstanceCtrl', ['$scope', '$modalInstance', 'message',
+    function ($scope, $modalInstance, message) {
+        $scope.message = message;
+
+        $scope.ok = function () {
+            $modalInstance.close($scope);
+        };
+
+        $scope.cancel = function () {
+            $modalInstance.dismiss('cancel');
+        };
+    }]
+);
+
+
+eventManControllers.controller('EventsListCtrl', ['$scope', 'Event', '$modal', '$log',
+    function ($scope, Event, $modal, $log) {
         $scope.events = Event.all();
         $scope.personsOrderProp = 'name';
         $scope.eventsOrderProp = "'-begin-date'";
 
         $scope.remove = function(_id) {
-            Event.remove({'id': _id}, function() {
-                $scope.events = Event.all();
+            var modalInstance = $modal.open({
+                scope: $scope,
+                templateUrl: 'modal-confirm-action.html',
+                controller: 'ModalConfirmInstanceCtrl',
+                resolve: {
+                    // XXX: must be converted in a i18n-able form.
+                    message: function() { return 'You really want to delete this event?'; }
+                }
+            });
+            modalInstance.result.then(function() {
+                console.debug('here');
+                Event.remove({'id': _id}, function() {
+                    $scope.events = Event.all();
+                    }
+                );
             });
         };
     }]
@@ -225,8 +254,8 @@ eventManControllers.controller('EventDetailsCtrl', ['$scope', 'Event', 'Person',
 );
 
 
-eventManControllers.controller('PersonsListCtrl', ['$scope', 'Person', 'Setting',
-    function ($scope, Person, Setting) {
+eventManControllers.controller('PersonsListCtrl', ['$scope', 'Person', 'Setting', '$modal',
+    function ($scope, Person, Setting, $modal) {
         $scope.persons = Person.all();
         $scope.personsOrder = ["name", "surname"];
         $scope.customFields = Setting.query({setting: 'person_custom_field',
@@ -259,8 +288,21 @@ eventManControllers.controller('PersonsListCtrl', ['$scope', 'Person', 'Setting'
         };
 
         $scope.remove = function(_id) {
-            Person.remove({'id': _id}, function() {
-                $scope.persons = Person.all();
+            var modalInstance = $modal.open({
+                scope: $scope,
+                templateUrl: 'modal-confirm-action.html',
+                controller: 'ModalConfirmInstanceCtrl',
+                resolve: {
+                    // XXX: must be converted in a i18n-able form.
+                    message: function() { return 'You really want to delete this person?'; }
+                }
+            });
+            modalInstance.result.then(function() {
+                console.debug('here');
+                Person.remove({'id': _id}, function() {
+                    $scope.persons = Person.all();
+                    }
+                );
             });
         };
     }]
diff --git a/angular_app/modal-confirm-action.html b/angular_app/modal-confirm-action.html
new file mode 100644
index 0000000..0bd0241
--- /dev/null
+++ b/angular_app/modal-confirm-action.html
@@ -0,0 +1,16 @@
+<div>
+    <script type="text/ng-template" id="modal-confirm-action.html">
+        <div class="modal-header">
+            <h3>{{'Confirm' | translate}}</h3>
+        </div>
+
+        <div class="modal-body">
+            {{message}}
+        </div>
+
+        <div class="modal-footer">
+            <button class="btn btn-primary" ng-click="ok()">{{'Ok' | translate}}</button>
+            <button class="btn btn-warning" ng-click="cancel()">{{'Cancel' | translate}}</button>
+        </div>
+    </script>
+</div>
diff --git a/angular_app/persons-list.html b/angular_app/persons-list.html
index 2233bf5..3ddb189 100644
--- a/angular_app/persons-list.html
+++ b/angular_app/persons-list.html
@@ -32,6 +32,7 @@
                 </div>
             </form>
 
+            <div ng-include=" 'modal-confirm-action.html' " class="hidden"></div>
             <table class="table table-striped">
                 <thead>
                     <tr>