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

Improving the codebase (99% completed)

Browse Source 
Updated Angular, Angular Material and couple other packages
This commit is contained in:
Sercan Yemen 2018-05-23 12:35:08 +03:00
parent 742da904da
commit 07341c5ffa
101 changed files with 1564 additions and 827 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
angular.json
View File

@ -104,7 +104,7 @@
],
"exclude": [
"**/node_modules/**",
"**/src/app/fuse-fake-db/**/*",
"**/src/app/fake-db/**/*",
"**/src/assets/angular-material-examples/**/*"
]
}
@ -128,7 +128,7 @@
"tsConfig": "e2e/tsconfig.e2e.json",
"exclude": [
"**/node_modules/**",
"**/src/app/fuse-fake-db/**/*",
"**/src/app/fake-db/**/*",
"**/src/assets/angular-material-examples/**/*"
]
}

645
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

48
package.json
View File

@ -19,26 +19,26 @@
"private": true,
"dependencies": {
"@agm/core": "1.0.0-beta.2",
"@angular/animations": "6.0.1",
"@angular/cdk": "6.0.2",
"@angular/common": "6.0.1",
"@angular/compiler": "6.0.1",
"@angular/core": "6.0.1",
"@angular/animations": "6.0.3",
"@angular/cdk": "6.1.0",
"@angular/common": "6.0.3",
"@angular/compiler": "6.0.3",
"@angular/core": "6.0.3",
"@angular/flex-layout": "6.0.0-beta.15",
"@angular/forms": "6.0.1",
"@angular/http": "6.0.1",
"@angular/material": "6.0.2",
"@angular/material-moment-adapter": "6.0.2",
"@angular/platform-browser": "6.0.1",
"@angular/platform-browser-dynamic": "6.0.1",
"@angular/router": "6.0.1",
"@angular/forms": "6.0.3",
"@angular/http": "6.0.3",
"@angular/material": "6.1.0",
"@angular/material-moment-adapter": "6.1.0",
"@angular/platform-browser": "6.0.3",
"@angular/platform-browser-dynamic": "6.0.3",
"@angular/router": "6.0.3",
"@ngrx/effects": "6.0.0-beta.3",
"@ngrx/router-store": "6.0.0-beta.3",
"@ngrx/store": "6.0.0-beta.3",
"@ngrx/store-devtools": "6.0.0-beta.3",
"@ngx-translate/core": "10.0.1",
"@swimlane/ngx-charts": "8.0.0",
"@swimlane/ngx-datatable": "12.0.0",
"@ngx-translate/core": "10.0.2",
"@swimlane/ngx-charts": "8.0.1",
"@swimlane/ngx-datatable": "13.0.0",
"@swimlane/ngx-dnd": "4.0.1",
"@types/prismjs": "1.9.0",
"angular-calendar": "0.25.2",
@ -51,32 +51,32 @@
"lodash": "4.17.10",
"moment": "2.22.1",
"ng2-charts": "1.6.0",
"ngrx-store-freeze": "0.2.2",
"ngx-color-picker": "6.1.0",
"ngrx-store-freeze": "0.2.3",
"ngx-color-picker": "6.2.0",
"ngx-cookie-service": "1.0.10",
"perfect-scrollbar": "1.3.0",
"prismjs": "1.14.0",
"rxjs": "6.1.0",
"rxjs": "6.2.0",
"rxjs-compat": "6.1.0",
"web-animations-js": "2.3.1",
"zone.js": "0.8.26"
},
"devDependencies": {
"@angular/cli": "6.0.1",
"@angular/compiler-cli": "6.0.1",
"@angular/language-service": "6.0.1",
"@angular-devkit/build-angular": "0.6.1",
"@angular/cli": "6.0.3",
"@angular/compiler-cli": "6.0.3",
"@angular/language-service": "6.0.3",
"@angular-devkit/build-angular": "0.6.3",
"@angularclass/hmr": "2.1.3",
"@types/jasmine": "2.8.7",
"@types/jasminewd2": "2.0.3",
"@types/lodash": "4.14.108",
"@types/lodash": "4.14.109",
"@types/node": "8.9.5",
"codelyzer": "4.2.1",
"jasmine-core": "2.99.1",
"jasmine-spec-reporter": "4.2.1",
"karma": "1.7.1",
"karma-chrome-launcher": "2.2.0",
"karma-coverage-istanbul-reporter": "1.4.2",
"karma-coverage-istanbul-reporter": "1.4.3",
"karma-jasmine": "1.1.2",
"karma-jasmine-html-reporter": "0.2.2",
"protractor": "5.3.2",

141
src/@fuse/components/material-color-picker/material-color-picker.component.ts
View File

@ -13,22 +13,78 @@ import { MatColors } from '@fuse/mat-colors';
export class FuseMaterialColorPickerComponent implements OnChanges
{
colors: any;
selectedColor: any;
hues: string[];
view = 'palettes';
selectedColor: any;
view: string;
@Input() selectedPalette = '';
@Input() selectedHue = '';
@Input() selectedFg = '';
@Input() value: any;
@Output() onValueChange = new EventEmitter();
@Output() selectedPaletteChange = new EventEmitter();
@Output() selectedHueChange = new EventEmitter();
@Output() selectedClassChange = new EventEmitter();
@Output() selectedBgChange = new EventEmitter();
@Output() selectedFgChange = new EventEmitter();
@Input()
selectedPalette: string;
_selectedClass = '';
@Input()
selectedHue: string;
@Input()
selectedFg: string;
@Input()
value: any;
@Output()
onValueChange: EventEmitter<any>;
@Output()
selectedPaletteChange: EventEmitter<any>;
@Output()
selectedHueChange: EventEmitter<any>;
@Output()
selectedClassChange: EventEmitter<any>;
@Output()
selectedBgChange: EventEmitter<any>;
@Output()
selectedFgChange: EventEmitter<any>;
// Private
_selectedClass: string;
_selectedBg: string;
/**
* Constructor
*/
constructor()
{
// Set the defaults
this.colors = MatColors.all;
this.hues = ['50', '100', '200', '300', '400', '500', '600', '700', '800', '900', 'A100', 'A200', 'A400', 'A700'];
this.selectedFg = '';
this.selectedHue = '';
this.selectedPalette = '';
this.view = 'palettes';
this.onValueChange = new EventEmitter();
this.selectedPaletteChange = new EventEmitter();
this.selectedHueChange = new EventEmitter();
this.selectedClassChange = new EventEmitter();
this.selectedBgChange = new EventEmitter();
this.selectedFgChange = new EventEmitter();
// Set the private defaults
this._selectedClass = '';
this._selectedBg = '';
}
// -----------------------------------------------------------------------------------------------------
// @ Accessors
// -----------------------------------------------------------------------------------------------------
/**
* Selected class
*
* @param value
*/
@Input()
set selectedClass(value)
{
@ -54,7 +110,11 @@ export class FuseMaterialColorPickerComponent implements OnChanges
return this._selectedClass;
}
_selectedBg = '';
/**
* Selected bg
*
* @param value
*/
@Input()
set selectedBg(value)
{
@ -86,13 +146,16 @@ export class FuseMaterialColorPickerComponent implements OnChanges
return this._selectedBg;
}
constructor()
{
this.colors = MatColors.all;
this.hues = ['50', '100', '200', '300', '400', '500', '600', '700', '800', '900', 'A100', 'A200', 'A400', 'A700'];
}
// -----------------------------------------------------------------------------------------------------
// @ Lifecycle hooks
// -----------------------------------------------------------------------------------------------------
ngOnChanges(changes: any)
/**
* On changes
*
* @param changes
*/
ngOnChanges(changes: any): void
{
if ( changes.selectedBg && changes.selectedBg.currentValue === '' ||
changes.selectedClass && changes.selectedClass.currentValue === '' ||
@ -107,20 +170,37 @@ export class FuseMaterialColorPickerComponent implements OnChanges
}
}
selectPalette(palette)
// -----------------------------------------------------------------------------------------------------
// @ Public methods
// -----------------------------------------------------------------------------------------------------
/**
* Select palette
*
* @param palette
*/
selectPalette(palette): void
{
this.selectedPalette = palette;
this.updateSelectedColor();
this.view = 'hues';
}
selectHue(hue)
/**
* Select hue
*
* @param hue
*/
selectHue(hue): void
{
this.selectedHue = hue;
this.updateSelectedColor();
}
removeColor()
/**
* Remove color
*/
removeColor(): void
{
this.selectedPalette = '';
this.selectedHue = '';
@ -128,7 +208,10 @@ export class FuseMaterialColorPickerComponent implements OnChanges
this.view = 'palettes';
}
updateSelectedColor()
/**
* Update selected color
*/
updateSelectedColor(): void
{
setTimeout(() => {
@ -168,12 +251,18 @@ export class FuseMaterialColorPickerComponent implements OnChanges
});
}
backToPaletteSelection()
/**
* Go back to palette selection
*/
backToPaletteSelection(): void
{
this.view = 'palettes';
}
onMenuOpen()
/**
* On menu open
*/
onMenuOpen(): void
{
if ( this.selectedPalette === '' )
{

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

@ -1,7 +1,6 @@
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FlexLayoutModule } from '@angular/flex-layout';
import { MatButtonModule, MatIconModule, MatMenuModule, MatRippleModule } from '@angular/material';
import { FusePipesModule } from '@fuse/pipes/pipes.module';

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

@ -1,8 +1,8 @@
import { Component, ElementRef, Input, OnDestroy, OnInit, Renderer2, ViewChild } from '@angular/core';
import { ObservableMedia } from '@angular/flex-layout';
import { Subject, Subscription } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { CookieService } from 'ngx-cookie-service';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { FuseMatchMediaService } from '@fuse/services/match-media.service';
import { FuseNavigationService } from '@fuse/components/navigation/navigation.service';
@ -68,6 +68,7 @@ export class FuseShortcutsComponent implements OnInit, OnDestroy
{
// Subscribe to config changes
this._fuseConfigService.config
.pipe(takeUntil(this._unsubscribeAll))
.subscribe(
(config) => {
this.toolbarColor = config.colorClasses.toolbar;

2
src/@fuse/scss/partials/_print.scss
View File

@ -34,7 +34,7 @@
}
/* General styles */
fuse-root {
app {
fuse-navbar-vertical,
fuse-navbar-horizontal,

2
src/app/app.component.ts
View File

@ -10,7 +10,7 @@ import { locale as navigationEnglish } from 'app/navigation/i18n/en';
import { locale as navigationTurkish } from 'app/navigation/i18n/tr';
@Component({
selector : 'fuse-root',
selector : 'app',
templateUrl: './app.component.html',
styleUrls : ['./app.component.scss']
})

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

@ -13,7 +13,7 @@ import { FuseSharedModule } from '@fuse/shared.module';
import { fuseConfig } from 'app/fuse-config';
import { FuseFakeDbService } from 'app/fuse-fake-db/fuse-fake-db.service';
import { FakeDbService } from 'app/fake-db/fake-db.service';
import { AppComponent } from 'app/app.component';
import { AppStoreModule } from 'app/store/store.module';
import { LayoutModule } from 'app/layout/layout.module';
@ -29,7 +29,7 @@ const appRoutes: Routes = [
},
{
path : 'ui',
loadChildren: './main/ui/ui.module#FuseUIModule'
loadChildren: './main/ui/ui.module#UIModule'
},
{
path : 'services',
@ -60,7 +60,7 @@ const appRoutes: Routes = [
RouterModule.forRoot(appRoutes),
TranslateModule.forRoot(),
InMemoryWebApiModule.forRoot(FuseFakeDbService, {
InMemoryWebApiModule.forRoot(FakeDbService, {
delay : 0,
passThruUnknownUrl: true
}),

0
src/app/fuse-fake-db/academy.ts → src/app/fake-db/academy.ts
View File

0
src/app/fuse-fake-db/calendar.ts → src/app/fake-db/calendar.ts
View File

0
src/app/fuse-fake-db/chat.ts → src/app/fake-db/chat.ts
View File

0
src/app/fuse-fake-db/contacts.ts → src/app/fake-db/contacts.ts
View File

0
src/app/fuse-fake-db/dashboard-analytics.ts → src/app/fake-db/dashboard-analytics.ts
View File

0
src/app/fuse-fake-db/dashboard-project.ts → src/app/fake-db/dashboard-project.ts
View File

0
src/app/fuse-fake-db/e-commerce.ts → src/app/fake-db/e-commerce.ts
View File

40
src/app/fuse-fake-db/fuse-fake-db.service.ts → src/app/fake-db/fake-db.service.ts
View File

@ -1,27 +1,27 @@
import { InMemoryDbService } from 'angular-in-memory-web-api';
import { ProjectDashboardDb } from './dashboard-project';
import { AnalyticsDashboardDb } from './dashboard-analytics';
import { CalendarFakeDb } from './calendar';
import { ECommerceFakeDb } from './e-commerce';
import { AcademyFakeDb } from './academy';
import { MailFakeDb } from './mail';
import { ChatFakeDb } from './chat';
import { FileManagerFakeDb } from './file-manager';
import { ContactsFakeDb } from './contacts';
import { TodoFakeDb } from './todo';
import { ScrumboardFakeDb } from './scrumboard';
import { InvoiceFakeDb } from './invoice';
import { ProfileFakeDb } from './profile';
import { SearchFakeDb } from './search';
import { FaqFakeDb } from './faq';
import { KnowledgeBaseFakeDb } from './knowledge-base';
import { IconsFakeDb } from './icons';
import { QuickPanelFakeDb } from './quick-panel';
import { ProjectDashboardDb } from 'app/fake-db/dashboard-project';
import { AnalyticsDashboardDb } from 'app/fake-db/dashboard-analytics';
import { CalendarFakeDb } from 'app/fake-db/calendar';
import { ECommerceFakeDb } from 'app/fake-db/e-commerce';
import { AcademyFakeDb } from 'app/fake-db/academy';
import { MailFakeDb } from 'app/fake-db/mail';
import { ChatFakeDb } from 'app/fake-db/chat';
import { FileManagerFakeDb } from 'app/fake-db/file-manager';
import { ContactsFakeDb } from 'app/fake-db/contacts';
import { TodoFakeDb } from 'app/fake-db/todo';
import { ScrumboardFakeDb } from 'app/fake-db/scrumboard';
import { InvoiceFakeDb } from 'app/fake-db/invoice';
import { ProfileFakeDb } from 'app/fake-db/profile';
import { SearchFakeDb } from 'app/fake-db/search';
import { FaqFakeDb } from 'app/fake-db/faq';
import { KnowledgeBaseFakeDb } from 'app/fake-db/knowledge-base';
import { IconsFakeDb } from 'app/fake-db/icons';
import { QuickPanelFakeDb } from 'app/fake-db/quick-panel';
export class FuseFakeDbService implements InMemoryDbService
export class FakeDbService implements InMemoryDbService
{
createDb()
createDb(): any
{
return {
// Dashboards

0
src/app/fuse-fake-db/faq.ts → src/app/fake-db/faq.ts
View File

0
src/app/fuse-fake-db/file-manager.ts → src/app/fake-db/file-manager.ts
View File

0
src/app/fuse-fake-db/icons.ts → src/app/fake-db/icons.ts
View File

0
src/app/fuse-fake-db/invoice.ts → src/app/fake-db/invoice.ts
View File

0
src/app/fuse-fake-db/knowledge-base.ts → src/app/fake-db/knowledge-base.ts
View File

0
src/app/fuse-fake-db/mail.ts → src/app/fake-db/mail.ts
View File

0
src/app/fuse-fake-db/profile.ts → src/app/fake-db/profile.ts
View File

0
src/app/fuse-fake-db/quick-panel.ts → src/app/fake-db/quick-panel.ts
View File

0
src/app/fuse-fake-db/scrumboard.ts → src/app/fake-db/scrumboard.ts
View File

0
src/app/fuse-fake-db/search.ts → src/app/fake-db/search.ts
View File

0
src/app/fuse-fake-db/todo.ts → src/app/fake-db/todo.ts
View File

6
src/app/main/apps/apps.module.ts
View File

@ -18,7 +18,7 @@ const routes = [
},
{
path : 'mail-ngrx',
loadChildren: './mail-ngrx/mail.module#FuseMailNgrxModule'
loadChildren: './mail-ngrx/mail.module#MailNgrxModule'
},
{
path : 'chat',
@ -38,7 +38,7 @@ const routes = [
},
{
path : 'todo',
loadChildren: './todo/todo.module#FuseTodoModule'
loadChildren: './todo/todo.module#TodoModule'
},
{
path : 'file-manager',
@ -50,7 +50,7 @@ const routes = [
},
{
path : 'scrumboard',
loadChildren: './scrumboard/scrumboard.module#FuseScrumboardModule'
loadChildren: './scrumboard/scrumboard.module#ScrumboardModule'
}
];

2
src/app/main/apps/mail-ngrx/mail.module.ts
View File

@ -88,6 +88,6 @@ const routes: Routes = [
],
entryComponents: [MailNgrxComposeDialogComponent]
})
export class FuseMailNgrxModule
export class MailNgrxModule
{
}

2
src/app/main/apps/scrumboard/scrumboard.module.ts
View File

@ -87,6 +87,6 @@ const routes: Routes = [
],
entryComponents: [ScrumboardCardDialogComponent]
})
export class FuseScrumboardModule
export class ScrumboardModule
{
}

2
src/app/main/apps/todo/todo.module.ts
View File

@ -91,6 +91,6 @@ const routes: Routes = [
TodoService
]
})
export class FuseTodoModule
export class TodoModule
{
}

8
src/app/main/components-third-party/components-third-party.module.ts vendored
View File

@ -6,18 +6,18 @@ import { NgxDatatableModule } from '@swimlane/ngx-datatable';
import { FuseSharedModule } from '@fuse/shared.module';
import { GoogleMapsModule } from 'app/main/components-third-party/google-maps/google-maps.module';
import { FuseNgxDatatableComponent } from 'app/main/components-third-party/datatable/ngx-datatable.component';
import { NgxDatatableDocsComponent } from 'app/main/components-third-party/datatable/ngx-datatable.component';
const routes = [
{
path : 'datatables/ngx-datatable',
component: FuseNgxDatatableComponent
component: NgxDatatableDocsComponent
}
];
@NgModule({
declarations: [
FuseNgxDatatableComponent
NgxDatatableDocsComponent
],
imports : [
RouterModule.forChild(routes),
@ -31,7 +31,7 @@ const routes = [
FuseSharedModule,
GoogleMapsModule
],
]
})
export class ComponentsThirdPartyModule
{

52
src/app/main/components-third-party/datatable/ngx-datatable.component.ts vendored
View File

@ -1,27 +1,63 @@
import { Component, OnInit } from '@angular/core';
import { Component, OnDestroy, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
@Component({
selector : 'fuse-ngx-datatable',
selector : 'ngx-datatable-docs',
templateUrl: './ngx-datatable.component.html',
styleUrls : ['./ngx-datatable.component.scss']
})
export class FuseNgxDatatableComponent implements OnInit
export class NgxDatatableDocsComponent implements OnInit, OnDestroy
{
rows: any[];
loadingIndicator = true;
reorderable = true;
loadingIndicator: boolean;
reorderable: boolean;
constructor(private http: HttpClient)
// Private
private _unsubscribeAll: Subject<any>;
/**
* Constructor
*
* @param {HttpClient} _httpClient
*/
constructor(
private _httpClient: HttpClient
)
{
// Set the defaults
this.loadingIndicator = true;
this.reorderable = true;
// Set the private defaults
this._unsubscribeAll = new Subject();
}
ngOnInit()
// -----------------------------------------------------------------------------------------------------
// @ Lifecycle hooks
// -----------------------------------------------------------------------------------------------------
/**
* On init
*/
ngOnInit(): void
{
this.http.get('api/contacts-contacts')
this._httpClient.get('api/contacts-contacts')
.pipe(takeUntil(this._unsubscribeAll))
.subscribe((contacts: any) => {
this.rows = contacts;
this.loadingIndicator = false;
});
}
/**
* On destroy
*/
ngOnDestroy(): void
{
// Unsubscribe from all subscriptions
this._unsubscribeAll.next();
this._unsubscribeAll.complete();
}
}

15
src/app/main/components-third-party/google-maps/google-maps.component.ts vendored
View File

@ -1,17 +1,22 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-google-maps-docs',
selector : 'google-maps-docs',
templateUrl: './google-maps.component.html',
styleUrls : ['./google-maps.component.scss']
})
export class FuseGoogleMapsDocsComponent
export class GoogleMapsDocsComponent
{
lat = -34.397;
lng = 150.644;
lat: number;
lng: number;
/**
* Constructor
*/
constructor()
{
// Set the defaults
this.lat = -34.397;
this.lng = 150.644;
}
}

6
src/app/main/components-third-party/google-maps/google-maps.module.ts vendored
View File

@ -8,18 +8,18 @@ import { AgmCoreModule } from '@agm/core';
import { FuseSharedModule } from '@fuse/shared.module';
import { FuseHighlightModule } from '@fuse/components';
import { FuseGoogleMapsDocsComponent } from './google-maps.component';
import { GoogleMapsDocsComponent } from './google-maps.component';
const routes = [
{
path : 'google-maps',
component: FuseGoogleMapsDocsComponent
component: GoogleMapsDocsComponent
}
];
@NgModule({
declarations: [
FuseGoogleMapsDocsComponent
GoogleMapsDocsComponent
],
imports : [
RouterModule.forChild(routes),

2
src/app/main/components/angular-material/angular-material.component.html
View File

@ -24,7 +24,7 @@
<!-- CONTENT -->
<div class="content p-24">
<div *ngFor="let example of examples">
<fuse-example-viewer [example]="example"></fuse-example-viewer>
<example-viewer [example]="example"></example-viewer>
</div>
</div>
</div>

41
src/app/main/components/angular-material/angular-material.component.ts
View File

@ -1,33 +1,60 @@
import { Component, OnInit } from '@angular/core';
import { Component, OnDestroy, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { COMPONENT_MAP } from './example-components';
import { COMPONENT_MAP } from 'app/main/components/angular-material/example-components';
@Component({
selector : 'fuse-angular-material',
selector : 'angular-material',
templateUrl: './angular-material.component.html',
styleUrls : ['./angular-material.component.scss']
})
export class FuseAngularMaterialComponent implements OnInit
export class AngularMaterialComponent implements OnInit, OnDestroy
{
id: string;
title: string;
examples: any;
// Private
private _unsubscribeAll: Subject<any>;
/**
* Constructor
*
* @param {ActivatedRoute} _activatedRoute
*/
constructor(
private route: ActivatedRoute
private _activatedRoute: ActivatedRoute
)
{
// Set the private defaults
this._unsubscribeAll = new Subject();
}
ngOnInit()
/**
* On init
*/
ngOnInit(): void
{
this.route.params.subscribe(params => {
this._activatedRoute.params
.pipe(takeUntil(this._unsubscribeAll))
.subscribe(params => {
this.id = params['id'];
const _title = this.id.replace('-', ' ');
this.title = _title.charAt(0).toUpperCase() + _title.substring(1);
this.examples = COMPONENT_MAP[this.id];
});
}
/**
* On destroy
*/
ngOnDestroy(): void
{
// Unsubscribe from all subscriptions
this._unsubscribeAll.next();
this._unsubscribeAll.complete();
}
}

12
src/app/main/components/angular-material/angular-material.module.ts
View File

@ -7,8 +7,8 @@ import { FuseWidgetModule } from '@fuse/components/widget/widget.module';
import { MaterialModule } from 'app/main/components/angular-material/material.module';
import { EXAMPLE_LIST } from 'app/main/components/angular-material/example-components';
import { FuseAngularMaterialComponent } from 'app/main/components/angular-material/angular-material.component';
import { FuseExampleViewerComponent } from 'app/main/components/angular-material/example-viewer/example-viewer';
import { AngularMaterialComponent } from 'app/main/components/angular-material/angular-material.component';
import { ExampleViewerComponent } from 'app/main/components/angular-material/example-viewer/example-viewer';
const routes: Routes = [
{
@ -16,7 +16,7 @@ const routes: Routes = [
children: [
{
path : ':id',
component: FuseAngularMaterialComponent
component: AngularMaterialComponent
}
]
}
@ -25,8 +25,8 @@ const routes: Routes = [
@NgModule({
declarations : [
[...EXAMPLE_LIST],
FuseAngularMaterialComponent,
FuseExampleViewerComponent
AngularMaterialComponent,
ExampleViewerComponent
],
imports : [
RouterModule.forChild(routes),
@ -39,7 +39,7 @@ const routes: Routes = [
],
entryComponents: EXAMPLE_LIST,
})
export class FuseAngularMaterialModule
export class AngularMaterialModule
{
}

2
src/app/main/components/angular-material/example-viewer/example-viewer.scss
View File

@ -1,6 +1,6 @@
@import "src/@fuse/scss/fuse";
fuse-example-viewer {
example-viewer {
display: block;
padding: 24px 0;

148
src/app/main/components/angular-material/example-viewer/example-viewer.ts
View File

@ -1,14 +1,13 @@
import { AfterViewInit, Component, ComponentFactoryResolver, ComponentRef, Input, OnDestroy, ViewChild, ViewContainerRef, ViewEncapsulation } from '@angular/core';
import { MatSnackBar } from '@angular/material';
import 'prismjs/components/prism-scss';
import 'prismjs/components/prism-typescript';
import { EXAMPLE_COMPONENTS } from '../example-components';
import { fuseAnimations } from '@fuse/animations';
import { FuseCopierService } from '@fuse/services/copier.service';
import { EXAMPLE_COMPONENTS } from 'app/main/components/angular-material/example-components';
export interface LiveExample
{
title: string;
@ -18,65 +17,65 @@ export interface LiveExample
}
@Component({
selector : 'fuse-example-viewer',
selector : 'example-viewer',
templateUrl : './example-viewer.html',
styleUrls : ['./example-viewer.scss'],
encapsulation: ViewEncapsulation.None,
animations : fuseAnimations
})
export class FuseExampleViewerComponent implements AfterViewInit, OnDestroy
export class ExampleViewerComponent implements AfterViewInit, OnDestroy
{
_example: string;
exampleData: LiveExample;
showSource: boolean;
previewRef: ComponentRef<any>;
selectedIndex = 0;
selectedIndex: number;
@ViewChild('previewContainer', {read: ViewContainerRef})
private _previewContainer: ViewContainerRef;
/**
* Constructor
*
* @param {MatSnackBar} _matSnackBar
* @param {FuseCopierService} _fuseCopierService
* @param {ComponentFactoryResolver} _componentFactoryResolver
*/
constructor(
private _matSnackBar: MatSnackBar,
private _fuseCopierService: FuseCopierService,
private _componentFactoryResolver: ComponentFactoryResolver
)
{
// Set the defaults
this.selectedIndex = 0;
this.showSource = false;
}
// -----------------------------------------------------------------------------------------------------
// @ Accessors
// -----------------------------------------------------------------------------------------------------
/**
* Container
*
* @param {ViewContainerRef} value
*/
set container(value: ViewContainerRef)
{
this._previewContainer = value;
}
get container(): ViewContainerRef
{
return this._previewContainer;
}
set container(value: ViewContainerRef)
{
this._previewContainer = value;
}
@ViewChild('previewContainer', {read: ViewContainerRef}) private _previewContainer: ViewContainerRef;
/** String key of the currently displayed example. */
_example: string;
exampleData: LiveExample;
/** Whether the source for the example is being displayed. */
showSource = false;
constructor(
private snackbar: MatSnackBar,
private copier: FuseCopierService,
private _resolver: ComponentFactoryResolver
)
{
}
ngAfterViewInit()
{
setTimeout(() => {
const cmpFactory = this._resolver.resolveComponentFactory(this.exampleData.component);
this.previewRef = this._previewContainer.createComponent(cmpFactory);
}, 0);
}
ngOnDestroy()
{
if ( this.previewRef )
{
this.previewRef.destroy();
}
}
get example()
{
return this._example;
}
/**
* Example
*
* @param {string} example
*/
@Input()
set example(example: string)
{
@ -91,20 +90,63 @@ export class FuseExampleViewerComponent implements AfterViewInit, OnDestroy
}
}
get example(): string
{
return this._example;
}
// -----------------------------------------------------------------------------------------------------
// @ Lifecycle hooks
// -----------------------------------------------------------------------------------------------------
/**
* After view init
*/
ngAfterViewInit(): void
{
setTimeout(() => {
const cmpFactory = this._componentFactoryResolver.resolveComponentFactory(this.exampleData.component);
this.previewRef = this._previewContainer.createComponent(cmpFactory);
}, 0);
}
/**
* On destroy
*/
ngOnDestroy(): void
{
if ( this.previewRef )
{
this.previewRef.destroy();
}
}
// -----------------------------------------------------------------------------------------------------
// @ Public methods
// -----------------------------------------------------------------------------------------------------
/**
* Toggle source view
*/
toggleSourceView(): void
{
this.showSource = !this.showSource;
}
copySource(text: string)
/**
* Copy the source
*
* @param {string} text
*/
copySource(text: string): void
{
if ( this.copier.copyText(text) )
if ( this._fuseCopierService.copyText(text) )
{
this.snackbar.open('Code copied', '', {duration: 2500});
this._matSnackBar.open('Code copied', '', {duration: 2500});
}
else
{
this.snackbar.open('Copy failed. Please try again!', '', {duration: 2500});
this._matSnackBar.open('Copy failed. Please try again!', '', {duration: 2500});
}
}
}

47
src/app/main/components/cards/cards.component.ts
View File

@ -4,23 +4,29 @@ import * as shape from 'd3-shape';
import { fuseAnimations } from '@fuse/animations';
@Component({
selector : 'fuse-cards-docs',
selector : 'cards-docs',
templateUrl: './cards.component.html',
styleUrls : ['./cards.component.scss'],
animations : fuseAnimations
})
export class FuseCardsDocsComponent
export class CardsDocsComponent
{
view = 'preview';
view: string;
card9Expanded: boolean;
card10Expanded: boolean;
card19: any;
card24: any;
card25: any;
card26: any;
// Card 9
card9Expanded = false;
constructor()
{
// Set the defaults
this.view = 'preview';
// Card 10
card10Expanded = false;
// Card 19
card19 = {
this.card9Expanded = false;
this.card10Expanded = false;
this.card19 = {
scheme: {
domain: ['#5c84f1']
},
@ -62,8 +68,7 @@ export class FuseCardsDocsComponent
curve : shape.curveBasis
};
// Card 24
card24 = {
this.card24 = {
scheme : {
domain: ['#4867d2', '#5c84f1', '#89a9f4']
},
@ -86,8 +91,7 @@ export class FuseCardsDocsComponent
]
};
// Card 25
card25 = {
this.card25 = {
scheme: {
domain: ['#5c84f1']
},
@ -123,8 +127,7 @@ export class FuseCardsDocsComponent
]
};
// Card 26
card26 = {
this.card26 = {
scheme: {
domain: ['#5c84f1']
},
@ -198,12 +201,16 @@ export class FuseCardsDocsComponent
curve : shape.curveBasis
};
constructor()
{
}
toggleView()
// -----------------------------------------------------------------------------------------------------
// @ Public methods
// -----------------------------------------------------------------------------------------------------
/**
* Toggle the view
*/
toggleView(): void
{
if ( this.view === 'preview' )
{

62
src/app/main/components/components.module.ts
View File

@ -4,73 +4,74 @@ import { MatButtonModule, MatButtonToggleModule, MatFormFieldModule, MatIconModu
import { NgxChartsModule } from '@swimlane/ngx-charts';
import { FuseSharedModule } from '@fuse/shared.module';
import { FuseCountdownModule, FuseHighlightModule, FuseMaterialColorPickerModule, FuseWidgetModule } from '@fuse/components';
import { FuseCardsDocsComponent } from 'app/main/components/cards/cards.component';
import { FuseCountdownDocsComponent } from 'app/main/components/countdown/countdown.component';
import { FuseHighlightDocsComponent } from 'app/main/components/highlight/highlight.component';
import { FuseMaterialColorPickerDocsComponent } from 'app/main/components/material-color-picker/material-color-picker.component';
import { FuseMultiLanguageDocsComponent } from 'app/main/components/multi-language/multi-language.component';
import { FuseNavigationDocsComponent } from 'app/main/components/navigation/navigation.component';
import { FuseSearchBarDocsComponent } from 'app/main/components/search-bar/search-bar.component';
import { FuseSidebarDocsComponent } from 'app/main/components/sidebar/sidebar.component';
import { FuseShortcutsDocsComponent } from 'app/main/components/shortcuts/shortcuts.component';
import { FuseWidgetDocsComponent } from 'app/main/components/widget/widget.component';
import { CardsDocsComponent } from 'app/main/components/cards/cards.component';
import { CountdownDocsComponent } from 'app/main/components/countdown/countdown.component';
import { HighlightDocsComponent } from 'app/main/components/highlight/highlight.component';
import { MaterialColorPickerDocsComponent } from 'app/main/components/material-color-picker/material-color-picker.component';
import { MultiLanguageDocsComponent } from 'app/main/components/multi-language/multi-language.component';
import { NavigationDocsComponent } from 'app/main/components/navigation/navigation.component';
import { SearchBarDocsComponent } from 'app/main/components/search-bar/search-bar.component';
import { SidebarDocsComponent } from 'app/main/components/sidebar/sidebar.component';
import { ShortcutsDocsComponent } from 'app/main/components/shortcuts/shortcuts.component';
import { WidgetDocsComponent } from 'app/main/components/widget/widget.component';
const routes = [
{
path : 'cards',
component: FuseCardsDocsComponent
component: CardsDocsComponent
},
{
path : 'countdown',
component: FuseCountdownDocsComponent
component: CountdownDocsComponent
},
{
path : 'highlight',
component: FuseHighlightDocsComponent
component: HighlightDocsComponent
},
{
path : 'material-color-picker',
component: FuseMaterialColorPickerDocsComponent
component: MaterialColorPickerDocsComponent
},
{
path : 'multi-language',
component: FuseMultiLanguageDocsComponent
component: MultiLanguageDocsComponent
},
{
path : 'navigation',
component: FuseNavigationDocsComponent
component: NavigationDocsComponent
},
{
path : 'search-bar',
component: FuseSearchBarDocsComponent
component: SearchBarDocsComponent
},
{
path : 'sidebar',
component: FuseSidebarDocsComponent
component: SidebarDocsComponent
},
{
path : 'shortcuts',
component: FuseShortcutsDocsComponent
component: ShortcutsDocsComponent
},
{
path : 'widget',
component: FuseWidgetDocsComponent
component: WidgetDocsComponent
}
];
@NgModule({
declarations: [
FuseCardsDocsComponent,
FuseCountdownDocsComponent,
FuseHighlightDocsComponent,
FuseMaterialColorPickerDocsComponent,
FuseMultiLanguageDocsComponent,
FuseNavigationDocsComponent,
FuseSearchBarDocsComponent,
FuseSidebarDocsComponent,
FuseShortcutsDocsComponent,
FuseWidgetDocsComponent
CardsDocsComponent,
CountdownDocsComponent,
HighlightDocsComponent,
MaterialColorPickerDocsComponent,
MultiLanguageDocsComponent,
NavigationDocsComponent,
SearchBarDocsComponent,
SidebarDocsComponent,
ShortcutsDocsComponent,
WidgetDocsComponent
],
imports : [
RouterModule.forChild(routes),
@ -88,6 +89,7 @@ const routes = [
NgxChartsModule,
FuseSharedModule,
FuseCountdownModule,
FuseHighlightModule,
FuseMaterialColorPickerModule,

7
src/app/main/components/countdown/countdown.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-countdown-docs',
selector : 'countdown-docs',
templateUrl: './countdown.component.html',
styleUrls : ['./countdown.component.scss']
})
export class FuseCountdownDocsComponent
export class CountdownDocsComponent
{
/**
* Constructor
*/
constructor()
{

7
src/app/main/components/highlight/highlight.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-highlight-docs',
selector : 'highlight-docs',
templateUrl: './highlight.component.html',
styleUrls : ['./highlight.component.scss']
})
export class FuseHighlightDocsComponent
export class HighlightDocsComponent
{
/**
* Constructor
*/
constructor()
{

7
src/app/main/components/material-color-picker/material-color-picker.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-material-color-picker-docs',
selector : 'material-color-picker-docs',
templateUrl: './material-color-picker.component.html',
styleUrls : ['./material-color-picker.component.scss']
})
export class FuseMaterialColorPickerDocsComponent
export class MaterialColorPickerDocsComponent
{
/**
* Constructor
*/
constructor()
{

2
src/app/main/components/multi-language/multi-language.component.html
View File

@ -86,7 +86,7 @@
import { locale as turkish } from './i18n/tr';
@Component({
selector : 'fuse-mail',
selector : 'mail',
templateUrl: './mail.component.html',
styleUrls : ['./mail.component.scss']
})

7
src/app/main/components/multi-language/multi-language.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-multi-language-docs',
selector : 'multi-language-docs',
templateUrl: './multi-language.component.html',
styleUrls : ['./multi-language.component.scss']
})
export class FuseMultiLanguageDocsComponent
export class MultiLanguageDocsComponent
{
/**
* Constructor
*/
constructor()
{
}

35
src/app/main/components/navigation/navigation.component.ts
View File

@ -3,21 +3,33 @@ import { Component } from '@angular/core';
import { navigation } from 'app/navigation/navigation';
@Component({
selector : 'fuse-navigation-docs',
selector : 'navigation-docs',
templateUrl: './navigation.component.html',
styleUrls : ['./navigation.component.scss']
})
export class FuseNavigationDocsComponent
export class NavigationDocsComponent
{
navigation: any;
hidden = false;
hidden: boolean;
/**
* Constructor
*/
constructor()
{
// Set the defaults
this.navigation = navigation;
this.hidden = false;
}
showHideCalendarMenuItem()
// -----------------------------------------------------------------------------------------------------
// @ Public methods
// -----------------------------------------------------------------------------------------------------
/**
* Show/hide calendar menu item
*/
showHideCalendarMenuItem(): void
{
// Get the calendar item from the navigation
const calendarNavItem = this.navigation[0].children[1];
@ -27,7 +39,10 @@ export class FuseNavigationDocsComponent
calendarNavItem.hidden = this.hidden;
}
updateMailBadge()
/**
* Update mail badge
*/
updateMailBadge(): void
{
// Get the mail nav item
const mailNavItem = this.navigation[0].children[4];
@ -36,7 +51,10 @@ export class FuseNavigationDocsComponent
mailNavItem.badge.title = 35;
}
addSubitemToCalendar()
/**
* Add subitem to the calendar
*/
addSubitemToCalendar(): void
{
// Prepare the new nav item
const newNavItem = {
@ -59,7 +77,10 @@ export class FuseNavigationDocsComponent
calendarNavItem.children.push(newNavItem);
}
addNavItemWithCustomFunction()
/**
* Add a nav item with custom function
*/
addNavItemWithCustomFunction(): void
{
// Prepare the new nav item
const newNavItem = {

7
src/app/main/components/search-bar/search-bar.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-search-bar-docs',
selector : 'search-bar-docs',
templateUrl: './search-bar.component.html',
styleUrls : ['./search-bar.component.scss']
})
export class FuseSearchBarDocsComponent
export class SearchBarDocsComponent
{
/**
* Constructor
*/
constructor()
{

7
src/app/main/components/shortcuts/shortcuts.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-shortcuts-docs',
selector : 'shortcuts-docs',
templateUrl: './shortcuts.component.html',
styleUrls : ['./shortcuts.component.scss']
})
export class FuseShortcutsDocsComponent
export class ShortcutsDocsComponent
{
/**
* Constructor
*/
constructor()
{

7
src/app/main/components/sidebar/sidebar.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-sidebar-docs',
selector : 'sidebar-docs',
templateUrl: './sidebar.component.html',
styleUrls : ['./sidebar.component.scss']
})
export class FuseSidebarDocsComponent
export class SidebarDocsComponent
{
/**
* Constructor
*/
constructor()
{
}

7
src/app/main/components/widget/widget.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-widget-docs',
selector : 'widget-docs',
templateUrl: './widget.component.html',
styleUrls : ['./widget.component.scss']
})
export class FuseWidgetDocsComponent
export class WidgetDocsComponent
{
/**
* Constructor
*/
constructor()
{

2
src/app/main/pages/authentication/mail-confirm/mail-confirm.component.ts
View File

@ -4,7 +4,7 @@ import { FuseConfigService } from '@fuse/services/config.service';
import { fuseAnimations } from '@fuse/animations';
@Component({
selector : 'fuse-mail-confirm',
selector : 'mail-confirm',
templateUrl: './mail-confirm.component.html',
styleUrls : ['./mail-confirm.component.scss'],
animations : fuseAnimations

2
src/app/main/pages/errors/404/error-404.component.ts
View File

@ -3,7 +3,7 @@ import { Component } from '@angular/core';
import { FuseConfigService } from '@fuse/services/config.service';
@Component({
selector : 'fuse-error-404',
selector : 'error-404',
templateUrl: './error-404.component.html',
styleUrls : ['./error-404.component.scss']
})

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

@ -27,7 +27,7 @@
<mat-tab-group dynamicHeight="true">
<mat-tab label="Timeline">
<fuse-profile-timeline></fuse-profile-timeline>
<profile-timeline></profile-timeline>
</mat-tab>
<mat-tab label="About">

4
src/app/main/pages/profile/profile.module.ts
View File

@ -6,7 +6,7 @@ import { FuseSharedModule } from '@fuse/shared.module';
import { ProfileService } from 'app/main/pages/profile/profile.service';
import { ProfileComponent } from 'app/main/pages/profile/profile.component';
import { FuseProfileTimelineComponent } from 'app/main/pages/profile/tabs/timeline/timeline.component';
import { ProfileTimelineComponent } from 'app/main/pages/profile/tabs/timeline/timeline.component';
import { ProfileAboutComponent } from 'app/main/pages/profile/tabs/about/about.component';
import { ProfilePhotosVideosComponent } from 'app/main/pages/profile/tabs/photos-videos/photos-videos.component';
@ -24,7 +24,7 @@ const routes = [
@NgModule({
declarations: [
ProfileComponent,
FuseProfileTimelineComponent,
ProfileTimelineComponent,
ProfileAboutComponent,
ProfilePhotosVideosComponent
],

4
src/app/main/pages/profile/tabs/timeline/timeline.component.ts
View File

@ -7,12 +7,12 @@ import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
@Component({
selector : 'fuse-profile-timeline',
selector : 'profile-timeline',
templateUrl: './timeline.component.html',
styleUrls : ['./timeline.component.scss'],
animations : fuseAnimations
})
export class FuseProfileTimelineComponent implements OnInit, OnDestroy
export class ProfileTimelineComponent implements OnInit, OnDestroy
{
timeline: any;

7
src/app/main/services/config/config.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-config-service-docs',
selector : 'config-service-docs',
templateUrl: './config.component.html',
styleUrls : ['./config.component.scss']
})
export class FuseConfigServiceDocsComponent
export class ConfigServiceDocsComponent
{
/**
* Constructor
*/
constructor()
{

12
src/app/main/services/services.module.ts
View File

@ -5,24 +5,24 @@ import { MatIconModule } from '@angular/material';
import { FuseSharedModule } from '@fuse/shared.module';
import { FuseHighlightModule } from '@fuse/components';
import { FuseConfigServiceDocsComponent } from 'app/main/services/config/config.component';
import { FuseSplashScreenServiceDocsComponent } from 'app/main/services/splash-screen/splash-screen.component';
import { ConfigServiceDocsComponent } from 'app/main/services/config/config.component';
import { SplashScreenServiceDocsComponent } from 'app/main/services/splash-screen/splash-screen.component';
const routes = [
{
path : 'config',
component: FuseConfigServiceDocsComponent
component: ConfigServiceDocsComponent
},
{
path : 'splash-screen',
component: FuseSplashScreenServiceDocsComponent
component: SplashScreenServiceDocsComponent
}
];
@NgModule({
declarations: [
FuseConfigServiceDocsComponent,
FuseSplashScreenServiceDocsComponent
ConfigServiceDocsComponent,
SplashScreenServiceDocsComponent
],
imports : [
RouterModule.forChild(routes),

7
src/app/main/services/splash-screen/splash-screen.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-splash-screen-service-docs',
selector : 'splash-screen-service-docs',
templateUrl: './splash-screen.component.html',
styleUrls : ['./splash-screen.component.scss']
})
export class FuseSplashScreenServiceDocsComponent
export class SplashScreenServiceDocsComponent
{
/**
* Constructor
*/
constructor()
{

31
src/app/main/ui/colors/colors.component.ts
View File

@ -3,28 +3,47 @@ import { Component, OnInit } from '@angular/core';
import { MatColors } from '@fuse/mat-colors';
@Component({
selector : 'fuse-colors',
selector : 'colors',
templateUrl: './colors.component.html',
styleUrls : ['./colors.component.scss']
})
export class FuseColorsComponent
export class ColorsComponent
{
colors: {};
selectedColor: string;
selectedColorDefaultValue: string;
/**
* Constructor
*/
constructor()
{
// Set the defaults
this.colors = MatColors.all;
this.updateSelectedColor('primary');
this._updateSelectedColor('primary');
}
selectColor(selected)
// -----------------------------------------------------------------------------------------------------
// @ Public methods
// -----------------------------------------------------------------------------------------------------
/**
* Select color
*
* @param selected
*/
selectColor(selected): void
{
this.updateSelectedColor(selected.tab.textLabel);
this._updateSelectedColor(selected.tab.textLabel);
}
private updateSelectedColor(colorName)
/**
* Update selected color
*
* @param colorName
* @private
*/
private _updateSelectedColor(colorName): void
{
this.selectedColor = colorName;
this.selectedColorDefaultValue = MatColors.getColor(this.selectedColor)[500];

7
src/app/main/ui/colors/colors.module.ts
View File

@ -1,23 +1,22 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { MatButtonModule, MatIconModule, MatTabsModule } from '@angular/material';
import { FuseSharedModule } from '@fuse/shared.module';
import { FuseDemoModule } from '@fuse/components/demo/demo.module';
import { FuseColorsComponent } from './colors.component';
import { ColorsComponent } from 'app/main/ui/colors/colors.component';
const routes: Routes = [
{
path : 'colors',
component: FuseColorsComponent
component: ColorsComponent
}
];
@NgModule({
declarations: [
FuseColorsComponent
ColorsComponent
],
imports : [
RouterModule.forChild(routes),

103
src/app/main/ui/forms/forms.component.ts
View File

@ -1,12 +1,14 @@
import { Component, OnInit } from '@angular/core';
import { Component, OnDestroy, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
@Component({
selector : 'fuse-forms',
selector : 'forms',
templateUrl: './forms.component.html',
styleUrls : ['./forms.component.scss']
})
export class FuseFormsComponent implements OnInit
export class FormsComponent implements OnInit, OnDestroy
{
form: FormGroup;
formErrors: any;
@ -27,7 +29,17 @@ export class FuseFormsComponent implements OnInit
verticalStepperStep2Errors: any;
verticalStepperStep3Errors: any;
constructor(private formBuilder: FormBuilder)
// Private
private _unsubscribeAll: Subject<any>;
/**
* Constructor
*
* @param {FormBuilder} _formBuilder
*/
constructor(
private _formBuilder: FormBuilder
)
{
// Reactive form errors
this.formErrors = {
@ -73,12 +85,22 @@ export class FuseFormsComponent implements OnInit
state : {},
postalCode: {}
};
// Set the private defaults
this._unsubscribeAll = new Subject();
}
ngOnInit()
// -----------------------------------------------------------------------------------------------------
// @ Lifecycle hooks
// -----------------------------------------------------------------------------------------------------
/**
* On init
*/
ngOnInit(): void
{
// Reactive Form
this.form = this.formBuilder.group({
this.form = this._formBuilder.group({
company : [
{
value : 'Google',
@ -95,68 +117,99 @@ export class FuseFormsComponent implements OnInit
country : ['', Validators.required]
});
this.form.valueChanges.subscribe(() => {
this.form.valueChanges
.pipe(takeUntil(this._unsubscribeAll))
.subscribe(() => {
this.onFormValuesChanged();
});
// Horizontal Stepper form steps
this.horizontalStepperStep1 = this.formBuilder.group({
this.horizontalStepperStep1 = this._formBuilder.group({
firstName: ['', Validators.required],
lastName : ['', Validators.required]
});
this.horizontalStepperStep2 = this.formBuilder.group({
this.horizontalStepperStep2 = this._formBuilder.group({
address: ['', Validators.required]
});
this.horizontalStepperStep3 = this.formBuilder.group({
this.horizontalStepperStep3 = this._formBuilder.group({
city : ['', Validators.required],
state : ['', Validators.required],
postalCode: ['', [Validators.required, Validators.maxLength(5)]]
});
this.horizontalStepperStep1.valueChanges.subscribe(() => {
this.horizontalStepperStep1.valueChanges
.pipe(takeUntil(this._unsubscribeAll))
.subscribe(() => {
this.onFormValuesChanged();
});
this.horizontalStepperStep2.valueChanges.subscribe(() => {
this.horizontalStepperStep2.valueChanges
.pipe(takeUntil(this._unsubscribeAll))
.subscribe(() => {
this.onFormValuesChanged();
});
this.horizontalStepperStep3.valueChanges.subscribe(() => {
this.horizontalStepperStep3.valueChanges
.pipe(takeUntil(this._unsubscribeAll))
.subscribe(() => {
this.onFormValuesChanged();
});
// Vertical Stepper form stepper
this.verticalStepperStep1 = this.formBuilder.group({
this.verticalStepperStep1 = this._formBuilder.group({
firstName: ['', Validators.required],
lastName : ['', Validators.required]
});
this.verticalStepperStep2 = this.formBuilder.group({
this.verticalStepperStep2 = this._formBuilder.group({
address: ['', Validators.required]
});
this.verticalStepperStep3 = this.formBuilder.group({
this.verticalStepperStep3 = this._formBuilder.group({
city : ['', Validators.required],
state : ['', Validators.required],
postalCode: ['', [Validators.required, Validators.maxLength(5)]]
});
this.verticalStepperStep1.valueChanges.subscribe(() => {
this.verticalStepperStep1.valueChanges
.pipe(takeUntil(this._unsubscribeAll))
.subscribe(() => {
this.onFormValuesChanged();
});
this.verticalStepperStep2.valueChanges.subscribe(() => {
this.verticalStepperStep2.valueChanges
.pipe(takeUntil(this._unsubscribeAll))
.subscribe(() => {
this.onFormValuesChanged();
});
this.verticalStepperStep3.valueChanges.subscribe(() => {
this.verticalStepperStep3.valueChanges
.pipe(takeUntil(this._unsubscribeAll))
.subscribe(() => {
this.onFormValuesChanged();
});
}
onFormValuesChanged()
/**
* On destroy
*/
ngOnDestroy(): void
{
// Unsubscribe from all subscriptions
this._unsubscribeAll.next();
this._unsubscribeAll.complete();
}
// -----------------------------------------------------------------------------------------------------
// @ Public methods
// -----------------------------------------------------------------------------------------------------
/**
* On form values changed
*/
onFormValuesChanged(): void
{
for ( const field in this.formErrors )
{
@ -178,12 +231,18 @@ export class FuseFormsComponent implements OnInit
}
}
finishHorizontalStepper()
/**
* Finish the horizontal stepper
*/
finishHorizontalStepper(): void
{
alert('You have finished the horizontal stepper!');
}
finishVerticalStepper()
/**
* Finish the vertical stepper
*/
finishVerticalStepper(): void
{
alert('You have finished the vertical stepper!');
}

7
src/app/main/ui/forms/forms.module.ts
View File

@ -1,22 +1,21 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { MatButtonModule, MatFormFieldModule, MatIconModule, MatInputModule, MatSelectModule, MatStepperModule } from '@angular/material';
import { FuseSharedModule } from '@fuse/shared.module';
import { FuseFormsComponent } from './forms.component';
import { FormsComponent } from 'app/main/ui/forms/forms.component';
const routes: Routes = [
{
path : 'forms',
component: FuseFormsComponent
component: FormsComponent
}
];
@NgModule({
declarations: [
FuseFormsComponent
FormsComponent
],
imports : [
RouterModule.forChild(routes),

4
src/app/main/ui/helper-classes/helper-classes.component.html
View File

@ -20,13 +20,13 @@
<mat-tab label="Padding & Margin Helpers">
<fuse-helper-classes-padding-margin></fuse-helper-classes-padding-margin>
<helper-classes-padding-margin></helper-classes-padding-margin>
</mat-tab>
<mat-tab label="Width & Height Helpers">
<fuse-helper-classes-width-height></fuse-helper-classes-width-height>
<helper-classes-width-height></helper-classes-width-height>
</mat-tab>

7
src/app/main/ui/helper-classes/helper-classes.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-helper-classes',
selector : 'helper-classes',
templateUrl: './helper-classes.component.html',
styleUrls : ['./helper-classes.component.scss']
})
export class FuseHelperClassesComponent
export class HelperClassesComponent
{
/**
* Constructor
*/
constructor()
{
}

15
src/app/main/ui/helper-classes/helper-classes.module.ts
View File

@ -1,27 +1,26 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { MatIconModule, MatTabsModule } from '@angular/material';
import { FuseSharedModule } from '@fuse/shared.module';
import { FuseHighlightModule } from '@fuse/components';
import { FuseHelperClassesComponent } from './helper-classes.component';
import { FuseHelperClassesPaddingMarginComponent } from './tabs/padding-margin/padding-margin.component';
import { FuseHelperClassesWidthHeightComponent } from './tabs/width-height/width-height.component';
import { HelperClassesComponent } from 'app/main/ui/helper-classes/helper-classes.component';
import { HelperClassesPaddingMarginComponent } from 'app/main/ui/helper-classes/tabs/padding-margin/padding-margin.component';
import { HelperClassesWidthHeightComponent } from 'app/main/ui/helper-classes/tabs/width-height/width-height.component';
const routes: Routes = [
{
path : 'helper-classes',
component: FuseHelperClassesComponent
component: HelperClassesComponent
}
];
@NgModule({
declarations: [
FuseHelperClassesComponent,
FuseHelperClassesPaddingMarginComponent,
FuseHelperClassesWidthHeightComponent
HelperClassesComponent,
HelperClassesPaddingMarginComponent,
HelperClassesWidthHeightComponent
],
imports : [
RouterModule.forChild(routes),

8
src/app/main/ui/helper-classes/tabs/padding-margin/padding-margin.component.ts
View File

@ -1,13 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-helper-classes-padding-margin',
selector : 'helper-classes-padding-margin',
templateUrl: './padding-margin.component.html',
styleUrls : ['./padding-margin.component.scss']
})
export class FuseHelperClassesPaddingMarginComponent
export class HelperClassesPaddingMarginComponent
{
/**
* Constructor
*/
constructor()
{

8
src/app/main/ui/helper-classes/tabs/width-height/width-height.component.ts
View File

@ -1,13 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-helper-classes-width-height',
selector : 'helper-classes-width-height',
templateUrl: './width-height.component.html',
styleUrls : ['./width-height.component.scss']
})
export class FuseHelperClassesWidthHeightComponent
export class HelperClassesWidthHeightComponent
{
/**
* Constructor
*/
constructor()
{

60
src/app/main/ui/icons/icons.component.ts
View File

@ -1,24 +1,49 @@
import { Component, OnInit } from '@angular/core';
import { Component, OnDestroy, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { takeUntil } from 'rxjs/operators';
import { Subject } from 'rxjs';
@Component({
selector : 'fuse-icons',
selector : 'icons',
templateUrl: './icons.component.html',
styleUrls : ['./icons.component.scss']
})
export class FuseIconsComponent implements OnInit
export class IconsComponent implements OnInit, OnDestroy
{
icons: string[];
filteredIcons: string[];
loading = true;
loading: boolean;
constructor(private http: HttpClient)
// Private
private _unsubscribeAll: Subject<any>;
/**
* Constructor
*
* @param {HttpClient} _httpClient
*/
constructor(
private _httpClient: HttpClient
)
{
// Set the defaults
this.loading = true;
// Set the private defaults
this._unsubscribeAll = new Subject();
}
ngOnInit()
// -----------------------------------------------------------------------------------------------------
// @ Lifecycle hooks
// -----------------------------------------------------------------------------------------------------
/**
* On init
*/
ngOnInit(): void
{
this.http.get('api/icons')
this._httpClient.get('api/icons')
.pipe(takeUntil(this._unsubscribeAll))
.subscribe((icons: any) => {
this.icons = icons;
this.filteredIcons = this.icons;
@ -26,7 +51,26 @@ export class FuseIconsComponent implements OnInit
});
}
filterIcons(event)
/**
* On destroy
*/
ngOnDestroy(): void
{
// Unsubscribe from all subscriptions
this._unsubscribeAll.next();
this._unsubscribeAll.complete();
}
// -----------------------------------------------------------------------------------------------------
// @ Public methods
// -----------------------------------------------------------------------------------------------------
/**
* Filter icons
*
* @param event
*/
filterIcons(event): void
{
const value = event.target.value;

7
src/app/main/ui/icons/icons.module.ts
View File

@ -1,22 +1,21 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { MatButtonModule, MatFormFieldModule, MatIconModule, MatInputModule, MatProgressSpinnerModule } from '@angular/material';
import { FuseSharedModule } from '@fuse/shared.module';
import { FuseIconsComponent } from './icons.component';
import { IconsComponent } from 'app/main/ui/icons/icons.component';
const routes: Routes = [
{
path : 'icons',
component: FuseIconsComponent
component: IconsComponent
}
];
@NgModule({
declarations: [
FuseIconsComponent
IconsComponent
],
imports : [
RouterModule.forChild(routes),

7
src/app/main/ui/page-layouts/blank/blank.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-blank',
selector : 'blank',
templateUrl: './blank.component.html',
styleUrls : ['./blank.component.scss']
})
export class FuseBlankComponent
export class BlankComponent
{
/**
* Constructor
*/
constructor()
{
}

7
src/app/main/ui/page-layouts/carded/fullwidth-2/fullwidth-2.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-carded-fullwidth-2',
selector : 'carded-fullwidth-2',
templateUrl: './fullwidth-2.component.html',
styleUrls : ['./fullwidth-2.component.scss']
})
export class FuseCardedFullWidth2Component
export class CardedFullWidth2Component
{
/**
* Constructor
*/
constructor()
{
}

7
src/app/main/ui/page-layouts/carded/fullwidth/fullwidth.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-carded-fullwidth',
selector : 'carded-fullwidth',
templateUrl: './fullwidth.component.html',
styleUrls : ['./fullwidth.component.scss']
})
export class FuseCardedFullWidthComponent
export class CardedFullWidthComponent
{
/**
* Constructor
*/
constructor()
{
}

7
src/app/main/ui/page-layouts/carded/left-sidenav-2-tabbed/left-sidenav-2-tabbed.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-carded-left-sidenav-2-tabbed',
selector : 'carded-left-sidenav-2-tabbed',
templateUrl: './left-sidenav-2-tabbed.component.html',
styleUrls : ['./left-sidenav-2-tabbed.component.scss']
})
export class FuseCardedLeftSidenav2TabbedComponent
export class CardedLeftSidenav2TabbedComponent
{
/**
* Constructor
*/
constructor()
{
}

7
src/app/main/ui/page-layouts/carded/left-sidenav-2/left-sidenav-2.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-carded-left-sidenav-2',
selector : 'carded-left-sidenav-2',
templateUrl: './left-sidenav-2.component.html',
styleUrls : ['./left-sidenav-2.component.scss']
})
export class FuseCardedLeftSidenav2Component
export class CardedLeftSidenav2Component
{
/**
* Constructor
*/
constructor()
{
}

7
src/app/main/ui/page-layouts/carded/left-sidenav-tabbed/left-sidenav-tabbed.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-carded-left-sidenav-tabbed',
selector : 'carded-left-sidenav-tabbed',
templateUrl: './left-sidenav-tabbed.component.html',
styleUrls : ['./left-sidenav-tabbed.component.scss']
})
export class FuseCardedLeftSidenavTabbedComponent
export class CardedLeftSidenavTabbedComponent
{
/**
* Constructor
*/
constructor()
{
}

7
src/app/main/ui/page-layouts/carded/left-sidenav/left-sidenav.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-carded-left-sidenav',
selector : 'carded-left-sidenav',
templateUrl: './left-sidenav.component.html',
styleUrls : ['./left-sidenav.component.scss']
})
export class FuseCardedLeftSidenavComponent
export class CardedLeftSidenavComponent
{
/**
* Constructor
*/
constructor()
{
}

7
src/app/main/ui/page-layouts/carded/right-sidenav-2-tabbed/right-sidenav-2-tabbed.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-carded-right-sidenav-2-tabbed',
selector : 'carded-right-sidenav-2-tabbed',
templateUrl: './right-sidenav-2-tabbed.component.html',
styleUrls : ['./right-sidenav-2-tabbed.component.scss']
})
export class FuseCardedRightSidenav2TabbedComponent
export class CardedRightSidenav2TabbedComponent
{
/**
* Constructor
*/
constructor()
{
}

7
src/app/main/ui/page-layouts/carded/right-sidenav-2/right-sidenav-2.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-carded-right-sidenav-2',
selector : 'carded-right-sidenav-2',
templateUrl: './right-sidenav-2.component.html',
styleUrls : ['./right-sidenav-2.component.scss']
})
export class FuseCardedRightSidenav2Component
export class CardedRightSidenav2Component
{
/**
* Constructor
*/
constructor()
{
}

7
src/app/main/ui/page-layouts/carded/right-sidenav-tabbed/right-sidenav-tabbed.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-carded-right-sidenav-tabbed',
selector : 'carded-right-sidenav-tabbed',
templateUrl: './right-sidenav-tabbed.component.html',
styleUrls : ['./right-sidenav-tabbed.component.scss']
})
export class FuseCardedRightSidenavTabbedComponent
export class CardedRightSidenavTabbedComponent
{
/**
* Constructor
*/
constructor()
{
}

7
src/app/main/ui/page-layouts/carded/right-sidenav/right-sidenav.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-carded-right-sidenav',
selector : 'carded-right-sidenav',
templateUrl: './right-sidenav.component.html',
styleUrls : ['./right-sidenav.component.scss']
})
export class FuseCardedRightSidenavComponent
export class CardedRightSidenavComponent
{
/**
* Constructor
*/
constructor()
{
}

115
src/app/main/ui/page-layouts/page-layouts.module.ts
View File

@ -1,131 +1,130 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { MatButtonModule, MatIconModule, MatSidenavModule, MatTabsModule } from '@angular/material';
import { FuseSharedModule } from '@fuse/shared.module';
import { FuseDemoModule } from '@fuse/components/demo/demo.module';
import { FuseCardedFullWidthComponent } from './carded/fullwidth/fullwidth.component';
import { FuseCardedFullWidth2Component } from './carded/fullwidth-2/fullwidth-2.component';
import { FuseCardedLeftSidenavComponent } from './carded/left-sidenav/left-sidenav.component';
import { FuseCardedLeftSidenavTabbedComponent } from './carded/left-sidenav-tabbed/left-sidenav-tabbed.component';
import { FuseCardedLeftSidenav2Component } from './carded/left-sidenav-2/left-sidenav-2.component';
import { FuseCardedLeftSidenav2TabbedComponent } from './carded/left-sidenav-2-tabbed/left-sidenav-2-tabbed.component';
import { FuseCardedRightSidenavComponent } from './carded/right-sidenav/right-sidenav.component';
import { FuseCardedRightSidenavTabbedComponent } from './carded/right-sidenav-tabbed/right-sidenav-tabbed.component';
import { FuseCardedRightSidenav2Component } from './carded/right-sidenav-2/right-sidenav-2.component';
import { FuseCardedRightSidenav2TabbedComponent } from './carded/right-sidenav-2-tabbed/right-sidenav-2-tabbed.component';
import { FuseSimpleFullWidthComponent } from './simple/fullwidth/fullwidth.component';
import { FuseSimpleLeftSidenavComponent } from './simple/left-sidenav/left-sidenav.component';
import { FuseSimpleLeftSidenav2Component } from './simple/left-sidenav-2/left-sidenav-2.component';
import { FuseSimpleLeftSidenav3Component } from './simple/left-sidenav-3/left-sidenav-3.component';
import { FuseSimpleRightSidenavComponent } from './simple/right-sidenav/right-sidenav.component';
import { FuseSimpleRightSidenav2Component } from './simple/right-sidenav-2/right-sidenav-2.component';
import { FuseSimpleRightSidenav3Component } from './simple/right-sidenav-3/right-sidenav-3.component';
import { FuseTabbedComponent } from './simple/tabbed/tabbed.component';
import { FuseBlankComponent } from './blank/blank.component';
import { CardedFullWidthComponent } from 'app/main/ui/page-layouts/carded/fullwidth/fullwidth.component';
import { CardedFullWidth2Component } from 'app/main/ui/page-layouts/carded/fullwidth-2/fullwidth-2.component';
import { CardedLeftSidenavComponent } from 'app/main/ui/page-layouts/carded/left-sidenav/left-sidenav.component';
import { CardedLeftSidenavTabbedComponent } from 'app/main/ui/page-layouts/carded/left-sidenav-tabbed/left-sidenav-tabbed.component';
import { CardedLeftSidenav2Component } from 'app/main/ui/page-layouts/carded/left-sidenav-2/left-sidenav-2.component';
import { CardedLeftSidenav2TabbedComponent } from 'app/main/ui/page-layouts/carded/left-sidenav-2-tabbed/left-sidenav-2-tabbed.component';
import { CardedRightSidenavComponent } from 'app/main/ui/page-layouts/carded/right-sidenav/right-sidenav.component';
import { CardedRightSidenavTabbedComponent } from 'app/main/ui/page-layouts/carded/right-sidenav-tabbed/right-sidenav-tabbed.component';
import { CardedRightSidenav2Component } from 'app/main/ui/page-layouts/carded/right-sidenav-2/right-sidenav-2.component';
import { CardedRightSidenav2TabbedComponent } from 'app/main/ui/page-layouts/carded/right-sidenav-2-tabbed/right-sidenav-2-tabbed.component';
import { SimpleFullWidthComponent } from 'app/main/ui/page-layouts/simple/fullwidth/fullwidth.component';
import { SimpleLeftSidenavComponent } from 'app/main/ui/page-layouts/simple/left-sidenav/left-sidenav.component';
import { SimpleLeftSidenav2Component } from 'app/main/ui/page-layouts/simple/left-sidenav-2/left-sidenav-2.component';
import { SimpleLeftSidenav3Component } from 'app/main/ui/page-layouts/simple/left-sidenav-3/left-sidenav-3.component';
import { SimpleRightSidenavComponent } from 'app/main/ui/page-layouts/simple/right-sidenav/right-sidenav.component';
import { SimpleRightSidenav2Component } from 'app/main/ui/page-layouts/simple/right-sidenav-2/right-sidenav-2.component';
import { SimpleRightSidenav3Component } from 'app/main/ui/page-layouts/simple/right-sidenav-3/right-sidenav-3.component';
import { TabbedComponent } from 'app/main/ui/page-layouts/simple/tabbed/tabbed.component';
import { BlankComponent } from 'app/main/ui/page-layouts/blank/blank.component';
const routes: Routes = [
{
path : 'page-layouts/carded/full-width',
component: FuseCardedFullWidthComponent
component: CardedFullWidthComponent
},
{
path : 'page-layouts/carded/full-width-2',
component: FuseCardedFullWidth2Component
component: CardedFullWidth2Component
},
{
path : 'page-layouts/carded/left-sidenav',
component: FuseCardedLeftSidenavComponent
component: CardedLeftSidenavComponent
},
{
path : 'page-layouts/carded/left-sidenav-tabbed',
component: FuseCardedLeftSidenavTabbedComponent
component: CardedLeftSidenavTabbedComponent
},
{
path : 'page-layouts/carded/left-sidenav-2',
component: FuseCardedLeftSidenav2Component
component: CardedLeftSidenav2Component
},
{
path : 'page-layouts/carded/left-sidenav-2-tabbed',
component: FuseCardedLeftSidenav2TabbedComponent
component: CardedLeftSidenav2TabbedComponent
},
{
path : 'page-layouts/carded/right-sidenav',
component: FuseCardedRightSidenavComponent
component: CardedRightSidenavComponent
},
{
path : 'page-layouts/carded/right-sidenav-tabbed',
component: FuseCardedRightSidenavTabbedComponent
component: CardedRightSidenavTabbedComponent
},
{
path : 'page-layouts/carded/right-sidenav-2',
component: FuseCardedRightSidenav2Component
component: CardedRightSidenav2Component
},
{
path : 'page-layouts/carded/right-sidenav-2-tabbed',
component: FuseCardedRightSidenav2TabbedComponent
component: CardedRightSidenav2TabbedComponent
},
{
path : 'page-layouts/simple/full-width',
component: FuseSimpleFullWidthComponent
component: SimpleFullWidthComponent
},
{
path : 'page-layouts/simple/left-sidenav',
component: FuseSimpleLeftSidenavComponent
component: SimpleLeftSidenavComponent
},
{
path : 'page-layouts/simple/left-sidenav-2',
component: FuseSimpleLeftSidenav2Component
component: SimpleLeftSidenav2Component
},
{
path : 'page-layouts/simple/left-sidenav-3',
component: FuseSimpleLeftSidenav3Component
component: SimpleLeftSidenav3Component
},
{
path : 'page-layouts/simple/right-sidenav',
component: FuseSimpleRightSidenavComponent
component: SimpleRightSidenavComponent
},
{
path : 'page-layouts/simple/right-sidenav-2',
component: FuseSimpleRightSidenav2Component
component: SimpleRightSidenav2Component
},
{
path : 'page-layouts/simple/right-sidenav-3',
component: FuseSimpleRightSidenav3Component
component: SimpleRightSidenav3Component
},
{
path : 'page-layouts/simple/tabbed',
component: FuseTabbedComponent
component: TabbedComponent
},
{
path : 'page-layouts/blank',
component: FuseBlankComponent
component: BlankComponent
}
];
@NgModule({
declarations: [
FuseCardedFullWidthComponent,
FuseCardedFullWidth2Component,
FuseCardedLeftSidenavComponent,
FuseCardedLeftSidenavTabbedComponent,
FuseCardedLeftSidenav2Component,
FuseCardedLeftSidenav2TabbedComponent,
FuseCardedRightSidenavComponent,
FuseCardedRightSidenavTabbedComponent,
FuseCardedRightSidenav2Component,
FuseCardedRightSidenav2TabbedComponent,
FuseSimpleFullWidthComponent,
FuseSimpleLeftSidenavComponent,
FuseSimpleLeftSidenav2Component,
FuseSimpleLeftSidenav3Component,
FuseSimpleRightSidenavComponent,
FuseSimpleRightSidenav2Component,
FuseSimpleRightSidenav3Component,
FuseTabbedComponent,
FuseBlankComponent
CardedFullWidthComponent,
CardedFullWidth2Component,
CardedLeftSidenavComponent,
CardedLeftSidenavTabbedComponent,
CardedLeftSidenav2Component,
CardedLeftSidenav2TabbedComponent,
CardedRightSidenavComponent,
CardedRightSidenavTabbedComponent,
CardedRightSidenav2Component,
CardedRightSidenav2TabbedComponent,
SimpleFullWidthComponent,
SimpleLeftSidenavComponent,
SimpleLeftSidenav2Component,
SimpleLeftSidenav3Component,
SimpleRightSidenavComponent,
SimpleRightSidenav2Component,
SimpleRightSidenav3Component,
TabbedComponent,
BlankComponent
],
imports : [
RouterModule.forChild(routes),

7
src/app/main/ui/page-layouts/simple/fullwidth/fullwidth.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-simple-fullwidth',
selector : 'simple-fullwidth',
templateUrl: './fullwidth.component.html',
styleUrls : ['./fullwidth.component.scss']
})
export class FuseSimpleFullWidthComponent
export class SimpleFullWidthComponent
{
/**
* Constructor
*/
constructor()
{
}

7
src/app/main/ui/page-layouts/simple/left-sidenav-2/left-sidenav-2.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-simple-left-sidenav-2',
selector : 'simple-left-sidenav-2',
templateUrl: './left-sidenav-2.component.html',
styleUrls : ['./left-sidenav-2.component.scss']
})
export class FuseSimpleLeftSidenav2Component
export class SimpleLeftSidenav2Component
{
/**
* Constructor
*/
constructor()
{
}

7
src/app/main/ui/page-layouts/simple/left-sidenav-3/left-sidenav-3.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-simple-left-sidenav-3',
selector : 'simple-left-sidenav-3',
templateUrl: './left-sidenav-3.component.html',
styleUrls : ['./left-sidenav-3.component.scss']
})
export class FuseSimpleLeftSidenav3Component
export class SimpleLeftSidenav3Component
{
/**
* Constructor
*/
constructor()
{
}

7
src/app/main/ui/page-layouts/simple/left-sidenav/left-sidenav.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-simple-left-sidenav',
selector : 'simple-left-sidenav',
templateUrl: './left-sidenav.component.html',
styleUrls : ['./left-sidenav.component.scss']
})
export class FuseSimpleLeftSidenavComponent
export class SimpleLeftSidenavComponent
{
/**
* Constructor
*/
constructor()
{
}

7
src/app/main/ui/page-layouts/simple/right-sidenav-2/right-sidenav-2.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-simple-right-sidenav-2',
selector : 'simple-right-sidenav-2',
templateUrl: './right-sidenav-2.component.html',
styleUrls : ['./right-sidenav-2.component.scss']
})
export class FuseSimpleRightSidenav2Component
export class SimpleRightSidenav2Component
{
/**
* Constructor
*/
constructor()
{
}

7
src/app/main/ui/page-layouts/simple/right-sidenav-3/right-sidenav-3.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-simple-right-sidenav-3',
selector : 'simple-right-sidenav-3',
templateUrl: './right-sidenav-3.component.html',
styleUrls : ['./right-sidenav-3.component.scss']
})
export class FuseSimpleRightSidenav3Component
export class SimpleRightSidenav3Component
{
/**
* Constructor
*/
constructor()
{
}

7
src/app/main/ui/page-layouts/simple/right-sidenav/right-sidenav.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-simple-right-sidenav',
selector : 'simple-right-sidenav',
templateUrl: './right-sidenav.component.html',
styleUrls : ['./right-sidenav.component.scss']
})
export class FuseSimpleRightSidenavComponent
export class SimpleRightSidenavComponent
{
/**
* Constructor
*/
constructor()
{
}

7
src/app/main/ui/page-layouts/simple/tabbed/tabbed.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-tabbed',
selector : 'tabbed',
templateUrl: './tabbed.component.html',
styleUrls : ['./tabbed.component.scss']
})
export class FuseTabbedComponent
export class TabbedComponent
{
/**
* Constructor
*/
constructor()
{
}

8
src/app/main/ui/typography/tabs/blockquotes-lists/blockquotes-lists.component.ts
View File

@ -1,13 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-typography-blockquotes-lists',
selector : 'typography-blockquotes-lists',
templateUrl: './blockquotes-lists.component.html',
styleUrls : ['./blockquotes-lists.component.scss']
})
export class FuseTypographyBlockquotesListsComponent
export class TypographyBlockquotesListsComponent
{
/**
* Constructor
*/
constructor()
{

8
src/app/main/ui/typography/tabs/headings/headings.component.ts
View File

@ -1,13 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-typography-headings',
selector : 'typography-headings',
templateUrl: './headings.component.html',
styleUrls : ['./headings.component.scss']
})
export class FuseTypographyHeadingsComponent
export class TypographyHeadingsComponent
{
/**
* Constructor
*/
constructor()
{

8
src/app/main/ui/typography/tabs/helpers/helpers.component.ts
View File

@ -1,13 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-typography-helpers',
selector : 'typography-helpers',
templateUrl: './helpers.component.html',
styleUrls : ['./helpers.component.scss']
})
export class FuseTypographyHelpersComponent
export class TypographyHelpersComponent
{
/**
* Constructor
*/
constructor()
{

8
src/app/main/ui/typography/tabs/inline-text-elements/inline-text-elements.component.ts
View File

@ -1,13 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-typography-inline-text-elements',
selector : 'typography-inline-text-elements',
templateUrl: './inline-text-elements.component.html',
styleUrls : ['./inline-text-elements.component.scss']
})
export class FuseTypographyInlineTextElementsComponent
export class TypographyInlineTextElementsComponent
{
/**
* Constructor
*/
constructor()
{

8
src/app/main/ui/typography/typography.component.html
View File

@ -20,25 +20,25 @@
<mat-tab label="Headings">
<fuse-typography-headings></fuse-typography-headings>
<typography-headings></typography-headings>
</mat-tab>
<mat-tab label="Inline Text Elements">
<fuse-typography-inline-text-elements></fuse-typography-inline-text-elements>
<typography-inline-text-elements></typography-inline-text-elements>
</mat-tab>
<mat-tab label="Blockquotes & Lists">
<fuse-typography-blockquotes-lists></fuse-typography-blockquotes-lists>
<typography-blockquotes-lists></typography-blockquotes-lists>
</mat-tab>
<mat-tab label="Helpers">
<fuse-typography-helpers></fuse-typography-helpers>
<typography-helpers></typography-helpers>
</mat-tab>

7
src/app/main/ui/typography/typography.component.ts
View File

@ -1,12 +1,15 @@
import { Component } from '@angular/core';
@Component({
selector : 'fuse-typography',
selector : 'typography',
templateUrl: './typography.component.html',
styleUrls : ['./typography.component.scss']
})
export class FuseTypographyComponent
export class TypographyComponent
{
/**
* Constructor
*/
constructor()
{
}

23
src/app/main/ui/typography/typography.module.ts
View File

@ -1,31 +1,30 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { MatIconModule, MatTabsModule } from '@angular/material';
import { FuseSharedModule } from '@fuse/shared.module';
import { FuseHighlightModule } from '@fuse/components';
import { FuseTypographyComponent } from './typography.component';
import { FuseTypographyHeadingsComponent } from './tabs/headings/headings.component';
import { FuseTypographyInlineTextElementsComponent } from './tabs/inline-text-elements/inline-text-elements.component';
import { FuseTypographyBlockquotesListsComponent } from './tabs/blockquotes-lists/blockquotes-lists.component';
import { FuseTypographyHelpersComponent } from './tabs/helpers/helpers.component';
import { TypographyComponent } from 'app/main/ui/typography/typography.component';
import { TypographyHeadingsComponent } from 'app/main/ui/typography/tabs/headings/headings.component';
import { TypographyInlineTextElementsComponent } from 'app/main/ui/typography/tabs/inline-text-elements/inline-text-elements.component';
import { TypographyBlockquotesListsComponent } from 'app/main/ui/typography/tabs/blockquotes-lists/blockquotes-lists.component';
import { TypographyHelpersComponent } from 'app/main/ui/typography/tabs/helpers/helpers.component';
const routes: Routes = [
{
path : 'typography',
component: FuseTypographyComponent
component: TypographyComponent
}
];
@NgModule({
declarations: [
FuseTypographyComponent,
FuseTypographyHeadingsComponent,
FuseTypographyInlineTextElementsComponent,
FuseTypographyBlockquotesListsComponent,
FuseTypographyHelpersComponent
TypographyComponent,
TypographyHeadingsComponent,
TypographyInlineTextElementsComponent,
TypographyBlockquotesListsComponent,
TypographyHelpersComponent
],
imports : [
RouterModule.forChild(routes),

2
src/app/main/ui/ui.module.ts
View File

@ -17,6 +17,6 @@ import { UIColorsModule } from 'app/main/ui/colors/colors.module';
UIColorsModule
]
})
export class FuseUIModule
export class UIModule
{
}

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