You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
125 lines
11 KiB
HTML
125 lines
11 KiB
HTML
<div fxLayout="column">
|
|
<div class="padding-gap">
|
|
<mat-card>
|
|
<mat-card-header>
|
|
<mat-card-subtitle>
|
|
<h2>Unlock/Initialize Wallet</h2>
|
|
</mat-card-subtitle>
|
|
</mat-card-header>
|
|
<mat-card-content>
|
|
<div fxLayout="column" fxFlex="100" fxLayoutAlign="start">
|
|
<div fxLayout="row" fxFlex.gt-sm="100"><div fxLayout="column" fxFlex="40" fxFlex.lt-sm="100">
|
|
<mat-radio-group [(ngModel)]="walletOperation" color="primary" aria-label="Select an option" fxLayoutAlign="space-between">
|
|
<mat-radio-button value="unlock" tabindex="1">Unlock</mat-radio-button>
|
|
<mat-radio-button value="init" tabindex="2">Initialize</mat-radio-button>
|
|
</mat-radio-group>
|
|
</div></div>
|
|
<div *ngIf="walletOperation === 'unlock'; else initBlock">
|
|
<form fxLayout="column" fxLayout.gt-sm="row wrap" fxLayoutAlign="start" fxLayoutAlign.gt-sm="space-between" class="mt-2">
|
|
<mat-form-field fxFlex="65" fxLayoutAlign="start">
|
|
<input matInput type="password" placeholder="Password" name="walletPassword" [(ngModel)]="walletPassword" tabindex="3" required>
|
|
<mat-hint>Enter Wallet Password</mat-hint>
|
|
</mat-form-field>
|
|
<button mat-raised-button fxFlex="15" color="primary" [disabled]="walletPassword == ''" (click)="onOperateWallet()" tabindex="4">Unlock Wallet</button>
|
|
<button fxFlex="15" fxLayoutAlign="center center" mat-stroked-button color="accent" tabindex="5" type="reset" (click)="resetData()">Clear</button>
|
|
</form>
|
|
</div>
|
|
<ng-template #initBlock>
|
|
<div *ngIf="insecureLND && !warnRes">
|
|
<form fxLayout="column" fxLayout.gt-sm="row wrap" fxLayoutAlign="start" fxLayoutAlign.gt-sm="space-between" class="mt-2">
|
|
<div fxFlex="65" fxLayoutAlign="start" class="insecure-message">Warning: Your connection is unsecure, it's not safe to generate private keys over this connection.Are you sure you want to proceed?</div>
|
|
<button mat-raised-button fxFlex="15" color="primary" type="submit" (click)="proceed=true;warnRes=true" tabindex="4">Proceed</button>
|
|
<button fxFlex="15" fxLayoutAlign="center center" mat-stroked-button color="accent" tabindex="5" type="reset" (click)="proceed=false;warnRes=true">Cancel</button>
|
|
</form>
|
|
</div>
|
|
<div *ngIf="warnRes && !proceed" fxFlex="100" fxLayoutAlign="start" class="insecure-message mt-2">Please reconfig & restart RTL after securing your LND connction. You can close this window now.</div>
|
|
<mat-vertical-stepper *ngIf="(!insecureLND || (warnRes && proceed)) && genSeedResponse.length <= 0 && initWalletResponse === ''" [linear]="true" #stepper>
|
|
<mat-step [stepControl]="passwordFormGroup" label="Wallet Password" state="password">
|
|
<form [formGroup]="passwordFormGroup" fxLayout="column" fxLayout.gt-sm="row wrap" fxLayoutAlign="start" fxLayoutAlign.gt-sm="space-between">
|
|
<mat-form-field fxFlex="44" fxLayoutAlign="start">
|
|
<input matInput type="password" placeholder="Password" name="initWalletPassword" formControlName="initWalletPassword" tabindex="6" required>
|
|
<mat-hint>Enter Wallet Password</mat-hint>
|
|
</mat-form-field>
|
|
<mat-form-field fxFlex="44" fxLayoutAlign="start">
|
|
<input matInput type="password" placeholder="Confirm Password" name="initWalletConfirmPassword" formControlName="initWalletConfirmPassword" tabindex="7" required>
|
|
<mat-hint>Confirm Wallet Password</mat-hint>
|
|
</mat-form-field>
|
|
<button mat-raised-button color="primary" fxFlex="10" [disabled]="!passwordFormGroup.valid" type="submit" matStepperNext>Next</button>
|
|
<div *ngIf="passwordFormGroup.controls.initWalletPassword.errors?.minlength && (passwordFormGroup.controls.initWalletPassword.touched || passwordFormGroup.controls.initWalletPassword.dirty)" class="validation-error-message">
|
|
<mat-icon class="validation-error-icon red">cancel</mat-icon>Password must be at least 8 characters in length.
|
|
</div>
|
|
<div *ngIf="passwordFormGroup.errors?.unmatchedPasswords && (passwordFormGroup.controls.initWalletPassword.touched || passwordFormGroup.controls.initWalletPassword.dirty) && (passwordFormGroup.controls.initWalletConfirmPassword.touched || passwordFormGroup.controls.initWalletConfirmPassword.dirty)" class="validation-error-message">
|
|
<mat-icon class="validation-error-icon red">cancel</mat-icon>Passwords do not match.
|
|
</div>
|
|
</form>
|
|
</mat-step>
|
|
<mat-step [stepControl]="cipherFormGroup" label="Cipher" state="cipher">
|
|
<form [formGroup]="cipherFormGroup" fxLayout="column" fxLayout.gt-sm="row wrap" fxLayoutAlign="start" fxLayoutAlign.gt-sm="space-between">
|
|
<mat-checkbox fxFlex="20" fxFlex.gt-lg="10" tabindex="8" fxLayoutAlign="start center" class="chkbox-wallet" formControlName="existingCipher" name="existingCipher">Existing Cipher</mat-checkbox>
|
|
<mat-form-field fxFlex="58" fxFlex.gt-lg="58" fxLayoutAlign="start">
|
|
<input matInput type="input" placeholder="Comma separated array of 24 words cipher seed" name="cipherSeed" formControlName="cipherSeed" tabindex="9" required>
|
|
<mat-hint>Cipher Seed</mat-hint>
|
|
</mat-form-field>
|
|
<button mat-raised-button color="primary" fxFlex="10" [disabled]="!cipherFormGroup.valid" type="submit" matStepperNext>Next</button>
|
|
<button mat-stroked-button color="accent" fxFlex="10" type="reset" matStepperPrevious>Back</button>
|
|
<div *ngIf="cipherFormGroup.errors?.invalidCipher && cipherFormGroup.controls.existingCipher.value && (cipherFormGroup.controls.cipherSeed.touched || cipherFormGroup.controls.cipherSeed.dirty)" class="validation-error-message">
|
|
<mat-icon class="validation-error-icon red">cancel</mat-icon>Invalid Cipher. Enter comma separated 24 words cipher seed.
|
|
</div>
|
|
</form>
|
|
</mat-step>
|
|
<mat-step [stepControl]="passphraseFormGroup" label="Passphrase" state="passphrase">
|
|
<form [formGroup]="passphraseFormGroup" fxLayout="column" fxLayout.gt-sm="row wrap" fxLayoutAlign="start" fxLayoutAlign.gt-sm="space-between">
|
|
<mat-checkbox fxFlex="20" fxFlex.gt-lg="10" tabindex="10" fxLayoutAlign="start center" class="chkbox-wallet" formControlName="enterPassphrase" name="enterPassphrase">Enter Passphrase</mat-checkbox>
|
|
<mat-form-field fxFlex="40" fxFlex.gt-lg="50" fxLayoutAlign="start">
|
|
<input matInput type="input" type="password" placeholder="Passphrase" name="passphrase" formControlName="passphrase" tabindex="11" required>
|
|
<mat-hint>Enter Passphrase</mat-hint>
|
|
</mat-form-field>
|
|
<button mat-raised-button fxFlex="15" fxFlex.gt-lg="14" color="primary" [disabled]="!passphraseFormGroup.valid" (click)="onInitWallet()" tabindex="12" type="submit">Initialize Wallet</button>
|
|
<button mat-raised-button fxFlex="10" fxFlex.gt-lg="9" color="accent" type="button" matStepperPrevious>Back</button>
|
|
<button fxFlex="10" fxFlex.gt-lg="9" fxLayoutAlign="center center" mat-raised-button color="warn" tabindex="13" type="reset" (click)="resetData()">Clear</button>
|
|
</form>
|
|
</mat-step>
|
|
<ng-template matStepperIcon="password">
|
|
<mat-icon>fingerprint</mat-icon>
|
|
</ng-template>
|
|
<ng-template matStepperIcon="cipher">
|
|
<mat-icon>swap_calls</mat-icon>
|
|
</ng-template>
|
|
<ng-template matStepperIcon="passphrase">
|
|
<mat-icon>waves</mat-icon>
|
|
</ng-template>
|
|
</mat-vertical-stepper>
|
|
<div *ngIf="genSeedResponse.length > 0 && initWalletResponse !== ''">
|
|
<form fxLayout="column" fxLayout.gt-sm="row wrap" fxLayoutAlign="start" fxLayoutAlign.gt-sm="space-between" class="mt-2">
|
|
<div fxFlex="100" fxLayoutAlign="start" class="insecure-message blinker">YOU MUST WRITE DOWN THIS SEED TO BE ABLE TO RESTORE THE WALLET!</div>
|
|
<div fxFlex="40" fxLayout="row wrap" class="mt-2">
|
|
<span *ngFor="let genSeed of genSeedResponse; index as i;" fxFlex="25" fxLayoutAlign="start" class="genseed-message">
|
|
{{genSeed}}
|
|
</span>
|
|
</div>
|
|
<div fxFlex="65" fxLayoutAlign="start" class="insecure-message mt-2">Wallet initialization is done.</div>
|
|
<div fxFlex="65" fxLayoutAlign="start" class="insecure-message mt-2">The node will be usable only after LND has synced completely with the network.</div>
|
|
<div fxFlex="65" fxLayoutAlign="start" class="insecure-message mt-2">Click continue only after writing down the seed.</div>
|
|
<button mat-raised-button fxFlex="15" color="primary" type="submit" (click)="onGoToHome()" tabindex="14">Go To Home</button>
|
|
</form>
|
|
</div>
|
|
<div *ngIf="genSeedResponse.length > 0 && initWalletResponse === ''">
|
|
<form fxLayout="column" fxLayout.gt-sm="row wrap" fxLayoutAlign="start" fxLayoutAlign.gt-sm="space-between" class="mt-2">
|
|
<div fxFlex="65" fxLayoutAlign="start" class="insecure-message mt-2">Something went wrong! Unable to initialize wallet!</div>
|
|
<button fxFlex="10" fxLayoutAlign="center center" mat-raised-button color="warn" tabindex="15" type="reset" (click)="resetData()">Restart</button>
|
|
</form>
|
|
</div>
|
|
<div *ngIf="genSeedResponse.length <= 0 && initWalletResponse !== ''">
|
|
<form fxLayout="column" fxLayout.gt-sm="row wrap" fxLayoutAlign="start" fxLayoutAlign.gt-sm="space-between" class="mt-2">
|
|
<div fxFlex="65" fxLayoutAlign="start" class="insecure-message mt-2">Wallet recovery is done.</div>
|
|
<div fxFlex="65" fxLayoutAlign="start" class="insecure-message mt-2">The node will be usable only after LND has synced completely with the network.</div>
|
|
<button mat-raised-button fxFlex="15" color="primary" type="submit" (click)="onGoToHome()" tabindex="14">Go To Home</button>
|
|
</form>
|
|
</div>
|
|
</ng-template>
|
|
</div>
|
|
</mat-card-content>
|
|
</mat-card>
|
|
</div>
|
|
</div>
|