2018-04-05 04:59:42 +02:00
|
|
|
import {
|
2018-04-06 21:33:20 +02:00
|
|
|
ChangeDetectorRef,
|
2018-04-05 04:59:42 +02:00
|
|
|
Component,
|
|
|
|
NgZone,
|
|
|
|
OnDestroy,
|
|
|
|
OnInit,
|
|
|
|
} from '@angular/core';
|
|
|
|
import { Router } from '@angular/router';
|
|
|
|
|
2018-04-06 20:03:35 +02:00
|
|
|
import { ToasterService } from 'angular2-toaster';
|
|
|
|
import { Angulartics2 } from 'angulartics2';
|
|
|
|
|
|
|
|
import { BrowserApi } from '../../browser/browserApi';
|
|
|
|
|
2018-04-06 21:33:20 +02:00
|
|
|
import { BroadcasterService } from 'jslib/angular/services/broadcaster.service';
|
|
|
|
|
2018-04-06 20:03:35 +02:00
|
|
|
import { CipherType } from 'jslib/enums/cipherType';
|
|
|
|
|
|
|
|
import { CipherView } from 'jslib/models/view/cipherView';
|
|
|
|
|
|
|
|
import { CipherService } from 'jslib/abstractions/cipher.service';
|
|
|
|
import { I18nService } from 'jslib/abstractions/i18n.service';
|
|
|
|
import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service';
|
2018-04-11 04:49:19 +02:00
|
|
|
import { SyncService } from 'jslib/abstractions/sync.service';
|
2018-04-15 03:12:04 +02:00
|
|
|
import { UtilsService } from 'jslib/abstractions/utils.service';
|
2018-04-06 20:03:35 +02:00
|
|
|
|
|
|
|
import { AutofillService } from '../../services/abstractions/autofill.service';
|
|
|
|
|
|
|
|
import { PopupUtilsService } from '../services/popup-utils.service';
|
2018-04-06 21:33:20 +02:00
|
|
|
|
|
|
|
const BroadcasterSubscriptionId = 'CurrentTabComponent';
|
2018-04-06 20:03:35 +02:00
|
|
|
|
2018-04-05 04:59:42 +02:00
|
|
|
@Component({
|
2018-04-06 20:03:35 +02:00
|
|
|
selector: 'app-current-tab',
|
|
|
|
templateUrl: 'current-tab.component.html',
|
2018-04-05 04:59:42 +02:00
|
|
|
})
|
2018-04-06 21:33:20 +02:00
|
|
|
export class CurrentTabComponent implements OnInit, OnDestroy {
|
2018-04-06 20:03:35 +02:00
|
|
|
pageDetails: any[] = [];
|
2018-04-06 20:18:28 +02:00
|
|
|
cardCiphers: CipherView[];
|
|
|
|
identityCiphers: CipherView[];
|
|
|
|
loginCiphers: CipherView[];
|
2018-04-06 20:03:35 +02:00
|
|
|
url: string;
|
2018-04-15 03:12:04 +02:00
|
|
|
hostname: string;
|
2018-04-09 16:50:28 +02:00
|
|
|
searchText: string;
|
2018-04-06 20:03:35 +02:00
|
|
|
inSidebar = false;
|
2018-04-14 18:52:46 +02:00
|
|
|
showLeftHeader = false;
|
2018-04-06 20:03:35 +02:00
|
|
|
loaded = false;
|
2018-04-11 04:49:19 +02:00
|
|
|
loadedTimeout: number;
|
2018-04-06 20:03:35 +02:00
|
|
|
|
|
|
|
constructor(private platformUtilsService: PlatformUtilsService, private cipherService: CipherService,
|
|
|
|
private popupUtilsService: PopupUtilsService, private autofillService: AutofillService,
|
|
|
|
private analytics: Angulartics2, private toasterService: ToasterService,
|
2018-04-06 21:33:20 +02:00
|
|
|
private i18nService: I18nService, private router: Router,
|
|
|
|
private ngZone: NgZone, private broadcasterService: BroadcasterService,
|
2018-04-15 03:12:04 +02:00
|
|
|
private changeDetectorRef: ChangeDetectorRef, private syncService: SyncService,
|
|
|
|
private utilsService: UtilsService) { }
|
2018-04-06 20:03:35 +02:00
|
|
|
|
2018-04-11 04:49:19 +02:00
|
|
|
async ngOnInit() {
|
2018-04-14 18:52:46 +02:00
|
|
|
this.showLeftHeader = !this.platformUtilsService.isSafari();
|
|
|
|
this.inSidebar = this.popupUtilsService.inSidebar(window);
|
|
|
|
|
2018-04-06 21:33:20 +02:00
|
|
|
this.broadcasterService.subscribe(BroadcasterSubscriptionId, (message: any) => {
|
|
|
|
this.ngZone.run(async () => {
|
|
|
|
switch (message.command) {
|
|
|
|
case 'syncCompleted':
|
|
|
|
if (this.loaded) {
|
2018-04-11 04:49:19 +02:00
|
|
|
window.setTimeout(() => {
|
2018-04-06 21:33:20 +02:00
|
|
|
this.load();
|
|
|
|
}, 500);
|
|
|
|
}
|
|
|
|
break;
|
|
|
|
case 'collectPageDetailsResponse':
|
|
|
|
if (message.sender === BroadcasterSubscriptionId) {
|
|
|
|
this.pageDetails.push({
|
|
|
|
frameId: message.webExtSender.frameId,
|
|
|
|
tab: message.tab,
|
|
|
|
details: message.details,
|
|
|
|
});
|
|
|
|
}
|
|
|
|
break;
|
2018-04-11 04:49:19 +02:00
|
|
|
case 'syncCompleted':
|
|
|
|
if (message.successfully) {
|
|
|
|
await this.load();
|
|
|
|
}
|
|
|
|
break;
|
2018-04-06 21:33:20 +02:00
|
|
|
default:
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
|
|
|
|
this.changeDetectorRef.detectChanges();
|
2018-04-11 05:49:46 +02:00
|
|
|
});
|
2018-04-06 21:33:20 +02:00
|
|
|
});
|
|
|
|
|
2018-04-11 04:49:19 +02:00
|
|
|
if (!this.syncService.syncInProgress) {
|
|
|
|
await this.load();
|
|
|
|
} else {
|
|
|
|
this.loadedTimeout = window.setTimeout(async () => {
|
|
|
|
if (!this.loaded) {
|
|
|
|
await this.load();
|
|
|
|
}
|
2018-04-14 19:40:25 +02:00
|
|
|
}, 5000);
|
2018-04-11 04:49:19 +02:00
|
|
|
}
|
2018-04-18 21:49:03 +02:00
|
|
|
|
|
|
|
window.setTimeout(() => {
|
|
|
|
document.getElementById('search').focus();
|
2018-04-18 21:50:26 +02:00
|
|
|
}, 100);
|
2018-04-06 20:03:35 +02:00
|
|
|
}
|
|
|
|
|
2018-04-06 21:33:20 +02:00
|
|
|
ngOnDestroy() {
|
2018-04-11 04:49:19 +02:00
|
|
|
window.clearTimeout(this.loadedTimeout);
|
2018-04-06 21:33:20 +02:00
|
|
|
this.broadcasterService.unsubscribe(BroadcasterSubscriptionId);
|
|
|
|
}
|
|
|
|
|
2018-04-06 20:03:35 +02:00
|
|
|
async refresh() {
|
|
|
|
await this.load();
|
|
|
|
}
|
|
|
|
|
|
|
|
addCipher() {
|
2018-04-15 03:12:04 +02:00
|
|
|
this.router.navigate(['/add-cipher'], { queryParams: { name: this.hostname, uri: this.url } });
|
2018-04-06 20:03:35 +02:00
|
|
|
}
|
2018-04-05 04:59:42 +02:00
|
|
|
|
2018-04-06 20:03:35 +02:00
|
|
|
viewCipher(cipher: CipherView) {
|
|
|
|
this.router.navigate(['/view-cipher'], { queryParams: { cipherId: cipher.id } });
|
2018-04-05 04:59:42 +02:00
|
|
|
}
|
2018-04-06 20:03:35 +02:00
|
|
|
|
|
|
|
async fillCipher(cipher: CipherView) {
|
2018-04-14 20:56:30 +02:00
|
|
|
if (this.pageDetails == null || this.pageDetails.length === 0) {
|
2018-04-06 20:03:35 +02:00
|
|
|
this.analytics.eventTrack.next({ action: 'Autofilled Error' });
|
|
|
|
this.toasterService.popAsync('error', null, this.i18nService.t('autofillError'));
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
try {
|
|
|
|
const totpCode = await this.autofillService.doAutoFill({
|
|
|
|
cipher: cipher,
|
|
|
|
pageDetails: this.pageDetails,
|
|
|
|
doc: window.document,
|
|
|
|
});
|
|
|
|
|
|
|
|
this.analytics.eventTrack.next({ action: 'Autofilled' });
|
2018-04-23 16:02:30 +02:00
|
|
|
if (totpCode != null) {
|
2018-04-06 20:03:35 +02:00
|
|
|
this.platformUtilsService.copyToClipboard(totpCode, { doc: window.document });
|
|
|
|
}
|
|
|
|
|
|
|
|
if (this.popupUtilsService.inPopup(window)) {
|
2018-04-18 22:38:01 +02:00
|
|
|
BrowserApi.closePopup(window);
|
2018-04-06 20:03:35 +02:00
|
|
|
}
|
|
|
|
} catch {
|
|
|
|
this.analytics.eventTrack.next({ action: 'Autofilled Error' });
|
|
|
|
this.toasterService.popAsync('error', null, this.i18nService.t('autofillError'));
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
searchVault() {
|
2018-04-18 21:49:03 +02:00
|
|
|
if (this.searchText == null || this.searchText.length < 2) {
|
|
|
|
return;
|
|
|
|
}
|
2018-04-09 16:50:28 +02:00
|
|
|
this.router.navigate(['/tabs/vault'], { queryParams: { searchText: this.searchText } });
|
2018-04-06 20:03:35 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
private async load() {
|
|
|
|
const tab = await BrowserApi.getTabFromCurrentWindow();
|
2018-04-14 06:02:55 +02:00
|
|
|
if (tab != null) {
|
2018-04-06 20:03:35 +02:00
|
|
|
this.url = tab.url;
|
|
|
|
} else {
|
2018-04-14 06:02:55 +02:00
|
|
|
this.loginCiphers = [];
|
2018-04-06 20:03:35 +02:00
|
|
|
this.loaded = true;
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2018-04-15 03:12:04 +02:00
|
|
|
this.hostname = this.utilsService.getHostname(this.url);
|
2018-04-06 20:03:35 +02:00
|
|
|
BrowserApi.tabSendMessage(tab, {
|
|
|
|
command: 'collectPageDetails',
|
|
|
|
tab: tab,
|
2018-04-06 21:33:20 +02:00
|
|
|
sender: BroadcasterSubscriptionId,
|
2018-04-06 20:03:35 +02:00
|
|
|
});
|
|
|
|
|
|
|
|
const ciphers = await this.cipherService.getAllDecryptedForUrl(this.url, [
|
|
|
|
CipherType.Card,
|
|
|
|
CipherType.Identity,
|
|
|
|
]);
|
|
|
|
|
2018-04-06 20:18:28 +02:00
|
|
|
this.loginCiphers = [];
|
|
|
|
this.cardCiphers = [];
|
|
|
|
this.identityCiphers = [];
|
|
|
|
|
2018-04-06 20:03:35 +02:00
|
|
|
ciphers.forEach((c) => {
|
|
|
|
switch (c.type) {
|
|
|
|
case CipherType.Login:
|
|
|
|
this.loginCiphers.push(c);
|
|
|
|
break;
|
|
|
|
case CipherType.Card:
|
|
|
|
this.cardCiphers.push(c);
|
|
|
|
break;
|
|
|
|
case CipherType.Identity:
|
|
|
|
this.identityCiphers.push(c);
|
|
|
|
break;
|
|
|
|
default:
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
2018-04-14 03:23:11 +02:00
|
|
|
this.loginCiphers = this.loginCiphers.sort((a, b) => this.cipherService.sortCiphersByLastUsedThenName(a, b));
|
2018-04-06 20:03:35 +02:00
|
|
|
this.loaded = true;
|
|
|
|
}
|
2018-04-05 04:59:42 +02:00
|
|
|
}
|