0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2025-12-27 11:32:38 +00:00

Change {{ span to Marked.js extension

This commit is contained in:
Trevor Buckner
2021-07-10 19:01:27 -04:00
parent efd0fd1f4a
commit 63ba9f4fb9

View File

@@ -19,12 +19,62 @@ renderer.paragraph = function(text){
let match;
if(text.startsWith('<div') || text.startsWith('</div'))
return `${text}`;
else if(match = text.match(/(^|^.*?\n)<span class="inline([^>]*><\/span>)$/))
return `<p>${match[1]}</p><span class="inline-block"${match[2]}`;
else if(match = text.match(/(^|^.*?\n)<span class="inline(.*?<\/span>)$/)) {
return `${match[1].trim() ? `<p>${match[1]}</p>` : ''}<span class="inline-block${match[2]}`; }
else
return `<p>${text}</p>\n`;
};
const mustacheSpans = {
name: 'mustacheSpans',
level: 'inline', // Is this a block-level or inline-level tokenizer?
start(src) { return src.match(/{{[^{]/)?.index; }, // Hint to Marked.js to stop and check for a match
tokenizer(src, tokens) {
const completeSpan = /^{{[^\n]*}}/; // Regex for the complete token
const inlineRegex = /{{(?:="[\w,\-. ]*"|[^"'{}}\s])*\s*|}}/g;
const match = completeSpan.exec(src);
if (match) {
//Find closing delimiter
let blockCount = 0;
let tags = '';
let endIndex = 0;
let delim;
while (delim = inlineRegex.exec(match[0])) {
if(delim[0].startsWith('{{')) {
tags = tags || ' ' + processStyleTags(delim[0].substring(2));
blockCount++;
}
else if(delim[0] == '}}' && blockCount !== 0) {
blockCount--;
if(blockCount == 0) {
endIndex = inlineRegex.lastIndex;
break;
}
}
}
if(endIndex) {
const raw = src.slice(0, endIndex);
const text = raw.slice((raw.indexOf(' ')+1) || -2, -2)
return { // Token to generate
type: 'mustacheSpans', // Should match "name" above
raw: raw, // Text to consume from the source
text: text, // Additional custom properties
tags: tags,
tokens: this.inlineTokens(text) // inlineTokens to process **bold**, *italics*, etc.
}
}
}
},
renderer(token) {
console.log(token);
return `<span class="inline${token.tags}>${this.parseInline(token.tokens)}</span>`; // parseInline to turn child tokens into HTML
}
};
Markdown.use({extensions : [mustacheSpans]});
// Mustache-style Divs {{class \n content ... \n}}
let blockCount = 0;
const blockRegex = /^ *{{(?:="[\w,\-. ]*"|[^"'\s])*$|^ *}}$/gm;
@@ -35,32 +85,10 @@ renderer.text = function(text){
const newText = text.replaceAll('&quot;', '"');
let matches;
if(matches = newText.match(inlineFullRegex)) {
//SPAN - INLINE
matches = newText.match(inlineRegex);
let matchIndex = 0;
const res = _.reduce(newText.split(inlineRegex), (r, splitText)=>{
if(splitText) r.push(Markdown.parseInline(splitText, { renderer: renderer }));
const block = matches[matchIndex] ? matches[matchIndex].trimLeft() : '';
if(block && block.startsWith('{{')) {
const values = processStyleTags(block.substring(2));
r.push(`<span class="inline ${values}>`);
blockCount++;
} else if(block == '}}' && blockCount !== 0){
r.push('</span>');
blockCount--;
}
matchIndex++;
return r;
}, []).join('');
return `${res}`;
} else if(matches = newText.match(blockRegex)) {
if(matches = newText.match(blockRegex)) {
//DIV - BLOCK-LEVEL
console.log({match: matches});
console.log({newText: newText});
let matchIndex = 0;
const res = _.reduce(newText.split(blockRegex), (r, splitText)=>{
if(splitText) r.push(Markdown.parseInline(splitText, { renderer: renderer }));
@@ -177,7 +205,7 @@ const processStyleTags = (string)=>{
const id = _.remove(tags, (tag)=>tag.startsWith('#')).map((tag)=>tag.slice(1))[0];
const classes = _.remove(tags, (tag)=>!tag.includes('"'));
const styles = tags.map((tag)=>tag.replace(/="(.*)"/g, ':$1;'));
return `${classes.join(' ')}" ${id ? `id="${id}"` : ''} ${styles ? `style="${styles.join(' ')}"` : ''}`;
return `${classes.join(' ')}" ${id ? `id="${id}"` : ''} ${styles.length ? `style="${styles.join(' ')}"` : ''}`;
};
module.exports = {