msb-public
/
svelte
mirror of https://github.com/sveltejs/svelte
1
0
Code Issues Projects Releases Wiki Activity

more simplification

Browse Source
pull/992/head
Rich Harris 8 years ago
parent 05d63e6ba7
commit 16bac3bbca
12 changed files with 128 additions and 131 deletions
Show Stats Download Patch File Download Diff File

20
src/generators/nodes/AwaitBlock.ts
Unescape View File

@ -64,11 +64,12 @@ export default class AwaitBlock extends Node {
build( build(
block: Block, block: Block,
state: { parentNode: string, parentNodes: string } parentNode: string,
parentNodes: string
) { ) {
const name = this.var; const name = this.var;
const needsAnchor = this.next ? !this.next.isDomNode() : !state.parentNode || !this.parent.isDomNode(); const needsAnchor = this.next ? !this.next.isDomNode() : !parentNode || !this.parent.isDomNode();
const anchor = needsAnchor const anchor = needsAnchor
? block.getUniqueName(`${name}_anchor`) ? block.getUniqueName(`${name}_anchor`)
: (this.next && this.next.var) || 'null'; : (this.next && this.next.var) || 'null';
@ -83,7 +84,7 @@ export default class AwaitBlock extends Node {
anchor, anchor,
`@createComment()`, `@createComment()`,
`@createComment()`, `@createComment()`,
state.parentNode parentNode
); );
} }
@ -119,7 +120,7 @@ export default class AwaitBlock extends Node {
${old_block}.u(); ${old_block}.u();
${old_block}.d(); ${old_block}.d();
${await_block}.c(); ${await_block}.c();
${await_block}.m(${state.parentNode || `${anchor}.parentNode`}, ${anchor}); ${await_block}.m(${parentNode || `${anchor}.parentNode`}, ${anchor});
} }
} }
@ -155,11 +156,11 @@ export default class AwaitBlock extends Node {
`); `);
block.builders.claim.addBlock(deindent` block.builders.claim.addBlock(deindent`
${await_block}.l(${state.parentNodes}); ${await_block}.l(${parentNodes});
`); `);
const targetNode = state.parentNode || '#target'; const targetNode = parentNode || '#target';
const anchorNode = state.parentNode ? 'null' : 'anchor'; const anchorNode = parentNode ? 'null' : 'anchor';
block.builders.mount.addBlock(deindent` block.builders.mount.addBlock(deindent`
${await_block}.m(${targetNode}, ${anchorNode}); ${await_block}.m(${targetNode}, ${anchorNode});
@ -205,10 +206,7 @@ export default class AwaitBlock extends Node {
[this.pending, this.then, this.catch].forEach(status => { [this.pending, this.then, this.catch].forEach(status => {
status.children.forEach(child => { status.children.forEach(child => {
child.build(status._block, { child.build(status._block, null,'nodes');
parentNode: null,
parentNodes: 'nodes'
});
}); });
}); });
} }

24
src/generators/nodes/Component.ts
Unescape View File

