diff options
Diffstat (limited to 'client/src/app/core/menu')
-rw-r--r-- | client/src/app/core/menu/index.ts | 1 | ||||
-rw-r--r-- | client/src/app/core/menu/menu.service.ts | 32 |
2 files changed, 33 insertions, 0 deletions
diff --git a/client/src/app/core/menu/index.ts b/client/src/app/core/menu/index.ts new file mode 100644 index 000000000..516a49aca --- /dev/null +++ b/client/src/app/core/menu/index.ts | |||
@@ -0,0 +1 @@ | |||
export * from './menu.service' | |||
diff --git a/client/src/app/core/menu/menu.service.ts b/client/src/app/core/menu/menu.service.ts new file mode 100644 index 000000000..46ef72e17 --- /dev/null +++ b/client/src/app/core/menu/menu.service.ts | |||
@@ -0,0 +1,32 @@ | |||
1 | import { Injectable } from '@angular/core' | ||
2 | import { ScreenService } from '@app/shared/misc/screen.service' | ||
3 | import { fromEvent } from 'rxjs' | ||
4 | import { debounceTime } from 'rxjs/operators' | ||
5 | |||
6 | @Injectable() | ||
7 | export class MenuService { | ||
8 | isMenuDisplayed = true | ||
9 | isMenuChangedByUser = false | ||
10 | |||
11 | constructor( | ||
12 | private screenService: ScreenService | ||
13 | ) { | ||
14 | // Do not display menu on small screens | ||
15 | if (this.screenService.isInSmallView()) { | ||
16 | this.isMenuDisplayed = false | ||
17 | } | ||
18 | |||
19 | fromEvent(window, 'resize') | ||
20 | .pipe(debounceTime(200)) | ||
21 | .subscribe(() => this.onResize()) | ||
22 | } | ||
23 | |||
24 | toggleMenu () { | ||
25 | this.isMenuDisplayed = !this.isMenuDisplayed | ||
26 | this.isMenuChangedByUser = true | ||
27 | } | ||
28 | |||
29 | onResize () { | ||
30 | this.isMenuDisplayed = window.innerWidth >= 800 && !this.isMenuChangedByUser | ||
31 | } | ||
32 | } | ||