2018-02-10 05:41:29 +01:00
|
|
|
import {
|
|
|
|
Component,
|
|
|
|
OnInit,
|
|
|
|
} from '@angular/core';
|
|
|
|
|
|
|
|
import { ToasterService } from 'angular2-toaster';
|
|
|
|
import { Angulartics2 } from 'angulartics2';
|
2019-02-13 16:06:58 +01:00
|
|
|
import swal from 'sweetalert';
|
2018-02-10 05:41:29 +01:00
|
|
|
|
2018-05-08 15:40:33 +02:00
|
|
|
import { DeviceType } from 'jslib/enums/deviceType';
|
|
|
|
|
2019-02-13 16:06:58 +01:00
|
|
|
import { CryptoService } from 'jslib/abstractions/crypto.service';
|
2018-02-10 05:41:29 +01:00
|
|
|
import { I18nService } from 'jslib/abstractions/i18n.service';
|
2018-02-11 05:24:22 +01:00
|
|
|
import { LockService } from 'jslib/abstractions/lock.service';
|
2018-02-12 21:06:39 +01:00
|
|
|
import { MessagingService } from 'jslib/abstractions/messaging.service';
|
2018-02-10 05:41:29 +01:00
|
|
|
import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service';
|
2018-02-12 21:06:39 +01:00
|
|
|
import { StateService } from 'jslib/abstractions/state.service';
|
2018-02-11 05:24:22 +01:00
|
|
|
import { StorageService } from 'jslib/abstractions/storage.service';
|
2019-02-13 16:06:58 +01:00
|
|
|
import { UserService } from 'jslib/abstractions/user.service';
|
2018-02-11 05:24:22 +01:00
|
|
|
|
|
|
|
import { ConstantsService } from 'jslib/services/constants.service';
|
2018-05-04 19:16:12 +02:00
|
|
|
|
2018-05-05 06:29:02 +02:00
|
|
|
import { ElectronConstants } from 'jslib/electron/electronConstants';
|
2018-02-10 05:41:29 +01:00
|
|
|
|
2018-07-24 04:45:58 +02:00
|
|
|
import { Utils } from 'jslib/misc/utils';
|
|
|
|
|
2018-02-10 05:41:29 +01:00
|
|
|
@Component({
|
|
|
|
selector: 'app-settings',
|
2018-04-06 18:25:22 +02:00
|
|
|
templateUrl: 'settings.component.html',
|
2018-02-10 05:41:29 +01:00
|
|
|
})
|
|
|
|
export class SettingsComponent implements OnInit {
|
2018-02-11 05:24:22 +01:00
|
|
|
lockOption: number = null;
|
2019-02-13 16:06:58 +01:00
|
|
|
pin: boolean = null;
|
2018-02-11 05:24:22 +01:00
|
|
|
disableFavicons: boolean = false;
|
2018-05-04 19:16:12 +02:00
|
|
|
enableMinToTray: boolean = false;
|
2018-12-03 21:55:55 +01:00
|
|
|
enableCloseToTray: boolean = false;
|
2018-05-05 06:29:02 +02:00
|
|
|
enableTray: boolean = false;
|
2018-05-08 15:40:33 +02:00
|
|
|
showMinToTray: boolean = false;
|
2019-02-02 18:27:06 +01:00
|
|
|
startToTray: boolean = false;
|
2018-04-25 05:25:31 +02:00
|
|
|
locale: string;
|
2018-04-25 05:53:20 +02:00
|
|
|
lockOptions: any[];
|
|
|
|
localeOptions: any[];
|
2018-05-30 05:28:58 +02:00
|
|
|
theme: string;
|
|
|
|
themeOptions: any[];
|
2019-02-27 17:29:31 +01:00
|
|
|
clearClipboard: number;
|
|
|
|
clearClipboardOptions: any[];
|
2019-06-02 04:02:16 +02:00
|
|
|
enableTrayText: string;
|
|
|
|
enableTrayDescText: string;
|
2018-02-10 05:41:29 +01:00
|
|
|
|
2018-02-11 05:24:22 +01:00
|
|
|
constructor(private analytics: Angulartics2, private toasterService: ToasterService,
|
2019-02-13 16:06:58 +01:00
|
|
|
private i18nService: I18nService, private platformUtilsService: PlatformUtilsService,
|
2018-02-12 21:06:39 +01:00
|
|
|
private storageService: StorageService, private lockService: LockService,
|
2019-02-13 16:06:58 +01:00
|
|
|
private stateService: StateService, private messagingService: MessagingService,
|
|
|
|
private userService: UserService, private cryptoService: CryptoService) {
|
2019-06-02 04:02:16 +02:00
|
|
|
const trayKey = this.platformUtilsService.getDevice() === DeviceType.MacOsDesktop ?
|
|
|
|
'enableMenuBar' : 'enableTray';
|
|
|
|
this.enableTrayText = this.i18nService.t(trayKey);
|
|
|
|
this.enableTrayDescText = this.i18nService.t(trayKey + 'Desc');
|
2018-02-11 05:24:22 +01:00
|
|
|
this.lockOptions = [
|
|
|
|
// { name: i18nService.t('immediately'), value: 0 },
|
|
|
|
{ name: i18nService.t('oneMinute'), value: 1 },
|
|
|
|
{ name: i18nService.t('fiveMinutes'), value: 5 },
|
|
|
|
{ name: i18nService.t('fifteenMinutes'), value: 15 },
|
|
|
|
{ name: i18nService.t('thirtyMinutes'), value: 30 },
|
|
|
|
{ name: i18nService.t('oneHour'), value: 60 },
|
|
|
|
{ name: i18nService.t('fourHours'), value: 240 },
|
2018-02-11 06:09:47 +01:00
|
|
|
{ name: i18nService.t('onIdle'), value: -4 },
|
2018-02-11 05:24:22 +01:00
|
|
|
{ name: i18nService.t('onSleep'), value: -3 },
|
2019-03-19 21:12:26 +01:00
|
|
|
];
|
|
|
|
|
|
|
|
if (this.platformUtilsService.getDevice() !== DeviceType.LinuxDesktop) {
|
|
|
|
this.lockOptions.push({ name: i18nService.t('onLocked'), value: -2 });
|
|
|
|
}
|
|
|
|
|
|
|
|
this.lockOptions = this.lockOptions.concat([
|
2018-02-11 05:24:22 +01:00
|
|
|
{ name: i18nService.t('onRestart'), value: -1 },
|
|
|
|
{ name: i18nService.t('never'), value: null },
|
2019-03-19 21:12:26 +01:00
|
|
|
]);
|
2018-04-25 05:25:31 +02:00
|
|
|
|
2018-07-24 04:45:58 +02:00
|
|
|
const localeOptions: any[] = [];
|
2018-04-25 14:31:48 +02:00
|
|
|
i18nService.supportedTranslationLocales.forEach((locale) => {
|
2018-07-24 04:45:58 +02:00
|
|
|
localeOptions.push({ name: locale, value: locale });
|
2018-04-25 05:25:31 +02:00
|
|
|
});
|
2018-07-24 04:45:58 +02:00
|
|
|
localeOptions.sort(Utils.getSortFunction(i18nService, 'name'));
|
|
|
|
localeOptions.splice(0, 0, { name: i18nService.t('default'), value: null });
|
|
|
|
this.localeOptions = localeOptions;
|
2018-05-30 05:28:58 +02:00
|
|
|
|
|
|
|
this.themeOptions = [
|
|
|
|
{ name: i18nService.t('default'), value: null },
|
|
|
|
{ name: i18nService.t('light'), value: 'light' },
|
|
|
|
{ name: i18nService.t('dark'), value: 'dark' },
|
2018-07-22 04:02:10 +02:00
|
|
|
{ name: 'Nord', value: 'nord' },
|
2018-05-30 05:28:58 +02:00
|
|
|
];
|
2019-02-27 17:29:31 +01:00
|
|
|
|
|
|
|
this.clearClipboardOptions = [
|
|
|
|
{ name: i18nService.t('never'), value: null },
|
|
|
|
{ name: i18nService.t('tenSeconds'), value: 10 },
|
|
|
|
{ name: i18nService.t('twentySeconds'), value: 20 },
|
|
|
|
{ name: i18nService.t('thirtySeconds'), value: 30 },
|
|
|
|
{ name: i18nService.t('oneMinute'), value: 60 },
|
|
|
|
{ name: i18nService.t('twoMinutes'), value: 120 },
|
|
|
|
{ name: i18nService.t('fiveMinutes'), value: 300 },
|
|
|
|
];
|
2018-02-10 05:41:29 +01:00
|
|
|
}
|
|
|
|
|
2018-02-11 05:24:22 +01:00
|
|
|
async ngOnInit() {
|
2018-07-09 15:06:45 +02:00
|
|
|
this.showMinToTray = this.platformUtilsService.getDevice() === DeviceType.WindowsDesktop;
|
2018-02-11 05:24:22 +01:00
|
|
|
this.lockOption = await this.storageService.get<number>(ConstantsService.lockOptionKey);
|
2019-02-14 20:00:09 +01:00
|
|
|
const pinSet = await this.lockService.isPinLockSet();
|
|
|
|
this.pin = pinSet[0] || pinSet[1];
|
2018-02-11 05:24:22 +01:00
|
|
|
this.disableFavicons = await this.storageService.get<boolean>(ConstantsService.disableFaviconKey);
|
2018-05-05 06:29:02 +02:00
|
|
|
this.enableMinToTray = await this.storageService.get<boolean>(ElectronConstants.enableMinimizeToTrayKey);
|
2018-12-03 21:55:55 +01:00
|
|
|
this.enableCloseToTray = await this.storageService.get<boolean>(ElectronConstants.enableCloseToTrayKey);
|
2018-05-05 06:29:02 +02:00
|
|
|
this.enableTray = await this.storageService.get<boolean>(ElectronConstants.enableTrayKey);
|
2019-02-02 18:27:06 +01:00
|
|
|
this.startToTray = await this.storageService.get<boolean>(ElectronConstants.enableStartToTrayKey);
|
2018-04-25 05:53:20 +02:00
|
|
|
this.locale = await this.storageService.get<string>(ConstantsService.localeKey);
|
2018-05-30 05:28:58 +02:00
|
|
|
this.theme = await this.storageService.get<string>(ConstantsService.themeKey);
|
2019-02-27 17:29:31 +01:00
|
|
|
this.clearClipboard = await this.storageService.get<number>(ConstantsService.clearClipboardKey);
|
2018-02-11 05:24:22 +01:00
|
|
|
}
|
2018-02-10 05:41:29 +01:00
|
|
|
|
2018-02-12 21:06:39 +01:00
|
|
|
async saveLockOption() {
|
2018-02-11 05:24:22 +01:00
|
|
|
await this.lockService.setLockOption(this.lockOption != null ? this.lockOption : null);
|
2018-02-12 21:06:39 +01:00
|
|
|
}
|
|
|
|
|
2019-02-13 16:06:58 +01:00
|
|
|
async updatePin() {
|
|
|
|
if (this.pin) {
|
2019-02-14 20:00:09 +01:00
|
|
|
const div = document.createElement('div');
|
|
|
|
const label = document.createElement('label');
|
|
|
|
label.className = 'checkbox';
|
|
|
|
const checkboxText = document.createElement('span');
|
|
|
|
const restartText = document.createTextNode(this.i18nService.t('lockWithMasterPassOnRestart'));
|
|
|
|
checkboxText.appendChild(restartText);
|
|
|
|
label.innerHTML = '<input type="checkbox" id="master-pass-restart" checked>';
|
|
|
|
label.appendChild(checkboxText);
|
2019-03-06 20:40:13 +01:00
|
|
|
div.innerHTML = '<input type="text" class="swal-content__input" id="pin-val" autocomplete="off" ' +
|
|
|
|
'autocapitalize="none" autocorrect="none" spellcheck="false" inputmode="verbatim">';
|
2019-02-14 20:00:09 +01:00
|
|
|
(div.querySelector('#pin-val') as HTMLInputElement).placeholder = this.i18nService.t('pin');
|
|
|
|
div.appendChild(label);
|
|
|
|
|
|
|
|
const submitted = await swal({
|
2019-02-13 16:06:58 +01:00
|
|
|
text: this.i18nService.t('setYourPinCode'),
|
2019-02-14 20:00:09 +01:00
|
|
|
content: { element: div },
|
2019-02-13 16:06:58 +01:00
|
|
|
buttons: [this.i18nService.t('cancel'), this.i18nService.t('submit')],
|
|
|
|
});
|
2019-02-14 20:00:09 +01:00
|
|
|
let pin: string = null;
|
|
|
|
let masterPassOnRestart: boolean = null;
|
|
|
|
if (submitted) {
|
|
|
|
pin = (document.getElementById('pin-val') as HTMLInputElement).value;
|
|
|
|
masterPassOnRestart = (document.getElementById('master-pass-restart') as HTMLInputElement).checked;
|
|
|
|
}
|
2019-02-13 16:06:58 +01:00
|
|
|
if (pin != null && pin.trim() !== '') {
|
2019-08-29 16:01:59 +02:00
|
|
|
const kdf = await this.userService.getKdf();
|
|
|
|
const kdfIterations = await this.userService.getKdfIterations();
|
|
|
|
const email = await this.userService.getEmail();
|
|
|
|
const pinKey = await this.cryptoService.makePinKey(pin, email, kdf, kdfIterations);
|
|
|
|
const key = await this.cryptoService.getKey();
|
|
|
|
const pinProtectedKey = await this.cryptoService.encrypt(key.key, pinKey);
|
2019-02-14 20:00:09 +01:00
|
|
|
if (masterPassOnRestart) {
|
|
|
|
const encPin = await this.cryptoService.encrypt(pin);
|
|
|
|
await this.storageService.save(ConstantsService.protectedPin, encPin.encryptedString);
|
2019-08-29 16:01:59 +02:00
|
|
|
this.lockService.pinProtectedKey = pinProtectedKey;
|
2019-02-14 20:00:09 +01:00
|
|
|
} else {
|
|
|
|
await this.storageService.save(ConstantsService.pinProtectedKey, pinProtectedKey.encryptedString);
|
|
|
|
}
|
2019-02-13 16:06:58 +01:00
|
|
|
} else {
|
|
|
|
this.pin = false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
if (!this.pin) {
|
2019-08-29 16:01:59 +02:00
|
|
|
await this.cryptoService.clearPinProtectedKey();
|
|
|
|
await this.lockService.clear();
|
2019-02-13 16:06:58 +01:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2018-02-12 21:06:39 +01:00
|
|
|
async saveFavicons() {
|
2018-02-11 05:24:22 +01:00
|
|
|
await this.storageService.save(ConstantsService.disableFaviconKey, this.disableFavicons);
|
2018-02-12 21:06:39 +01:00
|
|
|
await this.stateService.save(ConstantsService.disableFaviconKey, this.disableFavicons);
|
|
|
|
this.messagingService.send('refreshCiphers');
|
2018-05-04 18:45:42 +02:00
|
|
|
this.callAnalytics('Favicons', !this.disableFavicons);
|
|
|
|
}
|
|
|
|
|
2018-05-04 19:16:12 +02:00
|
|
|
async saveMinToTray() {
|
2018-05-05 06:29:02 +02:00
|
|
|
await this.storageService.save(ElectronConstants.enableMinimizeToTrayKey, this.enableMinToTray);
|
2018-05-04 19:16:12 +02:00
|
|
|
this.callAnalytics('MinimizeToTray', this.enableMinToTray);
|
2018-02-12 21:06:39 +01:00
|
|
|
}
|
|
|
|
|
2018-12-03 21:55:55 +01:00
|
|
|
async saveCloseToTray() {
|
|
|
|
await this.storageService.save(ElectronConstants.enableCloseToTrayKey, this.enableCloseToTray);
|
|
|
|
this.callAnalytics('CloseToTray', this.enableCloseToTray);
|
|
|
|
}
|
|
|
|
|
2018-05-05 06:29:02 +02:00
|
|
|
async saveTray() {
|
|
|
|
await this.storageService.save(ElectronConstants.enableTrayKey, this.enableTray);
|
|
|
|
this.callAnalytics('Tray', this.enableTray);
|
|
|
|
this.messagingService.send(this.enableTray ? 'showTray' : 'removeTray');
|
|
|
|
}
|
|
|
|
|
2019-02-02 18:27:06 +01:00
|
|
|
async saveStartToTray() {
|
|
|
|
await this.storageService.save(ElectronConstants.enableStartToTrayKey, this.startToTray);
|
|
|
|
this.callAnalytics('StartToTray', this.startToTray);
|
2019-02-02 18:16:32 +01:00
|
|
|
}
|
|
|
|
|
2018-04-25 05:53:20 +02:00
|
|
|
async saveLocale() {
|
|
|
|
await this.storageService.save(ConstantsService.localeKey, this.locale);
|
|
|
|
this.analytics.eventTrack.next({ action: 'Set Locale ' + this.locale });
|
|
|
|
}
|
|
|
|
|
2018-05-30 05:28:58 +02:00
|
|
|
async saveTheme() {
|
|
|
|
await this.storageService.save(ConstantsService.themeKey, this.theme);
|
|
|
|
this.analytics.eventTrack.next({ action: 'Set Theme ' + this.theme });
|
2018-05-31 04:28:04 +02:00
|
|
|
window.setTimeout(() => window.location.reload(), 200);
|
2018-05-30 05:28:58 +02:00
|
|
|
}
|
|
|
|
|
2019-02-27 17:29:31 +01:00
|
|
|
async saveClearClipboard() {
|
|
|
|
await this.storageService.save(ConstantsService.clearClipboardKey, this.clearClipboard);
|
|
|
|
this.analytics.eventTrack.next({
|
|
|
|
action: 'Set Clear Clipboard ' + (this.clearClipboard == null ? 'Disabled' : this.clearClipboard),
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
2018-02-12 21:06:39 +01:00
|
|
|
private callAnalytics(name: string, enabled: boolean) {
|
|
|
|
const status = enabled ? 'Enabled' : 'Disabled';
|
|
|
|
this.analytics.eventTrack.next({ action: `${status} ${name}` });
|
2018-02-10 05:41:29 +01:00
|
|
|
}
|
|
|
|
}
|