vue-cesium
Version:
Vue 3.x components for CesiumJS.
318 lines (313 loc) • 11.2 kB
JavaScript
;
Object.defineProperty(exports, '__esModule', { value: true });
var platform = require('../../utils/platform.js');
var create = require('../../utils/private/create.js');
var event = require('../../utils/private/event.js');
var selection = require('../../utils/private/selection.js');
var touch = require('../../utils/private/touch.js');
;
function getChanges(evt, ctx, isFinal) {
const pos = event.position(evt);
let dir, distX = pos.left - ctx.event.x, distY = pos.top - ctx.event.y, absX = Math.abs(distX), absY = Math.abs(distY);
const direction = ctx.direction;
if (direction.horizontal === true && direction.vertical !== true) {
dir = distX < 0 ? "left" : "right";
} else if (direction.horizontal !== true && direction.vertical === true) {
dir = distY < 0 ? "up" : "down";
} else if (direction.up === true && distY < 0) {
dir = "up";
if (absX > absY) {
if (direction.left === true && distX < 0) {
dir = "left";
} else if (direction.right === true && distX > 0) {
dir = "right";
}
}
} else if (direction.down === true && distY > 0) {
dir = "down";
if (absX > absY) {
if (direction.left === true && distX < 0) {
dir = "left";
} else if (direction.right === true && distX > 0) {
dir = "right";
}
}
} else if (direction.left === true && distX < 0) {
dir = "left";
if (absX < absY) {
if (direction.up === true && distY < 0) {
dir = "up";
} else if (direction.down === true && distY > 0) {
dir = "down";
}
}
} else if (direction.right === true && distX > 0) {
dir = "right";
if (absX < absY) {
if (direction.up === true && distY < 0) {
dir = "up";
} else if (direction.down === true && distY > 0) {
dir = "down";
}
}
}
let synthetic = false;
if (dir === void 0 && isFinal === false) {
if (ctx.event.isFirst === true || ctx.event.lastDir === void 0) {
return {};
}
dir = ctx.event.lastDir;
synthetic = true;
if (dir === "left" || dir === "right") {
pos.left -= distX;
absX = 0;
distX = 0;
} else {
pos.top -= distY;
absY = 0;
distY = 0;
}
}
return {
synthetic,
payload: {
evt,
touch: ctx.event.mouse !== true,
mouse: ctx.event.mouse === true,
position: pos,
direction: dir,
isFirst: ctx.event.isFirst,
isFinal: isFinal === true,
duration: Date.now() - ctx.event.time,
distance: {
x: absX,
y: absY
},
offset: {
x: distX,
y: distY
},
delta: {
x: pos.left - ctx.event.lastX,
y: pos.top - ctx.event.lastY
}
}
};
}
let uid = 0;
var TouchPan = create.createDirective({
name: "touch-pan",
beforeMount(el, { value, modifiers }) {
if (modifiers.mouse !== true && platform.platform().hasTouch !== true) {
return;
}
function handleEvent(evt, mouseEvent) {
if (modifiers.mouse === true && mouseEvent === true) {
event.stopAndPrevent(evt);
} else {
modifiers.stop === true && event.stop(evt);
modifiers.prevent === true && event.prevent(evt);
}
}
const ctx = {
uid: "qvtp_" + uid++,
handler: value,
modifiers,
direction: touch.getModifierDirections(modifiers),
noop: event.noop,
mouseStart(evt) {
if (touch.shouldStart(evt, ctx) && event.leftClick(evt)) {
event.addEvt(ctx, "temp", [
[document, "mousemove", "move", "notPassiveCapture"],
[document, "mouseup", "end", "passiveCapture"]
]);
ctx.start(evt, true);
}
},
touchStart(evt) {
if (touch.shouldStart(evt, ctx)) {
const target = evt.target;
event.addEvt(ctx, "temp", [
[target, "touchmove", "move", "notPassiveCapture"],
[target, "touchcancel", "end", "passiveCapture"],
[target, "touchend", "end", "passiveCapture"]
]);
ctx.start(evt);
}
},
start(evt, mouseEvent) {
platform.platform().isFireFox === true && event.preventDraggable(el, true);
ctx.lastEvt = evt;
if (mouseEvent === true || modifiers.stop === true) {
if (ctx.direction.all !== true && // account for UMD too where modifiers will be lowercased to work
(mouseEvent !== true || ctx.modifiers.mouseAllDir !== true && ctx.modifiers.mousealldir !== true)) {
const clone = evt.type.indexOf("mouse") > -1 ? new MouseEvent(evt.type, evt) : new TouchEvent(evt.type, evt);
evt.defaultPrevented === true && event.prevent(clone);
evt.cancelBubble === true && event.stop(clone);
Object.assign(clone, {
qKeyEvent: evt.qKeyEvent,
qClickOutside: evt.qClickOutside,
qAnchorHandled: evt.qAnchorHandled,
qClonedBy: evt.qClonedBy === void 0 ? [ctx.uid] : evt.qClonedBy.concat(ctx.uid)
});
ctx.initialEvent = {
target: evt.target,
event: clone
};
}
event.stop(evt);
}
const { left, top } = event.position(evt);
ctx.event = {
x: left,
y: top,
time: Date.now(),
mouse: mouseEvent === true,
detected: false,
isFirst: true,
isFinal: false,
lastX: left,
lastY: top
};
},
move(evt) {
if (ctx.event === void 0) {
return;
}
const pos = event.position(evt), distX = pos.left - ctx.event.x, distY = pos.top - ctx.event.y;
if (distX === 0 && distY === 0) {
return;
}
ctx.lastEvt = evt;
const isMouseEvt = ctx.event.mouse === true;
const start = () => {
handleEvent(evt, isMouseEvt);
let cursor;
if (modifiers.preserveCursor !== true && modifiers.preservecursor !== true) {
cursor = document.documentElement.style.cursor || "";
document.documentElement.style.cursor = "grabbing";
}
isMouseEvt === true && document.body.classList.add("no-pointer-events--children");
document.body.classList.add("non-selectable");
selection.clearSelection();
ctx.styleCleanup = (withDelayedFn) => {
ctx.styleCleanup = void 0;
if (cursor !== void 0) {
document.documentElement.style.cursor = cursor;
}
document.body.classList.remove("non-selectable");
if (isMouseEvt === true) {
const remove = () => {
document.body.classList.remove("no-pointer-events--children");
};
if (withDelayedFn !== void 0) {
setTimeout(() => {
remove();
withDelayedFn();
}, 50);
} else {
remove();
}
} else if (withDelayedFn !== void 0) {
withDelayedFn();
}
};
};
if (ctx.event.detected === true) {
ctx.event.isFirst !== true && handleEvent(evt, ctx.event.mouse);
const { payload, synthetic } = getChanges(evt, ctx, false);
if (payload !== void 0) {
if (ctx.handler(payload) === false) {
ctx.end(evt);
} else {
if (ctx.styleCleanup === void 0 && ctx.event.isFirst === true) {
start();
}
ctx.event.lastX = payload.position.left;
ctx.event.lastY = payload.position.top;
ctx.event.lastDir = synthetic === true ? void 0 : payload.direction;
ctx.event.isFirst = false;
}
}
return;
}
if (ctx.direction.all === true || // account for UMD too where modifiers will be lowercased to work
isMouseEvt === true && (ctx.modifiers.mouseAllDir === true || ctx.modifiers.mousealldir === true)) {
start();
ctx.event.detected = true;
ctx.move(evt);
return;
}
const absX = Math.abs(distX), absY = Math.abs(distY);
if (absX !== absY) {
if (ctx.direction.horizontal === true && absX > absY || ctx.direction.vertical === true && absX < absY || ctx.direction.up === true && absX < absY && distY < 0 || ctx.direction.down === true && absX < absY && distY > 0 || ctx.direction.left === true && absX > absY && distX < 0 || ctx.direction.right === true && absX > absY && distX > 0) {
ctx.event.detected = true;
ctx.move(evt);
} else {
ctx.end(evt, true);
}
}
},
end(evt, abort) {
if (ctx.event === void 0) {
return;
}
event.cleanEvt(ctx, "temp");
platform.platform().isFireFox === true && event.preventDraggable(el, false);
if (abort === true) {
ctx.styleCleanup !== void 0 && ctx.styleCleanup();
if (ctx.event.detected !== true && ctx.initialEvent !== void 0) {
ctx.initialEvent.target.dispatchEvent(ctx.initialEvent.event);
}
} else if (ctx.event.detected === true) {
ctx.event.isFirst === true && ctx.handler(getChanges(evt === void 0 ? ctx.lastEvt : evt, ctx).payload);
const { payload } = getChanges(evt === void 0 ? ctx.lastEvt : evt, ctx, true);
const fn = () => {
ctx.handler(payload);
};
if (ctx.styleCleanup !== void 0) {
ctx.styleCleanup(fn);
} else {
fn();
}
}
ctx.event = void 0;
ctx.initialEvent = void 0;
ctx.lastEvt = void 0;
}
};
el.__qtouchpan = ctx;
if (modifiers.mouse === true) {
const capture = modifiers.mouseCapture === true || modifiers.mousecapture === true ? "Capture" : "";
event.addEvt(ctx, "main", [[el, "mousedown", "mouseStart", `passive${capture}`]]);
}
platform.platform().hasTouch === true && event.addEvt(ctx, "main", [
[el, "touchstart", "touchStart", `passive${modifiers.capture === true ? "Capture" : ""}`],
[el, "touchmove", "noop", "notPassiveCapture"]
// cannot be passive (ex: iOS scroll)
]);
},
updated(el, bindings) {
const ctx = el.__qtouchpan;
if (ctx !== void 0) {
if (bindings.oldValue !== bindings.value) {
typeof bindings.value !== "function" && ctx.end();
ctx.handler = bindings.value;
}
ctx.direction = touch.getModifierDirections(bindings.modifiers);
}
},
beforeUnmount(el) {
const ctx = el.__qtouchpan;
if (ctx !== void 0) {
ctx.event !== void 0 && ctx.end();
event.cleanEvt(ctx, "main");
event.cleanEvt(ctx, "temp");
platform.platform().isFireFox === true && event.preventDraggable(el, false);
ctx.styleCleanup !== void 0 && ctx.styleCleanup();
delete el.__qtouchpan;
}
}
});
exports["default"] = TouchPan;
//# sourceMappingURL=index.js.map