You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository has been archived by the owner on Jun 16, 2020. It is now read-only.
I could not find tool that can edit animations produced by termtosvg. And from the format description it looks quite real.
All frames in termtosvg animation are independent and stored (but not rendered) in svg.svg.defs. This array consists of elements g#g1, g#g2 and so on. Each element is fully drawn frame. Then in svg.svg.g#screen_view these elements are placed on a canvas from top to bottom. Then CSS style animation is applied to SVG viewport scroll it over Y axis.
The algorithm seems easy:
1.Find <g> element of the frame that needs to be removed in svg.svg.g#screen_view, remember its index
2.Remove <g> element and CSS animation rule with the same index
Check that Y coordinate of the removed <g> element matched CSS coordinate
Check that referenced g#gN element from svg.svg.defs is not references anywhere else and remove with as well.
The only problem is timing. The previous frame will now be exposed longer time, and all CSS percentages after the frame need to be readjusted. Then it will create a pause at the end of animation. Therefore absolute --animation-duration time needs to be shortened. But this will not remove the pause at the end - all frames just became faster, because all percentages are relative to the total animation duration.
Did I forget anything?
The text was updated successfully, but these errors were encountered:
# for freeto subscribe to this conversation on GitHub.
Already have an account?
#.
I could not find tool that can edit animations produced by
termtosvg
. And from the format description it looks quite real.All frames in
termtosvg
animation are independent and stored (but not rendered) insvg.svg.defs
. This array consists of elementsg#g1
,g#g2
and so on. Each element is fully drawn frame. Then insvg.svg.g#screen_view
these elements are placed on a canvas from top to bottom. Then CSS style animation is applied to SVG viewport scroll it over Y axis.The algorithm seems easy:
1.Find
<g>
element of the frame that needs to be removed insvg.svg.g#screen_view
, remember its index2.Remove
<g>
element and CSS animation rule with the same index<g>
element matched CSS coordinateg#gN
element fromsvg.svg.defs
is not references anywhere else and remove with as well.The only problem is timing. The previous frame will now be exposed longer time, and all CSS percentages after the frame need to be readjusted. Then it will create a pause at the end of animation. Therefore absolute
--animation-duration
time needs to be shortened. But this will not remove the pause at the end - all frames just became faster, because all percentages are relative to the total animation duration.Did I forget anything?
The text was updated successfully, but these errors were encountered: