fix(calendar): Add confirmation box when dismissing calendar event ed…

…ition with background click, only if the event is in edition. Fixes #5585.
Alinto · Mar 14, 2023 · 64d817a · 64d817a
1 parent 8bd97d1
commit 64d817a
Show file tree

Hide file tree

Showing 5 changed files with 69 additions and 1 deletion.
diff --git a/UI/Scheduler/English.lproj/Localizable.strings b/UI/Scheduler/English.lproj/Localizable.strings
@@ -623,6 +623,7 @@ vtodo_class2 = "(Confidential task)";
 "Rename" = "Rename";
 "Import Calendar" = "Import Calendar";
 "Select an ICS file." = "Select an ICS file.";
+"You have modified data unsaved. Do you want to close popup and loose data ?" = "You have modified data unsaved. Do you want to close popup and loose data ?";
 
 /* Notification when user subscribes to a calendar */
 "Successfully subscribed to calendar" = "Successfully subscribed to calendar";

diff --git a/UI/Scheduler/French.lproj/Localizable.strings b/UI/Scheduler/French.lproj/Localizable.strings
@@ -623,6 +623,7 @@ vtodo_class2 = "(Tâche confidentielle)";
 "Rename" = "Renommer";
 "Import Calendar" = "Importer un calendrier";
 "Select an ICS file." = "Sélectionnez un fichier ICS.";
+"You have modified data unsaved. Do you want to close popup and loose data ?" = "Vous avez des modifications qui ne sont pas sauvegardées. Souhaitez-vous fermer la fenêtre et perdre les données ?";
 
 /* Notification when user subscribes to a calendar */
 "Successfully subscribed to calendar" = "Abonnement au calendrier complété";

diff --git a/UI/Templates/SchedulerUI/UIxAppointmentEditorTemplate.wox b/UI/Templates/SchedulerUI/UIxAppointmentEditorTemplate.wox
@@ -4,12 +4,22 @@
     xmlns:var="http://www.skyrix.com/od/binding"
     xmlns:const="http://www.skyrix.com/od/constant"
     xmlns:label="OGo:label">
-  <md-dialog flex="60" flex-sm="80" flex-xs="100">
+  <md-dialog 
+  flex="{{ editor.isFullscreen?    100 : 60 }}"
+  flex-sm="{{ editor.isFullscreen? 100 : 80 }}">
     <form name="eventForm" class="md-inline-form" ng-submit="editor.save(eventForm)">
       <md-toolbar>
         <div class="md-toolbar-tools sg-no-transition">
           <md-icon class="material-icons sg-icon-toolbar-bg">event</md-icon>
           <!-- summary -->
+          <md-button ng-click="editor.toggleFullscreen($event)"
+                     class="md-icon-button hide show-gt-xs"
+                     aria-hidden="true"
+                     ng-if="!isPopup">
+            <md-tooltip ng-if="centerIsClose" md-direction="bottom">{{ ::'Reduce' | loc }}</md-tooltip>
+            <md-tooltip ng-else="centerIsClose" md-direction="bottom">{{ ::'Expand' | loc }}</md-tooltip>
+            <md-icon>{{ editor.isFullscreen ? 'fullscreen_exit' : 'fullscreen' }}</md-icon>
+          </md-button>
           <md-icon ng-if="editor.component.classification == 'confidential'">visibility_off</md-icon>
           <md-icon ng-if="editor.component.classification == 'private'">vpn_key</md-icon>
           <md-input-container class="md-flex">

diff --git a/UI/WebServerResources/js/Scheduler/CalendarListController.js b/UI/WebServerResources/js/Scheduler/CalendarListController.js
@@ -191,6 +191,40 @@
       }
     }
 
+    function eventHash(data) {
+      var hash = 0, i, chr, json;
+      json = JSON.stringify({
+        type: data.type,
+        status: data.status,
+        selected: data.selected,
+        repeat: data.repeat,
+        pid: data.pid,
+        destinationCalendar: data.destinationCalendar,
+        delta: data.delta,
+        classification: data.classification,
+        isNew: data.isNew,
+        categories: data.categories,
+        alarm: data.alarm,
+        type: data.type,
+        summary: data.summary,
+        status: data.status,
+        organizer: data.organizer,
+        location: data.location,
+        isAllDay: data.isAllDay,
+        comment: data.comment,
+        attendees: data.attendees
+      });
+
+      if (json.length === 0) return hash;
+      for (i = 0; i < json.length; i++) {
+        chr = json.charCodeAt(i);
+        hash = ((hash << 5) - hash) + chr;
+        hash |= 0;
+      }
+
+      return hash;
+    }
+
     function newComponent($event, type, baseComponent) {
       var component;
 
@@ -206,6 +240,23 @@
       // UI/Templates/SchedulerUI/UIxAppointmentEditorTemplate.wox or
       // UI/Templates/SchedulerUI/UIxTaskEditorTemplate.wox
       var templateUrl = 'UIx' + type.capitalize() + 'EditorTemplate';
+
+      // TODO: Improve Angular implementation
+      var originalCancel = $mdDialog.cancel;
+      var originalDataHash = eventHash(component);
+
+      $mdDialog.cancel = () => {
+        var newDataHash = eventHash(component);
+
+        if (originalDataHash === newDataHash) {
+          originalCancel();
+          $mdDialog.cancel = originalCancel;
+        } else if (confirm(l('You have modified data unsaved. Do you want to close popup and loose data ?'))) {
+          originalCancel();
+          $mdDialog.cancel = originalCancel;
+        }
+      };
+
       return $mdDialog.show({
         parent: angular.element(document.body),
         targetEvent: $event,

diff --git a/UI/WebServerResources/js/Scheduler/ComponentController.js b/UI/WebServerResources/js/Scheduler/ComponentController.js
@@ -216,6 +216,7 @@
       this.categories = {};
       this.showRecurrenceEditor = this.component.$hasCustomRepeat;
       this.showAttendeesEditor = this.component.attendees && this.component.attendees.length;
+      this.isFullscreen = false;
 
       if (this.component.type == 'appointment') {
         this.component.initAttendees();
@@ -296,6 +297,10 @@
         this.component.$attendees.initOrganizer(Calendar.$get(this.component.destinationCalendar));
     };
 
+    this.toggleFullscreen = function() {
+      vm.isFullscreen = !vm.isFullscreen;
+    }
+
     // Autocomplete cards for attendees
     this.cardFilter = function ($query) {
       return AddressBook.$filterAll($query);