[frontend/mfm] Make MfmFnJelly a reusable generic animation node

This commit is contained in:
pancakes 2024-11-11 11:33:52 +10:00 committed by Laura Hausmann
parent 3098e17a77
commit 89e5a22131
No known key found for this signature in database
GPG key ID: D044E84C5BE01605
2 changed files with 9 additions and 11 deletions

View file

@ -171,14 +171,13 @@
} }
::deep { ::deep {
.fn-jelly { .fn-animation {
display: inline-block; display: inline-block;
animation-delay: 0s; animation-delay: 0s;
animation-duration: 1s; animation-duration: 1s;
animation-fill-mode: both; animation-fill-mode: both;
animation-iteration-count: infinite; animation-iteration-count: infinite;
animation-timing-function: linear; animation-timing-function: linear;
animation-name: fn-jelly;
} }
} }

View file

@ -260,7 +260,7 @@ public static partial class MfmRenderer
"x3" => MfmFnX(node.Name, document), "x3" => MfmFnX(node.Name, document),
"x4" => MfmFnX(node.Name, document), "x4" => MfmFnX(node.Name, document),
"blur" => MfmFnBlur(document), "blur" => MfmFnBlur(document),
"jelly" => MfmFnJelly(args, document), "jelly" => MfmFnAnimation(node.Name, args, document),
"tada" => throw new NotImplementedException($"{node.Name}"), "tada" => throw new NotImplementedException($"{node.Name}"),
"jump" => throw new NotImplementedException($"{node.Name}"), "jump" => throw new NotImplementedException($"{node.Name}"),
"bounce" => throw new NotImplementedException($"{node.Name}"), "bounce" => throw new NotImplementedException($"{node.Name}"),
@ -331,19 +331,18 @@ public static partial class MfmRenderer
return el; return el;
} }
private static INode MfmFnJelly(Dictionary<string, string?> args, IDocument document) private static INode MfmFnAnimation(string name, Dictionary<string, string?> args, IDocument document)
{ {
var el = document.CreateElement("span"); var el = document.CreateElement("span");
el.ClassName = "fn-jelly"; el.ClassName = "fn-animation";
var style = ""; var style = $"animation-name: fn-{name}-mfm;";
style += args.TryGetValue("speed", out var speed) ? $"animation-duration: {speed}; " : ""; style += args.TryGetValue("speed", out var speed) ? $" animation-duration: {speed};" : "";
style += args.TryGetValue("delay", out var delay) ? $"animation-delay: {delay}; " : ""; style += args.TryGetValue("delay", out var delay) ? $" animation-delay: {delay};" : "";
style += args.TryGetValue("loop", out var loop) ? $"animation-iteration-count: {loop}; " : ""; style += args.TryGetValue("loop", out var loop) ? $" animation-iteration-count: {loop};" : "";
if (!string.IsNullOrWhiteSpace(style)) el.SetAttribute("style", style.Trim());
el.SetAttribute("style", style.Trim());
return el; return el;
} }