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
"html": "To determine the <dfn class=\"dfn-paneled\" data-dfn-type=\"dfn\" data-noexport=\"\" id=\"used-offset-distance\">used offset distance</dfn> for a given <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-path\" id=\"ref-for-offset-path①⑧\">offset path</a> and <dfn class=\"dfn-paneled\" data-dfn-type=\"dfn\" data-noexport=\"\" id=\"offset-distance\">offset distance</dfn>:",
10
+
"html": "To determine the <dfn class=\"dfn-paneled has-dfn-panel\" data-dfn-type=\"dfn\" data-noexport=\"\" id=\"used-offset-distance\" role=\"button\" aria-expanded=\"false\" tabindex=\"0\">used offset distance</dfn> for a given <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-path\" id=\"ref-for-offset-path②③\">offset path</a> and <dfn class=\"dfn-paneled has-dfn-panel\" data-dfn-type=\"dfn\" data-noexport=\"\" id=\"offset-distance\" role=\"button\" aria-expanded=\"false\" tabindex=\"0\">offset distance</dfn>:",
11
11
"rationale": "let",
12
12
"steps": [
13
13
{
14
-
"html": "<p>Let the <dfn class=\"dfn-paneled\" data-dfn-type=\"dfn\" data-noexport=\"\" id=\"total-length\">total length</dfn> be the total length of <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-path\" id=\"ref-for-offset-path①⑨\">offset path</a> with all sub-paths.</p>"
14
+
"html": "<p>Let the <dfn class=\"dfn-paneled has-dfn-panel\" data-dfn-type=\"dfn\" data-noexport=\"\" id=\"total-length\" role=\"button\" aria-expanded=\"false\" tabindex=\"0\">total length</dfn> be the total length of <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-path\" id=\"ref-for-offset-path②④\">offset path</a> with all sub-paths.</p>"
15
15
},
16
16
{
17
17
"html": "<p>Convert <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-distance\" id=\"ref-for-offset-distance\">offset distance</a> to pixels, with 100% being converted to <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#total-length\" id=\"ref-for-total-length\">total length</a>.</p>"
18
18
},
19
19
{
20
-
"html": "<dl class=\"switch\">\n <dt data-md=\"\">If <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-path\" id=\"ref-for-offset-path②⓪\">offset path</a> is an unbounded ray:\n </dt><dd data-md=\"\">\n <p>Let <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#used-offset-distance\" id=\"ref-for-used-offset-distance①\">used offset distance</a> be equal to <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-distance\" id=\"ref-for-offset-distance①\">offset distance</a>.</p>\n </dd><dt data-md=\"\">Otherwise if <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-path\" id=\"ref-for-offset-path②①\">offset path</a> is an <a class=\"production css\" data-link-type=\"type\" href=\"https://www.w3.org/TR/css3-values/#angle-value\" id=\"ref-for-angle-value①⓪\" title=\"Expands to: turn | rad | grad | deg\"><angle></a> path with contain:\n </dt><dd data-md=\"\">\n <p>Let <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#used-offset-distance\" id=\"ref-for-used-offset-distance②\">used offset distance</a> be equal to <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-distance\" id=\"ref-for-offset-distance②\">offset distance</a>, clamped so that the box lies entirely within the path.</p>\n </dd><dt data-md=\"\">If <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-path\" id=\"ref-for-offset-path②②\">offset path</a> is any other unclosed interval:\n </dt><dd data-md=\"\">\n <p>Let <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#used-offset-distance\" id=\"ref-for-used-offset-distance③\">used offset distance</a> be equal to <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-distance\" id=\"ref-for-offset-distance③\">offset distance</a> clamped by 0 and the total length of the path.</p>\n </dd><dt data-md=\"\">Otherwise <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-path\" id=\"ref-for-offset-path②③\">offset path</a> is a closed loop:\n </dt><dd data-md=\"\">\n <p>Let <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#used-offset-distance\" id=\"ref-for-used-offset-distance④\">used offset distance</a> be equal to <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-distance\" id=\"ref-for-offset-distance④\">offset distance</a> modulus the total length of the path. If the total length of the path is 0, <span id=\"ref-for-used-offset-distance⑤\">used offset distance</span> is also 0.</p>\n </dd></dl>",
20
+
"html": "<dl class=\"switch\">\n <dt data-md=\"\">If <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-path\" id=\"ref-for-offset-path②⑤\">offset path</a> is an unbounded ray:\n </dt><dd data-md=\"\">\n <p>Let <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#used-offset-distance\" id=\"ref-for-used-offset-distance①\">used offset distance</a> be equal to <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-distance\" id=\"ref-for-offset-distance①\">offset distance</a>.</p>\n </dd><dt data-md=\"\">Otherwise if <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-path\" id=\"ref-for-offset-path②⑥\">offset path</a> is an <a class=\"production css\" data-link-type=\"type\" href=\"https://www.w3.org/TR/css-values-4/#angle-value\" id=\"ref-for-angle-value⑧\" title=\"Expands to: deg | grad | rad | turn\"><angle></a> path with contain:\n </dt><dd data-md=\"\">\n <p>Let <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#used-offset-distance\" id=\"ref-for-used-offset-distance②\">used offset distance</a> be equal to <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-distance\" id=\"ref-for-offset-distance②\">offset distance</a>, clamped so that the box lies entirely within the path.</p>\n </dd><dt data-md=\"\">If <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-path\" id=\"ref-for-offset-path②⑦\">offset path</a> is any other unclosed interval:\n </dt><dd data-md=\"\">\n <p>Let <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#used-offset-distance\" id=\"ref-for-used-offset-distance③\">used offset distance</a> be equal to <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-distance\" id=\"ref-for-offset-distance③\">offset distance</a> clamped by 0 and the total length of the path.</p>\n </dd><dt data-md=\"\">Otherwise <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-path\" id=\"ref-for-offset-path②⑧\">offset path</a> is a closed loop:\n </dt><dd data-md=\"\">\n <p>Let <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#used-offset-distance\" id=\"ref-for-used-offset-distance④\">used offset distance</a> be equal to <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-distance\" id=\"ref-for-offset-distance④\">offset distance</a> modulo the total length of the path. If the total length of the path is 0, <span id=\"ref-for-used-offset-distance⑤\">used offset distance</span> is also 0.</p>\n \n </dd></dl>",
21
21
"rationale": ".switch",
22
22
"steps": [
23
23
{
@@ -37,40 +37,13 @@
37
37
},
38
38
{
39
39
"case": "Otherwise offset path is a closed loop:",
40
-
"html": "<p>Let <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#used-offset-distance\" id=\"ref-for-used-offset-distance④\">used offset distance</a> be equal to <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-distance\" id=\"ref-for-offset-distance④\">offset distance</a> modulus the total length of the path. If the total length of the path is 0, <span id=\"ref-for-used-offset-distance⑤\">used offset distance</span> is also 0.</p>"
40
+
"html": "<p>Let <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#used-offset-distance\" id=\"ref-for-used-offset-distance④\">used offset distance</a> be equal to <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-distance\" id=\"ref-for-offset-distance④\">offset distance</a> modulo the total length of the path. If the total length of the path is 0, <span id=\"ref-for-used-offset-distance⑤\">used offset distance</span> is also 0.</p>"
41
41
}
42
42
]
43
43
}
44
44
]
45
45
}
46
46
]
47
-
},
48
-
{
49
-
"html": "",
50
-
"rationale": ".switch",
51
-
"steps": [
52
-
{
53
-
"html": "<p>Create a supplemental transformation matrix <dfn class=\"dfn-paneled\" data-dfn-type=\"dfn\" data-noexport=\"\" id=\"t1\">T1</dfn> for the local coordinate system of the box.</p>"
54
-
},
55
-
{
56
-
"html": "<p>Find the <a class=\"css\" data-link-type=\"maybe\" href=\"https://www.w3.org/TR/motion-1/#valdef-offsetpath-initial-position\" id=\"ref-for-valdef-offsetpath-initial-position①⑦\">initial position</a> of the <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-path\" id=\"ref-for-offset-path③②\">offset path</a> specified by <a class=\"property\" data-link-type=\"propdesc\" href=\"https://www.w3.org/TR/motion-1/#propdef-offset-position\" id=\"ref-for-propdef-offset-position①⑨\">offset-position</a> as <dfn class=\"dfn-paneled\" data-dfn-type=\"dfn\" data-noexport=\"\" id=\"t2\">T2</dfn>.</p>"
57
-
},
58
-
{
59
-
"html": "<p>Let <dfn class=\"dfn-paneled\" data-dfn-type=\"dfn\" data-noexport=\"\" id=\"p\">P</dfn> be the point at the <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#used-offset-distance\" id=\"ref-for-used-offset-distance⑥\">used offset distance</a> along the <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#offset-path\" id=\"ref-for-offset-path③③\">offset path</a>.</p>"
60
-
},
61
-
{
62
-
"html": "<p>Find the translation of the box such that its <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#anchor-point\" id=\"ref-for-anchor-point①①\">anchor point</a> is placed at <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#p\" id=\"ref-for-p\">P</a>, and apply that to <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#t2\" id=\"ref-for-t2\">T2</a>.</p>"
63
-
},
64
-
{
65
-
"html": "<p>Post-multiply <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#t2\" id=\"ref-for-t2①\">T2</a> by the rotation specified by <a class=\"property\" data-link-type=\"propdesc\" href=\"https://www.w3.org/TR/motion-1/#propdef-offset-rotate\" id=\"ref-for-propdef-offset-rotate⑨\">offset-rotate</a>.</p>"
"html": "<p>Post-multiply <a data-link-type=\"dfn\" href=\"https://www.w3.org/TR/motion-1/#t1\" id=\"ref-for-t1①\">T1</a> to the local coordinate system of the box.</p>"
0 commit comments