mirror of
https://github.com/bitwarden/browser.git
synced 2025-01-15 20:11:30 +01:00
shortcuts and modal fixes
This commit is contained in:
parent
f80ae40b1a
commit
481d04b2b9
@ -57,12 +57,12 @@
|
|||||||
<div class="box-content condensed">
|
<div class="box-content condensed">
|
||||||
<div class="box-content-row box-content-row-input" appBoxRow>
|
<div class="box-content-row box-content-row-input" appBoxRow>
|
||||||
<label for="min-number">{{'minNumbers' | i18n}}</label>
|
<label for="min-number">{{'minNumbers' | i18n}}</label>
|
||||||
<input id="min-number" type="number" min="0" max="5" (change)="saveOptions()"
|
<input id="min-number" type="number" min="0" max="9" (change)="saveOptions()"
|
||||||
[(ngModel)]="options.minNumber">
|
[(ngModel)]="options.minNumber">
|
||||||
</div>
|
</div>
|
||||||
<div class="box-content-row box-content-row-input" appBoxRow>
|
<div class="box-content-row box-content-row-input" appBoxRow>
|
||||||
<label for="min-special">{{'minSpecial' | i18n}}</label>
|
<label for="min-special">{{'minSpecial' | i18n}}</label>
|
||||||
<input id="min-special" type="number" min="0" max="5" (change)="saveOptions()"
|
<input id="min-special" type="number" min="0" max="9" (change)="saveOptions()"
|
||||||
[(ngModel)]="options.minSpecial">
|
[(ngModel)]="options.minSpecial">
|
||||||
</div>
|
</div>
|
||||||
<div class="box-content-row box-content-row-checkbox" appBoxRow>
|
<div class="box-content-row box-content-row-checkbox" appBoxRow>
|
||||||
|
@ -84,6 +84,9 @@ export class PasswordGeneratorComponent implements OnInit {
|
|||||||
}
|
}
|
||||||
|
|
||||||
private normalizeOptions() {
|
private normalizeOptions() {
|
||||||
|
this.options.minLowercase = 0;
|
||||||
|
this.options.minUppercase = 0;
|
||||||
|
|
||||||
if (!this.options.uppercase && !this.options.lowercase && !this.options.number && !this.options.special) {
|
if (!this.options.uppercase && !this.options.lowercase && !this.options.number && !this.options.special) {
|
||||||
this.options.lowercase = true;
|
this.options.lowercase = true;
|
||||||
const lowercase = document.querySelector('#lowercase') as HTMLInputElement;
|
const lowercase = document.querySelector('#lowercase') as HTMLInputElement;
|
||||||
@ -91,22 +94,31 @@ export class PasswordGeneratorComponent implements OnInit {
|
|||||||
lowercase.checked = true;
|
lowercase.checked = true;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
if (!this.options.minNumber) {
|
|
||||||
this.options.minNumber = 0;
|
|
||||||
} else if (this.options.minNumber > 5) {
|
|
||||||
this.options.minNumber = 5;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!this.options.minSpecial) {
|
|
||||||
this.options.minSpecial = 0;
|
|
||||||
} else if (this.options.minSpecial > 5) {
|
|
||||||
this.options.minSpecial = 5;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!this.options.length) {
|
if (!this.options.length) {
|
||||||
this.options.length = 5;
|
this.options.length = 5;
|
||||||
} else if (this.options.length > 128) {
|
} else if (this.options.length > 128) {
|
||||||
this.options.length = 128;
|
this.options.length = 128;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (!this.options.minNumber) {
|
||||||
|
this.options.minNumber = 0;
|
||||||
|
} else if (this.options.minNumber > this.options.length) {
|
||||||
|
this.options.minNumber = this.options.length;
|
||||||
|
} else if (this.options.minNumber > 9) {
|
||||||
|
this.options.minNumber = 9;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!this.options.minSpecial) {
|
||||||
|
this.options.minSpecial = 0;
|
||||||
|
} else if (this.options.minSpecial > this.options.length) {
|
||||||
|
this.options.minSpecial = this.options.length;
|
||||||
|
} else if (this.options.minSpecial > 9) {
|
||||||
|
this.options.minSpecial = 9;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.options.minSpecial + this.options.minNumber > this.options.length) {
|
||||||
|
this.options.minSpecial = this.options.length - this.options.minNumber;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -27,7 +27,7 @@
|
|||||||
(onDeletedCipher)="deletedCipher($event)"
|
(onDeletedCipher)="deletedCipher($event)"
|
||||||
(onEditAttachments)="editCipherAttachments($event)"
|
(onEditAttachments)="editCipherAttachments($event)"
|
||||||
(onCancelled)="cancelledAddEdit($event)"
|
(onCancelled)="cancelledAddEdit($event)"
|
||||||
(onGeneratePassword)="openPasswordGenerator()">
|
(onGeneratePassword)="openPasswordGenerator(true)">
|
||||||
</app-vault-add-edit>
|
</app-vault-add-edit>
|
||||||
<div id="logo" *ngIf="action !== 'add' && action !== 'edit' && action !== 'view'">
|
<div id="logo" *ngIf="action !== 'add' && action !== 'edit' && action !== 'view'">
|
||||||
<div class="content">
|
<div class="content">
|
||||||
|
@ -43,9 +43,9 @@ export class VaultComponent implements OnInit {
|
|||||||
@ViewChild(AddEditComponent) addEditComponent: AddEditComponent;
|
@ViewChild(AddEditComponent) addEditComponent: AddEditComponent;
|
||||||
@ViewChild(CiphersComponent) ciphersComponent: CiphersComponent;
|
@ViewChild(CiphersComponent) ciphersComponent: CiphersComponent;
|
||||||
@ViewChild(GroupingsComponent) groupingsComponent: GroupingsComponent;
|
@ViewChild(GroupingsComponent) groupingsComponent: GroupingsComponent;
|
||||||
@ViewChild('passwordGenerator', { read: ViewContainerRef }) passwordGeneratorModal: ViewContainerRef;
|
@ViewChild('passwordGenerator', { read: ViewContainerRef }) passwordGeneratorModalRef: ViewContainerRef;
|
||||||
@ViewChild('attachments', { read: ViewContainerRef }) attachmentsModal: ViewContainerRef;
|
@ViewChild('attachments', { read: ViewContainerRef }) attachmentsModalRef: ViewContainerRef;
|
||||||
@ViewChild('folderAddEdit', { read: ViewContainerRef }) folderAddEditModal: ViewContainerRef;
|
@ViewChild('folderAddEdit', { read: ViewContainerRef }) folderAddEditModalRef: ViewContainerRef;
|
||||||
|
|
||||||
action: string;
|
action: string;
|
||||||
cipherId: string = null;
|
cipherId: string = null;
|
||||||
@ -55,6 +55,10 @@ export class VaultComponent implements OnInit {
|
|||||||
collectionId: string = null;
|
collectionId: string = null;
|
||||||
addType: CipherType = null;
|
addType: CipherType = null;
|
||||||
|
|
||||||
|
private passwordGeneratorModal: ModalComponent = null;
|
||||||
|
private folderAddEditModal: ModalComponent = null;
|
||||||
|
private attachmentsModal: ModalComponent = null;
|
||||||
|
|
||||||
constructor(private route: ActivatedRoute, private router: Router, private location: Location,
|
constructor(private route: ActivatedRoute, private router: Router, private location: Location,
|
||||||
private componentFactoryResolver: ComponentFactoryResolver, private i18nService: I18nService,
|
private componentFactoryResolver: ComponentFactoryResolver, private i18nService: I18nService,
|
||||||
private broadcasterService: BroadcasterService, private changeDetectorRef: ChangeDetectorRef,
|
private broadcasterService: BroadcasterService, private changeDetectorRef: ChangeDetectorRef,
|
||||||
@ -82,6 +86,13 @@ export class VaultComponent implements OnInit {
|
|||||||
case 'newFolder':
|
case 'newFolder':
|
||||||
await this.addFolder();
|
await this.addFolder();
|
||||||
break;
|
break;
|
||||||
|
case 'focusSearch':
|
||||||
|
(document.querySelector('#search') as HTMLInputElement).focus();
|
||||||
|
detectChanges = false;
|
||||||
|
break;
|
||||||
|
case 'openPasswordGenerator':
|
||||||
|
await this.openPasswordGenerator(false);
|
||||||
|
break;
|
||||||
default:
|
default:
|
||||||
detectChanges = false;
|
detectChanges = false;
|
||||||
break;
|
break;
|
||||||
@ -103,9 +114,10 @@ export class VaultComponent implements OnInit {
|
|||||||
}
|
}
|
||||||
|
|
||||||
async load(params?: { [key: string]: any }) {
|
async load(params?: { [key: string]: any }) {
|
||||||
|
await this.groupingsComponent.load();
|
||||||
|
|
||||||
if (params == null) {
|
if (params == null) {
|
||||||
this.groupingsComponent.selectedAll = true;
|
this.groupingsComponent.selectedAll = true;
|
||||||
await this.groupingsComponent.load();
|
|
||||||
await this.ciphersComponent.load();
|
await this.ciphersComponent.load();
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
@ -138,7 +150,6 @@ export class VaultComponent implements OnInit {
|
|||||||
await this.filterCollection(params.collectionId);
|
await this.filterCollection(params.collectionId);
|
||||||
} else {
|
} else {
|
||||||
this.groupingsComponent.selectedAll = true;
|
this.groupingsComponent.selectedAll = true;
|
||||||
await this.groupingsComponent.load();
|
|
||||||
await this.ciphersComponent.load();
|
await this.ciphersComponent.load();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -189,11 +200,20 @@ export class VaultComponent implements OnInit {
|
|||||||
}
|
}
|
||||||
|
|
||||||
editCipherAttachments(cipher: CipherView) {
|
editCipherAttachments(cipher: CipherView) {
|
||||||
|
if (this.attachmentsModal != null) {
|
||||||
|
this.attachmentsModal.close();
|
||||||
|
}
|
||||||
|
|
||||||
const factory = this.componentFactoryResolver.resolveComponentFactory(ModalComponent);
|
const factory = this.componentFactoryResolver.resolveComponentFactory(ModalComponent);
|
||||||
const modal = this.attachmentsModal.createComponent(factory).instance;
|
this.attachmentsModal = this.attachmentsModalRef.createComponent(factory).instance;
|
||||||
const childComponent = modal.show<AttachmentsComponent>(AttachmentsComponent, this.attachmentsModal);
|
const childComponent = this.attachmentsModal.show<AttachmentsComponent>(
|
||||||
|
AttachmentsComponent, this.attachmentsModalRef);
|
||||||
|
|
||||||
childComponent.cipherId = cipher.id;
|
childComponent.cipherId = cipher.id;
|
||||||
|
|
||||||
|
this.attachmentsModal.onClosed.subscribe(() => {
|
||||||
|
this.attachmentsModal = null;
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
cancelledAddEdit(cipher: CipherView) {
|
cancelledAddEdit(cipher: CipherView) {
|
||||||
@ -242,48 +262,66 @@ export class VaultComponent implements OnInit {
|
|||||||
this.go();
|
this.go();
|
||||||
}
|
}
|
||||||
|
|
||||||
async openPasswordGenerator() {
|
async openPasswordGenerator(showSelect: boolean) {
|
||||||
const factory = this.componentFactoryResolver.resolveComponentFactory(ModalComponent);
|
if (this.passwordGeneratorModal != null) {
|
||||||
const modal = this.passwordGeneratorModal.createComponent(factory).instance;
|
this.passwordGeneratorModal.close();
|
||||||
const childComponent = modal.show<PasswordGeneratorComponent>(PasswordGeneratorComponent,
|
}
|
||||||
this.passwordGeneratorModal);
|
|
||||||
|
|
||||||
childComponent.showSelect = true;
|
const factory = this.componentFactoryResolver.resolveComponentFactory(ModalComponent);
|
||||||
|
this.passwordGeneratorModal = this.passwordGeneratorModalRef.createComponent(factory).instance;
|
||||||
|
const childComponent = this.passwordGeneratorModal.show<PasswordGeneratorComponent>(PasswordGeneratorComponent,
|
||||||
|
this.passwordGeneratorModalRef);
|
||||||
|
|
||||||
|
childComponent.showSelect = showSelect;
|
||||||
childComponent.onSelected.subscribe((password: string) => {
|
childComponent.onSelected.subscribe((password: string) => {
|
||||||
modal.close();
|
this.passwordGeneratorModal.close();
|
||||||
if (this.addEditComponent != null && this.addEditComponent.cipher != null &&
|
if (this.addEditComponent != null && this.addEditComponent.cipher != null &&
|
||||||
this.addEditComponent.cipher.login != null) {
|
this.addEditComponent.cipher.login != null) {
|
||||||
this.addEditComponent.cipher.login.password = password;
|
this.addEditComponent.cipher.login.password = password;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
this.passwordGeneratorModal.onClosed.subscribe(() => {
|
||||||
|
this.passwordGeneratorModal = null;
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
async addFolder() {
|
async addFolder() {
|
||||||
const factory = this.componentFactoryResolver.resolveComponentFactory(ModalComponent);
|
const factory = this.componentFactoryResolver.resolveComponentFactory(ModalComponent);
|
||||||
const modal = this.folderAddEditModal.createComponent(factory).instance;
|
this.folderAddEditModal = this.folderAddEditModalRef.createComponent(factory).instance;
|
||||||
const childComponent = modal.show<FolderAddEditComponent>(FolderAddEditComponent, this.folderAddEditModal);
|
const childComponent = this.folderAddEditModal.show<FolderAddEditComponent>(
|
||||||
|
FolderAddEditComponent, this.folderAddEditModalRef);
|
||||||
|
|
||||||
childComponent.folderId = null;
|
childComponent.folderId = null;
|
||||||
childComponent.onSavedFolder.subscribe(async (folder: FolderView) => {
|
childComponent.onSavedFolder.subscribe(async (folder: FolderView) => {
|
||||||
modal.close();
|
this.folderAddEditModal.close();
|
||||||
await this.groupingsComponent.loadFolders();
|
await this.groupingsComponent.loadFolders();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
this.folderAddEditModal.onClosed.subscribe(() => {
|
||||||
|
this.folderAddEditModal = null;
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
async editFolder(folderId: string) {
|
async editFolder(folderId: string) {
|
||||||
const factory = this.componentFactoryResolver.resolveComponentFactory(ModalComponent);
|
const factory = this.componentFactoryResolver.resolveComponentFactory(ModalComponent);
|
||||||
const modal = this.folderAddEditModal.createComponent(factory).instance;
|
this.folderAddEditModal = this.folderAddEditModalRef.createComponent(factory).instance;
|
||||||
const childComponent = modal.show<FolderAddEditComponent>(FolderAddEditComponent, this.folderAddEditModal);
|
const childComponent = this.folderAddEditModal.show<FolderAddEditComponent>(
|
||||||
|
FolderAddEditComponent, this.folderAddEditModalRef);
|
||||||
|
|
||||||
childComponent.folderId = folderId;
|
childComponent.folderId = folderId;
|
||||||
childComponent.onSavedFolder.subscribe(async (folder: FolderView) => {
|
childComponent.onSavedFolder.subscribe(async (folder: FolderView) => {
|
||||||
modal.close();
|
this.folderAddEditModal.close();
|
||||||
await this.groupingsComponent.loadFolders();
|
await this.groupingsComponent.loadFolders();
|
||||||
});
|
});
|
||||||
childComponent.onDeletedFolder.subscribe(async (folder: FolderView) => {
|
childComponent.onDeletedFolder.subscribe(async (folder: FolderView) => {
|
||||||
modal.close();
|
this.folderAddEditModal.close();
|
||||||
await this.groupingsComponent.loadFolders();
|
await this.groupingsComponent.loadFolders();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
this.folderAddEditModal.onClosed.subscribe(() => {
|
||||||
|
this.folderAddEditModal = null;
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
private clearFilters() {
|
private clearFilters() {
|
||||||
|
@ -30,7 +30,7 @@
|
|||||||
"message": "Collections"
|
"message": "Collections"
|
||||||
},
|
},
|
||||||
"searchVault": {
|
"searchVault": {
|
||||||
"message": "Search vault"
|
"message": "Search Vault"
|
||||||
},
|
},
|
||||||
"addItem": {
|
"addItem": {
|
||||||
"message": "Add Item"
|
"message": "Add Item"
|
||||||
@ -335,16 +335,16 @@
|
|||||||
"message": "Avoid Ambiguous Characters"
|
"message": "Avoid Ambiguous Characters"
|
||||||
},
|
},
|
||||||
"searchCollection": {
|
"searchCollection": {
|
||||||
"message": "Search collection"
|
"message": "Search Collection"
|
||||||
},
|
},
|
||||||
"searchFolder": {
|
"searchFolder": {
|
||||||
"message": "Search folder"
|
"message": "Search Folder"
|
||||||
},
|
},
|
||||||
"searchFavorites": {
|
"searchFavorites": {
|
||||||
"message": "Search favorites"
|
"message": "Search Favorites"
|
||||||
},
|
},
|
||||||
"searchType": {
|
"searchType": {
|
||||||
"message": "Search type",
|
"message": "Search Type",
|
||||||
"description": "Search item type"
|
"description": "Search item type"
|
||||||
},
|
},
|
||||||
"newAttachment": {
|
"newAttachment": {
|
||||||
@ -624,5 +624,11 @@
|
|||||||
},
|
},
|
||||||
"loading": {
|
"loading": {
|
||||||
"message": "Loading..."
|
"message": "Loading..."
|
||||||
|
},
|
||||||
|
"lock": {
|
||||||
|
"message": "Lock"
|
||||||
|
},
|
||||||
|
"passwordGenerator": {
|
||||||
|
"message": "Password Generator"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -18,7 +18,7 @@ export class MenuMain {
|
|||||||
|
|
||||||
const template: MenuItemConstructorOptions[] = [
|
const template: MenuItemConstructorOptions[] = [
|
||||||
{
|
{
|
||||||
label: 'File',
|
label: this.i18nService.t('file'),
|
||||||
submenu: [
|
submenu: [
|
||||||
{
|
{
|
||||||
label: this.i18nService.t('addNewLogin'),
|
label: this.i18nService.t('addNewLogin'),
|
||||||
@ -34,25 +34,29 @@ export class MenuMain {
|
|||||||
label: this.i18nService.t('typeLogin'),
|
label: this.i18nService.t('typeLogin'),
|
||||||
click() {
|
click() {
|
||||||
self.send('newLogin');
|
self.send('newLogin');
|
||||||
}
|
},
|
||||||
|
accelerator: 'Alt+L'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: this.i18nService.t('typeCard'),
|
label: this.i18nService.t('typeCard'),
|
||||||
click() {
|
click() {
|
||||||
self.send('newCard');
|
self.send('newCard');
|
||||||
}
|
},
|
||||||
|
accelerator: 'Alt+C'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: this.i18nService.t('typeIdentity'),
|
label: this.i18nService.t('typeIdentity'),
|
||||||
click() {
|
click() {
|
||||||
self.send('newIdentity');
|
self.send('newIdentity');
|
||||||
}
|
},
|
||||||
|
accelerator: 'Alt+I'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: this.i18nService.t('typeSecureNote'),
|
label: this.i18nService.t('typeSecureNote'),
|
||||||
click() {
|
click() {
|
||||||
self.send('newSecureNote');
|
self.send('newSecureNote');
|
||||||
}
|
},
|
||||||
|
accelerator: 'Alt+S'
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
@ -71,7 +75,7 @@ export class MenuMain {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: 'Lock',
|
label: this.i18nService.t('lock'),
|
||||||
click() {
|
click() {
|
||||||
self.send('lockApp');
|
self.send('lockApp');
|
||||||
},
|
},
|
||||||
@ -94,22 +98,30 @@ export class MenuMain {
|
|||||||
{
|
{
|
||||||
label: this.i18nService.t('view'),
|
label: this.i18nService.t('view'),
|
||||||
submenu: [
|
submenu: [
|
||||||
{ role: 'reload' },
|
|
||||||
{ role: 'forcereload' },
|
|
||||||
{ role: 'toggledevtools' },
|
|
||||||
{ type: 'separator' },
|
|
||||||
{
|
{
|
||||||
role: 'resetzoom',
|
label: this.i18nService.t('passwordGenerator'),
|
||||||
accelerator: 'CmdOrCtrl+0' },
|
click() {
|
||||||
|
self.send('openPasswordGenerator');
|
||||||
|
},
|
||||||
|
accelerator: 'CmdOrCtrl+G'
|
||||||
|
},
|
||||||
{
|
{
|
||||||
role: 'zoomin',
|
label: this.i18nService.t('searchVault'),
|
||||||
accelerator: 'CmdOrCtrl+=' },
|
click() {
|
||||||
{
|
self.send('focusSearch');
|
||||||
role: 'zoomout',
|
},
|
||||||
accelerator: 'CmdOrCtrl+-'
|
accelerator: 'CmdOrCtrl+F'
|
||||||
},
|
},
|
||||||
{ type: 'separator' },
|
{ type: 'separator' },
|
||||||
{ role: 'togglefullscreen' }
|
{ role: 'resetzoom', accelerator: 'CmdOrCtrl+0' },
|
||||||
|
{ role: 'zoomin', accelerator: 'CmdOrCtrl+=' },
|
||||||
|
{ role: 'zoomout', accelerator: 'CmdOrCtrl+-' },
|
||||||
|
{ type: 'separator' },
|
||||||
|
{ role: 'togglefullscreen' },
|
||||||
|
{ type: 'separator' },
|
||||||
|
{ role: 'reload', accelerator: 'Alt+Shift+R' },
|
||||||
|
{ role: 'forcereload' },
|
||||||
|
{ role: 'toggledevtools' },
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
Loading…
Reference in New Issue
Block a user