Skip to content

Commit fb4d579

Browse files
MoveIt anchor links for Markdown content (#775)
1 parent 9ab16b3 commit fb4d579

File tree

7 files changed

+262
-3
lines changed

7 files changed

+262
-3
lines changed

_includes/anchor-headings.html

+172
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,172 @@
1+
{% capture headingsWorkspace %}
2+
{% comment %}
3+
Copyright (c) 2018 Vladimir "allejo" Jimenez
4+
5+
Permission is hereby granted, free of charge, to any person
6+
obtaining a copy of this software and associated documentation
7+
files (the "Software"), to deal in the Software without
8+
restriction, including without limitation the rights to use,
9+
copy, modify, merge, publish, distribute, sublicense, and/or sell
10+
copies of the Software, and to permit persons to whom the
11+
Software is furnished to do so, subject to the following
12+
conditions:
13+
14+
The above copyright notice and this permission notice shall be
15+
included in all copies or substantial portions of the Software.
16+
17+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
18+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
19+
OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
20+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
21+
HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
22+
WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
23+
FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
24+
OTHER DEALINGS IN THE SOFTWARE.
25+
{% endcomment %}
26+
{% comment %}
27+
Version 1.0.12
28+
https://github.com/allejo/jekyll-anchor-headings
29+
30+
"Be the pull request you wish to see in the world." ~Ben Balter
31+
32+
Usage:
33+
{% include anchor_headings.html html=content anchorBody="#" %}
34+
35+
Parameters:
36+
* html (string) - the HTML of compiled markdown generated by kramdown in Jekyll
37+
38+
Optional Parameters:
39+
* beforeHeading (bool) : false - Set to true if the anchor should be placed _before_ the heading's content
40+
* headerAttrs (string) : '' - Any custom HTML attributes that will be added to the heading tag; you may NOT use `id`;
41+
the `%heading%` and `%html_id%` placeholders are available
42+
* anchorAttrs (string) : '' - Any custom HTML attributes that will be added to the `<a>` tag; you may NOT use `href`, `class` or `title`;
43+
the `%heading%` and `%html_id%` placeholders are available
44+
* anchorBody (string) : '' - The content that will be placed inside the anchor; the `%heading%` placeholder is available
45+
* anchorClass (string) : '' - The class(es) that will be used for each anchor. Separate multiple classes with a space
46+
* anchorTitle (string) : '' - The `title` attribute that will be used for anchors
47+
* h_min (int) : 1 - The minimum header level to build an anchor for; any header lower than this value will be ignored
48+
* h_max (int) : 6 - The maximum header level to build an anchor for; any header greater than this value will be ignored
49+
* bodyPrefix (string) : '' - Anything that should be inserted inside of the heading tag _before_ its anchor and content
50+
* bodySuffix (string) : '' - Anything that should be inserted inside of the heading tag _after_ its anchor and content
51+
* generateId (true) : false - Set to true if a header without id should generate an id to use.
52+
53+
Output:
54+
The original HTML with the addition of anchors inside of all of the h1-h6 headings.
55+
{% endcomment %}
56+
57+
{% assign minHeader = include.h_min | default: 1 %}
58+
{% assign maxHeader = include.h_max | default: 6 %}
59+
{% assign beforeHeading = include.beforeHeading %}
60+
{% assign headerAttrs = include.headerAttrs %}
61+
{% assign nodes = include.html | split: '<h' %}
62+
63+
{% capture edited_headings %}{% endcapture %}
64+
65+
{% for _node in nodes %}
66+
{% capture node %}{{ _node | strip }}{% endcapture %}
67+
68+
{% if node == "" %}
69+
{% continue %}
70+
{% endif %}
71+
72+
{% assign nextChar = node | replace: '"', '' | strip | slice: 0, 1 %}
73+
{% assign headerLevel = nextChar | times: 1 %}
74+
75+
<!-- If the level is cast to 0, it means it's not a h1-h6 tag, so let's see if we need to fix it -->
76+
{% if headerLevel == 0 %}
77+
<!-- Split up the node based on closing angle brackets and get the first one. -->
78+
{% assign firstChunk = node | split: '>' | first %}
79+
80+
<!-- If the first chunk does NOT contain a '<', that means we've broken another HTML tag that starts with 'h' -->
81+
{% unless firstChunk contains '<' %}
82+
{% capture node %}<h{{ node }}{% endcapture %}
83+
{% endunless %}
84+
85+
{% capture edited_headings %}{{ edited_headings }}{{ node }}{% endcapture %}
86+
{% continue %}
87+
{% endif %}
88+
89+
{% capture _closingTag %}</h{{ headerLevel }}>{% endcapture %}
90+
{% assign _workspace = node | split: _closingTag %}
91+
{% capture _hAttrToStrip %}{{ _workspace[0] | split: '>' | first }}>{% endcapture %}
92+
{% assign header = _workspace[0] | replace: _hAttrToStrip, '' %}
93+
{% assign escaped_header = header | strip_html | strip %}
94+
95+
{% assign _classWorkspace = _workspace[0] | split: 'class="' %}
96+
{% assign _classWorkspace = _classWorkspace[1] | split: '"' %}
97+
{% assign _html_class = _classWorkspace[0] %}
98+
99+
{% if _html_class contains "no_anchor" %}
100+
{% assign skip_anchor = true %}
101+
{% else %}
102+
{% assign skip_anchor = false %}
103+
{% endif %}
104+
105+
{% assign _idWorkspace = _workspace[0] | split: 'id="' %}
106+
{% if _idWorkspace[1] %}
107+
{% assign _idWorkspace = _idWorkspace[1] | split: '"' %}
108+
{% assign html_id = _idWorkspace[0] %}
109+
{% elsif include.generateId %}
110+
<!-- If the header did not have an id we create one. -->
111+
{% assign html_id = escaped_header | slugify %}
112+
{% if html_id == "" %}
113+
{% assign html_id = false %}
114+
{% endif %}
115+
{% capture headerAttrs %}{{ headerAttrs }} id="%html_id%"{% endcapture %}
116+
{% endif %}
117+
118+
<!-- Build the anchor to inject for our heading -->
119+
{% capture anchor %}{% endcapture %}
120+
121+
{% if skip_anchor == false and html_id and headerLevel >= minHeader and headerLevel <= maxHeader %}
122+
{% if headerAttrs %}
123+
{% capture _hAttrToStrip %}{{ _hAttrToStrip | split: '>' | first }} {{ headerAttrs | replace: '%heading%', escaped_header | replace: '%html_id%', html_id }}>{% endcapture %}
124+
{% endif %}
125+
126+
{% capture anchor %}href="#{{ html_id }}"{% endcapture %}
127+
128+
{% if include.anchorClass %}
129+
{% capture anchor %}{{ anchor }} class="{{ include.anchorClass }}"{% endcapture %}
130+
{% endif %}
131+
132+
{% if include.anchorTitle %}
133+
{% capture anchor %}{{ anchor }} title="{{ include.anchorTitle | replace: '%heading%', escaped_header }}"{% endcapture %}
134+
{% endif %}
135+
136+
{% if include.anchorAttrs %}
137+
{% capture anchor %}{{ anchor }} {{ include.anchorAttrs | replace: '%heading%', escaped_header | replace: '%html_id%', html_id }}{% endcapture %}
138+
{% endif %}
139+
140+
{% capture anchor %}<a {{ anchor }}>{{ include.anchorBody | replace: '%heading%', escaped_header | default: '' }}</a>{% endcapture %}
141+
142+
<!-- In order to prevent adding extra space after a heading, we'll let the 'anchor' value contain it -->
143+
{% if beforeHeading %}
144+
{% capture anchor %}{{ anchor }} {% endcapture %}
145+
{% else %}
146+
{% capture anchor %} {{ anchor }}{% endcapture %}
147+
{% endif %}
148+
{% endif %}
149+
150+
{% capture new_heading %}
151+
<h{{ _hAttrToStrip }}
152+
{{ include.bodyPrefix }}
153+
{% if beforeHeading %}
154+
{{ anchor }}{{ header }}
155+
{% else %}
156+
{{ header }}{{ anchor }}
157+
{% endif %}
158+
{{ include.bodySuffix }}
159+
</h{{ headerLevel }}>
160+
{% endcapture %}
161+
162+
<!--
163+
If we have content after the `</hX>` tag, then we'll want to append that here so we don't lost any content.
164+
-->
165+
{% assign chunkCount = _workspace | size %}
166+
{% if chunkCount > 1 %}
167+
{% capture new_heading %}{{ new_heading }}{{ _workspace | last }}{% endcapture %}
168+
{% endif %}
169+
170+
{% capture edited_headings %}{{ edited_headings }}{{ new_heading }}{% endcapture %}
171+
{% endfor %}
172+
{% endcapture %}{% assign headingsWorkspace = '' %}{{ edited_headings | strip }}

_includes/moveit-anchors.html

+43
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
<!-- MoveIt icon anchor, adapted from https://github.com/allejo/jekyll-anchor-headings/wiki/Examples -->
2+
{% include anchor-headings.html html=include.html beforeHeading=true
3+
anchorBody="<svg class='anchor' viewBox='0 0 76 99' version='1.1' width='16' aria-hidden='true'>
4+
<path fill-rule='evenodd'
5+
d='M 10.74,95.45
6+
C 14.33,95.45 17.24,92.54 17.24,88.96
7+
17.24,85.37 14.33,82.46 10.74,82.46
8+
7.16,82.46 4.25,85.36 4.25,88.95
9+
4.25,88.95 4.25,88.95 4.25,88.96
10+
4.25,92.54 7.16,95.45 10.74,95.45
11+
10.74,95.45 10.74,95.45 10.74,95.45
12+
10.74,95.45 10.74,95.45 10.74,95.45 Z
13+
M 12.74,16.50
14+
C 16.33,16.50 19.24,13.59 19.24,10.00
15+
19.24,6.42 16.33,3.51 12.74,3.51
16+
9.16,3.51 6.25,6.41 6.25,9.99
17+
6.25,10.00 6.25,10.00 6.25,10.00
18+
6.25,13.59 9.16,16.50 12.74,16.50
19+
12.74,16.50 12.74,16.50 12.74,16.50
20+
12.74,16.50 12.74,16.50 12.74,16.50 Z
21+
M 52.72,57.48
22+
C 56.31,57.48 59.22,54.57 59.22,50.98
23+
59.22,47.39 56.31,44.48 52.72,44.48
24+
49.13,44.48 46.23,47.39 46.23,50.98
25+
46.23,54.57 49.13,57.48 52.72,57.48
26+
52.72,57.48 52.72,57.48 52.72,57.48 Z
27+
M 60.41,43.53
28+
C 61.97,45.19 62.93,47.42 62.93,49.88
29+
62.93,51.17 62.66,52.41 62.18,53.53
30+
62.18,53.53 76.27,53.53 76.27,53.53
31+
76.27,53.53 16.55,96.55 16.55,96.55
32+
14.80,98.08 12.50,99.00 9.99,99.00
33+
4.47,99.00 -0.00,94.53 -0.00,89.01
34+
-0.00,85.99 1.33,83.29 3.44,81.46
35+
3.44,81.46 39.09,50.48 39.09,50.48
36+
39.09,50.48 5.67,17.06 5.67,17.06
37+
3.86,15.25 2.74,12.75 2.74,9.99
38+
2.74,4.47 7.22,-0.00 12.74,-0.00
39+
15.50,-0.00 18.00,1.12 19.81,2.93
40+
19.81,2.93 60.41,43.53 60.41,43.53 Z'>
41+
</path>
42+
</svg>"
43+
%}

_layouts/contribution-guide.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
<div class='row no-gutters'>
1010
{% include contribution-guide-nav.html %}
1111
<div class="rectangle-boarder-big col-9 col-sm-9">
12-
{{ content }}
12+
{% include moveit-anchors.html html=content %}
1313
</div>
1414
</div>
1515
</div>

_layouts/install.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
<div class='row no-gutters'>
1010
{% include install-nav.html %}
1111
<div class="rectangle-boarder-big col-9 col-sm-9">
12-
{{ content }}
12+
{% include moveit-anchors.html html=content %}
1313
</div>
1414
</div>
1515
</div>

_layouts/page.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
<div class="sub-pages section">
77
<div class='row'>
88
<div class='col-sm-12'>
9-
{{ content }}
9+
{% include moveit-anchors.html html=content %}
1010
</div>
1111
</div>
1212
</div>

_sass/_moveit-anchors.scss

+43
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
/* Layout for proper anchor positioning used by anchor_headings.html.
2+
See https://github.com/allejo/jekyll-anchor-headings/wiki/Examples
3+
*/
4+
5+
h1 {
6+
text-indent: -12px;
7+
}
8+
9+
h2 {
10+
text-indent: -10px;
11+
}
12+
13+
h3 {
14+
text-indent: -8px;
15+
}
16+
17+
h4 {
18+
text-indent: -6px;
19+
}
20+
21+
h5 {
22+
text-indent: -4px;
23+
}
24+
25+
h6 {
26+
text-indent: -2px;
27+
}
28+
29+
h1 .anchor, h2 .anchor, h3 .anchor, h4 .anchor, h5 .anchor, h6 .anchor {
30+
visibility: hidden;
31+
}
32+
33+
h1:hover .anchor, h2:hover .anchor, h3:hover .anchor, h4:hover .anchor, h5:hover .anchor, h6:hover .anchor {
34+
visibility: visible;
35+
}
36+
37+
.anchor {
38+
fill: currentColor;
39+
padding: 0;
40+
margin-left: -16px;
41+
margin-bottom: 5px;
42+
vertical-align: middle;
43+
}

assets/css/main.scss

+1
Original file line numberDiff line numberDiff line change
@@ -23,3 +23,4 @@
2323
@import 'support';
2424
@import 'contributing';
2525
@import 'roadmap';
26+
@import 'moveit-anchors';

0 commit comments

Comments
 (0)