Skip to content

Instantly share code, notes, and snippets.

@oncomouse
Created October 13, 2020 16:42
Show Gist options
  • Save oncomouse/022c5fcbc68ba8f60779e751ae52474e to your computer and use it in GitHub Desktop.
Save oncomouse/022c5fcbc68ba8f60779e751ae52474e to your computer and use it in GitHub Desktop.
Use Tracery in Jekyll
---
layout: tracery
---
{
"origin": "Hello, #name#.",
"name": [
"#adjective# #noun#",
"#adjective# #noun#",
"#adjective# #noun#",
"#adjective#, #adjective# #noun#"
],
"adjective": ["dear", "valued", "loyal", "weary"],
"noun": ["reader", "friend", "minion", "traveller"]
}
---
layout: default
---
<!-- Add to your "_layouts" folder -->
<div class="tracery">
<h1 class="tracery_output"></h1>
<button class="tracery_generate">Generate Again</button>
</div>
<script type="application/json" id="grammar">
{{ content }}
</script>
<script src="https://cdn.jsdelivr.net/npm/cash-dom@8.0.0/dist/cash.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/oncomouse/tracery@1.0.1/tracery.min.js"></script>
<script>
$(function() {
function generateTracery(grammar) {
return function() {
$('.tracery_output').text(grammar.flatten('#origin#'))
}
}
var grammar = tracery.createGrammar(JSON.parse($('#grammar').text()));
generateTracery(grammar)();
$('.tracery_generate').on('click', generateTracery(grammar));
})
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment