mirror of
https://github.com/google/blockly.git
synced 2026-01-09 10:00:09 +01:00
fix: Fix block disposal animations (#7948)
* fix: Fix block disposal animations * chore: Run lint * chore: Remove unused import * fix: Remove unused function arg
This commit is contained in:
@@ -38,18 +38,26 @@ export function disposeUiEffect(block: BlockSvg) {
|
||||
const svgGroup = block.getSvgRoot();
|
||||
workspace.getAudioManager().play('delete');
|
||||
|
||||
const xy = workspace.getSvgXY(svgGroup);
|
||||
const xy = block.getRelativeToSurfaceXY();
|
||||
// Deeply clone the current block.
|
||||
const clone: SVGGElement = svgGroup.cloneNode(true) as SVGGElement;
|
||||
clone.setAttribute('transform', 'translate(' + xy.x + ',' + xy.y + ')');
|
||||
workspace.getParentSvg().appendChild(clone);
|
||||
if (workspace.isDragging()) {
|
||||
workspace.getLayerManager()?.moveToDragLayer({
|
||||
getSvgRoot: () => {
|
||||
return clone;
|
||||
},
|
||||
});
|
||||
} else {
|
||||
workspace.getLayerManager()?.getBlockLayer().appendChild(clone);
|
||||
}
|
||||
const cloneRect = {
|
||||
'x': xy.x,
|
||||
'y': xy.y,
|
||||
'width': block.width,
|
||||
'height': block.height,
|
||||
};
|
||||
disposeUiStep(clone, cloneRect, workspace.RTL, new Date(), workspace.scale);
|
||||
disposeUiStep(clone, cloneRect, workspace.RTL, new Date());
|
||||
}
|
||||
/**
|
||||
* Animate a cloned block and eventually dispose of it.
|
||||
@@ -60,29 +68,26 @@ export function disposeUiEffect(block: BlockSvg) {
|
||||
* @param rect Starting rect of the clone.
|
||||
* @param rtl True if RTL, false if LTR.
|
||||
* @param start Date of animation's start.
|
||||
* @param workspaceScale Scale of workspace.
|
||||
*/
|
||||
function disposeUiStep(
|
||||
clone: Element,
|
||||
rect: CloneRect,
|
||||
rtl: boolean,
|
||||
start: Date,
|
||||
workspaceScale: number,
|
||||
) {
|
||||
const ms = new Date().getTime() - start.getTime();
|
||||
const percent = ms / 150;
|
||||
if (percent > 1) {
|
||||
dom.removeNode(clone);
|
||||
} else {
|
||||
const x =
|
||||
rect.x + (((rtl ? -1 : 1) * rect.width * workspaceScale) / 2) * percent;
|
||||
const y = rect.y + rect.height * workspaceScale * percent;
|
||||
const scale = (1 - percent) * workspaceScale;
|
||||
const x = rect.x + (((rtl ? -1 : 1) * rect.width) / 2) * percent;
|
||||
const y = rect.y + (rect.height / 2) * percent;
|
||||
const scale = 1 - percent;
|
||||
clone.setAttribute(
|
||||
'transform',
|
||||
'translate(' + x + ',' + y + ')' + ' scale(' + scale + ')',
|
||||
);
|
||||
setTimeout(disposeUiStep, 10, clone, rect, rtl, start, workspaceScale);
|
||||
setTimeout(disposeUiStep, 10, clone, rect, rtl, start);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user