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

feat(animations): expose element and params within transition matchers (#22693)

Browse Source 
PR Close #22693
This commit is contained in:
Matias Niemelä
2018-03-12 17:21:02 -07:00
committed by Kara Erickson
parent db56836425
commit 58b94e6f5e
11 changed files with 119 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
packages/animations/browser/src/dsl/animation_ast.ts
View File

@ -46,7 +46,8 @@ export interface StateAst extends Ast<AnimationMetadataType.State> {
}
export interface TransitionAst extends Ast<AnimationMetadataType.Transition> {
matchers: ((fromState: string, toState: string) => boolean)[];
matchers: ((fromState: string, toState: string, element: any, params: {[key: string]:
any}) => boolean)[];
animation: Ast<AnimationMetadataType>;
queryCount: number;
depCount: number;

3
packages/animations/browser/src/dsl/animation_transition_expr.ts
View File

@ -6,7 +6,8 @@
* found in the LICENSE file at https://angular.io/license
*/
export const ANY_STATE = '*';
export declare type TransitionMatcherFn = (fromState: any, toState: any) => boolean;
export declare type TransitionMatcherFn =
(fromState: any, toState: any, element: any, params: {[key: string]: any}) => boolean;
export function parseTransitionExpr(
transitionValue: string | TransitionMatcherFn, errors: string[]): TransitionMatcherFn[] {

9
packages/animations/browser/src/dsl/animation_transition_factory.ts
View File

@ -24,8 +24,8 @@ export class AnimationTransitionFactory {
private _triggerName: string, public ast: TransitionAst,
private _stateStyles: {[stateName: string]: AnimationStateStyles}) {}
match(currentState: any, nextState: any): boolean {
return oneOrMoreTransitionsMatch(this.ast.matchers, currentState, nextState);
match(currentState: any, nextState: any, element: any, params: {[key: string]: any}): boolean {
return oneOrMoreTransitionsMatch(this.ast.matchers, currentState, nextState, element, params);
}
buildStyles(stateName: string, params: {[key: string]: any}, errors: any[]) {
@ -89,8 +89,9 @@ export class AnimationTransitionFactory {
}
function oneOrMoreTransitionsMatch(
matchFns: TransitionMatcherFn[], currentState: any, nextState: any): boolean {
return matchFns.some(fn => fn(currentState, nextState));
matchFns: TransitionMatcherFn[], currentState: any, nextState: any, element: any,
params: {[key: string]: any}): boolean {
return matchFns.some(fn => fn(currentState, nextState, element, params));
}
export class AnimationStateStyles {

6
packages/animations/browser/src/dsl/animation_trigger.ts
View File

@ -47,8 +47,10 @@ export class AnimationTrigger {
get containsQueries() { return this.ast.queryCount > 0; }
matchTransition(currentState: any, nextState: any): AnimationTransitionFactory|null {
const entry = this.transitionFactories.find(f => f.match(currentState, nextState));
matchTransition(currentState: any, nextState: any, element: any, params: {[key: string]: any}):
AnimationTransitionFactory|null {
const entry =
this.transitionFactories.find(f => f.match(currentState, nextState, element, params));
return entry || null;
}

3
packages/animations/browser/src/render/transition_animation_engine.ts
View File

@ -248,7 +248,8 @@ export class AnimationTransitionNamespace {
}
});
let transition = trigger.matchTransition(fromState.value, toState.value);
let transition =
trigger.matchTransition(fromState.value, toState.value, element, toState.params);
let isFallbackTransition = false;
if (!transition) {
if (!defaultToFallback) return;