Fixed processing of text rows into children

This commit is contained in:
2023-09-19 20:22:26 +02:00
parent 0c48dc81be
commit e76fee2c68
3 changed files with 96 additions and 33 deletions

3
.gitignore vendored
View File

@@ -65,4 +65,5 @@ node_modules/
# dotenv environment variables file # dotenv environment variables file
.env .env
.dist .dist
temp

View File

@@ -396,8 +396,7 @@ class Italic extends Symbol {
* @returns {boolean} * @returns {boolean}
*/ */
static canParse(line) { static canParse(line) {
const trimmedLine = line.trim(); return line.startsWith("_");
return trimmedLine.startsWith("_");
} }
/** /**
@@ -454,8 +453,7 @@ class Bold extends Symbol {
* @returns {boolean} * @returns {boolean}
*/ */
static canParse(line) { static canParse(line) {
const trimmedLine = line.trim(); return line.startsWith("**");
return trimmedLine.startsWith("**");
} }
/** /**
@@ -636,11 +634,27 @@ class MultiLineCode extends Symbol {
} }
} }
class Text extends Symbol { class TextRow extends Symbol {
/** /**
* @type {string} * @type {string}
*/ */
text = ""; text = "";
/**
* @type {Symbol[]}
*/
children = [];
/**
* @type {Symbol[]}
*/
allowedChildren = [
Bold,
Italic,
ImageLink,
Link,
MultiLineCode,
SingleLineCode,
TextRow,
];
/** /**
* *
* @param {string} line * @param {string} line
@@ -656,7 +670,69 @@ class Text extends Symbol {
* @returns {Symbol} * @returns {Symbol}
*/ */
static create(lineFeed) { static create(lineFeed) {
const instance = new Text(); const instance = new TextRow();
instance.text = lineFeed.claim();
return instance;
}
/**
*
* @param {string} assetDirectory
* @returns {void}
*/
process(assetDirectory) {
for (let i = 0; i < this.text.length; i++) {
if (i === this.text.length - 1) {
const plainText = new PlainText();
plainText.text = this.text;
this.children = [plainText];
break;
}
const line = this.text.slice(i);
const symbols = toSymbols(line, assetDirectory, this.allowedChildren);
const symbolsIsOnlyOneTextRow =
symbols.length === 1 && symbols[0] instanceof TextRow;
if (!symbols.length || symbolsIsOnlyOneTextRow) {
continue;
}
const plainText = new PlainText();
plainText.text = this.text.slice(0, i);
this.children = [plainText, ...symbols];
break;
}
this.children.forEach((c) => c.process(assetDirectory));
}
render() {
return this.children.map((c) => c.render()).join("");
}
}
class PlainText extends Symbol {
/**
* @type {string}
*/
text = "";
/**
* @type {Symbol[]}
*/
children = [];
/**
*
* @param {string} line
* @returns {boolean}
*/
static canParse(line) {
return true;
}
/**
*
* @param {LineFeed} lineFeed
* @returns {Symbol}
*/
static create(lineFeed) {
const instance = new PlainText();
instance.text = lineFeed.claim(); instance.text = lineFeed.claim();
return instance; return instance;
} }
@@ -747,7 +823,6 @@ const getAmountOfTokenInBeginningOfFile = (token, string) => {
* @type {Symbol[]} * @type {Symbol[]}
*/ */
const AllSymbols = [ const AllSymbols = [
Paragraph,
Heading, Heading,
UnorderedListItem, UnorderedListItem,
OrderedListItem, OrderedListItem,
@@ -757,24 +832,9 @@ const AllSymbols = [
Link, Link,
MultiLineCode, MultiLineCode,
SingleLineCode, SingleLineCode,
Text, TextRow,
];
/**
* @type {Symbol[]}
*/
const AllSymbolsExceptParagraph = [
Paragraph,
Heading,
UnorderedListItem,
OrderedListItem,
Bold,
Italic,
ImageLink,
Link,
MultiLineCode,
SingleLineCode,
Text,
]; ];
/** /**
* *
* @param {string} markdown * @param {string} markdown
@@ -782,11 +842,16 @@ const AllSymbolsExceptParagraph = [
* @returns {string} * @returns {string}
*/ */
export const toHtml = (markdown, assetDirectory) => { export const toHtml = (markdown, assetDirectory) => {
// Stage one, markdown to symbols
const symbols = toSymbols(markdown, assetDirectory); const symbols = toSymbols(markdown, assetDirectory);
// Stage two, expanding symbols
console.log("starting processing"); console.log("starting processing");
symbols.forEach((s) => s.process(assetDirectory)); symbols.forEach((s) => s.process(assetDirectory));
// Stage three, operations based on symbol relationship
// Stage four, rendering
const html = symbols.map((s) => s.render()).join(""); const html = symbols.map((s) => s.render()).join("");
return `<div>${html}</div>`; return `<div>${html}</div>`;
}; };
@@ -798,13 +863,13 @@ export const toHtml = (markdown, assetDirectory) => {
* @param {Symbol[]} allowedSymbols * @param {Symbol[]} allowedSymbols
* @returns {Symbol[]} * @returns {Symbol[]}
*/ */
const toSymbols = (markdown, assetDirectory, allowedSymbols) => { const toSymbols = (markdown, assetDirectory, allowedSymbols = AllSymbols) => {
const lineFeed = new LineFeed(markdown); const lineFeed = new LineFeed(markdown);
const symbols = []; const symbols = [];
while (!lineFeed.isEmpty()) { while (!lineFeed.isEmpty()) {
const line = lineFeed.peek(); const line = lineFeed.peek();
const factory = AllSymbols.find((factory) => factory.canParse(line)); const factory = allowedSymbols.find((factory) => factory.canParse(line));
const symbol = factory.create(lineFeed, assetDirectory); const symbol = factory.create(lineFeed, assetDirectory);
symbols.push(symbol); symbols.push(symbol);
} }

View File

@@ -2,8 +2,7 @@
_2023-09-15_ _2023-09-15_
I've been thinking a long time about having a place to publicly publish things. I've been thinking a long time about having a place to publicly publish things. I'm not really into doing that on social media since it would lock my content in their format and make it hard to move anywhere else so i thought i would just write my "things" in plain markdown and then find a way of hosting them online.
I'm not really into doing that on social media since it would lock my content in their format and make it hard to move anywhere else so i thought i would just write my "things" in plain markdown and then find a way of hosting them online.
Sure there's a lot of static site generators out there and a couple of them could probably be configured to work the way i want it to. However to me there is a joy in using things that I have built on my own so first i will try building something from scratch. Sure there's a lot of static site generators out there and a couple of them could probably be configured to work the way i want it to. However to me there is a joy in using things that I have built on my own so first i will try building something from scratch.
@@ -37,6 +36,8 @@ _Italics_
_Italics_ then text _Italics_ then text
Text then _italics_
**Bold** **Bold**
**Bold** then text **Bold** then text
@@ -74,7 +75,3 @@ const y = () => {
[link to the index](https://blog.zacke.dev) with text after it [link to the index](https://blog.zacke.dev) with text after it
![alt-text](@asset/git.png) ![alt-text](@asset/git.png)
rstd
rastd
rstd