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,
|
2018-04-06 21:33:20 +02:00
|
|
|
NgZone,
|
|
|
|
OnDestroy,
|
2018-04-05 04:59:42 +02:00
|
|
|
OnInit,
|
|
|
|
} from '@angular/core';
|
2018-04-09 16:50:28 +02:00
|
|
|
import {
|
|
|
|
ActivatedRoute,
|
|
|
|
Router,
|
|
|
|
} from '@angular/router';
|
2018-04-05 16:29:11 +02:00
|
|
|
|
|
|
|
import { CipherType } from 'jslib/enums/cipherType';
|
|
|
|
|
2018-04-05 21:35:56 +02:00
|
|
|
import { CollectionView } from 'jslib/models/view/collectionView';
|
2018-04-05 16:29:11 +02:00
|
|
|
import { CipherView } from 'jslib/models/view/cipherView';
|
2018-04-05 21:35:56 +02:00
|
|
|
import { FolderView } from 'jslib/models/view/folderView';
|
2018-04-05 16:29:11 +02:00
|
|
|
|
|
|
|
import { CollectionService } from 'jslib/abstractions/collection.service';
|
|
|
|
import { CipherService } from 'jslib/abstractions/cipher.service';
|
|
|
|
import { FolderService } from 'jslib/abstractions/folder.service';
|
2018-04-09 20:17:58 +02:00
|
|
|
import { StateService } from 'jslib/abstractions/state.service';
|
2018-04-05 16:29:11 +02:00
|
|
|
|
2018-04-06 21:33:20 +02:00
|
|
|
import { BroadcasterService } from 'jslib/angular/services/broadcaster.service';
|
|
|
|
|
2018-04-05 16:29:11 +02:00
|
|
|
import { GroupingsComponent as BaseGroupingsComponent } from 'jslib/angular/components/groupings.component';
|
2018-04-05 04:59:42 +02:00
|
|
|
|
2018-04-09 20:17:58 +02:00
|
|
|
import { PopupUtilsService } from '../services/popup-utils.service';
|
|
|
|
|
|
|
|
const ComponentId = 'GroupingsComponent';
|
2018-04-06 21:33:20 +02:00
|
|
|
|
2018-04-05 04:59:42 +02:00
|
|
|
@Component({
|
|
|
|
selector: 'app-vault-groupings',
|
2018-04-06 17:48:45 +02:00
|
|
|
templateUrl: 'groupings.component.html',
|
2018-04-05 04:59:42 +02:00
|
|
|
})
|
2018-04-06 21:33:20 +02:00
|
|
|
export class GroupingsComponent extends BaseGroupingsComponent implements OnInit, OnDestroy {
|
2018-04-05 16:29:11 +02:00
|
|
|
ciphers: CipherView[];
|
|
|
|
favoriteCiphers: CipherView[];
|
2018-04-05 23:27:31 +02:00
|
|
|
noFolderCiphers: CipherView[];
|
|
|
|
folderCount: number;
|
2018-04-05 16:29:11 +02:00
|
|
|
folderCounts = new Map<string, number>();
|
|
|
|
collectionCounts = new Map<string, number>();
|
|
|
|
typeCounts = new Map<CipherType, number>();
|
2018-04-05 23:27:31 +02:00
|
|
|
showNoFolderCiphers = false;
|
2018-04-09 16:50:28 +02:00
|
|
|
searchText: string;
|
2018-04-09 20:17:58 +02:00
|
|
|
state: any;
|
2018-04-05 16:29:11 +02:00
|
|
|
|
|
|
|
constructor(collectionService: CollectionService, folderService: FolderService,
|
2018-04-06 21:33:20 +02:00
|
|
|
private cipherService: CipherService, private router: Router,
|
|
|
|
private ngZone: NgZone, private broadcasterService: BroadcasterService,
|
2018-04-09 20:17:58 +02:00
|
|
|
private changeDetectorRef: ChangeDetectorRef, private route: ActivatedRoute,
|
|
|
|
private stateService: StateService, private popupUtils: PopupUtilsService) {
|
2018-04-05 16:29:11 +02:00
|
|
|
super(collectionService, folderService);
|
|
|
|
}
|
|
|
|
|
2018-04-06 21:33:20 +02:00
|
|
|
ngOnInit() {
|
2018-04-09 20:17:58 +02:00
|
|
|
this.stateService.remove('CiphersComponent');
|
|
|
|
|
|
|
|
this.broadcasterService.subscribe(ComponentId, (message: any) => {
|
2018-04-06 21:33:20 +02:00
|
|
|
this.ngZone.run(async () => {
|
|
|
|
switch (message.command) {
|
|
|
|
case 'syncCompleted':
|
|
|
|
window.setTimeout(() => {
|
|
|
|
this.load();
|
|
|
|
}, 500);
|
|
|
|
break;
|
|
|
|
default:
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
|
|
|
|
this.changeDetectorRef.detectChanges();
|
|
|
|
})
|
|
|
|
});
|
|
|
|
|
2018-04-09 16:50:28 +02:00
|
|
|
this.route.queryParams.subscribe(async (params) => {
|
2018-04-09 20:17:58 +02:00
|
|
|
this.state = (await this.stateService.get<any>(ComponentId)) || {};
|
|
|
|
if (this.state.searchText) {
|
|
|
|
this.searchText = this.state.searchText;
|
|
|
|
} else if (params.searchText) {
|
2018-04-09 16:50:28 +02:00
|
|
|
this.searchText = params.searchText;
|
|
|
|
}
|
|
|
|
|
|
|
|
this.load();
|
2018-04-09 20:17:58 +02:00
|
|
|
window.setTimeout(() => this.popupUtils.setContentScrollY(window, this.state.scrollY), 0);
|
2018-04-09 16:50:28 +02:00
|
|
|
});
|
2018-04-06 21:33:20 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
ngOnDestroy() {
|
2018-04-09 20:17:58 +02:00
|
|
|
this.saveState();
|
|
|
|
this.broadcasterService.unsubscribe(ComponentId);
|
2018-04-06 21:33:20 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
async load() {
|
2018-04-05 23:27:31 +02:00
|
|
|
await super.load();
|
2018-04-05 21:35:56 +02:00
|
|
|
super.loaded = false;
|
2018-04-05 23:27:31 +02:00
|
|
|
|
2018-04-05 16:29:11 +02:00
|
|
|
await this.loadCiphers();
|
2018-04-05 23:27:31 +02:00
|
|
|
this.showNoFolderCiphers = this.noFolderCiphers != null && this.noFolderCiphers.length < 100 &&
|
|
|
|
this.collections.length === 0;
|
|
|
|
if (this.showNoFolderCiphers) {
|
|
|
|
// Remove "No Folder" from folder listing
|
|
|
|
this.folders.pop();
|
|
|
|
this.folderCount = this.folders.length;
|
|
|
|
} else {
|
|
|
|
this.folderCount = this.folders.length - 1;
|
|
|
|
}
|
|
|
|
|
2018-04-05 21:35:56 +02:00
|
|
|
super.loaded = true;
|
2018-04-05 16:29:11 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
async loadCiphers() {
|
|
|
|
this.ciphers = await this.cipherService.getAllDecrypted();
|
|
|
|
this.ciphers.forEach((c) => {
|
|
|
|
if (c.favorite) {
|
|
|
|
if (this.favoriteCiphers == null) {
|
|
|
|
this.favoriteCiphers = [];
|
|
|
|
}
|
|
|
|
this.favoriteCiphers.push(c);
|
|
|
|
}
|
|
|
|
|
2018-04-05 23:27:31 +02:00
|
|
|
if (c.folderId == null) {
|
|
|
|
if (this.noFolderCiphers == null) {
|
|
|
|
this.noFolderCiphers = [];
|
|
|
|
}
|
|
|
|
this.noFolderCiphers.push(c);
|
|
|
|
}
|
|
|
|
|
2018-04-05 16:29:11 +02:00
|
|
|
if (this.typeCounts.has(c.type)) {
|
|
|
|
this.typeCounts.set(c.type, this.typeCounts.get(c.type) + 1);
|
|
|
|
} else {
|
|
|
|
this.typeCounts.set(c.type, 1);
|
|
|
|
}
|
|
|
|
|
|
|
|
if (this.folderCounts.has(c.folderId)) {
|
|
|
|
this.folderCounts.set(c.folderId, this.folderCounts.get(c.folderId) + 1);
|
|
|
|
} else {
|
|
|
|
this.folderCounts.set(c.folderId, 1);
|
|
|
|
}
|
2018-04-05 04:59:42 +02:00
|
|
|
|
2018-04-05 16:29:11 +02:00
|
|
|
if (c.collectionIds != null) {
|
|
|
|
c.collectionIds.forEach((colId) => {
|
|
|
|
if (this.collectionCounts.has(colId)) {
|
|
|
|
this.collectionCounts.set(colId, this.collectionCounts.get(colId) + 1);
|
|
|
|
} else {
|
|
|
|
this.collectionCounts.set(colId, 1);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
});
|
2018-04-05 04:59:42 +02:00
|
|
|
}
|
2018-04-05 21:35:56 +02:00
|
|
|
|
2018-04-09 20:17:58 +02:00
|
|
|
async selectType(type: CipherType) {
|
2018-04-05 21:35:56 +02:00
|
|
|
super.selectType(type);
|
2018-04-05 21:56:52 +02:00
|
|
|
this.router.navigate(['/ciphers'], { queryParams: { type: type } });
|
2018-04-05 21:35:56 +02:00
|
|
|
}
|
|
|
|
|
2018-04-09 20:17:58 +02:00
|
|
|
async selectFolder(folder: FolderView) {
|
2018-04-05 21:35:56 +02:00
|
|
|
super.selectFolder(folder);
|
2018-04-09 20:45:35 +02:00
|
|
|
this.router.navigate(['/ciphers'], { queryParams: { folderId: folder.id || 'none' } });
|
2018-04-05 21:35:56 +02:00
|
|
|
}
|
|
|
|
|
2018-04-09 20:17:58 +02:00
|
|
|
async selectCollection(collection: CollectionView) {
|
2018-04-05 21:35:56 +02:00
|
|
|
super.selectCollection(collection);
|
2018-04-05 21:56:52 +02:00
|
|
|
this.router.navigate(['/ciphers'], { queryParams: { collectionId: collection.id } });
|
2018-04-05 21:35:56 +02:00
|
|
|
}
|
2018-04-06 05:49:04 +02:00
|
|
|
|
2018-04-09 20:17:58 +02:00
|
|
|
async selectCipher(cipher: CipherView) {
|
2018-04-06 05:49:04 +02:00
|
|
|
this.router.navigate(['/view-cipher'], { queryParams: { cipherId: cipher.id } });
|
|
|
|
}
|
|
|
|
|
2018-04-09 20:17:58 +02:00
|
|
|
async addCipher() {
|
2018-04-06 05:49:04 +02:00
|
|
|
this.router.navigate(['/add-cipher']);
|
|
|
|
}
|
2018-04-09 20:17:58 +02:00
|
|
|
|
|
|
|
private async saveState() {
|
|
|
|
this.state = {
|
|
|
|
scrollY: this.popupUtils.getContentScrollY(window),
|
|
|
|
searchText: this.searchText,
|
|
|
|
};
|
|
|
|
await this.stateService.save(ComponentId, this.state);
|
|
|
|
}
|
2018-04-05 04:59:42 +02:00
|
|
|
}
|