From e518752e94a4a8f4d2704ccff667bfe51bcdebac Mon Sep 17 00:00:00 2001 From: Kyle Spearrin Date: Fri, 9 Feb 2018 23:41:29 -0500 Subject: [PATCH] settings modal --- src/app/accounts/settings.component.html | 19 ++++++++++++++++ src/app/accounts/settings.component.ts | 29 ++++++++++++++++++++++++ src/app/app.component.ts | 29 +++++++++++++++++++++++- src/app/app.module.ts | 3 +++ 4 files changed, 79 insertions(+), 1 deletion(-) create mode 100644 src/app/accounts/settings.component.html create mode 100644 src/app/accounts/settings.component.ts diff --git a/src/app/accounts/settings.component.html b/src/app/accounts/settings.component.html new file mode 100644 index 0000000000..4069a1fa87 --- /dev/null +++ b/src/app/accounts/settings.component.html @@ -0,0 +1,19 @@ + diff --git a/src/app/accounts/settings.component.ts b/src/app/accounts/settings.component.ts new file mode 100644 index 0000000000..82f51af037 --- /dev/null +++ b/src/app/accounts/settings.component.ts @@ -0,0 +1,29 @@ +import * as template from './settings.component.html'; + +import { + Component, + OnInit, +} from '@angular/core'; + +import { ToasterService } from 'angular2-toaster'; +import { Angulartics2 } from 'angulartics2'; + +import { I18nService } from 'jslib/abstractions/i18n.service'; +import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service'; + +@Component({ + selector: 'app-settings', + template: template, +}) +export class SettingsComponent implements OnInit { + constructor(private analytics: Angulartics2, private toasterService: ToasterService, + private i18nService: I18nService, private platformUtilsService: PlatformUtilsService) { } + + ngOnInit() { + + } + + submit() { + + } +} diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 9cc13d0078..e6eac03387 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -6,11 +6,17 @@ import { Angulartics2GoogleAnalytics } from 'angulartics2/ga'; import { Component, + ComponentFactoryResolver, NgZone, OnInit, + ViewChild, + ViewContainerRef, } from '@angular/core'; import { Router } from '@angular/router'; +import { ModalComponent } from './modal.component'; +import { SettingsComponent } from './accounts/settings.component'; + import { ToasterService } from 'angular2-toaster'; import { Angulartics2 } from 'angulartics2'; @@ -37,9 +43,12 @@ import { ConstantsService } from 'jslib/services/constants.service'; styles: [], template: ` + `, }) export class AppComponent implements OnInit { + @ViewChild('settings', { read: ViewContainerRef }) settingsRef: ViewContainerRef; + toasterConfig: ToasterConfig = new ToasterConfig({ showCloseButton: true, mouseoverTimerStop: true, @@ -48,6 +57,7 @@ export class AppComponent implements OnInit { }); private lastActivity: number = null; + private modal: ModalComponent = null; constructor(private angulartics2GoogleAnalytics: Angulartics2GoogleAnalytics, private broadcasterService: BroadcasterService, private userService: UserService, @@ -58,7 +68,7 @@ export class AppComponent implements OnInit { private toasterService: ToasterService, private i18nService: I18nService, private platformUtilsService: PlatformUtilsService, private ngZone: NgZone, private lockService: LockService, private storageService: StorageService, - private cryptoService: CryptoService) { } + private cryptoService: CryptoService, private componentFactoryResolver: ComponentFactoryResolver) { } ngOnInit() { window.onmousemove = () => this.recordActivity(); @@ -88,6 +98,9 @@ export class AppComponent implements OnInit { break; case 'syncCompleted': break; + case 'openSettings': + this.openSettings(); + break; default: } }); @@ -127,4 +140,18 @@ export class AppComponent implements OnInit { this.lastActivity = now; this.storageService.save(ConstantsService.lastActiveKey, now); } + + private openSettings() { + if (this.modal != null) { + this.modal.close(); + } + + const factory = this.componentFactoryResolver.resolveComponentFactory(ModalComponent); + this.modal = this.settingsRef.createComponent(factory).instance; + const childComponent = this.modal.show(SettingsComponent, this.settingsRef); + + this.modal.onClosed.subscribe(() => { + this.modal = null; + }); + } } diff --git a/src/app/app.module.ts b/src/app/app.module.ts index b398b6c0ee..bd4add8342 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -20,6 +20,7 @@ import { HintComponent } from './accounts/hint.component'; import { LockComponent } from './accounts/lock.component'; import { LoginComponent } from './accounts/login.component'; import { RegisterComponent } from './accounts/register.component'; +import { SettingsComponent } from './accounts/settings.component'; import { TwoFactorOptionsComponent } from './accounts/two-factor-options.component'; import { TwoFactorComponent } from './accounts/two-factor.component'; @@ -79,6 +80,7 @@ import { ViewComponent } from './vault/view.component'; PasswordGeneratorComponent, RegisterComponent, SearchCiphersPipe, + SettingsComponent, StopClickDirective, StopPropDirective, TwoFactorComponent, @@ -92,6 +94,7 @@ import { ViewComponent } from './vault/view.component'; FolderAddEditComponent, ModalComponent, PasswordGeneratorComponent, + SettingsComponent, TwoFactorOptionsComponent, ], providers: [],