mirror of
https://github.com/Start9Labs/start-os.git
synced 2026-03-26 10:21:52 +00:00
pw modal
This commit is contained in:
committed by
Aiden McClelland
parent
a458e0b5bc
commit
8f0e0a392e
@@ -10,7 +10,7 @@
|
||||
<h2 color="light">Select Data Drive</h2>
|
||||
<ion-card
|
||||
*ngFor="let drive of dataDrives"
|
||||
(click)="selectDrive(drive['logical-name'])"
|
||||
(click)="selectDrive(drive)"
|
||||
button="true"
|
||||
[class.selected]="selectedDrive === drive['logical-name']"
|
||||
color="light"
|
||||
@@ -28,7 +28,7 @@
|
||||
</div>
|
||||
<div *ngIf="stateService.selectedDataDrive">
|
||||
<ion-card
|
||||
[routerLink]="['/password']"
|
||||
(click)="presentPasswordModal()"
|
||||
button="true"
|
||||
color="light"
|
||||
>
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
import { Component } from '@angular/core'
|
||||
import { AlertController } from '@ionic/angular'
|
||||
import { AlertController, ModalController } from '@ionic/angular'
|
||||
import { ApiService } from 'src/app/services/api/api.service'
|
||||
import { StateService } from 'src/app/services/state.service'
|
||||
import { PasswordPage } from '../password/password.page'
|
||||
|
||||
@Component({
|
||||
selector: 'home',
|
||||
@@ -16,6 +17,7 @@ export class HomePage {
|
||||
private readonly apiService: ApiService,
|
||||
private readonly stateService: StateService,
|
||||
private readonly alertController: AlertController,
|
||||
private modalController: ModalController,
|
||||
) {}
|
||||
|
||||
async ngOnInit() {
|
||||
@@ -62,4 +64,25 @@ export class HomePage {
|
||||
this.stateService.selectedDataDrive = this.selectedDrive
|
||||
}
|
||||
|
||||
async presentPasswordModal() {
|
||||
const modal = await this.modalController.create({
|
||||
component: PasswordPage,
|
||||
backdropDismiss: false,
|
||||
componentProps: {
|
||||
'version': null,
|
||||
}
|
||||
})
|
||||
modal.onDidDismiss().then(ret => {
|
||||
if(ret.data.pwValid) {
|
||||
this.submitPassword(ret.data.password)
|
||||
}
|
||||
})
|
||||
await modal.present();
|
||||
}
|
||||
|
||||
async submitPassword (pw: string) {
|
||||
await this.apiService.submitPassword(pw)
|
||||
// @TODO navigate to embassyOS
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -6,15 +6,17 @@
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content>
|
||||
<div *ngIf="stateService.recoveryDrive">
|
||||
<div *ngIf="!needsVer">
|
||||
<h2>Enter Password</h2>
|
||||
<ion-input type="password" [(ngModel)]="password">Password:</ion-input>
|
||||
</div>
|
||||
<div *ngIf="!stateService.recoveryDrive">
|
||||
|
||||
<div *ngIf="needsVer">
|
||||
<h2>Create Password</h2>
|
||||
<ion-input type="password" [(ngModel)]="password">Password:</ion-input>
|
||||
<ion-input type="password" [(ngModel)]="passwordVer">Verify Password:</ion-input>
|
||||
</div>
|
||||
<p>{{error}}</p>
|
||||
<ion-button (click)="cancel()">Cancel</ion-button>
|
||||
<ion-button (click)="submitPassword()" [disabled]="!password">Submit</ion-button>
|
||||
</ion-content>
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
import { Component } from '@angular/core'
|
||||
import { ApiService } from 'src/app/services/api/api.service'
|
||||
import { StateService } from 'src/app/services/state.service'
|
||||
import { Component, Input } from '@angular/core'
|
||||
import { ModalController } from '@ionic/angular'
|
||||
|
||||
@Component({
|
||||
selector: 'password',
|
||||
@@ -8,24 +7,40 @@ import { StateService } from 'src/app/services/state.service'
|
||||
styleUrls: ['password.page.scss'],
|
||||
})
|
||||
export class PasswordPage {
|
||||
@Input() version: string | null
|
||||
|
||||
needsVer = true
|
||||
|
||||
error = ''
|
||||
password = ''
|
||||
passwordVer = ''
|
||||
|
||||
constructor(
|
||||
private readonly apiService: ApiService,
|
||||
private readonly stateService: StateService,
|
||||
private modalController: ModalController
|
||||
) {}
|
||||
|
||||
ngOnInit() {
|
||||
this.needsVer = !this.version?.startsWith('0.3')
|
||||
console.log('needs', this.needsVer)
|
||||
}
|
||||
|
||||
async submitPassword () {
|
||||
if (!this.stateService.recoveryDrive && this.password !== this.passwordVer) {
|
||||
console.log('here')
|
||||
if (this.needsVer && this.password !== this.passwordVer) {
|
||||
this.error="*passwords dont match"
|
||||
} else {
|
||||
console.log('submitting')
|
||||
await this.apiService.submitPassword(this.password)
|
||||
// @Todo navigate to embassy os
|
||||
this.dismiss(true)
|
||||
}
|
||||
}
|
||||
|
||||
cancel () {
|
||||
this.dismiss(false)
|
||||
}
|
||||
|
||||
dismiss(submitted: boolean) {
|
||||
this.modalController.dismiss({
|
||||
pwValid: submitted,
|
||||
pw: this.password
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
<h2 color="light">Select Data Drive</h2>
|
||||
<ion-card
|
||||
*ngFor="let drive of dataDrives"
|
||||
(click)="selectDrive(drive['logical-name'])"
|
||||
(click)="selectDrive(drive)"
|
||||
button="true"
|
||||
[class.selected]="selectedDrive === drive['logical-name']"
|
||||
color="light"
|
||||
@@ -30,11 +30,11 @@
|
||||
<h2>Progress: {{ 100 * stateService.dataProgress }}% <ion-spinner *ngIf="stateService.dataProgress != 1"></ion-spinner> </h2>
|
||||
<ion-progress-bar value="{{stateService.dataProgress}}"></ion-progress-bar>
|
||||
<ion-button
|
||||
[routerLink]="['/password']"
|
||||
(click)="navToEmbassy()"
|
||||
color="primary"
|
||||
[disabled]="stateService.dataProgress != 1"
|
||||
>
|
||||
Next
|
||||
Go To Embassy
|
||||
</ion-button>
|
||||
</div>
|
||||
</ion-content>
|
||||
|
||||
@@ -1,7 +1,8 @@
|
||||
import { Component } from '@angular/core'
|
||||
import { AlertController } from '@ionic/angular'
|
||||
import { ApiService } from 'src/app/services/api/api.service'
|
||||
import { AlertController, ModalController } from '@ionic/angular'
|
||||
import { ApiService, EmbassyDrive } from 'src/app/services/api/api.service'
|
||||
import { StateService } from 'src/app/services/state.service'
|
||||
import { PasswordPage } from '../password/password.page'
|
||||
|
||||
@Component({
|
||||
selector: 'recover',
|
||||
@@ -11,11 +12,13 @@ import { StateService } from 'src/app/services/state.service'
|
||||
export class RecoverPage {
|
||||
dataDrives = []
|
||||
selectedDrive = null
|
||||
selectedVersion = null
|
||||
|
||||
constructor(
|
||||
private readonly apiService: ApiService,
|
||||
private readonly stateService: StateService,
|
||||
public alertController: AlertController,
|
||||
private modalController: ModalController,
|
||||
) {}
|
||||
|
||||
async ngOnInit() {
|
||||
@@ -26,11 +29,15 @@ export class RecoverPage {
|
||||
}
|
||||
}
|
||||
|
||||
selectDrive(name: string) {
|
||||
selectDrive(disk: EmbassyDrive) {
|
||||
const name = disk['logical-name']
|
||||
const version = disk.version
|
||||
if (name === this.selectedDrive) {
|
||||
this.selectedDrive = null
|
||||
this.selectedVersion = null
|
||||
} else {
|
||||
this.selectedDrive = name
|
||||
this.selectedVersion = version
|
||||
}
|
||||
}
|
||||
|
||||
@@ -60,9 +67,33 @@ export class RecoverPage {
|
||||
}
|
||||
|
||||
async chooseDisk() {
|
||||
await this.apiService.selectEmbassyDrive({logicalName: this.selectedDrive})
|
||||
this.presentPasswordModal()
|
||||
}
|
||||
|
||||
async presentPasswordModal() {
|
||||
const modal = await this.modalController.create({
|
||||
component: PasswordPage,
|
||||
backdropDismiss: false,
|
||||
componentProps: {
|
||||
'version': this.selectedVersion,
|
||||
}
|
||||
})
|
||||
modal.onDidDismiss().then(ret => {
|
||||
if(ret.data.pwValid) {
|
||||
this.submitPWAndDisk(ret.data.password)
|
||||
}
|
||||
})
|
||||
await modal.present();
|
||||
}
|
||||
|
||||
async submitPWAndDisk(pw: string) {
|
||||
await this.apiService.selectEmbassyDrive({logicalName: this.selectedDrive}, pw)
|
||||
this.stateService.recoveryDrive = this.selectedDrive
|
||||
this.stateService.pollDataTransferProgress()
|
||||
}
|
||||
|
||||
async navToEmbassy() {
|
||||
// @TODO nav to embassy
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -7,7 +7,7 @@ export abstract class ApiService {
|
||||
abstract getStorageDisks (): Promise<StorageDisk[]>
|
||||
abstract selectStorageDisk (disk: { logicalName: string }): Promise<void>
|
||||
abstract getEmbassyDrives (): Promise<EmbassyDrive[]>
|
||||
abstract selectEmbassyDrive (disk: { logicalName: string }): Promise<void>
|
||||
abstract selectEmbassyDrive (disk: { logicalName: string }, password: string): Promise<void>
|
||||
abstract getDataTransferProgress () : Promise<TransferProgress>
|
||||
abstract submitPassword (password: string) : Promise<void>
|
||||
}
|
||||
|
||||
@@ -12,9 +12,8 @@ export class MockApiService extends ApiService {
|
||||
}
|
||||
|
||||
async getState () {
|
||||
await pauseFor(2000)
|
||||
return {
|
||||
'selected-data-drive': null,
|
||||
'selected-data-drive': 'page1',
|
||||
'recovery-drive': null,
|
||||
'has-password': false,
|
||||
'data-transfer-progress': null
|
||||
@@ -74,4 +73,4 @@ export class MockApiService extends ApiService {
|
||||
}
|
||||
}
|
||||
|
||||
let tries = 4
|
||||
let tries = 2
|
||||
Reference in New Issue
Block a user