summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--play.js49
1 files changed, 32 insertions, 17 deletions
diff --git a/play.js b/play.js
index 8411ea8..4c37ce5 100644
--- a/play.js
+++ b/play.js
@@ -112,36 +112,51 @@ var animation_list = []
function remember_position(e) {
if (e.parentElement) {
animation_list.push(e)
+ let prect = e.parentElement.getBoundingClientRect()
let rect = e.getBoundingClientRect()
+ e.my_visible = 1
e.my_parent = e.parentElement
+ e.my_px = prect.x
+ e.my_py = prect.y
e.my_x = rect.x
e.my_y = rect.y
} else {
+ e.my_visible = 0
e.my_parent = null
e.my_x = 0
e.my_y = 0
+ e.my_z = 0
}
}
-function animate_positions() {
- for (let e of animation_list) {
- if (e.parentElement) {
- if (e.my_parent) {
- let rect = e.getBoundingClientRect()
- let dx = e.my_x - rect.x
- let dy = e.my_y - rect.y
- if (dx !== 0 || dy !== 0) {
- e.animate(
- [
- { transform: `translate(${dx}px, ${dy}px)`, },
- { transform: "translate(0, 0)", },
- ],
- { duration: 333, easing: "ease" }
- )
- }
- }
+function animate_position(e) {
+ if (e.parentElement && e.my_visible) {
+ let prect = e.parentElement.getBoundingClientRect()
+ let rect = e.getBoundingClientRect()
+ let dx, dy
+ if (e.parentElement === e.my_parent) {
+ dx = (e.my_x - e.my_px) - (rect.x - prect.x)
+ dy = (e.my_y - e.my_py) - (rect.y - prect.y)
+ } else {
+ dx = e.my_x - rect.x
+ dy = e.my_y - rect.y
+ }
+ if (dx !== 0 || dy !== 0) {
+ let dist = Math.sqrt((dx * dx) + (dy * dy))
+ e.animate(
+ [
+ { transform: `translate(${dx}px, ${dy}px)`, },
+ { transform: "translate(0, 0)", },
+ ],
+ { duration: 333, easing: "ease" }
+ )
}
}
+}
+
+function animate_positions() {
+ for (let e of animation_list)
+ animate_position(e)
animation_list.length = 0
}