EVOgeek/Vmeda.Online
1
0
Fork 1
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #2822 from crazyserver/MOBILE-3320

Browse Source 
MOBILE-3320 messages: Fix animations on message screen
This commit is contained in:
Noel De Martin 2021-06-09 16:53:38 +02:00 committed by GitHub
commit 3a3a441f7b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/addons/messages/pages/discussion/discussion.page.ts
View File

@ -163,9 +163,16 @@ export class AddonMessagesDiscussionPage implements OnInit, OnDestroy, AfterView
this.showInfo = !backViewPage || !CoreTextUtils.matchesGlob(backViewPage, '**/user/profile');
this.route.queryParams.subscribe(async (params) => {
this.loaded = false;
const oldConversationId = this.conversationId;
const oldUserId = this.userId;
this.conversationId = CoreNavigator.getRouteNumberParam('conversationId', { params }) || undefined;
this.userId = CoreNavigator.getRouteNumberParam('userId', { params }) || undefined;
if (oldConversationId != this.conversationId || oldUserId != this.userId) {
// Showing reload again can break animations.
this.loaded = false;
}
this.showKeyboard = CoreNavigator.getRouteBooleanParam('showKeyboard', { params }) || false;
await this.fetchData();

12
src/core/components/animations.ts
View File

@ -33,38 +33,34 @@ export class CoreAnimations {
static readonly SLIDE_IN_OUT = trigger('coreSlideInOut', [
// Enter animation.
transition('void => fromLeft', [
style({ transform: 'translateX(0)', opacity: 1 }),
animate(300, keyframes([
style({ opacity: 0, transform: 'translateX(-100%)', offset: 0 }),
style({ opacity: 1, transform: 'translateX(5%)', offset: 0.7 }),
style({ opacity: 1, transform: 'translateX(0)', offset: 1.0 }),
style({ opacity: 1, transform: 'translateX(0)', offset: 1.0 }),
])),
]),
// Leave animation.
transition('fromLeft => void', [
style({ transform: 'translateX(-100%)', opacity: 0 }),
animate(300, keyframes([
style({ opacity: 1, transform: 'translateX(0)', offset: 0 }),
style({ opacity: 1, transform: 'translateX(5%)', offset: 0.3 }),
style({ opacity: 0, transform: 'translateX(-100%)', offset: 1.0 }),
style({ opacity: 0, transform: 'translateX(-100%)', offset: 1.0 }),
])),
]),
// Enter animation.
transition('void => fromRight', [
style({ transform: 'translateX(0)', opacity: 1 }),
animate(300, keyframes([
style({ opacity: 0, transform: 'translateX(100%)', offset: 0 }),
style({ opacity: 0, transform: 'translateX(100%)', offset: 0 }),
style({ opacity: 1, transform: 'translateX(-5%)', offset: 0.7 }),
style({ opacity: 1, transform: 'translateX(0)', offset: 1.0 }),
])),
]),
// Leave animation.
transition('fromRight => void', [
style({ transform: 'translateX(-100%)', opacity: 0 }),
animate(300, keyframes([
style({ opacity: 1, transform: 'translateX(0)', offset: 0 }),
style({ opacity: 1, transform: 'translateX(-5%)', offset: 0.3 }),
style({ opacity: 0, transform: 'translateX(100%)', offset: 1.0 }),
style({ opacity: 0, transform: 'translateX(100%)', offset: 1.0 }),
])),
]),
]);