(fuse/drawer) Fixed: Final opacity of the overlay is not permanent due to player being destroyed right after the animation

This commit is contained in:
sercan 2021-08-17 22:05:13 +03:00
parent 67d25012ec
commit c2fa88f4d4
2 changed files with 10 additions and 1 deletions

View File

@ -116,7 +116,7 @@ fuse-drawer {
left: 0; left: 0;
right: 0; right: 0;
z-index: 299; z-index: 299;
opacity: 0; opacity: 1;
background-color: rgba(0, 0, 0, 0.6); background-color: rgba(0, 0, 0, 0.6);
/* Fixed mode */ /* Fixed mode */

View File

@ -211,6 +211,12 @@ export class FuseDrawerComponent implements OnChanges, OnInit, OnDestroy
*/ */
ngOnDestroy(): void ngOnDestroy(): void
{ {
// Finish the animation
if ( this._player )
{
this._player.finish();
}
// Deregister the drawer from the registry // Deregister the drawer from the registry
this._fuseDrawerService.deregisterComponent(this.name); this._fuseDrawerService.deregisterComponent(this.name);
} }
@ -338,6 +344,7 @@ export class FuseDrawerComponent implements OnChanges, OnInit, OnDestroy
// Create the enter animation and attach it to the player // Create the enter animation and attach it to the player
this._player = this._animationBuilder.build([ this._player = this._animationBuilder.build([
style({opacity: 0}),
animate('300ms cubic-bezier(0.25, 0.8, 0.25, 1)', style({opacity: 1})) animate('300ms cubic-bezier(0.25, 0.8, 0.25, 1)', style({opacity: 1}))
]).create(this._overlay); ]).create(this._overlay);
@ -346,6 +353,7 @@ export class FuseDrawerComponent implements OnChanges, OnInit, OnDestroy
// Destroy the player // Destroy the player
this._player.destroy(); this._player.destroy();
this._player = null;
}); });
// Play the animation // Play the animation
@ -382,6 +390,7 @@ export class FuseDrawerComponent implements OnChanges, OnInit, OnDestroy
// Destroy the player // Destroy the player
this._player.destroy(); this._player.destroy();
this._player = null;
// If the backdrop still exists... // If the backdrop still exists...
if ( this._overlay ) if ( this._overlay )