diff --git a/lib/encoder.ex b/lib/encoder.ex
index 3c3f161..7625629 100644
--- a/lib/encoder.ex
+++ b/lib/encoder.ex
@@ -108,18 +108,28 @@ defmodule MfmParser.Encoder do
%Node.MFM.Spin{} ->
{html_child, styles_child} = to_html_styles(node.children)
- stylemap = %{
- "mfm-spin" =>
- "@keyframes mfm-spin { 0% { transform:rotate(0) } to { transform:rotate(360deg) }}",
- "mfm-spinX" =>
+ styles_map = %{
+ "x" =>
"@keyframes mfm-spinX { 0% { transform:perspective(128px) rotateX(0) } to { transform:perspective(128px) rotateX(360deg) }}",
- "mfm-spinY" =>
- "@keyframes mfm-spinY { 0% { transform:perspective(128px) rotateY(0) } to { transform:perspective(128px) rotateY(360deg) }}"
+ "y" =>
+ "@keyframes mfm-spinY { 0% { transform:perspective(128px) rotateY(0) } to { transform:perspective(128px) rotateY(360deg) }}",
+ "z" =>
+ "@keyframes mfm-spin { 0% { transform:rotate(0) } to { transform:rotate(360deg) }}"
+ }
+
+ keyframe_names_map = %{
+ "x" => "mfm-spinX",
+ "y" => "mfm-spinY",
+ "z" => "mfm-spin"
+ }
+
+ directions_map = %{
+ "left" => "reverse"
}
{html <>
- "#{html_child}",
- styles ++ [Map.get(stylemap, node.props.keyframes_name, "")] ++ styles_child}
+ "#{html_child}",
+ styles ++ [Map.get(styles_map, node.props.axis, "")] ++ styles_child}
%Node.MFM.Shake{} ->
{html_child, styles_child} = to_html_styles(node.children)
diff --git a/lib/node/mfm/spin.ex b/lib/node/mfm/spin.ex
index efb40fd..006a52a 100644
--- a/lib/node/mfm/spin.ex
+++ b/lib/node/mfm/spin.ex
@@ -1,13 +1,3 @@
defmodule MfmParser.Node.MFM.Spin do
- # keyframes_name:
- # x -> mfm-spinX
- # y -> mfm-spinY
- # _ -> mfm-spin
- #
- # direction:
- # left -> reverse
- # alternate -> alternate
- # _ -> normal
- #
- defstruct props: %{keyframes_name: "mfm-spin", direction: "normal", speed: "1.5s"}, children: []
+ defstruct props: %{axis: "z", direction: "normal", speed: "1.5s"}, children: []
end
diff --git a/test/encoder_test.exs b/test/encoder_test.exs
index 988ff9b..64102b3 100644
--- a/test/encoder_test.exs
+++ b/test/encoder_test.exs
@@ -149,107 +149,107 @@ defmodule MfmParser.EncoderTest do
end
test "it handles spin" do
- input_tree_spin_reverse = [
+ input_tree_z_left = [
%Node.MFM.Spin{
- props: %{keyframes_name: "mfm-spin", direction: "reverse", speed: "1.5s"},
+ props: %{axis: "z", direction: "left", speed: "1.5s"},
children: [%Node.Text{props: %{text: "🍮"}}]
}
]
- input_tree_spinx_reverse = [
+ input_tree_x_left = [
%Node.MFM.Spin{
- props: %{keyframes_name: "mfm-spinX", direction: "reverse", speed: "1.5s"},
+ props: %{axis: "x", direction: "left", speed: "1.5s"},
children: [%Node.Text{props: %{text: "🍮"}}]
}
]
- input_tree_spiny_reverse = [
+ input_tree_y_left = [
%Node.MFM.Spin{
- props: %{keyframes_name: "mfm-spinY", direction: "reverse", speed: "1.5s"},
+ props: %{axis: "y", direction: "left", speed: "1.5s"},
children: [%Node.Text{props: %{text: "🍮"}}]
}
]
- input_tree_spin_alternate = [
+ input_tree_z_alternate = [
%Node.MFM.Spin{
- props: %{keyframes_name: "mfm-spin", direction: "alternate", speed: "1.5s"},
+ props: %{axis: "z", direction: "alternate", speed: "1.5s"},
children: [%Node.Text{props: %{text: "🍮"}}]
}
]
- input_tree_spinx_alternate = [
+ input_tree_x_alternate = [
%Node.MFM.Spin{
- props: %{keyframes_name: "mfm-spinX", direction: "alternate", speed: "1.5s"},
+ props: %{axis: "x", direction: "alternate", speed: "1.5s"},
children: [%Node.Text{props: %{text: "🍮"}}]
}
]
- input_tree_spiny_alternate = [
+ input_tree_y_alternate = [
%Node.MFM.Spin{
- props: %{keyframes_name: "mfm-spinY", direction: "alternate", speed: "1.5s"},
+ props: %{axis: "y", direction: "alternate", speed: "1.5s"},
children: [%Node.Text{props: %{text: "🍮"}}]
}
]
- input_tree_spin_normal = [
+ input_tree_z_normal = [
%Node.MFM.Spin{
- props: %{keyframes_name: "mfm-spin", direction: "normal", speed: "1.5s"},
+ props: %{axis: "z", direction: "normal", speed: "1.5s"},
children: [%Node.Text{props: %{text: "🍮"}}]
}
]
- input_tree_spinx_normal = [
+ input_tree_x_normal = [
%Node.MFM.Spin{
- props: %{keyframes_name: "mfm-spinX", direction: "normal", speed: "1.5s"},
+ props: %{axis: "x", direction: "normal", speed: "1.5s"},
children: [%Node.Text{props: %{text: "🍮"}}]
}
]
- input_tree_spiny_normal = [
+ input_tree_y_normal = [
%Node.MFM.Spin{
- props: %{keyframes_name: "mfm-spinY", direction: "normal", speed: "1.5s"},
+ props: %{axis: "y", direction: "normal", speed: "1.5s"},
children: [%Node.Text{props: %{text: "🍮"}}]
}
]
- expected_tree_spin_reverse =
+ expected_tree_z_left =
~s[🍮]
- expected_tree_spinx_reverse =
+ expected_tree_x_left =
~s[🍮]
- expected_tree_spiny_reverse =
+ expected_tree_y_left =
~s[🍮]
- expected_tree_spin_alternate =
+ expected_tree_z_alternate =
~s[🍮]
- expected_tree_spinx_alternate =
+ expected_tree_x_alternate =
~s[🍮]
- expected_tree_spiny_alternate =
+ expected_tree_y_alternate =
~s[🍮]
- expected_tree_spin_normal =
+ expected_tree_z_normal =
~s[🍮]
- expected_tree_spinx_normal =
+ expected_tree_x_normal =
~s[🍮]
- expected_tree_spiny_normal =
+ expected_tree_y_normal =
~s[🍮]
- assert Encoder.to_html(input_tree_spin_reverse) == expected_tree_spin_reverse
- assert Encoder.to_html(input_tree_spinx_reverse) == expected_tree_spinx_reverse
- assert Encoder.to_html(input_tree_spiny_reverse) == expected_tree_spiny_reverse
+ assert Encoder.to_html(input_tree_z_left) == expected_tree_z_left
+ assert Encoder.to_html(input_tree_x_left) == expected_tree_x_left
+ assert Encoder.to_html(input_tree_y_left) == expected_tree_y_left
- assert Encoder.to_html(input_tree_spin_alternate) == expected_tree_spin_alternate
- assert Encoder.to_html(input_tree_spinx_alternate) == expected_tree_spinx_alternate
- assert Encoder.to_html(input_tree_spiny_alternate) == expected_tree_spiny_alternate
+ assert Encoder.to_html(input_tree_z_alternate) == expected_tree_z_alternate
+ assert Encoder.to_html(input_tree_x_alternate) == expected_tree_x_alternate
+ assert Encoder.to_html(input_tree_y_alternate) == expected_tree_y_alternate
- assert Encoder.to_html(input_tree_spin_normal) == expected_tree_spin_normal
- assert Encoder.to_html(input_tree_spinx_normal) == expected_tree_spinx_normal
- assert Encoder.to_html(input_tree_spiny_normal) == expected_tree_spiny_normal
+ assert Encoder.to_html(input_tree_z_normal) == expected_tree_z_normal
+ assert Encoder.to_html(input_tree_x_normal) == expected_tree_x_normal
+ assert Encoder.to_html(input_tree_y_normal) == expected_tree_y_normal
end
test "it handles shake" do
@@ -395,7 +395,7 @@ defmodule MfmParser.EncoderTest do
children: [
%MfmParser.Node.MFM.Spin{
children: [%MfmParser.Node.Text{props: %{text: "pain"}}],
- props: %{direction: "normal", keyframes_name: "mfm-spin", speed: "1s"}
+ props: %{direction: "normal", axis: "z", speed: "1s"}
},
%MfmParser.Node.Text{props: %{text: " "}},
%MfmParser.Node.MFM.Rainbow{
diff --git a/test/parser_test.exs b/test/parser_test.exs
index da0a65c..0080a1c 100644
--- a/test/parser_test.exs
+++ b/test/parser_test.exs
@@ -244,7 +244,7 @@ defmodule MfmParser.ParserTest do
output_default = [
%MfmParser.Node.MFM.Spin{
props: %{
- keyframes_name: "mfm-spin",
+ axis: "z",
direction: "normal",
speed: "1.5s"
},
@@ -257,8 +257,8 @@ defmodule MfmParser.ParserTest do
output_left = [
%MfmParser.Node.MFM.Spin{
props: %{
- keyframes_name: "mfm-spin",
- direction: "reverse",
+ axis: "z",
+ direction: "left",
speed: "1.5s"
},
children: []
@@ -270,7 +270,7 @@ defmodule MfmParser.ParserTest do
output_alternate = [
%MfmParser.Node.MFM.Spin{
props: %{
- keyframes_name: "mfm-spin",
+ axis: "z",
direction: "alternate",
speed: "1.5s"
},
@@ -283,7 +283,7 @@ defmodule MfmParser.ParserTest do
output_x = [
%MfmParser.Node.MFM.Spin{
props: %{
- keyframes_name: "mfm-spinX",
+ axis: "x",
direction: "normal",
speed: "1.5s"
},
@@ -296,8 +296,8 @@ defmodule MfmParser.ParserTest do
output_x_left = [
%MfmParser.Node.MFM.Spin{
props: %{
- keyframes_name: "mfm-spinX",
- direction: "reverse",
+ axis: "x",
+ direction: "left",
speed: "1.5s"
},
children: []
@@ -309,7 +309,7 @@ defmodule MfmParser.ParserTest do
output_x_alternate = [
%MfmParser.Node.MFM.Spin{
props: %{
- keyframes_name: "mfm-spinX",
+ axis: "x",
direction: "alternate",
speed: "1.5s"
},
@@ -322,7 +322,7 @@ defmodule MfmParser.ParserTest do
output_y = [
%MfmParser.Node.MFM.Spin{
props: %{
- keyframes_name: "mfm-spinY",
+ axis: "y",
direction: "normal",
speed: "1.5s"
},
@@ -335,8 +335,8 @@ defmodule MfmParser.ParserTest do
output_y_left = [
%MfmParser.Node.MFM.Spin{
props: %{
- keyframes_name: "mfm-spinY",
- direction: "reverse",
+ axis: "y",
+ direction: "left",
speed: "1.5s"
},
children: []
@@ -348,7 +348,7 @@ defmodule MfmParser.ParserTest do
output_y_alternate = [
%MfmParser.Node.MFM.Spin{
props: %{
- keyframes_name: "mfm-spinY",
+ axis: "y",
direction: "alternate",
speed: "1.5s"
},
@@ -361,7 +361,7 @@ defmodule MfmParser.ParserTest do
output_speed = [
%MfmParser.Node.MFM.Spin{
props: %{
- keyframes_name: "mfm-spin",
+ axis: "z",
direction: "normal",
speed: "20s"
},
@@ -544,7 +544,7 @@ defmodule MfmParser.ParserTest do
children: [
%MfmParser.Node.MFM.Spin{
children: [%MfmParser.Node.Text{props: %{text: "chocolatine"}}],
- props: %{direction: "normal", keyframes_name: "mfm-spin", speed: "1.5s"}
+ props: %{direction: "normal", axis: "z", speed: "1.5s"}
}
],
props: %{speed: "0.5s"}
@@ -568,7 +568,7 @@ defmodule MfmParser.ParserTest do
children: [
%MfmParser.Node.MFM.Spin{
children: [%MfmParser.Node.Text{props: %{text: "pain"}}],
- props: %{direction: "normal", keyframes_name: "mfm-spin", speed: "1.5s"}
+ props: %{direction: "normal", axis: "z", speed: "1.5s"}
},
%MfmParser.Node.Text{props: %{text: " "}},
%MfmParser.Node.MFM.Rainbow{