@roomle/embedding-lib 5.7.0-debug.1 → 5.8.0-alpha.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/docs/md/web/embedding/CHANGELOG.md +4 -39
- package/drag-in-CYmR1HFI.mjs +7 -0
- package/{drag-in-3CJWP_Px.mjs → drag-in-Do47zdKL.mjs} +43 -35
- package/from-custom-view-BVWf7SQ7.mjs +1 -0
- package/{from-custom-view-DmyxPHCr.mjs → from-custom-view-DYkvyOw3.mjs} +21 -23
- package/from-website-DDMDPp-F.mjs +206 -0
- package/from-website-Dx2SUftr.mjs +4 -0
- package/index.d.ts +2 -2
- package/package.json +2 -2
- package/roomle-embedding-lib.es.js +17 -16
- package/roomle-embedding-lib.es.min.js +4 -4
- package/roomle-embedding-lib.umd.js +12 -12
- package/roomle-embedding-lib.umd.min.js +15 -15
- package/{touch-drag-DibgNiRO.mjs → touch-drag-C1SsZtt4.mjs} +1 -1
- package/{touch-drag-BsAmrceE.mjs → touch-drag-DNDPwZ-_.mjs} +3 -3
- package/drag-in-sE43chRN.mjs +0 -7
- package/from-custom-view-Pim0MOO4.mjs +0 -1
- package/from-website-BhUhFYtn.mjs +0 -194
- package/from-website-DInCYX35.mjs +0 -4
|
@@ -1,47 +1,12 @@
|
|
|
1
|
-
## [5.
|
|
1
|
+
## [5.8.0-alpha.1](https://github.com/roomle-dev/roomle-ui/compare/embedding-lib-v5.7.0...embedding-lib-v5.8.0-alpha.1) (2024-11-22)
|
|
2
2
|
|
|
3
3
|
|
|
4
4
|
### Features
|
|
5
5
|
|
|
6
|
-
*
|
|
7
|
-
*
|
|
8
|
-
* enable custom view also if we are not in embedding ([27777b3](https://github.com/roomle-dev/roomle-ui/commit/27777b34b9f68f0d290ab6bbe04d348b924ab591))
|
|
9
|
-
* expose toggle drawer ([7bd69da](https://github.com/roomle-dev/roomle-ui/commit/7bd69dac5a050444ca6f38d29c929805c2ad2e15))
|
|
10
|
-
* Hide the Overall Measurements in Parts List and Parts List Printout based on flag conditionally ([1fc1225](https://github.com/roomle-dev/roomle-ui/commit/1fc1225c4e17617aa69dfaee83377a17c45cb2b9))
|
|
11
|
-
* implement overlay: true ([0d2b66f](https://github.com/roomle-dev/roomle-ui/commit/0d2b66f41976c0a3b61b6e6caabd8b5f4d8dea7a))
|
|
12
|
-
* make communication from child to parent possible ([6d432ab](https://github.com/roomle-dev/roomle-ui/commit/6d432ab6ce892bdee65e4e70ba57b69d78a7f7dc))
|
|
13
|
-
* make custom views better extensible ([56d1e04](https://github.com/roomle-dev/roomle-ui/commit/56d1e046271745ba61728e02a8d6bbda2dd9400b))
|
|
14
|
-
* make it more versatile for HOMAG cases ([705c6da](https://github.com/roomle-dev/roomle-ui/commit/705c6dab2b1982f351cbd1f60dabb6d91ea76197))
|
|
15
|
-
* make it possible that a custom view can connect to us ([7a50358](https://github.com/roomle-dev/roomle-ui/commit/7a50358500e084bcf32635f72f70b4c4dbe354b5))
|
|
16
|
-
* make things more stable ([432c571](https://github.com/roomle-dev/roomle-ui/commit/432c5713b1504e865d3152f888940b72d3767516))
|
|
17
|
-
* move toggle out if we are on overlay ([c247abf](https://github.com/roomle-dev/roomle-ui/commit/c247abfc75b6fe2e0fc59a78ce6caed4b6135c9c))
|
|
18
|
-
* new methods for exposed api ([264d34f](https://github.com/roomle-dev/roomle-ui/commit/264d34fae8e98b259bf4ef0e921622544ecd4bce))
|
|
19
|
-
* overlay ([1d5cc6b](https://github.com/roomle-dev/roomle-ui/commit/1d5cc6b72abf9e7907a44f7ad15bf42fdd925592))
|
|
20
|
-
* some more stuff ([82d0403](https://github.com/roomle-dev/roomle-ui/commit/82d04039902ad8873ab9b35ee6b5bba211076184))
|
|
21
|
-
* **SDK:** upgrade to version 2.88.1-alpha.1 ([15bd1f5](https://github.com/roomle-dev/roomle-ui/commit/15bd1f5c6ae90a27c6d2b78684ce64cc15798aca))
|
|
22
|
-
* **SDK:** upgrade to version 2.89.0-alpha.1 ([45a5fe1](https://github.com/roomle-dev/roomle-ui/commit/45a5fe117322e3c56e849bca5cee90da9d121dfa))
|
|
23
|
-
* **SDK:** upgrade to version 2.89.0-alpha.2 ([#1341](https://github.com/roomle-dev/roomle-ui/issues/1341)) ([05b1993](https://github.com/roomle-dev/roomle-ui/commit/05b199310cd816bca4983dd93f351cb5b39b3371))
|
|
6
|
+
* Tooltip - interaction notes ([bdeff8b](https://github.com/roomle-dev/roomle-ui/commit/bdeff8bcea6b304db486c97c1f33c03fd611f748))
|
|
7
|
+
* **SDK:** upgrade to version 2.90.0-alpha.1 ([#1359](https://github.com/roomle-dev/roomle-ui/issues/1359)) ([be866f2](https://github.com/roomle-dev/roomle-ui/commit/be866f2492caf81a0efe3c31646aa2941813bd05))
|
|
24
8
|
|
|
25
9
|
|
|
26
10
|
### Bug Fixes
|
|
27
11
|
|
|
28
|
-
*
|
|
29
|
-
* do not collapse custom view on main embedding ([829c32e](https://github.com/roomle-dev/roomle-ui/commit/829c32e6ee757c6ea3c29932a4ccce49f4998ef6))
|
|
30
|
-
* drag-touch tests ([cf9eb0a](https://github.com/roomle-dev/roomle-ui/commit/cf9eb0aabf9d3ca34cbc83d9318648f55179ce97))
|
|
31
|
-
* failing tests ([635c6c1](https://github.com/roomle-dev/roomle-ui/commit/635c6c1a9a7cdaa1723f229d08b4b6be20c74ab7))
|
|
32
|
-
* fix URL parameter parsing to handle array-like keys and remove '[]' suffix ([f7783a3](https://github.com/roomle-dev/roomle-ui/commit/f7783a3faa7e3989a7d08434f48d26fe40079447))
|
|
33
|
-
* hide rotation if there is a construction element selected among the milti-selected objects ([fed131a](https://github.com/roomle-dev/roomle-ui/commit/fed131a02245b82d072fed6474e297495ef6ba2b))
|
|
34
|
-
* make drag-in for custom-view more stable against different timings ([3ebd477](https://github.com/roomle-dev/roomle-ui/commit/3ebd47785d3ed030cd8aa316d442223c03644bc1))
|
|
35
|
-
* make typescript happy ([7613796](https://github.com/roomle-dev/roomle-ui/commit/7613796f23b9ed7b815cc280db589e863110123e))
|
|
36
|
-
* make typescript work ([6d14255](https://github.com/roomle-dev/roomle-ui/commit/6d14255f1f9b57fde9a6efc4bb57fa39244b65b3))
|
|
37
|
-
* oxlint destroyed my code ([06a2882](https://github.com/roomle-dev/roomle-ui/commit/06a28824652eb8d972a8d820776ada4676b35787))
|
|
38
|
-
* remove dynamic IDs ([7f8e4e0](https://github.com/roomle-dev/roomle-ui/commit/7f8e4e00f34b7fedc4486f512afd8926e83dd30a))
|
|
39
|
-
* remove merge conflicts ([4a2ceae](https://github.com/roomle-dev/roomle-ui/commit/4a2ceae999db8245bc0e1f8ea4b4f506ea877b3e))
|
|
40
|
-
* some stuff ([f4c0501](https://github.com/roomle-dev/roomle-ui/commit/f4c05015912d2fb077d325602b25acdf3164c2d8))
|
|
41
|
-
* some stuff ([632deb9](https://github.com/roomle-dev/roomle-ui/commit/632deb920125dec7a8af4012ab51b84840811286))
|
|
42
|
-
* things ([8404ff6](https://github.com/roomle-dev/roomle-ui/commit/8404ff688d6c0c07a3920921a7d3bb05ea5995e6))
|
|
43
|
-
* ts ([cbc5407](https://github.com/roomle-dev/roomle-ui/commit/cbc5407d30ed9677a4733f09e463ca7500024bcb))
|
|
44
|
-
* ts errors ([0034978](https://github.com/roomle-dev/roomle-ui/commit/00349784c2153127c0ff4f019cddf9fb81d9d0c8))
|
|
45
|
-
* ts errors ([faaf013](https://github.com/roomle-dev/roomle-ui/commit/faaf0138799af91f21af55a7994e3a4f22de1883))
|
|
46
|
-
* use correct imports so that we do not import all of Vue ([46dc577](https://github.com/roomle-dev/roomle-ui/commit/46dc577592dd88947c07cbf600f2d4988584f5d2))
|
|
47
|
-
* use ResizeObserver and switch back to GPU CSS ([65c3a53](https://github.com/roomle-dev/roomle-ui/commit/65c3a539ed7834d45b6a11eee3695768b5ce2cd1))
|
|
12
|
+
* fix ts errors ([6b65f6a](https://github.com/roomle-dev/roomle-ui/commit/6b65f6a1f568baa79765c4b18e8b2a5a93f16147))
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
var w=Object.defineProperty,E=(r,t,e)=>t in r?w(r,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):r[t]=e,n=(r,t,e)=>E(r,typeof t!="symbol"?t+"":t,e);class S{constructor(t,e,a,o){n(this,"_mainDomElement"),n(this,"_instance"),n(this,"_mode","website"),n(this,"_viewName","main"),this._instance=t,this._mainDomElement=e,this._mode=a,this._viewName=o}async init(){return Promise.resolve()}}const l="rml-drag-in-styles",$="rml-drag-in-drag-element",h="rml-drag-in-overlay",d="rml-drag-in-drag-ghost",u="rml-drag-in-fade-in",p="rml-drag-in-fade-out",y={DISPLAY_NONE:"rml-display-none"},_=.5,b="250ms",v="forwards",D=`@keyframes ${u} {from{opacity: 0;}to {opacity: ${_};}}`,f=`@keyframes ${p} {from{opacity: ${_};}to {opacity: 0;}}`,L=`${u} ${b} ${v}`,C=`${p} ${b} ${v}`,I="https://res.cloudinary.com/roomle/image/upload/v1729679975/fallback_afpyqr.jpg",N=112,x=112;class U extends S{constructor(t,e,a,o){super(t,e,a,o),n(this,"options",{}),n(this,"_customDragSignal",new AbortController),this._mainDomElement=e,this._injectStyles(),this._initializeDragGhost()}_injectStyles(){if(!document.getElementById(l)){const t=document.createElement("style");t.type="text/css",t.id=l,t.innerHTML=`
|
|
2
|
+
.${y.DISPLAY_NONE}{display:none}
|
|
3
|
+
.${h}{position:absolute;top:0;left:0;width:100%;height:100%;z-index:999;}
|
|
4
|
+
.${d}{position:absolute;top:0;left:0;width:1px;height:1px;z-index:999;pointer-events:none;background-color:transparent;}
|
|
5
|
+
${D}
|
|
6
|
+
${f}
|
|
7
|
+
`,document.head.appendChild(t)}}_initializeDragGhost(){const t=this._mainDomElement.parentNode;let e=t.querySelector("."+d);e||(e=document.createElement("div"),e.classList.add(d),e.innerText=" ",t.appendChild(e))}async init(){if(await super.init(),this._mode==="website")try{const{DragInFromWebsiteStrategy:t}=await import("./from-website-Dx2SUftr.mjs");this._strategy=new t(this._instance,this._mainDomElement,{settings:this.options,mode:"website"})}catch(t){throw console.error('Could not load Dragin strategy "FromWebsite"'),t}else if(this._mode==="custom-view")try{const{DragInFromCustomViewStrategy:t}=await import("./from-custom-view-BVWf7SQ7.mjs");this._strategy=new t(this._instance,this.options,this._viewName)}catch(t){throw console.error('Could not load Dragin strategy "FromCustomView"'),t}else throw new Error("Unsupported mode")}get isDragging(){return this._strategy.isDragging}dragStart(t,e,a="rml_id"){this._strategy.dragStart(t,e,a)}dragUpdate(t){this._strategy.dragUpdate(t)}dragEnd(){this._strategy.dragEnd()}touchStart(t,e,a="rml_id"){this._strategy.touchStart(t,e,a)}touchMove(t){this._strategy.touchMove(t)}touchEnd(){this._strategy.touchEnd()}dispose(){this._strategy.dispose()}beforeUpdateGhost(t){this._strategy.beforeUpdateGhost(t)}registerCustomDrag({customDragStart:t,customDragEnd:e,customDragUpdate:a,beforeUpdateGhost:o}){o&&this._strategy.beforeUpdateGhost(o);const i=this._customDragSignal.signal,m=s=>{s.target.getAttribute("data-rml-draggable")==="true"&&t(s)},g=s=>{this._strategy.releaseInput(s),this._strategy.isDragging&&e(s)},c=s=>{a(s)};document.querySelectorAll('[data-rml-draggable="true"]').forEach(s=>{s.draggable=!1}),document.addEventListener("mousedown",m,{signal:i}),document.addEventListener("mouseup",g,{signal:i}),document.addEventListener("mousemove",c,{signal:i}),document.addEventListener("mouseleave",g,{signal:i}),document.addEventListener("touchstart",m,{signal:i}),document.addEventListener("touchend",g,{signal:i}),document.addEventListener("touchmove",c,{signal:i})}unregisterCustomDrag(){this._customDragSignal.abort(),this._customDragSignal=new AbortController}releaseInput(t){this._strategy.releaseInput(t)}}const j=Object.freeze(Object.defineProperty({__proto__:null,DragIn:U},Symbol.toStringTag,{value:"Module"}));export{$ as R,l as a,D as b,f as c,I as d,N as e,x as f,L as g,C as h,h as i,y as j,d as k,j as l};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
var
|
|
2
|
-
var
|
|
3
|
-
var i = (
|
|
1
|
+
var p = Object.defineProperty;
|
|
2
|
+
var S = (o, s, t) => s in o ? p(o, s, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[s] = t;
|
|
3
|
+
var i = (o, s, t) => S(o, typeof s != "symbol" ? s + "" : s, t);
|
|
4
4
|
class I {
|
|
5
5
|
constructor(s, t, e, a) {
|
|
6
6
|
i(this, "_mainDomElement");
|
|
@@ -13,9 +13,9 @@ class I {
|
|
|
13
13
|
return Promise.resolve();
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
|
-
const m = "rml-drag-in-styles",
|
|
16
|
+
const m = "rml-drag-in-styles", f = "rml-drag-in-drag-element", E = "rml-drag-in-overlay", g = "rml-drag-in-drag-ghost", h = "rml-drag-in-fade-in", u = "rml-drag-in-fade-out", L = {
|
|
17
17
|
DISPLAY_NONE: "rml-display-none"
|
|
18
|
-
}, A = 0.5,
|
|
18
|
+
}, A = 0.5, D = "250ms", y = "forwards", N = `@keyframes ${h} {from{opacity: 0;}to {opacity: ${A};}}`, R = `@keyframes ${u} {from{opacity: ${A};}to {opacity: 0;}}`, M = `${h} ${D} ${y}`, O = `${u} ${D} ${y}`, w = "https://res.cloudinary.com/roomle/image/upload/v1729679975/fallback_afpyqr.jpg", C = 112, v = 112;
|
|
19
19
|
class G extends I {
|
|
20
20
|
constructor(t, e, a, _) {
|
|
21
21
|
super(t, e, a, _);
|
|
@@ -43,21 +43,29 @@ class G extends I {
|
|
|
43
43
|
e || (e = document.createElement("div"), e.classList.add(g), e.innerText = " ", t.appendChild(e));
|
|
44
44
|
}
|
|
45
45
|
async init() {
|
|
46
|
-
if (await super.init(), this._mode === "website")
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
this.
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
46
|
+
if (await super.init(), this._mode === "website")
|
|
47
|
+
try {
|
|
48
|
+
const { DragInFromWebsiteStrategy: t } = await import("./from-website-DDMDPp-F.mjs");
|
|
49
|
+
this._strategy = new t(
|
|
50
|
+
this._instance,
|
|
51
|
+
this._mainDomElement,
|
|
52
|
+
{ settings: this.options, mode: "website" }
|
|
53
|
+
);
|
|
54
|
+
} catch (t) {
|
|
55
|
+
throw console.error('Could not load Dragin strategy "FromWebsite"'), t;
|
|
56
|
+
}
|
|
57
|
+
else if (this._mode === "custom-view")
|
|
58
|
+
try {
|
|
59
|
+
const { DragInFromCustomViewStrategy: t } = await import("./from-custom-view-DYkvyOw3.mjs");
|
|
60
|
+
this._strategy = new t(
|
|
61
|
+
this._instance,
|
|
62
|
+
this.options,
|
|
63
|
+
this._viewName
|
|
64
|
+
);
|
|
65
|
+
} catch (t) {
|
|
66
|
+
throw console.error('Could not load Dragin strategy "FromCustomView"'), t;
|
|
67
|
+
}
|
|
68
|
+
else
|
|
61
69
|
throw new Error("Unsupported mode");
|
|
62
70
|
}
|
|
63
71
|
get isDragging() {
|
|
@@ -94,16 +102,16 @@ class G extends I {
|
|
|
94
102
|
beforeUpdateGhost: _
|
|
95
103
|
}) {
|
|
96
104
|
_ && this._strategy.beforeUpdateGhost(_);
|
|
97
|
-
const
|
|
98
|
-
|
|
99
|
-
}, d = (
|
|
100
|
-
this._strategy.releaseInput(
|
|
101
|
-
}, l = (
|
|
102
|
-
a(
|
|
105
|
+
const n = this._customDragSignal.signal, c = (r) => {
|
|
106
|
+
r.target.getAttribute("data-rml-draggable") === "true" && t(r);
|
|
107
|
+
}, d = (r) => {
|
|
108
|
+
this._strategy.releaseInput(r), this._strategy.isDragging && e(r);
|
|
109
|
+
}, l = (r) => {
|
|
110
|
+
a(r);
|
|
103
111
|
};
|
|
104
|
-
document.querySelectorAll('[data-rml-draggable="true"]').forEach((
|
|
105
|
-
|
|
106
|
-
}), document.addEventListener("mousedown", c, { signal:
|
|
112
|
+
document.querySelectorAll('[data-rml-draggable="true"]').forEach((r) => {
|
|
113
|
+
r.draggable = !1;
|
|
114
|
+
}), document.addEventListener("mousedown", c, { signal: n }), document.addEventListener("mouseup", d, { signal: n }), document.addEventListener("mousemove", l, { signal: n }), document.addEventListener("mouseleave", d, { signal: n }), document.addEventListener("touchstart", c, { signal: n }), document.addEventListener("touchend", d, { signal: n }), document.addEventListener("touchmove", l, { signal: n });
|
|
107
115
|
}
|
|
108
116
|
unregisterCustomDrag() {
|
|
109
117
|
this._customDragSignal.abort(), this._customDragSignal = new AbortController();
|
|
@@ -117,15 +125,15 @@ const $ = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
|
117
125
|
DragIn: G
|
|
118
126
|
}, Symbol.toStringTag, { value: "Module" }));
|
|
119
127
|
export {
|
|
120
|
-
|
|
128
|
+
f as R,
|
|
121
129
|
m as a,
|
|
122
130
|
N as b,
|
|
123
131
|
R as c,
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
132
|
+
w as d,
|
|
133
|
+
C as e,
|
|
134
|
+
v as f,
|
|
135
|
+
M as g,
|
|
136
|
+
O as h,
|
|
129
137
|
E as i,
|
|
130
138
|
L as j,
|
|
131
139
|
g as k,
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
var w=Object.defineProperty,C=(e,t,s)=>t in e?w(e,t,{enumerable:!0,configurable:!0,writable:!0,value:s}):e[t]=s,i=(e,t,s)=>C(e,typeof t!="symbol"?t+"":t,s);import{C as b,e as D,i as v,T as B,b as X,c as Y,d as I}from"./touch-drag-C1SsZtt4.mjs";import{d as u,e as M,f as U}from"./drag-in-CYmR1HFI.mjs";const O=e=>`[data-rml-custom-view="${e}"]`,l=e=>{e.preventDefault(),e.stopPropagation()},A=(e,t,s,r)=>{const a=s-e,n=r-t;return Math.sqrt(a*a+n*n)};class x{constructor({onCustomDragStart:t},s={}){i(this,"_startX",0),i(this,"_startY",0),i(this,"_lastX",0),i(this,"_lastY",0),i(this,"_epsilon"),i(this,"_isWaiting",!1),i(this,"_onCustomDragStart"),this._epsilon=typeof s.epsilon=="number"?s.epsilon:b,this._onCustomDragStart=t}onMove(t){this._lastX=t.clientX,this._lastY=t.clientY,this._isWaiting&&A(this._startX,this._startY,this._lastX,this._lastY)>this._epsilon&&(this._onCustomDragStart(t),this._isWaiting=!1)}onStart(t){this._startX=t.clientX,this._startY=t.clientY,this.onMove(t),this._isWaiting=!0}onEnd(){this._reset()}_reset(){this._startX=0,this._startY=0,this._lastX=0,this._lastY=0,this._isWaiting=!1}}const c="data-rml-old-draggable",K=void 0,y=(e,t)=>{const s=v(e),r={delay:s?X:Y,epsilon:s?I:b};if(!t)return r;if(!s&&!(e instanceof MouseEvent))return console.warn("Unsupported event! It is not TouchEvent and also not MouseEvent"),r;const{delayKey:a,epsilonKey:n}=s?{delayKey:"touchDragDelay",epsilonKey:"touchDragEpsilon"}:{delayKey:"customDragDelay",epsilonKey:"customDragEpsilon"};return typeof t[a]=="number"&&(r.delay=t.touchDragDelay),typeof t[n]=="number"&&(r.epsilon=t.touchDragEpsilon),r},L=e=>{let t="",s=M,r=U;if(!e)return{url:u,width:s,height:r};const a=e;if(a instanceof HTMLElement){const n=a.getBoundingClientRect(),o=a.getAttribute("data-rml-ghost-url"),h=a.getAttribute("data-rml-ghost-width"),g=a.getAttribute("data-rml-ghost-height");o?t=o:!o&&a instanceof HTMLImageElement&&a.src&&(t=a.src),t?(s=n.width,r=n.height):t=u,s=h?parseInt(h,10):s,r=g?parseInt(g,10):r}return{url:t||u,width:s,height:r}};class W{constructor(t,s,r){i(this,"_options",{}),i(this,"_instance"),i(this,"_viewName"),i(this,"_currentCustomDrag",null),i(this,"_currentBb",null),i(this,"_startTarget",null),i(this,"_onBeforeUpdateDrag",()=>({})),i(this,"isDragging",!1),this._instance=t,this._options=s||{},this._viewName=r}beforeUpdateGhost(t){this._onBeforeUpdateDrag=t}async _dragStart(t,s,r="rml_id"){this._startTarget&&(this._startTarget.style.pointerEvents="none",this._startTarget.style.userSelect="none",this._startTarget.setAttribute(c,this._startTarget.draggable.toString()),this._startTarget.draggable=!1,this._startTarget.removeEventListener("dragstart",l),this._startTarget.addEventListener("dragstart",l)),this._currentBb=await this._instance.getBoundingClientRect(O(this._viewName));const{clientX:a,clientY:n}=D(s),o=this._currentBb.x+a,h=this._currentBb.y+n;this.isDragging=!0,this._instance.dragInObject(t,o,h,r)}_dragUpdate(t){if(document.body.focus(),this._currentCustomDrag&&this._currentCustomDrag.onMove(t),!this._currentBb||!this.isDragging)return;const{clientX:s,clientY:r}=D(t),{url:a,width:n,height:o}=L(this._startTarget),h=this._currentBb.x+s,g=this._currentBb.y+r,_=this._options||{},d={ghost:{visibleIn:{x:this._currentBb.x-(_.dragInOverlapX||0),y:this._currentBb.y+(_.dragInOverlapY||0),width:this._currentBb.width+(_.dragInOverlapX||0),height:this._currentBb.height+(_.dragInOverlapY||0)},url:a,width:n,height:o},mode:"custom-view"},{x:p,y:m,options:T}=this._onBeforeUpdateDrag(h,g,d),f=typeof p=="number"?p:h,E=typeof m=="number"?m:g,S=T||d;this._instance.updateDrag(f,E,S)}_dragEnd(){this._currentCustomDrag&&this._currentCustomDrag.onEnd(),this._currentCustomDrag=null,this.isDragging=!1,this._currentBb=null,this._resetStartTarget(),this._instance.enableEvents(),this._instance.dragInObjectEnd()}dragStart(t,s,r){this._instance.disableEvents(),this._startTarget=s.target;const a=(n,o)=>{this._dragStart(t,o,r)};this._currentCustomDrag=v(s)?new B(K,{onTouchDragStart:a},y(s,this._options)):new x({onCustomDragStart:n=>this._dragStart(t,n,r)},y(s,this._options)),this._currentCustomDrag.onStart(s)}dragEnd(){this._dragEnd()}dragUpdate(t){this._dragUpdate(t)}touchStart(t,s,r="rml_id"){this.dragStart(t,s,r)}touchMove(t){this.dragUpdate(t)}touchEnd(){this.dragEnd()}dispose(){}_resetStartTarget(){this._startTarget&&(this._startTarget.style.pointerEvents="",this._startTarget.style.userSelect="",this._startTarget.draggable=this._startTarget.getAttribute(c)==="true",this._startTarget.removeAttribute(c),this._startTarget.removeEventListener("dragstart",l))}releaseInput(t){this._currentCustomDrag&&this._currentCustomDrag.onEnd(),this._resetStartTarget()}}export{W as DragInFromCustomViewStrategy};
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
var
|
|
2
|
-
var
|
|
3
|
-
var i = (e, t, s) =>
|
|
4
|
-
import { C as T,
|
|
5
|
-
import { d as c, e as Y, f as X } from "./drag-in-
|
|
1
|
+
var A = Object.defineProperty;
|
|
2
|
+
var O = (e, t, s) => t in e ? A(e, t, { enumerable: !0, configurable: !0, writable: !0, value: s }) : e[t] = s;
|
|
3
|
+
var i = (e, t, s) => O(e, typeof t != "symbol" ? t + "" : t, s);
|
|
4
|
+
import { C as T, e as m, i as b, T as v, b as B, c as I, d as L } from "./touch-drag-DNDPwZ-_.mjs";
|
|
5
|
+
import { d as c, e as Y, f as X } from "./drag-in-Do47zdKL.mjs";
|
|
6
6
|
const G = (e) => `[data-rml-custom-view="${e}"]`, l = (e) => {
|
|
7
7
|
e.preventDefault(), e.stopPropagation();
|
|
8
8
|
}, w = (e, t, s, r) => {
|
|
@@ -15,13 +15,10 @@ class U {
|
|
|
15
15
|
i(this, "_startY", 0);
|
|
16
16
|
i(this, "_lastX", 0);
|
|
17
17
|
i(this, "_lastY", 0);
|
|
18
|
-
i(this, "_delay");
|
|
19
18
|
i(this, "_epsilon");
|
|
20
|
-
i(this, "_isStarted", !1);
|
|
21
|
-
i(this, "_isEnded", !1);
|
|
22
19
|
i(this, "_isWaiting", !1);
|
|
23
20
|
i(this, "_onCustomDragStart");
|
|
24
|
-
this.
|
|
21
|
+
this._epsilon = typeof s.epsilon == "number" ? s.epsilon : T, this._onCustomDragStart = t;
|
|
25
22
|
}
|
|
26
23
|
onMove(t) {
|
|
27
24
|
this._lastX = t.clientX, this._lastY = t.clientY, this._isWaiting && w(
|
|
@@ -42,9 +39,9 @@ class U {
|
|
|
42
39
|
}
|
|
43
40
|
}
|
|
44
41
|
const u = "data-rml-old-draggable", R = void 0, f = (e, t) => {
|
|
45
|
-
const s =
|
|
46
|
-
delay: s ?
|
|
47
|
-
epsilon: s ? L :
|
|
42
|
+
const s = b(e), r = {
|
|
43
|
+
delay: s ? B : I,
|
|
44
|
+
epsilon: s ? L : T
|
|
48
45
|
};
|
|
49
46
|
if (!t)
|
|
50
47
|
return r;
|
|
@@ -63,8 +60,8 @@ const u = "data-rml-old-draggable", R = void 0, f = (e, t) => {
|
|
|
63
60
|
return { url: c, width: s, height: r };
|
|
64
61
|
const a = e;
|
|
65
62
|
if (a instanceof HTMLElement) {
|
|
66
|
-
const n = a.getBoundingClientRect(), o = a.getAttribute("data-rml-ghost-url"), h = a.getAttribute("data-rml-ghost-width"),
|
|
67
|
-
o ? t = o : !o && a instanceof HTMLImageElement && a.src && (t = a.src), t ? (s = n.width, r = n.height) : t = c, s = h ? parseInt(h, 10) : s, r =
|
|
63
|
+
const n = a.getBoundingClientRect(), o = a.getAttribute("data-rml-ghost-url"), h = a.getAttribute("data-rml-ghost-width"), g = a.getAttribute("data-rml-ghost-height");
|
|
64
|
+
o ? t = o : !o && a instanceof HTMLImageElement && a.src && (t = a.src), t ? (s = n.width, r = n.height) : t = c, s = h ? parseInt(h, 10) : s, r = g ? parseInt(g, 10) : r;
|
|
68
65
|
}
|
|
69
66
|
return { url: t || c, width: s, height: r };
|
|
70
67
|
};
|
|
@@ -96,24 +93,25 @@ class N {
|
|
|
96
93
|
_dragUpdate(t) {
|
|
97
94
|
if (document.body.focus(), this._currentCustomDrag && this._currentCustomDrag.onMove(t), !this._currentBb || !this.isDragging)
|
|
98
95
|
return;
|
|
99
|
-
const { clientX: s, clientY: r } = m(t), { url: a, width: n, height: o } = M(this._startTarget), h = this._currentBb.x + s,
|
|
96
|
+
const { clientX: s, clientY: r } = m(t), { url: a, width: n, height: o } = M(this._startTarget), h = this._currentBb.x + s, g = this._currentBb.y + r, _ = this._options || {}, d = {
|
|
100
97
|
ghost: {
|
|
101
98
|
visibleIn: {
|
|
102
|
-
x: this._currentBb.x - (
|
|
103
|
-
y: this._currentBb.y + (
|
|
104
|
-
width: this._currentBb.width + (
|
|
105
|
-
height: this._currentBb.height + (
|
|
99
|
+
x: this._currentBb.x - (_.dragInOverlapX || 0),
|
|
100
|
+
y: this._currentBb.y + (_.dragInOverlapY || 0),
|
|
101
|
+
width: this._currentBb.width + (_.dragInOverlapX || 0),
|
|
102
|
+
height: this._currentBb.height + (_.dragInOverlapY || 0)
|
|
106
103
|
},
|
|
107
104
|
url: a,
|
|
108
105
|
width: n,
|
|
109
106
|
height: o
|
|
110
|
-
}
|
|
107
|
+
},
|
|
108
|
+
mode: "custom-view"
|
|
111
109
|
}, {
|
|
112
110
|
x: D,
|
|
113
111
|
y: p,
|
|
114
112
|
options: E
|
|
115
|
-
} = this._onBeforeUpdateDrag(h,
|
|
116
|
-
this._instance.updateDrag(
|
|
113
|
+
} = this._onBeforeUpdateDrag(h, g, d), y = typeof D == "number" ? D : h, C = typeof p == "number" ? p : g, S = E || d;
|
|
114
|
+
this._instance.updateDrag(y, C, S);
|
|
117
115
|
}
|
|
118
116
|
_dragEnd() {
|
|
119
117
|
this._currentCustomDrag && this._currentCustomDrag.onEnd(), this._currentCustomDrag = null, this.isDragging = !1, this._currentBb = null, this._resetStartTarget(), this._instance.enableEvents(), this._instance.dragInObjectEnd();
|
|
@@ -123,7 +121,7 @@ class N {
|
|
|
123
121
|
const a = (n, o) => {
|
|
124
122
|
this._dragStart(t, o, r);
|
|
125
123
|
};
|
|
126
|
-
this._currentCustomDrag =
|
|
124
|
+
this._currentCustomDrag = b(s) ? new v(
|
|
127
125
|
R,
|
|
128
126
|
{
|
|
129
127
|
onTouchDragStart: a
|
|
@@ -0,0 +1,206 @@
|
|
|
1
|
+
var F = Object.defineProperty;
|
|
2
|
+
var M = (r, e, t) => e in r ? F(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t;
|
|
3
|
+
var l = (r, e, t) => M(r, typeof e != "symbol" ? e + "" : e, t);
|
|
4
|
+
import { g as C, e as G, a as E, i as N, T as O } from "./touch-drag-DNDPwZ-_.mjs";
|
|
5
|
+
import { R as u, a as p, b as w, c as B, d as Y, e as L, f as b, g as x, h as S, i as A, j as R, k as H } from "./drag-in-Do47zdKL.mjs";
|
|
6
|
+
const T = (r, e, t = 0, n = 0) => {
|
|
7
|
+
const s = e.x + e.width + t, i = e.x - t, a = e.y + e.height + n, d = e.y - n, { x: o, y: h } = r;
|
|
8
|
+
return o >= i && o <= s && h >= d && h <= a;
|
|
9
|
+
}, v = (r, e, t, n = 0, s = 0) => {
|
|
10
|
+
if (!(!t || !t.hiddenIn && !t.visibleIn))
|
|
11
|
+
return t.visibleIn ? T(
|
|
12
|
+
{ x: r, y: e },
|
|
13
|
+
t.visibleIn,
|
|
14
|
+
n,
|
|
15
|
+
s
|
|
16
|
+
) : t.hiddenIn ? !T(
|
|
17
|
+
{ x: r, y: e },
|
|
18
|
+
t.hiddenIn,
|
|
19
|
+
-n,
|
|
20
|
+
-s
|
|
21
|
+
) : !1;
|
|
22
|
+
}, U = () => {
|
|
23
|
+
if (!!!document.getElementById(p)) {
|
|
24
|
+
const e = document.createElement("style");
|
|
25
|
+
e.type = "text/css", e.id = p, e.innerHTML = `
|
|
26
|
+
${w}
|
|
27
|
+
${B}
|
|
28
|
+
`, document.head.appendChild(e);
|
|
29
|
+
}
|
|
30
|
+
}, P = ({ x: r, y: e }, t) => {
|
|
31
|
+
var s, i, a, d, o, h;
|
|
32
|
+
let n = document.getElementById(u);
|
|
33
|
+
if (!n) {
|
|
34
|
+
if (n = document.createElement("div"), (s = t.ghost) != null && s.element)
|
|
35
|
+
n.appendChild(t.ghost.element);
|
|
36
|
+
else {
|
|
37
|
+
const g = document.createElement("img");
|
|
38
|
+
g.src = ((i = t.ghost) == null ? void 0 : i.url) || Y, g.width = ((a = t.ghost) == null ? void 0 : a.width) || L, g.height = ((d = t.ghost) == null ? void 0 : d.height) || b, n.appendChild(g);
|
|
39
|
+
}
|
|
40
|
+
n.id = u, n.style.position = "fixed", n.style.top = "0", n.style.left = "0", n.style.willChange = "transform", n.style.transform = "translate3d(0, 0, 0)", n.style.zIndex = "9999", n.style.opacity = "0.5", v(
|
|
41
|
+
r,
|
|
42
|
+
e,
|
|
43
|
+
t.ghost || {},
|
|
44
|
+
(o = t.settings) == null ? void 0 : o.dragInOverlapX,
|
|
45
|
+
(h = t.settings) == null ? void 0 : h.dragInOverlapY
|
|
46
|
+
) || (n.style.display = "none"), n.style.pointerEvents = "none", document.body.appendChild(n);
|
|
47
|
+
}
|
|
48
|
+
}, X = ({ x: r, y: e }, t) => {
|
|
49
|
+
var o, h, g, c;
|
|
50
|
+
const n = document.getElementById(u);
|
|
51
|
+
if (!n)
|
|
52
|
+
return;
|
|
53
|
+
let s = (o = t.ghost) == null ? void 0 : o.width, i = (h = t.ghost) == null ? void 0 : h.height;
|
|
54
|
+
typeof s > "u" && (s = n.getBoundingClientRect().width || L), typeof i > "u" && (i = n.getBoundingClientRect().height || b);
|
|
55
|
+
const a = r - s / 2, d = e - i / 2;
|
|
56
|
+
n.style.transform = `translate3d(${a}px, ${d}px, 0)`, t.ghost && (v(
|
|
57
|
+
r,
|
|
58
|
+
e,
|
|
59
|
+
t.ghost,
|
|
60
|
+
(g = t.settings) == null ? void 0 : g.dragInOverlapX,
|
|
61
|
+
(c = t.settings) == null ? void 0 : c.dragInOverlapY
|
|
62
|
+
) ? n.style.animation != x && (n.style.animation = x) : n.style.animation != S && (n.style.animation = S));
|
|
63
|
+
};
|
|
64
|
+
class k {
|
|
65
|
+
constructor(e = null) {
|
|
66
|
+
l(this, "_dragGhostAnimationFrameId", null);
|
|
67
|
+
l(this, "_dragGhostRemoveAnimationFrameId", null);
|
|
68
|
+
l(this, "_dragGhostElement", null);
|
|
69
|
+
this._dragGhostElement = e;
|
|
70
|
+
}
|
|
71
|
+
updateDragGhost(e, t, n) {
|
|
72
|
+
var s;
|
|
73
|
+
this._dragGhostRemoveAnimationFrameId && (cancelAnimationFrame(this._dragGhostRemoveAnimationFrameId), this._dragGhostRemoveAnimationFrameId = null), !((s = n.ghost) != null && s.external) && n.ghost && (this._dragGhostAnimationFrameId || (this._dragGhostAnimationFrameId = requestAnimationFrame(() => {
|
|
74
|
+
U();
|
|
75
|
+
const i = { x: e, y: t };
|
|
76
|
+
!n.ghost && this._dragGhostElement && (n.ghost = {}), n.ghost && !n.ghost.element && this._dragGhostElement && (n.ghost.element = this._dragGhostElement), P(i, n), X(i, n), this._dragGhostAnimationFrameId = null;
|
|
77
|
+
})));
|
|
78
|
+
}
|
|
79
|
+
removeDragGhost() {
|
|
80
|
+
this._dragGhostAnimationFrameId && (cancelAnimationFrame(this._dragGhostAnimationFrameId), this._dragGhostAnimationFrameId = null), this._dragGhostRemoveAnimationFrameId || (this._dragGhostRemoveAnimationFrameId = requestAnimationFrame(() => {
|
|
81
|
+
const e = document.getElementById(u);
|
|
82
|
+
e && document.body.removeChild(e), this._dragGhostRemoveAnimationFrameId = null;
|
|
83
|
+
}));
|
|
84
|
+
}
|
|
85
|
+
}
|
|
86
|
+
class z {
|
|
87
|
+
constructor(e, t, n) {
|
|
88
|
+
l(this, "_options", {});
|
|
89
|
+
l(this, "_instance");
|
|
90
|
+
l(this, "_mainDomElement");
|
|
91
|
+
l(this, "_currentDrag", {});
|
|
92
|
+
l(this, "_currentTouch", null);
|
|
93
|
+
l(this, "_firefoxDragPosition", { x: 0, y: 0 });
|
|
94
|
+
l(this, "_onBeforeUpdateDrag", () => ({}));
|
|
95
|
+
l(this, "isDragging", !1);
|
|
96
|
+
l(this, "_firefoxFallback", (e) => {
|
|
97
|
+
if (!this._currentDrag.event)
|
|
98
|
+
return;
|
|
99
|
+
const t = e || window.event;
|
|
100
|
+
this._firefoxDragPosition.x = t.pageX || 0, this._firefoxDragPosition.y = t.pageY || 0;
|
|
101
|
+
});
|
|
102
|
+
this._instance = e, this._mainDomElement = t, this._options = n || {}, this._firefoxFallback = this._firefoxFallback.bind(this), document.addEventListener("dragover", this._firefoxFallback);
|
|
103
|
+
}
|
|
104
|
+
beforeUpdateGhost(e) {
|
|
105
|
+
this._onBeforeUpdateDrag = e;
|
|
106
|
+
}
|
|
107
|
+
dragStart(e, t, n = "rml_id") {
|
|
108
|
+
const s = this._mainDomElement.parentNode;
|
|
109
|
+
if (C(s).position !== "relative") {
|
|
110
|
+
console.warn(
|
|
111
|
+
"Parent of iframe should have position relative, otherwise drag-in can not detect the x/y coordinates correctly"
|
|
112
|
+
);
|
|
113
|
+
return;
|
|
114
|
+
}
|
|
115
|
+
this._mainDomElement.style.pointerEvents = "none";
|
|
116
|
+
let a = s.querySelector(
|
|
117
|
+
"." + A
|
|
118
|
+
);
|
|
119
|
+
a || (a = document.createElement("div"), a.classList.add(A), s.appendChild(a)), a.classList.remove(R.DISPLAY_NONE), t.target.getAttribute("draggable") || console.warn(
|
|
120
|
+
`Draggable not detected correctly! Did you add draggable="true" to the element? In Sarafi only 'draggable' is too less`
|
|
121
|
+
);
|
|
122
|
+
const o = s.querySelector(
|
|
123
|
+
"." + H
|
|
124
|
+
);
|
|
125
|
+
this._currentDrag.event = t;
|
|
126
|
+
const h = t.target, g = h.cloneNode(), c = h.getBoundingClientRect();
|
|
127
|
+
g.style.width = `${c.width}px`, g.style.height = `${c.height}px`, this._currentDrag.ghost = new k(g), this._currentDrag.offset || (this._currentDrag.offset = { x: 0, y: 0 });
|
|
128
|
+
const { clientX: _, clientY: D } = G(
|
|
129
|
+
t,
|
|
130
|
+
this._firefoxDragPosition
|
|
131
|
+
);
|
|
132
|
+
this._currentDrag.offset.x = _ - c.left, this._currentDrag.offset.y = D - c.top, t instanceof DragEvent && t.dataTransfer && t.dataTransfer.setDragImage && t.dataTransfer.setDragImage(o, 0, 0);
|
|
133
|
+
const { x: y, y: f } = E(
|
|
134
|
+
s,
|
|
135
|
+
this._currentDrag.event || t,
|
|
136
|
+
this._firefoxDragPosition
|
|
137
|
+
), m = Math.max(1, y), I = Math.max(1, f);
|
|
138
|
+
this.isDragging = !0, this._instance.dragInObject(e, m, I, n);
|
|
139
|
+
}
|
|
140
|
+
dragUpdate(e) {
|
|
141
|
+
var f;
|
|
142
|
+
const t = this._mainDomElement.parentNode, { x: n, y: s } = E(t, e, this._firefoxDragPosition);
|
|
143
|
+
if (n === 0 && s === 0)
|
|
144
|
+
return;
|
|
145
|
+
const i = Math.max(1, n), a = Math.max(1, s);
|
|
146
|
+
if (i === 1 && a === 1)
|
|
147
|
+
return;
|
|
148
|
+
let d = i, o = a;
|
|
149
|
+
if (N(e)) {
|
|
150
|
+
const m = ((f = this._options.settings) == null ? void 0 : f.fingerSize) || 0;
|
|
151
|
+
d = Math.max(2, i + m), o = Math.max(2, a - m);
|
|
152
|
+
}
|
|
153
|
+
const {
|
|
154
|
+
x: h,
|
|
155
|
+
y: g,
|
|
156
|
+
options: c
|
|
157
|
+
} = this._onBeforeUpdateDrag(d, o, {}), _ = c || { settings: {}, ghost: {} };
|
|
158
|
+
_.ghost || (_.ghost = {}), _.ghost.visibleIn && _.ghost.hiddenIn || (_.ghost.hiddenIn = this._mainDomElement.getBoundingClientRect());
|
|
159
|
+
const D = typeof h == "number" ? h : d, y = typeof g == "number" ? g : o;
|
|
160
|
+
if (this._currentDrag.ghost) {
|
|
161
|
+
const { clientX: m, clientY: I } = G(
|
|
162
|
+
e,
|
|
163
|
+
this._firefoxDragPosition
|
|
164
|
+
);
|
|
165
|
+
this._currentDrag.ghost.updateDragGhost(m, I, _);
|
|
166
|
+
}
|
|
167
|
+
this._instance.updateDrag(D, y, {});
|
|
168
|
+
}
|
|
169
|
+
dragEnd() {
|
|
170
|
+
this._mainDomElement.style.pointerEvents = "all";
|
|
171
|
+
const e = this._mainDomElement.parentNode;
|
|
172
|
+
this.isDragging = !1, this._instance.dragInObjectEnd(), this._currentDrag.ghost && (this._currentDrag.ghost.removeDragGhost(), this._currentDrag.ghost = null), this._currentDrag = {}, this._firefoxDragPosition = { x: 0, y: 0 };
|
|
173
|
+
const t = e.querySelector(
|
|
174
|
+
"." + A
|
|
175
|
+
);
|
|
176
|
+
t && t.classList.add(R.DISPLAY_NONE);
|
|
177
|
+
}
|
|
178
|
+
touchStart(e, t, n = "rml_id") {
|
|
179
|
+
var a, d, o, h;
|
|
180
|
+
t.preventDefault();
|
|
181
|
+
const s = (g, c) => {
|
|
182
|
+
this.dragStart(e, c, n);
|
|
183
|
+
}, i = {};
|
|
184
|
+
typeof ((d = (a = this._options) == null ? void 0 : a.settings) == null ? void 0 : d.touchDragDelay) == "number" && (i.delay = this._options.settings.touchDragDelay), (h = (o = this._options) == null ? void 0 : o.settings) != null && h.touchDragEpsilon && (i.epsilon = this._options.settings.touchDragEpsilon), this._currentTouch = new O(
|
|
185
|
+
void 0,
|
|
186
|
+
{
|
|
187
|
+
onTouchDragStart: s
|
|
188
|
+
},
|
|
189
|
+
i
|
|
190
|
+
), this._currentTouch.onStart(t);
|
|
191
|
+
}
|
|
192
|
+
touchMove(e) {
|
|
193
|
+
this._currentTouch && this._currentTouch.onMove(e), this._currentDrag.event && this.dragUpdate(e);
|
|
194
|
+
}
|
|
195
|
+
touchEnd() {
|
|
196
|
+
this._currentTouch && this._currentTouch.onEnd(), this._currentTouch = null, this.dragEnd();
|
|
197
|
+
}
|
|
198
|
+
dispose() {
|
|
199
|
+
document.removeEventListener("dragover", this._firefoxFallback);
|
|
200
|
+
}
|
|
201
|
+
releaseInput(e) {
|
|
202
|
+
}
|
|
203
|
+
}
|
|
204
|
+
export {
|
|
205
|
+
z as DragInFromWebsiteStrategy
|
|
206
|
+
};
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
var P=Object.defineProperty,R=(r,e,t)=>e in r?P(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,g=(r,e,t)=>R(r,typeof e!="symbol"?e+"":e,t);import{g as B,e as D,a as x,i as C,T as M}from"./touch-drag-C1SsZtt4.mjs";import{R as _,a as I,b as O,c as L,d as N,e as E,f as b,g as F,h as G,i as v,j as A,k as Y}from"./drag-in-CYmR1HFI.mjs";const w=(r,e,t=0,i=0)=>{const s=e.x+e.width+t,o=e.x-t,l=e.y+e.height+i,a=e.y-i,{x:h,y:n}=r;return h>=o&&h<=s&&n>=a&&n<=l},T=(r,e,t,i=0,s=0)=>{if(!(!t||!t.hiddenIn&&!t.visibleIn))return t.visibleIn?w({x:r,y:e},t.visibleIn,i,s):t.hiddenIn?!w({x:r,y:e},t.hiddenIn,-i,-s):!1},k=()=>{if(!document.getElementById(I)){const r=document.createElement("style");r.type="text/css",r.id=I,r.innerHTML=`
|
|
2
|
+
${O}
|
|
3
|
+
${L}
|
|
4
|
+
`,document.head.appendChild(r)}},U=({x:r,y:e},t)=>{var i,s,o,l,a,h;let n=document.getElementById(_);if(!n){if(n=document.createElement("div"),(i=t.ghost)!=null&&i.element)n.appendChild(t.ghost.element);else{const d=document.createElement("img");d.src=((s=t.ghost)==null?void 0:s.url)||N,d.width=((o=t.ghost)==null?void 0:o.width)||E,d.height=((l=t.ghost)==null?void 0:l.height)||b,n.appendChild(d)}n.id=_,n.style.position="fixed",n.style.top="0",n.style.left="0",n.style.willChange="transform",n.style.transform="translate3d(0, 0, 0)",n.style.zIndex="9999",n.style.opacity="0.5",T(r,e,t.ghost||{},(a=t.settings)==null?void 0:a.dragInOverlapX,(h=t.settings)==null?void 0:h.dragInOverlapY)||(n.style.display="none"),n.style.pointerEvents="none",document.body.appendChild(n)}},X=({x:r,y:e},t)=>{var i,s,o,l;const a=document.getElementById(_);if(!a)return;let h=(i=t.ghost)==null?void 0:i.width,n=(s=t.ghost)==null?void 0:s.height;typeof h>"u"&&(h=a.getBoundingClientRect().width||E),typeof n>"u"&&(n=a.getBoundingClientRect().height||b);const d=r-h/2,c=e-n/2;a.style.transform=`translate3d(${d}px, ${c}px, 0)`,t.ghost&&(T(r,e,t.ghost,(o=t.settings)==null?void 0:o.dragInOverlapX,(l=t.settings)==null?void 0:l.dragInOverlapY)?a.style.animation!=F&&(a.style.animation=F):a.style.animation!=G&&(a.style.animation=G))};class ${constructor(e=null){g(this,"_dragGhostAnimationFrameId",null),g(this,"_dragGhostRemoveAnimationFrameId",null),g(this,"_dragGhostElement",null),this._dragGhostElement=e}updateDragGhost(e,t,i){var s;this._dragGhostRemoveAnimationFrameId&&(cancelAnimationFrame(this._dragGhostRemoveAnimationFrameId),this._dragGhostRemoveAnimationFrameId=null),!((s=i.ghost)!=null&&s.external)&&i.ghost&&(this._dragGhostAnimationFrameId||(this._dragGhostAnimationFrameId=requestAnimationFrame(()=>{k();const o={x:e,y:t};!i.ghost&&this._dragGhostElement&&(i.ghost={}),i.ghost&&!i.ghost.element&&this._dragGhostElement&&(i.ghost.element=this._dragGhostElement),U(o,i),X(o,i),this._dragGhostAnimationFrameId=null})))}removeDragGhost(){this._dragGhostAnimationFrameId&&(cancelAnimationFrame(this._dragGhostAnimationFrameId),this._dragGhostAnimationFrameId=null),this._dragGhostRemoveAnimationFrameId||(this._dragGhostRemoveAnimationFrameId=requestAnimationFrame(()=>{const e=document.getElementById(_);e&&document.body.removeChild(e),this._dragGhostRemoveAnimationFrameId=null}))}}class q{constructor(e,t,i){g(this,"_options",{}),g(this,"_instance"),g(this,"_mainDomElement"),g(this,"_currentDrag",{}),g(this,"_currentTouch",null),g(this,"_firefoxDragPosition",{x:0,y:0}),g(this,"_onBeforeUpdateDrag",()=>({})),g(this,"isDragging",!1),g(this,"_firefoxFallback",s=>{if(!this._currentDrag.event)return;const o=s||window.event;this._firefoxDragPosition.x=o.pageX||0,this._firefoxDragPosition.y=o.pageY||0}),this._instance=e,this._mainDomElement=t,this._options=i||{},this._firefoxFallback=this._firefoxFallback.bind(this),document.addEventListener("dragover",this._firefoxFallback)}beforeUpdateGhost(e){this._onBeforeUpdateDrag=e}dragStart(e,t,i="rml_id"){const s=this._mainDomElement.parentNode;if(B(s).position!=="relative"){console.warn("Parent of iframe should have position relative, otherwise drag-in can not detect the x/y coordinates correctly");return}this._mainDomElement.style.pointerEvents="none";let o=s.querySelector("."+v);o||(o=document.createElement("div"),o.classList.add(v),s.appendChild(o)),o.classList.remove(A.DISPLAY_NONE),t.target.getAttribute("draggable")||console.warn(`Draggable not detected correctly! Did you add draggable="true" to the element? In Sarafi only 'draggable' is too less`);const l=s.querySelector("."+Y);this._currentDrag.event=t;const a=t.target,h=a.cloneNode(),n=a.getBoundingClientRect();h.style.width=`${n.width}px`,h.style.height=`${n.height}px`,this._currentDrag.ghost=new $(h),this._currentDrag.offset||(this._currentDrag.offset={x:0,y:0});const{clientX:d,clientY:c}=D(t,this._firefoxDragPosition);this._currentDrag.offset.x=d-n.left,this._currentDrag.offset.y=c-n.top,t instanceof DragEvent&&t.dataTransfer&&t.dataTransfer.setDragImage&&t.dataTransfer.setDragImage(l,0,0);const{x:f,y:m}=x(s,this._currentDrag.event||t,this._firefoxDragPosition),p=Math.max(1,f),y=Math.max(1,m);this.isDragging=!0,this._instance.dragInObject(e,p,y,i)}dragUpdate(e){var t;const i=this._mainDomElement.parentNode,{x:s,y:o}=x(i,e,this._firefoxDragPosition);if(s===0&&o===0)return;const l=Math.max(1,s),a=Math.max(1,o);if(l===1&&a===1)return;let h=l,n=a;if(C(e)){const u=((t=this._options.settings)==null?void 0:t.fingerSize)||0;h=Math.max(2,l+u),n=Math.max(2,a-u)}const{x:d,y:c,options:f}=this._onBeforeUpdateDrag(h,n,{}),m=f||{settings:{},ghost:{}};m.ghost||(m.ghost={}),m.ghost.visibleIn&&m.ghost.hiddenIn||(m.ghost.hiddenIn=this._mainDomElement.getBoundingClientRect());const p=typeof d=="number"?d:h,y=typeof c=="number"?c:n;if(this._currentDrag.ghost){const{clientX:u,clientY:S}=D(e,this._firefoxDragPosition);this._currentDrag.ghost.updateDragGhost(u,S,m)}this._instance.updateDrag(p,y,{})}dragEnd(){this._mainDomElement.style.pointerEvents="all";const e=this._mainDomElement.parentNode;this.isDragging=!1,this._instance.dragInObjectEnd(),this._currentDrag.ghost&&(this._currentDrag.ghost.removeDragGhost(),this._currentDrag.ghost=null),this._currentDrag={},this._firefoxDragPosition={x:0,y:0};const t=e.querySelector("."+v);t&&t.classList.add(A.DISPLAY_NONE)}touchStart(e,t,i="rml_id"){var s,o,l,a;t.preventDefault();const h=(d,c)=>{this.dragStart(e,c,i)},n={};typeof((o=(s=this._options)==null?void 0:s.settings)==null?void 0:o.touchDragDelay)=="number"&&(n.delay=this._options.settings.touchDragDelay),(a=(l=this._options)==null?void 0:l.settings)!=null&&a.touchDragEpsilon&&(n.epsilon=this._options.settings.touchDragEpsilon),this._currentTouch=new M(void 0,{onTouchDragStart:h},n),this._currentTouch.onStart(t)}touchMove(e){this._currentTouch&&this._currentTouch.onMove(e),this._currentDrag.event&&this.dragUpdate(e)}touchEnd(){this._currentTouch&&this._currentTouch.onEnd(),this._currentTouch=null,this.dragEnd()}dispose(){document.removeEventListener("dragover",this._firefoxFallback)}releaseInput(e){}}export{q as DragInFromWebsiteStrategy};
|
package/index.d.ts
CHANGED
|
@@ -48,7 +48,7 @@ declare class Connector<SdkType, SdkCallbacks> implements RoomleEmbeddingApiKeys
|
|
|
48
48
|
}
|
|
49
49
|
|
|
50
50
|
declare class DragIn extends EmbeddingPlugin implements DragInStrategy {
|
|
51
|
-
options:
|
|
51
|
+
options: DragInSettings;
|
|
52
52
|
private _strategy;
|
|
53
53
|
private _customDragSignal;
|
|
54
54
|
private _injectStyles;
|
|
@@ -74,7 +74,7 @@ declare class DragIn extends EmbeddingPlugin implements DragInStrategy {
|
|
|
74
74
|
releaseInput(event: DragEvent | TouchEvent | MouseEvent): void;
|
|
75
75
|
}
|
|
76
76
|
|
|
77
|
-
declare interface
|
|
77
|
+
declare interface DragInSettings {
|
|
78
78
|
dragInOverlapX?: number;
|
|
79
79
|
dragInOverlapY?: number;
|
|
80
80
|
fingerSize?: number;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@roomle/embedding-lib",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.8.0-alpha.1",
|
|
4
4
|
"description": "This is a small library which can be used to communicate with the Roomle Configurator",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./roomle-embedding-lib.umd.js",
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
"npm": "8.3.1"
|
|
30
30
|
},
|
|
31
31
|
"devDependencies": {
|
|
32
|
-
"@roomle/web-sdk": "2.
|
|
32
|
+
"@roomle/web-sdk": "2.90.0-alpha.1"
|
|
33
33
|
},
|
|
34
34
|
"repository": {
|
|
35
35
|
"type": "git",
|
|
@@ -290,7 +290,7 @@ class A {
|
|
|
290
290
|
typeof t == "string" && t === "dragIn" ? this.pluginsLoaded.push(
|
|
291
291
|
new Promise((o, a) => {
|
|
292
292
|
try {
|
|
293
|
-
import("./drag-in-
|
|
293
|
+
import("./drag-in-Do47zdKL.mjs").then((i) => i.l).then(
|
|
294
294
|
({ DragIn: i }) => {
|
|
295
295
|
const l = new i(
|
|
296
296
|
this.ui,
|
|
@@ -345,12 +345,12 @@ const T = () => {
|
|
|
345
345
|
), console.warn("{ mute: true, value: () => void }"), n = t);
|
|
346
346
|
}
|
|
347
347
|
});
|
|
348
|
-
}, v = () => window.innerHeight * 0.01 + "px",
|
|
348
|
+
}, v = () => window.innerHeight * 0.01 + "px", b = (r) => {
|
|
349
349
|
r && setTimeout(
|
|
350
350
|
() => r.style.setProperty(I, v()),
|
|
351
351
|
0
|
|
352
352
|
);
|
|
353
|
-
},
|
|
353
|
+
}, L = "rml-styles", Z = 450, I = "--rml-full-height", u = {
|
|
354
354
|
CONTAINER: "rml-container",
|
|
355
355
|
FILL: "rml-fill",
|
|
356
356
|
POSITION: "rml-pos",
|
|
@@ -372,9 +372,9 @@ class ee extends A {
|
|
|
372
372
|
);
|
|
373
373
|
if (w.has(n))
|
|
374
374
|
throw new Error("There is already an instance on this DOM element");
|
|
375
|
-
if (!!!document.getElementById(
|
|
375
|
+
if (!!!document.getElementById(L)) {
|
|
376
376
|
const g = t.zIndex || 9999999, h = document.createElement("style");
|
|
377
|
-
h.type = "text/css", h.id =
|
|
377
|
+
h.type = "text/css", h.id = L;
|
|
378
378
|
const f = "transition:all ease-in-out " + Z + "ms;", m = ["-webkit-", "-o-"].reduce(
|
|
379
379
|
(P, D) => P += D + f,
|
|
380
380
|
""
|
|
@@ -414,16 +414,17 @@ class ee extends A {
|
|
|
414
414
|
message: f,
|
|
415
415
|
args: m
|
|
416
416
|
}) => {
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
417
|
+
switch (f) {
|
|
418
|
+
case _.REGISTER_CUSTOM_VIEW_DONE:
|
|
419
|
+
o();
|
|
420
|
+
break;
|
|
421
|
+
case _.RETURN_METHODS:
|
|
422
|
+
t.handleSetup(m[0]), i();
|
|
423
|
+
break;
|
|
424
|
+
default:
|
|
425
|
+
if (t.isSetupDone)
|
|
426
|
+
return t.executeMessage({ message: f, args: m });
|
|
420
427
|
}
|
|
421
|
-
if (f === _.RETURN_METHODS) {
|
|
422
|
-
t.handleSetup(m[0]), i();
|
|
423
|
-
return;
|
|
424
|
-
}
|
|
425
|
-
if (t.isSetupDone)
|
|
426
|
-
return t.executeMessage({ message: f, args: m });
|
|
427
428
|
}, g = new M(
|
|
428
429
|
"custom-view-" + e,
|
|
429
430
|
window,
|
|
@@ -522,10 +523,10 @@ class ee extends A {
|
|
|
522
523
|
return this._initData.useLocalRoomle && (n = location.href.replace("embedding.html", "")), location.href.includes("roomle.gitlab.io") && (n = location.href.replace("embedding.html", "index.html")), this._initData.overrideServerUrl && (n = this._initData.overrideServerUrl), e.src = n, e.classList.add(u.CONTAINER), e.classList.add(u.FILL), e;
|
|
523
524
|
}
|
|
524
525
|
_onResize() {
|
|
525
|
-
|
|
526
|
+
b(this._iframe);
|
|
526
527
|
}
|
|
527
528
|
_onUseFullPage() {
|
|
528
|
-
this._iframe.classList.add(u.POSITION), document.documentElement.classList.add(u.OVERFLOW_HIDDEN), window.document.body.classList.add(u.OVERFLOW_HIDDEN), R() && (
|
|
529
|
+
this._iframe.classList.add(u.POSITION), document.documentElement.classList.add(u.OVERFLOW_HIDDEN), window.document.body.classList.add(u.OVERFLOW_HIDDEN), R() && (b(this._iframe), this._iframe.classList.add(u.ANDROID_HEIGHT));
|
|
529
530
|
}
|
|
530
531
|
_onBackToWebsite() {
|
|
531
532
|
this._iframe.classList.remove(u.POSITION), this._iframe.classList.remove(u.ANDROID_HEIGHT), document.documentElement.classList.remove(u.OVERFLOW_HIDDEN), window.document.body.classList.remove(u.OVERFLOW_HIDDEN);
|