add classes to a bunch of things
This commit is contained in:
parent
51282dd6a7
commit
912fba8115
2 changed files with 23 additions and 22 deletions
|
@ -76,9 +76,10 @@ defmodule MfmParser.Encoder do
|
||||||
|
|
||||||
%Node.MFM.X{} ->
|
%Node.MFM.X{} ->
|
||||||
html_child = to_html_styles(node.children)
|
html_child = to_html_styles(node.children)
|
||||||
|
prop_map = %{"200%" => "2", "400%" => "3", "600%" => "4"}
|
||||||
|
|
||||||
temple do
|
temple do
|
||||||
span style: "font-size: #{node.props.size}" do
|
span style: "font-size: #{node.props.size}", class: "mfm _mfm_x#{prop_map[node.props.size]}_" do
|
||||||
html_child
|
html_child
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
@ -93,13 +94,13 @@ defmodule MfmParser.Encoder do
|
||||||
%Node.MFM.Jelly{} ->
|
%Node.MFM.Jelly{} ->
|
||||||
html_child = to_html_styles(node.children)
|
html_child = to_html_styles(node.children)
|
||||||
|
|
||||||
"<span class=\"mfm\" style=\"display: inline-block; animation: #{node.props.speed} linear 0s infinite normal both running mfm-rubberBand;\">#{html_child}</span>"
|
"<span class=\"mfm _mfm_jelly_\" style=\"display: inline-block; animation: #{node.props.speed} linear 0s infinite normal both running mfm-rubberBand;\">#{html_child}</span>"
|
||||||
|
|
||||||
%Node.MFM.Tada{} ->
|
%Node.MFM.Tada{} ->
|
||||||
html_child = to_html_styles(node.children)
|
html_child = to_html_styles(node.children)
|
||||||
|
|
||||||
temple do
|
temple do
|
||||||
span class: "mfm",
|
span class: "mfm _mfm_tada_",
|
||||||
style:
|
style:
|
||||||
"display: inline-block; font-size: 150%; animation: #{node.props.speed} linear 0s infinite normal both running mfm-tada;" do
|
"display: inline-block; font-size: 150%; animation: #{node.props.speed} linear 0s infinite normal both running mfm-tada;" do
|
||||||
html_child
|
html_child
|
||||||
|
@ -109,12 +110,12 @@ defmodule MfmParser.Encoder do
|
||||||
%Node.MFM.Jump{} ->
|
%Node.MFM.Jump{} ->
|
||||||
html_child = to_html_styles(node.children)
|
html_child = to_html_styles(node.children)
|
||||||
|
|
||||||
"<span class=\"mfm\" style=\"display: inline-block; animation: #{node.props.speed} linear 0s infinite normal none running mfm-jump;\">#{html_child}</span>"
|
"<span class=\"mfm _mfm_jump_\" style=\"display: inline-block; animation: #{node.props.speed} linear 0s infinite normal none running mfm-jump;\">#{html_child}</span>"
|
||||||
|
|
||||||
%Node.MFM.Bounce{} ->
|
%Node.MFM.Bounce{} ->
|
||||||
html_child = to_html_styles(node.children)
|
html_child = to_html_styles(node.children)
|
||||||
|
|
||||||
"<span class=\"mfm\" style=\"display: inline-block; animation: #{node.props.speed} linear 0s infinite normal none running mfm-bounce; transform-origin: center bottom 0px;\">#{html_child}</span>"
|
"<span class=\"mfm _mfm_bounce_\" style=\"display: inline-block; animation: #{node.props.speed} linear 0s infinite normal none running mfm-bounce; transform-origin: center bottom 0px;\">#{html_child}</span>"
|
||||||
|
|
||||||
%Node.MFM.Spin{} ->
|
%Node.MFM.Spin{} ->
|
||||||
html_child = to_html_styles(node.children)
|
html_child = to_html_styles(node.children)
|
||||||
|
@ -129,7 +130,7 @@ defmodule MfmParser.Encoder do
|
||||||
"left" => "reverse"
|
"left" => "reverse"
|
||||||
}
|
}
|
||||||
|
|
||||||
"<span class=\"mfm\" style=\"display: inline-block; animation: #{node.props.speed} linear 0s infinite #{Map.get(directions_map, node.props.direction, node.props.direction)} none running #{Map.get(keyframe_names_map, node.props.axis, "")};\">#{html_child}</span>"
|
"<span class=\"mfm _mfm_spin_\" style=\"display: inline-block; animation: #{node.props.speed} linear 0s infinite #{Map.get(directions_map, node.props.direction, node.props.direction)} none running #{Map.get(keyframe_names_map, node.props.axis, "")};\">#{html_child}</span>"
|
||||||
|
|
||||||
%Node.MFM.Shake{} ->
|
%Node.MFM.Shake{} ->
|
||||||
html_child = to_html_styles(node.children)
|
html_child = to_html_styles(node.children)
|
||||||
|
|
|
@ -80,7 +80,7 @@ defmodule MfmParser.EncoderTest do
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
|
||||||
expected = ~s[<span style="font-size: 400%">🍮</span>]
|
expected = ~s[<span style="font-size: 400%" class="mfm _mfm_x3_">🍮</span>]
|
||||||
|
|
||||||
assert Encoder.to_html(input_tree) == expected
|
assert Encoder.to_html(input_tree) == expected
|
||||||
end
|
end
|
||||||
|
@ -105,7 +105,7 @@ defmodule MfmParser.EncoderTest do
|
||||||
]
|
]
|
||||||
|
|
||||||
expected =
|
expected =
|
||||||
~s[<span class="mfm" style="display: inline-block; animation: 1s linear 0s infinite normal both running mfm-rubberBand;">🍮</span>]
|
~s[<span class="mfm _mfm_jelly_" style="display: inline-block; animation: 1s linear 0s infinite normal both running mfm-rubberBand;">🍮</span>]
|
||||||
|
|
||||||
assert Encoder.to_html(input_tree) == expected
|
assert Encoder.to_html(input_tree) == expected
|
||||||
end
|
end
|
||||||
|
@ -118,7 +118,7 @@ defmodule MfmParser.EncoderTest do
|
||||||
]
|
]
|
||||||
|
|
||||||
expected =
|
expected =
|
||||||
~s[<span class="mfm" style="display: inline-block; font-size: 150%; animation: 1s linear 0s infinite normal both running mfm-tada;">🍮</span>]
|
~s[<span class="mfm _mfm_tada_" style="display: inline-block; font-size: 150%; animation: 1s linear 0s infinite normal both running mfm-tada;">🍮</span>]
|
||||||
|
|
||||||
assert Encoder.to_html(input_tree) == expected
|
assert Encoder.to_html(input_tree) == expected
|
||||||
end
|
end
|
||||||
|
@ -131,7 +131,7 @@ defmodule MfmParser.EncoderTest do
|
||||||
]
|
]
|
||||||
|
|
||||||
expected =
|
expected =
|
||||||
~s[<span class="mfm" style="display: inline-block; animation: 0.75s linear 0s infinite normal none running mfm-jump;">🍮</span>]
|
~s[<span class="mfm _mfm_jump_" style="display: inline-block; animation: 0.75s linear 0s infinite normal none running mfm-jump;">🍮</span>]
|
||||||
|
|
||||||
assert Encoder.to_html(input_tree) == expected
|
assert Encoder.to_html(input_tree) == expected
|
||||||
end
|
end
|
||||||
|
@ -144,7 +144,7 @@ defmodule MfmParser.EncoderTest do
|
||||||
]
|
]
|
||||||
|
|
||||||
expected =
|
expected =
|
||||||
~s[<span class="mfm" style="display: inline-block; animation: 0.75s linear 0s infinite normal none running mfm-bounce; transform-origin: center bottom 0px;">🍮</span>]
|
~s[<span class="mfm _mfm_bounce_" style="display: inline-block; animation: 0.75s linear 0s infinite normal none running mfm-bounce; transform-origin: center bottom 0px;">🍮</span>]
|
||||||
|
|
||||||
assert Encoder.to_html(input_tree) == expected
|
assert Encoder.to_html(input_tree) == expected
|
||||||
end
|
end
|
||||||
|
@ -214,31 +214,31 @@ defmodule MfmParser.EncoderTest do
|
||||||
]
|
]
|
||||||
|
|
||||||
expected_tree_z_left =
|
expected_tree_z_left =
|
||||||
~s[<span class="mfm" style="display: inline-block; animation: 1.5s linear 0s infinite reverse none running mfm-spin;">🍮</span>]
|
~s[<span class="mfm _mfm_spin_" style="display: inline-block; animation: 1.5s linear 0s infinite reverse none running mfm-spin;">🍮</span>]
|
||||||
|
|
||||||
expected_tree_x_left =
|
expected_tree_x_left =
|
||||||
~s[<span class="mfm" style="display: inline-block; animation: 1.5s linear 0s infinite reverse none running mfm-spinX;">🍮</span>]
|
~s[<span class="mfm _mfm_spin_" style="display: inline-block; animation: 1.5s linear 0s infinite reverse none running mfm-spinX;">🍮</span>]
|
||||||
|
|
||||||
expected_tree_y_left =
|
expected_tree_y_left =
|
||||||
~s[<span class="mfm" style="display: inline-block; animation: 1.5s linear 0s infinite reverse none running mfm-spinY;">🍮</span>]
|
~s[<span class="mfm _mfm_spin_" style="display: inline-block; animation: 1.5s linear 0s infinite reverse none running mfm-spinY;">🍮</span>]
|
||||||
|
|
||||||
expected_tree_z_alternate =
|
expected_tree_z_alternate =
|
||||||
~s[<span class="mfm" style="display: inline-block; animation: 1.5s linear 0s infinite alternate none running mfm-spin;">🍮</span>]
|
~s[<span class="mfm _mfm_spin_" style="display: inline-block; animation: 1.5s linear 0s infinite alternate none running mfm-spin;">🍮</span>]
|
||||||
|
|
||||||
expected_tree_x_alternate =
|
expected_tree_x_alternate =
|
||||||
~s[<span class="mfm" style="display: inline-block; animation: 1.5s linear 0s infinite alternate none running mfm-spinX;">🍮</span>]
|
~s[<span class="mfm _mfm_spin_" style="display: inline-block; animation: 1.5s linear 0s infinite alternate none running mfm-spinX;">🍮</span>]
|
||||||
|
|
||||||
expected_tree_y_alternate =
|
expected_tree_y_alternate =
|
||||||
~s[<span class="mfm" style="display: inline-block; animation: 1.5s linear 0s infinite alternate none running mfm-spinY;">🍮</span>]
|
~s[<span class="mfm _mfm_spin_" style="display: inline-block; animation: 1.5s linear 0s infinite alternate none running mfm-spinY;">🍮</span>]
|
||||||
|
|
||||||
expected_tree_z_normal =
|
expected_tree_z_normal =
|
||||||
~s[<span class="mfm" style="display: inline-block; animation: 1.5s linear 0s infinite normal none running mfm-spin;">🍮</span>]
|
~s[<span class="mfm _mfm_spin_" style="display: inline-block; animation: 1.5s linear 0s infinite normal none running mfm-spin;">🍮</span>]
|
||||||
|
|
||||||
expected_tree_x_normal =
|
expected_tree_x_normal =
|
||||||
~s[<span class="mfm" style="display: inline-block; animation: 1.5s linear 0s infinite normal none running mfm-spinX;">🍮</span>]
|
~s[<span class="mfm _mfm_spin_" style="display: inline-block; animation: 1.5s linear 0s infinite normal none running mfm-spinX;">🍮</span>]
|
||||||
|
|
||||||
expected_tree_y_normal =
|
expected_tree_y_normal =
|
||||||
~s[<span class="mfm" style="display: inline-block; animation: 1.5s linear 0s infinite normal none running mfm-spinY;">🍮</span>]
|
~s[<span class="mfm _mfm_spin_" style="display: inline-block; animation: 1.5s linear 0s infinite normal none running mfm-spinY;">🍮</span>]
|
||||||
|
|
||||||
assert Encoder.to_html(input_tree_z_left) == expected_tree_z_left
|
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_x_left) == expected_tree_x_left
|
||||||
|
@ -414,7 +414,7 @@ defmodule MfmParser.EncoderTest do
|
||||||
]
|
]
|
||||||
|
|
||||||
expected =
|
expected =
|
||||||
"It's not <span class=\"mfm\" style=\"display: inline-block; animation: 0.2s ease 0s infinite normal none running mfm-twitch;\">chocolatine</span>\nit's <span style=\"font-size: 600%\"><span class=\"mfm\" style=\"display: inline-block; animation: 1s linear 0s infinite normal none running mfm-spin;\">pain</span> <span class=\"mfm\" style=\"display: inline-block; animation: 2s linear 0s infinite normal none running mfm-rainbow;\">au</span> <span class=\"mfm\" style=\"display: inline-block; animation: 0.5s linear 0s infinite normal none running mfm-jump;\">chocolat</span></span>"
|
"It's not <span class=\"mfm\" style=\"display: inline-block; animation: 0.2s ease 0s infinite normal none running mfm-twitch;\">chocolatine</span>\nit's <span style=\"font-size: 600%\" class=\"mfm _mfm_x4_\"><span class=\"mfm _mfm_spin_\" style=\"display: inline-block; animation: 1s linear 0s infinite normal none running mfm-spin;\">pain</span> <span class=\"mfm\" style=\"display: inline-block; animation: 2s linear 0s infinite normal none running mfm-rainbow;\">au</span> <span class=\"mfm _mfm_jump_\" style=\"display: inline-block; animation: 0.5s linear 0s infinite normal none running mfm-jump;\">chocolat</span></span>"
|
||||||
|
|
||||||
assert Encoder.to_html(input_tree) == expected
|
assert Encoder.to_html(input_tree) == expected
|
||||||
end
|
end
|
||||||
|
@ -424,7 +424,7 @@ defmodule MfmParser.EncoderTest do
|
||||||
"It's not $[twitch.speed=0.2s chocolatine]\nit's $[x4 $[spin.speed=1s pain] $[rainbow.speed=2s au] $[jump.speed=0.5s chocolat]]"
|
"It's not $[twitch.speed=0.2s chocolatine]\nit's $[x4 $[spin.speed=1s pain] $[rainbow.speed=2s au] $[jump.speed=0.5s chocolat]]"
|
||||||
|
|
||||||
expected =
|
expected =
|
||||||
"It's not <span class=\"mfm\" style=\"display: inline-block; animation: 0.2s ease 0s infinite normal none running mfm-twitch;\">chocolatine</span>\nit's <span style=\"font-size: 600%\"><span class=\"mfm\" style=\"display: inline-block; animation: 1s linear 0s infinite normal none running mfm-spin;\">pain</span> <span class=\"mfm\" style=\"display: inline-block; animation: 2s linear 0s infinite normal none running mfm-rainbow;\">au</span> <span class=\"mfm\" style=\"display: inline-block; animation: 0.5s linear 0s infinite normal none running mfm-jump;\">chocolat</span></span>"
|
"It's not <span class=\"mfm\" style=\"display: inline-block; animation: 0.2s ease 0s infinite normal none running mfm-twitch;\">chocolatine</span>\nit's <span style=\"font-size: 600%\" class=\"mfm _mfm_x4_\"><span class=\"mfm _mfm_spin_\" style=\"display: inline-block; animation: 1s linear 0s infinite normal none running mfm-spin;\">pain</span> <span class=\"mfm\" style=\"display: inline-block; animation: 2s linear 0s infinite normal none running mfm-rainbow;\">au</span> <span class=\"mfm _mfm_jump_\" style=\"display: inline-block; animation: 0.5s linear 0s infinite normal none running mfm-jump;\">chocolat</span></span>"
|
||||||
|
|
||||||
assert Encoder.to_html(input) == expected
|
assert Encoder.to_html(input) == expected
|
||||||
end
|
end
|
||||||
|
|
Loading…
Reference in a new issue