fix: fix click and scroll events on touch devices

Note - to drag and drop events on touch devices you must now long press them. This is technically a breaking change but currently it's very broken on touch devices anyway. Closes #1144
mattlewis92 · Apr 18, 2020 · fe08a96 · fe08a96
1 parent f565162
commit fe08a96
Show file tree

Hide file tree

Showing 5 changed files with 8 additions and 4 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -155,7 +155,7 @@
     "@angular/core": ">=6.0.0 <10.0.0"
   },
   "dependencies": {
-    "angular-draggable-droppable": "^4.3.12",
+    "angular-draggable-droppable": "^4.4.0",
     "angular-resizable-element": "^3.3.0",
     "calendar-utils": "^0.7.1",
     "positioning": "^2.0.1"

diff --git a/projects/angular-calendar/src/modules/month/calendar-month-cell.component.ts b/projects/angular-calendar/src/modules/month/calendar-month-cell.component.ts
@@ -64,6 +64,7 @@ import { PlacementArray } from 'positioning';
           [dropData]="{ event: event, draggedFrom: day }"
           [dragAxis]="{ x: event.draggable, y: event.draggable }"
           [validateDrag]="validateDrag"
+          [touchStartLongPress]="{ delay: 300, delta: 30 }"
           (mwlClick)="eventClicked.emit({ event: event, sourceEvent: $event })"
           [attr.aria-hidden]="{} | calendarA11y: 'hideMonthCellEvents'"
         ></div>

diff --git a/projects/angular-calendar/src/modules/month/calendar-open-day-events.component.ts b/projects/angular-calendar/src/modules/month/calendar-open-day-events.component.ts
@@ -80,6 +80,7 @@ export const collapseAnimation: AnimationTriggerMetadata = trigger('collapse', [
           [dropData]="{ event: event }"
           [dragAxis]="{ x: event.draggable, y: event.draggable }"
           [validateDrag]="validateDrag"
+          [touchStartLongPress]="{ delay: 300, delta: 30 }"
         >
           <span
             class="cal-event"

diff --git a/projects/angular-calendar/src/modules/week/calendar-week-view.component.ts b/projects/angular-calendar/src/modules/week/calendar-week-view.component.ts
@@ -156,6 +156,7 @@ export interface CalendarWeekViewBeforeRenderEvent extends WeekView {
             }"
             [dragSnapGrid]="snapDraggedEvents ? { x: dayColumnWidth } : {}"
             [validateDrag]="validateDrag"
+            [touchStartLongPress]="{ delay: 300, delta: 30 }"
             (dragStart)="dragStarted(eventRowContainer, event)"
             (dragging)="allDayEventDragMove()"
             (dragEnd)="dragEnded(allDayEvent, $event, dayColumnWidth)"
@@ -299,6 +300,7 @@ export interface CalendarWeekViewBeforeRenderEvent extends WeekView {
                       }
                     : {}
                 "
+                [touchStartLongPress]="{ delay: 300, delta: 30 }"
                 [ghostDragEnabled]="!snapDraggedEvents"
                 [validateDrag]="validateDrag"
                 (dragStart)="dragStarted(dayColumns, event, timeEvent)"