Update Core.js

This commit is contained in:
simonpipe 2026-07-09 19:14:36 +02:00
parent 102a53b84d
commit 30f3150f16

281
Core.js
View file

@ -363,17 +363,11 @@ class SimonUp {
return html.replace('', tocListHtml); return html.replace('', tocListHtml);
} }
/** /**
* SimonUp Core Compiler (Core.js) - Version 1.2 * SimonUp Core Compiler (Core.js) - Version 1.2
* Eine moderne, fluss- und blockorientierte Auszeichnungssprache. * Eine moderne, fluss- und blockorientierte Auszeichnungssprache.
*/ */
// Globale Hilfsfunktionen außerhalb der Klasse, um Parsing-Verschachtelungen zu verhindern
function _suSlugify(text) {
if (!text) return '';
return text.toLowerCase().replace(/[^a-z0-9\s-]/g, '').replace(/\s+/g, '-');
}
class SimonUp { class SimonUp {
constructor() { constructor() {
this.plugins = []; this.plugins = [];
@ -381,18 +375,25 @@ class SimonUp {
this.counters = [0, 0, 0, 0, 0, 0]; this.counters = [0, 0, 0, 0, 0, 0];
} }
/**
* Registriert eine Erweiterung (Plugin)
*/
use(plugin) { use(plugin) {
this.plugins.push(plugin); this.plugins.push(plugin);
return this; return this;
} }
/**
* Hauptfunktion: Wandelt SimonUp-Text (.up) in valides HTML um
*/
parse(text) { parse(text) {
this.headings = []; this.headings = [];
this.counters = [0, 0, 0, 0, 0, 0]; this.counters = [0, 0, 0, 0, 0, 0];
var html = text;
let html = text;
if (this.plugins && this.plugins.length > 0) { if (this.plugins && this.plugins.length > 0) {
for (var i = 0; i < this.plugins.length; i++) { for (let i = 0; i < this.plugins.length; i++) {
if (this.plugins[i].before) { if (this.plugins[i].before) {
html = this.plugins[i].before(html); html = this.plugins[i].before(html);
} }
@ -403,9 +404,9 @@ class SimonUp {
html = this._injectTOC(html); html = this._injectTOC(html);
if (this.plugins && this.plugins.length > 0) { if (this.plugins && this.plugins.length > 0) {
for (var j = 0; j < this.plugins.length; j++) { for (let i = 0; i < this.plugins.length; i++) {
if (this.plugins[j].after) { if (this.plugins[i].after) {
html = this.plugins[j].after(html); html = this.plugins[i].after(html);
} }
} }
} }
@ -413,21 +414,24 @@ class SimonUp {
return html; return html;
} }
/**
* INTERN: Verarbeitet strukturelle Blöcke und freie Strukturen zeilenweise
*/
_parseBlocks(text) { _parseBlocks(text) {
var lines = text.replace(/\r\n/g, '\n').split('\n'); const lines = text.replace(/\r\n/g, '\n').split('\n');
var result = []; let result = [];
var inBlock = false; let inBlock = false;
var blockType = null; let blockType = null;
var blockMeta = ""; let blockMeta = "";
var blockBuffer = []; let blockBuffer = [];
for (var i = 0; i < lines.length; i++) { for (let i = 0; i < lines.length; i++) {
var line = lines[i]; let line = lines[i];
if (!inBlock && line.startsWith('&') && line.trim().length > 1) { if (!inBlock && line.startsWith('&') && line.trim().length > 1) {
inBlock = true; inBlock = true;
var fullHeader = line.substring(1).trim(); const fullHeader = line.substring(1).trim();
var spaceIndex = fullHeader.indexOf(' '); const spaceIndex = fullHeader.indexOf(' ');
if (spaceIndex !== -1) { if (spaceIndex !== -1) {
blockType = fullHeader.substring(0, spaceIndex).toLowerCase(); blockType = fullHeader.substring(0, spaceIndex).toLowerCase();
@ -440,7 +444,7 @@ class SimonUp {
continue; continue;
} }
if (inBlock && line.trim() === '&') { if (inBlock && line.trim().replace(/\u00A0/g, ' ') === '&') {
result.push(this._renderBlock(blockType, blockMeta, blockBuffer)); result.push(this._renderBlock(blockType, blockMeta, blockBuffer));
inBlock = false; inBlock = false;
blockType = null; blockType = null;
@ -451,17 +455,17 @@ class SimonUp {
if (inBlock) { if (inBlock) {
blockBuffer.push(line); blockBuffer.push(line);
} else { } else {
var trimmed = line.trim(); let trimmed = line.trim();
if (trimmed === '___') { if (trimmed === '___') {
result.push('<hr>'); result.push('<hr>');
} else if (trimmed.startsWith('- ')) { } else if (trimmed.startsWith('- ')) {
var insideUl = this._parseInline(line.replace(/^\s*-\s+/, '')); let insideUl = this._parseInline(line.replace(/^\s*-\s+/, ''));
result.push('<ul-item>' + insideUl + '</ul-item>'); result.push(`<ul-item>${insideUl}</ul-item>`);
} else if (/^\d+\.\s+/.test(trimmed)) { } else if (/^\d+\.\s+/.test(trimmed)) {
var cleanLine = line.replace(/^\s*\d+\.\s+/, ''); let cleanLine = line.replace(/^\s*\d+\.\s+/, '');
var insideOl = this._parseInline(cleanLine); let insideOl = this._parseInline(cleanLine);
result.push('<ol-item>' + insideOl + '</ol-item>'); result.push(`<ol-item>${insideOl}</ol-item>`);
} else { } else {
result.push(this._parseInline(line)); result.push(this._parseInline(line));
} }
@ -471,69 +475,75 @@ class SimonUp {
return this._processParagraphsAndLists(result); return this._processParagraphsAndLists(result);
} }
/**
* INTERN: Erzeugt das HTML für einen geschlossenen Block
*/
_renderBlock(type, meta, lines) { _renderBlock(type, meta, lines) {
var content = lines.join('\n'); const content = lines.join('\n');
var self = this; let self = this;
switch (type) { switch (type) {
case 'toc': case 'toc':
var tocWrapper = ''; let tocWrapper = '';
if (meta || content.trim()) { if (meta || content.trim()) {
tocWrapper = '<div class="simonup-toc-wrapper">\n'; tocWrapper = '<div class="simonup-toc-wrapper">\n';
if (meta) { if (meta) {
tocWrapper += '<h2>' + meta + '</h2>\n'; tocWrapper += `<h2>${meta}</h2>\n`;
} }
if (content.trim()) { if (content.trim()) {
var intro = lines.map(function(l) { return self._parseInline(l); }).join('<br>'); const intro = lines.map(function(l) { return self._parseInline(l); }).join('<br>');
tocWrapper += '<p class="toc-intro">' + intro + '</p>\n'; tocWrapper += `<p class="toc-intro">${intro}</p>\n`;
} }
tocWrapper += '\n</div>'; tocWrapper += '\n</div>';
} }
return tocWrapper; return tocWrapper;
case 'c': case 'c':
var langClass = meta ? ' class="language-' + meta + '"' : ''; const langClass = meta ? ` class="language-${meta}"` : '';
var escapedCode = content.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;'); const escapedCode = content.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
return '<pre><code' + langClass + '>' + escapedCode + '</code></pre>'; return `<pre><code${langClass}>${escapedCode}</code></pre>`;
case 'q': case 'q':
var qContent = lines.map(function(l) { return self._parseInline(l); }).join('<br>'); const qContent = lines.map(function(l) { return self._parseInline(l); }).join('<br>');
return '<blockquote>' + qContent + '</blockquote>'; return `<blockquote>${qContent}</blockquote>`;
case 'b': case 'b':
var bContent = lines.map(function(l) { return self._parseInline(l); }).join('<br>'); const bContent = lines.map(function(l) { return self._parseInline(l); }).join('<br>');
return '<div class="bible-block">' + bContent + '</div>'; return `<div class="bible-block">${bContent}</div>`;
case 'f': case 'f':
var fSummary = meta || 'Details'; const fSummary = meta || 'Details';
var fContent = lines.map(function(l) { return self._parseInline(l); }).join('<br>'); const fContent = lines.map(function(l) { return self._parseInline(l); }).join('<br>');
return '<details>\n<summary>' + fSummary + '</summary>\n<p>' + fContent + '</p>\n</details>'; return `<details>\n<summary>${fSummary}</summary>\n<p>${fContent}</p>\n</details>`;
case 'i': case 'i':
var iColor = meta || '#ff6347'; const iColor = meta || '#ff6347';
var iContent = lines.map(function(l) { return self._parseInline(l); }).join('<br>'); const iContent = lines.map(function(l) { return self._parseInline(l); }).join('<br>');
return '<div class="infobox" style="border-left: 4px solid ' + iColor + '; padding: 10px; margin: 10px 0; background: #f8f9fa;">\n' + iContent + '\n</div>'; return `<div class="infobox" style="border-left: 4px solid ${iColor}; padding: 10px; margin: 10px 0; background: #f8f9fa;">\n${iContent}\n</div>`;
case 't': case 't':
return this._renderTable(meta, lines); return this._renderTable(meta, lines);
default: default:
var defContent = lines.map(function(l) { return self._parseInline(l); }).join('<br>'); const defContent = lines.map(function(l) { return self._parseInline(l); }).join('<br>');
return '<div class="block-' + type + '">' + defContent + '</div>'; return `<div class="block-${type}">${defContent}</div>`;
} }
} }
/**
* INTERN: Hilfsfunktion zum Rendern von Multi-line-Tabellen und Galerien
*/
_renderTable(meta, lines) { _renderTable(meta, lines) {
var tableHtml = '<table>\n'; let tableHtml = '<table>\n';
var currentCells = []; let currentCells = [];
var cellBuffer = []; let cellBuffer = [];
var self = this; let self = this;
for (var i = 0; i < lines.length; i++) { for (let i = 0; i < lines.length; i++) {
var line = lines[i]; let line = lines[i];
var parts = line.split('|'); let parts = line.split('|');
for (var j = 0; j < parts.length; j++) { for (let j = 0; j < parts.length; j++) {
var part = parts[j]; let part = parts[j];
if (j === parts.length - 1) { if (j === parts.length - 1) {
if (part.trim() !== '') { if (part.trim() !== '') {
@ -551,11 +561,11 @@ class SimonUp {
} }
if (line.endsWith('|') && currentCells.length > 0) { if (line.endsWith('|') && currentCells.length > 0) {
var rowContent = currentCells.map(function(c) { let rowContent = currentCells.map(function(c) {
var parsedCell = self._parseInline(c.trim()).replace(/\n/g, '<br>'); let parsedCell = self._parseInline(c.trim()).replace(/\n/g, '<br>');
return '<td>' + parsedCell + '</td>'; return `<td>${parsedCell}</td>`;
}).join('\n'); }).join('\n');
tableHtml += '<tr>\n' + rowContent + '\n</tr>\n'; tableHtml += `<tr>\n${rowContent}\n</tr>\n`;
currentCells = []; currentCells = [];
} }
} }
@ -563,58 +573,61 @@ class SimonUp {
return tableHtml; return tableHtml;
} }
/**
* INTERN: Verarbeitet Fluss-Formatierungen (Inline) mittels V1.2-RegEx
*/
_parseInline(text) { _parseInline(text) {
if (!text) return ''; if (!text) return '';
var html = text; let html = text;
var escapes = []; const escapes = [];
html = html.replace(/\\(.)/g, function(match, char) { html = html.replace(/\\(.)/g, function(match, char) {
escapes.push(char); escapes.push(char);
return ''; return '';
}); });
html = html.replace(/\/\/(\s|$)/g, '$1'); html = html.replace(/\/\/(( \s|$))/g, '$1');
var self = this; let self = this;
var processHeading = function(pattern, callback) { const processHeading = function(pattern, callback) {
var match; let match;
while ((match = pattern.exec(html)) !== null) { while ((match = pattern.exec(html)) !== null) {
var fullMatch = match[0]; const fullMatch = match[0];
var level = parseInt(match[1]); const level = parseInt(match[1]);
var titleAndRest = match[2]; const titleAndRest = match[2];
var title = titleAndRest; let title = titleAndRest;
var rest = ""; let rest = "";
var closeIdx = titleAndRest.indexOf('/#'); const closeIdx = titleAndRest.indexOf('/#');
if (closeIdx !== -1) { if (closeIdx !== -1) {
title = titleAndRest.substring(0, closeIdx); title = titleAndRest.substring(0, closeIdx);
rest = titleAndRest.substring(closeIdx + 2); rest = titleAndRest.substring(closeIdx + 2);
} }
var result = callback(level, title.trim(), rest); const result = callback(level, title.trim(), rest);
html = html.substring(0, match.index) + result + html.substring(match.index + fullMatch.length); html = html.substring(0, match.index) + result + html.substring(match.index + fullMatch.length);
} }
}; };
processHeading(/^([1-6])x#\s*(.*)/g, function(level, title, rest) { processHeading(/^([1-6])x#\s*(.*)/g, function(level, title, rest) {
var numStr = self._getAutoNumber(level); const numStr = self._getAutoNumber(level);
var fullTitle = numStr + ' ' + title; const fullTitle = `${numStr} ${title}`;
var id = _suSlugify(fullTitle); const id = self._slugify(fullTitle);
self.headings.push({ level: level, text: fullTitle, id: id }); self.headings.push({ level: level, text: fullTitle, id: id });
return '<h' + level + ' id="' + id + '">' + fullTitle + '</h' + level + '>' + rest; return `<h${level} id="${id}">${fullTitle}</h${level}>${rest}`;
}); });
processHeading(/^([1-6])-#\s*(.*)/g, function(level, title, rest) { processHeading(/^([1-6])-#\s*(.*)/g, function(level, title, rest) {
return '<h' + level + '>' + title + '</h' + level + '>' + rest; return `<h${level}>${title}</h${level}>${rest}`;
}); });
processHeading(/^([1-6])#\s*(.*)/g, function(level, title, rest) { processHeading(/^([1-6])#\s*(.*)/g, function(level, title, rest) {
var id = _suSlugify(title); const id = self._slugify(title);
self.headings.push({ level: level, text: title, id: id }); self.headings.push({ level: level, text: title, id: id });
return '<h' + level + ' id="' + id + '">' + title + '</h' + level + '>' + rest; return `<h${level} id="${id}">${title}</h${level}>${rest}`;
}); });
var inlineRules = [ const inlineRules = [
{ tag: 'strong', symbol: '\\*\\*' }, { tag: 'strong', symbol: '\\*\\*' },
{ tag: 'span style="font-weight: 500;"', symbol: '\\*' }, { tag: 'span style="font-weight: 500;"', symbol: '\\*' },
{ tag: 'em', symbol: '%' }, { tag: 'em', symbol: '%' },
@ -626,31 +639,31 @@ class SimonUp {
{ tag: 'code', symbol: '`' } { tag: 'code', symbol: '`' }
]; ];
for (var k = 0; k < inlineRules.length; k++) { for (let k = 0; k < inlineRules.length; k++) {
var rule = inlineRules[k]; let rule = inlineRules[k];
var tagSimple = rule.tag.split(' ')[0]; let tagSimple = rule.tag.split(' ')[0];
var regex = new RegExp(rule.symbol + '(.+?)\\x2F' + rule.symbol, 'g'); let regex = new RegExp(rule.symbol + '(.+?)\\\\' + rule.symbol, 'g');
html = html.replace(regex, '<' + rule.tag + '>$1</' + tagSimple + '>'); html = html.replace(regex, `<${rule.tag}>$1</${tagSimple}>`);
var resetRegex = new RegExp(rule.symbol + '(.+?)(?=)', 'g'); let resetRegex = new RegExp(rule.symbol + '(.+?)(?=)', 'g');
html = html.replace(resetRegex, '<' + rule.tag + '>$1</' + tagSimple + '>'); html = html.replace(resetRegex, `<${rule.tag}>$1</${tagSimple}>`);
} }
html = html.replace(//g, ''); html = html.replace(//g, '');
var alignMap = { 'l': 'left', 'r': 'right', 'c': 'center', 'j': 'justify' }; const alignMap = { 'l': 'left', 'r': 'right', 'c': 'center', 'j': 'justify' };
html = html.replace(/>([lrcj])\s+(.+?)\s*\/>/g, function(m, dir, content) { html = html.replace(/>([lrcj])\s+(.+?)\s*\/>/g, function(m, dir, content) {
return '<div style="text-align: ' + alignMap[dir] + ';">' + content + '</div>'; return `<div style="text-align: ${alignMap[dir]};">${content}</div>`;
}); });
html = html.replace(/!\[([^\]]+)\s+w:(\d+)\]\(([^)]+)\)/g, '<img src="$3" alt="$1" style="width: $2px; height: auto;">'); html = html.replace(/!\[([^\]]+)\s+w:(\d+)\]\(([^)]+)\)/g, '<img src="$3" alt="$1" style="width: $2px; height: auto;">');
html = html.replace(/!\[([^\]]+)\]\(([^)]+)\)/g, '<img src="$2" alt="$1">'); html = html.replace(/!\[([^\]]+)\]\(([^)]+)\)/g, '<img src="$2" alt="$1">');
html = html.replace(/\[([^\]]+)\]\{([^}]+)\}/g, '<a href="$2" target="_blank" rel="noopener noreferrer">$1</a>'); html = html.replace(/\[([^\]]+)\]\{([^}]+)\}/g, '<a href="$2" target="_blank" rel="noopener noreferrer">$1</a>');
html = html.replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<a href="$2"></a>'); html = html.replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<a href="$2">$1</a>');
html = html.replace(/\^x\[([^\]]+)\]\^/g, '<span class="footnote-auto" title="$1">[*]</span>'); html = html.replace(/\^x\[([^\]]+)\]\^x/g, '<span class="footnote-auto" title="$1">[*]</span>');
html = html.replace(/\^(\d+)\[([^\]]+)\]\^/g, '<sup class="footnote-manual" title="$2">[$1]</sup>'); html = html.replace(/\^(\d+)\[([^\]]+)\]\^x/g, '<sup class="footnote-manual" title="$2">[$1]</sup>');
html = html.replace(//g, function(match, idx) { html = html.replace(//g, function(match, idx) {
return escapes[idx]; return escapes[idx];
@ -659,16 +672,31 @@ class SimonUp {
return html; return html;
} }
/**
* INTERN: Errechnet die nächste fortlaufende Kapitelnummer
*/
_getAutoNumber(level) { _getAutoNumber(level) {
var idx = level - 1; let idx = level - 1;
this.counters[idx]++; this.counters[idx]++;
for (var i = idx + 1; i < 6; i++) { for (let i = idx + 1; i < 6; i++) {
this.counters[i] = 0; this.counters[i] = 0;
} }
var activeParts = this.counters.slice(0, level); let activeParts = this.counters.slice(0, level);
return activeParts.join('.') + '.'; return activeParts.join('.') + '.';
} }
/**
* INTERN: Macht aus Text eine URL-konforme ID
*/
_slugify(text) {
return text.toLowerCase()
.replace(/[^a-z0-9\s-]/g, '')
.replace(/\s+/g, '-');
}
/**
* INTERN: Erzeugt die fertige HTML-Liste des TOC und injiziert sie in den Block
*/
_injectTOC(html) { _injectTOC(html) {
if (!html.includes('')) { if (!html.includes('')) {
return html; return html;
@ -677,24 +705,24 @@ class SimonUp {
return html.replace('', ''); return html.replace('', '');
} }
var tocListHtml = '<div class="simonup-toc">\n<ul>\n'; let tocListHtml = '<div class="simonup-toc">\n<ul>\n';
var currentLevel = 1; let currentLevel = 1;
for (var i = 0; i < this.headings.length; i++) { for (let i = 0; i < this.headings.length; i++) {
var heading = this.headings[i]; let heading = this.headings[i];
if (heading.level > currentLevel) { if (heading.level > currentLevel) {
var diffUp = heading.level - currentLevel; let diffUp = heading.level - currentLevel;
tocListHtml += '<ul>\n'.repeat(diffUp); tocListHtml += '<ul>\n'.repeat(diffUp);
} else if (heading.level < currentLevel) { } else if (heading.level < currentLevel) {
var diffDown = currentLevel - heading.level; let diffDown = currentLevel - heading.level;
tocListHtml += '</ul>\n'.repeat(diffDown); tocListHtml += '</ul>\n'.repeat(diffDown);
} }
currentLevel = heading.level; currentLevel = heading.level;
tocListHtml += '<li><a href="#' + heading.id + '">' + heading.text + '</a></li>\n'; tocListHtml += `<li><a href="#${heading.id}">${heading.text}</a></li>\n`;
} }
if (currentLevel > 1) { if (currentLevel > 1) {
var diffFinal = currentLevel - 1; let diffFinal = currentLevel - 1;
tocListHtml += '</ul>\n'.repeat(diffFinal); tocListHtml += '</ul>\n'.repeat(diffFinal);
} }
tocListHtml += '</ul>\n</div>'; tocListHtml += '</ul>\n</div>';
@ -702,45 +730,48 @@ class SimonUp {
return html.replace('', tocListHtml); return html.replace('', tocListHtml);
} }
/**
* INTERN: Fasst freie Listen-Elemente zusammen und generiert Absätze (p)
*/
_processParagraphsAndLists(elements) { _processParagraphsAndLists(elements) {
var processed = []; let processed = [];
var paragraphBuffer = []; let paragraphBuffer = [];
var listBuffer = []; let listBuffer = [];
var currentListType = null; let currentListType = null;
var flushList = function() { const flushList = function() {
if (listBuffer.length > 0) { if (listBuffer.length > 0) {
var items = listBuffer.map(function(item) { return ' <li>' + item + '</li>'; }).join('\n'); let items = listBuffer.map(function(item) { return ` <li>${item}</li>`; }).join('\n');
processed.push('<' + currentListType + '>\n' + items + '\n</' + currentListType + '>'); processed.push(`<${currentListType}>\n${items}\n</${currentListType}>`);
listBuffer = []; listBuffer = [];
currentListType = null; currentListType = null;
} }
}; };
var flushParagraph = function() { const flushParagraph = function() {
if (paragraphBuffer.length > 0) { if (paragraphBuffer.length > 0) {
var pContent = paragraphBuffer.join('<br>'); let pContent = paragraphBuffer.join('<br>');
processed.push('<p>' + pContent + '</p>'); processed.push(`<p>${pContent}</p>`);
paragraphBuffer = []; paragraphBuffer = [];
} }
}; };
for (var i = 0; i < elements.length; i++) { for (let i = 0; i < elements.length; i++) {
var element = elements[i]; let element = elements[i];
var isUlItem = element.startsWith('<ul-item>'); let isUlItem = element.startsWith('<ul-item>');
var isOlItem = element.startsWith('<ol-item>'); let isOlItem = element.startsWith('<ol-item>');
if (isUlItem || isOlItem) { if (isUlItem || isOlItem) {
flushParagraph(); flushParagraph();
var type = isUlItem ? 'ul' : 'ol'; let type = isUlItem ? 'ul' : 'ol';
var content = isUlItem ? element.replace(/<\/?ul-item>/g, '') : element.replace(/<\/?ol-item>/g, ''); let content = isUlItem ? element.replace(/<\/?ul-item>/g, '') : element.replace(/<\/?ol-item>/g, '');
if (currentListType && currentListType !== type) { if (currentListType && currentListType !== type) {
flushList(); flushList();
} }
currentListType = type; currentListType = type;
listBuffer.push(content); listBuffer.push(content);
} else if (element.startsWith('<') && !/^(<a>|<strong>|<em>|<u>|<del>|<mark>|<sup>|<sub>|<span>|<code>|<img>|<h\d>)/i.test(element)) { } else if (element.startsWith('<') && !/^(<a>|<strong>|<em>|<u>|<del>|<mark>|<sup>|<sub>|<span>|<code>|<img>|<h\d)/i.test(element)) {
flushList(); flushList();
flushParagraph(); flushParagraph();
processed.push(element); processed.push(element);
@ -758,4 +789,4 @@ class SimonUp {
return processed.join('\n'); return processed.join('\n');
} }
} }