From 20b018359bef00e550c6a9022d7c6c5631e3136e Mon Sep 17 00:00:00 2001 From: Angelos Chalaris Date: Fri, 5 Jan 2018 14:35:43 +0200 Subject: [PATCH] Added multi-tagging (#159) Updated all scripts to deal with multiple tags, the only thing missing is to actually multi-tag all snippets retroactively. --- advanced.svg | 1 + docs/mini/flavor.scss | 8 ++++++++ scripts/build.js | 24 +++++++++++++++++------- scripts/tag.js | 12 ++++++++---- scripts/web.js | 28 +++++++++++++++++----------- static-parts/README-start.md | 2 +- static-parts/index-start.html | 14 +++++++++----- 7 files changed, 61 insertions(+), 28 deletions(-) create mode 100644 advanced.svg diff --git a/advanced.svg b/advanced.svg new file mode 100644 index 000000000..428312a3c --- /dev/null +++ b/advanced.svg @@ -0,0 +1 @@ +advancedadvanced diff --git a/docs/mini/flavor.scss b/docs/mini/flavor.scss index 19f8851a5..b3e3f11c0 100644 --- a/docs/mini/flavor.scss +++ b/docs/mini/flavor.scss @@ -131,6 +131,8 @@ $_drawer-right: false; @import 'navigation'; +$mark-back-color: #424242; +$mark-font-size: 0.5em; $toast-back-color: #212121; @@ -163,6 +165,12 @@ $_include-collapse: false; transition: opacity 0.3s ease-in-out; } +mark { + position: relative; + top: -0.25rem; + left: 0.25rem; +} + /* Custom elements for contextual background elements, toasts and tooltips. */ diff --git a/scripts/build.js b/scripts/build.js index 1b9a464a6..292a214f4 100644 --- a/scripts/build.js +++ b/scripts/build.js @@ -73,7 +73,11 @@ try { .readFileSync('tag_database', 'utf8') .split('\n') .slice(0, -1) - .map(v => v.split(':').slice(0, 2)) + .map(v => { + let data = v.split(':').slice(0, 2); + data[1] = data[1].split(',').map(t => t.trim()); + return data; + }) ); } catch (err) { console.log(`${chalk.red('ERROR!')} During tag database loading: ${err}`); @@ -85,7 +89,7 @@ try { const tags = [ ...new Set( Object.entries(tagDbData) - .map(t => t[1]) + .map(t => t[1][0]) .filter(v => v) .sort((a, b) => a.localeCompare(b)) ) @@ -101,7 +105,7 @@ try { if (capitalizedTag === 'Uncategorized') { uncategorizedOutput += `### _${capitalizedTag}_\n\n
\nView contents\n\n`; - for (const taggedSnippet of Object.entries(tagDbData).filter(v => v[1] === tag)) { + for (const taggedSnippet of Object.entries(tagDbData).filter(v => v[1][0] === tag)) { uncategorizedOutput += `* [\`${taggedSnippet[0]}\`](#${taggedSnippet[0].toLowerCase()})\n`; } uncategorizedOutput += '\n
\n\n'; @@ -109,7 +113,7 @@ try { output += `### ${ EMOJIS[tag] || '' } ${capitalizedTag}\n\n
\nView contents\n\n`; - for (const taggedSnippet of Object.entries(tagDbData).filter(v => v[1] === tag)) { + for (const taggedSnippet of Object.entries(tagDbData).filter(v => v[1][0] === tag)) { output += `* [\`${taggedSnippet[0]}\`](#${taggedSnippet[0].toLowerCase()})\n`; } output += '\n
\n\n'; @@ -122,17 +126,23 @@ try { // Loop over tags and snippets to create the list of snippets for (const tag of tags) { const capitalizedTag = capitalize(tag, true); - + // ![advanced](/advanced.svg) if (capitalizedTag == 'Uncategorized') { uncategorizedOutput += `---\n ## _${capitalizedTag}_\n`; - for (const taggedSnippet of Object.entries(tagDbData).filter(v => v[1] === tag)) { + for (const taggedSnippet of Object.entries(tagDbData).filter(v => v[1][0] === tag)) { uncategorizedOutput += `\n${snippets[taggedSnippet[0] + '.md'] + '\n
[⬆ back to top](#table-of-contents)\n\n'}`; } } else { output += `---\n ## ${EMOJIS[tag] || ''} ${capitalizedTag}\n`; - for (const taggedSnippet of Object.entries(tagDbData).filter(v => v[1] === tag)) { + for (const taggedSnippet of Object.entries(tagDbData).filter(v => v[1][0] === tag)) { let data = snippets[taggedSnippet[0] + '.md']; + // Add advanced tag + if(taggedSnippet[1].includes('advanced')){ + data = data.split(/\r?\n/); + data[0] = data[0] +' ![advanced](/advanced.svg)'; + data = data.join('\n'); + } data = data.slice(0, data.lastIndexOf('```js')) + '
\nExamples\n\n' + diff --git a/scripts/tag.js b/scripts/tag.js index bf57fd7cf..c3dd9aa64 100644 --- a/scripts/tag.js +++ b/scripts/tag.js @@ -50,10 +50,14 @@ try { .readFileSync('tag_database', 'utf8') .split('\n') .slice(0, -1) - .map(v => v.split(':').slice(0, 2)) + .map(v => { + let data = v.split(':').slice(0, 2); + data[1] = data[1].split(',').map(t => t.trim()); + return data; + }) ); tagDbStats = Object.entries(tagDbData) - .sort((a, b) => a[1].localeCompare(b[1])) + .sort((a, b) => a[1][0].localeCompare(b[1][0])) .reduce((acc, val) => { acc.hasOwnProperty(val[1]) ? acc[val[1]]++ : (acc[val[1]] = 1); return acc; @@ -68,9 +72,9 @@ try { for (let snippet of Object.entries(snippets)) if ( tagDbData.hasOwnProperty(snippet[0].slice(0, -3)) && - tagDbData[snippet[0].slice(0, -3)].trim() + tagDbData[snippet[0].slice(0, -3)].join(',').trim() ) - output += `${snippet[0].slice(0, -3)}:${tagDbData[snippet[0].slice(0, -3)].trim()}\n`; + output += `${snippet[0].slice(0, -3)}:${tagDbData[snippet[0].slice(0, -3)].join(',').trim()}\n`; else { output += `${snippet[0].slice(0, -3)}:uncategorized\n`; missingTags++; diff --git a/scripts/web.js b/scripts/web.js index eeb848d9b..6b86c7683 100644 --- a/scripts/web.js +++ b/scripts/web.js @@ -61,7 +61,7 @@ const objectFromPairs = arr => arr.reduce((a, v) => ((a[v[0]] = v[1]), a), {}); const capitalize = (str, lowerRest = false) => str.slice(0, 1).toUpperCase() + (lowerRest ? str.slice(1).toLowerCase() : str.slice(1)); // Start the timer of the script -console.time('Builder'); +console.time('Webber'); // Synchronously read all snippets and sort them as necessary (case-insensitive) try { let snippetFilenames = fs.readdirSync(snippetsPath); @@ -96,7 +96,11 @@ try { .readFileSync('tag_database', 'utf8') .split('\n') .slice(0, -1) - .map(v => v.split(':').slice(0, 2)) + .map(v => { + let data = v.split(':').slice(0, 2); + data[1] = data[1].split(',').map(t => t.trim()); + return data; + }) ); } catch (err) { // Handle errors (hopefully not!) @@ -109,7 +113,7 @@ try { output += `${startPart + '\n'}`; let uncategorizedOutput = ''; // Loop over tags and snippets to create the table of contents - for (let tag of [...new Set(Object.entries(tagDbData).map(t => t[1]))] + for (let tag of [...new Set(Object.entries(tagDbData).map(t => t[1][0]))] .filter(v => v) .sort((a, b) => a.localeCompare(b))) { if (capitalize(tag, true) == 'Uncategorized') { @@ -120,12 +124,12 @@ try { .replace(/

/g, '') .replace(/<\/p>/g, '') + ``; - for (let taggedSnippet of Object.entries(tagDbData).filter(v => v[1] === tag)) + for (let taggedSnippet of Object.entries(tagDbData).filter(v => v[1][0] === tag)) uncategorizedOutput += md .render(`[${taggedSnippet[0]}](#${taggedSnippet[0].toLowerCase()})\n`) .replace(/

/g, '') .replace(/<\/p>/g, '') - .replace(//g, '') .replace(/<\/p>/g, '') + ``; - for (let taggedSnippet of Object.entries(tagDbData).filter(v => v[1] === tag)) + for (let taggedSnippet of Object.entries(tagDbData).filter(v => v[1][0] === tag)) output += md .render(`[${taggedSnippet[0]}](#${taggedSnippet[0].toLowerCase()})\n`) .replace(/

/g, '') .replace(/<\/p>/g, '') - .replace(/ `; uncategorizedOutput = ''; // Loop over tags and snippets to create the list of snippets - for (let tag of [...new Set(Object.entries(tagDbData).map(t => t[1]))] + for (let tag of [...new Set(Object.entries(tagDbData).map(t => t[1][0]))] .filter(v => v) .sort((a, b) => a.localeCompare(b))) { if (capitalize(tag, true) == 'Uncategorized') { uncategorizedOutput += md .render(`## ${capitalize(tag, true)}\n`) .replace(/

/g, '

'); - for (let taggedSnippet of Object.entries(tagDbData).filter(v => v[1] === tag)) + for (let taggedSnippet of Object.entries(tagDbData).filter(v => v[1][0] === tag)) uncategorizedOutput += '
' + md .render(`\n${snippets[taggedSnippet[0] + '.md']}`) .replace(/

/g, `${taggedSnippet[1].includes('advanced')?'advanced':''}

`) .replace(/
([^\0]*?)<\/code><\/pre>/gm, (match, p1) => `
${Prism.highlight(unescapeHTML(p1), Prism.languages.javascript)}
`) .replace(/<\/pre>\s+
clipboard Copy to clipboard' +
@@ -170,12 +175,13 @@ try {
       output += md
         .render(`## ${capitalize(tag, true)}\n`)
         .replace(/

/g, '

'); - for (let taggedSnippet of Object.entries(tagDbData).filter(v => v[1] === tag)) + for (let taggedSnippet of Object.entries(tagDbData).filter(v => v[1][0] === tag)) output += '
' + md .render(`\n${snippets[taggedSnippet[0] + '.md']}`) .replace(/

/g, `${taggedSnippet[1].includes('advanced')?'advanced':''}

`) .replace(/<\/h3>/g, '

') .replace(/
([^\0]*?)<\/code><\/pre>/gm, (match, p1) => `
${Prism.highlight(unescapeHTML(p1), Prism.languages.javascript)}
`) .replace(/<\/pre>\s+