add client rect observer to iframe script
This commit is contained in:
parent
d154c79265
commit
f4e579e1d9
|
|
@ -1,6 +1,8 @@
|
||||||
import { FolkGeometry } from '../canvas/fc-geometry';
|
import { FolkGeometry } from '../canvas/fc-geometry';
|
||||||
import { ClientRectObserverManager, ClientRectObserverEntry } from '../client-rect-observer.ts';
|
import { ClientRectObserverManager, ClientRectObserverEntry } from '../client-rect-observer.ts';
|
||||||
|
|
||||||
|
const clientRectObserver = new ClientRectObserverManager();
|
||||||
|
|
||||||
interface ObservedElementEntry {
|
interface ObservedElementEntry {
|
||||||
selector: string;
|
selector: string;
|
||||||
element: Element;
|
element: Element;
|
||||||
|
|
@ -51,7 +53,13 @@ if (window.parent !== window) {
|
||||||
const observedElements = new Map();
|
const observedElements = new Map();
|
||||||
const observedSelectors = new Map();
|
const observedSelectors = new Map();
|
||||||
|
|
||||||
function boundingBoxCallback(entry: ClientRectObserverEntry) {}
|
function boundingBoxCallback(entry: ClientRectObserverEntry) {
|
||||||
|
window.parent.postMessage({
|
||||||
|
type: 'folk-element-change',
|
||||||
|
selector: observedSelectors.get(entry.target),
|
||||||
|
boundingBox: entry.contentRect,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
function onGeometryChange(event) {
|
function onGeometryChange(event) {
|
||||||
window.parent.postMessage({
|
window.parent.postMessage({
|
||||||
|
|
@ -82,7 +90,7 @@ if (window.parent !== window) {
|
||||||
boundingBox: element.getClientRect(),
|
boundingBox: element.getClientRect(),
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
// use BoundingBoxObserver
|
clientRectObserver.observe(element, boundingBoxCallback);
|
||||||
}
|
}
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
@ -98,6 +106,7 @@ if (window.parent !== window) {
|
||||||
observedElements.delete(selector);
|
observedElements.delete(selector);
|
||||||
observedSelectors.delete(element);
|
observedSelectors.delete(element);
|
||||||
} else {
|
} else {
|
||||||
|
clientRectObserver.unobserve(element, boundingBoxCallback);
|
||||||
}
|
}
|
||||||
|
|
||||||
return;
|
return;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue