@selenite/graph-editor
Version:
A graph editor for visual programming, based on rete and svelte.
62 lines (61 loc) • 2.19 kB
JavaScript
export function getTranslateValues(element) {
throw new Error('Not implemented');
// const style = window.getComputedStyle(element);
// const transform = style.transform;
// if (transform && transform !== 'none') {
// const matrix = transform
// .match(/matrix.*\((.+)\)/)![1]
// .split(',')
// .map(Number);
// const translateX = matrix[4];
// const translateY = matrix[5];
// return { translateX, translateY };
// }
// return { translateX: 0, translateY: 0 };
}
export function getScale(element) {
const style = window.getComputedStyle(element);
const transform = style.transform;
let scaleX = 1;
let scaleY = 1;
if (transform && transform !== 'none') {
const matrix = transform
.match(/matrix\(([^\)]+)\)/)[1]
.split(',')
.map(Number);
scaleX = matrix[0];
scaleY = matrix[3];
}
return { scaleX, scaleY };
}
export function oldClientToSurfacePos({ x, y, factory }) {
const area = factory.getArea();
if (!area)
throw new Error('No area');
const surfaceRect = factory.surfaceRect;
const surfacePos = { x: surfaceRect.x, y: surfaceRect.y };
const k = area.area.transform.k;
// Calculate scaled position
// const zoomScale = getScale(surface); // Implement this function to retrieve the zoom scale
const scaledX = (x - surfacePos.x) / k;
const scaledY = (y - surfacePos.y) / k;
return [scaledX, scaledY];
}
export function clientToSurfacePos({ pos, factory }) {
const [x, y] = oldClientToSurfacePos({ ...pos, factory });
return { x, y };
}
export function translateNodeFromGlobal({ globalPos, node, factory, center = false }) {
const area = factory.getArea();
if (!area)
throw new Error('No area');
const nodeView = area.nodeViews.get(node.id);
if (!nodeView)
throw new Error('Node view not found');
const rect = nodeView.element.getBoundingClientRect();
nodeView.translate(...oldClientToSurfacePos({
x: globalPos.x - (center ? rect.width / 2 : 0),
y: globalPos.y - (center ? rect.height / 2 : 0),
factory: factory
}));
}