822 lines
26 KiB
JavaScript
822 lines
26 KiB
JavaScript
import {traverse, Node, getAncestors, findCommonAncestor} from "../../DOMUtils.js";
|
|
import {closingIfMarker, eachClosingMarker, eachStartMarkerRegex, elseMarker, ifStartMarkerRegex, variableRegex} from './markers.js'
|
|
|
|
/**
|
|
* @typedef TextPlaceToFill
|
|
* @property { {expression: string, replacedString:string}[] } expressions
|
|
* @property {() => void} fill
|
|
*/
|
|
|
|
class TemplateDOMBranch{
|
|
/** @type {Node} */
|
|
#startNode
|
|
|
|
/** @type {Node} */
|
|
#leafNode
|
|
|
|
// ancestors with this.#ancestors[0] === this.#startNode and this.#ancestors.at(-1) === this.#leafNode
|
|
/** @type {Node[]} */
|
|
#ancestors
|
|
|
|
/**
|
|
*
|
|
* @param {Node} startNode
|
|
* @param {Node} leafNode
|
|
*/
|
|
constructor(startNode, leafNode){
|
|
this.#startNode = startNode
|
|
this.#leafNode = leafNode
|
|
|
|
this.#ancestors = getAncestors(this.#leafNode, this.#startNode).reverse()
|
|
}
|
|
|
|
/**
|
|
*
|
|
* @param {number} n
|
|
* @returns {Node | undefined}
|
|
*/
|
|
at(n){
|
|
return this.#ancestors.at(n)
|
|
}
|
|
|
|
removeLeafAndEmptyAncestors(){
|
|
// it may happen (else marker of if/else/endif) that the leaf was already removed as part of another block
|
|
// so before removing anything, let's update #ancestors and #leaf
|
|
|
|
this.#ancestors.every((ancestor, i) => {
|
|
if(!ancestor.parentNode){
|
|
// ancestor already removed from tree
|
|
this.#ancestors = this.#ancestors.slice(0, i)
|
|
this.#leafNode = this.#ancestors.at(-1)
|
|
return false;
|
|
}
|
|
|
|
return true // continue
|
|
})
|
|
|
|
//console.log('removeLeafAndEmptyAncestors', this.#startNode.textContent)
|
|
let nextLeaf = this.#leafNode.parentNode
|
|
//console.log('nextLeaf', !!nextLeaf)
|
|
nextLeaf.removeChild(this.#leafNode)
|
|
this.#leafNode = nextLeaf
|
|
|
|
while(this.#leafNode !== this.#startNode &&
|
|
this.#leafNode.textContent && this.#leafNode.textContent.trim() === '')
|
|
{
|
|
nextLeaf = this.#leafNode.parentNode
|
|
this.#leafNode.parentNode.removeChild(this.#leafNode)
|
|
this.#leafNode = nextLeaf
|
|
}
|
|
|
|
this.#ancestors = getAncestors(this.#startNode, this.#leafNode).reverse()
|
|
}
|
|
|
|
/**
|
|
*
|
|
* @param {number} [startIndex]
|
|
*/
|
|
removeRightContent(startIndex = 0){
|
|
for(const branchNode of this.#ancestors.slice(startIndex)){
|
|
let toRemove = branchNode.nextSibling
|
|
|
|
while(toRemove){
|
|
const toRemoveNext = toRemove.nextSibling
|
|
toRemove.parentNode.removeChild(toRemove)
|
|
toRemove = toRemoveNext
|
|
}
|
|
}
|
|
}
|
|
|
|
/**
|
|
*
|
|
* @param {number} [startIndex]
|
|
*/
|
|
removeLeftContent(startIndex = 0){
|
|
for(const branchNode of this.#ancestors.slice(startIndex)){
|
|
let toRemove = branchNode.previousSibling
|
|
|
|
while(toRemove){
|
|
const toRemoveNext = toRemove.previousSibling
|
|
toRemove.parentNode.removeChild(toRemove)
|
|
toRemove = toRemoveNext
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
class TemplateBlock{
|
|
/** @type {Element | Document | DocumentFragment} */
|
|
#commonAncestor;
|
|
/** @type {TemplateDOMBranch} */
|
|
#startBranch;
|
|
/** @type {TemplateDOMBranch} */
|
|
#endBranch;
|
|
|
|
/** @type {Node[]} */
|
|
#middleContent;
|
|
|
|
/**
|
|
*
|
|
* @param {Node} startMarkerNode
|
|
* @param {Node} endMarkerNode
|
|
*/
|
|
constructor(startMarkerNode, endMarkerNode){
|
|
// @ts-expect-error xmldom.Node
|
|
this.#commonAncestor = findCommonAncestor(startMarkerNode, endMarkerNode)
|
|
|
|
this.#startBranch = new TemplateDOMBranch(this.#commonAncestor, startMarkerNode)
|
|
this.#endBranch = new TemplateDOMBranch(this.#commonAncestor, endMarkerNode)
|
|
|
|
this.#middleContent = []
|
|
|
|
let content = this.#startBranch.at(1).nextSibling
|
|
while(content && content !== this.#endBranch.at(1)){
|
|
this.#middleContent.push(content)
|
|
content = content.nextSibling
|
|
}
|
|
|
|
//console.log('TemplateBlock')
|
|
//console.log('startBranch', this.#startBranch.at(1).textContent)
|
|
//console.log('middleContent', this.#middleContent.map(n => n.textContent).join(''))
|
|
//console.log('endBranch', this.#endBranch.at(1).textContent)
|
|
}
|
|
|
|
removeMarkersAndEmptyAncestors(){
|
|
//console.log('removeMarkersAndEmptyAncestors startBranch')
|
|
this.#startBranch.removeLeafAndEmptyAncestors()
|
|
//console.log('removeMarkersAndEmptyAncestors endBranch')
|
|
this.#endBranch.removeLeafAndEmptyAncestors()
|
|
}
|
|
|
|
/**
|
|
*
|
|
* @param {Compartment} compartement
|
|
*/
|
|
fillBlockContentTemplate(compartement){
|
|
const startChild = this.#startBranch.at(1)
|
|
if(startChild){
|
|
fillOdtElementTemplate(startChild, compartement)
|
|
}
|
|
|
|
for(const content of this.#middleContent){
|
|
fillOdtElementTemplate(content, compartement)
|
|
}
|
|
|
|
const endChild = this.#endBranch.at(1)
|
|
if(endChild){
|
|
fillOdtElementTemplate(endChild, compartement)
|
|
}
|
|
}
|
|
|
|
removeContent(){
|
|
this.#startBranch.removeRightContent(2)
|
|
|
|
for(const content of this.#middleContent){
|
|
content.parentNode.removeChild(content)
|
|
}
|
|
|
|
this.#endBranch.removeLeftContent(2)
|
|
}
|
|
}
|
|
|
|
|
|
/**
|
|
* @param {string} str
|
|
* @param {Compartment} compartment
|
|
* @returns {TextPlaceToFill | undefined}
|
|
*/
|
|
function findPlacesToFillInString(str, compartment) {
|
|
const varRexExp = new RegExp(variableRegex.source, 'g');
|
|
const matches = str.matchAll(varRexExp)
|
|
|
|
/** @type {TextPlaceToFill['expressions']} */
|
|
const expressions = []
|
|
|
|
/** @type {(string | ((data:any) => void))[]} */
|
|
const parts = []
|
|
let remaining = str;
|
|
|
|
for(const match of matches) {
|
|
//console.log('match', match)
|
|
const [matched, group1] = match
|
|
|
|
const replacedString = matched
|
|
const expression = group1.trim()
|
|
expressions.push({expression, replacedString})
|
|
|
|
const [fixedPart, newRemaining] = remaining.split(replacedString, 2)
|
|
|
|
if(fixedPart.length >= 1)
|
|
parts.push(fixedPart)
|
|
|
|
parts.push(() => compartment.evaluate(expression))
|
|
|
|
remaining = newRemaining
|
|
}
|
|
|
|
if(remaining.length >= 1)
|
|
parts.push(remaining)
|
|
|
|
//console.log('parts', parts)
|
|
|
|
|
|
if(remaining === str) {
|
|
// no match found
|
|
return undefined
|
|
}
|
|
else {
|
|
return {
|
|
expressions,
|
|
fill: (data) => {
|
|
return parts.map(p => {
|
|
if(typeof p === 'string')
|
|
return p
|
|
else
|
|
return p(data)
|
|
})
|
|
.join('')
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
/**
|
|
* Content between blockStartNode and blockEndNode is extracted to a documentFragment
|
|
* The original document is modified because nodes are removed from it to be part of the returned documentFragment
|
|
*
|
|
* startChild and endChild are ancestors of, respectively, blockStartNode and blockEndNode
|
|
* and startChild.parentNode === endChild.parentNode
|
|
*
|
|
* @precondition blockStartNode needs to be before blockEndNode in document order
|
|
*
|
|
* @param {Node} blockStartNode
|
|
* @param {Node} blockEndNode
|
|
* @returns {{removeMarkers: () => void, insertContent: (n : Node) => void, content: DocumentFragment}}
|
|
*/
|
|
function extractBlockContent(blockStartNode, blockEndNode) {
|
|
//console.log('[extractBlockContent] blockStartNode', blockStartNode.textContent)
|
|
//console.log('[extractBlockContent] blockEndNode', blockEndNode.textContent)
|
|
|
|
// find common ancestor of blockStartNode and blockEndNode
|
|
let commonAncestor
|
|
|
|
let startAncestor = blockStartNode
|
|
let endAncestor = blockEndNode
|
|
|
|
// ancestries in order of deepest first, closest to root last
|
|
const startAncestry = new Set([startAncestor])
|
|
const endAncestry = new Set([endAncestor])
|
|
|
|
while(!startAncestry.has(endAncestor) && !endAncestry.has(startAncestor)) {
|
|
if(startAncestor.parentNode) {
|
|
startAncestor = startAncestor.parentNode
|
|
startAncestry.add(startAncestor)
|
|
}
|
|
if(endAncestor.parentNode) {
|
|
endAncestor = endAncestor.parentNode
|
|
endAncestry.add(endAncestor)
|
|
}
|
|
}
|
|
|
|
if(startAncestry.has(endAncestor)) {
|
|
commonAncestor = endAncestor
|
|
}
|
|
else {
|
|
commonAncestor = startAncestor
|
|
}
|
|
|
|
//console.log('extractBlockContent', commonAncestor.textContent)
|
|
|
|
const startAncestryToCommonAncestor = [...startAncestry].slice(0, [...startAncestry].indexOf(commonAncestor))
|
|
const endAncestryToCommonAncestor = [...endAncestry].slice(0, [...endAncestry].indexOf(commonAncestor))
|
|
|
|
// direct children of commonAncestor in the branch or blockStartNode and blockEndNode respectively
|
|
const startChild = startAncestryToCommonAncestor.at(-1)
|
|
const endChild = endAncestryToCommonAncestor.at(-1)
|
|
|
|
//console.log('[extractBlockContent] startChild', startChild.childNodes.length, startChild.textContent)
|
|
//console.log('[extractBlockContent] endChild', endChild.childNodes.length,endChild.textContent)
|
|
|
|
// Extract DOM content in a documentFragment
|
|
/** @type {DocumentFragment} */
|
|
const contentFragment = blockStartNode.ownerDocument.createDocumentFragment()
|
|
|
|
/** @type {Element[]} */
|
|
const blockContent = []
|
|
|
|
// get start branch "right" content
|
|
for(const startAncestor of startAncestryToCommonAncestor){
|
|
if(startAncestor === startChild)
|
|
break;
|
|
|
|
let sibling = startAncestor.nextSibling
|
|
|
|
while(sibling) {
|
|
blockContent.push(sibling)
|
|
sibling = sibling.nextSibling;
|
|
}
|
|
}
|
|
|
|
|
|
let sibling = startChild.nextSibling
|
|
|
|
while(sibling !== endChild) {
|
|
blockContent.push(sibling)
|
|
sibling = sibling.nextSibling;
|
|
}
|
|
|
|
|
|
// get end branch "left" content
|
|
for(const endAncestor of [...endAncestryToCommonAncestor].reverse()){
|
|
if(endAncestor === endChild)
|
|
continue; // already taken care of
|
|
|
|
let sibling = endAncestor.previousSibling
|
|
|
|
const reversedBlockContentContribution = []
|
|
|
|
while(sibling) {
|
|
reversedBlockContentContribution.push(sibling)
|
|
sibling = sibling.previousSibling;
|
|
}
|
|
|
|
const blockContentContribution = reversedBlockContentContribution.reverse()
|
|
|
|
blockContent.push(...blockContentContribution)
|
|
|
|
if(endAncestor === blockEndNode)
|
|
break;
|
|
}
|
|
|
|
|
|
//console.log('blockContent', blockContent.map(n => n.textContent))
|
|
|
|
|
|
for(const sibling of blockContent) {
|
|
sibling.parentNode?.removeChild(sibling)
|
|
contentFragment.appendChild(sibling)
|
|
}
|
|
|
|
//console.log('extractBlockContent contentFragment', contentFragment.textContent)
|
|
|
|
let insertionParent;
|
|
|
|
if(startAncestryToCommonAncestor.length >= endAncestryToCommonAncestor.length){
|
|
insertionParent = blockStartNode.parentNode
|
|
}
|
|
else{
|
|
insertionParent = blockEndNode.parentNode
|
|
}
|
|
|
|
let insertionBeforeNodeCandidates
|
|
if(blockEndNode.nextSibling){
|
|
insertionBeforeNodeCandidates = [blockEndNode.nextSibling]
|
|
while(insertionBeforeNodeCandidates.at(-1).nextSibling){
|
|
insertionBeforeNodeCandidates.push(insertionBeforeNodeCandidates.at(-1).nextSibling)
|
|
}
|
|
}
|
|
|
|
/**
|
|
* @param {Node} content
|
|
*/
|
|
function insertContent(content){
|
|
//console.log('insertContent', node.textContent, insertionBeforeNodeCandidates.map(n => `${n.nodeName} - ${n.textContent}`))
|
|
let insertionBeforeNode
|
|
|
|
if(insertionBeforeNodeCandidates){
|
|
insertionBeforeNode = insertionBeforeNodeCandidates.find(node => node.parentNode === insertionParent)
|
|
}
|
|
|
|
console.log('insertContent insertionBeforeNode', insertionBeforeNode && insertionBeforeNode.textContent)
|
|
|
|
|
|
if(insertionBeforeNode){
|
|
insertionParent.insertBefore(content, insertionBeforeNode)
|
|
}
|
|
else{
|
|
console.log('insertionParent', insertionParent.nodeName)
|
|
console.log('insertionParent content before append', insertionParent.textContent)
|
|
//console.log('insertionParent owner doc', insertionParent.ownerDocument)
|
|
|
|
insertionParent.appendChild(content)
|
|
console.log('insertionParent content after append', insertionParent.textContent)
|
|
}
|
|
}
|
|
|
|
console.log('contentFragment',
|
|
contentFragment.childNodes.length,
|
|
contentFragment.childNodes[0].nodeName,
|
|
contentFragment.textContent
|
|
)
|
|
|
|
return {
|
|
removeMarkers(){
|
|
for(const marker of [blockStartNode, blockEndNode]){
|
|
console.log('removing marker', marker.nodeName, marker.textContent)
|
|
|
|
try{
|
|
marker.parentNode.removeChild(marker)
|
|
}
|
|
catch(e){}
|
|
}
|
|
},
|
|
insertContent,
|
|
content: contentFragment
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
/**
|
|
*
|
|
* @param {Node} ifOpeningMarkerNode
|
|
* @param {Node | undefined} ifElseMarkerNode
|
|
* @param {Node} ifClosingMarkerNode
|
|
* @param {string} ifBlockConditionExpression
|
|
* @param {Compartment} compartment
|
|
*/
|
|
function fillIfBlock(ifOpeningMarkerNode, ifElseMarkerNode, ifClosingMarkerNode, ifBlockConditionExpression, compartment) {
|
|
const conditionValue = compartment.evaluate(ifBlockConditionExpression)
|
|
|
|
/** @type {TemplateBlock | undefined} */
|
|
let thenTemplateBlock
|
|
/** @type {TemplateBlock | undefined} */
|
|
let elseTemplateBlock
|
|
|
|
if(ifElseMarkerNode) {
|
|
/*console.log('before first extract',
|
|
ifOpeningMarkerNode.childNodes.length, ifOpeningMarkerNode.textContent,
|
|
ifElseMarkerNode.childNodes.length, ifElseMarkerNode.textContent
|
|
)*/
|
|
|
|
thenTemplateBlock = new TemplateBlock(ifOpeningMarkerNode, ifElseMarkerNode)
|
|
elseTemplateBlock = new TemplateBlock(ifElseMarkerNode, ifClosingMarkerNode)
|
|
}
|
|
else {
|
|
thenTemplateBlock = new TemplateBlock(ifOpeningMarkerNode, ifClosingMarkerNode)
|
|
}
|
|
|
|
thenTemplateBlock.removeMarkersAndEmptyAncestors()
|
|
if(elseTemplateBlock){
|
|
elseTemplateBlock.removeMarkersAndEmptyAncestors()
|
|
}
|
|
|
|
|
|
if(conditionValue) {
|
|
thenTemplateBlock.fillBlockContentTemplate(compartment)
|
|
|
|
if(elseTemplateBlock){
|
|
elseTemplateBlock.removeContent()
|
|
}
|
|
}
|
|
else{
|
|
thenTemplateBlock.removeContent()
|
|
|
|
if(elseTemplateBlock){
|
|
elseTemplateBlock.fillBlockContentTemplate(compartment)
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
|
|
/**
|
|
*
|
|
* @param {Node} startNode
|
|
* @param {string} iterableExpression
|
|
* @param {string} itemExpression
|
|
* @param {Node} endNode
|
|
* @param {Compartment} compartment
|
|
*/
|
|
function fillEachBlock(startNode, iterableExpression, itemExpression, endNode, compartment) {
|
|
//console.log('fillEachBlock', iterableExpression, itemExpression)
|
|
|
|
const docEl = startNode.ownerDocument.documentElement
|
|
|
|
const {removeMarkers, insertContent, content: repeatedFragment} = extractBlockContent(startNode, endNode)
|
|
|
|
// Find the iterable in the data
|
|
// PPP eventually, evaluate the expression as a JS expression
|
|
let iterable = compartment.evaluate(iterableExpression)
|
|
if(!iterable || typeof iterable[Symbol.iterator] !== 'function') {
|
|
// when there is no iterable, silently replace with empty array
|
|
iterable = []
|
|
}
|
|
|
|
let firstItemFirstChild
|
|
let lastItemLastChild
|
|
|
|
// store before-text in startNodePreviousSiblings
|
|
const startNodePreviousSiblings = []
|
|
let startNodePreviousSibling = startNode.previousSibling
|
|
while(startNodePreviousSibling){
|
|
startNodePreviousSiblings.push(startNodePreviousSibling)
|
|
startNodePreviousSibling = startNodePreviousSibling.previousSibling
|
|
}
|
|
|
|
// set the array back to tree order
|
|
startNodePreviousSiblings.reverse()
|
|
|
|
|
|
// store after-text in endNodeNextSiblings
|
|
const endNodeNextSiblings = []
|
|
let endNodeNextSibling = endNode.nextSibling
|
|
while(endNodeNextSibling){
|
|
endNodeNextSiblings.push(endNodeNextSibling)
|
|
endNodeNextSibling = endNodeNextSibling.nextSibling
|
|
}
|
|
|
|
// create each loop result
|
|
// using a for-of loop to accept all iterable values
|
|
for(const item of iterable) {
|
|
|
|
/** @type {DocumentFragment} */
|
|
// @ts-ignore
|
|
const itemFragment = repeatedFragment.cloneNode(true)
|
|
|
|
let insideCompartment = new Compartment({
|
|
globals: Object.assign({}, compartment.globalThis, {[itemExpression]: item}),
|
|
__options__: true
|
|
})
|
|
|
|
// recursive call to fillTemplatedOdtElement on itemFragment
|
|
fillOdtElementTemplate(
|
|
itemFragment,
|
|
insideCompartment
|
|
)
|
|
|
|
console.log('itemFragment', itemFragment.textContent)
|
|
|
|
|
|
if(!firstItemFirstChild){
|
|
firstItemFirstChild = itemFragment.firstChild
|
|
}
|
|
|
|
// eventually, will be set to the last item's last child
|
|
lastItemLastChild = itemFragment.lastChild
|
|
|
|
insertContent(itemFragment)
|
|
|
|
console.log('doc', docEl.textContent)
|
|
}
|
|
|
|
if(startNodePreviousSiblings.length >= 1){
|
|
let firstItemFirstestDescendant = firstItemFirstChild
|
|
while(firstItemFirstestDescendant?.firstChild){
|
|
firstItemFirstestDescendant = firstItemFirstestDescendant.firstChild
|
|
}
|
|
|
|
for(const beforeFirstNodeElement of startNodePreviousSiblings){
|
|
firstItemFirstestDescendant?.parentNode?.insertBefore(beforeFirstNodeElement, firstItemFirstestDescendant)
|
|
}
|
|
}
|
|
|
|
console.log('doc after add before-text if any', docEl.textContent)
|
|
|
|
|
|
if(endNodeNextSiblings.length >= 1){
|
|
let lastItemLatestDescendant = lastItemLastChild
|
|
while(lastItemLatestDescendant?.lastChild){
|
|
lastItemLatestDescendant = lastItemLatestDescendant.lastChild
|
|
}
|
|
|
|
for(const afterEndNodeElement of endNodeNextSiblings){
|
|
console.log('doc in for-of', docEl.textContent)
|
|
console.log('afterEndNodeElement', afterEndNodeElement.textContent)
|
|
lastItemLatestDescendant?.parentNode?.appendChild(afterEndNodeElement)
|
|
}
|
|
}
|
|
|
|
console.log('doc before removeMarkers', docEl.textContent)
|
|
// remove block marker elements
|
|
removeMarkers()
|
|
console.log('doc after removeMarkers', docEl.textContent)
|
|
}
|
|
|
|
|
|
const IF = ifStartMarkerRegex.source
|
|
const EACH = eachStartMarkerRegex.source
|
|
|
|
/**
|
|
*
|
|
* @param {Element | DocumentFragment | Document} rootElement
|
|
* @param {Compartment} compartment
|
|
* @returns {void}
|
|
*/
|
|
export default function fillOdtElementTemplate(rootElement, compartment) {
|
|
//console.log('fillTemplatedOdtElement', rootElement.nodeType, rootElement.nodeName, rootElement.textContent)
|
|
//console.log('fillTemplatedOdtElement', rootElement.childNodes[0].childNodes.length)
|
|
|
|
let currentlyOpenBlocks = []
|
|
|
|
/** @type {Node | undefined} */
|
|
let eachOpeningMarkerNode
|
|
/** @type {Node | undefined} */
|
|
let eachClosingMarkerNode
|
|
|
|
let eachBlockIterableExpression, eachBlockItemExpression;
|
|
|
|
|
|
/** @type {Node | undefined} */
|
|
let ifOpeningMarkerNode
|
|
/** @type {Node | undefined} */
|
|
let ifElseMarkerNode
|
|
/** @type {Node | undefined} */
|
|
let ifClosingMarkerNode
|
|
|
|
let ifBlockConditionExpression
|
|
// Traverse "in document order"
|
|
|
|
|
|
// @ts-ignore
|
|
traverse(rootElement, currentNode => {
|
|
//console.log('currentlyOpenBlocks', currentlyOpenBlocks)
|
|
|
|
const insideAnOpenBlock = currentlyOpenBlocks.length >= 1
|
|
|
|
if(currentNode.nodeType === Node.TEXT_NODE) {
|
|
const text = currentNode.textContent || ''
|
|
|
|
/**
|
|
* looking for {#each x as y}
|
|
*/
|
|
const eachStartMatch = text.match(eachStartMarkerRegex);
|
|
|
|
if(eachStartMatch) {
|
|
//console.log('startMatch', startMatch)
|
|
|
|
currentlyOpenBlocks.push(EACH)
|
|
|
|
if(insideAnOpenBlock) {
|
|
// do nothing
|
|
}
|
|
else {
|
|
let [_, _iterableExpression, _itemExpression] = eachStartMatch
|
|
|
|
eachBlockIterableExpression = _iterableExpression
|
|
eachBlockItemExpression = _itemExpression
|
|
eachOpeningMarkerNode = currentNode
|
|
}
|
|
}
|
|
|
|
|
|
/**
|
|
* Looking for {/each}
|
|
*/
|
|
const isEachClosingBlock = text.includes(eachClosingMarker)
|
|
|
|
if(isEachClosingBlock) {
|
|
|
|
//console.log('isEachClosingBlock', isEachClosingBlock)
|
|
|
|
if(!eachOpeningMarkerNode)
|
|
throw new Error(`{/each} found without corresponding opening {#each x as y}`)
|
|
|
|
if(currentlyOpenBlocks.at(-1) !== EACH)
|
|
throw new Error(`{/each} found while the last opened block was not an opening {#each x as y}`)
|
|
|
|
if(currentlyOpenBlocks.length === 1) {
|
|
eachClosingMarkerNode = currentNode
|
|
|
|
// found an {#each} and its corresponding {/each}
|
|
// execute replacement loop
|
|
fillEachBlock(eachOpeningMarkerNode, eachBlockIterableExpression, eachBlockItemExpression, eachClosingMarkerNode, compartment)
|
|
|
|
eachOpeningMarkerNode = undefined
|
|
eachBlockIterableExpression = undefined
|
|
eachBlockItemExpression = undefined
|
|
eachClosingMarkerNode = undefined
|
|
}
|
|
else {
|
|
// ignore because it will be treated as part of the outer {#each}
|
|
}
|
|
|
|
currentlyOpenBlocks.pop()
|
|
}
|
|
|
|
|
|
/**
|
|
* Looking for {#if ...}
|
|
*/
|
|
const ifStartMatch = text.match(ifStartMarkerRegex);
|
|
|
|
if(ifStartMatch) {
|
|
currentlyOpenBlocks.push(IF)
|
|
|
|
if(insideAnOpenBlock) {
|
|
// do nothing because the marker is too deep
|
|
}
|
|
else {
|
|
let [_, _ifBlockConditionExpression] = ifStartMatch
|
|
|
|
ifBlockConditionExpression = _ifBlockConditionExpression
|
|
ifOpeningMarkerNode = currentNode
|
|
}
|
|
}
|
|
|
|
|
|
/**
|
|
* Looking for {:else}
|
|
*/
|
|
const hasElseMarker = text.includes(elseMarker);
|
|
|
|
if(hasElseMarker) {
|
|
if(!insideAnOpenBlock)
|
|
throw new Error('{:else} without a corresponding {#if}')
|
|
|
|
if(currentlyOpenBlocks.length === 1) {
|
|
if(currentlyOpenBlocks[0] === IF) {
|
|
ifElseMarkerNode = currentNode
|
|
}
|
|
else
|
|
throw new Error('{:else} inside an {#each} but without a corresponding {#if}')
|
|
}
|
|
else {
|
|
// do nothing because the marker is too deep
|
|
}
|
|
}
|
|
|
|
|
|
/**
|
|
* Looking for {/if}
|
|
*/
|
|
const ifClosingMarker = text.includes(closingIfMarker);
|
|
|
|
if(ifClosingMarker) {
|
|
if(!insideAnOpenBlock)
|
|
throw new Error('{/if} without a corresponding {#if}')
|
|
|
|
if(currentlyOpenBlocks.length === 1) {
|
|
if(currentlyOpenBlocks[0] === IF) {
|
|
ifClosingMarkerNode = currentNode
|
|
|
|
// found an {#if} and its corresponding {/if}
|
|
// execute replacement loop
|
|
fillIfBlock(ifOpeningMarkerNode, ifElseMarkerNode, ifClosingMarkerNode, ifBlockConditionExpression, compartment)
|
|
|
|
ifOpeningMarkerNode = undefined
|
|
ifElseMarkerNode = undefined
|
|
ifClosingMarkerNode = undefined
|
|
ifBlockConditionExpression = undefined
|
|
}
|
|
else
|
|
throw new Error('{/if} inside an {#each} but without a corresponding {#if}')
|
|
}
|
|
else {
|
|
// do nothing because the marker is too deep
|
|
}
|
|
|
|
currentlyOpenBlocks.pop()
|
|
}
|
|
|
|
|
|
/**
|
|
* Looking for variables for substitutions
|
|
*/
|
|
if(!insideAnOpenBlock) {
|
|
// @ts-ignore
|
|
if(currentNode.data) {
|
|
// @ts-ignore
|
|
const placesToFill = findPlacesToFillInString(currentNode.data, compartment)
|
|
|
|
if(placesToFill) {
|
|
const newText = placesToFill.fill()
|
|
// @ts-ignore
|
|
const newTextNode = currentNode.ownerDocument?.createTextNode(newText)
|
|
// @ts-ignore
|
|
currentNode.parentNode?.replaceChild(newTextNode, currentNode)
|
|
}
|
|
}
|
|
}
|
|
else {
|
|
// ignore because it will be treated as part of the outer {#each} block
|
|
}
|
|
}
|
|
|
|
if(currentNode.nodeType === Node.ATTRIBUTE_NODE) {
|
|
// Looking for variables for substitutions
|
|
if(!insideAnOpenBlock) {
|
|
// @ts-ignore
|
|
if(currentNode.value) {
|
|
// @ts-ignore
|
|
const placesToFill = findPlacesToFillInString(currentNode.value, compartment)
|
|
if(placesToFill) {
|
|
// @ts-ignore
|
|
currentNode.value = placesToFill.fill()
|
|
}
|
|
}
|
|
}
|
|
else {
|
|
// ignore because it will be treated as part of the {#each} block
|
|
}
|
|
}
|
|
})
|
|
}
|