Web script cleanup

This commit is contained in:
Angelos Chalaris
2018-09-22 13:57:29 +03:00
parent 93a958c383
commit b0f695138f
2 changed files with 36 additions and 64 deletions

View File

@ -39,6 +39,39 @@ const unescapeHTML = str =>
'"': '"'
}[tag] || tag)
);
const generateSnippetCard = (snippetList, snippetKey, addCornerTag = false) => `<div class="card code-card">
${addCornerTag ? `<div class="corner ${
snippetKey[1].includes('advanced')
? 'advanced'
: snippetKey[1].includes('beginner')
? 'beginner'
: 'intermediate'
}"></div>`: ''}
${md
.render(`\n${addCornerTag ? snippetList[snippetKey[0] + '.md'] : snippetList[snippetKey[0]]}`)
.replace(
/<h3/g,
`<div class="section card-content"><h4 id="${snippetKey[0].toLowerCase()}"`
)
.replace(/<\/h3>/g, '</h4>')
.replace(
/<pre><code class="language-js">/m,
'</div><div class="copy-button-container"><button class="copy-button" aria-label="Copy to clipboard"></button></div><pre><code class="language-js">'
)
.replace(
/<pre><code class="language-js">([^\0]*?)<\/code><\/pre>/gm,
(match, p1) =>
`<pre class="language-js">${Prism.highlight(
unescapeHTML(p1),
Prism.languages.javascript
)}</pre>`
)
.replace(/<\/div>\s*<pre class="/g, '</div><pre class="section card-code ')
.replace(
/<\/pre>\s+<pre class="/g,
'</pre><label class="collapse">examples</label><pre class="section card-examples '
)}
</div>`;
const filterSnippets = (snippetList, excludedFiles) =>
Object.keys(snippetList)
.filter(key => !excludedFiles.includes(key))
@ -169,40 +202,7 @@ try {
.render(`## ${util.capitalize(tag, true)}\n`)
.replace(/<h2>/g, '<h2 class="category-name">');
for (let taggedSnippet of Object.entries(tagDbData).filter(v => v[1][0] === tag))
localOutput +=
'<div class="card code-card">' +
`<div class="corner ${
taggedSnippet[1].includes('advanced')
? 'advanced'
: taggedSnippet[1].includes('beginner')
? 'beginner'
: 'intermediate'
}"></div>` +
md
.render(`\n${snippets[taggedSnippet[0] + '.md']}`)
.replace(
/<h3/g,
`<div class="section card-content"><h4 id="${taggedSnippet[0].toLowerCase()}"`
)
.replace(/<\/h3>/g, '</h4>')
.replace(
/<pre><code class="language-js">/m,
'</div><div class="copy-button-container"><button class="copy-button" aria-label="Copy to clipboard"></button></div><pre><code class="language-js">'
)
.replace(
/<pre><code class="language-js">([^\0]*?)<\/code><\/pre>/gm,
(match, p1) =>
`<pre class="language-js">${Prism.highlight(
unescapeHTML(p1),
Prism.languages.javascript
)}</pre>`
)
.replace(/<\/div>\s*<pre class="/g, '</div><pre class="section card-code ')
.replace(
/<\/pre>\s+<pre class="/g,
'</pre><label class="collapse">examples</label><pre class="section card-examples '
) +
'</div>';
localOutput += generateSnippetCard(snippets, taggedSnippet, true);
// Add the ending static part
localOutput += `\n${endPart + '\n'}`;
// Optimize punctuation nodes
@ -252,30 +252,7 @@ try {
// Generate archived snippets from md files
for (let snippet of Object.entries(filteredArchivedSnippets))
archivedOutput +=
'<div class="card code-card">' +
md
.render(`\n${filteredArchivedSnippets[snippet[0]]}`)
.replace(/<h3/g, `<div class="section card-content"><h4 id="${snippet[0].toLowerCase()}"`)
.replace(/<\/h3>/g, '</h4>')
.replace(
/<pre><code class="language-js">/m,
'</div><div class="copy-button-container"><button class="copy-button" aria-label="Copy to clipboard"></button></div><pre><code class="language-js">'
)
.replace(
/<pre><code class="language-js">([^\0]*?)<\/code><\/pre>/gm,
(match, p1) =>
`<pre class="language-js">${Prism.highlight(
unescapeHTML(p1),
Prism.languages.javascript
)}</pre>`
)
.replace(/<\/div>\s*<pre class="/g, '</div><pre class="section card-code ')
.replace(
/<\/pre>\s+<pre class="/g,
'</pre><label class="collapse">examples</label><pre class="section card-examples '
) +
'</div>';
archivedOutput += generateSnippetCard(filteredArchivedSnippets, snippet, false);
// Optimize punctuation nodes
archivedOutput = util.optimizeNodes(
@ -318,7 +295,7 @@ try {
// Generate glossary snippets from md files
for (let snippet of Object.entries(filteredGlossarySnippets))
glossaryOutput +=
glossaryOutput +=
'<div class="card code-card"><div class="section card-content">' +
md
.render(`\n${filteredGlossarySnippets[snippet[0]]}`)