@fullcalendar/interaction 5.11.3 → 6.0.0-beta.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/{LICENSE.txt → LICENSE.md} +0 -0
- package/index.cjs +2105 -0
- package/{main.d.ts → index.d.ts} +16 -17
- package/index.global.js +2114 -0
- package/index.global.min.js +6 -0
- package/{main.js → index.js} +820 -881
- package/package.json +31 -16
- package/main.cjs.js +0 -2166
- package/main.global.js +0 -2212
- package/main.global.min.js +0 -6
- package/main.js.map +0 -1
package/index.cjs
ADDED
|
@@ -0,0 +1,2105 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var index_cjs = require('@fullcalendar/core/index.cjs');
|
|
6
|
+
var internal_cjs = require('@fullcalendar/core/internal.cjs');
|
|
7
|
+
|
|
8
|
+
internal_cjs.config.touchMouseIgnoreWait = 500;
|
|
9
|
+
let ignoreMouseDepth = 0;
|
|
10
|
+
let listenerCnt = 0;
|
|
11
|
+
let isWindowTouchMoveCancelled = false;
|
|
12
|
+
/*
|
|
13
|
+
Uses a "pointer" abstraction, which monitors UI events for both mouse and touch.
|
|
14
|
+
Tracks when the pointer "drags" on a certain element, meaning down+move+up.
|
|
15
|
+
|
|
16
|
+
Also, tracks if there was touch-scrolling.
|
|
17
|
+
Also, can prevent touch-scrolling from happening.
|
|
18
|
+
Also, can fire pointermove events when scrolling happens underneath, even when no real pointer movement.
|
|
19
|
+
|
|
20
|
+
emits:
|
|
21
|
+
- pointerdown
|
|
22
|
+
- pointermove
|
|
23
|
+
- pointerup
|
|
24
|
+
*/
|
|
25
|
+
class PointerDragging {
|
|
26
|
+
constructor(containerEl) {
|
|
27
|
+
this.subjectEl = null;
|
|
28
|
+
// options that can be directly assigned by caller
|
|
29
|
+
this.selector = ''; // will cause subjectEl in all emitted events to be this element
|
|
30
|
+
this.handleSelector = '';
|
|
31
|
+
this.shouldIgnoreMove = false;
|
|
32
|
+
this.shouldWatchScroll = true; // for simulating pointermove on scroll
|
|
33
|
+
// internal states
|
|
34
|
+
this.isDragging = false;
|
|
35
|
+
this.isTouchDragging = false;
|
|
36
|
+
this.wasTouchScroll = false;
|
|
37
|
+
// Mouse
|
|
38
|
+
// ----------------------------------------------------------------------------------------------------
|
|
39
|
+
this.handleMouseDown = (ev) => {
|
|
40
|
+
if (!this.shouldIgnoreMouse() &&
|
|
41
|
+
isPrimaryMouseButton(ev) &&
|
|
42
|
+
this.tryStart(ev)) {
|
|
43
|
+
let pev = this.createEventFromMouse(ev, true);
|
|
44
|
+
this.emitter.trigger('pointerdown', pev);
|
|
45
|
+
this.initScrollWatch(pev);
|
|
46
|
+
if (!this.shouldIgnoreMove) {
|
|
47
|
+
document.addEventListener('mousemove', this.handleMouseMove);
|
|
48
|
+
}
|
|
49
|
+
document.addEventListener('mouseup', this.handleMouseUp);
|
|
50
|
+
}
|
|
51
|
+
};
|
|
52
|
+
this.handleMouseMove = (ev) => {
|
|
53
|
+
let pev = this.createEventFromMouse(ev);
|
|
54
|
+
this.recordCoords(pev);
|
|
55
|
+
this.emitter.trigger('pointermove', pev);
|
|
56
|
+
};
|
|
57
|
+
this.handleMouseUp = (ev) => {
|
|
58
|
+
document.removeEventListener('mousemove', this.handleMouseMove);
|
|
59
|
+
document.removeEventListener('mouseup', this.handleMouseUp);
|
|
60
|
+
this.emitter.trigger('pointerup', this.createEventFromMouse(ev));
|
|
61
|
+
this.cleanup(); // call last so that pointerup has access to props
|
|
62
|
+
};
|
|
63
|
+
// Touch
|
|
64
|
+
// ----------------------------------------------------------------------------------------------------
|
|
65
|
+
this.handleTouchStart = (ev) => {
|
|
66
|
+
if (this.tryStart(ev)) {
|
|
67
|
+
this.isTouchDragging = true;
|
|
68
|
+
let pev = this.createEventFromTouch(ev, true);
|
|
69
|
+
this.emitter.trigger('pointerdown', pev);
|
|
70
|
+
this.initScrollWatch(pev);
|
|
71
|
+
// unlike mouse, need to attach to target, not document
|
|
72
|
+
// https://stackoverflow.com/a/45760014
|
|
73
|
+
let targetEl = ev.target;
|
|
74
|
+
if (!this.shouldIgnoreMove) {
|
|
75
|
+
targetEl.addEventListener('touchmove', this.handleTouchMove);
|
|
76
|
+
}
|
|
77
|
+
targetEl.addEventListener('touchend', this.handleTouchEnd);
|
|
78
|
+
targetEl.addEventListener('touchcancel', this.handleTouchEnd); // treat it as a touch end
|
|
79
|
+
// attach a handler to get called when ANY scroll action happens on the page.
|
|
80
|
+
// this was impossible to do with normal on/off because 'scroll' doesn't bubble.
|
|
81
|
+
// http://stackoverflow.com/a/32954565/96342
|
|
82
|
+
window.addEventListener('scroll', this.handleTouchScroll, true);
|
|
83
|
+
}
|
|
84
|
+
};
|
|
85
|
+
this.handleTouchMove = (ev) => {
|
|
86
|
+
let pev = this.createEventFromTouch(ev);
|
|
87
|
+
this.recordCoords(pev);
|
|
88
|
+
this.emitter.trigger('pointermove', pev);
|
|
89
|
+
};
|
|
90
|
+
this.handleTouchEnd = (ev) => {
|
|
91
|
+
if (this.isDragging) { // done to guard against touchend followed by touchcancel
|
|
92
|
+
let targetEl = ev.target;
|
|
93
|
+
targetEl.removeEventListener('touchmove', this.handleTouchMove);
|
|
94
|
+
targetEl.removeEventListener('touchend', this.handleTouchEnd);
|
|
95
|
+
targetEl.removeEventListener('touchcancel', this.handleTouchEnd);
|
|
96
|
+
window.removeEventListener('scroll', this.handleTouchScroll, true); // useCaptured=true
|
|
97
|
+
this.emitter.trigger('pointerup', this.createEventFromTouch(ev));
|
|
98
|
+
this.cleanup(); // call last so that pointerup has access to props
|
|
99
|
+
this.isTouchDragging = false;
|
|
100
|
+
startIgnoringMouse();
|
|
101
|
+
}
|
|
102
|
+
};
|
|
103
|
+
this.handleTouchScroll = () => {
|
|
104
|
+
this.wasTouchScroll = true;
|
|
105
|
+
};
|
|
106
|
+
this.handleScroll = (ev) => {
|
|
107
|
+
if (!this.shouldIgnoreMove) {
|
|
108
|
+
let pageX = (window.pageXOffset - this.prevScrollX) + this.prevPageX;
|
|
109
|
+
let pageY = (window.pageYOffset - this.prevScrollY) + this.prevPageY;
|
|
110
|
+
this.emitter.trigger('pointermove', {
|
|
111
|
+
origEvent: ev,
|
|
112
|
+
isTouch: this.isTouchDragging,
|
|
113
|
+
subjectEl: this.subjectEl,
|
|
114
|
+
pageX,
|
|
115
|
+
pageY,
|
|
116
|
+
deltaX: pageX - this.origPageX,
|
|
117
|
+
deltaY: pageY - this.origPageY,
|
|
118
|
+
});
|
|
119
|
+
}
|
|
120
|
+
};
|
|
121
|
+
this.containerEl = containerEl;
|
|
122
|
+
this.emitter = new internal_cjs.Emitter();
|
|
123
|
+
containerEl.addEventListener('mousedown', this.handleMouseDown);
|
|
124
|
+
containerEl.addEventListener('touchstart', this.handleTouchStart, { passive: true });
|
|
125
|
+
listenerCreated();
|
|
126
|
+
}
|
|
127
|
+
destroy() {
|
|
128
|
+
this.containerEl.removeEventListener('mousedown', this.handleMouseDown);
|
|
129
|
+
this.containerEl.removeEventListener('touchstart', this.handleTouchStart, { passive: true });
|
|
130
|
+
listenerDestroyed();
|
|
131
|
+
}
|
|
132
|
+
tryStart(ev) {
|
|
133
|
+
let subjectEl = this.querySubjectEl(ev);
|
|
134
|
+
let downEl = ev.target;
|
|
135
|
+
if (subjectEl &&
|
|
136
|
+
(!this.handleSelector || internal_cjs.elementClosest(downEl, this.handleSelector))) {
|
|
137
|
+
this.subjectEl = subjectEl;
|
|
138
|
+
this.isDragging = true; // do this first so cancelTouchScroll will work
|
|
139
|
+
this.wasTouchScroll = false;
|
|
140
|
+
return true;
|
|
141
|
+
}
|
|
142
|
+
return false;
|
|
143
|
+
}
|
|
144
|
+
cleanup() {
|
|
145
|
+
isWindowTouchMoveCancelled = false;
|
|
146
|
+
this.isDragging = false;
|
|
147
|
+
this.subjectEl = null;
|
|
148
|
+
// keep wasTouchScroll around for later access
|
|
149
|
+
this.destroyScrollWatch();
|
|
150
|
+
}
|
|
151
|
+
querySubjectEl(ev) {
|
|
152
|
+
if (this.selector) {
|
|
153
|
+
return internal_cjs.elementClosest(ev.target, this.selector);
|
|
154
|
+
}
|
|
155
|
+
return this.containerEl;
|
|
156
|
+
}
|
|
157
|
+
shouldIgnoreMouse() {
|
|
158
|
+
return ignoreMouseDepth || this.isTouchDragging;
|
|
159
|
+
}
|
|
160
|
+
// can be called by user of this class, to cancel touch-based scrolling for the current drag
|
|
161
|
+
cancelTouchScroll() {
|
|
162
|
+
if (this.isDragging) {
|
|
163
|
+
isWindowTouchMoveCancelled = true;
|
|
164
|
+
}
|
|
165
|
+
}
|
|
166
|
+
// Scrolling that simulates pointermoves
|
|
167
|
+
// ----------------------------------------------------------------------------------------------------
|
|
168
|
+
initScrollWatch(ev) {
|
|
169
|
+
if (this.shouldWatchScroll) {
|
|
170
|
+
this.recordCoords(ev);
|
|
171
|
+
window.addEventListener('scroll', this.handleScroll, true); // useCapture=true
|
|
172
|
+
}
|
|
173
|
+
}
|
|
174
|
+
recordCoords(ev) {
|
|
175
|
+
if (this.shouldWatchScroll) {
|
|
176
|
+
this.prevPageX = ev.pageX;
|
|
177
|
+
this.prevPageY = ev.pageY;
|
|
178
|
+
this.prevScrollX = window.pageXOffset;
|
|
179
|
+
this.prevScrollY = window.pageYOffset;
|
|
180
|
+
}
|
|
181
|
+
}
|
|
182
|
+
destroyScrollWatch() {
|
|
183
|
+
if (this.shouldWatchScroll) {
|
|
184
|
+
window.removeEventListener('scroll', this.handleScroll, true); // useCaptured=true
|
|
185
|
+
}
|
|
186
|
+
}
|
|
187
|
+
// Event Normalization
|
|
188
|
+
// ----------------------------------------------------------------------------------------------------
|
|
189
|
+
createEventFromMouse(ev, isFirst) {
|
|
190
|
+
let deltaX = 0;
|
|
191
|
+
let deltaY = 0;
|
|
192
|
+
// TODO: repeat code
|
|
193
|
+
if (isFirst) {
|
|
194
|
+
this.origPageX = ev.pageX;
|
|
195
|
+
this.origPageY = ev.pageY;
|
|
196
|
+
}
|
|
197
|
+
else {
|
|
198
|
+
deltaX = ev.pageX - this.origPageX;
|
|
199
|
+
deltaY = ev.pageY - this.origPageY;
|
|
200
|
+
}
|
|
201
|
+
return {
|
|
202
|
+
origEvent: ev,
|
|
203
|
+
isTouch: false,
|
|
204
|
+
subjectEl: this.subjectEl,
|
|
205
|
+
pageX: ev.pageX,
|
|
206
|
+
pageY: ev.pageY,
|
|
207
|
+
deltaX,
|
|
208
|
+
deltaY,
|
|
209
|
+
};
|
|
210
|
+
}
|
|
211
|
+
createEventFromTouch(ev, isFirst) {
|
|
212
|
+
let touches = ev.touches;
|
|
213
|
+
let pageX;
|
|
214
|
+
let pageY;
|
|
215
|
+
let deltaX = 0;
|
|
216
|
+
let deltaY = 0;
|
|
217
|
+
// if touch coords available, prefer,
|
|
218
|
+
// because FF would give bad ev.pageX ev.pageY
|
|
219
|
+
if (touches && touches.length) {
|
|
220
|
+
pageX = touches[0].pageX;
|
|
221
|
+
pageY = touches[0].pageY;
|
|
222
|
+
}
|
|
223
|
+
else {
|
|
224
|
+
pageX = ev.pageX;
|
|
225
|
+
pageY = ev.pageY;
|
|
226
|
+
}
|
|
227
|
+
// TODO: repeat code
|
|
228
|
+
if (isFirst) {
|
|
229
|
+
this.origPageX = pageX;
|
|
230
|
+
this.origPageY = pageY;
|
|
231
|
+
}
|
|
232
|
+
else {
|
|
233
|
+
deltaX = pageX - this.origPageX;
|
|
234
|
+
deltaY = pageY - this.origPageY;
|
|
235
|
+
}
|
|
236
|
+
return {
|
|
237
|
+
origEvent: ev,
|
|
238
|
+
isTouch: true,
|
|
239
|
+
subjectEl: this.subjectEl,
|
|
240
|
+
pageX,
|
|
241
|
+
pageY,
|
|
242
|
+
deltaX,
|
|
243
|
+
deltaY,
|
|
244
|
+
};
|
|
245
|
+
}
|
|
246
|
+
}
|
|
247
|
+
// Returns a boolean whether this was a left mouse click and no ctrl key (which means right click on Mac)
|
|
248
|
+
function isPrimaryMouseButton(ev) {
|
|
249
|
+
return ev.button === 0 && !ev.ctrlKey;
|
|
250
|
+
}
|
|
251
|
+
// Ignoring fake mouse events generated by touch
|
|
252
|
+
// ----------------------------------------------------------------------------------------------------
|
|
253
|
+
function startIgnoringMouse() {
|
|
254
|
+
ignoreMouseDepth += 1;
|
|
255
|
+
setTimeout(() => {
|
|
256
|
+
ignoreMouseDepth -= 1;
|
|
257
|
+
}, internal_cjs.config.touchMouseIgnoreWait);
|
|
258
|
+
}
|
|
259
|
+
// We want to attach touchmove as early as possible for Safari
|
|
260
|
+
// ----------------------------------------------------------------------------------------------------
|
|
261
|
+
function listenerCreated() {
|
|
262
|
+
listenerCnt += 1;
|
|
263
|
+
if (listenerCnt === 1) {
|
|
264
|
+
window.addEventListener('touchmove', onWindowTouchMove, { passive: false });
|
|
265
|
+
}
|
|
266
|
+
}
|
|
267
|
+
function listenerDestroyed() {
|
|
268
|
+
listenerCnt -= 1;
|
|
269
|
+
if (!listenerCnt) {
|
|
270
|
+
window.removeEventListener('touchmove', onWindowTouchMove, { passive: false });
|
|
271
|
+
}
|
|
272
|
+
}
|
|
273
|
+
function onWindowTouchMove(ev) {
|
|
274
|
+
if (isWindowTouchMoveCancelled) {
|
|
275
|
+
ev.preventDefault();
|
|
276
|
+
}
|
|
277
|
+
}
|
|
278
|
+
|
|
279
|
+
/*
|
|
280
|
+
An effect in which an element follows the movement of a pointer across the screen.
|
|
281
|
+
The moving element is a clone of some other element.
|
|
282
|
+
Must call start + handleMove + stop.
|
|
283
|
+
*/
|
|
284
|
+
class ElementMirror {
|
|
285
|
+
constructor() {
|
|
286
|
+
this.isVisible = false; // must be explicitly enabled
|
|
287
|
+
this.sourceEl = null;
|
|
288
|
+
this.mirrorEl = null;
|
|
289
|
+
this.sourceElRect = null; // screen coords relative to viewport
|
|
290
|
+
// options that can be set directly by caller
|
|
291
|
+
this.parentNode = document.body; // HIGHLY SUGGESTED to set this to sidestep ShadowDOM issues
|
|
292
|
+
this.zIndex = 9999;
|
|
293
|
+
this.revertDuration = 0;
|
|
294
|
+
}
|
|
295
|
+
start(sourceEl, pageX, pageY) {
|
|
296
|
+
this.sourceEl = sourceEl;
|
|
297
|
+
this.sourceElRect = this.sourceEl.getBoundingClientRect();
|
|
298
|
+
this.origScreenX = pageX - window.pageXOffset;
|
|
299
|
+
this.origScreenY = pageY - window.pageYOffset;
|
|
300
|
+
this.deltaX = 0;
|
|
301
|
+
this.deltaY = 0;
|
|
302
|
+
this.updateElPosition();
|
|
303
|
+
}
|
|
304
|
+
handleMove(pageX, pageY) {
|
|
305
|
+
this.deltaX = (pageX - window.pageXOffset) - this.origScreenX;
|
|
306
|
+
this.deltaY = (pageY - window.pageYOffset) - this.origScreenY;
|
|
307
|
+
this.updateElPosition();
|
|
308
|
+
}
|
|
309
|
+
// can be called before start
|
|
310
|
+
setIsVisible(bool) {
|
|
311
|
+
if (bool) {
|
|
312
|
+
if (!this.isVisible) {
|
|
313
|
+
if (this.mirrorEl) {
|
|
314
|
+
this.mirrorEl.style.display = '';
|
|
315
|
+
}
|
|
316
|
+
this.isVisible = bool; // needs to happen before updateElPosition
|
|
317
|
+
this.updateElPosition(); // because was not updating the position while invisible
|
|
318
|
+
}
|
|
319
|
+
}
|
|
320
|
+
else if (this.isVisible) {
|
|
321
|
+
if (this.mirrorEl) {
|
|
322
|
+
this.mirrorEl.style.display = 'none';
|
|
323
|
+
}
|
|
324
|
+
this.isVisible = bool;
|
|
325
|
+
}
|
|
326
|
+
}
|
|
327
|
+
// always async
|
|
328
|
+
stop(needsRevertAnimation, callback) {
|
|
329
|
+
let done = () => {
|
|
330
|
+
this.cleanup();
|
|
331
|
+
callback();
|
|
332
|
+
};
|
|
333
|
+
if (needsRevertAnimation &&
|
|
334
|
+
this.mirrorEl &&
|
|
335
|
+
this.isVisible &&
|
|
336
|
+
this.revertDuration && // if 0, transition won't work
|
|
337
|
+
(this.deltaX || this.deltaY) // if same coords, transition won't work
|
|
338
|
+
) {
|
|
339
|
+
this.doRevertAnimation(done, this.revertDuration);
|
|
340
|
+
}
|
|
341
|
+
else {
|
|
342
|
+
setTimeout(done, 0);
|
|
343
|
+
}
|
|
344
|
+
}
|
|
345
|
+
doRevertAnimation(callback, revertDuration) {
|
|
346
|
+
let mirrorEl = this.mirrorEl;
|
|
347
|
+
let finalSourceElRect = this.sourceEl.getBoundingClientRect(); // because autoscrolling might have happened
|
|
348
|
+
mirrorEl.style.transition =
|
|
349
|
+
'top ' + revertDuration + 'ms,' +
|
|
350
|
+
'left ' + revertDuration + 'ms';
|
|
351
|
+
internal_cjs.applyStyle(mirrorEl, {
|
|
352
|
+
left: finalSourceElRect.left,
|
|
353
|
+
top: finalSourceElRect.top,
|
|
354
|
+
});
|
|
355
|
+
internal_cjs.whenTransitionDone(mirrorEl, () => {
|
|
356
|
+
mirrorEl.style.transition = '';
|
|
357
|
+
callback();
|
|
358
|
+
});
|
|
359
|
+
}
|
|
360
|
+
cleanup() {
|
|
361
|
+
if (this.mirrorEl) {
|
|
362
|
+
internal_cjs.removeElement(this.mirrorEl);
|
|
363
|
+
this.mirrorEl = null;
|
|
364
|
+
}
|
|
365
|
+
this.sourceEl = null;
|
|
366
|
+
}
|
|
367
|
+
updateElPosition() {
|
|
368
|
+
if (this.sourceEl && this.isVisible) {
|
|
369
|
+
internal_cjs.applyStyle(this.getMirrorEl(), {
|
|
370
|
+
left: this.sourceElRect.left + this.deltaX,
|
|
371
|
+
top: this.sourceElRect.top + this.deltaY,
|
|
372
|
+
});
|
|
373
|
+
}
|
|
374
|
+
}
|
|
375
|
+
getMirrorEl() {
|
|
376
|
+
let sourceElRect = this.sourceElRect;
|
|
377
|
+
let mirrorEl = this.mirrorEl;
|
|
378
|
+
if (!mirrorEl) {
|
|
379
|
+
mirrorEl = this.mirrorEl = this.sourceEl.cloneNode(true); // cloneChildren=true
|
|
380
|
+
// we don't want long taps or any mouse interaction causing selection/menus.
|
|
381
|
+
// would use preventSelection(), but that prevents selectstart, causing problems.
|
|
382
|
+
mirrorEl.classList.add('fc-unselectable');
|
|
383
|
+
mirrorEl.classList.add('fc-event-dragging');
|
|
384
|
+
internal_cjs.applyStyle(mirrorEl, {
|
|
385
|
+
position: 'fixed',
|
|
386
|
+
zIndex: this.zIndex,
|
|
387
|
+
visibility: '',
|
|
388
|
+
boxSizing: 'border-box',
|
|
389
|
+
width: sourceElRect.right - sourceElRect.left,
|
|
390
|
+
height: sourceElRect.bottom - sourceElRect.top,
|
|
391
|
+
right: 'auto',
|
|
392
|
+
bottom: 'auto',
|
|
393
|
+
margin: 0,
|
|
394
|
+
});
|
|
395
|
+
this.parentNode.appendChild(mirrorEl);
|
|
396
|
+
}
|
|
397
|
+
return mirrorEl;
|
|
398
|
+
}
|
|
399
|
+
}
|
|
400
|
+
|
|
401
|
+
/*
|
|
402
|
+
Is a cache for a given element's scroll information (all the info that ScrollController stores)
|
|
403
|
+
in addition the "client rectangle" of the element.. the area within the scrollbars.
|
|
404
|
+
|
|
405
|
+
The cache can be in one of two modes:
|
|
406
|
+
- doesListening:false - ignores when the container is scrolled by someone else
|
|
407
|
+
- doesListening:true - watch for scrolling and update the cache
|
|
408
|
+
*/
|
|
409
|
+
class ScrollGeomCache extends internal_cjs.ScrollController {
|
|
410
|
+
constructor(scrollController, doesListening) {
|
|
411
|
+
super();
|
|
412
|
+
this.handleScroll = () => {
|
|
413
|
+
this.scrollTop = this.scrollController.getScrollTop();
|
|
414
|
+
this.scrollLeft = this.scrollController.getScrollLeft();
|
|
415
|
+
this.handleScrollChange();
|
|
416
|
+
};
|
|
417
|
+
this.scrollController = scrollController;
|
|
418
|
+
this.doesListening = doesListening;
|
|
419
|
+
this.scrollTop = this.origScrollTop = scrollController.getScrollTop();
|
|
420
|
+
this.scrollLeft = this.origScrollLeft = scrollController.getScrollLeft();
|
|
421
|
+
this.scrollWidth = scrollController.getScrollWidth();
|
|
422
|
+
this.scrollHeight = scrollController.getScrollHeight();
|
|
423
|
+
this.clientWidth = scrollController.getClientWidth();
|
|
424
|
+
this.clientHeight = scrollController.getClientHeight();
|
|
425
|
+
this.clientRect = this.computeClientRect(); // do last in case it needs cached values
|
|
426
|
+
if (this.doesListening) {
|
|
427
|
+
this.getEventTarget().addEventListener('scroll', this.handleScroll);
|
|
428
|
+
}
|
|
429
|
+
}
|
|
430
|
+
destroy() {
|
|
431
|
+
if (this.doesListening) {
|
|
432
|
+
this.getEventTarget().removeEventListener('scroll', this.handleScroll);
|
|
433
|
+
}
|
|
434
|
+
}
|
|
435
|
+
getScrollTop() {
|
|
436
|
+
return this.scrollTop;
|
|
437
|
+
}
|
|
438
|
+
getScrollLeft() {
|
|
439
|
+
return this.scrollLeft;
|
|
440
|
+
}
|
|
441
|
+
setScrollTop(top) {
|
|
442
|
+
this.scrollController.setScrollTop(top);
|
|
443
|
+
if (!this.doesListening) {
|
|
444
|
+
// we are not relying on the element to normalize out-of-bounds scroll values
|
|
445
|
+
// so we need to sanitize ourselves
|
|
446
|
+
this.scrollTop = Math.max(Math.min(top, this.getMaxScrollTop()), 0);
|
|
447
|
+
this.handleScrollChange();
|
|
448
|
+
}
|
|
449
|
+
}
|
|
450
|
+
setScrollLeft(top) {
|
|
451
|
+
this.scrollController.setScrollLeft(top);
|
|
452
|
+
if (!this.doesListening) {
|
|
453
|
+
// we are not relying on the element to normalize out-of-bounds scroll values
|
|
454
|
+
// so we need to sanitize ourselves
|
|
455
|
+
this.scrollLeft = Math.max(Math.min(top, this.getMaxScrollLeft()), 0);
|
|
456
|
+
this.handleScrollChange();
|
|
457
|
+
}
|
|
458
|
+
}
|
|
459
|
+
getClientWidth() {
|
|
460
|
+
return this.clientWidth;
|
|
461
|
+
}
|
|
462
|
+
getClientHeight() {
|
|
463
|
+
return this.clientHeight;
|
|
464
|
+
}
|
|
465
|
+
getScrollWidth() {
|
|
466
|
+
return this.scrollWidth;
|
|
467
|
+
}
|
|
468
|
+
getScrollHeight() {
|
|
469
|
+
return this.scrollHeight;
|
|
470
|
+
}
|
|
471
|
+
handleScrollChange() {
|
|
472
|
+
}
|
|
473
|
+
}
|
|
474
|
+
|
|
475
|
+
class ElementScrollGeomCache extends ScrollGeomCache {
|
|
476
|
+
constructor(el, doesListening) {
|
|
477
|
+
super(new internal_cjs.ElementScrollController(el), doesListening);
|
|
478
|
+
}
|
|
479
|
+
getEventTarget() {
|
|
480
|
+
return this.scrollController.el;
|
|
481
|
+
}
|
|
482
|
+
computeClientRect() {
|
|
483
|
+
return internal_cjs.computeInnerRect(this.scrollController.el);
|
|
484
|
+
}
|
|
485
|
+
}
|
|
486
|
+
|
|
487
|
+
class WindowScrollGeomCache extends ScrollGeomCache {
|
|
488
|
+
constructor(doesListening) {
|
|
489
|
+
super(new internal_cjs.WindowScrollController(), doesListening);
|
|
490
|
+
}
|
|
491
|
+
getEventTarget() {
|
|
492
|
+
return window;
|
|
493
|
+
}
|
|
494
|
+
computeClientRect() {
|
|
495
|
+
return {
|
|
496
|
+
left: this.scrollLeft,
|
|
497
|
+
right: this.scrollLeft + this.clientWidth,
|
|
498
|
+
top: this.scrollTop,
|
|
499
|
+
bottom: this.scrollTop + this.clientHeight,
|
|
500
|
+
};
|
|
501
|
+
}
|
|
502
|
+
// the window is the only scroll object that changes it's rectangle relative
|
|
503
|
+
// to the document's topleft as it scrolls
|
|
504
|
+
handleScrollChange() {
|
|
505
|
+
this.clientRect = this.computeClientRect();
|
|
506
|
+
}
|
|
507
|
+
}
|
|
508
|
+
|
|
509
|
+
// If available we are using native "performance" API instead of "Date"
|
|
510
|
+
// Read more about it on MDN:
|
|
511
|
+
// https://developer.mozilla.org/en-US/docs/Web/API/Performance
|
|
512
|
+
const getTime = typeof performance === 'function' ? performance.now : Date.now;
|
|
513
|
+
/*
|
|
514
|
+
For a pointer interaction, automatically scrolls certain scroll containers when the pointer
|
|
515
|
+
approaches the edge.
|
|
516
|
+
|
|
517
|
+
The caller must call start + handleMove + stop.
|
|
518
|
+
*/
|
|
519
|
+
class AutoScroller {
|
|
520
|
+
constructor() {
|
|
521
|
+
// options that can be set by caller
|
|
522
|
+
this.isEnabled = true;
|
|
523
|
+
this.scrollQuery = [window, '.fc-scroller'];
|
|
524
|
+
this.edgeThreshold = 50; // pixels
|
|
525
|
+
this.maxVelocity = 300; // pixels per second
|
|
526
|
+
// internal state
|
|
527
|
+
this.pointerScreenX = null;
|
|
528
|
+
this.pointerScreenY = null;
|
|
529
|
+
this.isAnimating = false;
|
|
530
|
+
this.scrollCaches = null;
|
|
531
|
+
// protect against the initial pointerdown being too close to an edge and starting the scroll
|
|
532
|
+
this.everMovedUp = false;
|
|
533
|
+
this.everMovedDown = false;
|
|
534
|
+
this.everMovedLeft = false;
|
|
535
|
+
this.everMovedRight = false;
|
|
536
|
+
this.animate = () => {
|
|
537
|
+
if (this.isAnimating) { // wasn't cancelled between animation calls
|
|
538
|
+
let edge = this.computeBestEdge(this.pointerScreenX + window.pageXOffset, this.pointerScreenY + window.pageYOffset);
|
|
539
|
+
if (edge) {
|
|
540
|
+
let now = getTime();
|
|
541
|
+
this.handleSide(edge, (now - this.msSinceRequest) / 1000);
|
|
542
|
+
this.requestAnimation(now);
|
|
543
|
+
}
|
|
544
|
+
else {
|
|
545
|
+
this.isAnimating = false; // will stop animation
|
|
546
|
+
}
|
|
547
|
+
}
|
|
548
|
+
};
|
|
549
|
+
}
|
|
550
|
+
start(pageX, pageY, scrollStartEl) {
|
|
551
|
+
if (this.isEnabled) {
|
|
552
|
+
this.scrollCaches = this.buildCaches(scrollStartEl);
|
|
553
|
+
this.pointerScreenX = null;
|
|
554
|
+
this.pointerScreenY = null;
|
|
555
|
+
this.everMovedUp = false;
|
|
556
|
+
this.everMovedDown = false;
|
|
557
|
+
this.everMovedLeft = false;
|
|
558
|
+
this.everMovedRight = false;
|
|
559
|
+
this.handleMove(pageX, pageY);
|
|
560
|
+
}
|
|
561
|
+
}
|
|
562
|
+
handleMove(pageX, pageY) {
|
|
563
|
+
if (this.isEnabled) {
|
|
564
|
+
let pointerScreenX = pageX - window.pageXOffset;
|
|
565
|
+
let pointerScreenY = pageY - window.pageYOffset;
|
|
566
|
+
let yDelta = this.pointerScreenY === null ? 0 : pointerScreenY - this.pointerScreenY;
|
|
567
|
+
let xDelta = this.pointerScreenX === null ? 0 : pointerScreenX - this.pointerScreenX;
|
|
568
|
+
if (yDelta < 0) {
|
|
569
|
+
this.everMovedUp = true;
|
|
570
|
+
}
|
|
571
|
+
else if (yDelta > 0) {
|
|
572
|
+
this.everMovedDown = true;
|
|
573
|
+
}
|
|
574
|
+
if (xDelta < 0) {
|
|
575
|
+
this.everMovedLeft = true;
|
|
576
|
+
}
|
|
577
|
+
else if (xDelta > 0) {
|
|
578
|
+
this.everMovedRight = true;
|
|
579
|
+
}
|
|
580
|
+
this.pointerScreenX = pointerScreenX;
|
|
581
|
+
this.pointerScreenY = pointerScreenY;
|
|
582
|
+
if (!this.isAnimating) {
|
|
583
|
+
this.isAnimating = true;
|
|
584
|
+
this.requestAnimation(getTime());
|
|
585
|
+
}
|
|
586
|
+
}
|
|
587
|
+
}
|
|
588
|
+
stop() {
|
|
589
|
+
if (this.isEnabled) {
|
|
590
|
+
this.isAnimating = false; // will stop animation
|
|
591
|
+
for (let scrollCache of this.scrollCaches) {
|
|
592
|
+
scrollCache.destroy();
|
|
593
|
+
}
|
|
594
|
+
this.scrollCaches = null;
|
|
595
|
+
}
|
|
596
|
+
}
|
|
597
|
+
requestAnimation(now) {
|
|
598
|
+
this.msSinceRequest = now;
|
|
599
|
+
requestAnimationFrame(this.animate);
|
|
600
|
+
}
|
|
601
|
+
handleSide(edge, seconds) {
|
|
602
|
+
let { scrollCache } = edge;
|
|
603
|
+
let { edgeThreshold } = this;
|
|
604
|
+
let invDistance = edgeThreshold - edge.distance;
|
|
605
|
+
let velocity = // the closer to the edge, the faster we scroll
|
|
606
|
+
((invDistance * invDistance) / (edgeThreshold * edgeThreshold)) * // quadratic
|
|
607
|
+
this.maxVelocity * seconds;
|
|
608
|
+
let sign = 1;
|
|
609
|
+
switch (edge.name) {
|
|
610
|
+
case 'left':
|
|
611
|
+
sign = -1;
|
|
612
|
+
// falls through
|
|
613
|
+
case 'right':
|
|
614
|
+
scrollCache.setScrollLeft(scrollCache.getScrollLeft() + velocity * sign);
|
|
615
|
+
break;
|
|
616
|
+
case 'top':
|
|
617
|
+
sign = -1;
|
|
618
|
+
// falls through
|
|
619
|
+
case 'bottom':
|
|
620
|
+
scrollCache.setScrollTop(scrollCache.getScrollTop() + velocity * sign);
|
|
621
|
+
break;
|
|
622
|
+
}
|
|
623
|
+
}
|
|
624
|
+
// left/top are relative to document topleft
|
|
625
|
+
computeBestEdge(left, top) {
|
|
626
|
+
let { edgeThreshold } = this;
|
|
627
|
+
let bestSide = null;
|
|
628
|
+
let scrollCaches = this.scrollCaches || [];
|
|
629
|
+
for (let scrollCache of scrollCaches) {
|
|
630
|
+
let rect = scrollCache.clientRect;
|
|
631
|
+
let leftDist = left - rect.left;
|
|
632
|
+
let rightDist = rect.right - left;
|
|
633
|
+
let topDist = top - rect.top;
|
|
634
|
+
let bottomDist = rect.bottom - top;
|
|
635
|
+
// completely within the rect?
|
|
636
|
+
if (leftDist >= 0 && rightDist >= 0 && topDist >= 0 && bottomDist >= 0) {
|
|
637
|
+
if (topDist <= edgeThreshold && this.everMovedUp && scrollCache.canScrollUp() &&
|
|
638
|
+
(!bestSide || bestSide.distance > topDist)) {
|
|
639
|
+
bestSide = { scrollCache, name: 'top', distance: topDist };
|
|
640
|
+
}
|
|
641
|
+
if (bottomDist <= edgeThreshold && this.everMovedDown && scrollCache.canScrollDown() &&
|
|
642
|
+
(!bestSide || bestSide.distance > bottomDist)) {
|
|
643
|
+
bestSide = { scrollCache, name: 'bottom', distance: bottomDist };
|
|
644
|
+
}
|
|
645
|
+
if (leftDist <= edgeThreshold && this.everMovedLeft && scrollCache.canScrollLeft() &&
|
|
646
|
+
(!bestSide || bestSide.distance > leftDist)) {
|
|
647
|
+
bestSide = { scrollCache, name: 'left', distance: leftDist };
|
|
648
|
+
}
|
|
649
|
+
if (rightDist <= edgeThreshold && this.everMovedRight && scrollCache.canScrollRight() &&
|
|
650
|
+
(!bestSide || bestSide.distance > rightDist)) {
|
|
651
|
+
bestSide = { scrollCache, name: 'right', distance: rightDist };
|
|
652
|
+
}
|
|
653
|
+
}
|
|
654
|
+
}
|
|
655
|
+
return bestSide;
|
|
656
|
+
}
|
|
657
|
+
buildCaches(scrollStartEl) {
|
|
658
|
+
return this.queryScrollEls(scrollStartEl).map((el) => {
|
|
659
|
+
if (el === window) {
|
|
660
|
+
return new WindowScrollGeomCache(false); // false = don't listen to user-generated scrolls
|
|
661
|
+
}
|
|
662
|
+
return new ElementScrollGeomCache(el, false); // false = don't listen to user-generated scrolls
|
|
663
|
+
});
|
|
664
|
+
}
|
|
665
|
+
queryScrollEls(scrollStartEl) {
|
|
666
|
+
let els = [];
|
|
667
|
+
for (let query of this.scrollQuery) {
|
|
668
|
+
if (typeof query === 'object') {
|
|
669
|
+
els.push(query);
|
|
670
|
+
}
|
|
671
|
+
else {
|
|
672
|
+
els.push(...Array.prototype.slice.call(internal_cjs.getElRoot(scrollStartEl).querySelectorAll(query)));
|
|
673
|
+
}
|
|
674
|
+
}
|
|
675
|
+
return els;
|
|
676
|
+
}
|
|
677
|
+
}
|
|
678
|
+
|
|
679
|
+
/*
|
|
680
|
+
Monitors dragging on an element. Has a number of high-level features:
|
|
681
|
+
- minimum distance required before dragging
|
|
682
|
+
- minimum wait time ("delay") before dragging
|
|
683
|
+
- a mirror element that follows the pointer
|
|
684
|
+
*/
|
|
685
|
+
class FeaturefulElementDragging extends internal_cjs.ElementDragging {
|
|
686
|
+
constructor(containerEl, selector) {
|
|
687
|
+
super(containerEl);
|
|
688
|
+
this.containerEl = containerEl;
|
|
689
|
+
// options that can be directly set by caller
|
|
690
|
+
// the caller can also set the PointerDragging's options as well
|
|
691
|
+
this.delay = null;
|
|
692
|
+
this.minDistance = 0;
|
|
693
|
+
this.touchScrollAllowed = true; // prevents drag from starting and blocks scrolling during drag
|
|
694
|
+
this.mirrorNeedsRevert = false;
|
|
695
|
+
this.isInteracting = false; // is the user validly moving the pointer? lasts until pointerup
|
|
696
|
+
this.isDragging = false; // is it INTENTFULLY dragging? lasts until after revert animation
|
|
697
|
+
this.isDelayEnded = false;
|
|
698
|
+
this.isDistanceSurpassed = false;
|
|
699
|
+
this.delayTimeoutId = null;
|
|
700
|
+
this.onPointerDown = (ev) => {
|
|
701
|
+
if (!this.isDragging) { // so new drag doesn't happen while revert animation is going
|
|
702
|
+
this.isInteracting = true;
|
|
703
|
+
this.isDelayEnded = false;
|
|
704
|
+
this.isDistanceSurpassed = false;
|
|
705
|
+
internal_cjs.preventSelection(document.body);
|
|
706
|
+
internal_cjs.preventContextMenu(document.body);
|
|
707
|
+
// prevent links from being visited if there's an eventual drag.
|
|
708
|
+
// also prevents selection in older browsers (maybe?).
|
|
709
|
+
// not necessary for touch, besides, browser would complain about passiveness.
|
|
710
|
+
if (!ev.isTouch) {
|
|
711
|
+
ev.origEvent.preventDefault();
|
|
712
|
+
}
|
|
713
|
+
this.emitter.trigger('pointerdown', ev);
|
|
714
|
+
if (this.isInteracting && // not destroyed via pointerdown handler
|
|
715
|
+
!this.pointer.shouldIgnoreMove) {
|
|
716
|
+
// actions related to initiating dragstart+dragmove+dragend...
|
|
717
|
+
this.mirror.setIsVisible(false); // reset. caller must set-visible
|
|
718
|
+
this.mirror.start(ev.subjectEl, ev.pageX, ev.pageY); // must happen on first pointer down
|
|
719
|
+
this.startDelay(ev);
|
|
720
|
+
if (!this.minDistance) {
|
|
721
|
+
this.handleDistanceSurpassed(ev);
|
|
722
|
+
}
|
|
723
|
+
}
|
|
724
|
+
}
|
|
725
|
+
};
|
|
726
|
+
this.onPointerMove = (ev) => {
|
|
727
|
+
if (this.isInteracting) {
|
|
728
|
+
this.emitter.trigger('pointermove', ev);
|
|
729
|
+
if (!this.isDistanceSurpassed) {
|
|
730
|
+
let minDistance = this.minDistance;
|
|
731
|
+
let distanceSq; // current distance from the origin, squared
|
|
732
|
+
let { deltaX, deltaY } = ev;
|
|
733
|
+
distanceSq = deltaX * deltaX + deltaY * deltaY;
|
|
734
|
+
if (distanceSq >= minDistance * minDistance) { // use pythagorean theorem
|
|
735
|
+
this.handleDistanceSurpassed(ev);
|
|
736
|
+
}
|
|
737
|
+
}
|
|
738
|
+
if (this.isDragging) {
|
|
739
|
+
// a real pointer move? (not one simulated by scrolling)
|
|
740
|
+
if (ev.origEvent.type !== 'scroll') {
|
|
741
|
+
this.mirror.handleMove(ev.pageX, ev.pageY);
|
|
742
|
+
this.autoScroller.handleMove(ev.pageX, ev.pageY);
|
|
743
|
+
}
|
|
744
|
+
this.emitter.trigger('dragmove', ev);
|
|
745
|
+
}
|
|
746
|
+
}
|
|
747
|
+
};
|
|
748
|
+
this.onPointerUp = (ev) => {
|
|
749
|
+
if (this.isInteracting) {
|
|
750
|
+
this.isInteracting = false;
|
|
751
|
+
internal_cjs.allowSelection(document.body);
|
|
752
|
+
internal_cjs.allowContextMenu(document.body);
|
|
753
|
+
this.emitter.trigger('pointerup', ev); // can potentially set mirrorNeedsRevert
|
|
754
|
+
if (this.isDragging) {
|
|
755
|
+
this.autoScroller.stop();
|
|
756
|
+
this.tryStopDrag(ev); // which will stop the mirror
|
|
757
|
+
}
|
|
758
|
+
if (this.delayTimeoutId) {
|
|
759
|
+
clearTimeout(this.delayTimeoutId);
|
|
760
|
+
this.delayTimeoutId = null;
|
|
761
|
+
}
|
|
762
|
+
}
|
|
763
|
+
};
|
|
764
|
+
let pointer = this.pointer = new PointerDragging(containerEl);
|
|
765
|
+
pointer.emitter.on('pointerdown', this.onPointerDown);
|
|
766
|
+
pointer.emitter.on('pointermove', this.onPointerMove);
|
|
767
|
+
pointer.emitter.on('pointerup', this.onPointerUp);
|
|
768
|
+
if (selector) {
|
|
769
|
+
pointer.selector = selector;
|
|
770
|
+
}
|
|
771
|
+
this.mirror = new ElementMirror();
|
|
772
|
+
this.autoScroller = new AutoScroller();
|
|
773
|
+
}
|
|
774
|
+
destroy() {
|
|
775
|
+
this.pointer.destroy();
|
|
776
|
+
// HACK: simulate a pointer-up to end the current drag
|
|
777
|
+
// TODO: fire 'dragend' directly and stop interaction. discourage use of pointerup event (b/c might not fire)
|
|
778
|
+
this.onPointerUp({});
|
|
779
|
+
}
|
|
780
|
+
startDelay(ev) {
|
|
781
|
+
if (typeof this.delay === 'number') {
|
|
782
|
+
this.delayTimeoutId = setTimeout(() => {
|
|
783
|
+
this.delayTimeoutId = null;
|
|
784
|
+
this.handleDelayEnd(ev);
|
|
785
|
+
}, this.delay); // not assignable to number!
|
|
786
|
+
}
|
|
787
|
+
else {
|
|
788
|
+
this.handleDelayEnd(ev);
|
|
789
|
+
}
|
|
790
|
+
}
|
|
791
|
+
handleDelayEnd(ev) {
|
|
792
|
+
this.isDelayEnded = true;
|
|
793
|
+
this.tryStartDrag(ev);
|
|
794
|
+
}
|
|
795
|
+
handleDistanceSurpassed(ev) {
|
|
796
|
+
this.isDistanceSurpassed = true;
|
|
797
|
+
this.tryStartDrag(ev);
|
|
798
|
+
}
|
|
799
|
+
tryStartDrag(ev) {
|
|
800
|
+
if (this.isDelayEnded && this.isDistanceSurpassed) {
|
|
801
|
+
if (!this.pointer.wasTouchScroll || this.touchScrollAllowed) {
|
|
802
|
+
this.isDragging = true;
|
|
803
|
+
this.mirrorNeedsRevert = false;
|
|
804
|
+
this.autoScroller.start(ev.pageX, ev.pageY, this.containerEl);
|
|
805
|
+
this.emitter.trigger('dragstart', ev);
|
|
806
|
+
if (this.touchScrollAllowed === false) {
|
|
807
|
+
this.pointer.cancelTouchScroll();
|
|
808
|
+
}
|
|
809
|
+
}
|
|
810
|
+
}
|
|
811
|
+
}
|
|
812
|
+
tryStopDrag(ev) {
|
|
813
|
+
// .stop() is ALWAYS asynchronous, which we NEED because we want all pointerup events
|
|
814
|
+
// that come from the document to fire beforehand. much more convenient this way.
|
|
815
|
+
this.mirror.stop(this.mirrorNeedsRevert, this.stopDrag.bind(this, ev));
|
|
816
|
+
}
|
|
817
|
+
stopDrag(ev) {
|
|
818
|
+
this.isDragging = false;
|
|
819
|
+
this.emitter.trigger('dragend', ev);
|
|
820
|
+
}
|
|
821
|
+
// fill in the implementations...
|
|
822
|
+
setIgnoreMove(bool) {
|
|
823
|
+
this.pointer.shouldIgnoreMove = bool;
|
|
824
|
+
}
|
|
825
|
+
setMirrorIsVisible(bool) {
|
|
826
|
+
this.mirror.setIsVisible(bool);
|
|
827
|
+
}
|
|
828
|
+
setMirrorNeedsRevert(bool) {
|
|
829
|
+
this.mirrorNeedsRevert = bool;
|
|
830
|
+
}
|
|
831
|
+
setAutoScrollEnabled(bool) {
|
|
832
|
+
this.autoScroller.isEnabled = bool;
|
|
833
|
+
}
|
|
834
|
+
}
|
|
835
|
+
|
|
836
|
+
/*
|
|
837
|
+
When this class is instantiated, it records the offset of an element (relative to the document topleft),
|
|
838
|
+
and continues to monitor scrolling, updating the cached coordinates if it needs to.
|
|
839
|
+
Does not access the DOM after instantiation, so highly performant.
|
|
840
|
+
|
|
841
|
+
Also keeps track of all scrolling/overflow:hidden containers that are parents of the given element
|
|
842
|
+
and an determine if a given point is inside the combined clipping rectangle.
|
|
843
|
+
*/
|
|
844
|
+
class OffsetTracker {
|
|
845
|
+
constructor(el) {
|
|
846
|
+
this.origRect = internal_cjs.computeRect(el);
|
|
847
|
+
// will work fine for divs that have overflow:hidden
|
|
848
|
+
this.scrollCaches = internal_cjs.getClippingParents(el).map((scrollEl) => new ElementScrollGeomCache(scrollEl, true));
|
|
849
|
+
}
|
|
850
|
+
destroy() {
|
|
851
|
+
for (let scrollCache of this.scrollCaches) {
|
|
852
|
+
scrollCache.destroy();
|
|
853
|
+
}
|
|
854
|
+
}
|
|
855
|
+
computeLeft() {
|
|
856
|
+
let left = this.origRect.left;
|
|
857
|
+
for (let scrollCache of this.scrollCaches) {
|
|
858
|
+
left += scrollCache.origScrollLeft - scrollCache.getScrollLeft();
|
|
859
|
+
}
|
|
860
|
+
return left;
|
|
861
|
+
}
|
|
862
|
+
computeTop() {
|
|
863
|
+
let top = this.origRect.top;
|
|
864
|
+
for (let scrollCache of this.scrollCaches) {
|
|
865
|
+
top += scrollCache.origScrollTop - scrollCache.getScrollTop();
|
|
866
|
+
}
|
|
867
|
+
return top;
|
|
868
|
+
}
|
|
869
|
+
isWithinClipping(pageX, pageY) {
|
|
870
|
+
let point = { left: pageX, top: pageY };
|
|
871
|
+
for (let scrollCache of this.scrollCaches) {
|
|
872
|
+
if (!isIgnoredClipping(scrollCache.getEventTarget()) &&
|
|
873
|
+
!internal_cjs.pointInsideRect(point, scrollCache.clientRect)) {
|
|
874
|
+
return false;
|
|
875
|
+
}
|
|
876
|
+
}
|
|
877
|
+
return true;
|
|
878
|
+
}
|
|
879
|
+
}
|
|
880
|
+
// certain clipping containers should never constrain interactions, like <html> and <body>
|
|
881
|
+
// https://github.com/fullcalendar/fullcalendar/issues/3615
|
|
882
|
+
function isIgnoredClipping(node) {
|
|
883
|
+
let tagName = node.tagName;
|
|
884
|
+
return tagName === 'HTML' || tagName === 'BODY';
|
|
885
|
+
}
|
|
886
|
+
|
|
887
|
+
/*
|
|
888
|
+
Tracks movement over multiple droppable areas (aka "hits")
|
|
889
|
+
that exist in one or more DateComponents.
|
|
890
|
+
Relies on an existing draggable.
|
|
891
|
+
|
|
892
|
+
emits:
|
|
893
|
+
- pointerdown
|
|
894
|
+
- dragstart
|
|
895
|
+
- hitchange - fires initially, even if not over a hit
|
|
896
|
+
- pointerup
|
|
897
|
+
- (hitchange - again, to null, if ended over a hit)
|
|
898
|
+
- dragend
|
|
899
|
+
*/
|
|
900
|
+
class HitDragging {
|
|
901
|
+
constructor(dragging, droppableStore) {
|
|
902
|
+
// options that can be set by caller
|
|
903
|
+
this.useSubjectCenter = false;
|
|
904
|
+
this.requireInitial = true; // if doesn't start out on a hit, won't emit any events
|
|
905
|
+
this.initialHit = null;
|
|
906
|
+
this.movingHit = null;
|
|
907
|
+
this.finalHit = null; // won't ever be populated if shouldIgnoreMove
|
|
908
|
+
this.handlePointerDown = (ev) => {
|
|
909
|
+
let { dragging } = this;
|
|
910
|
+
this.initialHit = null;
|
|
911
|
+
this.movingHit = null;
|
|
912
|
+
this.finalHit = null;
|
|
913
|
+
this.prepareHits();
|
|
914
|
+
this.processFirstCoord(ev);
|
|
915
|
+
if (this.initialHit || !this.requireInitial) {
|
|
916
|
+
dragging.setIgnoreMove(false);
|
|
917
|
+
// TODO: fire this before computing processFirstCoord, so listeners can cancel. this gets fired by almost every handler :(
|
|
918
|
+
this.emitter.trigger('pointerdown', ev);
|
|
919
|
+
}
|
|
920
|
+
else {
|
|
921
|
+
dragging.setIgnoreMove(true);
|
|
922
|
+
}
|
|
923
|
+
};
|
|
924
|
+
this.handleDragStart = (ev) => {
|
|
925
|
+
this.emitter.trigger('dragstart', ev);
|
|
926
|
+
this.handleMove(ev, true); // force = fire even if initially null
|
|
927
|
+
};
|
|
928
|
+
this.handleDragMove = (ev) => {
|
|
929
|
+
this.emitter.trigger('dragmove', ev);
|
|
930
|
+
this.handleMove(ev);
|
|
931
|
+
};
|
|
932
|
+
this.handlePointerUp = (ev) => {
|
|
933
|
+
this.releaseHits();
|
|
934
|
+
this.emitter.trigger('pointerup', ev);
|
|
935
|
+
};
|
|
936
|
+
this.handleDragEnd = (ev) => {
|
|
937
|
+
if (this.movingHit) {
|
|
938
|
+
this.emitter.trigger('hitupdate', null, true, ev);
|
|
939
|
+
}
|
|
940
|
+
this.finalHit = this.movingHit;
|
|
941
|
+
this.movingHit = null;
|
|
942
|
+
this.emitter.trigger('dragend', ev);
|
|
943
|
+
};
|
|
944
|
+
this.droppableStore = droppableStore;
|
|
945
|
+
dragging.emitter.on('pointerdown', this.handlePointerDown);
|
|
946
|
+
dragging.emitter.on('dragstart', this.handleDragStart);
|
|
947
|
+
dragging.emitter.on('dragmove', this.handleDragMove);
|
|
948
|
+
dragging.emitter.on('pointerup', this.handlePointerUp);
|
|
949
|
+
dragging.emitter.on('dragend', this.handleDragEnd);
|
|
950
|
+
this.dragging = dragging;
|
|
951
|
+
this.emitter = new internal_cjs.Emitter();
|
|
952
|
+
}
|
|
953
|
+
// sets initialHit
|
|
954
|
+
// sets coordAdjust
|
|
955
|
+
processFirstCoord(ev) {
|
|
956
|
+
let origPoint = { left: ev.pageX, top: ev.pageY };
|
|
957
|
+
let adjustedPoint = origPoint;
|
|
958
|
+
let subjectEl = ev.subjectEl;
|
|
959
|
+
let subjectRect;
|
|
960
|
+
if (subjectEl instanceof HTMLElement) { // i.e. not a Document/ShadowRoot
|
|
961
|
+
subjectRect = internal_cjs.computeRect(subjectEl);
|
|
962
|
+
adjustedPoint = internal_cjs.constrainPoint(adjustedPoint, subjectRect);
|
|
963
|
+
}
|
|
964
|
+
let initialHit = this.initialHit = this.queryHitForOffset(adjustedPoint.left, adjustedPoint.top);
|
|
965
|
+
if (initialHit) {
|
|
966
|
+
if (this.useSubjectCenter && subjectRect) {
|
|
967
|
+
let slicedSubjectRect = internal_cjs.intersectRects(subjectRect, initialHit.rect);
|
|
968
|
+
if (slicedSubjectRect) {
|
|
969
|
+
adjustedPoint = internal_cjs.getRectCenter(slicedSubjectRect);
|
|
970
|
+
}
|
|
971
|
+
}
|
|
972
|
+
this.coordAdjust = internal_cjs.diffPoints(adjustedPoint, origPoint);
|
|
973
|
+
}
|
|
974
|
+
else {
|
|
975
|
+
this.coordAdjust = { left: 0, top: 0 };
|
|
976
|
+
}
|
|
977
|
+
}
|
|
978
|
+
handleMove(ev, forceHandle) {
|
|
979
|
+
let hit = this.queryHitForOffset(ev.pageX + this.coordAdjust.left, ev.pageY + this.coordAdjust.top);
|
|
980
|
+
if (forceHandle || !isHitsEqual(this.movingHit, hit)) {
|
|
981
|
+
this.movingHit = hit;
|
|
982
|
+
this.emitter.trigger('hitupdate', hit, false, ev);
|
|
983
|
+
}
|
|
984
|
+
}
|
|
985
|
+
prepareHits() {
|
|
986
|
+
this.offsetTrackers = internal_cjs.mapHash(this.droppableStore, (interactionSettings) => {
|
|
987
|
+
interactionSettings.component.prepareHits();
|
|
988
|
+
return new OffsetTracker(interactionSettings.el);
|
|
989
|
+
});
|
|
990
|
+
}
|
|
991
|
+
releaseHits() {
|
|
992
|
+
let { offsetTrackers } = this;
|
|
993
|
+
for (let id in offsetTrackers) {
|
|
994
|
+
offsetTrackers[id].destroy();
|
|
995
|
+
}
|
|
996
|
+
this.offsetTrackers = {};
|
|
997
|
+
}
|
|
998
|
+
queryHitForOffset(offsetLeft, offsetTop) {
|
|
999
|
+
let { droppableStore, offsetTrackers } = this;
|
|
1000
|
+
let bestHit = null;
|
|
1001
|
+
for (let id in droppableStore) {
|
|
1002
|
+
let component = droppableStore[id].component;
|
|
1003
|
+
let offsetTracker = offsetTrackers[id];
|
|
1004
|
+
if (offsetTracker && // wasn't destroyed mid-drag
|
|
1005
|
+
offsetTracker.isWithinClipping(offsetLeft, offsetTop)) {
|
|
1006
|
+
let originLeft = offsetTracker.computeLeft();
|
|
1007
|
+
let originTop = offsetTracker.computeTop();
|
|
1008
|
+
let positionLeft = offsetLeft - originLeft;
|
|
1009
|
+
let positionTop = offsetTop - originTop;
|
|
1010
|
+
let { origRect } = offsetTracker;
|
|
1011
|
+
let width = origRect.right - origRect.left;
|
|
1012
|
+
let height = origRect.bottom - origRect.top;
|
|
1013
|
+
if (
|
|
1014
|
+
// must be within the element's bounds
|
|
1015
|
+
positionLeft >= 0 && positionLeft < width &&
|
|
1016
|
+
positionTop >= 0 && positionTop < height) {
|
|
1017
|
+
let hit = component.queryHit(positionLeft, positionTop, width, height);
|
|
1018
|
+
if (hit && (
|
|
1019
|
+
// make sure the hit is within activeRange, meaning it's not a dead cell
|
|
1020
|
+
internal_cjs.rangeContainsRange(hit.dateProfile.activeRange, hit.dateSpan.range)) &&
|
|
1021
|
+
(!bestHit || hit.layer > bestHit.layer)) {
|
|
1022
|
+
hit.componentId = id;
|
|
1023
|
+
hit.context = component.context;
|
|
1024
|
+
// TODO: better way to re-orient rectangle
|
|
1025
|
+
hit.rect.left += originLeft;
|
|
1026
|
+
hit.rect.right += originLeft;
|
|
1027
|
+
hit.rect.top += originTop;
|
|
1028
|
+
hit.rect.bottom += originTop;
|
|
1029
|
+
bestHit = hit;
|
|
1030
|
+
}
|
|
1031
|
+
}
|
|
1032
|
+
}
|
|
1033
|
+
}
|
|
1034
|
+
return bestHit;
|
|
1035
|
+
}
|
|
1036
|
+
}
|
|
1037
|
+
function isHitsEqual(hit0, hit1) {
|
|
1038
|
+
if (!hit0 && !hit1) {
|
|
1039
|
+
return true;
|
|
1040
|
+
}
|
|
1041
|
+
if (Boolean(hit0) !== Boolean(hit1)) {
|
|
1042
|
+
return false;
|
|
1043
|
+
}
|
|
1044
|
+
return internal_cjs.isDateSpansEqual(hit0.dateSpan, hit1.dateSpan);
|
|
1045
|
+
}
|
|
1046
|
+
|
|
1047
|
+
function buildDatePointApiWithContext(dateSpan, context) {
|
|
1048
|
+
let props = {};
|
|
1049
|
+
for (let transform of context.pluginHooks.datePointTransforms) {
|
|
1050
|
+
Object.assign(props, transform(dateSpan, context));
|
|
1051
|
+
}
|
|
1052
|
+
Object.assign(props, buildDatePointApi(dateSpan, context.dateEnv));
|
|
1053
|
+
return props;
|
|
1054
|
+
}
|
|
1055
|
+
function buildDatePointApi(span, dateEnv) {
|
|
1056
|
+
return {
|
|
1057
|
+
date: dateEnv.toDate(span.range.start),
|
|
1058
|
+
dateStr: dateEnv.formatIso(span.range.start, { omitTime: span.allDay }),
|
|
1059
|
+
allDay: span.allDay,
|
|
1060
|
+
};
|
|
1061
|
+
}
|
|
1062
|
+
|
|
1063
|
+
/*
|
|
1064
|
+
Monitors when the user clicks on a specific date/time of a component.
|
|
1065
|
+
A pointerdown+pointerup on the same "hit" constitutes a click.
|
|
1066
|
+
*/
|
|
1067
|
+
class DateClicking extends internal_cjs.Interaction {
|
|
1068
|
+
constructor(settings) {
|
|
1069
|
+
super(settings);
|
|
1070
|
+
this.handlePointerDown = (pev) => {
|
|
1071
|
+
let { dragging } = this;
|
|
1072
|
+
let downEl = pev.origEvent.target;
|
|
1073
|
+
// do this in pointerdown (not dragend) because DOM might be mutated by the time dragend is fired
|
|
1074
|
+
dragging.setIgnoreMove(!this.component.isValidDateDownEl(downEl));
|
|
1075
|
+
};
|
|
1076
|
+
// won't even fire if moving was ignored
|
|
1077
|
+
this.handleDragEnd = (ev) => {
|
|
1078
|
+
let { component } = this;
|
|
1079
|
+
let { pointer } = this.dragging;
|
|
1080
|
+
if (!pointer.wasTouchScroll) {
|
|
1081
|
+
let { initialHit, finalHit } = this.hitDragging;
|
|
1082
|
+
if (initialHit && finalHit && isHitsEqual(initialHit, finalHit)) {
|
|
1083
|
+
let { context } = component;
|
|
1084
|
+
let arg = Object.assign(Object.assign({}, buildDatePointApiWithContext(initialHit.dateSpan, context)), { dayEl: initialHit.dayEl, jsEvent: ev.origEvent, view: context.viewApi || context.calendarApi.view });
|
|
1085
|
+
context.emitter.trigger('dateClick', arg);
|
|
1086
|
+
}
|
|
1087
|
+
}
|
|
1088
|
+
};
|
|
1089
|
+
// we DO want to watch pointer moves because otherwise finalHit won't get populated
|
|
1090
|
+
this.dragging = new FeaturefulElementDragging(settings.el);
|
|
1091
|
+
this.dragging.autoScroller.isEnabled = false;
|
|
1092
|
+
let hitDragging = this.hitDragging = new HitDragging(this.dragging, internal_cjs.interactionSettingsToStore(settings));
|
|
1093
|
+
hitDragging.emitter.on('pointerdown', this.handlePointerDown);
|
|
1094
|
+
hitDragging.emitter.on('dragend', this.handleDragEnd);
|
|
1095
|
+
}
|
|
1096
|
+
destroy() {
|
|
1097
|
+
this.dragging.destroy();
|
|
1098
|
+
}
|
|
1099
|
+
}
|
|
1100
|
+
|
|
1101
|
+
/*
|
|
1102
|
+
Tracks when the user selects a portion of time of a component,
|
|
1103
|
+
constituted by a drag over date cells, with a possible delay at the beginning of the drag.
|
|
1104
|
+
*/
|
|
1105
|
+
class DateSelecting extends internal_cjs.Interaction {
|
|
1106
|
+
constructor(settings) {
|
|
1107
|
+
super(settings);
|
|
1108
|
+
this.dragSelection = null;
|
|
1109
|
+
this.handlePointerDown = (ev) => {
|
|
1110
|
+
let { component, dragging } = this;
|
|
1111
|
+
let { options } = component.context;
|
|
1112
|
+
let canSelect = options.selectable &&
|
|
1113
|
+
component.isValidDateDownEl(ev.origEvent.target);
|
|
1114
|
+
// don't bother to watch expensive moves if component won't do selection
|
|
1115
|
+
dragging.setIgnoreMove(!canSelect);
|
|
1116
|
+
// if touch, require user to hold down
|
|
1117
|
+
dragging.delay = ev.isTouch ? getComponentTouchDelay$1(component) : null;
|
|
1118
|
+
};
|
|
1119
|
+
this.handleDragStart = (ev) => {
|
|
1120
|
+
this.component.context.calendarApi.unselect(ev); // unselect previous selections
|
|
1121
|
+
};
|
|
1122
|
+
this.handleHitUpdate = (hit, isFinal) => {
|
|
1123
|
+
let { context } = this.component;
|
|
1124
|
+
let dragSelection = null;
|
|
1125
|
+
let isInvalid = false;
|
|
1126
|
+
if (hit) {
|
|
1127
|
+
let initialHit = this.hitDragging.initialHit;
|
|
1128
|
+
let disallowed = hit.componentId === initialHit.componentId
|
|
1129
|
+
&& this.isHitComboAllowed
|
|
1130
|
+
&& !this.isHitComboAllowed(initialHit, hit);
|
|
1131
|
+
if (!disallowed) {
|
|
1132
|
+
dragSelection = joinHitsIntoSelection(initialHit, hit, context.pluginHooks.dateSelectionTransformers);
|
|
1133
|
+
}
|
|
1134
|
+
if (!dragSelection || !internal_cjs.isDateSelectionValid(dragSelection, hit.dateProfile, context)) {
|
|
1135
|
+
isInvalid = true;
|
|
1136
|
+
dragSelection = null;
|
|
1137
|
+
}
|
|
1138
|
+
}
|
|
1139
|
+
if (dragSelection) {
|
|
1140
|
+
context.dispatch({ type: 'SELECT_DATES', selection: dragSelection });
|
|
1141
|
+
}
|
|
1142
|
+
else if (!isFinal) { // only unselect if moved away while dragging
|
|
1143
|
+
context.dispatch({ type: 'UNSELECT_DATES' });
|
|
1144
|
+
}
|
|
1145
|
+
if (!isInvalid) {
|
|
1146
|
+
internal_cjs.enableCursor();
|
|
1147
|
+
}
|
|
1148
|
+
else {
|
|
1149
|
+
internal_cjs.disableCursor();
|
|
1150
|
+
}
|
|
1151
|
+
if (!isFinal) {
|
|
1152
|
+
this.dragSelection = dragSelection; // only clear if moved away from all hits while dragging
|
|
1153
|
+
}
|
|
1154
|
+
};
|
|
1155
|
+
this.handlePointerUp = (pev) => {
|
|
1156
|
+
if (this.dragSelection) {
|
|
1157
|
+
// selection is already rendered, so just need to report selection
|
|
1158
|
+
internal_cjs.triggerDateSelect(this.dragSelection, pev, this.component.context);
|
|
1159
|
+
this.dragSelection = null;
|
|
1160
|
+
}
|
|
1161
|
+
};
|
|
1162
|
+
let { component } = settings;
|
|
1163
|
+
let { options } = component.context;
|
|
1164
|
+
let dragging = this.dragging = new FeaturefulElementDragging(settings.el);
|
|
1165
|
+
dragging.touchScrollAllowed = false;
|
|
1166
|
+
dragging.minDistance = options.selectMinDistance || 0;
|
|
1167
|
+
dragging.autoScroller.isEnabled = options.dragScroll;
|
|
1168
|
+
let hitDragging = this.hitDragging = new HitDragging(this.dragging, internal_cjs.interactionSettingsToStore(settings));
|
|
1169
|
+
hitDragging.emitter.on('pointerdown', this.handlePointerDown);
|
|
1170
|
+
hitDragging.emitter.on('dragstart', this.handleDragStart);
|
|
1171
|
+
hitDragging.emitter.on('hitupdate', this.handleHitUpdate);
|
|
1172
|
+
hitDragging.emitter.on('pointerup', this.handlePointerUp);
|
|
1173
|
+
}
|
|
1174
|
+
destroy() {
|
|
1175
|
+
this.dragging.destroy();
|
|
1176
|
+
}
|
|
1177
|
+
}
|
|
1178
|
+
function getComponentTouchDelay$1(component) {
|
|
1179
|
+
let { options } = component.context;
|
|
1180
|
+
let delay = options.selectLongPressDelay;
|
|
1181
|
+
if (delay == null) {
|
|
1182
|
+
delay = options.longPressDelay;
|
|
1183
|
+
}
|
|
1184
|
+
return delay;
|
|
1185
|
+
}
|
|
1186
|
+
function joinHitsIntoSelection(hit0, hit1, dateSelectionTransformers) {
|
|
1187
|
+
let dateSpan0 = hit0.dateSpan;
|
|
1188
|
+
let dateSpan1 = hit1.dateSpan;
|
|
1189
|
+
let ms = [
|
|
1190
|
+
dateSpan0.range.start,
|
|
1191
|
+
dateSpan0.range.end,
|
|
1192
|
+
dateSpan1.range.start,
|
|
1193
|
+
dateSpan1.range.end,
|
|
1194
|
+
];
|
|
1195
|
+
ms.sort(internal_cjs.compareNumbers);
|
|
1196
|
+
let props = {};
|
|
1197
|
+
for (let transformer of dateSelectionTransformers) {
|
|
1198
|
+
let res = transformer(hit0, hit1);
|
|
1199
|
+
if (res === false) {
|
|
1200
|
+
return null;
|
|
1201
|
+
}
|
|
1202
|
+
if (res) {
|
|
1203
|
+
Object.assign(props, res);
|
|
1204
|
+
}
|
|
1205
|
+
}
|
|
1206
|
+
props.range = { start: ms[0], end: ms[3] };
|
|
1207
|
+
props.allDay = dateSpan0.allDay;
|
|
1208
|
+
return props;
|
|
1209
|
+
}
|
|
1210
|
+
|
|
1211
|
+
class EventDragging extends internal_cjs.Interaction {
|
|
1212
|
+
constructor(settings) {
|
|
1213
|
+
super(settings);
|
|
1214
|
+
// internal state
|
|
1215
|
+
this.subjectEl = null;
|
|
1216
|
+
this.subjectSeg = null; // the seg being selected/dragged
|
|
1217
|
+
this.isDragging = false;
|
|
1218
|
+
this.eventRange = null;
|
|
1219
|
+
this.relevantEvents = null; // the events being dragged
|
|
1220
|
+
this.receivingContext = null;
|
|
1221
|
+
this.validMutation = null;
|
|
1222
|
+
this.mutatedRelevantEvents = null;
|
|
1223
|
+
this.handlePointerDown = (ev) => {
|
|
1224
|
+
let origTarget = ev.origEvent.target;
|
|
1225
|
+
let { component, dragging } = this;
|
|
1226
|
+
let { mirror } = dragging;
|
|
1227
|
+
let { options } = component.context;
|
|
1228
|
+
let initialContext = component.context;
|
|
1229
|
+
this.subjectEl = ev.subjectEl;
|
|
1230
|
+
let subjectSeg = this.subjectSeg = internal_cjs.getElSeg(ev.subjectEl);
|
|
1231
|
+
let eventRange = this.eventRange = subjectSeg.eventRange;
|
|
1232
|
+
let eventInstanceId = eventRange.instance.instanceId;
|
|
1233
|
+
this.relevantEvents = internal_cjs.getRelevantEvents(initialContext.getCurrentData().eventStore, eventInstanceId);
|
|
1234
|
+
dragging.minDistance = ev.isTouch ? 0 : options.eventDragMinDistance;
|
|
1235
|
+
dragging.delay =
|
|
1236
|
+
// only do a touch delay if touch and this event hasn't been selected yet
|
|
1237
|
+
(ev.isTouch && eventInstanceId !== component.props.eventSelection) ?
|
|
1238
|
+
getComponentTouchDelay(component) :
|
|
1239
|
+
null;
|
|
1240
|
+
if (options.fixedMirrorParent) {
|
|
1241
|
+
mirror.parentNode = options.fixedMirrorParent;
|
|
1242
|
+
}
|
|
1243
|
+
else {
|
|
1244
|
+
mirror.parentNode = internal_cjs.elementClosest(origTarget, '.fc');
|
|
1245
|
+
}
|
|
1246
|
+
mirror.revertDuration = options.dragRevertDuration;
|
|
1247
|
+
let isValid = component.isValidSegDownEl(origTarget) &&
|
|
1248
|
+
!internal_cjs.elementClosest(origTarget, '.fc-event-resizer'); // NOT on a resizer
|
|
1249
|
+
dragging.setIgnoreMove(!isValid);
|
|
1250
|
+
// disable dragging for elements that are resizable (ie, selectable)
|
|
1251
|
+
// but are not draggable
|
|
1252
|
+
this.isDragging = isValid &&
|
|
1253
|
+
ev.subjectEl.classList.contains('fc-event-draggable');
|
|
1254
|
+
};
|
|
1255
|
+
this.handleDragStart = (ev) => {
|
|
1256
|
+
let initialContext = this.component.context;
|
|
1257
|
+
let eventRange = this.eventRange;
|
|
1258
|
+
let eventInstanceId = eventRange.instance.instanceId;
|
|
1259
|
+
if (ev.isTouch) {
|
|
1260
|
+
// need to select a different event?
|
|
1261
|
+
if (eventInstanceId !== this.component.props.eventSelection) {
|
|
1262
|
+
initialContext.dispatch({ type: 'SELECT_EVENT', eventInstanceId });
|
|
1263
|
+
}
|
|
1264
|
+
}
|
|
1265
|
+
else {
|
|
1266
|
+
// if now using mouse, but was previous touch interaction, clear selected event
|
|
1267
|
+
initialContext.dispatch({ type: 'UNSELECT_EVENT' });
|
|
1268
|
+
}
|
|
1269
|
+
if (this.isDragging) {
|
|
1270
|
+
initialContext.calendarApi.unselect(ev); // unselect *date* selection
|
|
1271
|
+
initialContext.emitter.trigger('eventDragStart', {
|
|
1272
|
+
el: this.subjectEl,
|
|
1273
|
+
event: new internal_cjs.EventImpl(initialContext, eventRange.def, eventRange.instance),
|
|
1274
|
+
jsEvent: ev.origEvent,
|
|
1275
|
+
view: initialContext.viewApi,
|
|
1276
|
+
});
|
|
1277
|
+
}
|
|
1278
|
+
};
|
|
1279
|
+
this.handleHitUpdate = (hit, isFinal) => {
|
|
1280
|
+
if (!this.isDragging) {
|
|
1281
|
+
return;
|
|
1282
|
+
}
|
|
1283
|
+
let relevantEvents = this.relevantEvents;
|
|
1284
|
+
let initialHit = this.hitDragging.initialHit;
|
|
1285
|
+
let initialContext = this.component.context;
|
|
1286
|
+
// states based on new hit
|
|
1287
|
+
let receivingContext = null;
|
|
1288
|
+
let mutation = null;
|
|
1289
|
+
let mutatedRelevantEvents = null;
|
|
1290
|
+
let isInvalid = false;
|
|
1291
|
+
let interaction = {
|
|
1292
|
+
affectedEvents: relevantEvents,
|
|
1293
|
+
mutatedEvents: internal_cjs.createEmptyEventStore(),
|
|
1294
|
+
isEvent: true,
|
|
1295
|
+
};
|
|
1296
|
+
if (hit) {
|
|
1297
|
+
receivingContext = hit.context;
|
|
1298
|
+
let receivingOptions = receivingContext.options;
|
|
1299
|
+
if (initialContext === receivingContext ||
|
|
1300
|
+
(receivingOptions.editable && receivingOptions.droppable)) {
|
|
1301
|
+
mutation = computeEventMutation(initialHit, hit, receivingContext.getCurrentData().pluginHooks.eventDragMutationMassagers);
|
|
1302
|
+
if (mutation) {
|
|
1303
|
+
mutatedRelevantEvents = internal_cjs.applyMutationToEventStore(relevantEvents, receivingContext.getCurrentData().eventUiBases, mutation, receivingContext);
|
|
1304
|
+
interaction.mutatedEvents = mutatedRelevantEvents;
|
|
1305
|
+
if (!internal_cjs.isInteractionValid(interaction, hit.dateProfile, receivingContext)) {
|
|
1306
|
+
isInvalid = true;
|
|
1307
|
+
mutation = null;
|
|
1308
|
+
mutatedRelevantEvents = null;
|
|
1309
|
+
interaction.mutatedEvents = internal_cjs.createEmptyEventStore();
|
|
1310
|
+
}
|
|
1311
|
+
}
|
|
1312
|
+
}
|
|
1313
|
+
else {
|
|
1314
|
+
receivingContext = null;
|
|
1315
|
+
}
|
|
1316
|
+
}
|
|
1317
|
+
this.displayDrag(receivingContext, interaction);
|
|
1318
|
+
if (!isInvalid) {
|
|
1319
|
+
internal_cjs.enableCursor();
|
|
1320
|
+
}
|
|
1321
|
+
else {
|
|
1322
|
+
internal_cjs.disableCursor();
|
|
1323
|
+
}
|
|
1324
|
+
if (!isFinal) {
|
|
1325
|
+
if (initialContext === receivingContext && // TODO: write test for this
|
|
1326
|
+
isHitsEqual(initialHit, hit)) {
|
|
1327
|
+
mutation = null;
|
|
1328
|
+
}
|
|
1329
|
+
this.dragging.setMirrorNeedsRevert(!mutation);
|
|
1330
|
+
// render the mirror if no already-rendered mirror
|
|
1331
|
+
// TODO: wish we could somehow wait for dispatch to guarantee render
|
|
1332
|
+
this.dragging.setMirrorIsVisible(!hit || !internal_cjs.getElRoot(this.subjectEl).querySelector('.fc-event-mirror'));
|
|
1333
|
+
// assign states based on new hit
|
|
1334
|
+
this.receivingContext = receivingContext;
|
|
1335
|
+
this.validMutation = mutation;
|
|
1336
|
+
this.mutatedRelevantEvents = mutatedRelevantEvents;
|
|
1337
|
+
}
|
|
1338
|
+
};
|
|
1339
|
+
this.handlePointerUp = () => {
|
|
1340
|
+
if (!this.isDragging) {
|
|
1341
|
+
this.cleanup(); // because handleDragEnd won't fire
|
|
1342
|
+
}
|
|
1343
|
+
};
|
|
1344
|
+
this.handleDragEnd = (ev) => {
|
|
1345
|
+
if (this.isDragging) {
|
|
1346
|
+
let initialContext = this.component.context;
|
|
1347
|
+
let initialView = initialContext.viewApi;
|
|
1348
|
+
let { receivingContext, validMutation } = this;
|
|
1349
|
+
let eventDef = this.eventRange.def;
|
|
1350
|
+
let eventInstance = this.eventRange.instance;
|
|
1351
|
+
let eventApi = new internal_cjs.EventImpl(initialContext, eventDef, eventInstance);
|
|
1352
|
+
let relevantEvents = this.relevantEvents;
|
|
1353
|
+
let mutatedRelevantEvents = this.mutatedRelevantEvents;
|
|
1354
|
+
let { finalHit } = this.hitDragging;
|
|
1355
|
+
this.clearDrag(); // must happen after revert animation
|
|
1356
|
+
initialContext.emitter.trigger('eventDragStop', {
|
|
1357
|
+
el: this.subjectEl,
|
|
1358
|
+
event: eventApi,
|
|
1359
|
+
jsEvent: ev.origEvent,
|
|
1360
|
+
view: initialView,
|
|
1361
|
+
});
|
|
1362
|
+
if (validMutation) {
|
|
1363
|
+
// dropped within same calendar
|
|
1364
|
+
if (receivingContext === initialContext) {
|
|
1365
|
+
let updatedEventApi = new internal_cjs.EventImpl(initialContext, mutatedRelevantEvents.defs[eventDef.defId], eventInstance ? mutatedRelevantEvents.instances[eventInstance.instanceId] : null);
|
|
1366
|
+
initialContext.dispatch({
|
|
1367
|
+
type: 'MERGE_EVENTS',
|
|
1368
|
+
eventStore: mutatedRelevantEvents,
|
|
1369
|
+
});
|
|
1370
|
+
let eventChangeArg = {
|
|
1371
|
+
oldEvent: eventApi,
|
|
1372
|
+
event: updatedEventApi,
|
|
1373
|
+
relatedEvents: internal_cjs.buildEventApis(mutatedRelevantEvents, initialContext, eventInstance),
|
|
1374
|
+
revert() {
|
|
1375
|
+
initialContext.dispatch({
|
|
1376
|
+
type: 'MERGE_EVENTS',
|
|
1377
|
+
eventStore: relevantEvents, // the pre-change data
|
|
1378
|
+
});
|
|
1379
|
+
},
|
|
1380
|
+
};
|
|
1381
|
+
let transformed = {};
|
|
1382
|
+
for (let transformer of initialContext.getCurrentData().pluginHooks.eventDropTransformers) {
|
|
1383
|
+
Object.assign(transformed, transformer(validMutation, initialContext));
|
|
1384
|
+
}
|
|
1385
|
+
initialContext.emitter.trigger('eventDrop', Object.assign(Object.assign(Object.assign({}, eventChangeArg), transformed), { el: ev.subjectEl, delta: validMutation.datesDelta, jsEvent: ev.origEvent, view: initialView }));
|
|
1386
|
+
initialContext.emitter.trigger('eventChange', eventChangeArg);
|
|
1387
|
+
// dropped in different calendar
|
|
1388
|
+
}
|
|
1389
|
+
else if (receivingContext) {
|
|
1390
|
+
let eventRemoveArg = {
|
|
1391
|
+
event: eventApi,
|
|
1392
|
+
relatedEvents: internal_cjs.buildEventApis(relevantEvents, initialContext, eventInstance),
|
|
1393
|
+
revert() {
|
|
1394
|
+
initialContext.dispatch({
|
|
1395
|
+
type: 'MERGE_EVENTS',
|
|
1396
|
+
eventStore: relevantEvents,
|
|
1397
|
+
});
|
|
1398
|
+
},
|
|
1399
|
+
};
|
|
1400
|
+
initialContext.emitter.trigger('eventLeave', Object.assign(Object.assign({}, eventRemoveArg), { draggedEl: ev.subjectEl, view: initialView }));
|
|
1401
|
+
initialContext.dispatch({
|
|
1402
|
+
type: 'REMOVE_EVENTS',
|
|
1403
|
+
eventStore: relevantEvents,
|
|
1404
|
+
});
|
|
1405
|
+
initialContext.emitter.trigger('eventRemove', eventRemoveArg);
|
|
1406
|
+
let addedEventDef = mutatedRelevantEvents.defs[eventDef.defId];
|
|
1407
|
+
let addedEventInstance = mutatedRelevantEvents.instances[eventInstance.instanceId];
|
|
1408
|
+
let addedEventApi = new internal_cjs.EventImpl(receivingContext, addedEventDef, addedEventInstance);
|
|
1409
|
+
receivingContext.dispatch({
|
|
1410
|
+
type: 'MERGE_EVENTS',
|
|
1411
|
+
eventStore: mutatedRelevantEvents,
|
|
1412
|
+
});
|
|
1413
|
+
let eventAddArg = {
|
|
1414
|
+
event: addedEventApi,
|
|
1415
|
+
relatedEvents: internal_cjs.buildEventApis(mutatedRelevantEvents, receivingContext, addedEventInstance),
|
|
1416
|
+
revert() {
|
|
1417
|
+
receivingContext.dispatch({
|
|
1418
|
+
type: 'REMOVE_EVENTS',
|
|
1419
|
+
eventStore: mutatedRelevantEvents,
|
|
1420
|
+
});
|
|
1421
|
+
},
|
|
1422
|
+
};
|
|
1423
|
+
receivingContext.emitter.trigger('eventAdd', eventAddArg);
|
|
1424
|
+
if (ev.isTouch) {
|
|
1425
|
+
receivingContext.dispatch({
|
|
1426
|
+
type: 'SELECT_EVENT',
|
|
1427
|
+
eventInstanceId: eventInstance.instanceId,
|
|
1428
|
+
});
|
|
1429
|
+
}
|
|
1430
|
+
receivingContext.emitter.trigger('drop', Object.assign(Object.assign({}, buildDatePointApiWithContext(finalHit.dateSpan, receivingContext)), { draggedEl: ev.subjectEl, jsEvent: ev.origEvent, view: finalHit.context.viewApi }));
|
|
1431
|
+
receivingContext.emitter.trigger('eventReceive', Object.assign(Object.assign({}, eventAddArg), { draggedEl: ev.subjectEl, view: finalHit.context.viewApi }));
|
|
1432
|
+
}
|
|
1433
|
+
}
|
|
1434
|
+
else {
|
|
1435
|
+
initialContext.emitter.trigger('_noEventDrop');
|
|
1436
|
+
}
|
|
1437
|
+
}
|
|
1438
|
+
this.cleanup();
|
|
1439
|
+
};
|
|
1440
|
+
let { component } = this;
|
|
1441
|
+
let { options } = component.context;
|
|
1442
|
+
let dragging = this.dragging = new FeaturefulElementDragging(settings.el);
|
|
1443
|
+
dragging.pointer.selector = EventDragging.SELECTOR;
|
|
1444
|
+
dragging.touchScrollAllowed = false;
|
|
1445
|
+
dragging.autoScroller.isEnabled = options.dragScroll;
|
|
1446
|
+
let hitDragging = this.hitDragging = new HitDragging(this.dragging, internal_cjs.interactionSettingsStore);
|
|
1447
|
+
hitDragging.useSubjectCenter = settings.useEventCenter;
|
|
1448
|
+
hitDragging.emitter.on('pointerdown', this.handlePointerDown);
|
|
1449
|
+
hitDragging.emitter.on('dragstart', this.handleDragStart);
|
|
1450
|
+
hitDragging.emitter.on('hitupdate', this.handleHitUpdate);
|
|
1451
|
+
hitDragging.emitter.on('pointerup', this.handlePointerUp);
|
|
1452
|
+
hitDragging.emitter.on('dragend', this.handleDragEnd);
|
|
1453
|
+
}
|
|
1454
|
+
destroy() {
|
|
1455
|
+
this.dragging.destroy();
|
|
1456
|
+
}
|
|
1457
|
+
// render a drag state on the next receivingCalendar
|
|
1458
|
+
displayDrag(nextContext, state) {
|
|
1459
|
+
let initialContext = this.component.context;
|
|
1460
|
+
let prevContext = this.receivingContext;
|
|
1461
|
+
// does the previous calendar need to be cleared?
|
|
1462
|
+
if (prevContext && prevContext !== nextContext) {
|
|
1463
|
+
// does the initial calendar need to be cleared?
|
|
1464
|
+
// if so, don't clear all the way. we still need to to hide the affectedEvents
|
|
1465
|
+
if (prevContext === initialContext) {
|
|
1466
|
+
prevContext.dispatch({
|
|
1467
|
+
type: 'SET_EVENT_DRAG',
|
|
1468
|
+
state: {
|
|
1469
|
+
affectedEvents: state.affectedEvents,
|
|
1470
|
+
mutatedEvents: internal_cjs.createEmptyEventStore(),
|
|
1471
|
+
isEvent: true,
|
|
1472
|
+
},
|
|
1473
|
+
});
|
|
1474
|
+
// completely clear the old calendar if it wasn't the initial
|
|
1475
|
+
}
|
|
1476
|
+
else {
|
|
1477
|
+
prevContext.dispatch({ type: 'UNSET_EVENT_DRAG' });
|
|
1478
|
+
}
|
|
1479
|
+
}
|
|
1480
|
+
if (nextContext) {
|
|
1481
|
+
nextContext.dispatch({ type: 'SET_EVENT_DRAG', state });
|
|
1482
|
+
}
|
|
1483
|
+
}
|
|
1484
|
+
clearDrag() {
|
|
1485
|
+
let initialCalendar = this.component.context;
|
|
1486
|
+
let { receivingContext } = this;
|
|
1487
|
+
if (receivingContext) {
|
|
1488
|
+
receivingContext.dispatch({ type: 'UNSET_EVENT_DRAG' });
|
|
1489
|
+
}
|
|
1490
|
+
// the initial calendar might have an dummy drag state from displayDrag
|
|
1491
|
+
if (initialCalendar !== receivingContext) {
|
|
1492
|
+
initialCalendar.dispatch({ type: 'UNSET_EVENT_DRAG' });
|
|
1493
|
+
}
|
|
1494
|
+
}
|
|
1495
|
+
cleanup() {
|
|
1496
|
+
this.subjectSeg = null;
|
|
1497
|
+
this.isDragging = false;
|
|
1498
|
+
this.eventRange = null;
|
|
1499
|
+
this.relevantEvents = null;
|
|
1500
|
+
this.receivingContext = null;
|
|
1501
|
+
this.validMutation = null;
|
|
1502
|
+
this.mutatedRelevantEvents = null;
|
|
1503
|
+
}
|
|
1504
|
+
}
|
|
1505
|
+
// TODO: test this in IE11
|
|
1506
|
+
// QUESTION: why do we need it on the resizable???
|
|
1507
|
+
EventDragging.SELECTOR = '.fc-event-draggable, .fc-event-resizable';
|
|
1508
|
+
function computeEventMutation(hit0, hit1, massagers) {
|
|
1509
|
+
let dateSpan0 = hit0.dateSpan;
|
|
1510
|
+
let dateSpan1 = hit1.dateSpan;
|
|
1511
|
+
let date0 = dateSpan0.range.start;
|
|
1512
|
+
let date1 = dateSpan1.range.start;
|
|
1513
|
+
let standardProps = {};
|
|
1514
|
+
if (dateSpan0.allDay !== dateSpan1.allDay) {
|
|
1515
|
+
standardProps.allDay = dateSpan1.allDay;
|
|
1516
|
+
standardProps.hasEnd = hit1.context.options.allDayMaintainDuration;
|
|
1517
|
+
if (dateSpan1.allDay) {
|
|
1518
|
+
// means date1 is already start-of-day,
|
|
1519
|
+
// but date0 needs to be converted
|
|
1520
|
+
date0 = internal_cjs.startOfDay(date0);
|
|
1521
|
+
}
|
|
1522
|
+
}
|
|
1523
|
+
let delta = internal_cjs.diffDates(date0, date1, hit0.context.dateEnv, hit0.componentId === hit1.componentId ?
|
|
1524
|
+
hit0.largeUnit :
|
|
1525
|
+
null);
|
|
1526
|
+
if (delta.milliseconds) { // has hours/minutes/seconds
|
|
1527
|
+
standardProps.allDay = false;
|
|
1528
|
+
}
|
|
1529
|
+
let mutation = {
|
|
1530
|
+
datesDelta: delta,
|
|
1531
|
+
standardProps,
|
|
1532
|
+
};
|
|
1533
|
+
for (let massager of massagers) {
|
|
1534
|
+
massager(mutation, hit0, hit1);
|
|
1535
|
+
}
|
|
1536
|
+
return mutation;
|
|
1537
|
+
}
|
|
1538
|
+
function getComponentTouchDelay(component) {
|
|
1539
|
+
let { options } = component.context;
|
|
1540
|
+
let delay = options.eventLongPressDelay;
|
|
1541
|
+
if (delay == null) {
|
|
1542
|
+
delay = options.longPressDelay;
|
|
1543
|
+
}
|
|
1544
|
+
return delay;
|
|
1545
|
+
}
|
|
1546
|
+
|
|
1547
|
+
class EventResizing extends internal_cjs.Interaction {
|
|
1548
|
+
constructor(settings) {
|
|
1549
|
+
super(settings);
|
|
1550
|
+
// internal state
|
|
1551
|
+
this.draggingSegEl = null;
|
|
1552
|
+
this.draggingSeg = null; // TODO: rename to resizingSeg? subjectSeg?
|
|
1553
|
+
this.eventRange = null;
|
|
1554
|
+
this.relevantEvents = null;
|
|
1555
|
+
this.validMutation = null;
|
|
1556
|
+
this.mutatedRelevantEvents = null;
|
|
1557
|
+
this.handlePointerDown = (ev) => {
|
|
1558
|
+
let { component } = this;
|
|
1559
|
+
let segEl = this.querySegEl(ev);
|
|
1560
|
+
let seg = internal_cjs.getElSeg(segEl);
|
|
1561
|
+
let eventRange = this.eventRange = seg.eventRange;
|
|
1562
|
+
this.dragging.minDistance = component.context.options.eventDragMinDistance;
|
|
1563
|
+
// if touch, need to be working with a selected event
|
|
1564
|
+
this.dragging.setIgnoreMove(!this.component.isValidSegDownEl(ev.origEvent.target) ||
|
|
1565
|
+
(ev.isTouch && this.component.props.eventSelection !== eventRange.instance.instanceId));
|
|
1566
|
+
};
|
|
1567
|
+
this.handleDragStart = (ev) => {
|
|
1568
|
+
let { context } = this.component;
|
|
1569
|
+
let eventRange = this.eventRange;
|
|
1570
|
+
this.relevantEvents = internal_cjs.getRelevantEvents(context.getCurrentData().eventStore, this.eventRange.instance.instanceId);
|
|
1571
|
+
let segEl = this.querySegEl(ev);
|
|
1572
|
+
this.draggingSegEl = segEl;
|
|
1573
|
+
this.draggingSeg = internal_cjs.getElSeg(segEl);
|
|
1574
|
+
context.calendarApi.unselect();
|
|
1575
|
+
context.emitter.trigger('eventResizeStart', {
|
|
1576
|
+
el: segEl,
|
|
1577
|
+
event: new internal_cjs.EventImpl(context, eventRange.def, eventRange.instance),
|
|
1578
|
+
jsEvent: ev.origEvent,
|
|
1579
|
+
view: context.viewApi,
|
|
1580
|
+
});
|
|
1581
|
+
};
|
|
1582
|
+
this.handleHitUpdate = (hit, isFinal, ev) => {
|
|
1583
|
+
let { context } = this.component;
|
|
1584
|
+
let relevantEvents = this.relevantEvents;
|
|
1585
|
+
let initialHit = this.hitDragging.initialHit;
|
|
1586
|
+
let eventInstance = this.eventRange.instance;
|
|
1587
|
+
let mutation = null;
|
|
1588
|
+
let mutatedRelevantEvents = null;
|
|
1589
|
+
let isInvalid = false;
|
|
1590
|
+
let interaction = {
|
|
1591
|
+
affectedEvents: relevantEvents,
|
|
1592
|
+
mutatedEvents: internal_cjs.createEmptyEventStore(),
|
|
1593
|
+
isEvent: true,
|
|
1594
|
+
};
|
|
1595
|
+
if (hit) {
|
|
1596
|
+
let disallowed = hit.componentId === initialHit.componentId
|
|
1597
|
+
&& this.isHitComboAllowed
|
|
1598
|
+
&& !this.isHitComboAllowed(initialHit, hit);
|
|
1599
|
+
if (!disallowed) {
|
|
1600
|
+
mutation = computeMutation(initialHit, hit, ev.subjectEl.classList.contains('fc-event-resizer-start'), eventInstance.range);
|
|
1601
|
+
}
|
|
1602
|
+
}
|
|
1603
|
+
if (mutation) {
|
|
1604
|
+
mutatedRelevantEvents = internal_cjs.applyMutationToEventStore(relevantEvents, context.getCurrentData().eventUiBases, mutation, context);
|
|
1605
|
+
interaction.mutatedEvents = mutatedRelevantEvents;
|
|
1606
|
+
if (!internal_cjs.isInteractionValid(interaction, hit.dateProfile, context)) {
|
|
1607
|
+
isInvalid = true;
|
|
1608
|
+
mutation = null;
|
|
1609
|
+
mutatedRelevantEvents = null;
|
|
1610
|
+
interaction.mutatedEvents = null;
|
|
1611
|
+
}
|
|
1612
|
+
}
|
|
1613
|
+
if (mutatedRelevantEvents) {
|
|
1614
|
+
context.dispatch({
|
|
1615
|
+
type: 'SET_EVENT_RESIZE',
|
|
1616
|
+
state: interaction,
|
|
1617
|
+
});
|
|
1618
|
+
}
|
|
1619
|
+
else {
|
|
1620
|
+
context.dispatch({ type: 'UNSET_EVENT_RESIZE' });
|
|
1621
|
+
}
|
|
1622
|
+
if (!isInvalid) {
|
|
1623
|
+
internal_cjs.enableCursor();
|
|
1624
|
+
}
|
|
1625
|
+
else {
|
|
1626
|
+
internal_cjs.disableCursor();
|
|
1627
|
+
}
|
|
1628
|
+
if (!isFinal) {
|
|
1629
|
+
if (mutation && isHitsEqual(initialHit, hit)) {
|
|
1630
|
+
mutation = null;
|
|
1631
|
+
}
|
|
1632
|
+
this.validMutation = mutation;
|
|
1633
|
+
this.mutatedRelevantEvents = mutatedRelevantEvents;
|
|
1634
|
+
}
|
|
1635
|
+
};
|
|
1636
|
+
this.handleDragEnd = (ev) => {
|
|
1637
|
+
let { context } = this.component;
|
|
1638
|
+
let eventDef = this.eventRange.def;
|
|
1639
|
+
let eventInstance = this.eventRange.instance;
|
|
1640
|
+
let eventApi = new internal_cjs.EventImpl(context, eventDef, eventInstance);
|
|
1641
|
+
let relevantEvents = this.relevantEvents;
|
|
1642
|
+
let mutatedRelevantEvents = this.mutatedRelevantEvents;
|
|
1643
|
+
context.emitter.trigger('eventResizeStop', {
|
|
1644
|
+
el: this.draggingSegEl,
|
|
1645
|
+
event: eventApi,
|
|
1646
|
+
jsEvent: ev.origEvent,
|
|
1647
|
+
view: context.viewApi,
|
|
1648
|
+
});
|
|
1649
|
+
if (this.validMutation) {
|
|
1650
|
+
let updatedEventApi = new internal_cjs.EventImpl(context, mutatedRelevantEvents.defs[eventDef.defId], eventInstance ? mutatedRelevantEvents.instances[eventInstance.instanceId] : null);
|
|
1651
|
+
context.dispatch({
|
|
1652
|
+
type: 'MERGE_EVENTS',
|
|
1653
|
+
eventStore: mutatedRelevantEvents,
|
|
1654
|
+
});
|
|
1655
|
+
let eventChangeArg = {
|
|
1656
|
+
oldEvent: eventApi,
|
|
1657
|
+
event: updatedEventApi,
|
|
1658
|
+
relatedEvents: internal_cjs.buildEventApis(mutatedRelevantEvents, context, eventInstance),
|
|
1659
|
+
revert() {
|
|
1660
|
+
context.dispatch({
|
|
1661
|
+
type: 'MERGE_EVENTS',
|
|
1662
|
+
eventStore: relevantEvents, // the pre-change events
|
|
1663
|
+
});
|
|
1664
|
+
},
|
|
1665
|
+
};
|
|
1666
|
+
context.emitter.trigger('eventResize', Object.assign(Object.assign({}, eventChangeArg), { el: this.draggingSegEl, startDelta: this.validMutation.startDelta || internal_cjs.createDuration(0), endDelta: this.validMutation.endDelta || internal_cjs.createDuration(0), jsEvent: ev.origEvent, view: context.viewApi }));
|
|
1667
|
+
context.emitter.trigger('eventChange', eventChangeArg);
|
|
1668
|
+
}
|
|
1669
|
+
else {
|
|
1670
|
+
context.emitter.trigger('_noEventResize');
|
|
1671
|
+
}
|
|
1672
|
+
// reset all internal state
|
|
1673
|
+
this.draggingSeg = null;
|
|
1674
|
+
this.relevantEvents = null;
|
|
1675
|
+
this.validMutation = null;
|
|
1676
|
+
// okay to keep eventInstance around. useful to set it in handlePointerDown
|
|
1677
|
+
};
|
|
1678
|
+
let { component } = settings;
|
|
1679
|
+
let dragging = this.dragging = new FeaturefulElementDragging(settings.el);
|
|
1680
|
+
dragging.pointer.selector = '.fc-event-resizer';
|
|
1681
|
+
dragging.touchScrollAllowed = false;
|
|
1682
|
+
dragging.autoScroller.isEnabled = component.context.options.dragScroll;
|
|
1683
|
+
let hitDragging = this.hitDragging = new HitDragging(this.dragging, internal_cjs.interactionSettingsToStore(settings));
|
|
1684
|
+
hitDragging.emitter.on('pointerdown', this.handlePointerDown);
|
|
1685
|
+
hitDragging.emitter.on('dragstart', this.handleDragStart);
|
|
1686
|
+
hitDragging.emitter.on('hitupdate', this.handleHitUpdate);
|
|
1687
|
+
hitDragging.emitter.on('dragend', this.handleDragEnd);
|
|
1688
|
+
}
|
|
1689
|
+
destroy() {
|
|
1690
|
+
this.dragging.destroy();
|
|
1691
|
+
}
|
|
1692
|
+
querySegEl(ev) {
|
|
1693
|
+
return internal_cjs.elementClosest(ev.subjectEl, '.fc-event');
|
|
1694
|
+
}
|
|
1695
|
+
}
|
|
1696
|
+
function computeMutation(hit0, hit1, isFromStart, instanceRange) {
|
|
1697
|
+
let dateEnv = hit0.context.dateEnv;
|
|
1698
|
+
let date0 = hit0.dateSpan.range.start;
|
|
1699
|
+
let date1 = hit1.dateSpan.range.start;
|
|
1700
|
+
let delta = internal_cjs.diffDates(date0, date1, dateEnv, hit0.largeUnit);
|
|
1701
|
+
if (isFromStart) {
|
|
1702
|
+
if (dateEnv.add(instanceRange.start, delta) < instanceRange.end) {
|
|
1703
|
+
return { startDelta: delta };
|
|
1704
|
+
}
|
|
1705
|
+
}
|
|
1706
|
+
else if (dateEnv.add(instanceRange.end, delta) > instanceRange.start) {
|
|
1707
|
+
return { endDelta: delta };
|
|
1708
|
+
}
|
|
1709
|
+
return null;
|
|
1710
|
+
}
|
|
1711
|
+
|
|
1712
|
+
class UnselectAuto {
|
|
1713
|
+
constructor(context) {
|
|
1714
|
+
this.context = context;
|
|
1715
|
+
this.isRecentPointerDateSelect = false; // wish we could use a selector to detect date selection, but uses hit system
|
|
1716
|
+
this.matchesCancel = false;
|
|
1717
|
+
this.matchesEvent = false;
|
|
1718
|
+
this.onSelect = (selectInfo) => {
|
|
1719
|
+
if (selectInfo.jsEvent) {
|
|
1720
|
+
this.isRecentPointerDateSelect = true;
|
|
1721
|
+
}
|
|
1722
|
+
};
|
|
1723
|
+
this.onDocumentPointerDown = (pev) => {
|
|
1724
|
+
let unselectCancel = this.context.options.unselectCancel;
|
|
1725
|
+
let downEl = internal_cjs.getEventTargetViaRoot(pev.origEvent);
|
|
1726
|
+
this.matchesCancel = !!internal_cjs.elementClosest(downEl, unselectCancel);
|
|
1727
|
+
this.matchesEvent = !!internal_cjs.elementClosest(downEl, EventDragging.SELECTOR); // interaction started on an event?
|
|
1728
|
+
};
|
|
1729
|
+
this.onDocumentPointerUp = (pev) => {
|
|
1730
|
+
let { context } = this;
|
|
1731
|
+
let { documentPointer } = this;
|
|
1732
|
+
let calendarState = context.getCurrentData();
|
|
1733
|
+
// touch-scrolling should never unfocus any type of selection
|
|
1734
|
+
if (!documentPointer.wasTouchScroll) {
|
|
1735
|
+
if (calendarState.dateSelection && // an existing date selection?
|
|
1736
|
+
!this.isRecentPointerDateSelect // a new pointer-initiated date selection since last onDocumentPointerUp?
|
|
1737
|
+
) {
|
|
1738
|
+
let unselectAuto = context.options.unselectAuto;
|
|
1739
|
+
if (unselectAuto && (!unselectAuto || !this.matchesCancel)) {
|
|
1740
|
+
context.calendarApi.unselect(pev);
|
|
1741
|
+
}
|
|
1742
|
+
}
|
|
1743
|
+
if (calendarState.eventSelection && // an existing event selected?
|
|
1744
|
+
!this.matchesEvent // interaction DIDN'T start on an event
|
|
1745
|
+
) {
|
|
1746
|
+
context.dispatch({ type: 'UNSELECT_EVENT' });
|
|
1747
|
+
}
|
|
1748
|
+
}
|
|
1749
|
+
this.isRecentPointerDateSelect = false;
|
|
1750
|
+
};
|
|
1751
|
+
let documentPointer = this.documentPointer = new PointerDragging(document);
|
|
1752
|
+
documentPointer.shouldIgnoreMove = true;
|
|
1753
|
+
documentPointer.shouldWatchScroll = false;
|
|
1754
|
+
documentPointer.emitter.on('pointerdown', this.onDocumentPointerDown);
|
|
1755
|
+
documentPointer.emitter.on('pointerup', this.onDocumentPointerUp);
|
|
1756
|
+
/*
|
|
1757
|
+
TODO: better way to know about whether there was a selection with the pointer
|
|
1758
|
+
*/
|
|
1759
|
+
context.emitter.on('select', this.onSelect);
|
|
1760
|
+
}
|
|
1761
|
+
destroy() {
|
|
1762
|
+
this.context.emitter.off('select', this.onSelect);
|
|
1763
|
+
this.documentPointer.destroy();
|
|
1764
|
+
}
|
|
1765
|
+
}
|
|
1766
|
+
|
|
1767
|
+
const OPTION_REFINERS = {
|
|
1768
|
+
fixedMirrorParent: internal_cjs.identity,
|
|
1769
|
+
};
|
|
1770
|
+
const LISTENER_REFINERS = {
|
|
1771
|
+
dateClick: internal_cjs.identity,
|
|
1772
|
+
eventDragStart: internal_cjs.identity,
|
|
1773
|
+
eventDragStop: internal_cjs.identity,
|
|
1774
|
+
eventDrop: internal_cjs.identity,
|
|
1775
|
+
eventResizeStart: internal_cjs.identity,
|
|
1776
|
+
eventResizeStop: internal_cjs.identity,
|
|
1777
|
+
eventResize: internal_cjs.identity,
|
|
1778
|
+
drop: internal_cjs.identity,
|
|
1779
|
+
eventReceive: internal_cjs.identity,
|
|
1780
|
+
eventLeave: internal_cjs.identity,
|
|
1781
|
+
};
|
|
1782
|
+
|
|
1783
|
+
/*
|
|
1784
|
+
Given an already instantiated draggable object for one-or-more elements,
|
|
1785
|
+
Interprets any dragging as an attempt to drag an events that lives outside
|
|
1786
|
+
of a calendar onto a calendar.
|
|
1787
|
+
*/
|
|
1788
|
+
class ExternalElementDragging {
|
|
1789
|
+
constructor(dragging, suppliedDragMeta) {
|
|
1790
|
+
this.receivingContext = null;
|
|
1791
|
+
this.droppableEvent = null; // will exist for all drags, even if create:false
|
|
1792
|
+
this.suppliedDragMeta = null;
|
|
1793
|
+
this.dragMeta = null;
|
|
1794
|
+
this.handleDragStart = (ev) => {
|
|
1795
|
+
this.dragMeta = this.buildDragMeta(ev.subjectEl);
|
|
1796
|
+
};
|
|
1797
|
+
this.handleHitUpdate = (hit, isFinal, ev) => {
|
|
1798
|
+
let { dragging } = this.hitDragging;
|
|
1799
|
+
let receivingContext = null;
|
|
1800
|
+
let droppableEvent = null;
|
|
1801
|
+
let isInvalid = false;
|
|
1802
|
+
let interaction = {
|
|
1803
|
+
affectedEvents: internal_cjs.createEmptyEventStore(),
|
|
1804
|
+
mutatedEvents: internal_cjs.createEmptyEventStore(),
|
|
1805
|
+
isEvent: this.dragMeta.create,
|
|
1806
|
+
};
|
|
1807
|
+
if (hit) {
|
|
1808
|
+
receivingContext = hit.context;
|
|
1809
|
+
if (this.canDropElOnCalendar(ev.subjectEl, receivingContext)) {
|
|
1810
|
+
droppableEvent = computeEventForDateSpan(hit.dateSpan, this.dragMeta, receivingContext);
|
|
1811
|
+
interaction.mutatedEvents = internal_cjs.eventTupleToStore(droppableEvent);
|
|
1812
|
+
isInvalid = !internal_cjs.isInteractionValid(interaction, hit.dateProfile, receivingContext);
|
|
1813
|
+
if (isInvalid) {
|
|
1814
|
+
interaction.mutatedEvents = internal_cjs.createEmptyEventStore();
|
|
1815
|
+
droppableEvent = null;
|
|
1816
|
+
}
|
|
1817
|
+
}
|
|
1818
|
+
}
|
|
1819
|
+
this.displayDrag(receivingContext, interaction);
|
|
1820
|
+
// show mirror if no already-rendered mirror element OR if we are shutting down the mirror (?)
|
|
1821
|
+
// TODO: wish we could somehow wait for dispatch to guarantee render
|
|
1822
|
+
dragging.setMirrorIsVisible(isFinal || !droppableEvent || !document.querySelector('.fc-event-mirror'));
|
|
1823
|
+
if (!isInvalid) {
|
|
1824
|
+
internal_cjs.enableCursor();
|
|
1825
|
+
}
|
|
1826
|
+
else {
|
|
1827
|
+
internal_cjs.disableCursor();
|
|
1828
|
+
}
|
|
1829
|
+
if (!isFinal) {
|
|
1830
|
+
dragging.setMirrorNeedsRevert(!droppableEvent);
|
|
1831
|
+
this.receivingContext = receivingContext;
|
|
1832
|
+
this.droppableEvent = droppableEvent;
|
|
1833
|
+
}
|
|
1834
|
+
};
|
|
1835
|
+
this.handleDragEnd = (pev) => {
|
|
1836
|
+
let { receivingContext, droppableEvent } = this;
|
|
1837
|
+
this.clearDrag();
|
|
1838
|
+
if (receivingContext && droppableEvent) {
|
|
1839
|
+
let finalHit = this.hitDragging.finalHit;
|
|
1840
|
+
let finalView = finalHit.context.viewApi;
|
|
1841
|
+
let dragMeta = this.dragMeta;
|
|
1842
|
+
receivingContext.emitter.trigger('drop', Object.assign(Object.assign({}, buildDatePointApiWithContext(finalHit.dateSpan, receivingContext)), { draggedEl: pev.subjectEl, jsEvent: pev.origEvent, view: finalView }));
|
|
1843
|
+
if (dragMeta.create) {
|
|
1844
|
+
let addingEvents = internal_cjs.eventTupleToStore(droppableEvent);
|
|
1845
|
+
receivingContext.dispatch({
|
|
1846
|
+
type: 'MERGE_EVENTS',
|
|
1847
|
+
eventStore: addingEvents,
|
|
1848
|
+
});
|
|
1849
|
+
if (pev.isTouch) {
|
|
1850
|
+
receivingContext.dispatch({
|
|
1851
|
+
type: 'SELECT_EVENT',
|
|
1852
|
+
eventInstanceId: droppableEvent.instance.instanceId,
|
|
1853
|
+
});
|
|
1854
|
+
}
|
|
1855
|
+
// signal that an external event landed
|
|
1856
|
+
receivingContext.emitter.trigger('eventReceive', {
|
|
1857
|
+
event: new internal_cjs.EventImpl(receivingContext, droppableEvent.def, droppableEvent.instance),
|
|
1858
|
+
relatedEvents: [],
|
|
1859
|
+
revert() {
|
|
1860
|
+
receivingContext.dispatch({
|
|
1861
|
+
type: 'REMOVE_EVENTS',
|
|
1862
|
+
eventStore: addingEvents,
|
|
1863
|
+
});
|
|
1864
|
+
},
|
|
1865
|
+
draggedEl: pev.subjectEl,
|
|
1866
|
+
view: finalView,
|
|
1867
|
+
});
|
|
1868
|
+
}
|
|
1869
|
+
}
|
|
1870
|
+
this.receivingContext = null;
|
|
1871
|
+
this.droppableEvent = null;
|
|
1872
|
+
};
|
|
1873
|
+
let hitDragging = this.hitDragging = new HitDragging(dragging, internal_cjs.interactionSettingsStore);
|
|
1874
|
+
hitDragging.requireInitial = false; // will start outside of a component
|
|
1875
|
+
hitDragging.emitter.on('dragstart', this.handleDragStart);
|
|
1876
|
+
hitDragging.emitter.on('hitupdate', this.handleHitUpdate);
|
|
1877
|
+
hitDragging.emitter.on('dragend', this.handleDragEnd);
|
|
1878
|
+
this.suppliedDragMeta = suppliedDragMeta;
|
|
1879
|
+
}
|
|
1880
|
+
buildDragMeta(subjectEl) {
|
|
1881
|
+
if (typeof this.suppliedDragMeta === 'object') {
|
|
1882
|
+
return internal_cjs.parseDragMeta(this.suppliedDragMeta);
|
|
1883
|
+
}
|
|
1884
|
+
if (typeof this.suppliedDragMeta === 'function') {
|
|
1885
|
+
return internal_cjs.parseDragMeta(this.suppliedDragMeta(subjectEl));
|
|
1886
|
+
}
|
|
1887
|
+
return getDragMetaFromEl(subjectEl);
|
|
1888
|
+
}
|
|
1889
|
+
displayDrag(nextContext, state) {
|
|
1890
|
+
let prevContext = this.receivingContext;
|
|
1891
|
+
if (prevContext && prevContext !== nextContext) {
|
|
1892
|
+
prevContext.dispatch({ type: 'UNSET_EVENT_DRAG' });
|
|
1893
|
+
}
|
|
1894
|
+
if (nextContext) {
|
|
1895
|
+
nextContext.dispatch({ type: 'SET_EVENT_DRAG', state });
|
|
1896
|
+
}
|
|
1897
|
+
}
|
|
1898
|
+
clearDrag() {
|
|
1899
|
+
if (this.receivingContext) {
|
|
1900
|
+
this.receivingContext.dispatch({ type: 'UNSET_EVENT_DRAG' });
|
|
1901
|
+
}
|
|
1902
|
+
}
|
|
1903
|
+
canDropElOnCalendar(el, receivingContext) {
|
|
1904
|
+
let dropAccept = receivingContext.options.dropAccept;
|
|
1905
|
+
if (typeof dropAccept === 'function') {
|
|
1906
|
+
return dropAccept.call(receivingContext.calendarApi, el);
|
|
1907
|
+
}
|
|
1908
|
+
if (typeof dropAccept === 'string' && dropAccept) {
|
|
1909
|
+
return Boolean(internal_cjs.elementMatches(el, dropAccept));
|
|
1910
|
+
}
|
|
1911
|
+
return true;
|
|
1912
|
+
}
|
|
1913
|
+
}
|
|
1914
|
+
// Utils for computing event store from the DragMeta
|
|
1915
|
+
// ----------------------------------------------------------------------------------------------------
|
|
1916
|
+
function computeEventForDateSpan(dateSpan, dragMeta, context) {
|
|
1917
|
+
let defProps = Object.assign({}, dragMeta.leftoverProps);
|
|
1918
|
+
for (let transform of context.pluginHooks.externalDefTransforms) {
|
|
1919
|
+
Object.assign(defProps, transform(dateSpan, dragMeta));
|
|
1920
|
+
}
|
|
1921
|
+
let { refined, extra } = internal_cjs.refineEventDef(defProps, context);
|
|
1922
|
+
let def = internal_cjs.parseEventDef(refined, extra, dragMeta.sourceId, dateSpan.allDay, context.options.forceEventDuration || Boolean(dragMeta.duration), // hasEnd
|
|
1923
|
+
context);
|
|
1924
|
+
let start = dateSpan.range.start;
|
|
1925
|
+
// only rely on time info if drop zone is all-day,
|
|
1926
|
+
// otherwise, we already know the time
|
|
1927
|
+
if (dateSpan.allDay && dragMeta.startTime) {
|
|
1928
|
+
start = context.dateEnv.add(start, dragMeta.startTime);
|
|
1929
|
+
}
|
|
1930
|
+
let end = dragMeta.duration ?
|
|
1931
|
+
context.dateEnv.add(start, dragMeta.duration) :
|
|
1932
|
+
internal_cjs.getDefaultEventEnd(dateSpan.allDay, start, context);
|
|
1933
|
+
let instance = internal_cjs.createEventInstance(def.defId, { start, end });
|
|
1934
|
+
return { def, instance };
|
|
1935
|
+
}
|
|
1936
|
+
// Utils for extracting data from element
|
|
1937
|
+
// ----------------------------------------------------------------------------------------------------
|
|
1938
|
+
function getDragMetaFromEl(el) {
|
|
1939
|
+
let str = getEmbeddedElData(el, 'event');
|
|
1940
|
+
let obj = str ?
|
|
1941
|
+
JSON.parse(str) :
|
|
1942
|
+
{ create: false }; // if no embedded data, assume no event creation
|
|
1943
|
+
return internal_cjs.parseDragMeta(obj);
|
|
1944
|
+
}
|
|
1945
|
+
internal_cjs.config.dataAttrPrefix = '';
|
|
1946
|
+
function getEmbeddedElData(el, name) {
|
|
1947
|
+
let prefix = internal_cjs.config.dataAttrPrefix;
|
|
1948
|
+
let prefixedName = (prefix ? prefix + '-' : '') + name;
|
|
1949
|
+
return el.getAttribute('data-' + prefixedName) || '';
|
|
1950
|
+
}
|
|
1951
|
+
|
|
1952
|
+
/*
|
|
1953
|
+
Makes an element (that is *external* to any calendar) draggable.
|
|
1954
|
+
Can pass in data that determines how an event will be created when dropped onto a calendar.
|
|
1955
|
+
Leverages FullCalendar's internal drag-n-drop functionality WITHOUT a third-party drag system.
|
|
1956
|
+
*/
|
|
1957
|
+
class ExternalDraggable {
|
|
1958
|
+
constructor(el, settings = {}) {
|
|
1959
|
+
this.handlePointerDown = (ev) => {
|
|
1960
|
+
let { dragging } = this;
|
|
1961
|
+
let { minDistance, longPressDelay } = this.settings;
|
|
1962
|
+
dragging.minDistance =
|
|
1963
|
+
minDistance != null ?
|
|
1964
|
+
minDistance :
|
|
1965
|
+
(ev.isTouch ? 0 : internal_cjs.BASE_OPTION_DEFAULTS.eventDragMinDistance);
|
|
1966
|
+
dragging.delay =
|
|
1967
|
+
ev.isTouch ? // TODO: eventually read eventLongPressDelay instead vvv
|
|
1968
|
+
(longPressDelay != null ? longPressDelay : internal_cjs.BASE_OPTION_DEFAULTS.longPressDelay) :
|
|
1969
|
+
0;
|
|
1970
|
+
};
|
|
1971
|
+
this.handleDragStart = (ev) => {
|
|
1972
|
+
if (ev.isTouch &&
|
|
1973
|
+
this.dragging.delay &&
|
|
1974
|
+
ev.subjectEl.classList.contains('fc-event')) {
|
|
1975
|
+
this.dragging.mirror.getMirrorEl().classList.add('fc-event-selected');
|
|
1976
|
+
}
|
|
1977
|
+
};
|
|
1978
|
+
this.settings = settings;
|
|
1979
|
+
let dragging = this.dragging = new FeaturefulElementDragging(el);
|
|
1980
|
+
dragging.touchScrollAllowed = false;
|
|
1981
|
+
if (settings.itemSelector != null) {
|
|
1982
|
+
dragging.pointer.selector = settings.itemSelector;
|
|
1983
|
+
}
|
|
1984
|
+
if (settings.appendTo != null) {
|
|
1985
|
+
dragging.mirror.parentNode = settings.appendTo; // TODO: write tests
|
|
1986
|
+
}
|
|
1987
|
+
dragging.emitter.on('pointerdown', this.handlePointerDown);
|
|
1988
|
+
dragging.emitter.on('dragstart', this.handleDragStart);
|
|
1989
|
+
new ExternalElementDragging(dragging, settings.eventData); // eslint-disable-line no-new
|
|
1990
|
+
}
|
|
1991
|
+
destroy() {
|
|
1992
|
+
this.dragging.destroy();
|
|
1993
|
+
}
|
|
1994
|
+
}
|
|
1995
|
+
|
|
1996
|
+
/*
|
|
1997
|
+
Detects when a *THIRD-PARTY* drag-n-drop system interacts with elements.
|
|
1998
|
+
The third-party system is responsible for drawing the visuals effects of the drag.
|
|
1999
|
+
This class simply monitors for pointer movements and fires events.
|
|
2000
|
+
It also has the ability to hide the moving element (the "mirror") during the drag.
|
|
2001
|
+
*/
|
|
2002
|
+
class InferredElementDragging extends internal_cjs.ElementDragging {
|
|
2003
|
+
constructor(containerEl) {
|
|
2004
|
+
super(containerEl);
|
|
2005
|
+
this.shouldIgnoreMove = false;
|
|
2006
|
+
this.mirrorSelector = '';
|
|
2007
|
+
this.currentMirrorEl = null;
|
|
2008
|
+
this.handlePointerDown = (ev) => {
|
|
2009
|
+
this.emitter.trigger('pointerdown', ev);
|
|
2010
|
+
if (!this.shouldIgnoreMove) {
|
|
2011
|
+
// fire dragstart right away. does not support delay or min-distance
|
|
2012
|
+
this.emitter.trigger('dragstart', ev);
|
|
2013
|
+
}
|
|
2014
|
+
};
|
|
2015
|
+
this.handlePointerMove = (ev) => {
|
|
2016
|
+
if (!this.shouldIgnoreMove) {
|
|
2017
|
+
this.emitter.trigger('dragmove', ev);
|
|
2018
|
+
}
|
|
2019
|
+
};
|
|
2020
|
+
this.handlePointerUp = (ev) => {
|
|
2021
|
+
this.emitter.trigger('pointerup', ev);
|
|
2022
|
+
if (!this.shouldIgnoreMove) {
|
|
2023
|
+
// fire dragend right away. does not support a revert animation
|
|
2024
|
+
this.emitter.trigger('dragend', ev);
|
|
2025
|
+
}
|
|
2026
|
+
};
|
|
2027
|
+
let pointer = this.pointer = new PointerDragging(containerEl);
|
|
2028
|
+
pointer.emitter.on('pointerdown', this.handlePointerDown);
|
|
2029
|
+
pointer.emitter.on('pointermove', this.handlePointerMove);
|
|
2030
|
+
pointer.emitter.on('pointerup', this.handlePointerUp);
|
|
2031
|
+
}
|
|
2032
|
+
destroy() {
|
|
2033
|
+
this.pointer.destroy();
|
|
2034
|
+
}
|
|
2035
|
+
setIgnoreMove(bool) {
|
|
2036
|
+
this.shouldIgnoreMove = bool;
|
|
2037
|
+
}
|
|
2038
|
+
setMirrorIsVisible(bool) {
|
|
2039
|
+
if (bool) {
|
|
2040
|
+
// restore a previously hidden element.
|
|
2041
|
+
// use the reference in case the selector class has already been removed.
|
|
2042
|
+
if (this.currentMirrorEl) {
|
|
2043
|
+
this.currentMirrorEl.style.visibility = '';
|
|
2044
|
+
this.currentMirrorEl = null;
|
|
2045
|
+
}
|
|
2046
|
+
}
|
|
2047
|
+
else {
|
|
2048
|
+
let mirrorEl = this.mirrorSelector
|
|
2049
|
+
// TODO: somehow query FullCalendars WITHIN shadow-roots
|
|
2050
|
+
? document.querySelector(this.mirrorSelector)
|
|
2051
|
+
: null;
|
|
2052
|
+
if (mirrorEl) {
|
|
2053
|
+
this.currentMirrorEl = mirrorEl;
|
|
2054
|
+
mirrorEl.style.visibility = 'hidden';
|
|
2055
|
+
}
|
|
2056
|
+
}
|
|
2057
|
+
}
|
|
2058
|
+
}
|
|
2059
|
+
|
|
2060
|
+
/*
|
|
2061
|
+
Bridges third-party drag-n-drop systems with FullCalendar.
|
|
2062
|
+
Must be instantiated and destroyed by caller.
|
|
2063
|
+
*/
|
|
2064
|
+
class ThirdPartyDraggable {
|
|
2065
|
+
constructor(containerOrSettings, settings) {
|
|
2066
|
+
let containerEl = document;
|
|
2067
|
+
if (
|
|
2068
|
+
// wish we could just test instanceof EventTarget, but doesn't work in IE11
|
|
2069
|
+
containerOrSettings === document ||
|
|
2070
|
+
containerOrSettings instanceof Element) {
|
|
2071
|
+
containerEl = containerOrSettings;
|
|
2072
|
+
settings = settings || {};
|
|
2073
|
+
}
|
|
2074
|
+
else {
|
|
2075
|
+
settings = (containerOrSettings || {});
|
|
2076
|
+
}
|
|
2077
|
+
let dragging = this.dragging = new InferredElementDragging(containerEl);
|
|
2078
|
+
if (typeof settings.itemSelector === 'string') {
|
|
2079
|
+
dragging.pointer.selector = settings.itemSelector;
|
|
2080
|
+
}
|
|
2081
|
+
else if (containerEl === document) {
|
|
2082
|
+
dragging.pointer.selector = '[data-event]';
|
|
2083
|
+
}
|
|
2084
|
+
if (typeof settings.mirrorSelector === 'string') {
|
|
2085
|
+
dragging.mirrorSelector = settings.mirrorSelector;
|
|
2086
|
+
}
|
|
2087
|
+
new ExternalElementDragging(dragging, settings.eventData); // eslint-disable-line no-new
|
|
2088
|
+
}
|
|
2089
|
+
destroy() {
|
|
2090
|
+
this.dragging.destroy();
|
|
2091
|
+
}
|
|
2092
|
+
}
|
|
2093
|
+
|
|
2094
|
+
var index = index_cjs.createPlugin({
|
|
2095
|
+
name: '@fullcalendar/interaction',
|
|
2096
|
+
componentInteractions: [DateClicking, DateSelecting, EventDragging, EventResizing],
|
|
2097
|
+
calendarInteractions: [UnselectAuto],
|
|
2098
|
+
elementDraggingImpl: FeaturefulElementDragging,
|
|
2099
|
+
optionRefiners: OPTION_REFINERS,
|
|
2100
|
+
listenerRefiners: LISTENER_REFINERS,
|
|
2101
|
+
});
|
|
2102
|
+
|
|
2103
|
+
exports.Draggable = ExternalDraggable;
|
|
2104
|
+
exports.ThirdPartyDraggable = ThirdPartyDraggable;
|
|
2105
|
+
exports["default"] = index;
|