cargdev/angular
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(animations): support browser animation rendering (#14578)

Browse Source
This commit is contained in:
Matias Niemelä
2017-02-22 15:14:49 -08:00
committed by Igor Minar
parent 88755b0dae
commit 830393d234
88 changed files with 3429 additions and 1225 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
modules/@angular/compiler/src/compile_metadata.ts
View File

@ -250,7 +250,7 @@ export class CompileTemplateMetadata {
styles: string[];
styleUrls: string[];
externalStylesheets: CompileStylesheetMetadata[];
animations: CompileAnimationEntryMetadata[];
animations: any[];
ngContentSelectors: string[];
interpolation: [string, string];
constructor(
@ -263,7 +263,7 @@ export class CompileTemplateMetadata {
styleUrls?: string[],
externalStylesheets?: CompileStylesheetMetadata[],
ngContentSelectors?: string[],
animations?: CompileAnimationEntryMetadata[],
animations?: any[],
interpolation?: [string, string],
} = {}) {
this.encapsulation = encapsulation;

8
modules/@angular/compiler/src/jit/compiler.ts
View File

@ -8,7 +8,7 @@
import {Compiler, ComponentFactory, Inject, Injector, ModuleWithComponentFactories, NgModuleFactory, Type, ɵgetComponentFactoryViewClass as getComponentFactoryViewClass} from '@angular/core';
import {AnimationCompiler} from '../animation/animation_compiler';
import {AnimationCompiler, AnimationEntryCompileResult} from '../animation/animation_compiler';
import {AnimationParser} from '../animation/animation_parser';
import {CompileDirectiveMetadata, CompileIdentifierMetadata, CompileNgModuleMetadata, ProviderMeta, ProxyClass, createHostComponentMeta, identifierName} from '../compile_metadata';
import {CompilerConfig} from '../config';
@ -272,7 +272,8 @@ export class JitCompiler implements Compiler {
(r) => { externalStylesheetsByModuleUrl.set(r.meta.moduleUrl, r); });
this._resolveStylesCompileResult(
stylesCompileResult.componentStylesheet, externalStylesheetsByModuleUrl);
const parsedAnimations = this._animationParser.parseComponent(compMeta);
const parsedAnimations =
this._compilerConfig.useViewEngine ? [] : this._animationParser.parseComponent(compMeta);
const directives =
template.directives.map(dir => this._metadataResolver.getDirectiveSummary(dir.reference));
const pipes = template.ngModule.transitiveModule.pipes.map(
@ -280,7 +281,8 @@ export class JitCompiler implements Compiler {
const {template: parsedTemplate, pipes: usedPipes} = this._templateParser.parse(
compMeta, compMeta.template.template, directives, pipes, template.ngModule.schemas,
identifierName(compMeta.type));
const compiledAnimations =
const compiledAnimations = this._compilerConfig.useViewEngine ?
[] :
this._animationCompiler.compile(identifierName(compMeta.type), parsedAnimations);
const compileResult = this._viewCompiler.compileComponent(
compMeta, parsedTemplate, ir.variable(stylesCompileResult.componentStylesheet.stylesVar),

11
modules/@angular/compiler/src/metadata_resolver.ts
View File

@ -308,9 +308,14 @@ export class CompileMetadataResolver {
assertArrayOfStrings('styleUrls', dirMeta.styleUrls);
assertInterpolationSymbols('interpolation', dirMeta.interpolation);
const animations = dirMeta.animations ?
dirMeta.animations.map(e => this.getAnimationEntryMetadata(e)) :
null;
let animations: any[];
if (this._config.useViewEngine) {
animations = dirMeta.animations;
} else {
animations = dirMeta.animations ?
dirMeta.animations.map(e => this.getAnimationEntryMetadata(e)) :
null;
}
nonNormalizedTemplateMetadata = new cpl.CompileTemplateMetadata({
encapsulation: dirMeta.encapsulation,

2
modules/@angular/compiler/src/template_parser/template_parser.ts
View File

@ -414,6 +414,8 @@ class TemplateParseVisitor implements html.Visitor {
private _validateElementAnimationInputOutputs(
inputs: BoundElementPropertyAst[], outputs: BoundEventAst[],
template: CompileTemplateSummary) {
if (this.config.useViewEngine) return;
const triggerLookup = new Set<string>();
template.animations.forEach(entry => { triggerLookup.add(entry); });

19
modules/@angular/compiler/src/view_compiler_next/view_compiler.ts
View File

@ -49,8 +49,9 @@ export class ViewCompilerNext extends ViewCompiler {
new o.LiteralMapExpr([
new o.LiteralMapEntry('encapsulation', o.literal(component.template.encapsulation)),
new o.LiteralMapEntry('styles', styles),
// TODO: copy this from the @Component directive...
new o.LiteralMapEntry('data', o.literalMap([])),
new o.LiteralMapEntry('data', o.literalMap([
['animation', convertValueToOutputAst(component.template.animations)]
])),
])
]))
.toDeclStmt(
@ -347,11 +348,13 @@ class ViewBuilder implements TemplateAstVisitor, LocalResolver, BuiltinConverter
}
const usedEvents = new Map<string, [string, string]>();
ast.outputs.forEach((event) => {
usedEvents.set(elementEventFullName(event.target, event.name), [event.target, event.name]);
const en = eventName(event);
usedEvents.set(elementEventFullName(event.target, en), [event.target, en]);
});
ast.directives.forEach((dirAst) => {
dirAst.hostEvents.forEach((event) => {
usedEvents.set(elementEventFullName(event.target, event.name), [event.target, event.name]);
const en = eventName(event);
usedEvents.set(elementEventFullName(event.target, en), [event.target, en]);
});
});
const hostBindings: {value: AST, context: o.Expression}[] = [];
@ -713,7 +716,7 @@ class ViewBuilder implements TemplateAstVisitor, LocalResolver, BuiltinConverter
if (allowDefault) {
trueStmts.push(ALLOW_DEFAULT_VAR.set(allowDefault.and(ALLOW_DEFAULT_VAR)).toStmt());
}
const fullEventName = elementEventFullName(eventAst.target, eventAst.name);
const fullEventName = elementEventFullName(eventAst.target, eventName(eventAst));
handleEventStmts.push(
new o.IfStmt(o.literal(fullEventName).identical(EVENT_NAME_VAR), trueStmts));
});
@ -895,7 +898,7 @@ function elementBindingDefs(inputAsts: BoundElementPropertyAst[]): o.Expression[
]);
case PropertyBindingType.Animation:
return o.literalArr([
o.literal(BindingType.ElementProperty), o.literal(inputAst.name),
o.literal(BindingType.ElementProperty), o.literal('@' + inputAst.name),
o.literal(inputAst.securityContext)
]);
case PropertyBindingType.Class:
@ -1021,3 +1024,7 @@ function createComponentFactoryResolver(directives: DirectiveAst[]): ProviderAst
}
return null;
}
function eventName(eventAst: BoundEventAst): string {
return eventAst.isAnimation ? `@${eventAst.name}.${eventAst.phase}` : eventAst.name;
}