2022-06-26 18:40:12 +00:00
|
|
|
function createInputs(article) {
|
|
|
|
inputs = ''
|
2022-08-17 05:01:43 +00:00
|
|
|
article.tokens.forEach(function(token) {
|
2022-06-26 18:40:12 +00:00
|
|
|
if(token.adlib_tag) {
|
|
|
|
inputs += `
|
|
|
|
<p>
|
2023-01-09 05:28:35 +00:00
|
|
|
<label for="token-${token.id}">${token.adlib_tag}</label>
|
|
|
|
<input type="text" id="token-${token.id}" class="token-input" name="token-${token.id}">
|
2022-06-26 18:40:12 +00:00
|
|
|
</p>
|
|
|
|
`
|
|
|
|
}
|
|
|
|
})
|
|
|
|
document.getElementById('inputs').innerHTML = inputs
|
2023-01-09 05:28:35 +00:00
|
|
|
|
|
|
|
const urlParams = new URL(window.location.toLocaleString()).searchParams
|
|
|
|
if(urlParams.has('stored')) {
|
|
|
|
try {
|
|
|
|
let storedInputs = JSON.parse(atob(urlParams.get('stored')))
|
|
|
|
|
|
|
|
if(storedInputs.h !== article.hash) {
|
|
|
|
showError("Unable to use shared link because it's for an old article, and well, time makes fools of us all.")
|
|
|
|
}
|
|
|
|
else {
|
|
|
|
document.querySelectorAll('.token-input').forEach(function(tokenInput) {
|
|
|
|
let index = tokenInput.id.split('-')[1]
|
|
|
|
tokenInput.value = storedInputs.i[index]
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
catch(err) {
|
|
|
|
showError("Unable to parse shared link.")
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
function showError(errorMessage) {
|
|
|
|
errorDiv = document.getElementById('error')
|
|
|
|
errorDiv.innerHTML = errorMessage;
|
|
|
|
errorDiv.style.display = 'block'
|
2022-06-26 18:40:12 +00:00
|
|
|
}
|
|
|
|
|
2023-01-09 05:28:35 +00:00
|
|
|
|
|
|
|
function makeSharableLink(article) {
|
|
|
|
let userInputs = {}
|
|
|
|
document.querySelectorAll('.token-input').forEach(function(tokenInput) {
|
|
|
|
let index = tokenInput.id.split('-')[1]
|
|
|
|
userInputs[index] = tokenInput.value
|
|
|
|
});
|
|
|
|
|
|
|
|
let storedInputs = {h: article.hash, i: userInputs}
|
|
|
|
let url = new URL(window.location.toLocaleString())
|
|
|
|
url.searchParams.set('stored', btoa(JSON.stringify(storedInputs)))
|
|
|
|
return(url.toLocaleString())
|
|
|
|
}
|
|
|
|
|
|
|
|
|
2022-06-26 18:40:12 +00:00
|
|
|
function showArticle(article) {
|
2022-08-19 05:18:00 +00:00
|
|
|
const noSpaceBeforeTags = new Set(['.', ',', ')', ';', ':', '!', '?', "''", 'POS'])
|
|
|
|
const noSpaceBeforeTokens = new Set(["n't", ']'])
|
|
|
|
const noSpaceAfterTags = new Set(['(', '``'])
|
|
|
|
const noSpaceAfterTokens = new Set(['['])
|
|
|
|
|
2022-08-19 05:27:05 +00:00
|
|
|
document.getElementById('title').innerHTML = article.title
|
2023-01-09 05:28:35 +00:00
|
|
|
document.getElementById('original-article-link').href = article.url
|
2022-08-19 05:27:05 +00:00
|
|
|
|
|
|
|
let output = ''
|
|
|
|
let spaceBefore = false
|
|
|
|
article.tokens.forEach(function(token) {
|
2022-08-19 05:18:00 +00:00
|
|
|
if(spaceBefore && !noSpaceBeforeTags.has(token.tag) && !noSpaceBeforeTokens.has(token.token)) {
|
|
|
|
output += ' '
|
|
|
|
}
|
|
|
|
spaceBefore = true
|
|
|
|
|
2023-01-09 05:28:35 +00:00
|
|
|
let adlibInput = document.getElementById(`token-${token.id}`);
|
2022-08-19 05:18:00 +00:00
|
|
|
if(adlibInput && adlibInput.value) {
|
|
|
|
output += `<strong>${adlibInput.value}</strong>`
|
2022-06-26 18:40:12 +00:00
|
|
|
}
|
|
|
|
else {
|
2022-08-19 05:18:00 +00:00
|
|
|
output += `${token.token}`
|
|
|
|
}
|
|
|
|
|
|
|
|
if(noSpaceAfterTags.has(token.tag) || noSpaceAfterTokens.has(token.token)) {
|
|
|
|
spaceBefore = false
|
2022-06-26 18:40:12 +00:00
|
|
|
}
|
|
|
|
})
|
2022-08-19 05:27:05 +00:00
|
|
|
|
2022-08-17 05:01:43 +00:00
|
|
|
document.getElementById('summary').innerHTML = output
|
2023-01-09 05:28:35 +00:00
|
|
|
document.getElementById('sharable-link').href = makeSharableLink(article)
|
2022-08-17 05:01:43 +00:00
|
|
|
|
|
|
|
document.getElementById('article').classList.add('visible')
|
2022-06-26 18:40:12 +00:00
|
|
|
}
|
|
|
|
|
2023-01-09 05:28:35 +00:00
|
|
|
|
2022-06-26 18:40:12 +00:00
|
|
|
createInputs(article)
|
|
|
|
|
|
|
|
document.addEventListener('click', function (event) {
|
|
|
|
if (event.target.matches('#show-article')) {
|
|
|
|
event.preventDefault()
|
|
|
|
showArticle(article)
|
|
|
|
}
|
|
|
|
}, false);
|
|
|
|
|