Web-Projects/blog-static
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Extract loading and closing bergamot into a helper script.

Browse Source 
Signed-off-by: Danila Fedorin <danila.fedorin@gmail.com>
This commit is contained in:
Danila Fedorin 2023-12-27 23:30:16 -08:00
parent 7e8870de6c
commit d7d7254a7b
2 changed files with 41 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
layouts/shortcodes/bergamot_js_css.html
View File

@ -75,10 +75,49 @@ const renderRules =
LatexSym @ latex(?s, ?l) <- sym(?s), tostring(?s, ?l_1), join(["\\\\text{", ?l_1,"}"], ?l); LatexSym @ latex(?s, ?l) <- sym(?s), tostring(?s, ?l_1), join(["\\\\text{", ?l_1,"}"], ?l);
LatexCall @ latex(?c, ?l) <- call(?c, ?n, ?ts), nonempty(?ts), latexlist(?ts, ?lts_1), intercalate(", ", ?lts_1, ?lts_2), join(?lts_2, ?lts_3), join(["\\\\text{", ?n, "}", "(", ?lts_3, ")"], ?l); LatexCall @ latex(?c, ?l) <- call(?c, ?n, ?ts), nonempty(?ts), latexlist(?ts, ?lts_1), intercalate(", ", ?lts_1, ?lts_2), join(?lts_2, ?lts_3), join(["\\\\text{", ?n, "}", "(", ?lts_3, ")"], ?l);
`; `;
function runBergamot(nodeId, inputPrompt, rules, renderRules, query) {
const loadedWidgets = {};
const getButtons = (inputGroup) => {
return {
play: inputGroup.querySelector(".bergamot-play"),
reset: inputGroup.querySelector(".bergamot-reset"),
close: inputGroup.querySelector(".bergamot-close"),
}
}
const setRunning = (inputGroup, running) => {
if (inputGroup !== null) {
const buttons = getButtons(inputGroup);
if (buttons.play) buttons.play.classList.toggle("bergamot-hidden", running);
if (buttons.reset) buttons.reset.classList.toggle("bergamot-hidden", !running);
if (buttons.close) buttons.close.classList.toggle("bergamot-hidden", !running);
}
}
window.Bergamot = {};
window.Bergamot.run = (inputGroup, nodeId, inputPrompt, rules, renderRules, query) => {
var app = Elm.Main.init({ var app = Elm.Main.init({
node: document.getElementById(nodeId), node: document.getElementById(nodeId),
flags: { renderRules, inputRules: inputPrompt, rules , query } flags: { renderRules, inputRules: inputPrompt, rules , query }
}); });
loadedWidgets[nodeId] = { app, parentNode: inputGroup ? inputGroup.parentElement : null };
setRunning(inputGroup, true);
};
window.Bergamot.runPreset = (inputGroup, nodeId, presetName) => {
const preset = window.Bergamot.presets[presetName];
window.Bergamot.run(inputGroup, nodeId, preset.inputPrompt, preset.rules, renderRules, preset.query || "");
};
window.Bergamot.close = (inputGroup, nodeId) => {
if (!(nodeId in loadedWidgets)) return;
const placeholderDiv = document.createElement('div');
placeholderDiv.id = nodeId;
const widget = loadedWidgets[nodeId];
const elmRoot = widget.parentNode.querySelector(".bergamot-root");
elmRoot.replaceWith(placeholderDiv)
delete loadedWidgets[nodeId];
setRunning(inputGroup, false);
} }
window.Bergamot.presets = {};
</script> </script>

2
layouts/shortcodes/bergamot_widget.html
View File

@ -1,4 +1,4 @@
<div id="{{ .Get "id" }}"></div> <div id="{{ .Get "id" }}"></div>
<script> <script>
runBergamot('{{ .Get "id" }}', '{{ .Get "prompt" }}', '{{ .Inner }}', renderRules, '{{ .Get "query" }}'); window.Bergamot.run(null, '{{ .Get "id" }}', '{{ .Get "prompt" }}', '{{ .Inner }}', renderRules, '{{ .Get "query" }}');
</script> </script>