purchasing/fuse-angular
3
0
Fork 0
mirror of https://github.com/richard-loafle/fuse-angular.git synced 2026-03-11 00:38:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'master' into skeleton

Browse Source
This commit is contained in:
Sercan Yemen
2018-04-04 14:42:49 +03:00
parent 47ee65a980 02df48ab4e
commit 46c37042a2
12 changed files with 110 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/@fuse/components/shortcuts/shortcuts.component.ts
View File

@@ -1,4 +1,4 @@
import { Component, ElementRef, OnDestroy, OnInit, Renderer2, ViewChild } from '@angular/core';
import { Component, ElementRef, Input, OnDestroy, OnInit, Renderer2, ViewChild } from '@angular/core';
import { Subscription } from 'rxjs/Subscription';
import { ObservableMedia } from '@angular/flex-layout';
import { CookieService } from 'ngx-cookie-service';
@@ -7,8 +7,6 @@ import { FuseMatchMediaService } from '@fuse/services/match-media.service';
import { FuseNavigationService } from '@fuse/components/navigation/navigation.service';
import { FuseConfigService } from '@fuse/services/config.service';
import { navigation } from 'app/navigation/navigation';
@Component({
selector : 'fuse-shortcuts',
templateUrl: './shortcuts.component.html',
@@ -25,6 +23,8 @@ export class FuseShortcutsComponent implements OnInit, OnDestroy
matchMediaSubscription: Subscription;
onConfigChanged: Subscription;
@Input() navigation: any;
@ViewChild('searchInput') searchInputField;
@ViewChild('shortcuts') shortcutsEl: ElementRef;
@@ -37,8 +37,6 @@ export class FuseShortcutsComponent implements OnInit, OnDestroy
private cookieService: CookieService
)
{
this.filteredNavigationItems = this.navigationItems = this.fuseNavigationService.getFlatNavigation(navigation);
this.onConfigChanged =
this.fuseConfig.onConfigChanged
.subscribe(
@@ -50,6 +48,9 @@ export class FuseShortcutsComponent implements OnInit, OnDestroy
ngOnInit()
{
// Get the navigation items and flatten them
this.filteredNavigationItems = this.navigationItems = this.fuseNavigationService.getFlatNavigation(this.navigation);
const cookieExists = this.cookieService.check('FUSE2.shortcuts');
if ( cookieExists )

7
src/@fuse/components/sidebar/sidebar.service.ts
View File

@@ -46,7 +46,7 @@ export class FuseSidebarService
// Check if the sidebar exists
if ( !this._registry[key] )
{
console.error(`The sidebar with the key '${key}' doesn't exist in the registry.`);
console.warn(`The sidebar with the key '${key}' doesn't exist in the registry.`);
}
// Unregister the sidebar
@@ -57,13 +57,14 @@ export class FuseSidebarService
* Return the sidebar with the given key
*
* @param key
* @returns {FuseSidebarComponent}
*/
getSidebar(key): any
getSidebar(key): FuseSidebarComponent
{
// Check if the sidebar exists
if ( !this._registry[key] )
{
console.error(`The sidebar with the key '${key}' doesn't exist in the registry.`);
console.warn(`The sidebar with the key '${key}' doesn't exist in the registry.`);
return;
}

21
src/@fuse/components/theme-options/theme-options.component.ts
View File

@@ -1,4 +1,4 @@
import { Component, ElementRef, HostBinding, OnDestroy, OnInit, Renderer2, ViewChild } from '@angular/core';
import { Component, ElementRef, HostBinding, Input, OnDestroy, OnInit, Renderer2, ViewChild } from '@angular/core';
import { style, animate, AnimationBuilder, AnimationPlayer } from '@angular/animations';
import { Subscription } from 'rxjs/Subscription';
@@ -6,8 +6,6 @@ import { fuseAnimations } from '@fuse/animations';
import { FuseConfigService } from '@fuse/services/config.service';
import { FuseNavigationService } from '@fuse/components/navigation/navigation.service';
import { navigation } from 'app/navigation/navigation';
@Component({
selector : 'fuse-theme-options',
templateUrl: './theme-options.component.html',
@@ -16,6 +14,7 @@ import { navigation } from 'app/navigation/navigation';
})
export class FuseThemeOptionsComponent implements OnInit, OnDestroy
{
@Input() navigation;
@ViewChild('openButton') openButton;
@ViewChild('panel') panel;
@ViewChild('overlay') overlay: ElementRef;
@@ -43,10 +42,17 @@ export class FuseThemeOptionsComponent implements OnInit, OnDestroy
this.config = newConfig;
}
);
}
ngOnInit()
{
this.renderer.listen(this.overlay.nativeElement, 'click', () => {
this.closeBar();
});
// Get the nav model and add customize nav item
// that opens the bar programmatically
const nav: any = navigation;
const nav: any = this.navigation;
nav.push({
'id' : 'custom-function',
@@ -66,13 +72,6 @@ export class FuseThemeOptionsComponent implements OnInit, OnDestroy
});
}
ngOnInit()
{
this.renderer.listen(this.overlay.nativeElement, 'click', () => {
this.closeBar();
});
}
ngOnDestroy()
{
this.onConfigChanged.unsubscribe();

69
src/@fuse/services/config.service.ts
View File

@@ -1,25 +1,8 @@
import { Inject, Injectable, InjectionToken, Optional } from '@angular/core';
import { NavigationStart, Router } from '@angular/router';
import { Inject, Injectable, InjectionToken } from '@angular/core';
import { NavigationEnd, NavigationStart, Router } from '@angular/router';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';
import { Platform } from '@angular/cdk/platform';
// Define the default config
const DEFAULT_CONFIG = {
layout : {
navigation : 'left', // 'right', 'left', 'top', 'none'
navigationFolded: false, // true, false
toolbar : 'below', // 'above', 'below', 'none'
footer : 'below', // 'above', 'below', 'none'
mode : 'fullwidth' // 'boxed', 'fullwidth'
},
colorClasses : {
toolbar: 'mat-white-500-bg',
navbar : 'mat-fuse-dark-700-bg',
footer : 'mat-fuse-dark-900-bg'
},
customScrollbars: true,
routerAnimation : 'fadeIn' // fadeIn, slideUp, slideDown, slideRight, slideLeft, none
};
import * as _ from 'lodash';
// Create the injection token for the custom config
export const FUSE_CONFIG = new InjectionToken('fuseCustomConfig');
@@ -29,6 +12,7 @@ export class FuseConfigService
{
config: any;
defaultConfig: any;
isSetConfigRan = false;
onConfigChanged: BehaviorSubject<any>;
@@ -42,18 +26,11 @@ export class FuseConfigService
constructor(
private router: Router,
public platform: Platform,
@Inject(FUSE_CONFIG) @Optional() config
@Inject(FUSE_CONFIG) config
)
{
// Set the default settings from the constant
this.defaultConfig = DEFAULT_CONFIG;
// If custom config provided with forRoot,
// use them as default config...
if ( config )
{
this.defaultConfig = config;
}
// Set the default config from the user provided one (forRoot)
this.defaultConfig = config;
/**
* Disable Custom Scrollbars if Browser is Mobile
@@ -64,14 +41,25 @@ export class FuseConfigService
}
// Set the config from the default config
this.config = {...this.defaultConfig};
this.config = _.cloneDeep(this.defaultConfig);
// Reload the default settings for the
// layout on every navigation start
router.events.subscribe(
(event) => {
if ( event instanceof NavigationStart )
{
this.isSetConfigRan = false;
}
if ( event instanceof NavigationEnd )
{
if ( this.isSetConfigRan )
{
return;
}
this.setConfig({
layout: this.defaultConfig.layout
}
@@ -91,20 +79,11 @@ export class FuseConfigService
*/
setConfig(config): void
{
// Set the config from the given object
// Ugly, but works for now...
this.config = {
...this.config,
...config,
layout : {
...this.config.layout,
...config.layout,
},
colorClasses: {
...this.config.colorClasses,
...config.colorClasses
}
};
// Set the SetConfigRan true
this.isSetConfigRan = true;
// Merge the config
this.config = _.merge({}, this.config, config);
// Trigger the event
this.onConfigChanged.next(this.config);

2
src/app/main/main.component.html
View File

@@ -74,4 +74,4 @@
</mat-sidenav-container>
<fuse-theme-options></fuse-theme-options>
<fuse-theme-options [navigation]="navigation"></fuse-theme-options>

6
src/app/main/main.component.ts
View File

@@ -5,6 +5,8 @@ import { Subscription } from 'rxjs/Subscription';
import { FuseConfigService } from '@fuse/services/config.service';
import { navigation } from 'app/navigation/navigation';
@Component({
selector : 'fuse-main',
templateUrl : './main.component.html',
@@ -15,6 +17,8 @@ export class FuseMainComponent implements OnDestroy
{
onConfigChanged: Subscription;
fuseSettings: any;
navigation: any;
@HostBinding('attr.fuse-layout-mode') layoutMode;
constructor(
@@ -38,6 +42,8 @@ export class FuseMainComponent implements OnDestroy
{
this.document.body.className += ' is-mobile';
}
this.navigation = navigation;
}
ngOnDestroy()

4
src/app/main/navbar/navbar.component.html
View File

@@ -10,12 +10,12 @@
</div>
<button mat-button class="toggle-button-navbar mat-icon-button"
(click)="toggleSidebarFolded('navbar')" fxHide.lt-lg>
(click)="toggleSidebarFolded()" fxHide.lt-lg>
<mat-icon>menu</mat-icon>
</button>
<button mat-button class="toggle-button-navbar mat-icon-button"
(click)="toggleSidebarOpened('navbar')" fxHide.gt-md>
(click)="toggleSidebarOpened()" fxHide.gt-md>
<mat-icon>arrow_back</mat-icon>
</button>

32
src/app/main/navbar/navbar.component.ts
View File

@@ -1,4 +1,5 @@
import { Component, Input, OnDestroy, ViewChild, ViewEncapsulation } from '@angular/core';
import { Component, Input, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
import { NavigationEnd, Router } from '@angular/router';
import { Subscription } from 'rxjs/Subscription';
import { FusePerfectScrollbarDirective } from '@fuse/directives/fuse-perfect-scrollbar/fuse-perfect-scrollbar.directive';
@@ -6,6 +7,7 @@ import { FuseSidebarService } from '@fuse/components/sidebar/sidebar.service';
import { navigation } from 'app/navigation/navigation';
import { FuseNavigationService } from '@fuse/components/navigation/navigation.service';
import { FuseSidebarComponent } from '@fuse/components/sidebar/sidebar.component';
@Component({
selector : 'fuse-navbar',
@@ -13,7 +15,7 @@ import { FuseNavigationService } from '@fuse/components/navigation/navigation.se
styleUrls : ['./navbar.component.scss'],
encapsulation: ViewEncapsulation.None
})
export class FuseNavbarComponent implements OnDestroy
export class FuseNavbarComponent implements OnInit, OnDestroy
{
private fusePerfectScrollbar: FusePerfectScrollbarDirective;
@@ -41,7 +43,8 @@ export class FuseNavbarComponent implements OnDestroy
constructor(
private sidebarService: FuseSidebarService,
private navigationService: FuseNavigationService
private navigationService: FuseNavigationService,
private router: Router
)
{
// Navigation data
@@ -51,6 +54,21 @@ export class FuseNavbarComponent implements OnDestroy
this.layout = 'vertical';
}
ngOnInit()
{
this.router.events.subscribe(
(event) => {
if ( event instanceof NavigationEnd )
{
if ( this.sidebarService.getSidebar('navbar') )
{
this.sidebarService.getSidebar('navbar').close();
}
}
}
);
}
ngOnDestroy()
{
if ( this.fusePerfectScrollbarUpdateTimeout )
@@ -64,13 +82,13 @@ export class FuseNavbarComponent implements OnDestroy
}
}
toggleSidebarOpened(key)
toggleSidebarOpened()
{
this.sidebarService.getSidebar(key).toggleOpen();
this.sidebarService.getSidebar('navbar').toggleOpen();
}
toggleSidebarFolded(key)
toggleSidebarFolded()
{
this.sidebarService.getSidebar(key).toggleFold();
this.sidebarService.getSidebar('navbar').toggleFold();
}
}

2
src/app/main/toolbar/toolbar.component.html
View File

@@ -21,7 +21,7 @@
</div>
<div class="px-8 px-mat-16">
<fuse-shortcuts></fuse-shortcuts>
<fuse-shortcuts [navigation]="navigation"></fuse-shortcuts>
</div>
</div>

4
src/app/main/toolbar/toolbar.component.ts
View File

@@ -5,6 +5,8 @@ import { TranslateService } from '@ngx-translate/core';
import { FuseConfigService } from '@fuse/services/config.service';
import { FuseSidebarService } from '@fuse/components/sidebar/sidebar.service';
import { navigation } from 'app/navigation/navigation';
@Component({
selector : 'fuse-toolbar',
templateUrl: './toolbar.component.html',
@@ -19,6 +21,7 @@ export class FuseToolbarComponent
showLoadingBar: boolean;
horizontalNav: boolean;
noNav: boolean;
navigation: any;
constructor(
private router: Router,
@@ -87,6 +90,7 @@ export class FuseToolbarComponent
this.noNav = settings.layout.navigation === 'none';
});
this.navigation = navigation;
}
toggleSidebarOpened(key)