vaultwarden
/
bitwarden-estensione-browser
mirror of https://github.com/bitwarden/browser
1
0
Fork 0
Code Issues 1 Releases Wiki Activity

settings page initial implementation

This commit is contained in:
Kyle Spearrin 2018-04-10 16:20:49 -04:00
parent 13620bfb6a
commit 4a663efeaf
4 changed files with 223 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/_locales/en/messages.json
View File

@ -431,12 +431,6 @@
"twoStepLoginConfirmation": {
"message": "Two-step login makes your account more secure by requiring you to verify your login with another device such as a security key, authenticator app, SMS, phone call, or email. Two-step login can be enabled on the bitwarden.com web vault. Do you want to visit the website now?"
},
"loggingOut": {
"message": "Logging out"
},
"loggingOutConfirmation": {
"message": "You've recently updated from an older version. You must re-log in to change your lock options. Do you want to log out now?"
},
"editedFolder": {
"message": "Edited Folder"
},

3
src/popup2/app-routing.animations.ts
View File

@ -112,4 +112,7 @@ export const routerTransition = trigger('routerTransition', [
transition('tabs => export', inSlideUp),
transition('export => tabs', outSlideDown),
transition('tabs => lock', inSlideDown),
transition('lock => tabs', outSlideUp),
]);

93
src/popup2/settings/settings.component.html
View File

@ -8,9 +8,98 @@
<div class="right"></div>
</header>
<content>
<div class="box list">
<div class="box">
<div class="box-header">{{'manage' | i18n}}</div>
<div class="box-content">
<a class="box-content-row box-content-row-flex text-default" href="#">
<div class="row-main">{{'folders' | i18n}}</div>
<i class="fa fa-chevron-right fa-lg row-sub-icon"></i>
</a>
<a class="box-content-row box-content-row-flex text-default" href="#">
<div class="row-main">{{'sync' | i18n}}</div>
<i class="fa fa-chevron-right fa-lg row-sub-icon"></i>
</a>
</div>
</div>
<div class="box">
<div class="box-header">{{'security' | i18n}}</div>
<div class="box-content">
<div class="box-content-row" appBoxRow>
<label for="lockOption">{{'lockOptions' | i18n}}</label>
<select id="lockOption" name="LockOptions" [(ngModel)]="lockOption" (change)="saveLockOption()">
<option *ngFor="let o of lockOptions" [ngValue]="o.value">{{o.name}}</option>
</select>
</div>
<a class="box-content-row box-content-row-flex text-default" href="#"
appStopClick appBlurClick (click)="lock()">
<div class="row-main">{{'lockNow' | i18n}}</div>
<i class="fa fa-chevron-right fa-lg row-sub-icon"></i>
</a>
<a class="box-content-row box-content-row-flex text-default" href="#"
appStopClick appBlurClick (click)="twoStep()">
<div class="row-main">{{'twoStepLogin' | i18n}}</div>
<i class="fa fa-chevron-right fa-lg row-sub-icon"></i>
</a>
</div>
</div>
<div class="box">
<div class="box-header">{{'account' | i18n}}</div>
<div class="box-content">
<a class="box-content-row box-content-row-flex text-default" href="#">
<div class="row-main">{{'premiumMembership' | i18n}}</div>
<i class="fa fa-chevron-right fa-lg row-sub-icon"></i>
</a>
<a class="box-content-row box-content-row-flex text-default" href="#"
appStopClick appBlurClick (click)="changePassword()">
<div class="row-main">{{'changeMasterPassword' | i18n}}</div>
<i class="fa fa-chevron-right fa-lg row-sub-icon"></i>
</a>
<a class="box-content-row box-content-row-flex text-default" href="#"
appStopClick appBlurClick (click)="logOut()">
<div class="row-main">{{'logOut' | i18n}}</div>
<i class="fa fa-chevron-right fa-lg row-sub-icon"></i>
</a>
</div>
</div>
<div class="box">
<div class="box-header">{{'tools' | i18n}}</div>
<div class="box-content">
<a class="box-content-row box-content-row-flex text-default" href="#"
appStopClick appBlurClick (click)="import()">
<div class="row-main">{{'importItems' | i18n}}</div>
<i class="fa fa-chevron-right fa-lg row-sub-icon"></i>
</a>
<a class="box-content-row box-content-row-flex text-default" href="#">
<div class="row-main">{{'exportVault' | i18n}}</div>
<i class="fa fa-chevron-right fa-lg row-sub-icon"></i>
</a>
<a class="box-content-row box-content-row-flex text-default" href="#">
<div class="row-main">{{'shareVault' | i18n}}</div>
<i class="fa fa-chevron-right fa-lg row-sub-icon"></i>
</a>
</div>
</div>
<div class="box">
<div class="box-header">{{'other' | i18n}}</div>
<div class="box-content">
<a class="box-content-row box-content-row-flex text-default" href="#">
<div class="row-main">{{'options' | i18n}}</div>
<i class="fa fa-chevron-right fa-lg row-sub-icon"></i>
</a>
<a class="box-content-row box-content-row-flex text-default" href="#">
<div class="row-main">{{'about' | i18n}}</div>
<i class="fa fa-chevron-right fa-lg row-sub-icon"></i>
</a>
<a class="box-content-row box-content-row-flex text-default" href="#">
<div class="row-main">{{'helpFeedback' | i18n}}</div>
<i class="fa fa-chevron-right fa-lg row-sub-icon"></i>
</a>
<a class="box-content-row box-content-row-flex text-default" href="#"
appStopClick appBlurClick (click)="rate()">
<div class="row-main">{{'rateExtension' | i18n}}</div>
<i class="fa fa-chevron-right fa-lg row-sub-icon"></i>
</a>
</div>
<div class="box-footer">{{'rateExtensionDesc' | i18n}}</div>
</div>
</content>

