Base movement speed entirely on time #8
Loading…
Add table
Add a link
Reference in a new issue
No description provided.
Delete branch "%!s()"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
Currently logo movement is determined on every screen redraw with
window.requestAnimationFrame:window.requestAnimationFrame(playAnimation);This method redraws screen based on refresh rate, which, as it turns out, dinamically varies on mobile devices - e.g.: when inactive, screen will drop refresh rate and logo will noticeably slow-down.
In order to compensate this, all logo movement - regardless of slower or faster - should be calculated based on time and not rely on refresh rate.
At the moment delay is implemented for situations when we want to skip movement by 1 px during one
requestAnimationFramecycle - that enables introduction of delay by miliseconds configured inmovementVelocity.Delay moving logo by 1 pixel for movementVelocity miliseconds.Screen is redrawed with
requestAnimationFramebased on screen refresh rate. Since it is dynamic on mobile devices, need to introduce time-based pause in every cycle ofrequestAnimationFrameredraw:let movementVelocity = 10;That way no matter how fast or slow screen redraws, there is always a
movementVelocity(ms) pause between logo is moved a pixel:if ((lastMovementTime == null) || ((Math.abs(lastMovementTime - Date.now())) > movementVelocity) ) {