purchasing/fuse-angular
3
0
Fork 0
mirror of https://github.com/richard-loafle/fuse-angular.git synced 2025-01-09 20:15:07 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge changes from 'master' into 'skeleton'

Browse Source
This commit is contained in:
sercan 2019-05-30 14:32:51 +03:00
commit 455e7f6f47
47 changed files with 11118 additions and 12253 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
README.md
View File

@ -1,6 +1,6 @@
# Fuse - Angular # Fuse - Angular
Material Design Admin Template with Angular 7+ and Angular Material Material Design Admin Template with Angular 8 and Angular Material
## The Community ## The Community

53
angular.json
View File

@ -4,24 +4,24 @@
"newProjectRoot": "projects", "newProjectRoot": "projects",
"projects": { "projects": {
"fuse": { "fuse": {
"root": "",
"sourceRoot": "src",
"projectType": "application", "projectType": "application",
"prefix": "app",
"schematics": { "schematics": {
"@schematics/angular:component": { "@schematics/angular:component": {
"styleext": "scss" "style": "scss"
} }
}, },
"root": "",
"sourceRoot": "src",
"prefix": "app",
"architect": { "architect": {
"build": { "build": {
"builder": "@angular-devkit/build-angular:browser", "builder": "@angular-devkit/build-angular:browser",
"options": { "options": {
"outputPath": "dist", "outputPath": "dist/fuse",
"index": "src/index.html", "index": "src/index.html",
"main": "src/main.ts", "main": "src/main.ts",
"polyfills": "src/polyfills.ts", "polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.app.json", "tsConfig": "tsconfig.app.json",
"assets": [ "assets": [
"src/favicon.ico", "src/favicon.ico",
"src/assets" "src/assets"
@ -52,8 +52,8 @@
"budgets": [ "budgets": [
{ {
"type": "initial", "type": "initial",
"maximumWarning": "2mb", "maximumWarning": "4mb",
"maximumError": "5mb" "maximumError": "6mb"
} }
] ]
}, },
@ -100,37 +100,31 @@
"options": { "options": {
"main": "src/test.ts", "main": "src/test.ts",
"polyfills": "src/polyfills.ts", "polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.spec.json", "tsConfig": "tsconfig.spec.json",
"karmaConfig": "src/karma.conf.js", "karmaConfig": "karma.conf.js",
"styles": [
"src/styles.scss"
],
"scripts": [],
"assets": [ "assets": [
"src/favicon.ico", "src/favicon.ico",
"src/assets" "src/assets"
] ],
"styles": [
"src/styles.scss"
],
"scripts": []
} }
}, },
"lint": { "lint": {
"builder": "@angular-devkit/build-angular:tslint", "builder": "@angular-devkit/build-angular:tslint",
"options": { "options": {
"tsConfig": [ "tsConfig": [
"src/tsconfig.app.json", "tsconfig.app.json",
"src/tsconfig.spec.json" "tsconfig.spec.json",
"e2e/tsconfig.json"
], ],
"exclude": [ "exclude": [
"**/node_modules/**" "**/node_modules/**"
] ]
} }
} },
}
},
"fuse-e2e": {
"root": "e2e/",
"projectType": "application",
"prefix": "",
"architect": {
"e2e": { "e2e": {
"builder": "@angular-devkit/build-angular:protractor", "builder": "@angular-devkit/build-angular:protractor",
"options": { "options": {
@ -142,15 +136,6 @@
"devServerTarget": "fuse:serve:production" "devServerTarget": "fuse:serve:production"
} }
} }
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": "e2e/tsconfig.e2e.json",
"exclude": [
"**/node_modules/**"
]
}
} }
} }
} }

16
browserslist Normal file
View File

@ -0,0 +1,16 @@
# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
# For additional information regarding the format and rule options, please see:
# https://github.com/browserslist/browserslist#queries
# You can see what browsers were selected by your queries by running:
# npx browserslist
# Googlebot uses an older version of Chrome
# For additional information see: https://developers.google.com/search/docs/guides/rendering
> 0.5%
last 2 versions
Firefox ESR
Chrome 41 # Support for Googlebot
not dead
not IE 9-11 # For IE 9-11 support, remove 'not'.

5
src/karma.conf.js → karma.conf.js
View File

@ -17,7 +17,7 @@ module.exports = function (config)
clearContext: false // leave Jasmine Spec Runner output visible in browser clearContext: false // leave Jasmine Spec Runner output visible in browser
}, },
coverageIstanbulReporter: { coverageIstanbulReporter: {
dir : require('path').join(__dirname, '../coverage'), dir : require('path').join(__dirname, './coverage/fuse'),
reports : ['html', 'lcovonly', 'text-summary'], reports : ['html', 'lcovonly', 'text-summary'],
fixWebpackSourcePaths: true fixWebpackSourcePaths: true
}, },
@ -27,6 +27,7 @@ module.exports = function (config)
logLevel : config.LOG_INFO, logLevel : config.LOG_INFO,
autoWatch : true, autoWatch : true,
browsers : ['Chrome'], browsers : ['Chrome'],
singleRun : false singleRun : false,
restartOnFileChange : true
}); });
}; };

22315
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

175
package.json
View File

