@loupekit/sdk 0.9.1-next.33 → 0.9.1
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/dist/index.global.js +10 -25
- package/dist/index.global.js.map +1 -1
- package/dist/index.js +10 -25
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/dist/index.global.js
CHANGED
|
@@ -2487,9 +2487,6 @@ var Loupe = (() => {
|
|
|
2487
2487
|
this.floatResize = null;
|
|
2488
2488
|
this.raf = 0;
|
|
2489
2489
|
// ---- inspector ------------------------------------------------------------
|
|
2490
|
-
// Pointer Events, not mouse events: a touch drag on a phone never fires
|
|
2491
|
-
// mousemove/mouseup, so Region/Record selection was impossible on touch devices.
|
|
2492
|
-
// Pointer events cover mouse, touch and pen with one handler each.
|
|
2493
2490
|
this.onMove = (e) => {
|
|
2494
2491
|
if (this.mode !== "inspect") return;
|
|
2495
2492
|
const target = this.pick(e.clientX, e.clientY);
|
|
@@ -2530,16 +2527,14 @@ var Loupe = (() => {
|
|
|
2530
2527
|
};
|
|
2531
2528
|
// ---- region ("free-size screenshot") selection ----------------------------
|
|
2532
2529
|
this.onRegionDown = (e) => {
|
|
2533
|
-
if (this.mode !== "region" && this.mode !== "record") return;
|
|
2534
|
-
if (e.pointerType !== "touch" && e.pointerType !== "pen" && e.button !== 0) return;
|
|
2530
|
+
if (this.mode !== "region" && this.mode !== "record" || e.button !== 0) return;
|
|
2535
2531
|
const t = e.target;
|
|
2536
2532
|
if (t && (t.id === "loupe-root" || t.closest?.("#loupe-root"))) return;
|
|
2537
2533
|
e.preventDefault();
|
|
2538
2534
|
e.stopPropagation();
|
|
2539
2535
|
this.dragStart = { x: e.clientX, y: e.clientY };
|
|
2540
|
-
document.addEventListener("
|
|
2541
|
-
document.addEventListener("
|
|
2542
|
-
document.addEventListener("pointercancel", this.onRegionCancel, true);
|
|
2536
|
+
document.addEventListener("mousemove", this.onRegionMove, true);
|
|
2537
|
+
document.addEventListener("mouseup", this.onRegionUp, true);
|
|
2543
2538
|
this.drawSelection(e.clientX, e.clientY);
|
|
2544
2539
|
};
|
|
2545
2540
|
this.onRegionMove = (e) => {
|
|
@@ -2568,11 +2563,6 @@ var Loupe = (() => {
|
|
|
2568
2563
|
if (wasRecord) void this.finishRecording(vp);
|
|
2569
2564
|
else this.finishRegion(vp);
|
|
2570
2565
|
};
|
|
2571
|
-
/** The OS took over the gesture (e.g. a system swipe): drop the selection. */
|
|
2572
|
-
this.onRegionCancel = () => {
|
|
2573
|
-
this.cancelDrag();
|
|
2574
|
-
this.selbox.style.display = "none";
|
|
2575
|
-
};
|
|
2576
2566
|
// ---- free note (drop a comment anywhere, no element / no screenshot) -------
|
|
2577
2567
|
this.onFreeClick = (e) => {
|
|
2578
2568
|
if (this.mode !== "free") return;
|
|
@@ -2826,8 +2816,7 @@ var Loupe = (() => {
|
|
|
2826
2816
|
const recordBtn = this.toolBtn(RECORD_ICON, "Record", "record");
|
|
2827
2817
|
recordBtn.title = "Drag a box, record a screen video of it, and comment";
|
|
2828
2818
|
recordBtn.onclick = () => this.setMode(this.mode === "record" ? "off" : "record");
|
|
2829
|
-
|
|
2830
|
-
tools.append(inspectBtn, freeBtn, regionBtn, ...canRecord ? [recordBtn] : []);
|
|
2819
|
+
tools.append(inspectBtn, freeBtn, regionBtn, recordBtn);
|
|
2831
2820
|
const listHead = el("div", "listhead");
|
|
2832
2821
|
listHead.append(document.createTextNode("Comments"));
|
|
2833
2822
|
this.countEl = el("span", "count", "0");
|
|
@@ -2948,9 +2937,8 @@ var Loupe = (() => {
|
|
|
2948
2937
|
}
|
|
2949
2938
|
cancelDrag() {
|
|
2950
2939
|
this.dragStart = null;
|
|
2951
|
-
document.removeEventListener("
|
|
2952
|
-
document.removeEventListener("
|
|
2953
|
-
document.removeEventListener("pointercancel", this.onRegionCancel, true);
|
|
2940
|
+
document.removeEventListener("mousemove", this.onRegionMove, true);
|
|
2941
|
+
document.removeEventListener("mouseup", this.onRegionUp, true);
|
|
2954
2942
|
}
|
|
2955
2943
|
/**
|
|
2956
2944
|
* Anchor a dragged viewport rect to the element under its center so it survives
|
|
@@ -3052,23 +3040,20 @@ var Loupe = (() => {
|
|
|
3052
3040
|
this.dock.querySelector('[data-role="region"]')?.classList.toggle("on", mode === "region");
|
|
3053
3041
|
this.dock.querySelector('[data-role="record"]')?.classList.toggle("on", mode === "record");
|
|
3054
3042
|
this.dock.classList.toggle("inspecting", mode !== "off");
|
|
3055
|
-
document.removeEventListener("
|
|
3056
|
-
document.removeEventListener("pointerdown", this.onMove, true);
|
|
3043
|
+
document.removeEventListener("mousemove", this.onMove, true);
|
|
3057
3044
|
document.removeEventListener("click", this.onClick, true);
|
|
3058
3045
|
document.removeEventListener("click", this.onFreeClick, true);
|
|
3059
|
-
document.removeEventListener("
|
|
3060
|
-
document.documentElement.style.touchAction = mode === "region" || mode === "record" ? "none" : "";
|
|
3046
|
+
document.removeEventListener("mousedown", this.onRegionDown, true);
|
|
3061
3047
|
if (mode === "off") return;
|
|
3062
3048
|
document.addEventListener("keydown", this.onKey, true);
|
|
3063
3049
|
this.closeComposer();
|
|
3064
3050
|
if (mode === "inspect") {
|
|
3065
|
-
document.addEventListener("
|
|
3066
|
-
document.addEventListener("pointerdown", this.onMove, true);
|
|
3051
|
+
document.addEventListener("mousemove", this.onMove, true);
|
|
3067
3052
|
document.addEventListener("click", this.onClick, true);
|
|
3068
3053
|
} else if (mode === "free") {
|
|
3069
3054
|
document.addEventListener("click", this.onFreeClick, true);
|
|
3070
3055
|
} else if (mode === "region" || mode === "record") {
|
|
3071
|
-
document.addEventListener("
|
|
3056
|
+
document.addEventListener("mousedown", this.onRegionDown, true);
|
|
3072
3057
|
}
|
|
3073
3058
|
}
|
|
3074
3059
|
// ---- composer -------------------------------------------------------------
|