Move a bunch of scripts and CSS to assets so they can be processed with Hugo Pipes

Use Pipes to fingerprint and add SLI information to <script> and <link> tags.
This commit is contained in:
Eryn Wells 2022-11-07 08:35:48 -08:00
parent f8174ab27c
commit 94ea8068c9
10 changed files with 106858 additions and 4 deletions

View file

@ -0,0 +1,67 @@
{{ with partial "secure_asset.html" "scripts/lib/railroad.js" }}
import rr from "{{ .Secure.RelPermalink }}";
{{ else }}
{{ errorf "Unable to get railroad.js resource" }}
{{ end }}
class RailroadDiagramManager {
constructor() {
this.figures = new Map();
this.isCurrentlyNarrow = undefined;
this.diagramBreakpoint = window.matchMedia("(max-width: 450px)");
this.diagramBreakpoint.addEventListener("change", () => {
this.updateVisiblity();
});
}
add(svg) {
const parent = svg.parentElement;
if (!this.figures.has(parent)) {
this.figures.set(parent, []);
}
this.figures.get(parent).push(svg);
parent.removeChild(svg);
}
updateVisiblity() {
const isNarrow = this.diagramBreakpoint.matches;
if (isNarrow === this.isCurrentlyNarrow) {
return;
}
this.isCurrentlyNarrow = isNarrow;
for (let [figure, svgs] of this.figures.entries()) {
for (let svg of svgs) {
const svgHasNarrowClass = svg.classList.contains("narrow");
if (isNarrow && svgHasNarrowClass)
figure.appendChild(svg);
else if (!isNarrow && !svgHasNarrowClass)
figure.appendChild(svg);
else if (svg.parentElement === figure)
figure.removeChild(svg);
}
}
}
}
let railroadDiagramManager = new RailroadDiagramManager();
export function railroadDiagram(builder, elementID, isNarrow) {
const diagram = builder(rr);
const svg = diagram.addTo(document.getElementById(elementID));
if (isNarrow) {
svg.classList.add("narrow");
}
railroadDiagramManager.add(svg);
}
window.addEventListener("DOMContentLoaded", () => {
railroadDiagramManager.updateVisiblity();
});