@ -62,7 +62,8 @@ export default class Component extends Node {
build( build(
block: Block, block: Block,
state: { parentNode: string, parentNodes: string } parentNode: string,
parentNodes: string
) { ) {
const { generator } = this; const { generator } = this;
generator.hasComponents = true; generator.hasComponents = true;
@ -76,10 +77,7 @@ export default class Component extends Node {
componentInitProperties.push(`slots: { ${slots.join(', ')} }`); componentInitProperties.push(`slots: { ${slots.join(', ')} }`);
this.children.forEach((child: Node) => { this.children.forEach((child: Node) => {
child.build(block, { child.build(block, `${this.var}._slotted.default`, 'nodes');
parentNode: `${this.var}._slotted.default`,
parentNodes: 'nodes'
});
}); });
} }
@ -252,7 +250,7 @@ export default class Component extends Node {
block.contextualise(this.expression); block.contextualise(this.expression);
const { dependencies, snippet } = this.metadata; const { dependencies, snippet } = this.metadata;
const needsAnchor = this.next ? !this.next.isDomNode() : !state.parentNode || !this.parent.isDomNode(); const needsAnchor = this.next ? !this.next.isDomNode() : !parentNode || !this.parent.isDomNode();
const anchor = needsAnchor const anchor = needsAnchor
? block.getUniqueName(`${name}_anchor`) ? block.getUniqueName(`${name}_anchor`)
: (this.next && this.next.var) || 'null'; : (this.next && this.next.var) || 'null';
@ -262,7 +260,7 @@ export default class Component extends Node {
anchor, anchor,
`@createComment()`, `@createComment()`,
`@createComment()`, `@createComment()`,
state.parentNode parentNode
); );
} }
@ -298,11 +296,11 @@ export default class Component extends Node {
); );
block.builders.claim.addLine( block.builders.claim.addLine(
`if (${name}) ${name}._fragment.l(${state.parentNodes});` `if (${name}) ${name}._fragment.l(${parentNodes});`
); );
block.builders.mount.addLine( block.builders.mount.addLine(
`if (${name}) ${name}._mount(${state.parentNode || '#target'}, ${state.parentNode ? 'null' : 'anchor'});` `if (${name}) ${name}._mount(${parentNode || '#target'}, ${parentNode ? 'null' : 'anchor'});`
); );
block.builders.update.addBlock(deindent` block.builders.update.addBlock(deindent`
@ -341,7 +339,7 @@ export default class Component extends Node {
`); `);
} }
if (!state.parentNode) block.builders.unmount.addLine(`if (${name}) ${name}._unmount();`); if (!parentNode) block.builders.unmount.addLine(`if (${name}) ${name}._unmount();`);
block.builders.destroy.addLine(`if (${name}) ${name}.destroy(false);`); block.builders.destroy.addLine(`if (${name}) ${name}.destroy(false);`);
} else { } else {
@ -365,11 +363,11 @@ export default class Component extends Node {
block.builders.create.addLine(`${name}._fragment.c();`); block.builders.create.addLine(`${name}._fragment.c();`);
block.builders.claim.addLine( block.builders.claim.addLine(
`${name}._fragment.l(${state.parentNodes});` `${name}._fragment.l(${parentNodes});`
); );
block.builders.mount.addLine( block.builders.mount.addLine(
`${name}._mount(${state.parentNode || '#target'}, ${state.parentNode ? 'null' : 'anchor'});` `${name}._mount(${parentNode || '#target'}, ${parentNode ? 'null' : 'anchor'});`
); );
if (updates.length) { if (updates.length) {
@ -381,7 +379,7 @@ export default class Component extends Node {
`); `);
} }
if (!state.parentNode) block.builders.unmount.addLine(`${name}._unmount();`); if (!parentNode) block.builders.unmount.addLine(`${name}._unmount();`);
block.builders.destroy.addLine(deindent` block.builders.destroy.addLine(deindent`
${name}.destroy(false); ${name}.destroy(false);

72
src/generators/nodes/EachBlock.ts
Unescape View File

@ -3,7 +3,6 @@ import Node from './shared/Node';
import ElseBlock from './ElseBlock'; import ElseBlock from './ElseBlock';
import { DomGenerator } from '../dom/index'; import { DomGenerator } from '../dom/index';
import Block from '../dom/Block'; import Block from '../dom/Block';
import State from '../dom/State';
import createDebuggingComment from '../../utils/createDebuggingComment'; import createDebuggingComment from '../../utils/createDebuggingComment';
export default class EachBlock extends Node { export default class EachBlock extends Node {
@ -104,7 +103,8 @@ export default class EachBlock extends Node {
build( build(
block: Block, block: Block,
state: { parentNode: string, parentNodes: string } parentNode: string,
parentNodes: string
) { ) {
const { generator } = this; const { generator } = this;
@ -115,7 +115,7 @@ export default class EachBlock extends Node {
const iterations = this.iterations; const iterations = this.iterations;
const params = block.params.join(', '); const params = block.params.join(', ');
const needsAnchor = this.next ? !this.next.isDomNode() : !state.parentNode || !this.parent.isDomNode(); const needsAnchor = this.next ? !this.next.isDomNode() : !parentNode || !this.parent.isDomNode();
const anchor = needsAnchor const anchor = needsAnchor
? block.getUniqueName(`${each}_anchor`) ? block.getUniqueName(`${each}_anchor`)
: (this.next && this.next.var) || 'null'; : (this.next && this.next.var) || 'null';
@ -145,19 +145,19 @@ export default class EachBlock extends Node {
block.builders.init.addLine(`var ${each_block_value} = ${snippet};`); block.builders.init.addLine(`var ${each_block_value} = ${snippet};`);
if (this.key) { if (this.key) {
keyed(generator, block, state, this, snippet, vars); keyed(generator, block, parentNode, parentNodes, this, snippet, vars);
} else { } else {
unkeyed(generator, block, state, this, snippet, vars); unkeyed(generator, block, parentNode, parentNodes, this, snippet, vars);
} }
const isToplevel = !state.parentNode; const isToplevel = !parentNode;
if (needsAnchor) { if (needsAnchor) {
block.addElement( block.addElement(
anchor, anchor,
`@createComment()`, `@createComment()`,
`@createComment()`, `@createComment()`,
state.parentNode parentNode
); );
} }
@ -176,11 +176,11 @@ export default class EachBlock extends Node {
block.builders.mount.addBlock(deindent` block.builders.mount.addBlock(deindent`
if (${each_block_else}) { if (${each_block_else}) {
${each_block_else}.${mountOrIntro}(${state.parentNode || '#target'}, null); ${each_block_else}.${mountOrIntro}(${parentNode || '#target'}, null);
} }
`); `);
const parentNode = state.parentNode || `${anchor}.parentNode`; const targetNode = parentNode || `${anchor}.parentNode`;
if (this.else._block.hasUpdateMethod) { if (this.else._block.hasUpdateMethod) {
block.builders.update.addBlock(deindent` block.builders.update.addBlock(deindent`
@ -189,7 +189,7 @@ export default class EachBlock extends Node {
} else if (!${each_block_value}.${length}) { } else if (!${each_block_value}.${length}) {
${each_block_else} = ${this.else._block.name}(${params}, #component); ${each_block_else} = ${this.else._block.name}(${params}, #component);
${each_block_else}.c(); ${each_block_else}.c();
${each_block_else}.${mountOrIntro}(${parentNode}, ${anchor}); ${each_block_else}.${mountOrIntro}(${targetNode}, ${anchor});
} else if (${each_block_else}) { } else if (${each_block_else}) {
${each_block_else}.u(); ${each_block_else}.u();
${each_block_else}.d(); ${each_block_else}.d();
@ -207,7 +207,7 @@ export default class EachBlock extends Node {
} else if (!${each_block_else}) { } else if (!${each_block_else}) {
${each_block_else} = ${this.else._block.name}(${params}, #component); ${each_block_else} = ${this.else._block.name}(${params}, #component);
${each_block_else}.c(); ${each_block_else}.c();
${each_block_else}.${mountOrIntro}(${parentNode}, ${anchor}); ${each_block_else}.${mountOrIntro}(${targetNode}, ${anchor});
} }
`); `);
} }
@ -222,18 +222,12 @@ export default class EachBlock extends Node {
} }
this.children.forEach((child: Node) => { this.children.forEach((child: Node) => {
child.build(this._block, { child.build(this._block, null, 'nodes');
parentNode: null,
parentNodes: 'nodes'
});
}); });
if (this.else) { if (this.else) {
this.else.children.forEach((child: Node) => { this.else.children.forEach((child: Node) => {
child.build(this.else._block, { child.build(this.else._block, null, 'nodes');
parentNode: null,
parentNodes: 'nodes'
});
}); });
} }
} }
@ -242,7 +236,8 @@ export default class EachBlock extends Node {
function keyed( function keyed(
generator: DomGenerator, generator: DomGenerator,
block: Block, block: Block,
state: { parentNode: string, parentNodes: string }, parentNode: string,
parentNodes: string,
node: EachBlock, node: EachBlock,
snippet: string, snippet: string,
{ {
@ -292,8 +287,8 @@ function keyed(
} }
`); `);
const targetNode = state.parentNode || '#target'; const targetNode = parentNode || '#target';
const anchorNode = state.parentNode ? 'null' : 'anchor'; const anchorNode = parentNode ? 'null' : 'anchor';
block.builders.create.addBlock(deindent` block.builders.create.addBlock(deindent`
var ${iteration} = ${head}; var ${iteration} = ${head};
@ -306,7 +301,7 @@ function keyed(
block.builders.claim.addBlock(deindent` block.builders.claim.addBlock(deindent`
var ${iteration} = ${head}; var ${iteration} = ${head};
while (${iteration}) { while (${iteration}) {
${iteration}.l(${state.parentNodes}); ${iteration}.l(${parentNodes});
${iteration} = ${iteration}.next; ${iteration} = ${iteration}.next;
} }
`); `);
@ -320,7 +315,7 @@ function keyed(
`); `);
const dynamic = node._block.hasUpdateMethod; const dynamic = node._block.hasUpdateMethod;
const parentNode = node.parent.isDomNode() ? node.parent.var : `${anchor}.parentNode`; const mountNode = node.parent.isDomNode() ? node.parent.var : `${anchor}.parentNode`;
let destroy; let destroy;
if (node._block.hasOutroMethod) { if (node._block.hasOutroMethod) {
@ -403,12 +398,12 @@ function keyed(
${iteration}.discard = false; ${iteration}.discard = false;
${iteration}.last = ${last}; ${iteration}.last = ${last};
if (!${expected}) ${iteration}.m(${parentNode}, ${anchor}); if (!${expected}) ${iteration}.m(${mountNode}, ${anchor});
} else { } else {
// key is being inserted // key is being inserted
${iteration} = ${lookup}[${key}] = ${create_each_block}(${params}, ${each_block_value}, ${each_block_value}[#i], #i, #component, ${key}); ${iteration} = ${lookup}[${key}] = ${create_each_block}(${params}, ${each_block_value}, ${each_block_value}[#i], #i, #component, ${key});
${iteration}.c(); ${iteration}.c();
${iteration}.${mountOrIntro}(${parentNode}, ${expected}.first); ${iteration}.${mountOrIntro}(${mountNode}, ${expected}.first);
${expected}.last = ${iteration}; ${expected}.last = ${iteration};
${iteration}.next = ${expected}; ${iteration}.next = ${expected};
@ -419,17 +414,17 @@ function keyed(
if (${iteration}) { if (${iteration}) {
${iteration}.discard = false; ${iteration}.discard = false;
${iteration}.next = null; ${iteration}.next = null;
${iteration}.m(${parentNode}, ${anchor}); ${iteration}.m(${mountNode}, ${anchor});
} else { } else {
${iteration} = ${lookup}[${key}] = ${create_each_block}(${params}, ${each_block_value}, ${each_block_value}[#i], #i, #component, ${key}); ${iteration} = ${lookup}[${key}] = ${create_each_block}(${params}, ${each_block_value}, ${each_block_value}[#i], #i, #component, ${key});
${iteration}.c(); ${iteration}.c();
${iteration}.${mountOrIntro}(${parentNode}, ${anchor}); ${iteration}.${mountOrIntro}(${mountNode}, ${anchor});
} }
} }
if (${last}) ${last}.next = ${iteration}; if (${last}) ${last}.next = ${iteration};
${iteration}.last = ${last}; ${iteration}.last = ${last};
${node._block.hasIntroMethod && `${iteration}.i(${parentNode}, ${anchor});`} ${node._block.hasIntroMethod && `${iteration}.i(${mountNode}, ${anchor});`}
${last} = ${iteration}; ${last} = ${iteration};
} }
@ -440,7 +435,7 @@ function keyed(
${head} = ${lookup}[${each_block_value}[0] && ${each_block_value}[0].${node.key}]; ${head} = ${lookup}[${each_block_value}[0] && ${each_block_value}[0].${node.key}];
`); `);
if (!state.parentNode) { if (!parentNode) {
block.builders.unmount.addBlock(deindent` block.builders.unmount.addBlock(deindent`
var ${iteration} = ${head}; var ${iteration} = ${head};
while (${iteration}) { while (${iteration}) {
@ -462,7 +457,8 @@ function keyed(
function unkeyed( function unkeyed(
generator: DomGenerator, generator: DomGenerator,
block: Block, block: Block,
state: { parentNode: string, parentNodes: string }, parentNode: string,
parentNodes: string,
node: EachBlock, node: EachBlock,
snippet: string, snippet: string,
{ {
@ -483,8 +479,8 @@ function unkeyed(
} }
`); `);
const targetNode = state.parentNode || '#target'; const targetNode = parentNode || '#target';
const anchorNode = state.parentNode ? 'null' : 'anchor'; const anchorNode = parentNode ? 'null' : 'anchor';
block.builders.create.addBlock(deindent` block.builders.create.addBlock(deindent`
for (var #i = 0; #i < ${iterations}.length; #i += 1) { for (var #i = 0; #i < ${iterations}.length; #i += 1) {
@ -494,7 +490,7 @@ function unkeyed(
block.builders.claim.addBlock(deindent` block.builders.claim.addBlock(deindent`
for (var #i = 0; #i < ${iterations}.length; #i += 1) { for (var #i = 0; #i < ${iterations}.length; #i += 1) {
${iterations}[#i].l(${state.parentNodes}); ${iterations}[#i].l(${parentNodes});
} }
`); `);
@ -515,7 +511,7 @@ function unkeyed(
.map(dependency => `changed.${dependency}`) .map(dependency => `changed.${dependency}`)
.join(' || '); .join(' || ');
const parentNode = node.parent.isDomNode() ? node.parent.var : `${anchor}.parentNode`; const mountNode = node.parent.isDomNode() ? node.parent.var : `${anchor}.parentNode`;
if (condition !== '') { if (condition !== '') {
const forLoopBody = node._block.hasUpdateMethod const forLoopBody = node._block.hasUpdateMethod
@ -527,7 +523,7 @@ function unkeyed(
${iterations}[#i] = ${create_each_block}(${params}, ${each_block_value}, ${each_block_value}[#i], #i, #component); ${iterations}[#i] = ${create_each_block}(${params}, ${each_block_value}, ${each_block_value}[#i], #i, #component);
${iterations}[#i].c(); ${iterations}[#i].c();
} }
${iterations}[#i].i(${parentNode}, ${anchor}); ${iterations}[#i].i(${mountNode}, ${anchor});
` `
: deindent` : deindent`
if (${iterations}[#i]) { if (${iterations}[#i]) {
@ -535,13 +531,13 @@ function unkeyed(
} else { } else {
${iterations}[#i] = ${create_each_block}(${params}, ${each_block_value}, ${each_block_value}[#i], #i, #component); ${iterations}[#i] = ${create_each_block}(${params}, ${each_block_value}, ${each_block_value}[#i], #i, #component);
${iterations}[#i].c(); ${iterations}[#i].c();
${iterations}[#i].m(${parentNode}, ${anchor}); ${iterations}[#i].m(${mountNode}, ${anchor});
} }
` `
: deindent` : deindent`
${iterations}[#i] = ${create_each_block}(${params}, ${each_block_value}, ${each_block_value}[#i], #i, #component); ${iterations}[#i] = ${create_each_block}(${params}, ${each_block_value}, ${each_block_value}[#i], #i, #component);
${iterations}[#i].c(); ${iterations}[#i].c();
${iterations}[#i].${mountOrIntro}(${parentNode}, ${anchor}); ${iterations}[#i].${mountOrIntro}(${mountNode}, ${anchor});
`; `;
const start = node._block.hasUpdateMethod ? '0' : `${iterations}.length`; const start = node._block.hasUpdateMethod ? '0' : `${iterations}.length`;

15
src/generators/nodes/Element.ts
Unescape View File

@ -164,7 +164,8 @@ export default class Element extends Node {
build( build(
block: Block, block: Block,
state: { parentNode: string, parentNodes: string } parentNode: string,
parentNodes: string
) { ) {
const { generator } = this; const { generator } = this;
@ -182,9 +183,9 @@ export default class Element extends Node {
const allUsedContexts: Set<string> = new Set(); const allUsedContexts: Set<string> = new Set();
const slot = this.attributes.find((attribute: Node) => attribute.name === 'slot'); const slot = this.attributes.find((attribute: Node) => attribute.name === 'slot');
const parentNode = this.slotted ? const targetNode = this.slotted ?
`${this.nearestComponent().var}._slotted.${slot.value[0].data}` : // TODO this looks bonkers `${this.nearestComponent().var}._slotted.${slot.value[0].data}` : // TODO this looks bonkers
state.parentNode; parentNode;
block.addVariable(name); block.addVariable(name);
block.builders.create.addLine( block.builders.create.addLine(
@ -197,14 +198,14 @@ export default class Element extends Node {
if (this.generator.hydratable) { if (this.generator.hydratable) {
block.builders.claim.addBlock(deindent` block.builders.claim.addBlock(deindent`
${name} = ${getClaimStatement(generator, this.namespace, state.parentNodes, this)}; ${name} = ${getClaimStatement(generator, this.namespace, parentNodes, this)};
var ${childState.parentNodes} = @children(${name}); var ${childState.parentNodes} = @children(${name});
`); `);
} }
if (parentNode) { if (targetNode) {
block.builders.mount.addLine( block.builders.mount.addLine(
`@appendNode(${name}, ${parentNode});` `@appendNode(${name}, ${targetNode});`
); );
} else { } else {
block.builders.mount.addLine(`@insertNode(${name}, #target, anchor);`); block.builders.mount.addLine(`@insertNode(${name}, #target, anchor);`);
@ -241,7 +242,7 @@ export default class Element extends Node {
} }
} else { } else {
this.children.forEach((child: Node) => { this.children.forEach((child: Node) => {
child.build(block, childState); child.build(block, childState.parentNode, childState.parentNodes);
}); });
} }

5
src/generators/nodes/Fragment.ts
Unescape View File

@ -34,10 +34,7 @@ export default class Fragment extends Node {
this.init(); this.init();
this.children.forEach(child => { this.children.forEach(child => {
child.build(this.block, { child.build(this.block, null, 'nodes');
parentNode: null,
parentNodes: 'nodes'
});
}); });
} }
} }

68
src/generators/nodes/IfBlock.ts
Unescape View File

@ -3,7 +3,6 @@ import Node from './shared/Node';
import ElseBlock from './ElseBlock'; import ElseBlock from './ElseBlock';
import { DomGenerator } from '../dom/index'; import { DomGenerator } from '../dom/index';
import Block from '../dom/Block'; import Block from '../dom/Block';
import State from '../dom/State';
import createDebuggingComment from '../../utils/createDebuggingComment'; import createDebuggingComment from '../../utils/createDebuggingComment';
function isElseIf(node: ElseBlock) { function isElseIf(node: ElseBlock) {
@ -92,17 +91,18 @@ export default class IfBlock extends Node {
build( build(
block: Block, block: Block,
state: { parentNode: string, parentNodes: string } parentNode: string,
parentNodes: string
) { ) {
const name = this.var; const name = this.var;
const needsAnchor = this.next ? !this.next.isDomNode() : !state.parentNode || !this.parent.isDomNode(); const needsAnchor = this.next ? !this.next.isDomNode() : !parentNode || !this.parent.isDomNode();
const anchor = needsAnchor const anchor = needsAnchor
? block.getUniqueName(`${name}_anchor`) ? block.getUniqueName(`${name}_anchor`)
: (this.next && this.next.var) || 'null'; : (this.next && this.next.var) || 'null';
const params = block.params.join(', '); const params = block.params.join(', ');
const branches = getBranches(this.generator, block, state, this); const branches = getBranches(this.generator, block, parentNode, parentNodes, this);
const hasElse = isElseBranch(branches[branches.length - 1]); const hasElse = isElseBranch(branches[branches.length - 1]);
const if_name = hasElse ? '' : `if (${name}) `; const if_name = hasElse ? '' : `if (${name}) `;
@ -117,23 +117,24 @@ export default class IfBlock extends Node {
compoundWithOutros( compoundWithOutros(
this.generator, this.generator,
block, block,
state, parentNode,
parentNodes,
this, this,
branches, branches,
dynamic, dynamic,
vars vars
); );
} else { } else {
compound(this.generator, block, state, this, branches, dynamic, vars); compound(this.generator, block, parentNode, parentNodes, this, branches, dynamic, vars);
} }
} else { } else {
simple(this.generator, block, state, this, branches[0], dynamic, vars); simple(this.generator, block, parentNode, parentNodes, this, branches[0], dynamic, vars);
} }
block.builders.create.addLine(`${if_name}${name}.c();`); block.builders.create.addLine(`${if_name}${name}.c();`);
block.builders.claim.addLine( block.builders.claim.addLine(
`${if_name}${name}.l(${state.parentNodes});` `${if_name}${name}.l(${parentNodes});`
); );
if (needsAnchor) { if (needsAnchor) {
@ -141,7 +142,7 @@ export default class IfBlock extends Node {
anchor, anchor,
`@createComment()`, `@createComment()`,
`@createComment()`, `@createComment()`,
state.parentNode parentNode
); );
} }
} }
@ -156,7 +157,8 @@ export default class IfBlock extends Node {
function getBranches( function getBranches(
generator: DomGenerator, generator: DomGenerator,
block: Block, block: Block,
state: { parentNode: string, parentNodes: string }, parentNode: string,
parentNodes: string,
node: Node node: Node
) { ) {
block.contextualise(node.expression); // TODO remove block.contextualise(node.expression); // TODO remove
@ -175,7 +177,7 @@ function getBranches(
if (isElseIf(node.else)) { if (isElseIf(node.else)) {
branches.push( branches.push(
...getBranches(generator, block, state, node.else.children[0]) ...getBranches(generator, block, parentNode, parentNodes, node.else.children[0])
); );
} else { } else {
branches.push({ branches.push({
@ -200,10 +202,7 @@ function visitChildren(
node: Node node: Node
) { ) {
node.children.forEach((child: Node) => { node.children.forEach((child: Node) => {
child.build(node._block, { child.build(node._block, null, 'nodes');
parentNode: null,
parentNodes: 'nodes'
});
}); });
} }
@ -212,7 +211,8 @@ function visitChildren(
function simple( function simple(
generator: DomGenerator, generator: DomGenerator,
block: Block, block: Block,
state: { parentNode: string, parentNodes: string }, parentNode: string,
parentNodes: string,
node: Node, node: Node,
branch, branch,
dynamic, dynamic,
@ -223,14 +223,14 @@ function simple(
`); `);
const mountOrIntro = branch.hasIntroMethod ? 'i' : 'm'; const mountOrIntro = branch.hasIntroMethod ? 'i' : 'm';
const targetNode = state.parentNode || '#target'; const targetNode = parentNode || '#target';
const anchorNode = state.parentNode ? 'null' : 'anchor'; const anchorNode = parentNode ? 'null' : 'anchor';
block.builders.mount.addLine( block.builders.mount.addLine(
`if (${name}) ${name}.${mountOrIntro}(${targetNode}, ${anchorNode});` `if (${name}) ${name}.${mountOrIntro}(${targetNode}, ${anchorNode});`
); );
const parentNode = node.parent.isDomNode() ? node.parent.var : `${anchor}.parentNode`; const mountNode = node.parent.isDomNode() ? node.parent.var : `${anchor}.parentNode`;
const enter = dynamic const enter = dynamic
? branch.hasIntroMethod ? branch.hasIntroMethod
@ -242,7 +242,7 @@ function simple(
if (${name}) ${name}.c(); if (${name}) ${name}.c();
} }
${name}.i(${parentNode}, ${anchor}); ${name}.i(${mountNode}, ${anchor});
` `
: deindent` : deindent`
if (${name}) { if (${name}) {
@ -250,7 +250,7 @@ function simple(
} else { } else {
${name} = ${branch.block}(${params}, #component); ${name} = ${branch.block}(${params}, #component);
${name}.c(); ${name}.c();
${name}.m(${parentNode}, ${anchor}); ${name}.m(${mountNode}, ${anchor});
} }
` `
: branch.hasIntroMethod : branch.hasIntroMethod
@ -259,13 +259,13 @@ function simple(
${name} = ${branch.block}(${params}, #component); ${name} = ${branch.block}(${params}, #component);
${name}.c(); ${name}.c();
} }
${name}.i(${parentNode}, ${anchor}); ${name}.i(${mountNode}, ${anchor});
` `
: deindent` : deindent`
if (!${name}) { if (!${name}) {
${name} = ${branch.block}(${params}, #component); ${name} = ${branch.block}(${params}, #component);
${name}.c(); ${name}.c();
${name}.m(${parentNode}, ${anchor}); ${name}.m(${mountNode}, ${anchor});
} }
`; `;
@ -301,7 +301,8 @@ function simple(
function compound( function compound(
generator: DomGenerator, generator: DomGenerator,
block: Block, block: Block,
state: { parentNode: string, parentNodes: string }, parentNode: string,
parentNodes: string,
node: Node, node: Node,
branches, branches,
dynamic, dynamic,
@ -326,13 +327,13 @@ function compound(
const mountOrIntro = branches[0].hasIntroMethod ? 'i' : 'm'; const mountOrIntro = branches[0].hasIntroMethod ? 'i' : 'm';
const targetNode = state.parentNode || '#target'; const targetNode = parentNode || '#target';
const anchorNode = state.parentNode ? 'null' : 'anchor'; const anchorNode = parentNode ? 'null' : 'anchor';
block.builders.mount.addLine( block.builders.mount.addLine(
`${if_name}${name}.${mountOrIntro}(${targetNode}, ${anchorNode});` `${if_name}${name}.${mountOrIntro}(${targetNode}, ${anchorNode});`
); );
const parentNode = node.parent.isDomNode() ? node.parent.var : `${anchor}.parentNode`; const mountNode = node.parent.isDomNode() ? node.parent.var : `${anchor}.parentNode`;
const changeBlock = deindent` const changeBlock = deindent`
${hasElse ${hasElse
@ -347,7 +348,7 @@ function compound(
}`} }`}
${name} = ${current_block_type_and}${current_block_type}(${params}, #component); ${name} = ${current_block_type_and}${current_block_type}(${params}, #component);
${if_name}${name}.c(); ${if_name}${name}.c();
${if_name}${name}.${mountOrIntro}(${parentNode}, ${anchor}); ${if_name}${name}.${mountOrIntro}(${mountNode}, ${anchor});
`; `;
if (dynamic) { if (dynamic) {
@ -376,7 +377,8 @@ function compound(
function compoundWithOutros( function compoundWithOutros(
generator: DomGenerator, generator: DomGenerator,
block: Block, block: Block,
state: { parentNode: string, parentNodes: string }, parentNode: string,
parentNodes: string,
node: Node, node: Node,
branches, branches,
dynamic, dynamic,
@ -423,14 +425,14 @@ function compoundWithOutros(
} }
const mountOrIntro = branches[0].hasIntroMethod ? 'i' : 'm'; const mountOrIntro = branches[0].hasIntroMethod ? 'i' : 'm';
const targetNode = state.parentNode || '#target'; const targetNode = parentNode || '#target';
const anchorNode = state.parentNode ? 'null' : 'anchor'; const anchorNode = parentNode ? 'null' : 'anchor';
block.builders.mount.addLine( block.builders.mount.addLine(
`${if_current_block_type_index}${if_blocks}[${current_block_type_index}].${mountOrIntro}(${targetNode}, ${anchorNode});` `${if_current_block_type_index}${if_blocks}[${current_block_type_index}].${mountOrIntro}(${targetNode}, ${anchorNode});`
); );
const parentNode = (state.parentNode && !needsAnchor) ? state.parentNode : `${anchor}.parentNode`; const mountNode = (parentNode && !needsAnchor) ? parentNode : `${anchor}.parentNode`;
const destroyOldBlock = deindent` const destroyOldBlock = deindent`
${name}.o(function() { ${name}.o(function() {
@ -446,7 +448,7 @@ function compoundWithOutros(
${name} = ${if_blocks}[${current_block_type_index}] = ${if_block_creators}[${current_block_type_index}](${params}, #component); ${name} = ${if_blocks}[${current_block_type_index}] = ${if_block_creators}[${current_block_type_index}](${params}, #component);
${name}.c(); ${name}.c();
} }
${name}.${mountOrIntro}(${parentNode}, ${anchor}); ${name}.${mountOrIntro}(${mountNode}, ${anchor});
`; `;
const changeBlock = hasElse const changeBlock = hasElse

7
src/generators/nodes/MustacheTag.ts
Unescape View File

@ -12,7 +12,8 @@ export default class MustacheTag extends Tag {
build( build(
block: Block, block: Block,
state: { parentNode: string, parentNodes: string } parentNode: string,
parentNodes: string
) { ) {
const { init } = this.renameThisMethod( const { init } = this.renameThisMethod(
block, block,
@ -22,8 +23,8 @@ export default class MustacheTag extends Tag {
block.addElement( block.addElement(
this.var, this.var,
`@createText(${init})`, `@createText(${init})`,
`@claimText(${state.parentNodes}, ${init})`, `@claimText(${parentNodes}, ${init})`,
state.parentNode parentNode
); );
} }
} }

16
src/generators/nodes/RawMustacheTag.ts
Unescape View File

@ -2,7 +2,6 @@ import deindent from '../../utils/deindent';
import Node from './shared/Node'; import Node from './shared/Node';
import Tag from './shared/Tag'; import Tag from './shared/Tag';
import Block from '../dom/Block'; import Block from '../dom/Block';
import State from '../dom/State';
export default class RawMustacheTag extends Tag { export default class RawMustacheTag extends Tag {
init(block: Block) { init(block: Block) {
@ -13,12 +12,13 @@ export default class RawMustacheTag extends Tag {
build( build(
block: Block, block: Block,
state: { parentNode: string, parentNodes: string } parentNode: string,
parentNodes: string
) { ) {
const name = this.var; const name = this.var;
const needsAnchorBefore = this.prev ? this.prev.type !== 'Element' : !state.parentNode; const needsAnchorBefore = this.prev ? this.prev.type !== 'Element' : !parentNode;
const needsAnchorAfter = this.next ? this.next.type !== 'Element' : !state.parentNode; const needsAnchorAfter = this.next ? this.next.type !== 'Element' : !parentNode;
const anchorBefore = needsAnchorBefore const anchorBefore = needsAnchorBefore
? block.getUniqueName(`${name}_before`) ? block.getUniqueName(`${name}_before`)
@ -34,8 +34,8 @@ export default class RawMustacheTag extends Tag {
if (anchorBefore === 'null' && anchorAfter === 'null') { if (anchorBefore === 'null' && anchorAfter === 'null') {
useInnerHTML = true; useInnerHTML = true;
detach = `${state.parentNode}.innerHTML = '';`; detach = `${parentNode}.innerHTML = '';`;
insert = content => `${state.parentNode}.innerHTML = ${content};`; insert = content => `${parentNode}.innerHTML = ${content};`;
} else if (anchorBefore === 'null') { } else if (anchorBefore === 'null') {
detach = `@detachBefore(${anchorAfter});`; detach = `@detachBefore(${anchorAfter});`;
insert = content => `${anchorAfter}.insertAdjacentHTML("beforebegin", ${content});`; insert = content => `${anchorAfter}.insertAdjacentHTML("beforebegin", ${content});`;
@ -62,7 +62,7 @@ export default class RawMustacheTag extends Tag {
anchorBefore, anchorBefore,
`@createElement('noscript')`, `@createElement('noscript')`,
`@createElement('noscript')`, `@createElement('noscript')`,
state.parentNode parentNode
); );
} }
@ -71,7 +71,7 @@ export default class RawMustacheTag extends Tag {
anchorAfter, anchorAfter,
`@createElement('noscript')`, `@createElement('noscript')`,
`@createElement('noscript')`, `@createElement('noscript')`,
state.parentNode parentNode
); );
} }

19
src/generators/nodes/Slot.ts
Unescape View File

@ -27,7 +27,8 @@ export default class Slot extends Element {
build( build(
block: Block, block: Block,
state: { parentNode: string, parentNodes: string } parentNode: string,
parentNodes: string
) { ) {
const { generator } = this; const { generator } = this;
@ -37,8 +38,8 @@ export default class Slot extends Element {
const content_name = block.getUniqueName(`slot_content_${slotName}`); const content_name = block.getUniqueName(`slot_content_${slotName}`);
block.addVariable(content_name, `#component._slotted.${slotName}`); block.addVariable(content_name, `#component._slotted.${slotName}`);
const needsAnchorBefore = this.prev ? this.prev.type !== 'Element' : !state.parentNode; const needsAnchorBefore = this.prev ? this.prev.type !== 'Element' : !parentNode;
const needsAnchorAfter = this.next ? this.next.type !== 'Element' : !state.parentNode; const needsAnchorAfter = this.next ? this.next.type !== 'Element' : !parentNode;
const anchorBefore = needsAnchorBefore const anchorBefore = needsAnchorBefore
? block.getUniqueName(`${content_name}_before`) ? block.getUniqueName(`${content_name}_before`)
@ -58,7 +59,7 @@ export default class Slot extends Element {
block.builders.destroy.pushCondition(`!${content_name}`); block.builders.destroy.pushCondition(`!${content_name}`);
this.children.forEach((child: Node) => { this.children.forEach((child: Node) => {
child.build(block, state); child.build(block, parentNode, parentNodes);
}); });
block.builders.create.popCondition(); block.builders.create.popCondition();
@ -68,12 +69,12 @@ export default class Slot extends Element {
block.builders.destroy.popCondition(); block.builders.destroy.popCondition();
// TODO can we use an else here? // TODO can we use an else here?
if (state.parentNode) { if (parentNode) {
block.builders.mount.addBlock(deindent` block.builders.mount.addBlock(deindent`
if (${content_name}) { if (${content_name}) {
${needsAnchorBefore && `@appendNode(${anchorBefore} || (${anchorBefore} = @createComment()), ${state.parentNode});`} ${needsAnchorBefore && `@appendNode(${anchorBefore} || (${anchorBefore} = @createComment()), ${parentNode});`}
@appendNode(${content_name}, ${state.parentNode}); @appendNode(${content_name}, ${parentNode});
${needsAnchorAfter && `@appendNode(${anchorAfter} || (${anchorAfter} = @createComment()), ${state.parentNode});`} ${needsAnchorAfter && `@appendNode(${anchorAfter} || (${anchorAfter} = @createComment()), ${parentNode});`}
} }
`); `);
} else { } else {
@ -94,7 +95,7 @@ export default class Slot extends Element {
if (anchorBefore === 'null' && anchorAfter === 'null') { if (anchorBefore === 'null' && anchorAfter === 'null') {
block.builders.unmount.addBlock(deindent` block.builders.unmount.addBlock(deindent`
if (${content_name}) { if (${content_name}) {
@reinsertChildren(${state.parentNode}, ${content_name}); @reinsertChildren(${parentNode}, ${content_name});
} }
`); `);
} else if (anchorBefore === 'null') { } else if (anchorBefore === 'null') {

7
src/generators/nodes/Text.ts
Unescape View File

@ -35,15 +35,16 @@ export default class Text extends Node {
build( build(
block: Block, block: Block,
state: { parentNode: string, parentNodes: string } parentNode: string,
parentNodes: string
) { ) {
if (this.shouldSkip) return; if (this.shouldSkip) return;
block.addElement( block.addElement(
this.var, this.var,
`@createText(${stringify(this.data)})`, `@createText(${stringify(this.data)})`,
`@claimText(${state.parentNodes}, ${stringify(this.data)})`, `@claimText(${parentNodes}, ${stringify(this.data)})`,
state.parentNode parentNode
); );
} }
} }

3
src/generators/nodes/Window.ts
Unescape View File

@ -41,7 +41,8 @@ export default class Window extends Node {
build( build(
block: Block, block: Block,
state: { parentNode: string, parentNodes: string } parentNode: string,
parentNodes: string
) { ) {
const { generator } = this; const { generator } = this;

3
src/generators/nodes/shared/Node.ts
Unescape View File

@ -118,7 +118,8 @@ export default class Node {
build( build(
block: Block, block: Block,
state: { parentNode: string, parentNodes: string } parentNode: string,
parentNodes: string
) { ) {
// implemented by subclasses // implemented by subclasses
} }

Write Preview
Loading…
Cancel
Save