diff options
Diffstat (limited to 'play.js')
| -rw-r--r-- | play.js | 54 |
1 files changed, 53 insertions, 1 deletions
@@ -16,6 +16,7 @@ function set_has(set, item) { return false } + const CAESAR = "Caesar" const POMPEIUS = "Pompeius" @@ -94,6 +95,46 @@ let ui = { present: new Set(), } +function remember_position(e) { + if (e.classList.contains("show")) { + let rect = e.getBoundingClientRect() + e.my_parent = true + e.my_x = rect.x + e.my_y = rect.y + } else { + e.my_parent = false + e.my_x = 0 + e.my_y = 0 + } +} + +function animate_position(e) { + 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: 250, easing: "ease" } + ) + } + } else { + e.animate( + [ + { opacity: 0 }, + { opacity: 1 } + ], + { duration: 250, easing: "ease" } + ) + } + } +} + function on_focus_space_tip(x) { ui.spaces[x].classList.add("tip") } @@ -747,13 +788,21 @@ function on_update() { action_button("pass") action_button("undo", "Undo") + for (let c = 1; c <= 27; ++c) + remember_position(ui.cards[c]) + update_cards() update_map() if (view.battle) { document.getElementById("battle_header").textContent = view.battle.title document.getElementById("battle_message").textContent = view.battle.flash - document.getElementById("battle").classList.add("show") + if (!document.getElementById("battle").classList.contains("show")) { + document.getElementById("battle").classList.add("show") + document.getElementById("battle").scrollIntoView({ + block:"center", inline:"center", behavior:"smooth" + }) + } update_battle() } else { document.getElementById("battle").classList.remove("show") @@ -761,6 +810,9 @@ function on_update() { ui.old_location = Object.assign({}, view.location) ui.old_steps = Object.assign({}, view.steps) + + for (let c = 1; c <= 27; ++c) + animate_position(ui.cards[c]) } function select_card(c) { |