_Bastler/we_bstly-web
1
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

fix touch menu toggle

Browse Source
This commit is contained in:
_Bastler 2021-11-21 16:37:37 +01:00
parent fda829745e
commit 01f399e547
2 changed files with 11 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/app/ui/main/main.component.html
View File

@ -34,7 +34,8 @@
</mat-toolbar> </mat-toolbar>
<mat-sidenav-container> <mat-sidenav-container>
<mat-sidenav #sidenav [mode]="isBiggerScreen() ? 'side' : 'over'"> <mat-sidenav #sidenav [mode]="isBiggerScreen() ? 'side' : 'over'" [(opened)]="opened"
(click)="!isBiggerScreen() && opened=false">
<mat-nav-list> <mat-nav-list>
<a *ngIf="!auth || auth && !auth.authenticated" routerLink="/login" routerLinkActive="active" mat-list-item> <a *ngIf="!auth || auth && !auth.authenticated" routerLink="/login" routerLinkActive="active" mat-list-item>
<mat-icon>login</mat-icon> {{'login' | i18n}} <mat-icon>login</mat-icon> {{'login' | i18n}}

19
src/app/ui/main/main.component.ts
View File

@ -17,8 +17,7 @@ import { MatSidenav } from '@angular/material/sidenav';
}) })
export class MainComponent { export class MainComponent {
@ViewChild(MatSidenav) sidenav: MatSidenav; opened : boolean = true;
darkTheme = "false"; darkTheme = "false";
title = 'we.bstly'; title = 'we.bstly';
currentLocale: String; currentLocale: String;
@ -53,9 +52,9 @@ export class MainComponent {
const width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; const width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
if (width < 768) { if (width < 768) {
this.sidenav?.close(); this.opened = false;
} else { } else {
this.sidenav?.open(); this.opened = true;
} }
if (localStorage.getItem("bstly.darkTheme") == "true") { if (localStorage.getItem("bstly.darkTheme") == "true") {
@ -145,9 +144,9 @@ export class MainComponent {
@HostListener('window:resize', [ '$event' ]) @HostListener('window:resize', [ '$event' ])
onResize(event) { onResize(event) {
if (event.target.innerWidth < 768) { if (event.target.innerWidth < 768) {
this.sidenav?.close(); this.opened = false;
} else { } else {
this.sidenav?.open(); this.opened = true;
} }
} }
@ -170,10 +169,10 @@ export class MainComponent {
const touchDiff = this.touchStartX - this.touchX; const touchDiff = this.touchStartX - this.touchX;
this.touchStartX = 0; this.touchStartX = 0;
this.touchX = 0; this.touchX = 0;
if (touchDiff < 0 && touchDiff < (this.touchThresh * -1) && !this.sidenav.opened) { if (touchDiff < 0 && touchDiff < (this.touchThresh * -1) && !this.opened) {
this.sidenav.open(); this.opened = true;
} else if (touchDiff > 0 && touchDiff > this.touchThresh && this.sidenav.opened) { } else if (touchDiff > 0 && touchDiff > this.touchThresh && this.opened) {
this.sidenav.close(); this.opened = false;
} }
} }
}) })