Updated Angular & Angular Components to 8.0.0

Updated various other libraries to their latest versions
Updated various project files for better Angular 8 support
This commit is contained in:
sercan 2019-05-30 10:47:34 +03:00
parent bc2fc44bcf
commit f1e1ddc236
139 changed files with 11648 additions and 12564 deletions

View File

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

View File

@ -4,24 +4,24 @@
"newProjectRoot": "projects",
"projects": {
"fuse": {
"root": "",
"sourceRoot": "src",
"projectType": "application",
"prefix": "app",
"schematics": {
"@schematics/angular:component": {
"styleext": "scss"
"style": "scss"
}
},
"root": "",
"sourceRoot": "src",
"prefix": "app",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist",
"outputPath": "dist/fuse",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.app.json",
"tsConfig": "tsconfig.app.json",
"assets": [
"src/favicon.ico",
"src/assets",
@ -101,24 +101,25 @@
"options": {
"main": "src/test.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.spec.json",
"karmaConfig": "src/karma.conf.js",
"styles": [
"src/styles.scss"
],
"scripts": [],
"tsConfig": "tsconfig.spec.json",
"karmaConfig": "karma.conf.js",
"assets": [
"src/favicon.ico",
"src/assets"
]
],
"styles": [
"src/styles.scss"
],
"scripts": []
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"src/tsconfig.app.json",
"src/tsconfig.spec.json"
"tsconfig.app.json",
"tsconfig.spec.json",
"e2e/tsconfig.json"
],
"exclude": [
"**/node_modules/**",
@ -126,14 +127,7 @@
"**/src/assets/angular-material-examples/**/*"
]
}
}
}
},
"fuse-e2e": {
"root": "e2e/",
"projectType": "application",
"prefix": "",
"architect": {
},
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
@ -145,17 +139,6 @@
"devServerTarget": "fuse:serve:production"
}
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": "e2e/tsconfig.e2e.json",
"exclude": [
"**/node_modules/**",
"**/src/app/fake-db/**/*",
"**/src/assets/angular-material-examples/**/*"
]
}
}
}
}

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'.

View File

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

22316
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

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

View File

