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

Feature/3144 drawer transition #438

Merged
merged 3 commits into from
Jun 2, 2022
Merged

Conversation

emclaug2
Copy link
Contributor

@emclaug2 emclaug2 commented May 23, 2022

Fixes #82

Changes proposed in this Pull Request:

  • Fixes drawer jankiness when closing drawer.

This bug was happening because the drawer width was being recalculated on variant change.

In the drawer-layout.component.ts file...

When the variant is updated to temporary, the width of the drawer is quickly recalculated to it's full, non-collapsed size. This is because isCollapsed() was returning false after the variant was updated to temporary.
I've added in an edge-case that listens for this change & if the drawer is in a collapsed state, avoids the recalculated width until the drawer is fully dismissed from the screen.

Screenshots:

Drawer Dismissable

To Test:

  • Checkout the showcase project and adjust the size of the screen width until it transitions from a persistent to temporary variant. Try this for when the drawer is opened & closed.

This also should be checked for the rail variant.

@emclaug2 emclaug2 changed the base branch from master to dev May 23, 2022 15:41
@emclaug2 emclaug2 marked this pull request as ready for review May 23, 2022 19:34
@emclaug2 emclaug2 requested review from daileytj and jeffvg as code owners May 23, 2022 19:34
@emclaug2
Copy link
Contributor Author

Rail -> Temporary transition can be viewed here: https://github.com/brightlayer-ui/angular-showcase-demo/tree/feature/rail-demo

@jeffvg
Copy link
Contributor

jeffvg commented May 25, 2022

I see some odd behavior in firefox and not chrome on this branch.

NG-drawer-trans-firefox.mov

@emclaug2
Copy link
Contributor Author

I was able to reproduce this & am looking into it now. Good catch @jeffvg !

@emclaug2
Copy link
Contributor Author

emclaug2 commented Jun 1, 2022

@jeffvg I've opened an issue for the Firefox bug here: https://github.com/brightlayer-ui/angular-component-library/issues/440

Copy link
Contributor

@jeffvg jeffvg left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

looks good to me, even using rail

@emclaug2 emclaug2 merged commit 7240d13 into dev Jun 2, 2022
@delete-merged-branch delete-merged-branch bot deleted the feature/3144-drawer-transition branch June 2, 2022 17:47
@emclaug2 emclaug2 mentioned this pull request Jun 6, 2022
12 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging this pull request may close these issues.

Fix Drawer Jankiness
2 participants