f63c7f9289
* Fix Runkit tags not being activated when comment is added * Runkit tag activation was ran once, on page load. I've changed it to run on on comment preview and submit. * It was necessary to add a check to skip already activated Runkit tags. The code didn't take into account that a tag could be already processed, and would just crash. * Fix Runkit tags and add tests * Add test for previewing article with Runkit tag * "Fix CodeClimate not finding waitForRunkitAndActivateTags() * Refactor a test for readability * Make Rubocop happy * Improve test for previewing article with Runkit tag * Use one method for determining active Runkit tags * Defer loading of JS from embed.runkit.com * Add utility function dynamicallyLoadScript(url) * Switch to dynamic loading of Runkit * parsed content code block is also hidden now to avoid displaying <code /> block before runkit iframe loads. * Fix Runkit test * Remove Runkit script caching in v2 form * Use <%== instead of .html_safe in v2 form * Update app/assets/javascripts/utilities/dynamicallyLoadScript.js Co-authored-by: Nick Taylor <nick@iamdeveloper.com> Co-authored-by: Nick Taylor <nick@iamdeveloper.com>
58 lines
1.8 KiB
JavaScript
58 lines
1.8 KiB
JavaScript
/* global activateRunkitTags */
|
|
|
|
function getAndShowPreview(markdownPreviewPane, markdownEditor) {
|
|
function successCb(body) {
|
|
markdownPreviewPane.classList.toggle('preview-toggle');
|
|
markdownEditor.classList.toggle('preview-loading');
|
|
markdownEditor.classList.toggle('preview-toggle');
|
|
markdownPreviewPane.innerHTML = body.processed_html; // eslint-disable-line no-param-reassign
|
|
activateRunkitTags();
|
|
}
|
|
|
|
const payload = JSON.stringify({
|
|
comment: {
|
|
body_markdown: markdownEditor.value,
|
|
},
|
|
});
|
|
getCsrfToken()
|
|
.then(sendFetch('comment-preview', payload))
|
|
.then((response) => {
|
|
return response.json();
|
|
})
|
|
.then(successCb)
|
|
.catch((err) => {
|
|
console.log('error!'); // eslint-disable-line
|
|
console.log(err); // eslint-disable-line no-console
|
|
});
|
|
}
|
|
|
|
function handleCommentPreview(event) {
|
|
event.preventDefault();
|
|
const { form } = event.target;
|
|
const markdownEditor = form.querySelector('textarea');
|
|
|
|
if (markdownEditor.value !== '') {
|
|
const markdownPreviewPane = form.querySelector('.comment-preview-div');
|
|
const previewButton = form.querySelector('.comment-action-preview');
|
|
|
|
if (previewButton.innerHTML.indexOf('PREVIEW') > -1) {
|
|
markdownEditor.classList.toggle('preview-loading');
|
|
getAndShowPreview(markdownPreviewPane, markdownEditor);
|
|
previewButton.innerHTML = 'MARKDOWN';
|
|
} else {
|
|
markdownPreviewPane.classList.toggle('preview-toggle');
|
|
markdownEditor.classList.toggle('preview-toggle');
|
|
previewButton.innerHTML = 'PREVIEW';
|
|
}
|
|
}
|
|
}
|
|
|
|
function initializeCommentPreview() {
|
|
const previewButton = document.getElementById('preview-button');
|
|
|
|
if (!previewButton) {
|
|
return;
|
|
}
|
|
|
|
previewButton.addEventListener('click', handleCommentPreview);
|
|
}
|