@ -52,11 +52,9 @@ export const fuseAnimations = [
trigger('fadeInOut', [
state('0, void', style({
display: 'none',
opacity: 0
})),
state('1, *', style({
display: 'block',
opacity: 1
})),
transition('1 => 0', animate('300ms ease-out')),
@ -66,12 +64,10 @@ export const fuseAnimations = [
trigger('slideInOut', [
state('0', style({
height : '0px',
display: 'none'
height: '0px'
})),
state('1', style({
height : '*',
display: 'block'
height: '*'
})),
transition('1 => 0', animate('300ms ease-out')),
transition('0 => 1', animate('300ms ease-in'))
@ -121,17 +117,15 @@ export const fuseAnimations = [
})
)
]
),
)
]),
trigger('slideInLeft', [
state('void', style({
transform: 'translateX(-100%)',
display : 'none'
})),
state('*', style({
transform: 'translateX(0)',
display : 'flex'
})),
transition('void => *', animate('300ms')),
transition('* => void', animate('300ms'))
@ -140,11 +134,9 @@ export const fuseAnimations = [
trigger('slideInRight', [
state('void', style({
transform: 'translateX(100%)',
display : 'none'
})),
state('*', style({
transform: 'translateX(0)',
display : 'flex'
})),
transition('void => *', animate('300ms')),
transition('* => void', animate('300ms'))
@ -153,11 +145,9 @@ export const fuseAnimations = [
trigger('slideInTop', [
state('void', style({
transform: 'translateY(-100%)',
display : 'none'
})),
state('*', style({
transform: 'translateY(0)',
display : 'flex'
})),
transition('void => *', animate('300ms')),
transition('* => void', animate('300ms'))
@ -167,11 +157,9 @@ export const fuseAnimations = [
state('void',
style({
transform: 'translateY(100%)',
display : 'none'
})),
state('*', style({
transform: 'translateY(0)',
display : 'flex'
})),
transition('void => *', animate('300ms')),
transition('* => void', animate('300ms'))

View File

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

View File

@ -1,5 +1,6 @@
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';

View File

@ -1,7 +1,8 @@
import { NgModule } from '@angular/core';
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 { FuseDemoSidebarComponent } from './demo-sidebar/demo-sidebar.component';

View File

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

View File

@ -1,7 +1,10 @@
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
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';

View File

@ -1,7 +1,8 @@
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
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';

View File

@ -2,7 +2,9 @@ import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
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';

View File

@ -2,7 +2,8 @@ import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
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';

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

View File

@ -2,7 +2,14 @@ import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router';
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 { FuseShortcutsComponent } from './shortcuts.component';

View File

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

View File

@ -2,9 +2,15 @@ import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { FlexLayoutModule } from '@angular/flex-layout';
import {
MatButtonModule, MatCheckboxModule, MatDividerModule, MatFormFieldModule, MatIconModule, MatOptionModule, MatRadioModule, MatSelectModule, MatSlideToggleModule
} from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatCheckboxModule } from '@angular/material/checkbox';
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 { FuseMaterialColorPickerModule } from '@fuse/components/material-color-picker/material-color-picker.module';

View File

@ -1,5 +1,5 @@
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 { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
@ -58,7 +58,7 @@ export class FuseMatSidenavHelperDirective implements OnInit, OnDestroy
// Register the sidenav to the service
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._matSidenav.mode = 'side';
@ -74,7 +74,7 @@ export class FuseMatSidenavHelperDirective implements OnInit, OnDestroy
this._fuseMatchMediaService.onMediaChange
.pipe(takeUntil(this._unsubscribeAll))
.subscribe(() => {
if ( this._mediaObserver.isActive(this.matIsLockedOpen) )
if ( this.matIsLockedOpen && this._mediaObserver.isActive(this.matIsLockedOpen) )
{
this.isLockedOpen = true;
this._matSidenav.mode = 'side';

View File

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

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 { Platform } from '@angular/cdk/platform';
import { Subject } from 'rxjs';
import { filter, takeUntil } from 'rxjs/operators';
import { fromEvent, Subject } from 'rxjs';
import { debounceTime, filter, takeUntil } from 'rxjs/operators';
import PerfectScrollbar from 'perfect-scrollbar';
import * as _ from 'lodash';
import { FusePerfectScrollbarGeometry, FusePerfectScrollbarPosition } from '@fuse/directives/fuse-perfect-scrollbar/fuse-perfect-scrollbar.interfaces';
import { FuseConfigService } from '@fuse/services/config.service';
@Directive({
selector: '[fusePerfectScrollbar]'
})
export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
export class FusePerfectScrollbarDirective implements OnInit, AfterViewInit, OnDestroy
{
isInitialized: boolean;
isMobile: boolean;
ps: PerfectScrollbar | any;
// Private
private _animation: number | null;
private _enabled: boolean | '';
private _debouncedUpdate: any;
private _options: any;
@ -43,6 +44,7 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
this.isMobile = false;
// Set the private defaults
this._animation = null;
this._enabled = false;
this._debouncedUpdate = _.debounce(this.update, 150);
this._options = {
@ -65,6 +67,15 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
{
// Merge the options
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
@ -120,6 +131,24 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
// @ 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
*/
@ -292,6 +321,71 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
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
*
@ -344,9 +438,8 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
*/
scrollToRight(offset?: number, speed?: number): void
{
const width = this.elementRef.nativeElement.scrollWidth;
this.animateScrolling('scrollLeft', width - (offset || 0), speed);
const left = this.elementRef.nativeElement.scrollWidth - this.elementRef.nativeElement.clientWidth;
this.animateScrolling('scrollLeft', left - (offset || 0), speed);
}
/**
@ -357,27 +450,64 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
*/
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
*
* @param {string} target
* @param {number} value
* @param {number} speed
* @param target
* @param value
* @param speed
*/
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;
// PS has weird event sending order, this is a workaround for that
this.update();
this.update();
}
else if ( value !== this.elementRef.nativeElement[target] )
{
@ -389,9 +519,8 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
const cosParameter = (oldValue - value) / 2;
const step = (newTimestamp) => {
const step = (newTimestamp: number) => {
scrollCount += Math.PI / (speed / (newTimestamp - oldTimestamp));
newValue = Math.round(value + cosParameter + cosParameter * Math.cos(scrollCount));
// Only continue animation if scroll position has not changed
@ -399,20 +528,17 @@ export class FusePerfectScrollbarDirective implements AfterViewInit, OnDestroy
{
if ( scrollCount >= Math.PI )
{
this.elementRef.nativeElement[target] = value;
// PS has weird event sending order, this is a workaround for that
this.update();
this.update();
this.animateScrolling(target, value, 0);
}
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;
window.requestAnimationFrame(step);
this._animation = window.requestAnimationFrame(step);
}
}
};

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;
}
}

View File

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

View File

@ -4,7 +4,8 @@ import { HttpClientModule } from '@angular/common/http';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { RouterModule, Routes } from '@angular/router';
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 { InMemoryWebApiModule } from 'angular-in-memory-web-api';
import { TranslateModule } from '@ngx-translate/core';
import 'hammerjs';

View File

@ -23,25 +23,17 @@ export class ChatPanelComponent implements OnInit, AfterViewInit, OnDestroy
sidebarFolded: boolean;
user: any;
@ViewChild('replyForm')
set replyForm(content: NgForm)
{
this._replyForm = content;
}
@ViewChild('replyForm', {static: false})
private _replyForm: NgForm;
@ViewChild('replyInput')
set replyInput(content: ElementRef)
{
this._replyInput = content;
}
@ViewChild('replyInput', {static: false})
private _replyInput: ElementRef;
@ViewChildren(FusePerfectScrollbarDirective)
private _fusePerfectScrollbarDirectives: QueryList<FusePerfectScrollbarDirective>;
// Private
private _chatViewScrollbar: FusePerfectScrollbarDirective;
private _replyForm: NgForm;
private _replyInput: ElementRef;
private _unsubscribeAll: Subject<any>;
/**

View File

@ -1,5 +1,11 @@
import { NgModule } from '@angular/core';
import { MatButtonModule, MatFormFieldModule, MatIconModule, MatInputModule, MatRippleModule, MatTabsModule, MatTooltipModule } from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatRippleModule } from '@angular/material/core';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatTabsModule } from '@angular/material/tabs';
import { MatTooltipModule } from '@angular/material/tooltip';
import { FuseSharedModule } from '@fuse/shared.module';

View File

@ -1,6 +1,8 @@
import { NgModule } from '@angular/core';
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';

View File

@ -1,5 +1,6 @@
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 { FuseSharedModule } from '@fuse/shared.module';

View File

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

View File

@ -1,5 +1,6 @@
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 { FuseSharedModule } from '@fuse/shared.module';

View File

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

View File

@ -1,5 +1,6 @@
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 { FuseSharedModule } from '@fuse/shared.module';

View File

@ -1,5 +1,7 @@
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';

View File

@ -45,29 +45,29 @@ export class ToolbarComponent implements OnInit, OnDestroy
// Set the defaults
this.userStatusOptions = [
{
'title': 'Online',
'icon' : 'icon-checkbox-marked-circle',
'color': '#4CAF50'
title: 'Online',
icon : 'icon-checkbox-marked-circle',
color: '#4CAF50'
},
{
'title': 'Away',
'icon' : 'icon-clock',
'color': '#FFC107'
title: 'Away',
icon : 'icon-clock',
color: '#FFC107'
},
{
'title': 'Do not Disturb',
'icon' : 'icon-minus-circle',
'color': '#F44336'
title: 'Do not Disturb',
icon : 'icon-minus-circle',
color: '#F44336'
},
{
'title': 'Invisible',
'icon' : 'icon-checkbox-blank-circle-outline',
'color': '#BDBDBD'
title: 'Invisible',
icon : 'icon-checkbox-blank-circle-outline',
color: '#BDBDBD'
},
{
'title': 'Offline',
'icon' : 'icon-checkbox-blank-circle-outline',
'color': '#616161'
title: 'Offline',
icon : 'icon-checkbox-blank-circle-outline',
color: '#616161'
}
];
@ -109,7 +109,7 @@ export class ToolbarComponent implements OnInit, OnDestroy
});
// 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});
}
/**

View File

@ -1,6 +1,9 @@
import { NgModule } from '@angular/core';
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 { FuseSharedModule } from '@fuse/shared.module';

View File

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

View File

@ -1,5 +1,5 @@
import { AfterViewInit, Component, ComponentFactoryResolver, ComponentRef, Input, OnDestroy, ViewChild, ViewContainerRef, ViewEncapsulation } from '@angular/core';
import { MatSnackBar } from '@angular/material';
import { MatSnackBar } from '@angular/material/snack-bar';
import 'prismjs/components/prism-scss';
import 'prismjs/components/prism-typescript';
@ -31,7 +31,7 @@ export class ExampleViewerComponent implements AfterViewInit, OnDestroy
previewRef: ComponentRef<any>;
selectedIndex: number;
@ViewChild('previewContainer', {read: ViewContainerRef})
@ViewChild('previewContainer', {read: ViewContainerRef, static: false})
private _previewContainer: ViewContainerRef;
/**

View File

@ -1,14 +1,40 @@
import { NgModule } from '@angular/core';
import {
MatAutocompleteModule, MatBadgeModule, MatBottomSheetModule, MatButtonModule,
MatButtonToggleModule, MatCardModule, MatCheckboxModule, MatChipsModule, MatDatepickerModule,
MatDialogModule, MatDividerModule, MatExpansionModule, MatFormFieldModule, MatGridListModule,
MatIconModule, MatInputModule, MatListModule, MatMenuModule, MatPaginatorModule,
MatProgressBarModule, MatProgressSpinnerModule, MatRadioModule, MatRippleModule, MatSelectModule,
MatSidenavModule, MatSliderModule, MatSlideToggleModule, MatSnackBarModule, MatSortModule,
MatStepperModule, MatTableModule, MatTabsModule, MatToolbarModule, MatTooltipModule, MatTreeModule
} from '@angular/material';
import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { MatBadgeModule } from '@angular/material/badge';
import { MatBottomSheetModule } from '@angular/material/bottom-sheet';
import { MatButtonModule } from '@angular/material/button';
import { MatButtonToggleModule } from '@angular/material/button-toggle';
import { MatCardModule } from '@angular/material/card';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatChipsModule } from '@angular/material/chips';
import { MatRippleModule } from '@angular/material/core';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatDialogModule } from '@angular/material/dialog';
import { MatDividerModule } from '@angular/material/divider';
import { MatExpansionModule } from '@angular/material/expansion';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatGridListModule } from '@angular/material/grid-list';
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 { MatPaginatorModule } from '@angular/material/paginator';
import { MatProgressBarModule } from '@angular/material/progress-bar';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { MatRadioModule } from '@angular/material/radio';
import { MatSelectModule } from '@angular/material/select';
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatSliderModule } from '@angular/material/slider';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { MatSortModule } from '@angular/material/sort';
import { MatStepperModule } from '@angular/material/stepper';
import { MatTableModule } from '@angular/material/table';
import { MatTabsModule } from '@angular/material/tabs';
import { MatToolbarModule } from '@angular/material/toolbar';
import { MatTooltipModule } from '@angular/material/tooltip';
import { MatTreeModule } from '@angular/material/tree';
import { MatMomentDateModule } from '@angular/material-moment-adapter';
@NgModule({

View File

@ -1,7 +1,11 @@
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { MatButtonModule, MatFormFieldModule, MatIconModule, MatInputModule, MatSelectModule } from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatSelectModule } from '@angular/material/select';
import { FuseSharedModule } from '@fuse/shared.module';

View File

@ -1,6 +1,6 @@
import { Component, OnInit, ViewEncapsulation } from '@angular/core';
import { FormGroup } from '@angular/forms';
import { MatDialog, MatDialogRef } from '@angular/material';
import { MatDialog, MatDialogRef } from '@angular/material/dialog';
import { Subject } from 'rxjs';
import { startOfDay, isSameDay, isSameMonth } from 'date-fns';
import { CalendarEvent, CalendarEventAction, CalendarEventTimesChangedEvent, CalendarMonthViewDay } from 'angular-calendar';

View File

@ -1,8 +1,14 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import {
MatButtonModule, MatDatepickerModule, MatDialogModule, MatFormFieldModule, MatIconModule, MatInputModule, MatSlideToggleModule, MatToolbarModule, MatTooltipModule
} from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatDialogModule } from '@angular/material/dialog';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatToolbarModule } from '@angular/material/toolbar';
import { MatTooltipModule } from '@angular/material/tooltip';
import { ColorPickerModule } from 'ngx-color-picker';
import { CalendarModule as AngularCalendarModule, DateAdapter } from 'angular-calendar';
import { adapterFactory } from 'angular-calendar/date-adapters/date-fns';

View File

@ -1,6 +1,6 @@
import { Component, Inject, ViewEncapsulation } from '@angular/core';
import { FormBuilder, FormControl, FormGroup } from '@angular/forms';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { CalendarEvent } from 'angular-calendar';
import { MatColors } from '@fuse/mat-colors';

View File

@ -22,13 +22,13 @@ export class ChatViewComponent implements OnInit, OnDestroy, AfterViewInit
replyInput: any;
selectedChat: any;
@ViewChild(FusePerfectScrollbarDirective)
@ViewChild(FusePerfectScrollbarDirective, {static: false})
directiveScroll: FusePerfectScrollbarDirective;
@ViewChildren('replyInput')
replyInputField;
@ViewChild('replyForm')
@ViewChild('replyForm', {static: false})
replyForm: NgForm;
// Private

View File

@ -1,9 +1,16 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import {
MatButtonModule, MatCardModule, MatFormFieldModule, MatIconModule, MatInputModule, MatListModule, MatMenuModule, MatRadioModule, MatSidenavModule, MatToolbarModule
} from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatCardModule } from '@angular/material/card';
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 { MatRadioModule } from '@angular/material/radio';
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatToolbarModule } from '@angular/material/toolbar';
import { FuseSharedModule } from '@fuse/shared.module';

View File

@ -1,6 +1,6 @@
import { Component, Inject, ViewEncapsulation } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { Contact } from 'app/main/apps/contacts/contact.model';

View File

@ -1,6 +1,6 @@
import { Component, OnDestroy, OnInit, TemplateRef, ViewChild, ViewEncapsulation } from '@angular/core';
import { FormGroup } from '@angular/forms';
import { MatDialog, MatDialogRef } from '@angular/material';
import { MatDialog, MatDialogRef } from '@angular/material/dialog';
import { DataSource } from '@angular/cdk/collections';
import { Observable, Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
@ -20,7 +20,7 @@ import { ContactsContactFormDialogComponent } from 'app/main/apps/contacts/conta
})
export class ContactsContactListComponent implements OnInit, OnDestroy
{
@ViewChild('dialogContent')
@ViewChild('dialogContent', {static: false})
dialogContent: TemplateRef<any>;
contacts: any;

View File

@ -1,6 +1,6 @@
import { Component, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core';
import { FormControl, FormGroup } from '@angular/forms';
import { MatDialog } from '@angular/material';
import { MatDialog } from '@angular/material/dialog';
import { Subject } from 'rxjs';
import { debounceTime, distinctUntilChanged, takeUntil } from 'rxjs/operators';

View File

@ -1,8 +1,15 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import {
MatButtonModule, MatCheckboxModule, MatDatepickerModule, MatFormFieldModule, MatIconModule, MatInputModule, MatMenuModule, MatRippleModule, MatTableModule, MatToolbarModule
} from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatRippleModule } from '@angular/material/core';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatMenuModule } from '@angular/material/menu';
import { MatTableModule } from '@angular/material/table';
import { MatToolbarModule } from '@angular/material/toolbar';
import { FuseSharedModule } from '@fuse/shared.module';
import { FuseConfirmDialogModule, FuseSidebarModule } from '@fuse/components';

View File

@ -1,5 +1,5 @@
import { Component, OnDestroy, OnInit } from '@angular/core';
import { MatDialog, MatDialogRef } from '@angular/material';
import { MatDialog, MatDialogRef } from '@angular/material/dialog';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';

View File

@ -52,8 +52,8 @@ export class AnalyticsDashboardComponent implements OnInit
*/
private _registerCustomChartJSPlugin(): void
{
(<any>window).Chart.plugins.register({
afterDatasetsDraw: function (chart, easing): any {
(window as any).Chart.plugins.register({
afterDatasetsDraw: function(chart, easing): any {
// Only activate the plugin if it's made available
// in the options
if (
@ -67,18 +67,18 @@ export class AnalyticsDashboardComponent implements OnInit
// To only draw at the end of animation, check for easing === 1
const ctx = chart.ctx;
chart.data.datasets.forEach(function (dataset, i): any {
chart.data.datasets.forEach(function(dataset, i): any {
const meta = chart.getDatasetMeta(i);
if ( !meta.hidden )
{
meta.data.forEach(function (element, index): any {
meta.data.forEach(function(element, index): any {
// Draw the text in black, with the specified font
ctx.fillStyle = 'rgba(255, 255, 255, 0.7)';
const fontSize = 13;
const fontStyle = 'normal';
const fontFamily = 'Roboto, Helvetica Neue, Arial';
ctx.font = (<any>window).Chart.helpers.fontString(fontSize, fontStyle, fontFamily);
ctx.font = (window as any).Chart.helpers.fontString(fontSize, fontStyle, fontFamily);
// Just naively convert to string for now
const dataString = dataset.data[index].toString() + 'k';

View File

@ -1,6 +1,11 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { MatButtonModule, MatFormFieldModule, MatIconModule, MatMenuModule, MatSelectModule, MatTabsModule } from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatSelectModule } from '@angular/material/select';
import { MatTabsModule } from '@angular/material/tabs';
import { AgmCoreModule } from '@agm/core';
import { ChartsModule } from 'ng2-charts';
import { NgxChartsModule } from '@swimlane/ngx-charts';

View File

@ -1,6 +1,13 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { MatButtonModule, MatDividerModule, MatFormFieldModule, MatIconModule, MatMenuModule, MatSelectModule, MatTableModule, MatTabsModule } 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 { MatMenuModule } from '@angular/material/menu';
import { MatSelectModule } from '@angular/material/select';
import { MatTableModule } from '@angular/material/table';
import { MatTabsModule } from '@angular/material/tabs';
import { NgxChartsModule } from '@swimlane/ngx-charts';
import { FuseSharedModule } from '@fuse/shared.module';

View File

@ -1,10 +1,18 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import {
MatButtonModule, MatChipsModule, MatExpansionModule, MatFormFieldModule, MatIconModule, MatInputModule, MatPaginatorModule, MatRippleModule, MatSelectModule, MatSnackBarModule,
MatSortModule,
MatTableModule, MatTabsModule
} from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatChipsModule } from '@angular/material/chips';
import { MatRippleModule } from '@angular/material/core';
import { MatExpansionModule } from '@angular/material/expansion';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatPaginatorModule } from '@angular/material/paginator';
import { MatSelectModule } from '@angular/material/select';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { MatSortModule } from '@angular/material/sort';
import { MatTableModule } from '@angular/material/table';
import { MatTabsModule } from '@angular/material/tabs';
import { NgxChartsModule } from '@swimlane/ngx-charts';
import { AgmCoreModule } from '@agm/core';

View File

@ -1,72 +1,72 @@
export const orderStatuses = [
{
'id' : 1,
'name' : 'Awaiting check payment',
'color': 'blue-500'
id : 1,
name : 'Awaiting check payment',
color: 'blue-500'
},
{
'id' : 2,
'name' : 'Payment accepted',
'color': 'green-500'
id : 2,
name : 'Payment accepted',
color: 'green-500'
},
{
'id' : 3,
'name' : 'Preparing the order',
'color': 'orange-500'
id : 3,
name : 'Preparing the order',
color: 'orange-500'
},
{
'id' : 4,
'name' : 'Shipped',
'color': 'purple-500'
id : 4,
name : 'Shipped',
color: 'purple-500'
},
{
'id' : 5,
'name' : 'Delivered',
'color': 'green-800'
id : 5,
name : 'Delivered',
color: 'green-800'
},
{
'id' : 6,
'name' : 'Canceled',
'color': 'pink-500'
id : 6,
name : 'Canceled',
color: 'pink-500'
},
{
'id' : 7,
'name' : 'Refunded',
'color': 'red-500'
id : 7,
name : 'Refunded',
color: 'red-500'
},
{
'id' : 8,
'name' : 'Payment error',
'color': 'red-900'
id : 8,
name : 'Payment error',
color: 'red-900'
},
{
'id' : 9,
'name' : 'On pre-order (paid)',
'color': 'purple-300'
id : 9,
name : 'On pre-order (paid)',
color: 'purple-300'
},
{
'id' : 10,
'name' : 'Awaiting bank wire payment',
'color': 'blue-500'
id : 10,
name : 'Awaiting bank wire payment',
color: 'blue-500'
},
{
'id' : 11,
'name' : 'Awaiting PayPal payment',
'color': 'blue-500'
id : 11,
name : 'Awaiting PayPal payment',
color: 'blue-500'
},
{
'id' : 12,
'name' : 'Remote payment accepted',
'color': 'green-500'
id : 12,
name : 'Remote payment accepted',
color: 'green-500'
},
{
'id' : 13,
'name' : 'On pre-order (not paid)',
'color': 'purple-300'
id : 13,
name : 'On pre-order (not paid)',
color: 'purple-300'
},
{
'id' : 14,
'name' : 'Awaiting Cash-on-delivery payment',
'color': 'blue-500'
id : 14,
name : 'Awaiting Cash-on-delivery payment',
color: 'blue-500'
}
];

View File

@ -1,5 +1,6 @@
import { Component, ElementRef, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
import { MatPaginator, MatSort } from '@angular/material';
import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import { DataSource } from '@angular/cdk/collections';
import { BehaviorSubject, fromEvent, merge, Observable, Subject } from 'rxjs';
import { debounceTime, distinctUntilChanged, map } from 'rxjs/operators';
@ -22,13 +23,13 @@ export class EcommerceOrdersComponent implements OnInit, OnDestroy
dataSource: FilesDataSource | null;
displayedColumns = ['id', 'reference', 'customer', 'total', 'payment', 'status', 'date'];
@ViewChild(MatPaginator)
@ViewChild(MatPaginator, {static: true})
paginator: MatPaginator;
@ViewChild('filter')
@ViewChild('filter', {static: true})
filter: ElementRef;
@ViewChild(MatSort)
@ViewChild(MatSort, {static: true})
sort: MatSort;
// Private

View File

@ -1,7 +1,7 @@
import { Component, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
import { Location } from '@angular/common';
import { MatSnackBar } from '@angular/material';
import { MatSnackBar } from '@angular/material/snack-bar';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';

View File

@ -1,4 +1,4 @@
import { MatChipInputEvent } from '@angular/material';
import { MatChipInputEvent } from '@angular/material/chips';
import { FuseUtils } from '@fuse/utils';

View File

@ -1,5 +1,6 @@
import { Component, ElementRef, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
import { MatPaginator, MatSort } from '@angular/material';
import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import { DataSource } from '@angular/cdk/collections';
import { BehaviorSubject, fromEvent, merge, Observable, Subject } from 'rxjs';
import { debounceTime, distinctUntilChanged, map } from 'rxjs/operators';
@ -22,13 +23,13 @@ export class EcommerceProductsComponent implements OnInit
dataSource: FilesDataSource | null;
displayedColumns = ['id', 'image', 'name', 'category', 'price', 'quantity', 'active'];
@ViewChild(MatPaginator)
@ViewChild(MatPaginator, {static: true})
paginator: MatPaginator;
@ViewChild(MatSort)
@ViewChild(MatSort, {static: true})
sort: MatSort;
@ViewChild('filter')
@ViewChild('filter', {static: true})
filter: ElementRef;
// Private

View File

@ -1,6 +1,10 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { MatButtonModule, MatIconModule, MatRippleModule, MatSlideToggleModule, MatTableModule } from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatRippleModule } from '@angular/material/core';
import { MatIconModule } from '@angular/material/icon';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatTableModule } from '@angular/material/table';
import { FuseSharedModule } from '@fuse/shared.module';
import { FuseSidebarModule } from '@fuse/components';

View File

@ -36,7 +36,7 @@
</div>
<div class="offline-switch">
<mat-slide-toggle ([ngModel])="selected.offline" labelPosition="before">Available Offline</mat-slide-toggle>
<mat-slide-toggle [(ngModel)]="selected.offline" labelPosition="before">Available Offline</mat-slide-toggle>
</div>
<div class="title">Info</div>

View File

@ -1,6 +1,6 @@
import { Component, Inject, ViewEncapsulation } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
@Component({
selector : 'mail-ngrx-compose',

View File

@ -1,14 +1,14 @@
export const locale = {
lang: 'en',
data: {
'MAIL': {
'COMPOSE' : 'COMPOSE',
'FOLDERS' : 'FOLDERS',
'FILTERS' : 'FILTERS',
'LABELS' : 'LABELS',
'NO_MESSAGES' : 'There are no messages!',
'SELECT_A_MESSAGE_TO_READ': 'Select a message to read',
'SEARCH_PLACEHOLDER': 'Search for an e-mail or contact'
MAIL: {
COMPOSE : 'COMPOSE',
FOLDERS : 'FOLDERS',
FILTERS : 'FILTERS',
LABELS : 'LABELS',
NO_MESSAGES : 'There are no messages!',
SELECT_A_MESSAGE_TO_READ: 'Select a message to read',
SEARCH_PLACEHOLDER: 'Search for an e-mail or contact'
}
}
};

View File

@ -1,14 +1,14 @@
export const locale = {
lang: 'tr',
data: {
'MAIL': {
'COMPOSE' : 'YENİ E-POSTA',
'FOLDERS' : 'KLASÖRLER',
'FILTERS' : 'FİLTRELER',
'LABELS' : 'ETİKETLER',
'NO_MESSAGES' : 'Mesajiniz bulunmamakta!',
'SELECT_A_MESSAGE_TO_READ': 'Okumak için bir mesaj seçin',
'SEARCH_PLACEHOLDER' : 'E-mail yada bir kişi arayın'
MAIL: {
COMPOSE : 'YENİ E-POSTA',
FOLDERS : 'KLASÖRLER',
FILTERS : 'FİLTRELER',
LABELS : 'ETİKETLER',
NO_MESSAGES : 'Mesajiniz bulunmamakta!',
SELECT_A_MESSAGE_TO_READ: 'Okumak için bir mesaj seçin',
SEARCH_PLACEHOLDER : 'E-mail yada bir kişi arayın'
}
}
};

View File

@ -51,16 +51,16 @@ mail-ngrx {
@include media-breakpoint(xs) {
mail-list {
mail-ngrx-list {
border-right: none;
}
mail-list,
mail-details {
mail-ngrx-list,
mail-ngrx-details {
flex: 1 0 100%;
}
mail-details {
mail-ngrx-details {
display: none !important;
}
@ -76,11 +76,11 @@ mail-ngrx {
.content {
mail-list {
mail-ngrx-list {
display: none !important;
}
mail-details {
mail-ngrx-details {
display: flex !important;
}
}

View File

@ -1,8 +1,15 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import {
MatButtonModule, MatCheckboxModule, MatDialogModule, MatFormFieldModule, MatIconModule, MatInputModule, MatMenuModule, MatRippleModule, MatSelectModule, MatToolbarModule
} from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatRippleModule } from '@angular/material/core';
import { MatDialogModule } from '@angular/material/dialog';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatMenuModule } from '@angular/material/menu';
import { MatSelectModule } from '@angular/material/select';
import { MatToolbarModule } from '@angular/material/toolbar';
import { TranslateModule } from '@ngx-translate/core';
import { FuseSharedModule } from '@fuse/shared.module';

View File

@ -4,7 +4,7 @@
<div class="logo" fxFlex fxLayout="row" fxLayoutAlign="start center">
<mat-icon class="logo-icon s-32">mail</mat-icon>
<span class="logo-text">Mailbox Ngrx</span>
<span class="logo-text">MailboxNgrx</span>
</div>
<div class="account" fxLayout="column">

View File

@ -1,5 +1,5 @@
import { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/core';
import { MatDialog } from '@angular/material';
import { MatDialog } from '@angular/material/dialog';
import { FormGroup } from '@angular/forms';
import { select, Store } from '@ngrx/store';
import { Observable } from 'rxjs';
@ -41,8 +41,8 @@ export class MailNgrxMainSidebarComponent
{
// Set the defaults
this.accounts = {
'creapond' : 'johndoe@creapond.com',
'withinpixels': 'johndoe@withinpixels.com'
creapond : 'johndoe@creapond.com',
withinpixels: 'johndoe@withinpixels.com'
};
this.selectedAccount = 'creapond';
this.folders$ = this._store.pipe(select(fromStore.getFoldersArr));

View File

@ -80,7 +80,7 @@ export class MailsEffect
* @type {Observable<any>}
*/
@Effect()
updateMail: Observable<MailsActions.MailsActionsAll> =
updateMail: Observable<{}> =
this.actions
.pipe(
ofType<MailsActions.UpdateMail>(MailsActions.UPDATE_MAIL),

View File

@ -1,6 +1,6 @@
import { Injectable } from '@angular/core';
import { ActivatedRouteSnapshot, CanActivate } from '@angular/router';
import { RouterStateSnapshot } from '@angular/router/src/router_state';
import { RouterStateSnapshot } from '@angular/router';
import { select, Store } from '@ngrx/store';
import { Observable, forkJoin, of } from 'rxjs';

View File

@ -1,6 +1,6 @@
import { Component, Inject, ViewEncapsulation } from '@angular/core';
import { FormControl, FormGroup } from '@angular/forms';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
@Component({
selector : 'mail-compose',

View File

@ -1,14 +1,14 @@
export const locale = {
lang: 'en',
data: {
'MAIL': {
'COMPOSE' : 'COMPOSE',
'FOLDERS' : 'FOLDERS',
'FILTERS' : 'FILTERS',
'LABELS' : 'LABELS',
'NO_MESSAGES' : 'There are no messages!',
'SELECT_A_MESSAGE_TO_READ': 'Select a message to read',
'SEARCH_PLACEHOLDER' : 'Search for an e-mail or contact'
MAIL: {
COMPOSE : 'COMPOSE',
FOLDERS : 'FOLDERS',
FILTERS : 'FILTERS',
LABELS : 'LABELS',
NO_MESSAGES : 'There are no messages!',
SELECT_A_MESSAGE_TO_READ: 'Select a message to read',
SEARCH_PLACEHOLDER : 'Search for an e-mail or contact'
}
}
};

View File

@ -1,14 +1,14 @@
export const locale = {
lang: 'tr',
data: {
'MAIL': {
'COMPOSE' : 'YENİ E-POSTA',
'FOLDERS' : 'KLASÖRLER',
'FILTERS' : 'FİLTRELER',
'LABELS' : 'ETİKETLER',
'NO_MESSAGES' : 'Mesajiniz bulunmamakta!',
'SELECT_A_MESSAGE_TO_READ': 'Okumak için bir mesaj seçin',
'SEARCH_PLACEHOLDER' : 'E-mail yada bir kişi arayın'
MAIL: {
COMPOSE : 'YENİ E-POSTA',
FOLDERS : 'KLASÖRLER',
FILTERS : 'FİLTRELER',
LABELS : 'ETİKETLER',
NO_MESSAGES : 'Mesajiniz bulunmamakta!',
SELECT_A_MESSAGE_TO_READ: 'Okumak için bir mesaj seçin',
SEARCH_PLACEHOLDER : 'E-mail yada bir kişi arayın'
}
}
};

View File

@ -1,8 +1,15 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import {
MatButtonModule, MatCheckboxModule, MatDialogModule, MatFormFieldModule, MatIconModule, MatInputModule, MatMenuModule, MatRippleModule, MatSelectModule, MatToolbarModule
} from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatRippleModule } from '@angular/material/core';
import { MatDialogModule } from '@angular/material/dialog';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatMenuModule } from '@angular/material/menu';
import { MatSelectModule } from '@angular/material/select';
import { MatToolbarModule } from '@angular/material/toolbar';
import { TranslateModule } from '@ngx-translate/core';
import { FuseSharedModule } from '@fuse/shared.module';

View File

@ -1,6 +1,6 @@
import { Component, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core';
import { FormGroup } from '@angular/forms';
import { MatDialog } from '@angular/material';
import { MatDialog } from '@angular/material/dialog';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
@ -41,8 +41,8 @@ export class MailMainSidebarComponent implements OnInit, OnDestroy
{
// Set the defaults
this.accounts = {
'creapond' : 'johndoe@creapond.com',
'withinpixels': 'johndoe@withinpixels.com'
creapond : 'johndoe@creapond.com',
withinpixels: 'johndoe@withinpixels.com'
};
this.selectedAccount = 'creapond';

View File

@ -5,19 +5,19 @@ import { Card } from './card.model';
const sampleLabels = [
{
'id' : '56027e4119ad3a5dc28b36cd',
'name' : 'Design',
'color': 'red-500'
id : '56027e4119ad3a5dc28b36cd',
name : 'Design',
color: 'red-500'
},
{
'id' : '5640635e19ad3a5dc21416b2',
'name' : 'App',
'color': 'blue-500'
id : '5640635e19ad3a5dc21416b2',
name : 'App',
color: 'blue-500'
},
{
'id' : '6540635g19ad3s5dc31412b2',
'name' : 'Feature',
'color': 'green-400'
id : '6540635g19ad3s5dc31412b2',
name : 'Feature',
color: 'green-400'
}
];

View File

@ -15,7 +15,7 @@ export class ScrumboardBoardAddListComponent
@Output()
listAdded: EventEmitter<any>;
@ViewChild('nameInput')
@ViewChild('nameInput', {static: false})
nameInputField;
/**

View File

@ -1,6 +1,7 @@
import { Component, Inject, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
import { NgForm } from '@angular/forms/src/forms';
import { MAT_DIALOG_DATA, MatDialog, MatDialogRef, MatMenuTrigger } from '@angular/material';
import { NgForm } from '@angular/forms';
import { MAT_DIALOG_DATA, MatDialog, MatDialogRef } from '@angular/material/dialog';
import { MatMenuTrigger } from '@angular/material/menu';
import { Subject } from 'rxjs';
import { FuseConfirmDialogComponent } from '@fuse/components/confirm-dialog/confirm-dialog.component';
@ -24,10 +25,10 @@ export class ScrumboardCardDialogComponent implements OnInit, OnDestroy
toggleInArray = FuseUtils.toggleInArray;
confirmDialogRef: MatDialogRef<FuseConfirmDialogComponent>;
@ViewChild('checklistMenuTrigger')
@ViewChild('checklistMenuTrigger', {static: false})
checklistMenu: MatMenuTrigger;
@ViewChild('newCheckListTitleField')
@ViewChild('newCheckListTitleField', {static: false})
newCheckListTitleField;
// Private
@ -222,8 +223,8 @@ export class ScrumboardCardDialogComponent implements OnInit, OnDestroy
}
const newCheckItem = {
'name' : checkItemVal,
'checked': false
name : checkItemVal,
checked: false
};
checkList.checkItems.push(newCheckItem);

View File

@ -45,9 +45,9 @@ export class ScrumboardLabelSelectorComponent implements OnInit, OnDestroy
this.cardLabelsChanged = new EventEmitter();
this.labelsMenuView = 'labels';
this.newLabel = {
'id' : '',
'name' : '',
'color': 'blue-400'
id : '',
name : '',
color: 'blue-400'
};
this.toggleInArray = FuseUtils.toggleInArray;

View File

@ -18,7 +18,7 @@ export class ScrumboardEditBoardNameComponent
@Output()
boardNameChanged: EventEmitter<any>;
@ViewChild('nameInput')
@ViewChild('nameInput', {static: false})
nameInputField;
constructor(

View File

@ -15,7 +15,7 @@ export class ScrumboardBoardAddCardComponent
@Output()
cardAdded: EventEmitter<any>;
@ViewChild('nameInput')
@ViewChild('nameInput', {static: false})
nameInputField;
/**

View File

@ -18,7 +18,7 @@ export class ScrumboardBoardEditListNameComponent
@Output()
listNameChanged: EventEmitter<any>;
@ViewChild('nameInput')
@ViewChild('nameInput', {static: false})
nameInputField;
/**

View File

@ -1,6 +1,6 @@
import { Component, Input, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { MatDialog, MatDialogRef } from '@angular/material';
import { MatDialog, MatDialogRef } from '@angular/material/dialog';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
@ -25,7 +25,7 @@ export class ScrumboardBoardListComponent implements OnInit, OnDestroy
@Input()
list;
@ViewChild(FusePerfectScrollbarDirective)
@ViewChild(FusePerfectScrollbarDirective, {static: false})
listScroll: FusePerfectScrollbarDirective;
confirmDialogRef: MatDialogRef<FuseConfirmDialogComponent>;

View File

@ -1,9 +1,20 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import {
MatButtonModule, MatCheckboxModule, MatChipsModule, MatDatepickerModule, MatDialogModule, MatFormFieldModule, MatIconModule, MatInputModule, MatListModule, MatMenuModule,
MatProgressBarModule, MatRippleModule, MatSidenavModule, MatToolbarModule, MatTooltipModule
} from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatChipsModule } from '@angular/material/chips';
import { MatRippleModule } from '@angular/material/core';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatDialogModule } from '@angular/material/dialog';
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 { MatProgressBarModule } from '@angular/material/progress-bar';
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatToolbarModule } from '@angular/material/toolbar';
import { MatTooltipModule } from '@angular/material/tooltip';
import { NgxDnDModule } from '@swimlane/ngx-dnd';
import { FuseSharedModule } from '@fuse/shared.module';

View File

@ -38,8 +38,8 @@ export class TodoMainSidebarComponent implements OnInit, OnDestroy
{
// Set the defaults
this.accounts = {
'creapond' : 'johndoe@creapond.com',
'withinpixels': 'johndoe@withinpixels.com'
creapond : 'johndoe@creapond.com',
withinpixels: 'johndoe@withinpixels.com'
};
this.selectedAccount = 'creapond';

View File

@ -23,7 +23,7 @@ export class TodoDetailsComponent implements OnInit, OnDestroy
formType: string;
todoForm: FormGroup;
@ViewChild('titleInput')
@ViewChild('titleInput', {static: false})
titleInputField;
// Private
@ -128,16 +128,16 @@ export class TodoDetailsComponent implements OnInit, OnDestroy
createTodoForm(): FormGroup
{
return this._formBuilder.group({
'id' : [this.todo.id],
'title' : [this.todo.title],
'notes' : [this.todo.notes],
'startDate': [this.todo.startDate],
'dueDate' : [this.todo.dueDate],
'completed': [this.todo.completed],
'starred' : [this.todo.starred],
'important': [this.todo.important],
'deleted' : [this.todo.deleted],
'tags' : [this.todo.tags]
id : [this.todo.id],
title : [this.todo.title],
notes : [this.todo.notes],
startDate: [this.todo.startDate],
dueDate : [this.todo.dueDate],
completed: [this.todo.completed],
starred : [this.todo.starred],
important: [this.todo.important],
deleted : [this.todo.deleted],
tags : [this.todo.tags]
});
}

View File

@ -1,8 +1,14 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import {
MatButtonModule, MatCheckboxModule, MatDatepickerModule, MatFormFieldModule, MatIconModule, MatInputModule, MatMenuModule, MatRippleModule, MatSelectModule
} from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatRippleModule } from '@angular/material/core';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatMenuModule } from '@angular/material/menu';
import { MatSelectModule } from '@angular/material/select';
import { NgxDnDModule } from '@swimlane/ngx-dnd';
import { FuseSharedModule } from '@fuse/shared.module';

View File

@ -19,6 +19,40 @@
<div class="changelog">
<!-- --------------------------------------------------------------------------------------------- -->
<!-- @ v8.0.0 -->
<!-- --------------------------------------------------------------------------------------------- -->
<div class="entry">
<div class="title">
<span class="version">v8.0.0</span>
<span class="date">TBA</span>
</div>
<div class="groups">
<div class="new">
<span class="title">New</span>
<ul>
<li>Updated Angular to 8.0.0</li>
<li>Updated Angular Material to 8.0.0</li>
<li>Updated various other packages to latest versions</li>
<li>Updated various AngularCLI related files</li>
<li>Updated various project related files</li>
</ul>
</div>
<div class="fixed">
<span class="title">Fixed</span>
<ul>
<li>(Mail Ngrx) Responsive styles</li>
</ul>
</div>
</div>
</div>
<!-- --------------------------------------------------------------------------------------------- -->
<!-- @ v7.1.0 -->
<!-- --------------------------------------------------------------------------------------------- -->

View File

@ -1,6 +1,8 @@
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { MatButtonModule, MatCheckboxModule, MatIconModule } from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon';
import { NgxDatatableModule } from '@swimlane/ngx-datatable';
import { FuseSharedModule } from '@fuse/shared.module';

View File

@ -1,7 +1,8 @@
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { MatButtonModule, MatIconModule } from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { AgmCoreModule } from '@agm/core';

View File

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

View File

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

View File

@ -1,7 +1,7 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { MatIconModule } from '@angular/material';
import { MatIconModule } from '@angular/material/icon';
import { FuseSharedModule } from '@fuse/shared.module';

View File

@ -1,6 +1,6 @@
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { MatIconModule } from '@angular/material';
import { MatIconModule } from '@angular/material/icon';
import { FuseSharedModule } from '@fuse/shared.module';
import { FuseHighlightModule } from '@fuse/components';

View File

@ -1,6 +1,6 @@
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { MatIconModule } from '@angular/material';
import { MatIconModule } from '@angular/material/icon';
import { FuseSharedModule } from '@fuse/shared.module';
import { FuseHighlightModule } from '@fuse/components/index';

View File

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

View File

@ -1,6 +1,9 @@
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { MatButtonModule, MatFormFieldModule, MatIconModule, MatInputModule } from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { FuseSharedModule } from '@fuse/shared.module';

View File

@ -1,6 +1,9 @@
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { MatButtonModule, MatFormFieldModule, MatIconModule, MatInputModule } from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { FuseSharedModule } from '@fuse/shared.module';

View File

@ -1,6 +1,9 @@
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { MatButtonModule, MatFormFieldModule, MatIconModule, MatInputModule } from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { FuseSharedModule } from '@fuse/shared.module';

View File

@ -1,6 +1,10 @@
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { MatButtonModule, MatCheckboxModule, MatFormFieldModule, MatIconModule, MatInputModule } from '@angular/material';
import { MatButtonModule } from '@angular/material/button';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { FuseSharedModule } from '@fuse/shared.module';

Some files were not shown because too many files have changed in this diff Show More