wikity 1.3.4 → 1.3.6

package/dist/compile.js

@@ -8,7 +8,6 @@ const fs_1 = __importDefault(require("fs"));
 const path_1 = __importDefault(require("path"));
 const glob_1 = __importDefault(require("glob"));
 const dedent_1 = __importDefault(require("dedent"));
-const formatter = require('html-formatter'); // does not have type package
 const parse_1 = require("./parse");
 const wiki_css_1 = __importDefault(require("./wiki.css"));
 function eleventyCompile(dir = '.', config = {}) {
@@ -40,7 +39,7 @@ function compile(dir = '.', config = {}) {
         const outFilename = filename.replace(/ /g, '_').replace('.wiki', '.html');
         const outFilePath = path_1.default.join(outputFolder, outFilename);
         const urlPath = outFilename.replace(/(?<=^|\/)\w/g, m => m.toUpperCase()); // capitalise first letters
-        const displayTitle = metadata.displayTitle || urlPath.replace('.html', '');
+        const displayTitle = metadata.displayTitle || urlPath.replace('.html', '').replace(/_/g, ' ');
         // Eleventy configuration
         const frontMatter = config.eleventy ? (0, dedent_1.default) `
                 ---
@@ -50,33 +49,39 @@ function compile(dir = '.', config = {}) {
         // Create TOC
         if (!metadata.notoc && (metadata.toc || (((_a = outText.match(/<h\d[^>]*>/g)) === null || _a === void 0 ? void 0 : _a.length) || 0) > 3)) {
             let toc = '';
-            let headings = Array.from(parsedContent.match(/<h\d[^>]*>.+?<\/h\d>/gs) || []);
+            let headings = Array.from(parsedContent.match(/<h\d auto[^>]*>.+?<\/h\d>/gs) || []);
             headings.forEach(match => {
                 var _a;
-                const text = match.replace(/\s*<\/?h\d[^>]*>\s*/g, '');
+                const headingInner = match.replace(/\s*<\/?h\d[^>]*>\s*/g, '');
+                const text = headingInner.replace(/<.+?>/g, ''); // remove tags from inner
                 const lvl = +(((_a = match.match(/\d/g)) === null || _a === void 0 ? void 0 : _a[0]) || -1);
                 toc += `${`<ol>`.repeat(lvl - 1)} <li> <a href="#${encodeURI(text.replace(/ /g, '_'))}">${text}</a> </li> ${`</ol>`.repeat(lvl - 1)}`;
             });
+            toc = toc.replace(/<\/ol>\s*<ol>/g, '');
             const tocElem = (0, dedent_1.default) `
-                <div id="page+toc">
-                    <span id="page+toc+heading">
+                <div id="page_toc">
+                    <span id="page_toc_heading">
                         <strong>Contents</strong>
                         [<a href="javascript:void(0)" onclick="
-                            document.getElementById('page+toc+contents').setAttribute('style', this.innerText === 'hide' ? 'display: none;' : '');
+                            document.getElementById('page_toc_contents').setAttribute('style', this.innerText === 'hide' ? 'display: none;' : '');
                             this.innerText = this.innerText === 'hide' ? 'show' : 'hide';
                         ">hide</a>]
                     </span>
-                    <ol id="page+toc+contents">${toc}</ol>
+                    <ol id="page_toc_contents">${toc}</ol>
                 </div>
             `;
             // Set TOC on page
-            if (outText.includes('<toc></toc>'))
+            if (outText.includes('<toc></toc>')) {
+                // put TOC where explicitly declared
                 outText = outText.replace('<toc></toc>', tocElem);
-            else
-                outText = outText.replace(/<h\d[^>]*>/, tocElem + '$&');
+            }
+            else {
+                // put TOC above first auto heading
+                outText = outText.replace(/<h[1-6] auto/, tocElem + '$&');
+            }
         }
         // Create plaintext of HTML for use as description/metadata property.
-        const plaintextData = parsedContent.replace(/<.+?>/gs, ' ');
+        const plaintextData = parsedContent.replace(/<.+?>/gs, '');
         // Create HTML
         const folderUpCount = file.split(/[\/\\]/).length - dir.split(/[\/\\]/).length; // number of folders to go up by to get to root
         const html = (0, dedent_1.default) `
@@ -106,8 +111,8 @@ function compile(dir = '.', config = {}) {
         if (!fs_1.default.existsSync(path_1.default.dirname(outFilePath))) {
             fs_1.default.mkdirSync(path_1.default.dirname(outFilePath));
         }
-        const renderedHtml = formatter.render(html.replace(/(<\/\w+>) +(\S)/g, '$1&#32;$2'));
-        fs_1.default.writeFileSync(outFilePath, frontMatter + '\n' + renderedHtml, 'utf8');
+        const formattedHtml = html.replace(/\n[\n\s]+/g, '\n');
+        fs_1.default.writeFileSync(outFilePath, frontMatter + '\n' + formattedHtml, 'utf8');
         // Move images
         (0, glob_1.default)(imagesFolder + '/*', {}, (err, files) => {
             if (err) {

package/dist/parse.js

@@ -11,8 +11,13 @@ const common_1 = require("./common");
 const r = String.raw;
 const MAX_RECURSION = 20;
 const arg = r `\s*([^|}]+?)\s*`;
-function cleanLink(link) {
-    return encodeURI(link.replace(/ /g, '_'));
+function toLinkText(link) {
+    const cleanedLink = encodeURI(link.trim().replace(/ /g, '_'));
+    return cleanedLink[0].toUpperCase() + cleanedLink.slice(1);
+}
+function toFileText(link) {
+    const cleanedLink = link.trim().replace(/ /g, '_');
+    return cleanedLink[0].toUpperCase() + cleanedLink.slice(1);
 }
 function parseDimensions(dimStr) {
     const regex = /(\d*)(?:x(\d*))?px/;
@@ -59,8 +64,11 @@ function parse(data, config = {}) {
             .replace(/^-{4,}/gm, '<hr>')
             // Images: [[File:Image.png|options|caption]]
             .replace((0, common_1.RegExpBuilder)(r `\[\[ (?:File|Image): (.*?) (\|.+?)? \]\]`), (_, file, params = '') => {
+            var _a;
             if (params.includes('{{'))
                 return _;
+            if (params.includes('[['))
+                return _;
             if (!file)
                 return '';
             const path = path_1.default.join(imagesFolder, file.trim().replace(/ /g, '_'));
@@ -78,6 +86,7 @@ function parse(data, config = {}) {
                     imageData.type = { framed: 'frame', thumbnail: 'thumb' }[param] || param;
                     if (imageData.type === 'thumb') {
                         imageData.hasCaption = true;
+                        (_a = imageData.float) !== null && _a !== void 0 ? _a : (imageData.float = 'right');
                     }
                 }
                 else if (param.endsWith('px')) {
@@ -112,9 +121,11 @@ function parse(data, config = {}) {
                             image-${imageData.type || 'default'}
                         "
                         style="
-                            display: inline-block;
+                            margin: 8px;
                             float: ${imageData.float || 'none'};
+                            clear: ${imageData.float || 'none'};
                             vertical-align: ${imageData.align || 'unset'};
+                            background: #fff;
                             ${imageData.style || ''}
                         "
                     >
@@ -122,28 +133,34 @@ function parse(data, config = {}) {
                             src="${path_1.default.basename(imagesFolder)}/${path_1.default.relative(imagesFolder, path)}"
                             alt="${imageData.alt || file}"
                             width="${imageData.width || 300}"
-                            height="${imageData.height || 300}"
+                            height="${imageData.height || ''}"
                         >
                         ${imageData.hasCaption ? `<figcaption>${caption}</figcaption>` : ''}
                     </figure>
                 `;
             const imageLink = imageData.link;
             if (imageLink) {
-                content = `<a href="${cleanLink(imageLink)}" title="${imageLink}">${content}</a>`;
+                content = `<a href="${toLinkText(imageLink)}" title="${imageLink}">${content}</a>`;
             }
             return content;
         })
-            // Internal links: [[Page]] and [[Page|Text]]
+            // Internal links
+            // [[Page]]
             .replace((0, common_1.RegExpBuilder)(r `\[\[ ([^\]|]+?) \]\]`), (_, link) => {
             if (_.includes('{{'))
                 return _;
-            const content = `<a class="internal-link" title="${link}" href="./${cleanLink(link)}">${link}</a>`;
+            if (/(?:File|Image):/.test(link))
+                return _;
+            const content = `<a class="internal-link" title="${link}" href="./${toLinkText(link)}">${link}</a>`;
             return content;
         })
+            // [[Page|Text]]
             .replace((0, common_1.RegExpBuilder)(r `\[\[ ([^\]|]+?) \| ([^\]]+?) \]\]`), (_, link, text) => {
             if (link.includes('{{'))
                 return _;
-            const content = `<a class="internal-link" title="${link}" href="./${cleanLink(link)}">${text}</a>`;
+            if (/(?:File|Image):/.test(link))
+                return _;
+            const content = `<a class="internal-link" title="${link}" href="./${toLinkText(link)}">${text}</a>`;
             return content;
         })
             .replace((0, common_1.RegExpBuilder)(r `(</a>)([a-z]+)`), '$2$1')
@@ -240,14 +257,19 @@ function parse(data, config = {}) {
                         const errMsg = `Wikity does not use Wikipedia's #time function syntax. Use repetition-based formatting (e.g. yyyy-mm-dd) instead.`;
                         console.warn(`<Wikity> [WARN] ${errMsg}`);
                     }
-                    return (0, dateformat_1.default)(args[1] ? new Date(args[1]) : new Date(), args[0]);
+                    try {
+                        return (0, dateformat_1.default)(args[1] ? new Date(args[1]) : new Date(), args[0]);
+                    }
+                    catch {
+                        return args[1] || args[0];
+                    }
             }
         })
             // Templates: {{template}}
             .replace((0, common_1.RegExpBuilder)(r `(?<!{) {{ \s* ([^#{}|]+?) \s* (\|[^{}]+)? }} (?!})`), (_, title, params = '') => {
             if (params.includes('{{'))
                 return _;
-            const templateFile = title.trim().replace(/ /g, '_');
+            const templateFile = toFileText(title);
             const page = path_1.default.join(templatesFolder, templateFile);
             let content = '';
             // Try retrieve template content
@@ -285,7 +307,10 @@ function parse(data, config = {}) {
             .replace((0, common_1.RegExpBuilder)(r `''' ([^']+?) '''`), '<b>$1</b>')
             .replace((0, common_1.RegExpBuilder)(r `''  ([^']+?)  ''`), '<i>$1</i>')
             // Headings: ==heading==
-            .replace((0, common_1.RegExpBuilder)(r `^ (=+) \s* (.+?) \s* \1 \s* $`), (_, lvl, txt) => `<h${lvl.length} id="${encodeURI(txt.replace(/ /g, '_'))}">${txt}</h${lvl.length}>`)
+            .replace((0, common_1.RegExpBuilder)(r `^ (=+) \s* (.+?) \s* \1 \s* $`), (_, lvl, txt) => {
+            const linkForm = encodeURI(txt.replace(/ /g, '_').replace(/<.+?>/g, ''));
+            return `<h${lvl.length} auto id="${linkForm}">${txt}</h${lvl.length}>`;
+        })
             // Bulleted list: *item
             .replace((0, common_1.RegExpBuilder)(r `^ (\*+) (.+?) $`), (_, lvl, content) => {
             if (content.includes('{{'))
@@ -314,6 +339,8 @@ function parse(data, config = {}) {
             .replace((0, common_1.RegExpBuilder)(r `</dl> (\s*?) <dl>`), '$1')
             // Tables: {|, |+, !, |-, |, |}
             .replace(/\{\|.+\|\}/gs, (tableInner) => {
+            if (tableInner.includes('{{'))
+                return tableInner;
             return tableInner
                 // {| data (open table)
                 .replace((0, common_1.RegExpBuilder)(r `^ \{\| (.*?) $`), (_, attrs) => `<table ${attrs}><tr>`)
@@ -333,15 +360,17 @@ function parse(data, config = {}) {
             .replace((0, common_1.RegExpBuilder)(r `< ref \s* (?: name \s* = \s* ["']? ([^>'"]+) ["']? [^>]* )?> (.+?) </ ref >`), (_, refname, text) => {
             if (_.includes('{{'))
                 return _;
-            const refData = { ref: text, n: refs.length + 1, name: refname };
+            const refData = { ref: text, id: refs.length + 1, name: refname, i: 0 };
             refs.push(refData);
-            return `<sup class="refnote"><a id="cite-${refData.n}" class="ref" href="#ref-${refData.n}">[${refData.n}]</a></sup>`;
+            return `<sup class="refnote"><a id="cite-${refData.id}" class="ref" href="#ref-${refData.id}">[${refData.id}]</a></sup>`;
         })
-            .replace((0, common_1.RegExpBuilder)(r `< ref \s* name \s* = \s* ["']? ( [^>"']+ ) ["']? \s* (?: /> | > .* </ref> )`), (_, refname) => {
+            .replace((0, common_1.RegExpBuilder)(r `< ref \s* name \s* = \s* ["']? ( [^>"']+ ) ["']? \s* (?: /> | > .*? </ref> )`), (_, refname) => {
             const ref = refs.find(ref => ref.name === refname);
             if (!ref)
-                return '';
-            return `<sup class="refnote"><a id="cite-${ref.n}" class="ref" href="#ref-${ref.n}">[${ref.n}]</a></sup>`;
+                return _;
+            ref.i++;
+            const citeId = `cite-${ref.id}${ref.i > 0 ? `_${ref.i}` : ''}`;
+            return `<sup class="refnote"><a id="${citeId}" class="ref" href="#ref-${ref.id}">[${ref.id}]</a></sup>`;
         })
             // Nonstandard: ``code`` and ```code blocks```
             .replace((0, common_1.RegExpBuilder)(r ` \`\`\` ([^\`]+?) \`\`\` `), '<pre>$1</pre>')
@@ -358,8 +387,20 @@ function parse(data, config = {}) {
     outText = outText
         // References: <references />
         .replace((0, common_1.RegExpBuilder)(r `<references \s* /?>`), () => {
-        const references = refs.map(({ ref, n }) => {
-            const refline = `<li id="ref-${n}"> <a href="#cite-${n}">↑</a> ${ref} </li>`;
+        const references = refs.map((refdata) => {
+            let multiRefContent = '';
+            if (refdata.i > 0) {
+                for (let i = 0; i <= refdata.i; i++) {
+                    multiRefContent += `<sup><a href="#cite-${refdata.id}${i > 0 ? `_${i}` : ''}">${i + 1}</a></sup>&nbsp;`;
+                }
+            }
+            const refline = `
+                    <li id="ref-${refdata.id}">
+                        ${refdata.i > 0 ? '&uarr;' : `<a href="#cite-${refdata.id}">&uarr;</a>`}
+                        ${multiRefContent}
+                        ${refdata.ref} 
+                    </li>
+                `;
             return refline;
         }).join('\n');
         return `<ol>${references}</ol>`;

package/dist/wiki.css.js

@@ -1,14 +1,14 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = String.raw `
-body {font-family: sans-serif; margin: 4em; max-width: 1000px; background: #eee;}
+body {font-family: sans-serif; margin: auto; max-width: 1000px; background: #eee;}
 main {margin: 3em -1em; background: #fff; padding: 1em;}
 h1, h2 {margin-bottom: 0.6em; font-weight: normal; border-bottom: 1px solid #a2a9b1;}
 ul, ol {margin: 0.3em 0 0 1.6em; padding: 0;}
 dt {font-weight: bold;}
 dd, dl dl {margin-block: 0; margin-inline-start: 30px;}
 
-figure {margin: 1em;}
+figure {margin: 1em; width: 300px;}
 .image-thumb, .image-frame {padding: 6px; border: 1px solid gray;}
 .image-default {margin: 0;}
 figcaption {padding-top: 6px;}
@@ -26,13 +26,11 @@ a.external-link::after {content: '\1f855';}
 a.redlink {color: #d33;}
 a.redlink:visited {color: #b44;}
 
-sup.refnote {margin-left: -5px;}
-
-#page+toc {border: 1px solid #aab; padding: 8px; width: fit-content; background-color: #f8f8f8; font-size: 95%;}
-#page+toc-heading {display: block; text-align: center;}
-#page+toc ol {margin: 0 0 0 1.3em;}
+#page_toc {border: 1px solid #aab; padding: 8px; width: fit-content; background-color: #f8f8f8; font-size: 95%;}
+#page_toc_heading {display: block; text-align: center;}
+#page_toc ol {margin: 0 0 0 1.3em;}
 
 #infobox {float: right; clear: right; margin: 0 0 1em 1em; width: 300px; padding: 2px; border: 1px solid #CCC; overflow: auto; font-size: 90%;}
-#infobox tr:first-child :first-child {padding: 10px 10px 0; text-align: center; font-weight: bold; font-size: 120%;}
+#infobox tr:first-child :first-child {padding: 10px; text-align: center; font-weight: bold; font-size: 120%;}
 #infobox th {padding-left: 10px; text-align: left;}
 `;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "wikity",
-  "version": "1.3.4",
-  "description": "Compile wikitext to HTML: wikitext as a templating language.",
+  "version": "1.3.6",
+  "description": "Compile wikitext to HTML! Supporst use of wikitext as a templating language.",
   "main": "dist/index.js",
   "scripts": {
     "test": "tsc && cd test && eleventy"
@@ -41,8 +41,7 @@
     "dateformat": "^4.6.3",
     "dedent": "^1.5.3",
     "escape-html": "^1.0.3",
-    "glob": "^8.1.0",
-    "html-formatter": "^0.1.9"
+    "glob": "^8.1.0"
   },
   "devDependencies": {
     "@types/dateformat": "^3.0.1",

package/readme.md

@@ -8,6 +8,10 @@
 
 This package comes with built-in support for compilation using [Eleventy](https://11ty.dev).
 
+## Exemplar
+
+See the `example` folder for a template on making your own wiki site!
+
 ## Install
 
 Wikity is available [on npm](https://www.npmjs.com/package/wikity).