Janus007/Calendar
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Moving away from Azure Devops #1

Merged
Janus007 merged 113 commits from refac into master 2026-02-03 00:04:27 +01:00
Conversation 1 Commits 113 Files changed 622 +30 -6
2 changed files with 30 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files
Showing only changes of commit d976d31f14 - Show all commits

3
src/core/CalendarApp.ts
View file

@ -59,7 +59,8 @@ export class CalendarApp {
// Create NavigationAnimator with DOM elements // Create NavigationAnimator with DOM elements
this.animator = new NavigationAnimator( this.animator = new NavigationAnimator(
container.querySelector('swp-header-track') as HTMLElement, container.querySelector('swp-header-track') as HTMLElement,
container.querySelector('swp-content-track') as HTMLElement container.querySelector('swp-content-track') as HTMLElement,
container.querySelector('swp-header-drawer')
); );
// Render time axis from settings // Render time axis from settings

33
src/core/NavigationAnimator.ts
View file

@ -1,7 +1,8 @@
export class NavigationAnimator { export class NavigationAnimator {
constructor( constructor(
private headerTrack: HTMLElement, private headerTrack: HTMLElement,
private contentTrack: HTMLElement private contentTrack: HTMLElement,
private headerDrawer: HTMLElement | null
) {} ) {}
async slide(direction: 'left' | 'right', renderFn: () => Promise<void>): Promise<void> { async slide(direction: 'left' | 'right', renderFn: () => Promise<void>): Promise<void> {
@ -14,7 +15,7 @@ export class NavigationAnimator {
} }
private async animateOut(translate: string): Promise<void> { private async animateOut(translate: string): Promise<void> {
await Promise.all([ const animations = [
this.headerTrack.animate( this.headerTrack.animate(
[{ transform: 'translateX(0)' }, { transform: `translateX(${translate})` }], [{ transform: 'translateX(0)' }, { transform: `translateX(${translate})` }],
{ duration: 200, easing: 'ease-in' } { duration: 200, easing: 'ease-in' }
@ -23,11 +24,22 @@ export class NavigationAnimator {
[{ transform: 'translateX(0)' }, { transform: `translateX(${translate})` }], [{ transform: 'translateX(0)' }, { transform: `translateX(${translate})` }],
{ duration: 200, easing: 'ease-in' } { duration: 200, easing: 'ease-in' }
).finished ).finished
]); ];
if (this.headerDrawer) {
animations.push(
this.headerDrawer.animate(
[{ transform: 'translateX(0)' }, { transform: `translateX(${translate})` }],
{ duration: 200, easing: 'ease-in' }
).finished
);
}
await Promise.all(animations);
} }
private async animateIn(translate: string): Promise<void> { private async animateIn(translate: string): Promise<void> {
await Promise.all([ const animations = [
this.headerTrack.animate( this.headerTrack.animate(
[{ transform: `translateX(${translate})` }, { transform: 'translateX(0)' }], [{ transform: `translateX(${translate})` }, { transform: 'translateX(0)' }],
{ duration: 200, easing: 'ease-out' } { duration: 200, easing: 'ease-out' }
@ -36,6 +48,17 @@ export class NavigationAnimator {
[{ transform: `translateX(${translate})` }, { transform: 'translateX(0)' }], [{ transform: `translateX(${translate})` }, { transform: 'translateX(0)' }],
{ duration: 200, easing: 'ease-out' } { duration: 200, easing: 'ease-out' }
).finished ).finished
]); ];
if (this.headerDrawer) {
animations.push(
this.headerDrawer.animate(
[{ transform: `translateX(${translate})` }, { transform: 'translateX(0)' }],
{ duration: 200, easing: 'ease-out' }
).finished
);
}
await Promise.all(animations);
} }
} }