131
src/popup2/settings/settings.component.ts
View File

@ -1,7 +1,134 @@
import { Component } from '@angular/core';
import { Angulartics2 } from 'angulartics2';
import {
Component,
OnInit,
} from '@angular/core';
import { Router } from '@angular/router';
import { BrowserApi } from '../../browser/browserApi';
import { DeviceType } from 'jslib/enums/deviceType';
import { ConstantsService } from 'jslib/services/constants.service';
import { I18nService } from 'jslib/abstractions/i18n.service';
import { LockService } from 'jslib/abstractions/lock.service';
import { MessagingService } from 'jslib/abstractions/messaging.service';
import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service';
import { StorageService } from 'jslib/abstractions/storage.service';
const RateUrls = {
[DeviceType.Chrome]:
'https://chrome.google.com/webstore/detail/bitwarden-free-password-m/nngceckbapebfimnlniiiahkandclblb/reviews',
[DeviceType.Firefox]:
'https://addons.mozilla.org/en-US/firefox/addon/bitwarden-password-manager/#reviews',
[DeviceType.Opera]:
'https://addons.opera.com/en/extensions/details/bitwarden-free-password-manager/#feedback-container',
[DeviceType.Edge]:
'https://www.microsoft.com/store/p/bitwarden-free-password-manager/9p6kxl0svnnl',
[DeviceType.Vivaldi]:
'https://chrome.google.com/webstore/detail/bitwarden-free-password-m/nngceckbapebfimnlniiiahkandclblb/reviews',
[DeviceType.Safari]:
'https://itunes.apple.com/app/bitwarden-password-manager/id1137397744',
};
@Component({
selector: 'app-settings',
templateUrl: 'settings.component.html',
})
export class SettingsComponent { }
export class SettingsComponent implements OnInit {
lockOptions: any[];
lockOption: number = null;
constructor(private platformUtilsService: PlatformUtilsService, private i18nService: I18nService,
private analytics: Angulartics2, private lockService: LockService,
private storageService: StorageService, public messagingService: MessagingService,
private router: Router) {
}
async ngOnInit() {
const showOnLocked = !this.platformUtilsService.isFirefox() && !this.platformUtilsService.isEdge()
&& !this.platformUtilsService.isSafari();
this.lockOptions = [
{ name: this.i18nService.t('immediately'), value: 0 },
{ name: this.i18nService.t('oneMinute'), value: 1 },
{ name: this.i18nService.t('fiveMinutes'), value: 5 },
{ name: this.i18nService.t('fifteenMinutes'), value: 15 },
{ name: this.i18nService.t('thirtyMinutes'), value: 30 },
{ name: this.i18nService.t('oneHour'), value: 60 },
{ name: this.i18nService.t('fourHours'), value: 240 },
// { name: i18nService.t('onIdle'), value: -4 },
// { name: i18nService.t('onSleep'), value: -3 },
];
if (showOnLocked) {
this.lockOptions.push({ name: this.i18nService.t('onLocked'), value: -2 });
}
this.lockOptions.push({ name: this.i18nService.t('onRestart'), value: -1 });
this.lockOptions.push({ name: this.i18nService.t('never'), value: null });
let option = await this.storageService.get<number>(ConstantsService.lockOptionKey);
if (option != null) {
if (option === -2 && !showOnLocked) {
option = -1;
}
this.lockOption = option;
}
}
async saveLockOption() {
await this.lockService.setLockOption(this.lockOption != null ? this.lockOption : null);
}
async lock() {
this.analytics.eventTrack.next({ action: 'Lock Now' });
await this.lockService.lock();
this.router.navigate(['lock']);
}
async logOut() {
const confirmed = await this.platformUtilsService.showDialog(
this.i18nService.t('logOutConfirmation'), this.i18nService.t('logOut'),
this.i18nService.t('yes'), this.i18nService.t('cancel'));
if (confirmed) {
this.messagingService.send('logout');
}
}
async changePassword() {
this.analytics.eventTrack.next({ action: 'Clicked Change Password' });
const confirmed = await this.platformUtilsService.showDialog(
this.i18nService.t('changeMasterPasswordConfirmation'), this.i18nService.t('changeMasterPassword'),
this.i18nService.t('yes'), this.i18nService.t('cancel'));
if (confirmed) {
BrowserApi.createNewTab('https://help.bitwarden.com/article/change-your-master-password/');
}
}
async twoStep() {
this.analytics.eventTrack.next({ action: 'Clicked Two-step Login' });
const confirmed = await this.platformUtilsService.showDialog(
this.i18nService.t('twoStepLoginConfirmation'), this.i18nService.t('twoStepLogin'),
this.i18nService.t('yes'), this.i18nService.t('cancel'));
if (confirmed) {
BrowserApi.createNewTab('https://help.bitwarden.com/article/setup-two-step-login/');
}
}
async share() {
// TODO
}
import() {
this.analytics.eventTrack.next({ action: 'Clicked Import Items' });
BrowserApi.createNewTab('https://help.bitwarden.com/article/import-data/');
}
rate() {
this.analytics.eventTrack.next({ action: 'Rate Extension' });
BrowserApi.createNewTab((RateUrls as any)[this.platformUtilsService.getDevice()]);
}
}