@ -1,91 +1,88 @@
{ {
"name": "fuse", "name": "fuse",
"version": "7.1.0", "version": "8.0.0",
"license": "https://themeforest.net/licenses/terms/regular", "license": "https://themeforest.net/licenses/terms/regular",
"scripts": { "scripts": {
"ng": "ng", "ng": "ng",
"start": "ng serve --open", "start": "ng serve --open",
"start-hmr": "ng serve --configuration hmr --source-map=false --hmr-warning=false", "start-hmr": "ng serve --configuration hmr --source-map=false --hmr-warning=false",
"start-hmr-sourcemaps": "ng serve --configuration hmr --source-map=true --hmr-warning=false", "start-hmr-sourcemaps": "ng serve --configuration hmr --source-map=true --hmr-warning=false",
"build": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --dev", "build": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --dev",
"build-stats": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --dev --stats-json", "build-stats": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --dev --stats-json",
"build-prod": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --prod", "build-prod": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --prod",
"build-prod-stats": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --prod --stats-json", "build-prod-stats": "node --max_old_space_size=6144 ./node_modules/@angular/cli/bin/ng build --prod --stats-json",
"test": "ng test", "test": "ng test",
"lint": "ng lint", "lint": "ng lint",
"e2e": "ng e2e", "e2e": "ng e2e",
"bundle-report": "webpack-bundle-analyzer dist/stats.json" "bundle-report": "webpack-bundle-analyzer dist/stats.json"
}, },
"private": true, "private": true,
"dependencies": { "dependencies": {
"@agm/core": "1.0.0-beta.5", "@agm/core": "1.0.0-beta.5",
"@angular/animations": "7.2.1", "@angular/animations": "8.0.0",
"@angular/cdk": "7.2.1", "@angular/cdk": "8.0.0",
"@angular/common": "7.2.1", "@angular/common": "8.0.0",
"@angular/compiler": "7.2.1", "@angular/compiler": "8.0.0",
"@angular/core": "7.2.1", "@angular/core": "8.0.0",
"@angular/flex-layout": "7.0.0-beta.23", "@angular/flex-layout": "8.0.0-beta.26",
"@angular/forms": "7.2.1", "@angular/forms": "8.0.0",
"@angular/http": "7.2.1", "@angular/material": "8.0.0",
"@angular/material": "7.2.1", "@angular/material-moment-adapter": "8.0.0",
"@angular/material-moment-adapter": "7.2.1", "@angular/platform-browser": "8.0.0",
"@angular/platform-browser": "7.2.1", "@angular/platform-browser-dynamic": "8.0.0",
"@angular/platform-browser-dynamic": "7.2.1", "@angular/router": "8.0.0",
"@angular/router": "7.2.1", "@ngrx/effects": "8.0.0-beta.2",
"@ngrx/effects": "7.0.0", "@ngrx/router-store": "8.0.0-beta.2",
"@ngrx/router-store": "7.0.0", "@ngrx/store": "8.0.0-beta.2",
"@ngrx/store": "7.0.0", "@ngrx/store-devtools": "8.0.0-beta.2",
"@ngrx/store-devtools": "7.0.0", "@ngx-translate/core": "11.0.1",
"@ngx-translate/core": "11.0.1", "@swimlane/dragula": "3.8.0",
"@swimlane/dragula": "3.7.3", "@swimlane/ngx-charts": "11.1.0",
"@swimlane/ngx-charts": "10.0.0", "@swimlane/ngx-datatable": "15.0.0",
"@swimlane/ngx-datatable": "14.0.0", "@swimlane/ngx-dnd": "7.0.0",
"@swimlane/ngx-dnd": "6.0.0", "@types/prismjs": "1.16.0",
"@types/prismjs": "1.9.0", "angular-calendar": "0.27.8",
"angular-calendar": "0.26.4", "angular-in-memory-web-api": "0.8.0",
"angular-in-memory-web-api": "0.8.0", "chart.js": "2.8.0",
"chart.js": "2.7.3", "classlist.js": "1.1.20150312",
"classlist.js": "1.1.20150312", "d3": "5.9.2",
"core-js": "2.6.2", "date-fns": "1.30.1",
"d3": "5.7.0", "hammerjs": "2.0.8",
"date-fns": "1.30.1", "lodash": "4.17.11",
"hammerjs": "2.0.8", "moment": "2.24.0",
"lodash": "4.17.11", "ng2-charts": "2.2.4",
"moment": "2.23.0", "ngrx-store-freeze": "0.2.4",
"ng2-charts": "1.6.0", "ngx-color-picker": "7.5.0",
"ngrx-store-freeze": "0.2.4", "ngx-cookie-service": "2.2.0",
"ngx-color-picker": "7.3.0", "perfect-scrollbar": "1.4.0",
"ngx-cookie-service": "2.1.0", "prismjs": "1.16.0",
"perfect-scrollbar": "1.4.0", "rxjs": "6.5.2",
"prismjs": "1.15.0", "web-animations-js": "github:angular/web-animations-js#release_pr208",
"rxjs": "6.3.3", "zone.js": "0.9.1"
"rxjs-compat": "6.3.3", },
"web-animations-js": "2.3.1", "devDependencies": {
"zone.js": "0.8.28" "@angular/cli": "8.0.0",
}, "@angular/compiler-cli": "8.0.0",
"devDependencies": { "@angular/language-service": "8.0.0",
"@angular/cli": "7.2.2", "@angular-devkit/build-angular": "0.800.0",
"@angular/compiler-cli": "7.2.1", "@angularclass/hmr": "2.1.3",
"@angular/language-service": "7.2.1", "@types/jasmine": "3.3.13",
"@angular-devkit/build-angular": "0.12.2", "@types/jasminewd2": "2.0.6",
"@angularclass/hmr": "2.1.3", "@types/lodash": "4.14.132",
"@types/jasmine": "2.8.14", "@types/node": "8.9.5",
"@types/jasminewd2": "2.0.6", "codelyzer": "5.0.1",
"@types/lodash": "4.14.119", "jasmine-core": "3.4.0",
"@types/node": "8.9.5", "jasmine-spec-reporter": "4.2.1",
"codelyzer": "4.5.0", "karma": "4.1.0",
"jasmine-core": "2.99.1", "karma-chrome-launcher": "2.2.0",
"jasmine-spec-reporter": "4.2.1", "karma-coverage-istanbul-reporter": "2.0.5",
"karma": "3.1.4", "karma-jasmine": "2.0.1",
"karma-chrome-launcher": "2.2.0", "karma-jasmine-html-reporter": "1.4.2",
"karma-coverage-istanbul-reporter": "2.0.4", "protractor": "5.4.2",
"karma-jasmine": "1.1.2", "ts-node": "7.0.1",
"karma-jasmine-html-reporter": "0.2.2", "tslib": "1.9.3",
"protractor": "5.4.2", "tslint": "5.15.0",
"ts-node": "7.0.1", "typescript": "3.4.5",
"tslib": "1.9.3", "webpack-bundle-analyzer": "3.3.2"
"tslint": "5.11.0", }
"typescript": "3.2.2",
"webpack-bundle-analyzer": "3.0.3"
}
} }

27
src/@fuse/animations/index.ts
View File

