MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

use animation time isntead of id

This commit is contained in:
Gerard Burns 2024-04-01 12:47:09 +01:00
parent 7eed50707e
commit 6fa66aae54
2 changed files with 10 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/bbui/src/Form/Core/Picker.svelte
View File

@ -129,7 +129,7 @@
} else { } else {
console.log("not long enough"); console.log("not long enough");
} }
}, 400) }, 200)
} }
const handleMouseleave = (e, option) => { const handleMouseleave = (e, option) => {

16
packages/bbui/src/Tooltip/Context.svelte
View File

@ -9,7 +9,7 @@
let targetX = 0 let targetX = 0
let targetY = 0 let targetY = 0
let animationId = 0; let animationStartTime = 0;
let x = 0; let x = 0;
let y = 0; let y = 0;
@ -31,7 +31,7 @@
targetX = rect.x - tooltipWidth targetX = rect.x - tooltipWidth
targetY = rect.y targetY = rect.y
animationId += 1 animationStartTime = document.timeline.currentTime
if (x === 0 && y === 0) { if (x === 0 && y === 0) {
x = targetX x = targetX
@ -39,14 +39,16 @@
} }
} }
const animate = (invokedAnimationId, xRate = null, yRate = null) => { const animate = (invokedAnimationStartTime, frameTime, xRate = null, yRate = null) => {
if (invokedAnimationId !== animationId) { console.log(frameTime);
console.log("CANCEL ANIMATION ", invokedAnimationId, " ", animationId); if (invokedAnimationStartTime !== animationStartTime) {
console.log("CANCEL ANIMATION ", invokedAnimationStartTime, " ", animationStartTime);
return; return;
} }
console.log("animating"); console.log("animating");
const animationDurationInFrames = 10; const animationDurationInFrames = 10;
const easingRate = 2;
const xDelta = targetX - x const xDelta = targetX - x
const yDelta = targetY - y const yDelta = targetY - y
@ -84,12 +86,12 @@
y = y - yRate; y = y - yRate;
} }
requestAnimationFrame(() => animate(invokedAnimationId, xRate, yRate)) requestAnimationFrame((newFrameTime) => animate(invokedAnimationStartTime, newFrameTime, xRate, yRate))
} }
$: updatePosition(anchor, tooltip) $: updatePosition(anchor, tooltip)
$: updatePositionOnVisibilityChange(visible, hovering) $: updatePositionOnVisibilityChange(visible, hovering)
$: requestAnimationFrame(() => animate(animationId)) $: requestAnimationFrame((frameTime) => animate(animationStartTime, frameTime, null, null))
const handleMouseenter = (e) => { const handleMouseenter = (e) => {
hovering = true; hovering = true;