purchasing/fuse-angular
3
0
Fork 0
mirror of https://github.com/richard-loafle/fuse-angular.git synced 2025-01-10 04:25:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/app/layout/components/navbar/vertical/style-1/style-1.component.html
View File

@ -22,7 +22,8 @@
</div> </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"> <div class="user" fxLayout="column" [ngClass]="fuseConfig.layout.navbar.secondaryBackground">
@ -34,7 +35,7 @@
</div> </div>
<div class="navbar-content" [ngClass]="fuseConfig.layout.navbar.primaryBackground"> <div class="navbar-content">
<fuse-navigation layout="vertical"></fuse-navigation> <fuse-navigation layout="vertical"></fuse-navigation>
</div> </div>

15
src/app/layout/components/navbar/vertical/style-1/style-1.component.ts
View File

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

15
src/app/layout/components/navbar/vertical/style-2/style-2.component.ts
View File

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