@ -51,26 +51,23 @@ export const fuseAnimations = [
]), ]),
trigger('fadeInOut', [ trigger('fadeInOut', [
state('0', style({ state('0, void', style({
display: 'none',
opacity: 0 opacity: 0
})), })),
state('1', style({ state('1, *', style({
display: 'block',
opacity: 1 opacity: 1
})), })),
transition('1 => 0', animate('300ms ease-out')), transition('1 => 0', animate('300ms ease-out')),
transition('0 => 1', animate('300ms ease-in')) transition('0 => 1', animate('300ms ease-in')),
transition('void <=> *', animate('300ms ease-in'))
]), ]),
trigger('slideInOut', [ trigger('slideInOut', [
state('0', style({ state('0', style({
height : '0px', height: '0px'
display: 'none'
})), })),
state('1', style({ state('1', style({
height : '*', height: '*'
display: 'block'
})), })),
transition('1 => 0', animate('300ms ease-out')), transition('1 => 0', animate('300ms ease-out')),
transition('0 => 1', animate('300ms ease-in')) transition('0 => 1', animate('300ms ease-in'))
@ -120,17 +117,15 @@ export const fuseAnimations = [
}) })
) )
] ]
), )
]), ]),
trigger('slideInLeft', [ trigger('slideInLeft', [
state('void', style({ state('void', style({
transform: 'translateX(-100%)', transform: 'translateX(-100%)',
display : 'none'
})), })),
state('*', style({ state('*', style({
transform: 'translateX(0)', transform: 'translateX(0)',
display : 'flex'
})), })),
transition('void => *', animate('300ms')), transition('void => *', animate('300ms')),
transition('* => void', animate('300ms')) transition('* => void', animate('300ms'))
@ -139,11 +134,9 @@ export const fuseAnimations = [
trigger('slideInRight', [ trigger('slideInRight', [
state('void', style({ state('void', style({
transform: 'translateX(100%)', transform: 'translateX(100%)',
display : 'none'
})), })),
state('*', style({ state('*', style({
transform: 'translateX(0)', transform: 'translateX(0)',
display : 'flex'
})), })),
transition('void => *', animate('300ms')), transition('void => *', animate('300ms')),
transition('* => void', animate('300ms')) transition('* => void', animate('300ms'))
@ -152,11 +145,9 @@ export const fuseAnimations = [
trigger('slideInTop', [ trigger('slideInTop', [
state('void', style({ state('void', style({
transform: 'translateY(-100%)', transform: 'translateY(-100%)',
display : 'none'
})), })),
state('*', style({ state('*', style({
transform: 'translateY(0)', transform: 'translateY(0)',
display : 'flex'
})), })),
transition('void => *', animate('300ms')), transition('void => *', animate('300ms')),
transition('* => void', animate('300ms')) transition('* => void', animate('300ms'))
@ -166,11 +157,9 @@ export const fuseAnimations = [
state('void', state('void',
style({ style({
transform: 'translateY(100%)', transform: 'translateY(100%)',
display : 'none'
})), })),
state('*', style({ state('*', style({
transform: 'translateY(0)', transform: 'translateY(0)',
display : 'flex'
})), })),
transition('void => *', animate('300ms')), transition('void => *', animate('300ms')),
transition('* => void', animate('300ms')) transition('* => void', animate('300ms'))
@ -190,7 +179,7 @@ export const fuseAnimations = [
// ----------------------------------------------------------------------------------------------------- // -----------------------------------------------------------------------------------------------------
// @ Router animations // @ Router animations
// ----------------------------------------------------------------------------------------------------- // -----------------------------------------------------------------------------------------------------
trigger('routerTransitionLeft', [ trigger('routerTransitionLeft', [
transition('* => *', [ transition('* => *', [

2
src/@fuse/components/confirm-dialog/confirm-dialog.component.ts
View File

@ -1,5 +1,5 @@
import { Component } from '@angular/core'; import { Component } from '@angular/core';
import { MatDialogRef } from '@angular/material'; import { MatDialogRef } from '@angular/material/dialog';
@Component({ @Component({
selector : 'fuse-confirm-dialog', selector : 'fuse-confirm-dialog',

3
src/@fuse/components/confirm-dialog/confirm-dialog.module.ts
View File

@ -1,5 +1,6 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { MatButtonModule, MatDialogModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatDialogModule } from '@angular/material/dialog';
import { FuseConfirmDialogComponent } from '@fuse/components/confirm-dialog/confirm-dialog.component'; import { FuseConfirmDialogComponent } from '@fuse/components/confirm-dialog/confirm-dialog.component';

3
src/@fuse/components/demo/demo.module.ts
View File

@ -1,7 +1,8 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatDividerModule, MatListModule } from '@angular/material'; import { MatDividerModule } from '@angular/material/divider';
import { MatListModule } from '@angular/material/list';
import { FuseDemoContentComponent } from './demo-content/demo-content.component'; import { FuseDemoContentComponent } from './demo-content/demo-content.component';
import { FuseDemoSidebarComponent } from './demo-sidebar/demo-sidebar.component'; import { FuseDemoSidebarComponent } from './demo-sidebar/demo-sidebar.component';

2
src/@fuse/components/highlight/highlight.component.ts
View File

@ -13,7 +13,7 @@ import '@fuse/components/highlight/prism-languages';
export class FuseHighlightComponent implements OnInit, OnDestroy export class FuseHighlightComponent implements OnInit, OnDestroy
{ {
// Source // Source
@ContentChild('source') @ContentChild('source', {static: true})
source: ElementRef; source: ElementRef;
// Lang // Lang

5
src/@fuse/components/material-color-picker/material-color-picker.module.ts
View File

@ -1,7 +1,10 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { FlexLayoutModule } from '@angular/flex-layout'; import { FlexLayoutModule } from '@angular/flex-layout';
import { MatButtonModule, MatIconModule, MatMenuModule, MatTooltipModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatTooltipModule } from '@angular/material/tooltip';
import { FusePipesModule } from '@fuse/pipes/pipes.module'; import { FusePipesModule } from '@fuse/pipes/pipes.module';

3
src/@fuse/components/navigation/navigation.module.ts
View File

@ -1,7 +1,8 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatIconModule, MatRippleModule } from '@angular/material'; import { MatRippleModule } from '@angular/material/core';
import { MatIconModule } from '@angular/material/icon';
import { TranslateModule } from '@ngx-translate/core'; import { TranslateModule } from '@ngx-translate/core';

4
src/@fuse/components/progress-bar/progress-bar.module.ts
View File

@ -2,7 +2,9 @@ import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatButtonModule, MatIconModule, MatProgressBarModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { MatProgressBarModule } from '@angular/material/progress-bar';
import { FuseProgressBarComponent } from './progress-bar.component'; import { FuseProgressBarComponent } from './progress-bar.component';

3
src/@fuse/components/search-bar/search-bar.module.ts
View File

@ -2,7 +2,8 @@ import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatButtonModule, MatIconModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { FuseSearchBarComponent } from './search-bar.component'; import { FuseSearchBarComponent } from './search-bar.component';

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

@ -1,4 +1,4 @@
import { Component, ElementRef, Input, OnDestroy, OnInit, Renderer2, ViewChild } from '@angular/core'; import { AfterViewInit, Component, ElementRef, Input, OnDestroy, OnInit, Renderer2, ViewChild } from '@angular/core';
import { MediaObserver } from '@angular/flex-layout'; import { MediaObserver } from '@angular/flex-layout';
import { CookieService } from 'ngx-cookie-service'; import { CookieService } from 'ngx-cookie-service';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
@ -12,7 +12,7 @@ import { FuseNavigationService } from '@fuse/components/navigation/navigation.se
templateUrl: './shortcuts.component.html', templateUrl: './shortcuts.component.html',
styleUrls : ['./shortcuts.component.scss'] styleUrls : ['./shortcuts.component.scss']
}) })
export class FuseShortcutsComponent implements OnInit, OnDestroy export class FuseShortcutsComponent implements OnInit, AfterViewInit, OnDestroy
{ {
shortcutItems: any[]; shortcutItems: any[];
navigationItems: any[]; navigationItems: any[];
@ -23,10 +23,10 @@ export class FuseShortcutsComponent implements OnInit, OnDestroy
@Input() @Input()
navigation: any; navigation: any;
@ViewChild('searchInput') @ViewChild('searchInput', {static: false})
searchInputField; searchInputField;
@ViewChild('shortcuts') @ViewChild('shortcuts', {static: false})
shortcutsEl: ElementRef; shortcutsEl: ElementRef;
// Private // Private
@ -79,32 +79,36 @@ export class FuseShortcutsComponent implements OnInit, OnDestroy
// User's shortcut items // User's shortcut items
this.shortcutItems = [ this.shortcutItems = [
{ {
'title': 'Calendar', title: 'Calendar',
'type' : 'item', type : 'item',
'icon' : 'today', icon : 'today',
'url' : '/apps/calendar' url : '/apps/calendar'
}, },
{ {
'title': 'Mail', title: 'Mail',
'type' : 'item', type : 'item',
'icon' : 'email', icon : 'email',
'url' : '/apps/mail' url : '/apps/mail'
}, },
{ {
'title': 'Contacts', title: 'Contacts',
'type' : 'item', type : 'item',
'icon' : 'account_box', icon : 'account_box',
'url' : '/apps/contacts' url : '/apps/contacts'
}, },
{ {
'title': 'To-Do', title: 'To-Do',
'type' : 'item', type : 'item',
'icon' : 'check_box', icon : 'check_box',
'url' : '/apps/todo' url : '/apps/todo'
} }
]; ];
} }
}
ngAfterViewInit(): void
{
// Subscribe to media changes // Subscribe to media changes
this._fuseMatchMediaService.onMediaChange this._fuseMatchMediaService.onMediaChange
.pipe(takeUntil(this._unsubscribeAll)) .pipe(takeUntil(this._unsubscribeAll))

9
src/@fuse/components/shortcuts/shortcuts.module.ts
View File

@ -2,7 +2,14 @@ import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { FlexLayoutModule } from '@angular/flex-layout'; import { FlexLayoutModule } from '@angular/flex-layout';
import { MatButtonModule, MatDividerModule, MatFormFieldModule, MatIconModule, MatInputModule, MatListModule, MatMenuModule, MatTooltipModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatDividerModule } from '@angular/material/divider';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatListModule } from '@angular/material/list';
import { MatMenuModule } from '@angular/material/menu';
import { MatTooltipModule } from '@angular/material/tooltip';
import { CookieService } from 'ngx-cookie-service'; import { CookieService } from 'ngx-cookie-service';
import { FuseShortcutsComponent } from './shortcuts.component'; import { FuseShortcutsComponent } from './shortcuts.component';

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

@ -131,17 +131,17 @@ export class FuseThemeOptionsComponent implements OnInit, OnDestroy
// Add customize nav item that opens the bar programmatically // Add customize nav item that opens the bar programmatically
const customFunctionNavItem = { const customFunctionNavItem = {
'id' : 'custom-function', id : 'custom-function',
'title' : 'Custom Function', title : 'Custom Function',
'type' : 'group', type : 'group',
'icon' : 'settings', icon : 'settings',
'children': [ children: [
{ {
'id' : 'customize', id : 'customize',
'title' : 'Customize', title : 'Customize',
'type' : 'item', type : 'item',
'icon' : 'settings', icon : 'settings',
'function': () => { function: () => {
this.toggleSidebarOpen('themeOptionsPanel'); this.toggleSidebarOpen('themeOptionsPanel');
} }
} }

12
src/@fuse/components/theme-options/theme-options.module.ts
View File

@ -2,9 +2,15 @@ import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { FlexLayoutModule } from '@angular/flex-layout'; import { FlexLayoutModule } from '@angular/flex-layout';
import { import { MatButtonModule } from '@angular/material/button';
MatButtonModule, MatCheckboxModule, MatDividerModule, MatFormFieldModule, MatIconModule, MatOptionModule, MatRadioModule, MatSelectModule, MatSlideToggleModule import { MatCheckboxModule } from '@angular/material/checkbox';
} from '@angular/material'; import { MatOptionModule } from '@angular/material/core';
import { MatDividerModule } from '@angular/material/divider';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatRadioModule } from '@angular/material/radio';
import { MatSelectModule } from '@angular/material/select';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { FuseDirectivesModule } from '@fuse/directives/directives'; import { FuseDirectivesModule } from '@fuse/directives/directives';
import { FuseMaterialColorPickerModule } from '@fuse/components/material-color-picker/material-color-picker.module'; import { FuseMaterialColorPickerModule } from '@fuse/components/material-color-picker/material-color-picker.module';

6
src/@fuse/directives/fuse-mat-sidenav/fuse-mat-sidenav.directive.ts
View File

@ -1,5 +1,5 @@
import { Directive, Input, OnInit, HostListener, OnDestroy, HostBinding } from '@angular/core'; import { Directive, Input, OnInit, HostListener, OnDestroy, HostBinding } from '@angular/core';
import { MatSidenav } from '@angular/material'; import { MatSidenav } from '@angular/material/sidenav';
import { MediaObserver } from '@angular/flex-layout'; import { MediaObserver } from '@angular/flex-layout';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
@ -58,7 +58,7 @@ export class FuseMatSidenavHelperDirective implements OnInit, OnDestroy
// Register the sidenav to the service // Register the sidenav to the service
this._fuseMatSidenavHelperService.setSidenav(this.fuseMatSidenavHelper, this._matSidenav); this._fuseMatSidenavHelperService.setSidenav(this.fuseMatSidenavHelper, this._matSidenav);
if ( this._mediaObserver.isActive(this.matIsLockedOpen) ) if ( this.matIsLockedOpen && this._mediaObserver.isActive(this.matIsLockedOpen) )
{ {
this.isLockedOpen = true; this.isLockedOpen = true;
this._matSidenav.mode = 'side'; this._matSidenav.mode = 'side';
@ -74,7 +74,7 @@ export class FuseMatSidenavHelperDirective implements OnInit, OnDestroy
this._fuseMatchMediaService.onMediaChange this._fuseMatchMediaService.onMediaChange
.pipe(takeUntil(this._unsubscribeAll)) .pipe(takeUntil(this._unsubscribeAll))
.subscribe(() => { .subscribe(() => {
if ( this._mediaObserver.isActive(this.matIsLockedOpen) ) if ( this.matIsLockedOpen && this._mediaObserver.isActive(this.matIsLockedOpen) )
{ {
this.isLockedOpen = true; this.isLockedOpen = true;
this._matSidenav.mode = 'side'; this._matSidenav.mode = 'side';

2
src/@fuse/directives/fuse-mat-sidenav/fuse-mat-sidenav.service.ts
View File

@ -1,5 +1,5 @@
import { Injectable } from '@angular/core'; import { Injectable } from '@angular/core';
import { MatSidenav } from '@angular/material'; import { MatSidenav } from '@angular/material/sidenav';
@Injectable({ @Injectable({
providedIn: 'root' providedIn: 'root'

182
src/@fuse/directives/fuse-perfect-scrollbar/fuse-perfect-scrollbar.directive.ts
View File

@ -1,23 +1,24 @@
import { AfterViewInit, Directive, ElementRef, HostListener, Input, OnDestroy } from '@angular/core'; import { AfterViewInit, Directive, ElementRef, HostListener, Input, OnDestroy, OnInit } from '@angular/core';
import { NavigationEnd, Router } from '@angular/router'; import { NavigationEnd, Router } from '@angular/router';
import { Platform } from '@angular/cdk/platform'; import { Platform } from '@angular/cdk/platform';
import { Subject } from 'rxjs'; import { fromEvent, Subject } from 'rxjs';
import { filter, takeUntil } from 'rxjs/operators'; import { debounceTime, filter, takeUntil } from 'rxjs/operators';
import PerfectScrollbar from 'perfect-scrollbar'; import PerfectScrollbar from 'perfect-scrollbar';
import * as _ from 'lodash'; import * as _ from 'lodash';
import { FusePerfectScrollbarGeometry, FusePerfectScrollbarPosition } from '@fuse/directives/fuse-perfect-scrollbar/fuse-perfect-scrollbar.interfaces';
import { FuseConfigService } from '@fuse/services/config.service'; import { FuseConfigService } from '@fuse/services/config.service';
@Directive({ @Directive({
selector: '[fusePerfectScrollbar]' selector: '[fusePerfectScrollbar]'
}) })
export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy export class FusePerfectScrollbarDirective implements OnInit, AfterViewInit, OnDestroy
{ {
isInitialized: boolean; isInitialized: boolean;
isMobile: boolean; isMobile: boolean;
ps: PerfectScrollbar | any; ps: PerfectScrollbar | any;
// Private // Private
private _animation: number | null;
private _enabled: boolean | ''; private _enabled: boolean | '';
private _debouncedUpdate: any; private _debouncedUpdate: any;
private _options: any; private _options: any;
@ -43,6 +44,7 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
this.isMobile = false; this.isMobile = false;
// Set the private defaults // Set the private defaults
this._animation = null;
this._enabled = false; this._enabled = false;
this._debouncedUpdate = _.debounce(this.update, 150); this._debouncedUpdate = _.debounce(this.update, 150);
this._options = { this._options = {
@ -65,6 +67,15 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
{ {
// Merge the options // Merge the options
this._options = _.merge({}, this._options, value); this._options = _.merge({}, this._options, value);
// Destroy and re-init the PerfectScrollbar to update its options
setTimeout(() => {
this._destroy();
});
setTimeout(() => {
this._init();
});
} }
get fusePerfectScrollbarOptions(): any get fusePerfectScrollbarOptions(): any
@ -120,6 +131,24 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
// @ Lifecycle hooks // @ Lifecycle hooks
// ----------------------------------------------------------------------------------------------------- // -----------------------------------------------------------------------------------------------------
/**
* On init
*/
ngOnInit(): void
{
// Subscribe to window resize event
fromEvent(window, 'resize')
.pipe(
takeUntil(this._unsubscribeAll),
debounceTime(150)
)
.subscribe(() => {
// Update the PerfectScrollbar
this.update();
});
}
/** /**
* After view init * After view init
*/ */
@ -292,6 +321,71 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
this.ngOnDestroy(); this.ngOnDestroy();
} }
/**
* Returns the geometry of the scrollable element
*
* @param prefix
*/
geometry(prefix: string = 'scroll'): FusePerfectScrollbarGeometry
{
return new FusePerfectScrollbarGeometry(
this.elementRef.nativeElement[prefix + 'Left'],
this.elementRef.nativeElement[prefix + 'Top'],
this.elementRef.nativeElement[prefix + 'Width'],
this.elementRef.nativeElement[prefix + 'Height']
);
}
/**
* Returns the position of the scrollable element
*
* @param absolute
*/
position(absolute: boolean = false): FusePerfectScrollbarPosition
{
if ( !absolute && this.ps )
{
return new FusePerfectScrollbarPosition(
this.ps.reach.x || 0,
this.ps.reach.y || 0
);
}
else
{
return new FusePerfectScrollbarPosition(
this.elementRef.nativeElement.scrollLeft,
this.elementRef.nativeElement.scrollTop
);
}
}
/**
* Scroll to
*
* @param x
* @param y
* @param speed
*/
scrollTo(x: number, y?: number, speed?: number): void
{
if ( y == null && speed == null )
{
this.animateScrolling('scrollTop', x, speed);
}
else
{
if ( x != null )
{
this.animateScrolling('scrollLeft', x, speed);
}
if ( y != null )
{
this.animateScrolling('scrollTop', y, speed);
}
}
}
/** /**
* Scroll to X * Scroll to X
* *
@ -344,9 +438,8 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
*/ */
scrollToRight(offset?: number, speed?: number): void scrollToRight(offset?: number, speed?: number): void
{ {
const width = this.elementRef.nativeElement.scrollWidth; const left = this.elementRef.nativeElement.scrollWidth - this.elementRef.nativeElement.clientWidth;
this.animateScrolling('scrollLeft', left - (offset || 0), speed);
this.animateScrolling('scrollLeft', width - (offset || 0), speed);
} }
/** /**
@ -357,27 +450,64 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
*/ */
scrollToBottom(offset?: number, speed?: number): void scrollToBottom(offset?: number, speed?: number): void
{ {
const height = this.elementRef.nativeElement.scrollHeight; const top = this.elementRef.nativeElement.scrollHeight - this.elementRef.nativeElement.clientHeight;
this.animateScrolling('scrollTop', top - (offset || 0), speed);
}
this.animateScrolling('scrollTop', height - (offset || 0), speed); /**
* Scroll to element
*
* @param qs
* @param offset
* @param speed
*/
scrollToElement(qs: string, offset?: number, speed?: number): void
{
const element = this.elementRef.nativeElement.querySelector(qs);
if ( !element )
{
return;
}
const elementPos = element.getBoundingClientRect();
const scrollerPos = this.elementRef.nativeElement.getBoundingClientRect();
if ( this.elementRef.nativeElement.classList.contains('ps--active-x') )
{
const currentPos = this.elementRef.nativeElement['scrollLeft'];
const position = elementPos.left - scrollerPos.left + currentPos;
this.animateScrolling('scrollLeft', position + (offset || 0), speed);
}
if ( this.elementRef.nativeElement.classList.contains('ps--active-y') )
{
const currentPos = this.elementRef.nativeElement['scrollTop'];
const position = elementPos.top - scrollerPos.top + currentPos;
this.animateScrolling('scrollTop', position + (offset || 0), speed);
}
} }
/** /**
* Animate scrolling * Animate scrolling
* *
* @param {string} target * @param target
* @param {number} value * @param value
* @param {number} speed * @param speed
*/ */
animateScrolling(target: string, value: number, speed?: number): void animateScrolling(target: string, value: number, speed?: number): void
{ {
if ( !speed ) if ( this._animation )
{
window.cancelAnimationFrame(this._animation);
this._animation = null;
}
if ( !speed || typeof window === 'undefined' )
{ {
this.elementRef.nativeElement[target] = value; this.elementRef.nativeElement[target] = value;
// PS has weird event sending order, this is a workaround for that
this.update();
this.update();
} }
else if ( value !== this.elementRef.nativeElement[target] ) else if ( value !== this.elementRef.nativeElement[target] )
{ {
@ -389,9 +519,8 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
const cosParameter = (oldValue - value) / 2; const cosParameter = (oldValue - value) / 2;
const step = (newTimestamp) => { const step = (newTimestamp: number) => {
scrollCount += Math.PI / (speed / (newTimestamp - oldTimestamp)); scrollCount += Math.PI / (speed / (newTimestamp - oldTimestamp));
newValue = Math.round(value + cosParameter + cosParameter * Math.cos(scrollCount)); newValue = Math.round(value + cosParameter + cosParameter * Math.cos(scrollCount));
// Only continue animation if scroll position has not changed // Only continue animation if scroll position has not changed
@ -399,20 +528,17 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
{ {
if ( scrollCount >= Math.PI ) if ( scrollCount >= Math.PI )
{ {
this.elementRef.nativeElement[target] = value; this.animateScrolling(target, value, 0);
// PS has weird event sending order, this is a workaround for that
this.update();
this.update();
} }
else else
{ {
this.elementRef.nativeElement[target] = oldValue = newValue; this.elementRef.nativeElement[target] = newValue;
// On a zoomed out page the resulting offset may differ
oldValue = this.elementRef.nativeElement[target];
oldTimestamp = newTimestamp; oldTimestamp = newTimestamp;
window.requestAnimationFrame(step); this._animation = window.requestAnimationFrame(step);
} }
} }
}; };

28
src/@fuse/directives/fuse-perfect-scrollbar/fuse-perfect-scrollbar.interfaces.ts Normal file
View File

@ -0,0 +1,28 @@
export class FusePerfectScrollbarGeometry
{
public x: number;
public y: number;
public w: number;
public h: number;
constructor(x: number, y: number, w: number, h: number)
{
this.x = x;
this.y = y;
this.w = w;
this.h = h;
}
}
export class FusePerfectScrollbarPosition
{
public x: number | 'start' | 'end';
public y: number | 'start' | 'end';
constructor(x: number | 'start' | 'end', y: number | 'start' | 'end')
{
this.x = x;
this.y = y;
}
}

38
src/@fuse/scss/partials/_colors.scss
View File

@ -47,25 +47,25 @@
// @ Material colors map // @ Material colors map
// ----------------------------------------------------------------------------------------------------- // -----------------------------------------------------------------------------------------------------
$matPalettes: ( $matPalettes: (
red: $mat-red, 'red': $mat-red,
pink: $mat-pink, 'pink': $mat-pink,
purple: $mat-purple, 'purple': $mat-purple,
deep-purple: $mat-deep-purple, 'deep-purple': $mat-deep-purple,
indigo: $mat-indigo, 'indigo': $mat-indigo,
blue: $mat-blue, 'blue': $mat-blue,
light-blue: $mat-light-blue, 'light-blue': $mat-light-blue,
cyan: $mat-cyan, 'cyan': $mat-cyan,
teal: $mat-teal, 'teal': $mat-teal,
green: $mat-green, 'green': $mat-green,
light-green: $mat-light-green, 'light-green': $mat-light-green,
lime: $mat-lime, 'lime': $mat-lime,
yellow: $mat-yellow, 'yellow': $mat-yellow,
amber: $mat-amber, 'amber': $mat-amber,
orange: $mat-orange, 'orange': $mat-orange,
deep-orange: $mat-deep-orange, 'deep-orange': $mat-deep-orange,
brown: $mat-brown, 'brown': $mat-brown,
grey: $mat-grey, 'grey': $mat-grey,
blue-grey: $mat-blue-grey 'blue-grey': $mat-blue-grey
); );
// Material color hues list // Material color hues list

1
src/@fuse/scss/partials/_page-layouts.scss
View File

@ -173,6 +173,7 @@ $carded-header-height-without-toolbar: $carded-header-height - $carded-toolbar-h
> .mat-tab-group { > .mat-tab-group {
overflow: hidden; overflow: hidden;
width: 100%;
.mat-tab-header { .mat-tab-header {

3
src/app/app.module.ts
View File

@ -4,7 +4,8 @@ import { HttpClientModule } from '@angular/common/http';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { RouterModule, Routes } from '@angular/router'; import { RouterModule, Routes } from '@angular/router';
import { MatMomentDateModule } from '@angular/material-moment-adapter'; import { MatMomentDateModule } from '@angular/material-moment-adapter';
import { MatButtonModule, MatIconModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { TranslateModule } from '@ngx-translate/core'; import { TranslateModule } from '@ngx-translate/core';
import 'hammerjs'; import 'hammerjs';

2
src/app/layout/components/footer/footer.component.html
View File

@ -6,7 +6,7 @@
target="_blank" mat-button class="pink" fxFlex="0 0 auto" fxLayout="row" target="_blank" mat-button class="pink" fxFlex="0 0 auto" fxLayout="row"
fxLayoutAlign="start center"> fxLayoutAlign="start center">
<mat-icon class="s-16 mr-sm-4">shopping_cart</mat-icon> <mat-icon class="s-16 mr-sm-4">shopping_cart</mat-icon>
<span>Purchase FUSE (Angular 7+)</span> <span>Purchase FUSE (Angular 8+)</span>
</a> </a>
<div fxLayout="row" fxLayoutAlign="start center" fxHide fxShow.gt-xs> <div fxLayout="row" fxLayoutAlign="start center" fxHide fxShow.gt-xs>

4
src/app/layout/components/footer/footer.module.ts
View File

@ -1,6 +1,8 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatButtonModule, MatIconModule, MatToolbarModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { MatToolbarModule } from '@angular/material/toolbar';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

3
src/app/layout/components/navbar/horizontal/style-1/style-1.module.ts
View File

@ -1,5 +1,6 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { MatButtonModule, MatIconModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { FuseNavigationModule } from '@fuse/components'; import { FuseNavigationModule } from '@fuse/components';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

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

@ -47,7 +47,7 @@ export class NavbarVerticalStyle1Component implements OnInit, OnDestroy
// ----------------------------------------------------------------------------------------------------- // -----------------------------------------------------------------------------------------------------
// Directive // Directive
@ViewChild(FusePerfectScrollbarDirective) @ViewChild(FusePerfectScrollbarDirective, {static: true})
set directive(theDirective: FusePerfectScrollbarDirective) set directive(theDirective: FusePerfectScrollbarDirective)
{ {
if ( !theDirective ) if ( !theDirective )
@ -75,16 +75,7 @@ export class NavbarVerticalStyle1Component implements OnInit, OnDestroy
) )
.subscribe(() => { .subscribe(() => {
setTimeout(() => { setTimeout(() => {
const activeNavItem: any = document.querySelector('navbar .nav-link.active'); this._fusePerfectScrollbar.scrollToElement('navbar .nav-link.active', -120);
if ( activeNavItem )
{
const activeItemOffsetTop = activeNavItem.offsetTop,
activeItemOffsetParentTop = activeNavItem.offsetParent.offsetTop,
scrollDistance = activeItemOffsetTop - activeItemOffsetParentTop - (48 * 3) - 168;
this._fusePerfectScrollbar.scrollToTop(scrollDistance);
}
}); });
} }
); );

3
src/app/layout/components/navbar/vertical/style-1/style-1.module.ts
View File

@ -1,5 +1,6 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { MatButtonModule, MatIconModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { FuseNavigationModule } from '@fuse/components'; import { FuseNavigationModule } from '@fuse/components';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

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

@ -47,7 +47,7 @@ export class NavbarVerticalStyle2Component implements OnInit, OnDestroy
// ----------------------------------------------------------------------------------------------------- // -----------------------------------------------------------------------------------------------------
// Directive // Directive
@ViewChild(FusePerfectScrollbarDirective) @ViewChild(FusePerfectScrollbarDirective, {static: true})
set directive(theDirective: FusePerfectScrollbarDirective) set directive(theDirective: FusePerfectScrollbarDirective)
{ {
if ( !theDirective ) if ( !theDirective )
@ -75,16 +75,7 @@ export class NavbarVerticalStyle2Component implements OnInit, OnDestroy
) )
.subscribe(() => { .subscribe(() => {
setTimeout(() => { setTimeout(() => {
const activeNavItem: any = document.querySelector('navbar .nav-link.active'); this._fusePerfectScrollbar.scrollToElement('navbar .nav-link.active', -120);
if ( activeNavItem )
{
const activeItemOffsetTop = activeNavItem.offsetTop,
activeItemOffsetParentTop = activeNavItem.offsetParent.offsetTop,
scrollDistance = activeItemOffsetTop - activeItemOffsetParentTop - (48 * 3);
this._fusePerfectScrollbar.scrollToTop(scrollDistance);
}
}); });
} }
); );

3
src/app/layout/components/navbar/vertical/style-2/style-2.module.ts
View File

@ -1,5 +1,6 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { MatButtonModule, MatIconModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { FuseNavigationModule } from '@fuse/components'; import { FuseNavigationModule } from '@fuse/components';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

4
src/app/layout/components/quick-panel/quick-panel.module.ts
View File

@ -1,5 +1,7 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { MatDividerModule, MatListModule, MatSlideToggleModule } from '@angular/material'; import { MatDividerModule } from '@angular/material/divider';
import { MatListModule } from '@angular/material/list';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

32
src/app/layout/components/toolbar/toolbar.component.ts
View File

@ -45,29 +45,29 @@ export class ToolbarComponent implements OnInit, OnDestroy
// Set the defaults // Set the defaults
this.userStatusOptions = [ this.userStatusOptions = [
{ {
'title': 'Online', title: 'Online',
'icon' : 'icon-checkbox-marked-circle', icon : 'icon-checkbox-marked-circle',
'color': '#4CAF50' color: '#4CAF50'
}, },
{ {
'title': 'Away', title: 'Away',
'icon' : 'icon-clock', icon : 'icon-clock',
'color': '#FFC107' color: '#FFC107'
}, },
{ {
'title': 'Do not Disturb', title: 'Do not Disturb',
'icon' : 'icon-minus-circle', icon : 'icon-minus-circle',
'color': '#F44336' color: '#F44336'
}, },
{ {
'title': 'Invisible', title: 'Invisible',
'icon' : 'icon-checkbox-blank-circle-outline', icon : 'icon-checkbox-blank-circle-outline',
'color': '#BDBDBD' color: '#BDBDBD'
}, },
{ {
'title': 'Offline', title: 'Offline',
'icon' : 'icon-checkbox-blank-circle-outline', icon : 'icon-checkbox-blank-circle-outline',
'color': '#616161' color: '#616161'
} }
]; ];
@ -109,7 +109,7 @@ export class ToolbarComponent implements OnInit, OnDestroy
}); });
// Set the selected language from default languages // Set the selected language from default languages
this.selectedLanguage = _.find(this.languages, {'id': this._translateService.currentLang}); this.selectedLanguage = _.find(this.languages, {id: this._translateService.currentLang});
} }
/** /**

5
src/app/layout/components/toolbar/toolbar.module.ts
View File

@ -1,6 +1,9 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { MatButtonModule, MatIconModule, MatMenuModule, MatToolbarModule } from '@angular/material'; import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatToolbarModule } from '@angular/material/toolbar';
import { FuseSearchBarModule, FuseShortcutsModule } from '@fuse/components'; import { FuseSearchBarModule, FuseShortcutsModule } from '@fuse/components';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

2
src/app/layout/horizontal/layout-1/layout-1.module.ts
View File

@ -1,5 +1,5 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { MatSidenavModule } from '@angular/material'; import { MatSidenavModule } from '@angular/material/sidenav';
import { FuseSidebarModule, FuseThemeOptionsModule } from '@fuse/components'; import { FuseSidebarModule, FuseThemeOptionsModule } from '@fuse/components';
import { FuseSharedModule } from '@fuse/shared.module'; import { FuseSharedModule } from '@fuse/shared.module';

11
src/browserslist
View File

@ -1,11 +0,0 @@
# This file is currently used by autoprefixer to adjust CSS to support the below specified browsers
# For additional information regarding the format and rule options, please see:
# https://github.com/browserslist/browserslist#queries
#
# For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed
> 0.5%
last 2 versions
Firefox ESR
not dead
not IE 9-11

2
src/index.html
View File

@ -3,7 +3,7 @@
<head> <head>
<title>Fuse - Angular 7+ Material Design Admin Template</title> <title>Fuse - Angular 8+ Material Design Admin Template</title>
<base href="/"> <base href="/">
<meta charset="utf-8"> <meta charset="utf-8">

74
src/polyfills.ts
View File

@ -18,80 +18,48 @@
* BROWSER POLYFILLS * BROWSER POLYFILLS
*/ */
/** IE9, IE10 and IE11 requires all of the following polyfills. **/
import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';
import 'core-js/es6/regexp';
import 'core-js/es6/map';
import 'core-js/es6/weak-map';
import 'core-js/es6/set';
/**
* If the application will be indexed by Google Search, the following is required.
* Googlebot uses a renderer based on Chrome 41.
* https://developers.google.com/search/docs/guides/rendering
**/
import 'core-js/es7/array';
/** IE10 and IE11 requires the following for NgClass support on SVG elements */ /** IE10 and IE11 requires the following for NgClass support on SVG elements */
import 'classlist.js'; // Run `npm install --save classlist.js`. // import 'classlist.js'; // Run `npm install --save classlist.js`.
/** IE10 and IE11 requires the following for the Reflect API. */
import 'core-js/es6/reflect';
/** Evergreen browsers require these. **/
// Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove.
import 'core-js/es7/reflect';
/** /**
* Web Animations `@angular/platform-browser/animations` * Web Animations `@angular/platform-browser/animations`
* Only required if AnimationBuilder is used within the application and using IE/Edge or Safari. * Only required if AnimationBuilder is used within the application and using IE/Edge or Safari.
* Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0). * Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0).
**/ */
import 'web-animations-js'; // Run `npm install --save web-animations-js`. import 'web-animations-js'; // Run `npm install --save web-animations-js`.
/** /**
* By default, zone.js will patch all possible macroTask and DomEvents * By default, zone.js will patch all possible macroTask and DomEvents
* user can disable parts of macroTask/DomEvents patch by setting following flags * user can disable parts of macroTask/DomEvents patch by setting following flags
* because those flags need to be set before `zone.js` being loaded, and webpack
* will put import in the top of bundle, so user need to create a separate file
* in this directory (for example: zone-flags.ts), and put the following flags
* into that file, and then add the following code before importing zone.js.
* import './zone-flags.ts';
*
* The flags allowed in zone-flags.ts are listed here.
*
* The following flags will work for all browsers.
*
* (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
* (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
* (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
*
* in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
* with the following flag, it will bypass `zone.js` patch for IE/Edge
*
* (window as any).__Zone_enable_cross_context_check = true;
*
*/ */
// (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
// (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
// (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
/*
* in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
* with the following flag, it will bypass `zone.js` patch for IE/Edge
*/
// (window as any).__Zone_enable_cross_context_check = true;
/*************************************************************************************************** /***************************************************************************************************
* Zone JS is required by default for Angular itself. * Zone JS is required by default for Angular itself.
*/ */
import 'zone.js/dist/zone'; // Included with Angular CLI. import 'zone.js/dist/zone'; // Included with Angular CLI.
/*************************************************************************************************** /***************************************************************************************************
* APPLICATION IMPORTS * APPLICATION IMPORTS
*/ */
// Add global to window, assigning the value of window itself. // Add global to window, assigning the value of window itself.
(window as any).global = window; (window as any).global = window;
/**
* Fix for ngx-chart to work on ie11
*/
if ( typeof SVGElement.prototype.contains === 'undefined' )
{
SVGElement.prototype.contains = HTMLDivElement.prototype.contains;
}

10
src/tsconfig.app.json
View File

@ -1,10 +0,0 @@
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/app"
},
"exclude": [
"test.ts",
"**/*.spec.ts"
]
}

18
src/tsconfig.spec.json
View File

@ -1,18 +0,0 @@
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/spec",
"types": [
"jasmine",
"node"
]
},
"files": [
"test.ts",
"polyfills.ts"
],
"include": [
"**/*.spec.ts",
"**/*.d.ts"
]
}

26
src/tslint.json
View File

@ -1,26 +0,0 @@
{
"extends": "../tslint.json",
"rules": {
"directive-selector": [
true,
"attribute",
[
"fuse",
""
],
"camelCase"
],
"component-selector": [
true,
"element",
[
"fuse",
""
],
[
"kebab-case",
"camelCase"
]
]
}
}

16
tsconfig.app.json Normal file
View File

@ -0,0 +1,16 @@
{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "./out-tsc/app",
"types": [
"node"
]
},
"include": [
"src/**/*.ts"
],
"exclude": [
"src/test.ts",
"src/**/*.spec.ts"
]
}

16
tsconfig.json
View File

@ -5,23 +5,23 @@
"outDir": "./dist/out-tsc", "outDir": "./dist/out-tsc",
"sourceMap": true, "sourceMap": true,
"declaration": false, "declaration": false,
"module": "es2015", "module": "esnext",
"moduleResolution": "node", "moduleResolution": "node",
"emitDecoratorMetadata": true, "emitDecoratorMetadata": true,
"experimentalDecorators": true, "experimentalDecorators": true,
"importHelpers": true, "importHelpers": true,
"paths": { "target": "es2015",
"@fuse": [
"@fuse/"
]
},
"target": "es5",
"typeRoots": [ "typeRoots": [
"node_modules/@types" "node_modules/@types"
], ],
"lib": [ "lib": [
"es2018", "es2018",
"dom" "dom"
] ],
"paths": {
"@fuse": [
"@fuse/"
]
}
} }
} }

18
tsconfig.spec.json Normal file
View File

@ -0,0 +1,18 @@
{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "./out-tsc/spec",
"types": [
"jasmine",
"node"
]
},
"files": [
"src/test.ts",
"src/polyfills.ts"
],
"include": [
"src/**/*.spec.ts",
"src/**/*.d.ts"
]
}

133
tslint.json
View File

@ -1,35 +1,48 @@
{ {
"rulesDirectory": [ "extends": "tslint:recommended",
"codelyzer"
],
"rules": { "rules": {
"arrow-return-shorthand": true, "array-type": false,
"callable-types": true, "arrow-parens": false,
"class-name": true,
"comment-format": [
true,
"check-space"
],
"curly": true,
"deprecation": { "deprecation": {
"severity": "warn" "severity": "warn"
}, },
"eofline": true, "component-class-suffix": true,
"forin": true, "contextual-lifecycle": true,
"directive-class-suffix": true,
"directive-selector": [
true,
"attribute",
[
"fuse",
""
],
"camelCase"
],
"component-selector": [
true,
"element",
"attribute",
[
"fuse",
""
],
[
"kebab-case",
"camelCase"
]
],
"import-blacklist": [ "import-blacklist": [
true, true,
"rxjs/Rx" "rxjs/Rx"
], ],
"import-spacing": true, "interface-name": false,
"indent": [ "max-classes-per-file": false,
true,
"spaces"
],
"interface-over-type-literal": true,
"label-position": true,
"max-line-length": [ "max-line-length": [
true, true,
180 {
"limit": 180,
"ignore-pattern": "^import |^export | implements"
}
], ],
"member-access": false, "member-access": false,
"member-ordering": [ "member-ordering": [
@ -43,8 +56,7 @@
] ]
} }
], ],
"no-arg": true, "no-consecutive-blank-lines": false,
"no-bitwise": true,
"no-console": [ "no-console": [
true, true,
"debug", "debug",
@ -53,78 +65,51 @@
"timeEnd", "timeEnd",
"trace" "trace"
], ],
"no-construct": true,
"no-debugger": true,
"no-duplicate-super": true,
"no-empty": false, "no-empty": false,
"no-empty-interface": true,
"no-eval": true,
"no-inferrable-types": [ "no-inferrable-types": [
true, true,
"ignore-params" "ignore-params"
], ],
"no-misused-new": true,
"no-non-null-assertion": true, "no-non-null-assertion": true,
"no-shadowed-variable": true,
"no-string-literal": false, "no-string-literal": false,
"no-string-throw": true,
"no-switch-case-fall-through": true, "no-switch-case-fall-through": true,
"no-trailing-whitespace": false, "no-trailing-whitespace": false,
"no-unnecessary-initializer": true, "no-var-requires": false,
"no-unused-expression": true, "object-literal-shorthand": false,
"no-use-before-declare": false,
"no-var-keyword": true,
"object-literal-sort-keys": false, "object-literal-sort-keys": false,
"one-line": false, "one-line": false,
"prefer-const": true, "ordered-imports": false,
"quotemark": [ "quotemark": [
true, true,
"single" "single"
], ],
"radix": true,
"semicolon": [
true,
"always"
],
"triple-equals": [
true,
"allow-null-check"
],
"typedef": [ "typedef": [
true, true,
"call-signature", "call-signature",
"property-declaration" "property-declaration"
], ],
"typedef-whitespace": [ "trailing-comma": false,
true, "no-conflicting-lifecycle": true,
{ "no-host-metadata-property": true,
"call-signature": "nospace",
"index-signature": "nospace",
"parameter": "nospace",
"property-declaration": "nospace",
"variable-declaration": "nospace"
}
],
"typeof-compare": true,
"unified-signatures": true,
"variable-name": false,
"whitespace": [
true,
"check-branch",
"check-decl",
"check-operator",
"check-separator",
"check-type"
],
"no-output-on-prefix": true,
"use-input-property-decorator": true,
"use-output-property-decorator": true,
"use-host-property-decorator": true,
"no-input-rename": true, "no-input-rename": true,
"no-inputs-metadata-property": true,
"no-output-native": true,
"no-output-on-prefix": true,
"no-output-rename": true, "no-output-rename": true,
"use-life-cycle-interface": true, "no-outputs-metadata-property": true,
"template-banana-in-box": true,
"template-no-negated-async": true,
"use-lifecycle-interface": true,
"use-pipe-transform-interface": true, "use-pipe-transform-interface": true,
"component-class-suffix": true, "variable-name": [
"directive-class-suffix": true true,
} "ban-keywords",
"check-format",
"allow-pascal-case",
"allow-leading-underscore"
]
},
"rulesDirectory": [
"codelyzer"
]
} }