tidy up, dedupe a bit

pull/769/head
Rich Harris 8 years ago
parent 4dd5fc5594
commit f31c206b73

@ -124,8 +124,7 @@ export default class Block {
name: string,
renderStatement: string,
claimStatement: string,
parentNode: string,
needsIdentifier = false
parentNode: string
) {
const isToplevel = !parentNode;

@ -57,8 +57,7 @@ export default function visitEachBlock(
anchor,
`@createComment()`,
`@createComment()`,
state.parentNode,
true
state.parentNode
);
} else if (node.next) {
node.next.usedAsAnchor = true;
@ -172,8 +171,7 @@ function keyed(
node._block.first,
`@createComment()`,
`@createComment()`,
null,
true
null
);
}

@ -119,8 +119,7 @@ export default function visitIfBlock(
anchor,
`@createComment()`,
`@createComment()`,
state.parentNode,
true
state.parentNode
);
} else if (node.next) {
node.next.usedAsAnchor = true;

@ -1,4 +1,5 @@
import deindent from '../../../utils/deindent';
import visitTag from './shared/Tag';
import { DomGenerator } from '../index';
import Block from '../Block';
import { Node } from '../../../interfaces';
@ -10,47 +11,21 @@ export default function visitMustacheTag(
state: State,
node: Node
) {
const { dependencies, indexes, snippet } = block.contextualise(node.expression);
const { name } = node._state;
const hasChangeableIndex = Array.from(indexes).some(index => block.changeableIndexes.get(index));
const shouldCache = (
node.expression.type !== 'Identifier' ||
block.contexts.has(node.expression.name) ||
hasChangeableIndex
const { init } = visitTag(
generator,
block,
state,
node,
name,
value => `${name}.data = ${value};`
);
const name = node._state.name;
const value = shouldCache && block.getUniqueName(`${name}_value`);
const init = shouldCache ? `${value} = ${snippet}` : snippet;
if (shouldCache) block.addVariable(value);
block.addElement(
name,
`@createText( ${init} )`,
generator.hydratable
? `@claimText( ${state.parentNodes}, ${init} )`
: '',
state.parentNode,
true
);
if (dependencies.length || hasChangeableIndex) {
const changedCheck = (
( block.hasOutroMethod ? `#outroing || ` : '' ) +
dependencies.map(dependency => `'${dependency}' in changed`).join(' || ')
);
const updateCachedValue = `${value} !== ( ${value} = ${snippet} )`;
const condition = shouldCache ?
( dependencies.length ? `( ${changedCheck} ) && ${updateCachedValue}` : updateCachedValue ) :
changedCheck;
block.builders.update.addConditionalLine(
condition,
`${name}.data = ${shouldCache ? value : snippet};`
`@claimText( ${state.parentNodes}, ${init} )`,
state.parentNode
);
}
}

@ -1,4 +1,6 @@
import deindent from '../../../utils/deindent';
import addUpdateBlock from './shared/addUpdateBlock';
import visitTag from './shared/Tag';
import { DomGenerator } from '../index';
import Block from '../Block';
import { Node } from '../../../interfaces';
@ -14,60 +16,34 @@ export default function visitRawMustacheTag(
const before = node._state.name;
const after = block.getUniqueName(`${name}_after`);
const { dependencies, indexes, snippet } = block.contextualise(node.expression);
const hasChangeableIndex = Array.from(indexes).some(index => block.changeableIndexes.get(index));
const shouldCache = (
node.expression.type !== 'Identifier' ||
block.contexts.has(node.expression.name) ||
hasChangeableIndex
const { init } = visitTag(
generator,
block,
state,
node,
name,
value => deindent`
@detachBetween( ${before}, ${after} );
${before}.insertAdjacentHTML( 'afterend', ${value} );
`
);
const value = shouldCache && block.getUniqueName(`${name}_value`);
const init = shouldCache ? `${value} = ${snippet}` : snippet;
if (shouldCache) block.addVariable(value);
// we would have used comments here, but the `insertAdjacentHTML` api only
// exists for `Element`s.
block.addElement(
before,
`@createElement( 'noscript' )`,
`@createElement( 'noscript' )`,
state.parentNode,
true
state.parentNode
);
block.addElement(
after,
`@createElement( 'noscript' )`,
`@createElement( 'noscript' )`,
state.parentNode,
true
state.parentNode
);
const isToplevel = !state.parentNode;
block.builders.mount.addLine(`${before}.insertAdjacentHTML( 'afterend', ${init} );`);
block.builders.detachRaw.addBlock(`@detachBetween( ${before}, ${after} );`);
if (dependencies.length || hasChangeableIndex) {
const changedCheck = (
( block.hasOutroMethod ? `#outroing || ` : '' ) +
dependencies.map(dependency => `'${dependency}' in changed`).join(' || ')
);
const updateCachedValue = `${value} !== ( ${value} = ${snippet} )`;
const condition = shouldCache ?
( dependencies.length ? `( ${changedCheck} ) && ${updateCachedValue}` : updateCachedValue ) :
changedCheck;
block.builders.update.addConditionalLine(
condition,
deindent`
@detachBetween( ${before}, ${after} );
${before}.insertAdjacentHTML( 'afterend', ${shouldCache ? value : snippet} );
`
);
}
}

@ -14,10 +14,7 @@ export default function visitText(
block.addElement(
node._state.name,
`@createText( ${stringify(node.data)} )`,
generator.hydratable
? `@claimText( ${state.parentNodes}, ${stringify(node.data)} )`
: '',
state.parentNode,
node.usedAsAnchor
`@claimText( ${state.parentNodes}, ${stringify(node.data)} )`,
state.parentNode
);
}

@ -0,0 +1,49 @@
import deindent from '../../../../utils/deindent';
import { DomGenerator } from '../../index';
import Block from '../../Block';
import { Node } from '../../../../interfaces';
import { State } from '../../interfaces';
export default function visitTag(
generator: DomGenerator,
block: Block,
state: State,
node: Node,
name: string,
update: (value: string) => string
) {
const { dependencies, indexes, snippet } = block.contextualise(node.expression);
const hasChangeableIndex = Array.from(indexes).some(index => block.changeableIndexes.get(index));
const shouldCache = (
node.expression.type !== 'Identifier' ||
block.contexts.has(node.expression.name) ||
hasChangeableIndex
);
const value = shouldCache && block.getUniqueName(`${name}_value`);
const init = shouldCache ? value : snippet;
if (shouldCache) block.addVariable(value, snippet);
if (dependencies.length || hasChangeableIndex) {
const changedCheck = (
( block.hasOutroMethod ? `#outroing || ` : '' ) +
dependencies.map(dependency => `'${dependency}' in changed`).join(' || ')
);
const updateCachedValue = `${value} !== ( ${value} = ${snippet} )`;
const condition = shouldCache ?
( dependencies.length ? `( ${changedCheck} ) && ${updateCachedValue}` : updateCachedValue ) :
changedCheck;
block.builders.update.addConditionalLine(
condition,
update(shouldCache ? value : snippet)
);
}
return { init };
}

@ -248,7 +248,7 @@ function create_main_fragment ( state, component ) {
}
function create_each_block ( state, each_block_value, comment, i, component ) {
var div, strong, text, text_1, span, text_2_value, text_2, text_3, text_4_value, text_4, text_5, text_6, raw_value, raw_before, raw_after;
var div, strong, text, text_1, span, text_2_value = comment.author, text_2, text_3, text_4_value = state.elapsed(comment.time, state.time), text_4, text_5, text_6, raw_value = comment.html, raw_before, raw_after;
return {
create: function () {
@ -257,9 +257,9 @@ function create_each_block ( state, each_block_value, comment, i, component ) {
text = createText( i );
text_1 = createText( "\n\n\t\t" );
span = createElement( 'span' );
text_2 = createText( text_2_value = comment.author );
text_2 = createText( text_2_value );
text_3 = createText( " wrote " );
text_4 = createText( text_4_value = state.elapsed(comment.time, state.time) );
text_4 = createText( text_4_value );
text_5 = createText( " ago:" );
text_6 = createText( "\n\n\t\t" );
raw_before = createElement( 'noscript' );
@ -285,7 +285,7 @@ function create_each_block ( state, each_block_value, comment, i, component ) {
appendNode( text_6, div );
appendNode( raw_before, div );
appendNode( raw_after, div );
raw_before.insertAdjacentHTML( 'afterend', raw_value = comment.html );
raw_before.insertAdjacentHTML( 'afterend', raw_value );
},
update: function ( changed, state, each_block_value, comment, i ) {

@ -74,7 +74,7 @@ function create_main_fragment ( state, component ) {
}
function create_each_block ( state, each_block_value, comment, i, component ) {
var div, strong, text, text_1, span, text_2_value, text_2, text_3, text_4_value, text_4, text_5, text_6, raw_value, raw_before, raw_after;
var div, strong, text, text_1, span, text_2_value = comment.author, text_2, text_3, text_4_value = state.elapsed(comment.time, state.time), text_4, text_5, text_6, raw_value = comment.html, raw_before, raw_after;
return {
create: function () {
@ -83,9 +83,9 @@ function create_each_block ( state, each_block_value, comment, i, component ) {
text = createText( i );
text_1 = createText( "\n\n\t\t" );
span = createElement( 'span' );
text_2 = createText( text_2_value = comment.author );
text_2 = createText( text_2_value );
text_3 = createText( " wrote " );
text_4 = createText( text_4_value = state.elapsed(comment.time, state.time) );
text_4 = createText( text_4_value );
text_5 = createText( " ago:" );
text_6 = createText( "\n\n\t\t" );
raw_before = createElement( 'noscript' );
@ -111,7 +111,7 @@ function create_each_block ( state, each_block_value, comment, i, component ) {
appendNode( text_6, div );
appendNode( raw_before, div );
appendNode( raw_after, div );
raw_before.insertAdjacentHTML( 'afterend', raw_value = comment.html );
raw_before.insertAdjacentHTML( 'afterend', raw_value );
},
update: function ( changed, state, each_block_value, comment, i ) {

Loading…
Cancel
Save