Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(animations): implement getPosition in browser animation builder #39983

Closed
wants to merge 1 commit into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
13 changes: 7 additions & 6 deletions packages/animations/src/players/animation_group_player.ts
Expand Up @@ -148,12 +148,13 @@ export class AnimationGroupPlayer implements AnimationPlayer {
}

getPosition(): number {
let min = 0;
this.players.forEach(player => {
const p = player.getPosition();
min = Math.min(p, min);
});
return min;
const longestPlayer =
this.players.reduce((longestSoFar: AnimationPlayer|null, player: AnimationPlayer) => {
const newPlayerIsLongest =
longestSoFar === null || player.totalTime > longestSoFar.totalTime;
return newPlayerIsLongest ? player : longestSoFar;
}, null);
return longestPlayer != null ? longestPlayer.getPosition() : 0;
}

beforeDestroy(): void {
Expand Down
7 changes: 5 additions & 2 deletions packages/animations/src/players/animation_player.ts
Expand Up @@ -124,6 +124,7 @@ export class NoopAnimationPlayer implements AnimationPlayer {
private _started = false;
private _destroyed = false;
private _finished = false;
private _position = 0;
public parentPlayer: AnimationPlayer|null = null;
public readonly totalTime: number;
constructor(duration: number = 0, delay: number = 0) {
Expand Down Expand Up @@ -184,9 +185,11 @@ export class NoopAnimationPlayer implements AnimationPlayer {
}
}
reset(): void {}
setPosition(position: number): void {}
setPosition(position: number): void {
this._position = this.totalTime ? position * this.totalTime : 1;
}
getPosition(): number {
return 0;
return this.totalTime ? this._position / this.totalTime : 1;
}

/** @internal */
Expand Down
41 changes: 41 additions & 0 deletions packages/animations/test/animation_group_player_spec.ts
@@ -0,0 +1,41 @@
/**
* @license
* Copyright Google LLC All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://angular.io/license
*/
import {fakeAsync} from '@angular/core/testing';
import {NoopAnimationPlayer} from '../src/animations';
import {AnimationGroupPlayer} from '../src/players/animation_group_player';


describe('AnimationGroupPlayer', () => {
it('should getPosition of an empty group', fakeAsync(() => {
const players: NoopAnimationPlayer[] = [];
const groupPlayer = new AnimationGroupPlayer(players);
expect(groupPlayer.getPosition()).toBe(0);
}));

it('should getPosition of a single player in a group', fakeAsync(() => {
const player = new NoopAnimationPlayer(5, 5);
player.setPosition(0.2);
const players = [player];
const groupPlayer = new AnimationGroupPlayer(players);
expect(groupPlayer.getPosition()).toBe(0.2);
}));

it('should getPosition based on the longest player in the group', fakeAsync(() => {
const longestPlayer = new NoopAnimationPlayer(5, 5);
longestPlayer.setPosition(0.2);
const players = [
new NoopAnimationPlayer(1, 4),
new NoopAnimationPlayer(4, 1),
new NoopAnimationPlayer(7, 0),
longestPlayer,
new NoopAnimationPlayer(1, 1),
];
const groupPlayer = new AnimationGroupPlayer(players);
expect(groupPlayer.getPosition()).toBe(0.2);
}));
});
Expand Up @@ -111,7 +111,7 @@ export class RendererAnimationPlayer implements AnimationPlayer {
}

getPosition(): number {
return 0;
return this._renderer.engine.players[+this.id]?.getPosition() ?? 0;
}

public totalTime = 0;
Expand Down