(Navbar) Correctly delay the update of the perfect scrollbar + Fixed the style-1 color issue

This commit is contained in:
Sercan Yemen 2018-08-27 10:05:48 +03:00
parent 5d62c58725
commit c8c0b4a609
3 changed files with 15 additions and 24 deletions

View File

@ -22,7 +22,8 @@
</div>
<div class="navbar-scroll-container" fusePerfectScrollbar [fusePerfectScrollbarOptions]="{suppressScrollX: true}">
<div class="navbar-scroll-container" [ngClass]="fuseConfig.layout.navbar.primaryBackground"
fusePerfectScrollbar [fusePerfectScrollbarOptions]="{suppressScrollX: true}">
<div class="user" fxLayout="column" [ngClass]="fuseConfig.layout.navbar.secondaryBackground">
@ -34,7 +35,7 @@
</div>
<div class="navbar-content" [ngClass]="fuseConfig.layout.navbar.primaryBackground">
<div class="navbar-content">
<fuse-navigation layout="vertical"></fuse-navigation>
</div>

View File

@ -1,7 +1,7 @@
import { Component, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
import { NavigationEnd, Router } from '@angular/router';
import { Subject } from 'rxjs';
import { filter, take, takeUntil } from 'rxjs/operators';
import { delay, filter, take, takeUntil } from 'rxjs/operators';
import { FuseConfigService } from '@fuse/services/config.service';
import { FuseNavigationService } from '@fuse/components/navigation/navigation.service';
@ -17,7 +17,6 @@ import { FuseSidebarService } from '@fuse/components/sidebar/sidebar.service';
export class NavbarVerticalStyle1Component implements OnInit, OnDestroy
{
fuseConfig: any;
fusePerfectScrollbarUpdateTimeout: any;
navigation: any;
// Private
@ -60,11 +59,12 @@ export class NavbarVerticalStyle1Component implements OnInit, OnDestroy
// Update the scrollbar on collapsable item toggle
this._fuseNavigationService.onItemCollapseToggled
.pipe(takeUntil(this._unsubscribeAll))
.pipe(
delay(500),
takeUntil(this._unsubscribeAll)
)
.subscribe(() => {
this.fusePerfectScrollbarUpdateTimeout = setTimeout(() => {
this._fusePerfectScrollbar.update();
}, 310);
this._fusePerfectScrollbar.update();
});
// Scroll to the active item position
@ -135,11 +135,6 @@ export class NavbarVerticalStyle1Component implements OnInit, OnDestroy
*/
ngOnDestroy(): void
{
if ( this.fusePerfectScrollbarUpdateTimeout )
{
clearTimeout(this.fusePerfectScrollbarUpdateTimeout);
}
// Unsubscribe from all subscriptions
this._unsubscribeAll.next();
this._unsubscribeAll.complete();

View File

@ -1,7 +1,7 @@
import { Component, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
import { NavigationEnd, Router } from '@angular/router';
import { Subject } from 'rxjs';
import { filter, take, takeUntil } from 'rxjs/operators';
import { delay, filter, take, takeUntil } from 'rxjs/operators';
import { FuseConfigService } from '@fuse/services/config.service';
import { FuseNavigationService } from '@fuse/components/navigation/navigation.service';
@ -17,7 +17,6 @@ import { FuseSidebarService } from '@fuse/components/sidebar/sidebar.service';
export class NavbarVerticalStyle2Component implements OnInit, OnDestroy
{
fuseConfig: any;
fusePerfectScrollbarUpdateTimeout: any;
navigation: any;
// Private
@ -60,11 +59,12 @@ export class NavbarVerticalStyle2Component implements OnInit, OnDestroy
// Update the scrollbar on collapsable item toggle
this._fuseNavigationService.onItemCollapseToggled
.pipe(takeUntil(this._unsubscribeAll))
.pipe(
delay(500),
takeUntil(this._unsubscribeAll)
)
.subscribe(() => {
this.fusePerfectScrollbarUpdateTimeout = setTimeout(() => {
this._fusePerfectScrollbar.update();
}, 310);
this._fusePerfectScrollbar.update();
});
// Scroll to the active item position
@ -135,11 +135,6 @@ export class NavbarVerticalStyle2Component implements OnInit, OnDestroy
*/
ngOnDestroy(): void
{
if ( this.fusePerfectScrollbarUpdateTimeout )
{
clearTimeout(this.fusePerfectScrollbarUpdateTimeout);
}
// Unsubscribe from all subscriptions
this._unsubscribeAll.next();
this._unsubscribeAll.complete();