@roomle/embedding-lib 5.0.1-debug.1 → 5.1.0-debug.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 +3 -5
- package/drag-in-C2fEQF9W.mjs +7 -0
- package/drag-in-CAakt8yw.mjs +250 -0
- package/index.d.ts +36 -6
- package/package.json +1 -1
- package/roomle-embedding-lib.es.js +152 -130
- package/roomle-embedding-lib.es.min.js +8 -8
- package/roomle-embedding-lib.umd.js +14 -8
- package/roomle-embedding-lib.umd.min.js +14 -8
|
@@ -1,8 +1,6 @@
|
|
|
1
|
-
## [5.0
|
|
1
|
+
## [5.1.0-debug.1](https://github.com/roomle-dev/roomle-ui/compare/embedding-lib-v5.0.1-debug.1...embedding-lib-v5.1.0-debug.1) (2024-08-07)
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
###
|
|
4
|
+
### Features
|
|
5
5
|
|
|
6
|
-
*
|
|
7
|
-
* some stuff ([b4c0152](https://github.com/roomle-dev/roomle-ui/commit/b4c015270ebdf61971a8108dc5637c7b54847c88))
|
|
8
|
-
* use correct credentials ([6898e84](https://github.com/roomle-dev/roomle-ui/commit/6898e845733d6086562a78a3c5619ea8954011ed))
|
|
6
|
+
* implement feature of drag in ([151d665](https://github.com/roomle-dev/roomle-ui/commit/151d665c35da6b79cbd6b49635dfdf8e3d9c4742))
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
var X=Object.defineProperty,Y=(i,t,e)=>t in i?X(i,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):i[t]=e,a=(i,t,e)=>Y(i,typeof t!="symbol"?t+"":t,e);class O{constructor(t=16){a(this,"_computedStyleCache",new Map),a(this,"_maxLifetime",16),a(this,"_cacheCleanInterval",null),this._maxLifetime=t}get(t){const e=this._computedStyleCache.get(t),n=Date.now();if(e&&n-e.updated<this._maxLifetime)return e.style;const r=getComputedStyle(t);return this._computedStyleCache.set(t,{style:r,updated:n}),this._cacheCleanInterval||(this._cacheCleanInterval=setInterval(()=>this._cleanUpCache,Math.max(this._maxLifetime*1e3,5e3))),r}_cleanUpCache(){const t=Date.now();for(const[e,{updated:n}]of this._computedStyleCache.entries())t-n>=this._maxLifetime&&this._computedStyleCache.delete(e);this._computedStyleCache.size===0&&this._cacheCleanInterval&&(clearInterval(this._cacheCleanInterval),this._cacheCleanInterval=null)}}let y;const g=i=>(y||(y=new O),y.get(i)),b=(i,t,e)=>{const n=parseFloat(i),r=window.devicePixelRatio||1;if(t==="px")return n;if(t==="%"){const o=e===document.documentElement?window.innerWidth:e.offsetWidth;return n/100*o}if(t==="rem"){const o=parseFloat(g(document.documentElement).fontSize);return n*o}if(t==="em"){const o=parseFloat(g(e).fontSize);return n*o}if(t==="vh"||t==="vw"||t==="vmin"||t==="vmax"){const o={vh:window.innerHeight,vw:window.innerWidth,vmin:Math.min(window.innerWidth,window.innerHeight),vmax:Math.max(window.innerWidth,window.innerHeight)};return n/100*o[t]}const s={cm:37.7952755906,mm:3.77952755906,in:96};return t in s?n*s[t]*r:0},E=(i,t,e={x:0,y:0})=>{const n=i.getBoundingClientRect(),r=g(i).transform;let s=0,o=0;if(r!=="none"){const d=/translate\(\s*([-+]?\d*\.?\d+|\d+)(px|%)?,?\s*([-+]?\d*\.?\d+|\d+)?(px|%)?\s*\)/,h=r.match(d);h&&(s=b(h[1],h[2],i),o=b(h[3],h[4],i))}const{clientX:l,clientY:u}=v(t,e),_=l-n.left-s+i.scrollLeft,c=u-n.top-o+i.scrollTop;return{x:_,y:c}},v=(i,t)=>{const{clientX:e,clientY:n}=window.TouchEvent&&i instanceof TouchEvent?P(i):i,r=e||t.x,s=n||t.y;return{clientX:r,clientY:s}},P=i=>{if(i.touches.length){let{clientX:e,clientY:n}=i.touches[0];if(i.touches.length>1){const r=i.touches[1],s=r.clientX,o=r.clientY;e=(e+s)/2,n=(n+o)/2}return{clientX:e,clientY:n}}const t=i.changedTouches[0];return{clientX:t.clientX,clientY:t.clientY}},N=500,M=10;class k{constructor(t,{onTouchDragStart:e},n={}){a(this,"_touchDragTimeOut"),a(this,"_onTouchDragStart"),a(this,"_payload",null),a(this,"_delay"),a(this,"_firstTouch",null),a(this,"_lastTouch",null),this._payload=t,this._onTouchDragStart=e,this._delay=n.delay||N}onTouchStart(t){var e;!t||!((e=t?.touches)!=null&&e.length)||this._touchDragTimeOut||(this._firstTouch=t.touches[t.touches.length-1],this._touchDragTimeOut=setTimeout(()=>{this._clearTimeout(),this._lastTouch||(this._lastTouch=t.touches[0]),this._checkXDistance(t)()},this._delay))}onTouchEnd(){this._resetTouches()}onTouchMove(t){var e;!t||!((e=t?.touches)!=null&&e.length)||(this._lastTouch=t.touches[0])}_clearTimeout(){this._touchDragTimeOut&&(clearTimeout(this._touchDragTimeOut),this._touchDragTimeOut=null)}_resetTouches(){this._clearTimeout(),this._lastTouch=null,this._firstTouch=null,this._payload=null}_checkXDistance(t){return()=>{if(!this._firstTouch||!this._lastTouch)return;let e=!1;e=Math.abs(this._firstTouch.clientX-this._lastTouch.clientX)<M,e&&(this._onTouchDragStart(this._payload,t),this._resetTouches())}}}const I="rml-drag-in-styles",F="rml-drag-in-drag-element",m="rml-drag-in-overlay",p="rml-drag-in-drag-ghost",x="rml-drag-in-fade-in",C="rml-drag-in-fade-out",D={DISPLAY_NONE:"rml-display-none"},$=.5,T="250ms",w="forwards",S=i=>i?!0:(console.warn("No instance set, cancel drag-in"),!1);class z{constructor(t){if(a(this,"_iframe"),a(this,"_currentDrag",{}),a(this,"_currentTouch",null),a(this,"_firefoxDragPosition",{x:0,y:0}),a(this,"_instance",null),a(this,"options",{}),a(this,"_firefoxFallback",r=>{if(!this._currentDrag.event)return;const s=r||window.event;this._firefoxDragPosition.x=s.pageX||0,this._firefoxDragPosition.y=s.pageY||0}),this._iframe=t,!document.getElementById(I)){const r=document.createElement("style");r.type="text/css",r.id=I,r.innerHTML=`
|
|
2
|
+
.${D.DISPLAY_NONE}{display:none}
|
|
3
|
+
.${m}{position:absolute;top:0;left:0;width:100%;height:100%;z-index:999;}
|
|
4
|
+
.${p}{position:absolute;top:0;left:0;width:1px;height:1px;z-index:999;pointer-events:none;background-color:transparent;}
|
|
5
|
+
@keyframes ${x} {from{opacity: 0;}to {opacity: ${$};}}
|
|
6
|
+
@keyframes ${C} {from{opacity: ${$};}to {opacity: 0;}}
|
|
7
|
+
`,document.head.appendChild(r)}const e=this._iframe.parentNode;let n=e.querySelector("."+p);n||(n=document.createElement("div"),n.classList.add(p),n.innerText=" ",e.appendChild(n)),this._firefoxFallback=this._firefoxFallback.bind(this),document.addEventListener("dragover",this._firefoxFallback)}setInstance(t){this._instance=t}dragStart(t,e){const n=this._iframe.parentNode;if(g(n).position!=="relative"){console.warn("Parent of iframe should have position relative, otherwise drag-in can not detect the x/y coordinates correctly");return}this._iframe.style.pointerEvents="none";let r=n.querySelector("."+m);if(r||(r=document.createElement("div"),r.classList.add(m),n.appendChild(r)),r.classList.remove(D.DISPLAY_NONE),e instanceof DragEvent){e.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 _=n.querySelector("."+p);this._currentDrag.event=e;const c=e.target.cloneNode();c.style.position="fixed",c.style.pointerEvents="none",c.style.opacity="0",c.style.animation=`${x} ${T} ${w}`,c.id=F,c.style.zIndex="9999",document.body.appendChild(c),this._currentDrag.element=c;const d=e.target.getBoundingClientRect();this._currentDrag.offset||(this._currentDrag.offset={x:0,y:0});const{clientX:h,clientY:f}=v(e,this._firefoxDragPosition);this._currentDrag.offset.x=h-d.left,this._currentDrag.offset.y=f-d.top,c.style.top=f+"px",c.style.left=h+"px",e.dataTransfer&&e.dataTransfer.setDragImage&&e.dataTransfer.setDragImage(_,0,0)}const{x:s,y:o}=E(n,this._currentDrag.event||e,this._firefoxDragPosition),l=Math.max(1,s),u=Math.max(1,o);S(this._instance)&&this._instance.dragInObject(t,l,u)}dragUpdate(t){var e,n;const r=this._iframe.parentNode,{x:s,y:o}=E(r,t,this._firefoxDragPosition);if(s===0&&o===0)return;const l=Math.max(1,s),u=Math.max(1,o);if(this._currentDrag.element){const{clientX:_,clientY:c}=v(t,this._firefoxDragPosition),d=((e=this._currentDrag.offset)==null?void 0:e.x)||0,h=((n=this._currentDrag.offset)==null?void 0:n.y)||0;this._currentDrag.element.style.left=`${_-d}px`,this._currentDrag.element.style.top=`${c-h}px`;const f=(this.options.dragInOverlapX||0)+1,L=(this.options.dragInOverlapY||0)+1;l>f&&u>L?this._currentDrag.element.style.animation=`${C} ${T} ${w}`:this._currentDrag.element.style.animation=`${x} ${T} ${w}`}l===1&&u===1||S(this._instance)&&this._instance.updateDrag(l,u)}dragEnd(){this._iframe.style.pointerEvents="all";const t=this._iframe.parentNode;S(this._instance)&&this._instance.dragInObjectEnd(),this._currentDrag.element&&document.body.removeChild(this._currentDrag.element),this._currentDrag={},this._firefoxDragPosition={x:0,y:0};const e=t.querySelector("."+m);e&&e.classList.add(D.DISPLAY_NONE)}touchStart(t,e){e.preventDefault();const n=(r,s)=>{this.dragStart(t,s)};this._currentTouch=new k(void 0,{onTouchDragStart:n}),this._currentTouch.onTouchStart(e)}touchMove(t){this._currentTouch&&this._currentTouch.onTouchMove(t),this._currentDrag.event&&this.dragUpdate(t)}touchEnd(){this._currentTouch&&this._currentTouch.onTouchEnd(),this._currentTouch=null,this.dragEnd()}dispose(){document.removeEventListener("dragover",this._firefoxFallback)}}export{z as DragIn};
|
|
@@ -0,0 +1,250 @@
|
|
|
1
|
+
var M = Object.defineProperty;
|
|
2
|
+
var X = (i, t, e) => t in i ? M(i, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[t] = e;
|
|
3
|
+
var a = (i, t, e) => X(i, typeof t != "symbol" ? t + "" : t, e);
|
|
4
|
+
class b {
|
|
5
|
+
constructor(t = 16) {
|
|
6
|
+
a(this, "_computedStyleCache", /* @__PURE__ */ new Map());
|
|
7
|
+
a(this, "_maxLifetime", 16);
|
|
8
|
+
a(this, "_cacheCleanInterval", null);
|
|
9
|
+
this._maxLifetime = t;
|
|
10
|
+
}
|
|
11
|
+
get(t) {
|
|
12
|
+
const e = this._computedStyleCache.get(t), n = Date.now();
|
|
13
|
+
if (e && n - e.updated < this._maxLifetime)
|
|
14
|
+
return e.style;
|
|
15
|
+
const s = getComputedStyle(t);
|
|
16
|
+
return this._computedStyleCache.set(t, { style: s, updated: n }), this._cacheCleanInterval || (this._cacheCleanInterval = setInterval(
|
|
17
|
+
() => this._cleanUpCache,
|
|
18
|
+
Math.max(this._maxLifetime * 1e3, 5e3)
|
|
19
|
+
)), s;
|
|
20
|
+
}
|
|
21
|
+
_cleanUpCache() {
|
|
22
|
+
const t = Date.now();
|
|
23
|
+
for (const [e, { updated: n }] of this._computedStyleCache.entries())
|
|
24
|
+
t - n >= this._maxLifetime && this._computedStyleCache.delete(e);
|
|
25
|
+
this._computedStyleCache.size === 0 && this._cacheCleanInterval && (clearInterval(this._cacheCleanInterval), this._cacheCleanInterval = null);
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
let T;
|
|
29
|
+
const y = (i) => (T || (T = new b()), T.get(i)), A = (i, t, e) => {
|
|
30
|
+
const n = parseFloat(i), s = window.devicePixelRatio || 1;
|
|
31
|
+
if (t === "px")
|
|
32
|
+
return n;
|
|
33
|
+
if (t === "%") {
|
|
34
|
+
const o = e === document.documentElement ? window.innerWidth : e.offsetWidth;
|
|
35
|
+
return n / 100 * o;
|
|
36
|
+
}
|
|
37
|
+
if (t === "rem") {
|
|
38
|
+
const o = parseFloat(
|
|
39
|
+
y(document.documentElement).fontSize
|
|
40
|
+
);
|
|
41
|
+
return n * o;
|
|
42
|
+
}
|
|
43
|
+
if (t === "em") {
|
|
44
|
+
const o = parseFloat(
|
|
45
|
+
y(e).fontSize
|
|
46
|
+
);
|
|
47
|
+
return n * o;
|
|
48
|
+
}
|
|
49
|
+
if (t === "vh" || t === "vw" || t === "vmin" || t === "vmax") {
|
|
50
|
+
const o = {
|
|
51
|
+
vh: window.innerHeight,
|
|
52
|
+
vw: window.innerWidth,
|
|
53
|
+
vmin: Math.min(window.innerWidth, window.innerHeight),
|
|
54
|
+
vmax: Math.max(window.innerWidth, window.innerHeight)
|
|
55
|
+
};
|
|
56
|
+
return n / 100 * o[t];
|
|
57
|
+
}
|
|
58
|
+
const r = {
|
|
59
|
+
cm: 37.7952755906,
|
|
60
|
+
mm: 3.77952755906,
|
|
61
|
+
in: 96
|
|
62
|
+
};
|
|
63
|
+
return t in r ? n * r[t] * s : 0;
|
|
64
|
+
}, N = (i, t, e = { x: 0, y: 0 }) => {
|
|
65
|
+
const n = i.getBoundingClientRect(), r = y(i).transform;
|
|
66
|
+
let o = 0, h = 0;
|
|
67
|
+
if (r !== "none") {
|
|
68
|
+
const c = /translate\(\s*([-+]?\d*\.?\d+|\d+)(px|%)?,?\s*([-+]?\d*\.?\d+|\d+)?(px|%)?\s*\)/, l = r.match(c);
|
|
69
|
+
l && (o = A(l[1], l[2], i), h = A(l[3], l[4], i));
|
|
70
|
+
}
|
|
71
|
+
const { clientX: u, clientY: d } = E(t, e), f = u - n.left - o + i.scrollLeft, _ = d - n.top - h + i.scrollTop;
|
|
72
|
+
return { x: f, y: _ };
|
|
73
|
+
}, E = (i, t) => {
|
|
74
|
+
const { clientX: e, clientY: n } = window.TouchEvent && i instanceof TouchEvent ? R(i) : i, s = e || t.x, r = n || t.y;
|
|
75
|
+
return { clientX: s, clientY: r };
|
|
76
|
+
}, R = (i) => {
|
|
77
|
+
if (i.touches.length) {
|
|
78
|
+
let { clientX: e, clientY: n } = i.touches[0];
|
|
79
|
+
if (i.touches.length > 1) {
|
|
80
|
+
const s = i.touches[1], r = s.clientX, o = s.clientY;
|
|
81
|
+
e = (e + r) / 2, n = (n + o) / 2;
|
|
82
|
+
}
|
|
83
|
+
return { clientX: e, clientY: n };
|
|
84
|
+
}
|
|
85
|
+
const t = i.changedTouches[0];
|
|
86
|
+
return { clientX: t.clientX, clientY: t.clientY };
|
|
87
|
+
}, v = 500, P = 10;
|
|
88
|
+
class $ {
|
|
89
|
+
constructor(t, { onTouchDragStart: e }, n = {}) {
|
|
90
|
+
a(this, "_touchDragTimeOut");
|
|
91
|
+
a(this, "_onTouchDragStart");
|
|
92
|
+
a(this, "_payload", null);
|
|
93
|
+
a(this, "_delay");
|
|
94
|
+
a(this, "_firstTouch", null);
|
|
95
|
+
a(this, "_lastTouch", null);
|
|
96
|
+
this._payload = t, this._onTouchDragStart = e, this._delay = n.delay || v;
|
|
97
|
+
}
|
|
98
|
+
onTouchStart(t) {
|
|
99
|
+
var e;
|
|
100
|
+
!t || !((e = t == null ? void 0 : t.touches) != null && e.length) || this._touchDragTimeOut || (this._firstTouch = t.touches[t.touches.length - 1], this._touchDragTimeOut = setTimeout(() => {
|
|
101
|
+
this._clearTimeout(), this._lastTouch || (this._lastTouch = t.touches[0]), this._checkXDistance(t)();
|
|
102
|
+
}, this._delay));
|
|
103
|
+
}
|
|
104
|
+
onTouchEnd() {
|
|
105
|
+
this._resetTouches();
|
|
106
|
+
}
|
|
107
|
+
onTouchMove(t) {
|
|
108
|
+
var e;
|
|
109
|
+
!t || !((e = t == null ? void 0 : t.touches) != null && e.length) || (this._lastTouch = t.touches[0]);
|
|
110
|
+
}
|
|
111
|
+
_clearTimeout() {
|
|
112
|
+
this._touchDragTimeOut && (clearTimeout(this._touchDragTimeOut), this._touchDragTimeOut = null);
|
|
113
|
+
}
|
|
114
|
+
_resetTouches() {
|
|
115
|
+
this._clearTimeout(), this._lastTouch = null, this._firstTouch = null, this._payload = null;
|
|
116
|
+
}
|
|
117
|
+
_checkXDistance(t) {
|
|
118
|
+
return () => {
|
|
119
|
+
if (!this._firstTouch || !this._lastTouch)
|
|
120
|
+
return;
|
|
121
|
+
let e = !1;
|
|
122
|
+
e = Math.abs(
|
|
123
|
+
this._firstTouch.clientX - this._lastTouch.clientX
|
|
124
|
+
) < P, e && (this._onTouchDragStart(this._payload, t), this._resetTouches());
|
|
125
|
+
};
|
|
126
|
+
}
|
|
127
|
+
}
|
|
128
|
+
const L = "rml-drag-in-styles", G = "rml-drag-in-drag-element", m = "rml-drag-in-overlay", p = "rml-drag-in-drag-ghost", D = "rml-drag-in-fade-in", O = "rml-drag-in-fade-out", x = {
|
|
129
|
+
DISPLAY_NONE: "rml-display-none"
|
|
130
|
+
}, Y = 0.5, S = "250ms", I = "forwards", C = (i) => i ? !0 : (console.warn("No instance set, cancel drag-in"), !1);
|
|
131
|
+
class U {
|
|
132
|
+
constructor(t) {
|
|
133
|
+
a(this, "_iframe");
|
|
134
|
+
a(this, "_currentDrag", {});
|
|
135
|
+
a(this, "_currentTouch", null);
|
|
136
|
+
a(this, "_firefoxDragPosition", { x: 0, y: 0 });
|
|
137
|
+
a(this, "_instance", null);
|
|
138
|
+
a(this, "options", {});
|
|
139
|
+
a(this, "_firefoxFallback", (t) => {
|
|
140
|
+
if (!this._currentDrag.event)
|
|
141
|
+
return;
|
|
142
|
+
const e = t || window.event;
|
|
143
|
+
this._firefoxDragPosition.x = e.pageX || 0, this._firefoxDragPosition.y = e.pageY || 0;
|
|
144
|
+
});
|
|
145
|
+
if (this._iframe = t, !!!document.getElementById(L)) {
|
|
146
|
+
const r = document.createElement("style");
|
|
147
|
+
r.type = "text/css", r.id = L, r.innerHTML = `
|
|
148
|
+
.${x.DISPLAY_NONE}{display:none}
|
|
149
|
+
.${m}{position:absolute;top:0;left:0;width:100%;height:100%;z-index:999;}
|
|
150
|
+
.${p}{position:absolute;top:0;left:0;width:1px;height:1px;z-index:999;pointer-events:none;background-color:transparent;}
|
|
151
|
+
@keyframes ${D} {from{opacity: 0;}to {opacity: ${Y};}}
|
|
152
|
+
@keyframes ${O} {from{opacity: ${Y};}to {opacity: 0;}}
|
|
153
|
+
`, document.head.appendChild(r);
|
|
154
|
+
}
|
|
155
|
+
const n = this._iframe.parentNode;
|
|
156
|
+
let s = n.querySelector(
|
|
157
|
+
"." + p
|
|
158
|
+
);
|
|
159
|
+
s || (s = document.createElement("div"), s.classList.add(p), s.innerText = " ", n.appendChild(s)), this._firefoxFallback = this._firefoxFallback.bind(this), document.addEventListener("dragover", this._firefoxFallback);
|
|
160
|
+
}
|
|
161
|
+
setInstance(t) {
|
|
162
|
+
this._instance = t;
|
|
163
|
+
}
|
|
164
|
+
dragStart(t, e) {
|
|
165
|
+
const n = this._iframe.parentNode;
|
|
166
|
+
if (y(n).position !== "relative") {
|
|
167
|
+
console.warn(
|
|
168
|
+
"Parent of iframe should have position relative, otherwise drag-in can not detect the x/y coordinates correctly"
|
|
169
|
+
);
|
|
170
|
+
return;
|
|
171
|
+
}
|
|
172
|
+
this._iframe.style.pointerEvents = "none";
|
|
173
|
+
let r = n.querySelector(
|
|
174
|
+
"." + m
|
|
175
|
+
);
|
|
176
|
+
if (r || (r = document.createElement("div"), r.classList.add(m), n.appendChild(r)), r.classList.remove(x.DISPLAY_NONE), e instanceof DragEvent) {
|
|
177
|
+
e.target.getAttribute(
|
|
178
|
+
"draggable"
|
|
179
|
+
) || console.warn(
|
|
180
|
+
`Draggable not detected correctly! Did you add draggable="true" to the element? In Sarafi only 'draggable' is too less`
|
|
181
|
+
);
|
|
182
|
+
const _ = n.querySelector(
|
|
183
|
+
"." + p
|
|
184
|
+
);
|
|
185
|
+
this._currentDrag.event = e;
|
|
186
|
+
const c = e.target.cloneNode();
|
|
187
|
+
c.style.position = "fixed", c.style.pointerEvents = "none", c.style.opacity = "0", c.style.animation = `${D} ${S} ${I}`, c.id = G, c.style.zIndex = "9999", document.body.appendChild(c), this._currentDrag.element = c;
|
|
188
|
+
const l = e.target.getBoundingClientRect();
|
|
189
|
+
this._currentDrag.offset || (this._currentDrag.offset = { x: 0, y: 0 });
|
|
190
|
+
const { clientX: g, clientY: w } = E(
|
|
191
|
+
e,
|
|
192
|
+
this._firefoxDragPosition
|
|
193
|
+
);
|
|
194
|
+
this._currentDrag.offset.x = g - l.left, this._currentDrag.offset.y = w - l.top, c.style.top = w + "px", c.style.left = g + "px", e.dataTransfer && e.dataTransfer.setDragImage && e.dataTransfer.setDragImage(_, 0, 0);
|
|
195
|
+
}
|
|
196
|
+
const { x: o, y: h } = N(
|
|
197
|
+
n,
|
|
198
|
+
this._currentDrag.event || e,
|
|
199
|
+
this._firefoxDragPosition
|
|
200
|
+
), u = Math.max(1, o), d = Math.max(1, h);
|
|
201
|
+
C(this._instance) && this._instance.dragInObject(t, u, d);
|
|
202
|
+
}
|
|
203
|
+
dragUpdate(t) {
|
|
204
|
+
var h, u;
|
|
205
|
+
const e = this._iframe.parentNode, { x: n, y: s } = N(e, t, this._firefoxDragPosition);
|
|
206
|
+
if (n === 0 && s === 0)
|
|
207
|
+
return;
|
|
208
|
+
const r = Math.max(1, n), o = Math.max(1, s);
|
|
209
|
+
if (this._currentDrag.element) {
|
|
210
|
+
const { clientX: d, clientY: f } = E(
|
|
211
|
+
t,
|
|
212
|
+
this._firefoxDragPosition
|
|
213
|
+
), _ = ((h = this._currentDrag.offset) == null ? void 0 : h.x) || 0, c = ((u = this._currentDrag.offset) == null ? void 0 : u.y) || 0;
|
|
214
|
+
this._currentDrag.element.style.left = `${d - _}px`, this._currentDrag.element.style.top = `${f - c}px`;
|
|
215
|
+
const l = (this.options.dragInOverlapX || 0) + 1, g = (this.options.dragInOverlapY || 0) + 1;
|
|
216
|
+
r > l && o > g ? this._currentDrag.element.style.animation = `${O} ${S} ${I}` : this._currentDrag.element.style.animation = `${D} ${S} ${I}`;
|
|
217
|
+
}
|
|
218
|
+
r === 1 && o === 1 || C(this._instance) && this._instance.updateDrag(r, o);
|
|
219
|
+
}
|
|
220
|
+
dragEnd() {
|
|
221
|
+
this._iframe.style.pointerEvents = "all";
|
|
222
|
+
const t = this._iframe.parentNode;
|
|
223
|
+
C(this._instance) && this._instance.dragInObjectEnd(), this._currentDrag.element && document.body.removeChild(this._currentDrag.element), this._currentDrag = {}, this._firefoxDragPosition = { x: 0, y: 0 };
|
|
224
|
+
const e = t.querySelector(
|
|
225
|
+
"." + m
|
|
226
|
+
);
|
|
227
|
+
e && e.classList.add(x.DISPLAY_NONE);
|
|
228
|
+
}
|
|
229
|
+
touchStart(t, e) {
|
|
230
|
+
e.preventDefault();
|
|
231
|
+
const n = (s, r) => {
|
|
232
|
+
this.dragStart(t, r);
|
|
233
|
+
};
|
|
234
|
+
this._currentTouch = new $(void 0, {
|
|
235
|
+
onTouchDragStart: n
|
|
236
|
+
}), this._currentTouch.onTouchStart(e);
|
|
237
|
+
}
|
|
238
|
+
touchMove(t) {
|
|
239
|
+
this._currentTouch && this._currentTouch.onTouchMove(t), this._currentDrag.event && this.dragUpdate(t);
|
|
240
|
+
}
|
|
241
|
+
touchEnd() {
|
|
242
|
+
this._currentTouch && this._currentTouch.onTouchEnd(), this._currentTouch = null, this.dragEnd();
|
|
243
|
+
}
|
|
244
|
+
dispose() {
|
|
245
|
+
document.removeEventListener("dragover", this._firefoxFallback);
|
|
246
|
+
}
|
|
247
|
+
}
|
|
248
|
+
export {
|
|
249
|
+
U as DragIn
|
|
250
|
+
};
|
package/index.d.ts
CHANGED
|
@@ -3,21 +3,49 @@ import { default as default_3 } from '@roomle/web-sdk/lib/definitions/configurat
|
|
|
3
3
|
import { default as default_4 } from '@roomle/web-sdk/lib/definitions/configurator-core/src/roomle-configurator';
|
|
4
4
|
import { default as default_5 } from '@roomle/web-sdk/lib/definitions/glb-viewer-core/src/roomle-glb-viewer';
|
|
5
5
|
import { ExposedAnalyticsCallbacks } from '../../../src/configurator/embedding/exposed-analytics-callbacks';
|
|
6
|
-
import { ExposedApi } from '
|
|
6
|
+
import { ExposedApi } from '../../../../src/configurator/embedding/exposed-api';
|
|
7
|
+
import { ExposedApi as ExposedApi_2 } from '../../../src/configurator/embedding/exposed-api';
|
|
7
8
|
import { GlobalCallback } from '@roomle/web-sdk/lib/definitions/common-core/src/services/global-callback';
|
|
9
|
+
import { RapiId } from '@roomle/web-sdk/lib/definitions/typings/rapi-types';
|
|
8
10
|
import { UiInitData } from '../../../src/configurator/embedding/types';
|
|
9
11
|
|
|
12
|
+
declare interface AvailablePlugins {
|
|
13
|
+
dragIn?: DragIn;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
declare class DragIn {
|
|
17
|
+
private _iframe;
|
|
18
|
+
private _currentDrag;
|
|
19
|
+
private _currentTouch;
|
|
20
|
+
private _firefoxDragPosition;
|
|
21
|
+
private _instance;
|
|
22
|
+
options: {
|
|
23
|
+
dragInOverlapX?: number;
|
|
24
|
+
dragInOverlapY?: number;
|
|
25
|
+
};
|
|
26
|
+
constructor(iframe: HTMLIFrameElement);
|
|
27
|
+
setInstance(instance: ExposedApi): void;
|
|
28
|
+
private _firefoxFallback;
|
|
29
|
+
dragStart(id: RapiId, event: DragEvent | TouchEvent): void;
|
|
30
|
+
dragUpdate(event: DragEvent | TouchEvent): void;
|
|
31
|
+
dragEnd(): void;
|
|
32
|
+
touchStart(id: RapiId, event: TouchEvent): void;
|
|
33
|
+
touchMove(event: TouchEvent): void;
|
|
34
|
+
touchEnd(): void;
|
|
35
|
+
dispose(): void;
|
|
36
|
+
}
|
|
37
|
+
|
|
10
38
|
declare type RoomleConfiguratorApi = RoomleEmbeddingApi<default_4, default_3>;
|
|
11
39
|
|
|
12
40
|
declare class RoomleEmbeddingApi<SdkType, SdkCallbacks> implements RoomleEmbeddingApiKeys {
|
|
13
|
-
static createPlanner(configuratorId: string, container: HTMLElement, initData: UiInitData): Promise<RoomlePlannerApi>;
|
|
41
|
+
static createPlanner(configuratorId: string, container: HTMLElement, initData: UiInitData, plugins?: Array<keyof AvailablePlugins>): Promise<RoomlePlannerApi>;
|
|
14
42
|
/**
|
|
15
43
|
* Method to create a new instance of a Roomle Configurator
|
|
16
44
|
* @param configuratorId the id which identifies your configurator, you will get this ID from your Roomle Contact Person
|
|
17
45
|
* @param container DOM container in which the configurator should be placed
|
|
18
46
|
* @param initData settings with which the configurator should be started
|
|
19
47
|
*/
|
|
20
|
-
static createConfigurator(configuratorId: string, container: HTMLElement, initData: UiInitData): Promise<RoomleConfiguratorApi>;
|
|
48
|
+
static createConfigurator(configuratorId: string, container: HTMLElement, initData: UiInitData, plugins?: Array<keyof AvailablePlugins>): Promise<RoomleConfiguratorApi>;
|
|
21
49
|
/**
|
|
22
50
|
* Method to create a new instance of a Roomle Configurator
|
|
23
51
|
* @deprecated please use "createConfigurator"
|
|
@@ -25,16 +53,16 @@ declare class RoomleEmbeddingApi<SdkType, SdkCallbacks> implements RoomleEmbeddi
|
|
|
25
53
|
* @param container DOM container in which the configurator should be placed
|
|
26
54
|
* @param initData settings with which the configurator should be started
|
|
27
55
|
*/
|
|
28
|
-
static create(configuratorId: string, container: HTMLElement, initData: UiInitData): Promise<RoomleConfiguratorApi>;
|
|
56
|
+
static create(configuratorId: string, container: HTMLElement, initData: UiInitData, plugins: Array<keyof AvailablePlugins>): Promise<RoomleConfiguratorApi>;
|
|
29
57
|
/**
|
|
30
58
|
* Method to create a new instance of a Roomle Viewer
|
|
31
59
|
* @param configuratorId the id which identifies your configurator, you will get this ID from your Roomle Contact Person
|
|
32
60
|
* @param container DOM container in which the configurator should be placed
|
|
33
61
|
* @param initData settings with which the configurator should be started
|
|
34
62
|
*/
|
|
35
|
-
static createViewer(configuratorId: string, container: HTMLElement, initData: UiInitData): Promise<RoomleViewerApi>;
|
|
63
|
+
static createViewer(configuratorId: string, container: HTMLElement, initData: UiInitData, plugins?: Array<keyof AvailablePlugins>): Promise<RoomleViewerApi>;
|
|
36
64
|
private static _create;
|
|
37
|
-
ui:
|
|
65
|
+
ui: ExposedApi_2;
|
|
38
66
|
extended: SdkType;
|
|
39
67
|
analytics: {
|
|
40
68
|
callbacks: ExposedAnalyticsCallbacks;
|
|
@@ -42,12 +70,14 @@ declare class RoomleEmbeddingApi<SdkType, SdkCallbacks> implements RoomleEmbeddi
|
|
|
42
70
|
global: {
|
|
43
71
|
callbacks: GlobalCallback;
|
|
44
72
|
};
|
|
73
|
+
plugins: AvailablePlugins;
|
|
45
74
|
private _waitForIframe;
|
|
46
75
|
private _container;
|
|
47
76
|
private _messageHandler;
|
|
48
77
|
private _configuratorSettings;
|
|
49
78
|
private _initData;
|
|
50
79
|
private _iframe;
|
|
80
|
+
pluginsLoaded: Array<Promise<void>>;
|
|
51
81
|
private constructor();
|
|
52
82
|
teardown(): void;
|
|
53
83
|
private _createIframe;
|
package/package.json
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
var M = Object.defineProperty;
|
|
2
2
|
var v = (t, e, s) => e in t ? M(t, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : t[e] = s;
|
|
3
|
-
var
|
|
3
|
+
var l = (t, e, s) => v(t, typeof e != "symbol" ? e + "" : e, s);
|
|
4
4
|
class P {
|
|
5
5
|
constructor(e, s, r, o) {
|
|
6
|
-
|
|
6
|
+
l(this, "_side");
|
|
7
7
|
// for better debugging (who handles message? iframe or website?)
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
8
|
+
l(this, "_incomingMessageBus");
|
|
9
|
+
l(this, "_outgoingMessageBus", null);
|
|
10
|
+
l(this, "_execMessage", null);
|
|
11
11
|
this._side = e, this._incomingMessageBus = s, this._outgoingMessageBus = r, this._execMessage = o, this._incomingMessageBus.addEventListener(
|
|
12
12
|
"message",
|
|
13
13
|
this._handleMessage.bind(this)
|
|
@@ -21,25 +21,25 @@ class P {
|
|
|
21
21
|
}
|
|
22
22
|
sendMessage(e, s = []) {
|
|
23
23
|
return new Promise((r, o) => {
|
|
24
|
-
const
|
|
25
|
-
|
|
26
|
-
if (!
|
|
27
|
-
return
|
|
24
|
+
const i = new MessageChannel();
|
|
25
|
+
i.port1.onmessage = (n) => {
|
|
26
|
+
if (!n || !n.data)
|
|
27
|
+
return i.port1.close(), i.port2.close(), o(
|
|
28
28
|
new Error(
|
|
29
29
|
this._side + " received message but response can not be interpreted"
|
|
30
30
|
)
|
|
31
31
|
);
|
|
32
|
-
let
|
|
32
|
+
let c;
|
|
33
33
|
try {
|
|
34
|
-
|
|
35
|
-
} catch (
|
|
36
|
-
return
|
|
34
|
+
c = JSON.parse(n.data);
|
|
35
|
+
} catch (a) {
|
|
36
|
+
return i.port1.close(), i.port2.close(), this._prepareError(a), o(a);
|
|
37
37
|
}
|
|
38
|
-
|
|
38
|
+
c.error ? o(c.error) : c.result !== void 0 ? r(c.result) : r(void 0), i.port1.close(), i.port2.close();
|
|
39
39
|
};
|
|
40
|
-
let
|
|
40
|
+
let d = "";
|
|
41
41
|
try {
|
|
42
|
-
|
|
42
|
+
d = JSON.stringify({ message: e, args: s });
|
|
43
43
|
} catch {
|
|
44
44
|
return o(
|
|
45
45
|
new Error(
|
|
@@ -49,8 +49,8 @@ class P {
|
|
|
49
49
|
}
|
|
50
50
|
if (!this._outgoingMessageBus)
|
|
51
51
|
return o(new Error(this._side + ": outgoing bus not set yet"));
|
|
52
|
-
this._outgoingMessageBus.postMessage(
|
|
53
|
-
|
|
52
|
+
this._outgoingMessageBus.postMessage(d, "*", [
|
|
53
|
+
i.port2
|
|
54
54
|
]);
|
|
55
55
|
});
|
|
56
56
|
}
|
|
@@ -70,20 +70,20 @@ class P {
|
|
|
70
70
|
if (o === void 0)
|
|
71
71
|
return;
|
|
72
72
|
o.then(
|
|
73
|
-
(
|
|
74
|
-
let
|
|
75
|
-
typeof
|
|
76
|
-
JSON.stringify({ error:
|
|
77
|
-
) :
|
|
78
|
-
JSON.stringify({ result: a })
|
|
79
|
-
) : s.postMessage(
|
|
73
|
+
(i = {}) => {
|
|
74
|
+
let d, n;
|
|
75
|
+
typeof i == "object" && i !== null && (d = i.error, n = i.result), d ? s.postMessage(
|
|
76
|
+
JSON.stringify({ error: d })
|
|
77
|
+
) : n !== void 0 ? s.postMessage(
|
|
80
78
|
JSON.stringify({ result: n })
|
|
79
|
+
) : s.postMessage(
|
|
80
|
+
JSON.stringify({ result: i })
|
|
81
81
|
);
|
|
82
82
|
},
|
|
83
|
-
(
|
|
83
|
+
(i) => {
|
|
84
84
|
s.postMessage(
|
|
85
85
|
JSON.stringify({
|
|
86
|
-
error: this._prepareError(
|
|
86
|
+
error: this._prepareError(i)
|
|
87
87
|
})
|
|
88
88
|
);
|
|
89
89
|
}
|
|
@@ -108,37 +108,37 @@ const p = ".", E = {
|
|
|
108
108
|
REQUEST_BOOT: "requestBoot",
|
|
109
109
|
SETUP: "setup",
|
|
110
110
|
WEBSITE_READY: "websiteReady"
|
|
111
|
-
},
|
|
111
|
+
}, D = async (t, e) => {
|
|
112
112
|
if (typeof t != "string")
|
|
113
113
|
throw new Error(
|
|
114
114
|
'Configurator ID is not a string type: "' + typeof t + '"'
|
|
115
115
|
);
|
|
116
|
-
const s = e.customApiUrl ? e.customApiUrl : "https://api.roomle.com/v2", r = e.overrideTenant || 9, o = s + "/configurators/" + t,
|
|
116
|
+
const s = e.customApiUrl ? e.customApiUrl : "https://api.roomle.com/v2", r = e.overrideTenant || 9, o = s + "/configurators/" + t, i = "roomle_portal_v2", d = "03-" + window.btoa((/* @__PURE__ */ new Date()).toISOString() + ";anonymous;" + i), n = () => {
|
|
117
117
|
const h = {
|
|
118
|
-
apiKey:
|
|
118
|
+
apiKey: i,
|
|
119
119
|
currentTenant: r,
|
|
120
120
|
locale: "en",
|
|
121
121
|
language: "en",
|
|
122
122
|
device: 1,
|
|
123
|
-
token:
|
|
123
|
+
token: d,
|
|
124
124
|
platform: "web"
|
|
125
125
|
};
|
|
126
126
|
return new Headers(h);
|
|
127
|
-
},
|
|
127
|
+
}, c = new Request(o, {
|
|
128
128
|
method: "GET",
|
|
129
|
-
headers:
|
|
129
|
+
headers: n(),
|
|
130
130
|
mode: "cors",
|
|
131
131
|
cache: "default"
|
|
132
|
-
}),
|
|
133
|
-
return
|
|
134
|
-
},
|
|
132
|
+
}), a = await fetch(c), { configurator: g } = await a.json();
|
|
133
|
+
return g;
|
|
134
|
+
}, H = () => {
|
|
135
135
|
try {
|
|
136
136
|
return window.self !== window.top;
|
|
137
137
|
} catch {
|
|
138
138
|
return !0;
|
|
139
139
|
}
|
|
140
|
-
},
|
|
141
|
-
const t =
|
|
140
|
+
}, F = ["127.0.0.1", "localhost", "0.0.0.0"], C = () => {
|
|
141
|
+
const t = H();
|
|
142
142
|
let e = window.location.href;
|
|
143
143
|
if (t) {
|
|
144
144
|
if (!document.referrer)
|
|
@@ -147,35 +147,37 @@ const p = ".", E = {
|
|
|
147
147
|
}
|
|
148
148
|
const { hostname: s } = new URL(e);
|
|
149
149
|
return s;
|
|
150
|
-
}, B = (t) => !!(
|
|
150
|
+
}, B = (t) => !!(F.includes(t) || t.endsWith("roomle.com") || t.endsWith("gitlab.io") || t.endsWith("gitlab.com")), A = [
|
|
151
151
|
"language",
|
|
152
152
|
"browserLanguage",
|
|
153
153
|
"userLanguage",
|
|
154
154
|
"systemLanguage"
|
|
155
|
-
],
|
|
155
|
+
], U = (t = null) => {
|
|
156
156
|
const e = window.navigator;
|
|
157
157
|
if (t)
|
|
158
158
|
return t.substr(0, 2);
|
|
159
159
|
if (Array.isArray(e.languages) && e.languages.length > 0)
|
|
160
160
|
return e.languages[0].substr(0, 2);
|
|
161
|
-
for (let s = 0, r =
|
|
162
|
-
const o = e[
|
|
161
|
+
for (let s = 0, r = A.length; s < r; s++) {
|
|
162
|
+
const o = e[A[s]];
|
|
163
163
|
if (o)
|
|
164
164
|
return o.substr(0, 2);
|
|
165
165
|
}
|
|
166
166
|
return "en";
|
|
167
|
-
},
|
|
167
|
+
}, k = (t, e) => {
|
|
168
168
|
const s = JSON.parse(JSON.stringify(t));
|
|
169
|
-
return
|
|
170
|
-
},
|
|
169
|
+
return y(s, e);
|
|
170
|
+
}, y = (t, e) => {
|
|
171
171
|
for (const s in e)
|
|
172
172
|
try {
|
|
173
|
-
e[s].constructor === Object ? t[s] =
|
|
173
|
+
e[s].constructor === Object ? t[s] = y(t[s], e[s]) : t[s] = e[s];
|
|
174
174
|
} catch {
|
|
175
175
|
t[s] = e[s];
|
|
176
176
|
}
|
|
177
177
|
return t;
|
|
178
|
-
}
|
|
178
|
+
};
|
|
179
|
+
var x = { BASE_URL: "/", DEV: !1, MODE: "production", PROD: !0, SSR: !1 };
|
|
180
|
+
const W = {
|
|
179
181
|
mobileLandscape: !0,
|
|
180
182
|
floorMaterialRootTag: "materials_root",
|
|
181
183
|
buttons: {
|
|
@@ -195,9 +197,9 @@ const p = ".", E = {
|
|
|
195
197
|
featureFlags: {
|
|
196
198
|
mocAr: !0
|
|
197
199
|
}
|
|
198
|
-
},
|
|
200
|
+
}, G = "(idle)", J = (t) => (O(t), t != null && t.customApiUrl && (t.customApiUrl = decodeURIComponent(t.customApiUrl)), t.shareUrl && (t.deeplink = t.shareUrl.replace(
|
|
199
201
|
z,
|
|
200
|
-
|
|
202
|
+
Y
|
|
201
203
|
)), t), O = (t) => {
|
|
202
204
|
if (!t)
|
|
203
205
|
return;
|
|
@@ -209,18 +211,18 @@ const p = ".", E = {
|
|
|
209
211
|
O(o);
|
|
210
212
|
(r === "true" || r === "false") && (t[s] = r === "true");
|
|
211
213
|
}
|
|
212
|
-
},
|
|
214
|
+
}, V = (t, e) => {
|
|
213
215
|
e.configuratorId = t.id;
|
|
214
216
|
const s = t.settings || {};
|
|
215
|
-
return !e.overrideTenant && t.tenant && (e.overrideTenant = t.tenant),
|
|
217
|
+
return !e.overrideTenant && t.tenant && (e.overrideTenant = t.tenant), k(s, e);
|
|
216
218
|
}, $ = () => {
|
|
217
219
|
const t = {
|
|
218
|
-
...
|
|
220
|
+
...W
|
|
219
221
|
};
|
|
220
|
-
t.locale || (t.locale =
|
|
222
|
+
t.locale || (t.locale = U()), t.id === G && delete t.id;
|
|
221
223
|
const e = C();
|
|
222
|
-
return e && B(e) && (t.configuratorId = "demoConfigurator"), t.customApiUrl =
|
|
223
|
-
}, z = "<CONF_ID>",
|
|
224
|
+
return e && B(e) && (t.configuratorId = "demoConfigurator"), t.customApiUrl = x.VITE_RAPI_URL, t.emails = !1, t;
|
|
225
|
+
}, z = "<CONF_ID>", Y = "#CONFIGURATIONID#", R = () => /(android)/i.test(navigator.userAgent), L = (t, e, s) => {
|
|
224
226
|
let r = null;
|
|
225
227
|
Object.defineProperty(t, e, {
|
|
226
228
|
get() {
|
|
@@ -232,75 +234,89 @@ const p = ".", E = {
|
|
|
232
234
|
), console.warn("{ mute: true, value: () => void }"), r = o);
|
|
233
235
|
}
|
|
234
236
|
});
|
|
235
|
-
},
|
|
237
|
+
}, T = () => window.innerHeight * 0.01 + "px", b = (t) => {
|
|
236
238
|
t && setTimeout(
|
|
237
|
-
() => t.style.setProperty(
|
|
239
|
+
() => t.style.setProperty(w, T()),
|
|
238
240
|
0
|
|
239
241
|
);
|
|
240
|
-
},
|
|
242
|
+
}, S = "rml-styles", q = 450, w = "--rml-full-height", u = {
|
|
241
243
|
CONTAINER: "rml-container",
|
|
242
244
|
FILL: "rml-fill",
|
|
243
245
|
POSITION: "rml-pos",
|
|
244
246
|
TRANSITION: "rml-transition",
|
|
245
247
|
ANDROID_HEIGHT: "rml-android-height",
|
|
246
248
|
OVERFLOW_HIDDEN: "rml-overflow-hidden"
|
|
247
|
-
},
|
|
248
|
-
class
|
|
249
|
-
constructor(e, s, r, o) {
|
|
250
|
-
|
|
249
|
+
}, I = /* @__PURE__ */ new Map();
|
|
250
|
+
class Q {
|
|
251
|
+
constructor(e, s, r, o, i) {
|
|
252
|
+
l(this, "ui", {
|
|
251
253
|
callbacks: null
|
|
252
254
|
});
|
|
253
|
-
|
|
255
|
+
l(this, "extended", {
|
|
254
256
|
callbacks: null
|
|
255
257
|
});
|
|
256
|
-
|
|
258
|
+
l(this, "analytics", {
|
|
257
259
|
callbacks: {}
|
|
258
260
|
});
|
|
259
|
-
|
|
261
|
+
l(this, "global", {
|
|
260
262
|
callbacks: {}
|
|
261
263
|
});
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
264
|
+
l(this, "plugins", {});
|
|
265
|
+
l(this, "_waitForIframe");
|
|
266
|
+
l(this, "_container");
|
|
267
|
+
l(this, "_messageHandler");
|
|
268
|
+
l(this, "_configuratorSettings");
|
|
269
|
+
l(this, "_initData", {});
|
|
270
|
+
l(this, "_iframe");
|
|
271
|
+
l(this, "pluginsLoaded", []);
|
|
268
272
|
if (!e || typeof e.id != "string")
|
|
269
273
|
throw new Error(
|
|
270
274
|
"Please provide a correct configuratorId, you get the correct ID from your Roomle Contact Person"
|
|
271
275
|
);
|
|
272
|
-
if (
|
|
276
|
+
if (I.has(s))
|
|
273
277
|
throw new Error("There is already an instance on this DOM element");
|
|
274
|
-
if (!!!document.getElementById(
|
|
275
|
-
const
|
|
276
|
-
|
|
277
|
-
const
|
|
278
|
-
(f,
|
|
278
|
+
if (!!!document.getElementById(S)) {
|
|
279
|
+
const c = r.zIndex || 9999999, a = document.createElement("style");
|
|
280
|
+
a.type = "text/css", a.id = S;
|
|
281
|
+
const g = "transition:all ease-in-out " + q + "ms;", h = ["-webkit-", "-o-"].reduce(
|
|
282
|
+
(f, _) => f += _ + g,
|
|
279
283
|
""
|
|
280
|
-
) +
|
|
281
|
-
|
|
282
|
-
.${
|
|
283
|
-
.${
|
|
284
|
-
.${
|
|
285
|
-
.${
|
|
286
|
-
.${
|
|
287
|
-
.${
|
|
288
|
-
`, document.head.appendChild(
|
|
284
|
+
) + g, m = T();
|
|
285
|
+
a.innerHTML = `
|
|
286
|
+
.${u.CONTAINER}{${w}:${m};}
|
|
287
|
+
.${u.POSITION}{position:fixed;top:0;left:0;z-index:${c};opacity:0}
|
|
288
|
+
.${u.TRANSITION}{${h}}
|
|
289
|
+
.${u.FILL}{width:100%;height:100%;opacity:1}
|
|
290
|
+
.${u.ANDROID_HEIGHT}{height:calc(var(${w},1vh)*100)}
|
|
291
|
+
.${u.OVERFLOW_HIDDEN}{overflow:hidden}
|
|
292
|
+
`, document.head.appendChild(a);
|
|
289
293
|
}
|
|
290
|
-
this._onResize = this._onResize.bind(this),
|
|
291
|
-
const
|
|
294
|
+
this._onResize = this._onResize.bind(this), R() && window.addEventListener("resize", this._onResize), this._container = s, this._initData = r, this._configuratorSettings = e;
|
|
295
|
+
const n = this._createIframe();
|
|
292
296
|
this._onUseFullPage = this._onUseFullPage.bind(this), this._executeMessage = this._executeMessage.bind(this), this._onBackToWebsite = this._onBackToWebsite.bind(this), this._messageHandler = new P(
|
|
293
297
|
"website",
|
|
294
298
|
window,
|
|
295
299
|
null,
|
|
296
300
|
this._executeMessage
|
|
297
|
-
), this._waitForIframe =
|
|
301
|
+
), this._waitForIframe = i, this._container.appendChild(n), this._iframe = n, o.includes("dragIn") && this.pluginsLoaded.push(
|
|
302
|
+
new Promise((c, a) => {
|
|
303
|
+
try {
|
|
304
|
+
import("./drag-in-CAakt8yw.mjs").then(({ DragIn: g }) => {
|
|
305
|
+
const h = new g(this._iframe);
|
|
306
|
+
h.setInstance(this.ui), c(), this.plugins.dragIn = h;
|
|
307
|
+
});
|
|
308
|
+
} catch (g) {
|
|
309
|
+
a(g);
|
|
310
|
+
}
|
|
311
|
+
})
|
|
312
|
+
), I.set(s, !0);
|
|
298
313
|
}
|
|
299
|
-
static createPlanner(e, s, r) {
|
|
314
|
+
static createPlanner(e, s, r, o = []) {
|
|
300
315
|
return this._create(
|
|
301
316
|
e,
|
|
302
317
|
s,
|
|
303
|
-
r
|
|
318
|
+
r,
|
|
319
|
+
o
|
|
304
320
|
);
|
|
305
321
|
}
|
|
306
322
|
/**
|
|
@@ -309,11 +325,12 @@ class K {
|
|
|
309
325
|
* @param container DOM container in which the configurator should be placed
|
|
310
326
|
* @param initData settings with which the configurator should be started
|
|
311
327
|
*/
|
|
312
|
-
static createConfigurator(e, s, r) {
|
|
328
|
+
static createConfigurator(e, s, r, o = []) {
|
|
313
329
|
return this._create(
|
|
314
330
|
e,
|
|
315
331
|
s,
|
|
316
|
-
r
|
|
332
|
+
r,
|
|
333
|
+
o
|
|
317
334
|
);
|
|
318
335
|
}
|
|
319
336
|
/**
|
|
@@ -323,11 +340,12 @@ class K {
|
|
|
323
340
|
* @param container DOM container in which the configurator should be placed
|
|
324
341
|
* @param initData settings with which the configurator should be started
|
|
325
342
|
*/
|
|
326
|
-
static create(e, s, r) {
|
|
343
|
+
static create(e, s, r, o) {
|
|
327
344
|
return this._create(
|
|
328
345
|
e,
|
|
329
346
|
s,
|
|
330
|
-
r
|
|
347
|
+
r,
|
|
348
|
+
o
|
|
331
349
|
);
|
|
332
350
|
}
|
|
333
351
|
/**
|
|
@@ -336,38 +354,42 @@ class K {
|
|
|
336
354
|
* @param container DOM container in which the configurator should be placed
|
|
337
355
|
* @param initData settings with which the configurator should be started
|
|
338
356
|
*/
|
|
339
|
-
static createViewer(e, s, r) {
|
|
357
|
+
static createViewer(e, s, r, o = []) {
|
|
340
358
|
return this._create(
|
|
341
359
|
e,
|
|
342
360
|
s,
|
|
343
|
-
r
|
|
361
|
+
r,
|
|
362
|
+
o
|
|
344
363
|
);
|
|
345
364
|
}
|
|
346
|
-
static _create(e, s, r) {
|
|
347
|
-
return new Promise(async (
|
|
365
|
+
static async _create(e, s, r, o) {
|
|
366
|
+
return new Promise(async (i, d) => {
|
|
348
367
|
try {
|
|
349
|
-
const
|
|
368
|
+
const n = y(
|
|
350
369
|
$(),
|
|
351
|
-
|
|
370
|
+
J(r)
|
|
352
371
|
);
|
|
353
|
-
|
|
354
|
-
const
|
|
372
|
+
n.featureFlags || (n.featureFlags = {}), typeof n.featureFlags.realPartList != "boolean" && (n.featureFlags.realPartList = !0), typeof n.featureFlags.globalCallbacks != "boolean" && (n.featureFlags.globalCallbacks = !0), typeof n.featureFlags.mocAr != "boolean" && (n.featureFlags.mocAr = !1);
|
|
373
|
+
const c = await D(
|
|
355
374
|
e,
|
|
356
|
-
|
|
375
|
+
n
|
|
357
376
|
);
|
|
358
|
-
|
|
359
|
-
|
|
377
|
+
r = V(c, n);
|
|
378
|
+
const a = new this(
|
|
379
|
+
c,
|
|
360
380
|
s,
|
|
361
381
|
r,
|
|
362
|
-
o
|
|
382
|
+
o,
|
|
383
|
+
i
|
|
363
384
|
);
|
|
364
|
-
|
|
365
|
-
|
|
385
|
+
return await Promise.allSettled(a.pluginsLoaded), a;
|
|
386
|
+
} catch (n) {
|
|
387
|
+
return d(n);
|
|
366
388
|
}
|
|
367
389
|
});
|
|
368
390
|
}
|
|
369
391
|
teardown() {
|
|
370
|
-
this._container &&
|
|
392
|
+
this._container && I.delete(this._container);
|
|
371
393
|
const e = this._container.querySelector("iframe");
|
|
372
394
|
e && this._container.removeChild(e), window.removeEventListener("resize", this._onResize);
|
|
373
395
|
}
|
|
@@ -375,39 +397,39 @@ class K {
|
|
|
375
397
|
var r;
|
|
376
398
|
const e = document.createElement("iframe");
|
|
377
399
|
let s = ((r = this._configuratorSettings) == null ? void 0 : r.url) || "https://www.roomle.com/t/cp/";
|
|
378
|
-
return this._initData.useLocalRoomle && (s = location.href.replace("embedding.html", "")), location.href.includes("roomle.gitlab.io") && (s = location.href.replace("embedding.html", "index.html")), this._initData.overrideServerUrl && (s = this._initData.overrideServerUrl), e.src = s, e.classList.add(
|
|
400
|
+
return this._initData.useLocalRoomle && (s = location.href.replace("embedding.html", "")), location.href.includes("roomle.gitlab.io") && (s = location.href.replace("embedding.html", "index.html")), this._initData.overrideServerUrl && (s = this._initData.overrideServerUrl), e.src = s, e.classList.add(u.CONTAINER), e.classList.add(u.FILL), e;
|
|
379
401
|
}
|
|
380
402
|
_onResize() {
|
|
381
|
-
|
|
403
|
+
b(this._iframe);
|
|
382
404
|
}
|
|
383
405
|
_onUseFullPage() {
|
|
384
|
-
this._iframe.classList.add(
|
|
406
|
+
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));
|
|
385
407
|
}
|
|
386
408
|
_onBackToWebsite() {
|
|
387
|
-
this._iframe.classList.remove(
|
|
409
|
+
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);
|
|
388
410
|
}
|
|
389
411
|
_executeMessage({ message: e, args: s }, r) {
|
|
390
|
-
var
|
|
391
|
-
if (!r.source || r.source !== ((
|
|
412
|
+
var c;
|
|
413
|
+
if (!r.source || r.source !== ((c = this._iframe) == null ? void 0 : c.contentWindow))
|
|
392
414
|
return;
|
|
393
415
|
if (e === E.REQUEST_BOOT)
|
|
394
416
|
return this._messageHandler.setOutgoingMessageBus(r.source), Promise.resolve({ result: this._initData });
|
|
395
417
|
if (e === E.SETUP) {
|
|
396
|
-
const { methods:
|
|
397
|
-
return
|
|
398
|
-
const
|
|
399
|
-
this[
|
|
418
|
+
const { methods: a, callbacks: g } = s[0];
|
|
419
|
+
return a.forEach((h) => {
|
|
420
|
+
const m = h.split(p), f = m[0], _ = m[1];
|
|
421
|
+
this[f] || (this[f] = {}), this[f][_] = (function() {
|
|
400
422
|
return this._messageHandler.sendMessage(h, [...arguments]);
|
|
401
423
|
}).bind(this);
|
|
402
|
-
}),
|
|
403
|
-
const
|
|
404
|
-
this[
|
|
424
|
+
}), g.forEach((h) => {
|
|
425
|
+
const m = h.split(p), f = m[0], _ = m[1], N = m[2];
|
|
426
|
+
this[f] || (this[f] = {}), this[f][_] || (this[f][_] = {}), this[f][_][N] = () => {
|
|
405
427
|
};
|
|
406
|
-
}),
|
|
428
|
+
}), L(
|
|
407
429
|
this.ui.callbacks,
|
|
408
430
|
"onUseFullPage",
|
|
409
431
|
this._onUseFullPage
|
|
410
|
-
),
|
|
432
|
+
), L(
|
|
411
433
|
this.ui.callbacks,
|
|
412
434
|
"onBackToWebsite",
|
|
413
435
|
this._onBackToWebsite
|
|
@@ -416,16 +438,16 @@ class K {
|
|
|
416
438
|
0
|
|
417
439
|
), Promise.resolve({ result: null });
|
|
418
440
|
}
|
|
419
|
-
const o = e.split(p),
|
|
420
|
-
if (
|
|
421
|
-
const
|
|
441
|
+
const o = e.split(p), i = o[0], d = o[1], n = o.length === 3 ? o[2] : null;
|
|
442
|
+
if (n && this[i][d][n]) {
|
|
443
|
+
const a = this[i][d][n](
|
|
422
444
|
...s
|
|
423
445
|
);
|
|
424
|
-
return
|
|
446
|
+
return a instanceof Promise ? a.then((g) => ({ result: g })) : a !== void 0 ? Promise.resolve({ result: a }) : Promise.resolve({ result: null });
|
|
425
447
|
}
|
|
426
448
|
return Promise.reject('Message "' + e + '" is unkown');
|
|
427
449
|
}
|
|
428
450
|
}
|
|
429
451
|
export {
|
|
430
|
-
|
|
452
|
+
Q as default
|
|
431
453
|
};
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
var R=Object.defineProperty,
|
|
2
|
-
.${
|
|
3
|
-
.${
|
|
4
|
-
.${
|
|
5
|
-
.${
|
|
6
|
-
.${
|
|
7
|
-
.${
|
|
8
|
-
`,document.head.appendChild(
|
|
1
|
+
var R=Object.defineProperty,S=(s,e,t)=>e in s?R(s,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):s[e]=t,u=(s,e,t)=>S(s,typeof e!="symbol"?e+"":e,t);class A{constructor(e,t,r,i){u(this,"_side"),u(this,"_incomingMessageBus"),u(this,"_outgoingMessageBus",null),u(this,"_execMessage",null),this._side=e,this._incomingMessageBus=t,this._outgoingMessageBus=r,this._execMessage=i,this._incomingMessageBus.addEventListener("message",this._handleMessage.bind(this))}setOutgoingMessageBus(e){this._outgoingMessageBus=e}setMessageExecution(e){this._execMessage=e}sendMessage(e,t=[]){return new Promise((r,i)=>{const n=new MessageChannel;n.port1.onmessage=o=>{if(!o||!o.data)return n.port1.close(),n.port2.close(),i(new Error(this._side+" received message but response can not be interpreted"));let a;try{a=JSON.parse(o.data)}catch(l){return n.port1.close(),n.port2.close(),this._prepareError(l),i(l)}a.error?i(a.error):a.result!==void 0?r(a.result):r(void 0),n.port1.close(),n.port2.close()};let c="";try{c=JSON.stringify({message:e,args:t})}catch{return i(new Error(this._side+": can not create command because it is not JSON.stringify able"))}if(!this._outgoingMessageBus)return i(new Error(this._side+": outgoing bus not set yet"));this._outgoingMessageBus.postMessage(c,"*",[n.port2])})}_handleMessage(e){const t=e.ports&&Array.isArray(e.ports)&&e.ports.length>0?e.ports[0]:null;if(e.data&&t)try{const r=JSON.parse(e.data);if(!this._execMessage)return t.postMessage(JSON.stringify({error:this._side+" is not ready to handle messages"}));Array.isArray(r.args)||(r.args=[r.args]);const i=this._execMessage(r,e);if(i===void 0)return;i.then((n={})=>{let c,o;typeof n=="object"&&n!==null&&(c=n.error,o=n.result),c?t.postMessage(JSON.stringify({error:c})):o!==void 0?t.postMessage(JSON.stringify({result:o})):t.postMessage(JSON.stringify({result:n}))},n=>{t.postMessage(JSON.stringify({error:this._prepareError(n)}))})}catch(r){t.postMessage(JSON.stringify({error:this._prepareError(r)}))}}_prepareError(e){if(typeof e=="string"){const t=this._side+": "+e;return console.error(t),t}return e.message=this._side+": "+e.message,console.error(e),e.message}}const p=".",w={REQUEST_BOOT:"requestBoot",SETUP:"setup",WEBSITE_READY:"websiteReady"},P=async(s,e)=>{if(typeof s!="string")throw new Error('Configurator ID is not a string type: "'+typeof s+'"');const t=e.customApiUrl?e.customApiUrl:"https://api.roomle.com/v2",r=e.overrideTenant||9,i=t+"/configurators/"+s,n="roomle_portal_v2",c="03-"+window.btoa(new Date().toISOString()+";anonymous;"+n),o=()=>{const m={apiKey:n,currentTenant:r,locale:"en",language:"en",device:1,token:c,platform:"web"};return new Headers(m)},a=new Request(i,{method:"GET",headers:o(),mode:"cors",cache:"default"}),l=await fetch(a),{configurator:g}=await l.json();return g},F=()=>{try{return window.self!==window.top}catch{return!0}},U=["127.0.0.1","localhost","0.0.0.0"],B=()=>{const s=F();let e=window.location.href;if(s){if(!document.referrer)return null;e=document.referrer}const{hostname:t}=new URL(e);return t},H=s=>!!(U.includes(s)||s.endsWith("roomle.com")||s.endsWith("gitlab.io")||s.endsWith("gitlab.com")),E=["language","browserLanguage","userLanguage","systemLanguage"],k=(s=null)=>{const e=window.navigator;if(s)return s.substr(0,2);if(Array.isArray(e.languages)&&e.languages.length>0)return e.languages[0].substr(0,2);for(let t=0,r=E.length;t<r;t++){const i=e[E[t]];if(i)return i.substr(0,2)}return"en"},x=(s,e)=>{const t=JSON.parse(JSON.stringify(s));return y(t,e)},y=(s,e)=>{for(const t in e)try{e[t].constructor===Object?s[t]=y(s[t],e[t]):s[t]=e[t]}catch{s[t]=e[t]}return s};var W={BASE_URL:"/",DEV:!1,MODE:"production",PROD:!0,SSR:!1};const C={mobileLandscape:!0,floorMaterialRootTag:"materials_root",buttons:{renderimage:!0,requestproduct:!0,requestplan:!0,load_product:!0,partlist_print:!0},helpcenter:{roomdesigner:!0,configurator:!1,disable:!1},firstPersonView:!0,saveToIdb:!0,featureFlags:{mocAr:!0}},J="(idle)",$=s=>(b(s),s!=null&&s.customApiUrl&&(s.customApiUrl=decodeURIComponent(s.customApiUrl)),s.shareUrl&&(s.deeplink=s.shareUrl.replace(j,G)),s),b=s=>{if(!s)return;const e=Object.keys(s);for(const t of e){const r=s[t];if(!Array.isArray(r)&&typeof r=="object"&&r!==null&&b(r),Array.isArray(r))for(const i of r)b(i);(r==="true"||r==="false")&&(s[t]=r==="true")}},V=(s,e)=>{e.configuratorId=s.id;const t=s.settings||{};return!e.overrideTenant&&s.tenant&&(e.overrideTenant=s.tenant),x(t,e)},z=()=>{const s={...C};s.locale||(s.locale=k()),s.id===J&&delete s.id;const e=B();return e&&H(e)&&(s.configuratorId="demoConfigurator"),s.customApiUrl=W.VITE_RAPI_URL,s.emails=!1,s},j="<CONF_ID>",G="#CONFIGURATIONID#",v=()=>/(android)/i.test(navigator.userAgent),T=(s,e,t)=>{let r=null;Object.defineProperty(s,e,{get(){return r||t},set(i){i!=null&&i.mute?r=i.value:(console.warn("You override Roomle defined behaviour. To disalbe this warning pass in an object with the following properties"),console.warn("{ mute: true, value: () => void }"),r=i)}})},L=()=>window.innerHeight*.01+"px",M=s=>{s&&setTimeout(()=>s.style.setProperty(I,L()),0)},N="rml-styles",q=450,I="--rml-full-height",h={CONTAINER:"rml-container",FILL:"rml-fill",POSITION:"rml-pos",TRANSITION:"rml-transition",ANDROID_HEIGHT:"rml-android-height",OVERFLOW_HIDDEN:"rml-overflow-hidden"},O=new Map;class Y{constructor(e,t,r,i,n){if(u(this,"ui",{callbacks:null}),u(this,"extended",{callbacks:null}),u(this,"analytics",{callbacks:{}}),u(this,"global",{callbacks:{}}),u(this,"plugins",{}),u(this,"_waitForIframe"),u(this,"_container"),u(this,"_messageHandler"),u(this,"_configuratorSettings"),u(this,"_initData",{}),u(this,"_iframe"),u(this,"pluginsLoaded",[]),!e||typeof e.id!="string")throw new Error("Please provide a correct configuratorId, you get the correct ID from your Roomle Contact Person");if(O.has(t))throw new Error("There is already an instance on this DOM element");if(!document.getElementById(N)){const o=r.zIndex||9999999,a=document.createElement("style");a.type="text/css",a.id=N;const l="transition:all ease-in-out "+q+"ms;",g=["-webkit-","-o-"].reduce((f,d)=>f+=d+l,"")+l,m=L();a.innerHTML=`
|
|
2
|
+
.${h.CONTAINER}{${I}:${m};}
|
|
3
|
+
.${h.POSITION}{position:fixed;top:0;left:0;z-index:${o};opacity:0}
|
|
4
|
+
.${h.TRANSITION}{${g}}
|
|
5
|
+
.${h.FILL}{width:100%;height:100%;opacity:1}
|
|
6
|
+
.${h.ANDROID_HEIGHT}{height:calc(var(${I},1vh)*100)}
|
|
7
|
+
.${h.OVERFLOW_HIDDEN}{overflow:hidden}
|
|
8
|
+
`,document.head.appendChild(a)}this._onResize=this._onResize.bind(this),v()&&window.addEventListener("resize",this._onResize),this._container=t,this._initData=r,this._configuratorSettings=e;const c=this._createIframe();this._onUseFullPage=this._onUseFullPage.bind(this),this._executeMessage=this._executeMessage.bind(this),this._onBackToWebsite=this._onBackToWebsite.bind(this),this._messageHandler=new A("website",window,null,this._executeMessage),this._waitForIframe=n,this._container.appendChild(c),this._iframe=c,i.includes("dragIn")&&this.pluginsLoaded.push(new Promise((o,a)=>{try{import("./drag-in-C2fEQF9W.mjs").then(({DragIn:l})=>{const g=new l(this._iframe);g.setInstance(this.ui),o(),this.plugins.dragIn=g})}catch(l){a(l)}})),O.set(t,!0)}static createPlanner(e,t,r,i=[]){return this._create(e,t,r,i)}static createConfigurator(e,t,r,i=[]){return this._create(e,t,r,i)}static create(e,t,r,i){return this._create(e,t,r,i)}static createViewer(e,t,r,i=[]){return this._create(e,t,r,i)}static async _create(e,t,r,i){return new Promise(async(n,c)=>{try{const o=y(z(),$(r));o.featureFlags||(o.featureFlags={}),typeof o.featureFlags.realPartList!="boolean"&&(o.featureFlags.realPartList=!0),typeof o.featureFlags.globalCallbacks!="boolean"&&(o.featureFlags.globalCallbacks=!0),typeof o.featureFlags.mocAr!="boolean"&&(o.featureFlags.mocAr=!1);const a=await P(e,o);r=V(a,o);const l=new this(a,t,r,i,n);return await Promise.allSettled(l.pluginsLoaded),l}catch(o){return c(o)}})}teardown(){this._container&&O.delete(this._container);const e=this._container.querySelector("iframe");e&&this._container.removeChild(e),window.removeEventListener("resize",this._onResize)}_createIframe(){var e;const t=document.createElement("iframe");let r=((e=this._configuratorSettings)==null?void 0:e.url)||"https://www.roomle.com/t/cp/";return this._initData.useLocalRoomle&&(r=location.href.replace("embedding.html","")),location.href.includes("roomle.gitlab.io")&&(r=location.href.replace("embedding.html","index.html")),this._initData.overrideServerUrl&&(r=this._initData.overrideServerUrl),t.src=r,t.classList.add(h.CONTAINER),t.classList.add(h.FILL),t}_onResize(){M(this._iframe)}_onUseFullPage(){this._iframe.classList.add(h.POSITION),document.documentElement.classList.add(h.OVERFLOW_HIDDEN),window.document.body.classList.add(h.OVERFLOW_HIDDEN),v()&&(M(this._iframe),this._iframe.classList.add(h.ANDROID_HEIGHT))}_onBackToWebsite(){this._iframe.classList.remove(h.POSITION),this._iframe.classList.remove(h.ANDROID_HEIGHT),document.documentElement.classList.remove(h.OVERFLOW_HIDDEN),window.document.body.classList.remove(h.OVERFLOW_HIDDEN)}_executeMessage({message:e,args:t},r){var i;if(!r.source||r.source!==((i=this._iframe)==null?void 0:i.contentWindow))return;if(e===w.REQUEST_BOOT)return this._messageHandler.setOutgoingMessageBus(r.source),Promise.resolve({result:this._initData});if(e===w.SETUP){const{methods:l,callbacks:g}=t[0];return l.forEach(m=>{const f=m.split(p),d=f[0],_=f[1];this[d]||(this[d]={}),this[d][_]=function(){return this._messageHandler.sendMessage(m,[...arguments])}.bind(this)}),g.forEach(m=>{const f=m.split(p),d=f[0],_=f[1],D=f[2];this[d]||(this[d]={}),this[d][_]||(this[d][_]={}),this[d][_][D]=()=>{}}),T(this.ui.callbacks,"onUseFullPage",this._onUseFullPage),T(this.ui.callbacks,"onBackToWebsite",this._onBackToWebsite),this._waitForIframe(this),setTimeout(()=>this._messageHandler.sendMessage(w.WEBSITE_READY),0),Promise.resolve({result:null})}const n=e.split(p),c=n[0],o=n[1],a=n.length===3?n[2]:null;if(a&&this[c][o][a]){const l=this[c][o][a](...t);return l instanceof Promise?l.then(g=>({result:g})):l!==void 0?Promise.resolve({result:l}):Promise.resolve({result:null})}return Promise.reject('Message "'+e+'" is unkown')}}export{Y as default};
|
|
@@ -1,8 +1,14 @@
|
|
|
1
|
-
(function(
|
|
2
|
-
.${
|
|
3
|
-
.${
|
|
4
|
-
.${
|
|
5
|
-
.${
|
|
6
|
-
.${
|
|
7
|
-
.${
|
|
8
|
-
`,document.head.appendChild(
|
|
1
|
+
(function(m,p){typeof exports=="object"&&typeof module<"u"?module.exports=p():typeof define=="function"&&define.amd?define(p):(m=typeof globalThis<"u"?globalThis:m||self,m["roomle-embedding-lib"]=m["roomle-embedding-lib"]||{},m["roomle-embedding-lib"].umd=m["roomle-embedding-lib"].umd||{},m["roomle-embedding-lib"].umd.js=p())})(this,function(){"use strict";var pe=Object.defineProperty;var ye=(m,p,T)=>p in m?pe(m,p,{enumerable:!0,configurable:!0,writable:!0,value:T}):m[p]=T;var c=(m,p,T)=>ye(m,typeof p!="symbol"?p+"":p,T);class m{constructor(e,t,s,n){c(this,"_side");c(this,"_incomingMessageBus");c(this,"_outgoingMessageBus",null);c(this,"_execMessage",null);this._side=e,this._incomingMessageBus=t,this._outgoingMessageBus=s,this._execMessage=n,this._incomingMessageBus.addEventListener("message",this._handleMessage.bind(this))}setOutgoingMessageBus(e){this._outgoingMessageBus=e}setMessageExecution(e){this._execMessage=e}sendMessage(e,t=[]){return new Promise((s,n)=>{const o=new MessageChannel;o.port1.onmessage=i=>{if(!i||!i.data)return o.port1.close(),o.port2.close(),n(new Error(this._side+" received message but response can not be interpreted"));let u;try{u=JSON.parse(i.data)}catch(l){return o.port1.close(),o.port2.close(),this._prepareError(l),n(l)}u.error?n(u.error):u.result!==void 0?s(u.result):s(void 0),o.port1.close(),o.port2.close()};let a="";try{a=JSON.stringify({message:e,args:t})}catch{return n(new Error(this._side+": can not create command because it is not JSON.stringify able"))}if(!this._outgoingMessageBus)return n(new Error(this._side+": outgoing bus not set yet"));this._outgoingMessageBus.postMessage(a,"*",[o.port2])})}_handleMessage(e){const t=e.ports&&Array.isArray(e.ports)&&e.ports.length>0?e.ports[0]:null;if(e.data&&t)try{const s=JSON.parse(e.data);if(!this._execMessage)return t.postMessage(JSON.stringify({error:this._side+" is not ready to handle messages"}));Array.isArray(s.args)||(s.args=[s.args]);const n=this._execMessage(s,e);if(n===void 0)return;n.then((o={})=>{let a,i;typeof o=="object"&&o!==null&&(a=o.error,i=o.result),a?t.postMessage(JSON.stringify({error:a})):i!==void 0?t.postMessage(JSON.stringify({result:i})):t.postMessage(JSON.stringify({result:o}))},o=>{t.postMessage(JSON.stringify({error:this._prepareError(o)}))})}catch(s){t.postMessage(JSON.stringify({error:this._prepareError(s)}))}}_prepareError(e){if(typeof e=="string"){const t=this._side+": "+e;return console.error(t),t}return e.message=this._side+": "+e.message,console.error(e),e.message}}const p=".",T={REQUEST_BOOT:"requestBoot",SETUP:"setup",WEBSITE_READY:"websiteReady"},z=async(r,e)=>{if(typeof r!="string")throw new Error('Configurator ID is not a string type: "'+typeof r+'"');const t=e.customApiUrl?e.customApiUrl:"https://api.roomle.com/v2",s=e.overrideTenant||9,n=t+"/configurators/"+r,o="roomle_portal_v2",a="03-"+window.btoa(new Date().toISOString()+";anonymous;"+o),i=()=>{const _={apiKey:o,currentTenant:s,locale:"en",language:"en",device:1,token:a,platform:"web"};return new Headers(_)},u=new Request(n,{method:"GET",headers:i(),mode:"cors",cache:"default"}),l=await fetch(u),{configurator:f}=await l.json();return f},V=()=>{try{return window.self!==window.top}catch{return!0}},J=["127.0.0.1","localhost","0.0.0.0"],q=()=>{const r=V();let e=window.location.href;if(r){if(!document.referrer)return null;e=document.referrer}const{hostname:t}=new URL(e);return t},K=r=>!!(J.includes(r)||r.endsWith("roomle.com")||r.endsWith("gitlab.io")||r.endsWith("gitlab.com")),P=["language","browserLanguage","userLanguage","systemLanguage"],j=(r=null)=>{const e=window.navigator;if(r)return r.substr(0,2);if(Array.isArray(e.languages)&&e.languages.length>0)return e.languages[0].substr(0,2);for(let t=0,s=P.length;t<s;t++){const n=e[P[t]];if(n)return n.substr(0,2)}return"en"},Q=(r,e)=>{const t=JSON.parse(JSON.stringify(r));return D(t,e)},D=(r,e)=>{for(const t in e)try{e[t].constructor===Object?r[t]=D(r[t],e[t]):r[t]=e[t]}catch{r[t]=e[t]}return r};var Z={BASE_URL:"/",DEV:!1,MODE:"production",PROD:!0,SSR:!1};const ee={mobileLandscape:!0,floorMaterialRootTag:"materials_root",buttons:{renderimage:!0,requestproduct:!0,requestplan:!0,load_product:!0,partlist_print:!0},helpcenter:{roomdesigner:!0,configurator:!1,disable:!1},firstPersonView:!0,saveToIdb:!0,featureFlags:{mocAr:!0}},te="(idle)",se=r=>(A(r),r!=null&&r.customApiUrl&&(r.customApiUrl=decodeURIComponent(r.customApiUrl)),r.shareUrl&&(r.deeplink=r.shareUrl.replace(oe,ie)),r),A=r=>{if(!r)return;const e=Object.keys(r);for(const t of e){const s=r[t];if(!Array.isArray(s)&&typeof s=="object"&&s!==null&&A(s),Array.isArray(s))for(const n of s)A(n);(s==="true"||s==="false")&&(r[t]=s==="true")}},re=(r,e)=>{e.configuratorId=r.id;const t=r.settings||{};return!e.overrideTenant&&r.tenant&&(e.overrideTenant=r.tenant),Q(t,e)},ne=()=>{const r={...ee};r.locale||(r.locale=j()),r.id===te&&delete r.id;const e=q();return e&&K(e)&&(r.configuratorId="demoConfigurator"),r.customApiUrl=Z.VITE_RAPI_URL,r.emails=!1,r},oe="<CONF_ID>",ie="#CONFIGURATIONID#",F=()=>/(android)/i.test(navigator.userAgent),H=(r,e,t)=>{let s=null;Object.defineProperty(r,e,{get(){return s||t},set(n){n!=null&&n.mute?s=n.value:(console.warn("You override Roomle defined behaviour. To disalbe this warning pass in an object with the following properties"),console.warn("{ mute: true, value: () => void }"),s=n)}})},U=()=>window.innerHeight*.01+"px",Y=r=>{r&&setTimeout(()=>r.style.setProperty(O,U()),0)},k="rml-styles",ae=450,O="--rml-full-height",g={CONTAINER:"rml-container",FILL:"rml-fill",POSITION:"rml-pos",TRANSITION:"rml-transition",ANDROID_HEIGHT:"rml-android-height",OVERFLOW_HIDDEN:"rml-overflow-hidden"},b=new Map;class ce{constructor(e,t,s,n,o){c(this,"ui",{callbacks:null});c(this,"extended",{callbacks:null});c(this,"analytics",{callbacks:{}});c(this,"global",{callbacks:{}});c(this,"plugins",{});c(this,"_waitForIframe");c(this,"_container");c(this,"_messageHandler");c(this,"_configuratorSettings");c(this,"_initData",{});c(this,"_iframe");c(this,"pluginsLoaded",[]);if(!e||typeof e.id!="string")throw new Error("Please provide a correct configuratorId, you get the correct ID from your Roomle Contact Person");if(b.has(t))throw new Error("There is already an instance on this DOM element");if(!!!document.getElementById(k)){const u=s.zIndex||9999999,l=document.createElement("style");l.type="text/css",l.id=k;const f="transition:all ease-in-out "+ae+"ms;",_=["-webkit-","-o-"].reduce((d,y)=>d+=y+f,"")+f,h=U();l.innerHTML=`
|
|
2
|
+
.${g.CONTAINER}{${O}:${h};}
|
|
3
|
+
.${g.POSITION}{position:fixed;top:0;left:0;z-index:${u};opacity:0}
|
|
4
|
+
.${g.TRANSITION}{${_}}
|
|
5
|
+
.${g.FILL}{width:100%;height:100%;opacity:1}
|
|
6
|
+
.${g.ANDROID_HEIGHT}{height:calc(var(${O},1vh)*100)}
|
|
7
|
+
.${g.OVERFLOW_HIDDEN}{overflow:hidden}
|
|
8
|
+
`,document.head.appendChild(l)}this._onResize=this._onResize.bind(this),F()&&window.addEventListener("resize",this._onResize),this._container=t,this._initData=s,this._configuratorSettings=e;const i=this._createIframe();this._onUseFullPage=this._onUseFullPage.bind(this),this._executeMessage=this._executeMessage.bind(this),this._onBackToWebsite=this._onBackToWebsite.bind(this),this._messageHandler=new m("website",window,null,this._executeMessage),this._waitForIframe=o,this._container.appendChild(i),this._iframe=i,n.includes("dragIn")&&this.pluginsLoaded.push(new Promise((u,l)=>{try{Promise.resolve().then(()=>me).then(({DragIn:f})=>{const _=new f(this._iframe);_.setInstance(this.ui),u(),this.plugins.dragIn=_})}catch(f){l(f)}})),b.set(t,!0)}static createPlanner(e,t,s,n=[]){return this._create(e,t,s,n)}static createConfigurator(e,t,s,n=[]){return this._create(e,t,s,n)}static create(e,t,s,n){return this._create(e,t,s,n)}static createViewer(e,t,s,n=[]){return this._create(e,t,s,n)}static async _create(e,t,s,n){return new Promise(async(o,a)=>{try{const i=D(ne(),se(s));i.featureFlags||(i.featureFlags={}),typeof i.featureFlags.realPartList!="boolean"&&(i.featureFlags.realPartList=!0),typeof i.featureFlags.globalCallbacks!="boolean"&&(i.featureFlags.globalCallbacks=!0),typeof i.featureFlags.mocAr!="boolean"&&(i.featureFlags.mocAr=!1);const u=await z(e,i);s=re(u,i);const l=new this(u,t,s,n,o);return await Promise.allSettled(l.pluginsLoaded),l}catch(i){return a(i)}})}teardown(){this._container&&b.delete(this._container);const e=this._container.querySelector("iframe");e&&this._container.removeChild(e),window.removeEventListener("resize",this._onResize)}_createIframe(){var s;const e=document.createElement("iframe");let t=((s=this._configuratorSettings)==null?void 0:s.url)||"https://www.roomle.com/t/cp/";return this._initData.useLocalRoomle&&(t=location.href.replace("embedding.html","")),location.href.includes("roomle.gitlab.io")&&(t=location.href.replace("embedding.html","index.html")),this._initData.overrideServerUrl&&(t=this._initData.overrideServerUrl),e.src=t,e.classList.add(g.CONTAINER),e.classList.add(g.FILL),e}_onResize(){Y(this._iframe)}_onUseFullPage(){this._iframe.classList.add(g.POSITION),document.documentElement.classList.add(g.OVERFLOW_HIDDEN),window.document.body.classList.add(g.OVERFLOW_HIDDEN),F()&&(Y(this._iframe),this._iframe.classList.add(g.ANDROID_HEIGHT))}_onBackToWebsite(){this._iframe.classList.remove(g.POSITION),this._iframe.classList.remove(g.ANDROID_HEIGHT),document.documentElement.classList.remove(g.OVERFLOW_HIDDEN),window.document.body.classList.remove(g.OVERFLOW_HIDDEN)}_executeMessage({message:e,args:t},s){var u;if(!s.source||s.source!==((u=this._iframe)==null?void 0:u.contentWindow))return;if(e===T.REQUEST_BOOT)return this._messageHandler.setOutgoingMessageBus(s.source),Promise.resolve({result:this._initData});if(e===T.SETUP){const{methods:l,callbacks:f}=t[0];return l.forEach(_=>{const h=_.split(p),d=h[0],y=h[1];this[d]||(this[d]={}),this[d][y]=(function(){return this._messageHandler.sendMessage(_,[...arguments])}).bind(this)}),f.forEach(_=>{const h=_.split(p),d=h[0],y=h[1],w=h[2];this[d]||(this[d]={}),this[d][y]||(this[d][y]={}),this[d][y][w]=()=>{}}),H(this.ui.callbacks,"onUseFullPage",this._onUseFullPage),H(this.ui.callbacks,"onBackToWebsite",this._onBackToWebsite),this._waitForIframe(this),setTimeout(()=>this._messageHandler.sendMessage(T.WEBSITE_READY),0),Promise.resolve({result:null})}const n=e.split(p),o=n[0],a=n[1],i=n.length===3?n[2]:null;if(i&&this[o][a][i]){const l=this[o][a][i](...t);return l instanceof Promise?l.then(f=>({result:f})):l!==void 0?Promise.resolve({result:l}):Promise.resolve({result:null})}return Promise.reject('Message "'+e+'" is unkown')}}class le{constructor(e=16){c(this,"_computedStyleCache",new Map);c(this,"_maxLifetime",16);c(this,"_cacheCleanInterval",null);this._maxLifetime=e}get(e){const t=this._computedStyleCache.get(e),s=Date.now();if(t&&s-t.updated<this._maxLifetime)return t.style;const n=getComputedStyle(e);return this._computedStyleCache.set(e,{style:n,updated:s}),this._cacheCleanInterval||(this._cacheCleanInterval=setInterval(()=>this._cleanUpCache,Math.max(this._maxLifetime*1e3,5e3))),n}_cleanUpCache(){const e=Date.now();for(const[t,{updated:s}]of this._computedStyleCache.entries())e-s>=this._maxLifetime&&this._computedStyleCache.delete(t);this._computedStyleCache.size===0&&this._cacheCleanInterval&&(clearInterval(this._cacheCleanInterval),this._cacheCleanInterval=null)}}let L;const I=r=>(L||(L=new le),L.get(r)),B=(r,e,t)=>{const s=parseFloat(r),n=window.devicePixelRatio||1;if(e==="px")return s;if(e==="%"){const a=t===document.documentElement?window.innerWidth:t.offsetWidth;return s/100*a}if(e==="rem"){const a=parseFloat(I(document.documentElement).fontSize);return s*a}if(e==="em"){const a=parseFloat(I(t).fontSize);return s*a}if(e==="vh"||e==="vw"||e==="vmin"||e==="vmax"){const a={vh:window.innerHeight,vw:window.innerWidth,vmin:Math.min(window.innerWidth,window.innerHeight),vmax:Math.max(window.innerWidth,window.innerHeight)};return s/100*a[e]}const o={cm:37.7952755906,mm:3.77952755906,in:96};return e in o?s*o[e]*n:0},$=(r,e,t={x:0,y:0})=>{const s=r.getBoundingClientRect(),o=I(r).transform;let a=0,i=0;if(o!=="none"){const h=/translate\(\s*([-+]?\d*\.?\d+|\d+)(px|%)?,?\s*([-+]?\d*\.?\d+|\d+)?(px|%)?\s*\)/,d=o.match(h);d&&(a=B(d[1],d[2],r),i=B(d[3],d[4],r))}const{clientX:u,clientY:l}=N(e,t),f=u-s.left-a+r.scrollLeft,_=l-s.top-i+r.scrollTop;return{x:f,y:_}},N=(r,e)=>{const{clientX:t,clientY:s}=window.TouchEvent&&r instanceof TouchEvent?ue(r):r,n=t||e.x,o=s||e.y;return{clientX:n,clientY:o}},ue=r=>{if(r.touches.length){let{clientX:t,clientY:s}=r.touches[0];if(r.touches.length>1){const n=r.touches[1],o=n.clientX,a=n.clientY;t=(t+o)/2,s=(s+a)/2}return{clientX:t,clientY:s}}const e=r.changedTouches[0];return{clientX:e.clientX,clientY:e.clientY}},he=500,de=10;class fe{constructor(e,{onTouchDragStart:t},s={}){c(this,"_touchDragTimeOut");c(this,"_onTouchDragStart");c(this,"_payload",null);c(this,"_delay");c(this,"_firstTouch",null);c(this,"_lastTouch",null);this._payload=e,this._onTouchDragStart=t,this._delay=s.delay||he}onTouchStart(e){var t;!e||!((t=e==null?void 0:e.touches)!=null&&t.length)||this._touchDragTimeOut||(this._firstTouch=e.touches[e.touches.length-1],this._touchDragTimeOut=setTimeout(()=>{this._clearTimeout(),this._lastTouch||(this._lastTouch=e.touches[0]),this._checkXDistance(e)()},this._delay))}onTouchEnd(){this._resetTouches()}onTouchMove(e){var t;!e||!((t=e==null?void 0:e.touches)!=null&&t.length)||(this._lastTouch=e.touches[0])}_clearTimeout(){this._touchDragTimeOut&&(clearTimeout(this._touchDragTimeOut),this._touchDragTimeOut=null)}_resetTouches(){this._clearTimeout(),this._lastTouch=null,this._firstTouch=null,this._payload=null}_checkXDistance(e){return()=>{if(!this._firstTouch||!this._lastTouch)return;let t=!1;t=Math.abs(this._firstTouch.clientX-this._lastTouch.clientX)<de,t&&(this._onTouchDragStart(this._payload,e),this._resetTouches())}}}const G="rml-drag-in-styles",_e="rml-drag-in-drag-element",E="rml-drag-in-overlay",S="rml-drag-in-drag-ghost",R="rml-drag-in-fade-in",X="rml-drag-in-fade-out",x={DISPLAY_NONE:"rml-display-none"},W=.5,M="250ms",v="forwards",C=r=>r?!0:(console.warn("No instance set, cancel drag-in"),!1);class ge{constructor(e){c(this,"_iframe");c(this,"_currentDrag",{});c(this,"_currentTouch",null);c(this,"_firefoxDragPosition",{x:0,y:0});c(this,"_instance",null);c(this,"options",{});c(this,"_firefoxFallback",e=>{if(!this._currentDrag.event)return;const t=e||window.event;this._firefoxDragPosition.x=t.pageX||0,this._firefoxDragPosition.y=t.pageY||0});if(this._iframe=e,!!!document.getElementById(G)){const o=document.createElement("style");o.type="text/css",o.id=G,o.innerHTML=`
|
|
9
|
+
.${x.DISPLAY_NONE}{display:none}
|
|
10
|
+
.${E}{position:absolute;top:0;left:0;width:100%;height:100%;z-index:999;}
|
|
11
|
+
.${S}{position:absolute;top:0;left:0;width:1px;height:1px;z-index:999;pointer-events:none;background-color:transparent;}
|
|
12
|
+
@keyframes ${R} {from{opacity: 0;}to {opacity: ${W};}}
|
|
13
|
+
@keyframes ${X} {from{opacity: ${W};}to {opacity: 0;}}
|
|
14
|
+
`,document.head.appendChild(o)}const s=this._iframe.parentNode;let n=s.querySelector("."+S);n||(n=document.createElement("div"),n.classList.add(S),n.innerText=" ",s.appendChild(n)),this._firefoxFallback=this._firefoxFallback.bind(this),document.addEventListener("dragover",this._firefoxFallback)}setInstance(e){this._instance=e}dragStart(e,t){const s=this._iframe.parentNode;if(I(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._iframe.style.pointerEvents="none";let o=s.querySelector("."+E);if(o||(o=document.createElement("div"),o.classList.add(E),s.appendChild(o)),o.classList.remove(x.DISPLAY_NONE),t instanceof DragEvent){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 _=s.querySelector("."+S);this._currentDrag.event=t;const h=t.target.cloneNode();h.style.position="fixed",h.style.pointerEvents="none",h.style.opacity="0",h.style.animation=`${R} ${M} ${v}`,h.id=_e,h.style.zIndex="9999",document.body.appendChild(h),this._currentDrag.element=h;const d=t.target.getBoundingClientRect();this._currentDrag.offset||(this._currentDrag.offset={x:0,y:0});const{clientX:y,clientY:w}=N(t,this._firefoxDragPosition);this._currentDrag.offset.x=y-d.left,this._currentDrag.offset.y=w-d.top,h.style.top=w+"px",h.style.left=y+"px",t.dataTransfer&&t.dataTransfer.setDragImage&&t.dataTransfer.setDragImage(_,0,0)}const{x:a,y:i}=$(s,this._currentDrag.event||t,this._firefoxDragPosition),u=Math.max(1,a),l=Math.max(1,i);C(this._instance)&&this._instance.dragInObject(e,u,l)}dragUpdate(e){var i,u;const t=this._iframe.parentNode,{x:s,y:n}=$(t,e,this._firefoxDragPosition);if(s===0&&n===0)return;const o=Math.max(1,s),a=Math.max(1,n);if(this._currentDrag.element){const{clientX:l,clientY:f}=N(e,this._firefoxDragPosition),_=((i=this._currentDrag.offset)==null?void 0:i.x)||0,h=((u=this._currentDrag.offset)==null?void 0:u.y)||0;this._currentDrag.element.style.left=`${l-_}px`,this._currentDrag.element.style.top=`${f-h}px`;const d=(this.options.dragInOverlapX||0)+1,y=(this.options.dragInOverlapY||0)+1;o>d&&a>y?this._currentDrag.element.style.animation=`${X} ${M} ${v}`:this._currentDrag.element.style.animation=`${R} ${M} ${v}`}o===1&&a===1||C(this._instance)&&this._instance.updateDrag(o,a)}dragEnd(){this._iframe.style.pointerEvents="all";const e=this._iframe.parentNode;C(this._instance)&&this._instance.dragInObjectEnd(),this._currentDrag.element&&document.body.removeChild(this._currentDrag.element),this._currentDrag={},this._firefoxDragPosition={x:0,y:0};const t=e.querySelector("."+E);t&&t.classList.add(x.DISPLAY_NONE)}touchStart(e,t){t.preventDefault();const s=(n,o)=>{this.dragStart(e,o)};this._currentTouch=new fe(void 0,{onTouchDragStart:s}),this._currentTouch.onTouchStart(t)}touchMove(e){this._currentTouch&&this._currentTouch.onTouchMove(e),this._currentDrag.event&&this.dragUpdate(e)}touchEnd(){this._currentTouch&&this._currentTouch.onTouchEnd(),this._currentTouch=null,this.dragEnd()}dispose(){document.removeEventListener("dragover",this._firefoxFallback)}}const me=Object.freeze(Object.defineProperty({__proto__:null,DragIn:ge},Symbol.toStringTag,{value:"Module"}));return ce});
|
|
@@ -1,8 +1,14 @@
|
|
|
1
|
-
(function(
|
|
2
|
-
.${
|
|
3
|
-
.${
|
|
4
|
-
.${
|
|
5
|
-
.${
|
|
6
|
-
.${
|
|
7
|
-
.${
|
|
8
|
-
`,document.head.appendChild(
|
|
1
|
+
(function(f,y){typeof exports=="object"&&typeof module<"u"?module.exports=y():typeof define=="function"&&define.amd?define(y):(f=typeof globalThis<"u"?globalThis:f||self,f["roomle-embedding-lib"]=f["roomle-embedding-lib"]||{},f["roomle-embedding-lib"].umd=f["roomle-embedding-lib"].umd||{},f["roomle-embedding-lib"].umd.min=f["roomle-embedding-lib"].umd.min||{},f["roomle-embedding-lib"].umd.min.js=y())})(this,function(){"use strict";var f=Object.defineProperty,y=(i,e,t)=>e in i?f(i,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):i[e]=t,l=(i,e,t)=>y(i,typeof e!="symbol"?e+"":e,t);class j{constructor(e,t,s,n){l(this,"_side"),l(this,"_incomingMessageBus"),l(this,"_outgoingMessageBus",null),l(this,"_execMessage",null),this._side=e,this._incomingMessageBus=t,this._outgoingMessageBus=s,this._execMessage=n,this._incomingMessageBus.addEventListener("message",this._handleMessage.bind(this))}setOutgoingMessageBus(e){this._outgoingMessageBus=e}setMessageExecution(e){this._execMessage=e}sendMessage(e,t=[]){return new Promise((s,n)=>{const r=new MessageChannel;r.port1.onmessage=o=>{if(!o||!o.data)return r.port1.close(),r.port2.close(),n(new Error(this._side+" received message but response can not be interpreted"));let c;try{c=JSON.parse(o.data)}catch(h){return r.port1.close(),r.port2.close(),this._prepareError(h),n(h)}c.error?n(c.error):c.result!==void 0?s(c.result):s(void 0),r.port1.close(),r.port2.close()};let a="";try{a=JSON.stringify({message:e,args:t})}catch{return n(new Error(this._side+": can not create command because it is not JSON.stringify able"))}if(!this._outgoingMessageBus)return n(new Error(this._side+": outgoing bus not set yet"));this._outgoingMessageBus.postMessage(a,"*",[r.port2])})}_handleMessage(e){const t=e.ports&&Array.isArray(e.ports)&&e.ports.length>0?e.ports[0]:null;if(e.data&&t)try{const s=JSON.parse(e.data);if(!this._execMessage)return t.postMessage(JSON.stringify({error:this._side+" is not ready to handle messages"}));Array.isArray(s.args)||(s.args=[s.args]);const n=this._execMessage(s,e);if(n===void 0)return;n.then((r={})=>{let a,o;typeof r=="object"&&r!==null&&(a=r.error,o=r.result),a?t.postMessage(JSON.stringify({error:a})):o!==void 0?t.postMessage(JSON.stringify({result:o})):t.postMessage(JSON.stringify({result:r}))},r=>{t.postMessage(JSON.stringify({error:this._prepareError(r)}))})}catch(s){t.postMessage(JSON.stringify({error:this._prepareError(s)}))}}_prepareError(e){if(typeof e=="string"){const t=this._side+": "+e;return console.error(t),t}return e.message=this._side+": "+e.message,console.error(e),e.message}}const T=".",D={REQUEST_BOOT:"requestBoot",SETUP:"setup",WEBSITE_READY:"websiteReady"},J=async(i,e)=>{if(typeof i!="string")throw new Error('Configurator ID is not a string type: "'+typeof i+'"');const t=e.customApiUrl?e.customApiUrl:"https://api.roomle.com/v2",s=e.overrideTenant||9,n=t+"/configurators/"+i,r="roomle_portal_v2",a="03-"+window.btoa(new Date().toISOString()+";anonymous;"+r),o=()=>{const _={apiKey:r,currentTenant:s,locale:"en",language:"en",device:1,token:a,platform:"web"};return new Headers(_)},c=new Request(n,{method:"GET",headers:o(),mode:"cors",cache:"default"}),h=await fetch(c),{configurator:u}=await h.json();return u},V=()=>{try{return window.self!==window.top}catch{return!0}},q=["127.0.0.1","localhost","0.0.0.0"],G=()=>{const i=V();let e=window.location.href;if(i){if(!document.referrer)return null;e=document.referrer}const{hostname:t}=new URL(e);return t},Q=i=>!!(q.includes(i)||i.endsWith("roomle.com")||i.endsWith("gitlab.io")||i.endsWith("gitlab.com")),C=["language","browserLanguage","userLanguage","systemLanguage"],K=(i=null)=>{const e=window.navigator;if(i)return i.substr(0,2);if(Array.isArray(e.languages)&&e.languages.length>0)return e.languages[0].substr(0,2);for(let t=0,s=C.length;t<s;t++){const n=e[C[t]];if(n)return n.substr(0,2)}return"en"},Z=(i,e)=>{const t=JSON.parse(JSON.stringify(i));return I(t,e)},I=(i,e)=>{for(const t in e)try{e[t].constructor===Object?i[t]=I(i[t],e[t]):i[t]=e[t]}catch{i[t]=e[t]}return i};var ee={BASE_URL:"/",DEV:!1,MODE:"production",PROD:!0,SSR:!1};const te={mobileLandscape:!0,floorMaterialRootTag:"materials_root",buttons:{renderimage:!0,requestproduct:!0,requestplan:!0,load_product:!0,partlist_print:!0},helpcenter:{roomdesigner:!0,configurator:!1,disable:!1},firstPersonView:!0,saveToIdb:!0,featureFlags:{mocAr:!0}},se="(idle)",ie=i=>(E(i),i!=null&&i.customApiUrl&&(i.customApiUrl=decodeURIComponent(i.customApiUrl)),i.shareUrl&&(i.deeplink=i.shareUrl.replace(oe,ae)),i),E=i=>{if(!i)return;const e=Object.keys(i);for(const t of e){const s=i[t];if(!Array.isArray(s)&&typeof s=="object"&&s!==null&&E(s),Array.isArray(s))for(const n of s)E(n);(s==="true"||s==="false")&&(i[t]=s==="true")}},ne=(i,e)=>{e.configuratorId=i.id;const t=i.settings||{};return!e.overrideTenant&&i.tenant&&(e.overrideTenant=i.tenant),Z(t,e)},re=()=>{const i={...te};i.locale||(i.locale=K()),i.id===se&&delete i.id;const e=G();return e&&Q(e)&&(i.configuratorId="demoConfigurator"),i.customApiUrl=ee.VITE_RAPI_URL,i.emails=!1,i},oe="<CONF_ID>",ae="#CONFIGURATIONID#",F=()=>/(android)/i.test(navigator.userAgent),k=(i,e,t)=>{let s=null;Object.defineProperty(i,e,{get(){return s||t},set(n){n!=null&&n.mute?s=n.value:(console.warn("You override Roomle defined behaviour. To disalbe this warning pass in an object with the following properties"),console.warn("{ mute: true, value: () => void }"),s=n)}})},$=()=>window.innerHeight*.01+"px",U=i=>{i&&setTimeout(()=>i.style.setProperty(O,$()),0)},H="rml-styles",le=450,O="--rml-full-height",g={CONTAINER:"rml-container",FILL:"rml-fill",POSITION:"rml-pos",TRANSITION:"rml-transition",ANDROID_HEIGHT:"rml-android-height",OVERFLOW_HIDDEN:"rml-overflow-hidden"},x=new Map;class ce{constructor(e,t,s,n,r){if(l(this,"ui",{callbacks:null}),l(this,"extended",{callbacks:null}),l(this,"analytics",{callbacks:{}}),l(this,"global",{callbacks:{}}),l(this,"plugins",{}),l(this,"_waitForIframe"),l(this,"_container"),l(this,"_messageHandler"),l(this,"_configuratorSettings"),l(this,"_initData",{}),l(this,"_iframe"),l(this,"pluginsLoaded",[]),!e||typeof e.id!="string")throw new Error("Please provide a correct configuratorId, you get the correct ID from your Roomle Contact Person");if(x.has(t))throw new Error("There is already an instance on this DOM element");if(!document.getElementById(H)){const o=s.zIndex||9999999,c=document.createElement("style");c.type="text/css",c.id=H;const h="transition:all ease-in-out "+le+"ms;",u=["-webkit-","-o-"].reduce((d,m)=>d+=m+h,"")+h,_=$();c.innerHTML=`
|
|
2
|
+
.${g.CONTAINER}{${O}:${_};}
|
|
3
|
+
.${g.POSITION}{position:fixed;top:0;left:0;z-index:${o};opacity:0}
|
|
4
|
+
.${g.TRANSITION}{${u}}
|
|
5
|
+
.${g.FILL}{width:100%;height:100%;opacity:1}
|
|
6
|
+
.${g.ANDROID_HEIGHT}{height:calc(var(${O},1vh)*100)}
|
|
7
|
+
.${g.OVERFLOW_HIDDEN}{overflow:hidden}
|
|
8
|
+
`,document.head.appendChild(c)}this._onResize=this._onResize.bind(this),F()&&window.addEventListener("resize",this._onResize),this._container=t,this._initData=s,this._configuratorSettings=e;const a=this._createIframe();this._onUseFullPage=this._onUseFullPage.bind(this),this._executeMessage=this._executeMessage.bind(this),this._onBackToWebsite=this._onBackToWebsite.bind(this),this._messageHandler=new j("website",window,null,this._executeMessage),this._waitForIframe=r,this._container.appendChild(a),this._iframe=a,n.includes("dragIn")&&this.pluginsLoaded.push(new Promise((o,c)=>{try{Promise.resolve().then(()=>pe).then(({DragIn:h})=>{const u=new h(this._iframe);u.setInstance(this.ui),o(),this.plugins.dragIn=u})}catch(h){c(h)}})),x.set(t,!0)}static createPlanner(e,t,s,n=[]){return this._create(e,t,s,n)}static createConfigurator(e,t,s,n=[]){return this._create(e,t,s,n)}static create(e,t,s,n){return this._create(e,t,s,n)}static createViewer(e,t,s,n=[]){return this._create(e,t,s,n)}static async _create(e,t,s,n){return new Promise(async(r,a)=>{try{const o=I(re(),ie(s));o.featureFlags||(o.featureFlags={}),typeof o.featureFlags.realPartList!="boolean"&&(o.featureFlags.realPartList=!0),typeof o.featureFlags.globalCallbacks!="boolean"&&(o.featureFlags.globalCallbacks=!0),typeof o.featureFlags.mocAr!="boolean"&&(o.featureFlags.mocAr=!1);const c=await J(e,o);s=ne(c,o);const h=new this(c,t,s,n,r);return await Promise.allSettled(h.pluginsLoaded),h}catch(o){return a(o)}})}teardown(){this._container&&x.delete(this._container);const e=this._container.querySelector("iframe");e&&this._container.removeChild(e),window.removeEventListener("resize",this._onResize)}_createIframe(){var e;const t=document.createElement("iframe");let s=((e=this._configuratorSettings)==null?void 0:e.url)||"https://www.roomle.com/t/cp/";return this._initData.useLocalRoomle&&(s=location.href.replace("embedding.html","")),location.href.includes("roomle.gitlab.io")&&(s=location.href.replace("embedding.html","index.html")),this._initData.overrideServerUrl&&(s=this._initData.overrideServerUrl),t.src=s,t.classList.add(g.CONTAINER),t.classList.add(g.FILL),t}_onResize(){U(this._iframe)}_onUseFullPage(){this._iframe.classList.add(g.POSITION),document.documentElement.classList.add(g.OVERFLOW_HIDDEN),window.document.body.classList.add(g.OVERFLOW_HIDDEN),F()&&(U(this._iframe),this._iframe.classList.add(g.ANDROID_HEIGHT))}_onBackToWebsite(){this._iframe.classList.remove(g.POSITION),this._iframe.classList.remove(g.ANDROID_HEIGHT),document.documentElement.classList.remove(g.OVERFLOW_HIDDEN),window.document.body.classList.remove(g.OVERFLOW_HIDDEN)}_executeMessage({message:e,args:t},s){var n;if(!s.source||s.source!==((n=this._iframe)==null?void 0:n.contentWindow))return;if(e===D.REQUEST_BOOT)return this._messageHandler.setOutgoingMessageBus(s.source),Promise.resolve({result:this._initData});if(e===D.SETUP){const{methods:h,callbacks:u}=t[0];return h.forEach(_=>{const d=_.split(T),m=d[0],p=d[1];this[m]||(this[m]={}),this[m][p]=function(){return this._messageHandler.sendMessage(_,[...arguments])}.bind(this)}),u.forEach(_=>{const d=_.split(T),m=d[0],p=d[1],ye=d[2];this[m]||(this[m]={}),this[m][p]||(this[m][p]={}),this[m][p][ye]=()=>{}}),k(this.ui.callbacks,"onUseFullPage",this._onUseFullPage),k(this.ui.callbacks,"onBackToWebsite",this._onBackToWebsite),this._waitForIframe(this),setTimeout(()=>this._messageHandler.sendMessage(D.WEBSITE_READY),0),Promise.resolve({result:null})}const r=e.split(T),a=r[0],o=r[1],c=r.length===3?r[2]:null;if(c&&this[a][o][c]){const h=this[a][o][c](...t);return h instanceof Promise?h.then(u=>({result:u})):h!==void 0?Promise.resolve({result:h}):Promise.resolve({result:null})}return Promise.reject('Message "'+e+'" is unkown')}}class he{constructor(e=16){l(this,"_computedStyleCache",new Map),l(this,"_maxLifetime",16),l(this,"_cacheCleanInterval",null),this._maxLifetime=e}get(e){const t=this._computedStyleCache.get(e),s=Date.now();if(t&&s-t.updated<this._maxLifetime)return t.style;const n=getComputedStyle(e);return this._computedStyleCache.set(e,{style:n,updated:s}),this._cacheCleanInterval||(this._cacheCleanInterval=setInterval(()=>this._cleanUpCache,Math.max(this._maxLifetime*1e3,5e3))),n}_cleanUpCache(){const e=Date.now();for(const[t,{updated:s}]of this._computedStyleCache.entries())e-s>=this._maxLifetime&&this._computedStyleCache.delete(t);this._computedStyleCache.size===0&&this._cacheCleanInterval&&(clearInterval(this._cacheCleanInterval),this._cacheCleanInterval=null)}}let S;const v=i=>(S||(S=new he),S.get(i)),B=(i,e,t)=>{const s=parseFloat(i),n=window.devicePixelRatio||1;if(e==="px")return s;if(e==="%"){const a=t===document.documentElement?window.innerWidth:t.offsetWidth;return s/100*a}if(e==="rem"){const a=parseFloat(v(document.documentElement).fontSize);return s*a}if(e==="em"){const a=parseFloat(v(t).fontSize);return s*a}if(e==="vh"||e==="vw"||e==="vmin"||e==="vmax"){const a={vh:window.innerHeight,vw:window.innerWidth,vmin:Math.min(window.innerWidth,window.innerHeight),vmax:Math.max(window.innerWidth,window.innerHeight)};return s/100*a[e]}const r={cm:37.7952755906,mm:3.77952755906,in:96};return e in r?s*r[e]*n:0},W=(i,e,t={x:0,y:0})=>{const s=i.getBoundingClientRect(),n=v(i).transform;let r=0,a=0;if(n!=="none"){const _=/translate\(\s*([-+]?\d*\.?\d+|\d+)(px|%)?,?\s*([-+]?\d*\.?\d+|\d+)?(px|%)?\s*\)/,d=n.match(_);d&&(r=B(d[1],d[2],i),a=B(d[3],d[4],i))}const{clientX:o,clientY:c}=L(e,t),h=o-s.left-r+i.scrollLeft,u=c-s.top-a+i.scrollTop;return{x:h,y:u}},L=(i,e)=>{const{clientX:t,clientY:s}=window.TouchEvent&&i instanceof TouchEvent?ue(i):i,n=t||e.x,r=s||e.y;return{clientX:n,clientY:r}},ue=i=>{if(i.touches.length){let{clientX:t,clientY:s}=i.touches[0];if(i.touches.length>1){const n=i.touches[1],r=n.clientX,a=n.clientY;t=(t+r)/2,s=(s+a)/2}return{clientX:t,clientY:s}}const e=i.changedTouches[0];return{clientX:e.clientX,clientY:e.clientY}},de=500,ge=10;class me{constructor(e,{onTouchDragStart:t},s={}){l(this,"_touchDragTimeOut"),l(this,"_onTouchDragStart"),l(this,"_payload",null),l(this,"_delay"),l(this,"_firstTouch",null),l(this,"_lastTouch",null),this._payload=e,this._onTouchDragStart=t,this._delay=s.delay||de}onTouchStart(e){var t;!e||!((t=e?.touches)!=null&&t.length)||this._touchDragTimeOut||(this._firstTouch=e.touches[e.touches.length-1],this._touchDragTimeOut=setTimeout(()=>{this._clearTimeout(),this._lastTouch||(this._lastTouch=e.touches[0]),this._checkXDistance(e)()},this._delay))}onTouchEnd(){this._resetTouches()}onTouchMove(e){var t;!e||!((t=e?.touches)!=null&&t.length)||(this._lastTouch=e.touches[0])}_clearTimeout(){this._touchDragTimeOut&&(clearTimeout(this._touchDragTimeOut),this._touchDragTimeOut=null)}_resetTouches(){this._clearTimeout(),this._lastTouch=null,this._firstTouch=null,this._payload=null}_checkXDistance(e){return()=>{if(!this._firstTouch||!this._lastTouch)return;let t=!1;t=Math.abs(this._firstTouch.clientX-this._lastTouch.clientX)<ge,t&&(this._onTouchDragStart(this._payload,e),this._resetTouches())}}}const Y="rml-drag-in-styles",_e="rml-drag-in-drag-element",w="rml-drag-in-overlay",b="rml-drag-in-drag-ghost",M="rml-drag-in-fade-in",z="rml-drag-in-fade-out",N={DISPLAY_NONE:"rml-display-none"},X=.5,P="250ms",R="forwards",A=i=>i?!0:(console.warn("No instance set, cancel drag-in"),!1);class fe{constructor(e){if(l(this,"_iframe"),l(this,"_currentDrag",{}),l(this,"_currentTouch",null),l(this,"_firefoxDragPosition",{x:0,y:0}),l(this,"_instance",null),l(this,"options",{}),l(this,"_firefoxFallback",n=>{if(!this._currentDrag.event)return;const r=n||window.event;this._firefoxDragPosition.x=r.pageX||0,this._firefoxDragPosition.y=r.pageY||0}),this._iframe=e,!document.getElementById(Y)){const n=document.createElement("style");n.type="text/css",n.id=Y,n.innerHTML=`
|
|
9
|
+
.${N.DISPLAY_NONE}{display:none}
|
|
10
|
+
.${w}{position:absolute;top:0;left:0;width:100%;height:100%;z-index:999;}
|
|
11
|
+
.${b}{position:absolute;top:0;left:0;width:1px;height:1px;z-index:999;pointer-events:none;background-color:transparent;}
|
|
12
|
+
@keyframes ${M} {from{opacity: 0;}to {opacity: ${X};}}
|
|
13
|
+
@keyframes ${z} {from{opacity: ${X};}to {opacity: 0;}}
|
|
14
|
+
`,document.head.appendChild(n)}const t=this._iframe.parentNode;let s=t.querySelector("."+b);s||(s=document.createElement("div"),s.classList.add(b),s.innerText=" ",t.appendChild(s)),this._firefoxFallback=this._firefoxFallback.bind(this),document.addEventListener("dragover",this._firefoxFallback)}setInstance(e){this._instance=e}dragStart(e,t){const s=this._iframe.parentNode;if(v(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._iframe.style.pointerEvents="none";let n=s.querySelector("."+w);if(n||(n=document.createElement("div"),n.classList.add(w),s.appendChild(n)),n.classList.remove(N.DISPLAY_NONE),t instanceof DragEvent){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 h=s.querySelector("."+b);this._currentDrag.event=t;const u=t.target.cloneNode();u.style.position="fixed",u.style.pointerEvents="none",u.style.opacity="0",u.style.animation=`${M} ${P} ${R}`,u.id=_e,u.style.zIndex="9999",document.body.appendChild(u),this._currentDrag.element=u;const _=t.target.getBoundingClientRect();this._currentDrag.offset||(this._currentDrag.offset={x:0,y:0});const{clientX:d,clientY:m}=L(t,this._firefoxDragPosition);this._currentDrag.offset.x=d-_.left,this._currentDrag.offset.y=m-_.top,u.style.top=m+"px",u.style.left=d+"px",t.dataTransfer&&t.dataTransfer.setDragImage&&t.dataTransfer.setDragImage(h,0,0)}const{x:r,y:a}=W(s,this._currentDrag.event||t,this._firefoxDragPosition),o=Math.max(1,r),c=Math.max(1,a);A(this._instance)&&this._instance.dragInObject(e,o,c)}dragUpdate(e){var t,s;const n=this._iframe.parentNode,{x:r,y:a}=W(n,e,this._firefoxDragPosition);if(r===0&&a===0)return;const o=Math.max(1,r),c=Math.max(1,a);if(this._currentDrag.element){const{clientX:h,clientY:u}=L(e,this._firefoxDragPosition),_=((t=this._currentDrag.offset)==null?void 0:t.x)||0,d=((s=this._currentDrag.offset)==null?void 0:s.y)||0;this._currentDrag.element.style.left=`${h-_}px`,this._currentDrag.element.style.top=`${u-d}px`;const m=(this.options.dragInOverlapX||0)+1,p=(this.options.dragInOverlapY||0)+1;o>m&&c>p?this._currentDrag.element.style.animation=`${z} ${P} ${R}`:this._currentDrag.element.style.animation=`${M} ${P} ${R}`}o===1&&c===1||A(this._instance)&&this._instance.updateDrag(o,c)}dragEnd(){this._iframe.style.pointerEvents="all";const e=this._iframe.parentNode;A(this._instance)&&this._instance.dragInObjectEnd(),this._currentDrag.element&&document.body.removeChild(this._currentDrag.element),this._currentDrag={},this._firefoxDragPosition={x:0,y:0};const t=e.querySelector("."+w);t&&t.classList.add(N.DISPLAY_NONE)}touchStart(e,t){t.preventDefault();const s=(n,r)=>{this.dragStart(e,r)};this._currentTouch=new me(void 0,{onTouchDragStart:s}),this._currentTouch.onTouchStart(t)}touchMove(e){this._currentTouch&&this._currentTouch.onTouchMove(e),this._currentDrag.event&&this.dragUpdate(e)}touchEnd(){this._currentTouch&&this._currentTouch.onTouchEnd(),this._currentTouch=null,this.dragEnd()}dispose(){document.removeEventListener("dragover",this._firefoxFallback)}}const pe=Object.freeze(Object.defineProperty({__proto__:null,DragIn:fe},Symbol.toStringTag,{value:"Module"}));return ce});
|