From 9884da00d464d4ca2ee90ce286091ac6fb7034ce Mon Sep 17 00:00:00 2001
From: Albert Gasset <albertgasset@fsfe.org>
Date: Tue, 1 Oct 2019 15:26:30 +0200
Subject: [PATCH] MOBILE-2890 calendar: Improve new reminder UX

---
 src/addon/calendar/pages/event/event.html | 9 ++++-----
 src/addon/calendar/pages/event/event.ts   | 7 +------
 2 files changed, 5 insertions(+), 11 deletions(-)

diff --git a/src/addon/calendar/pages/event/event.html b/src/addon/calendar/pages/event/event.html
index 176250dec..009c0bfa7 100644
--- a/src/addon/calendar/pages/event/event.html
+++ b/src/addon/calendar/pages/event/event.html
@@ -98,12 +98,11 @@
 
             <ng-container *ngIf="event.timestart + event.timeduration > currentTime">
                 <ion-item>
-                    <ion-label stacked><h2>{{ 'addon.calendar.setnewreminder' | translate }}</h2></ion-label>
-                    <ion-datetime [(ngModel)]="notificationTimeText" [placeholder]="'core.choosedots' | translate" [displayFormat]="notificationFormat" [min]="notificationMin" [max]="notificationMax"></ion-datetime>
-                </ion-item>
-                <ion-item>
-                    <button ion-button block color="primary" (click)="addNotificationTime($event)" [disabled]="!notificationTimeText">{{ 'core.save' | translate }}</button>
+                    <button ion-button block color="primary" (click)="notificationPicker.open()">
+                        {{ 'addon.calendar.setnewreminder' | translate }}
+                    </button>
                 </ion-item>
+                <ion-datetime #notificationPicker hidden [(ngModel)]="notificationTimeText" [displayFormat]="notificationFormat" [min]="notificationMin" [max]="notificationMax" [doneText]="'core.add' | translate"(ionChange)="addNotificationTime()"></ion-datetime>
             </ng-container>
         </ion-card>
     </core-loading>
diff --git a/src/addon/calendar/pages/event/event.ts b/src/addon/calendar/pages/event/event.ts
index 21b503b5a..8a0df6fb0 100644
--- a/src/addon/calendar/pages/event/event.ts
+++ b/src/addon/calendar/pages/event/event.ts
@@ -311,13 +311,8 @@ export class AddonCalendarEventPage implements OnDestroy {
 
     /**
      * Add a reminder for this event.
-     *
-     * @param e Click event.
      */
-    addNotificationTime(e: Event): void {
-        e.preventDefault();
-        e.stopPropagation();
-
+    addNotificationTime(): void {
         if (this.notificationTimeText && this.event && this.event.id) {
             let notificationTime = this.timeUtils.convertToTimestamp(this.notificationTimeText);