mirror of
https://github.com/Start9Labs/start-os.git
synced 2026-04-01 21:13:09 +00:00
checkpoiint
This commit is contained in:
Drew Ansbacher
committed by
Matt Hill
Matt Hill
parent
1cc7cc439f
commit
bce87cc819
@@ -7,107 +7,37 @@
|
||||
<img src="assets/png/logo.png" style="max-width: 240px;" />
|
||||
</div>
|
||||
|
||||
<ion-card>
|
||||
<ion-card-header class="ion-text-center" style="padding-bottom: 8px;">
|
||||
<ion-card-title>{{ stateService.dataDrive ? 'Startup Options' : 'Select Data Drive'}}</ion-card-title>
|
||||
</ion-card-header>
|
||||
|
||||
<ion-card color="dark">
|
||||
<ion-card-content class="ion-margin">
|
||||
<div *ngIf="!stateService.loading && !stateService.dataDrive && dataDrives">
|
||||
<div *ngIf="!dataDrives.length">
|
||||
<h2 color="light">No data drives found</h2>
|
||||
<p color="light">Please connect a data drive to your embassy and refresh the page.</p>
|
||||
<ion-button
|
||||
(click)="window.location.reload()"
|
||||
style="text-align:center"
|
||||
class="claim-button"
|
||||
>
|
||||
Refresh
|
||||
</ion-button>
|
||||
</div>
|
||||
<div *ngIf="dataDrives.length">
|
||||
<ion-card
|
||||
color="light"
|
||||
*ngFor="let drive of dataDrives"
|
||||
(click)="selectDrive(drive)"
|
||||
button="true"
|
||||
style="border-radius: 11px;"
|
||||
[class.selected]="selectedDrive?.logicalname === drive.logicalname"
|
||||
>
|
||||
<ion-card-header>
|
||||
<ion-card-title>{{drive.logicalname}}</ion-card-title>
|
||||
<ion-card-subtitle>{{drive.labels}}</ion-card-subtitle>
|
||||
</ion-card-header>
|
||||
|
||||
<ion-card-content>
|
||||
Using {{drive.used}} out of {{drive.capacity}} bytes.
|
||||
</ion-card-content>
|
||||
</ion-card>
|
||||
<div style="width: 100%; text-align: center;">
|
||||
<ion-button
|
||||
(click)="warn()"
|
||||
[disabled]="!selectedDrive"
|
||||
class="claim-button"
|
||||
>
|
||||
Next
|
||||
</ion-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="stateService.dataDrive">
|
||||
<ion-card
|
||||
(click)="presentPasswordModal()"
|
||||
button="true"
|
||||
color="light"
|
||||
class="wiz-card"
|
||||
style="text-align: center; background-color: #00919b !important; height: 160px;"
|
||||
>
|
||||
<ion-card-header>
|
||||
<ion-card-title style="font-size: 40px">Start Fresh</ion-card-title>
|
||||
<ion-card-subtitle>Get started with a brand new Embassy</ion-card-subtitle>
|
||||
</ion-card-header>
|
||||
</ion-card>
|
||||
<ion-card
|
||||
[routerLink]="['/recover']"
|
||||
button="true"
|
||||
color="light"
|
||||
class="wiz-card"
|
||||
style="text-align: center; background-color: #bf5900 !important; height: 160px;"
|
||||
>
|
||||
<ion-card-header>
|
||||
<ion-card-title style="font-size: 40px">Recover</ion-card-title>
|
||||
<ion-card-subtitle>Recover the data from an old embassy</ion-card-subtitle>
|
||||
</ion-card-header>
|
||||
</ion-card>
|
||||
</div>
|
||||
<!-- fresh -->
|
||||
<ion-card
|
||||
(click)="embassyNav()"
|
||||
button="true"
|
||||
color="light"
|
||||
style="text-align: center; background-color: #00919b !important; height: 160px; margin-bottom: 20px; box-shadow: 4px 4px 16px var(--ion-color-light);
|
||||
"
|
||||
>
|
||||
<ion-card-header>
|
||||
<ion-card-title style="font-size: 40px;">Start Fresh</ion-card-title>
|
||||
<ion-card-subtitle>Get started with a brand new Embassy</ion-card-subtitle>
|
||||
</ion-card-header>
|
||||
|
||||
<!-- recover -->
|
||||
</ion-card>
|
||||
<ion-card
|
||||
(click)="recoverNav()"
|
||||
button="true"
|
||||
color="light"
|
||||
style="text-align: center; background-color: #bf5900 !important; height: 160px; box-shadow: 4px 4px 16px var(--ion-color-light);
|
||||
"
|
||||
>
|
||||
<ion-card-header>
|
||||
<ion-card-title style="font-size: 40px;">Recover</ion-card-title>
|
||||
<ion-card-subtitle>Recover the data from an old embassy</ion-card-subtitle>
|
||||
</ion-card-header>
|
||||
</ion-card>
|
||||
</ion-card-content>
|
||||
|
||||
<ion-card-header class="card-footer">
|
||||
<ion-item lines="none">
|
||||
<ion-label class="ion-text-wrap">
|
||||
<p *ngIf="!stateService.dataDrive">
|
||||
Choose drive to save all Embassy data to.
|
||||
</p>
|
||||
<p *ngIf="stateService.dataDrive">
|
||||
Spin up a brand new Embassy, or recover data from an old device.
|
||||
</p>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
</ion-card-header>
|
||||
</ion-card>
|
||||
|
||||
<div class="divider"></div>
|
||||
|
||||
<div class="footer">
|
||||
<p style="margin-bottom: 30px;">Contact/Community</p>
|
||||
<ion-icon name="logo-youtube"></ion-icon>
|
||||
<ion-icon name="paper-plane"></ion-icon>
|
||||
<ion-icon name="mail"></ion-icon>
|
||||
<ion-icon name="logo-github"></ion-icon>
|
||||
<ion-icon name="logo-twitter"></ion-icon>
|
||||
<ion-icon name="logo-mastodon"></ion-icon>
|
||||
<ion-icon name="logo-medium"></ion-icon>
|
||||
</div>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
|
||||
@@ -1,8 +1,5 @@
|
||||
import { Component } from '@angular/core'
|
||||
import { AlertController, ModalController, LoadingController } from '@ionic/angular'
|
||||
import { ApiService, DataDrive } from 'src/app/services/api/api.service'
|
||||
import { StateService } from 'src/app/services/state.service'
|
||||
import { PasswordPage } from '../password/password.page'
|
||||
import { NavController } from '@ionic/angular'
|
||||
|
||||
@Component({
|
||||
selector: 'home',
|
||||
@@ -10,109 +7,16 @@ import { PasswordPage } from '../password/password.page'
|
||||
styleUrls: ['home.page.scss'],
|
||||
})
|
||||
export class HomePage {
|
||||
dataDrives = []
|
||||
selectedDrive: DataDrive = null
|
||||
console = console
|
||||
|
||||
constructor(
|
||||
private readonly apiService: ApiService,
|
||||
private readonly stateService: StateService,
|
||||
private readonly alertController: AlertController,
|
||||
private readonly modalController: ModalController,
|
||||
private readonly loadingCtrl: LoadingController,
|
||||
private readonly navCtrl: NavController,
|
||||
) {}
|
||||
|
||||
async ngOnInit() {
|
||||
if(!this.stateService.dataDrive) {
|
||||
const loader = await this.loadingCtrl.create({
|
||||
message: 'Fetching data drives'
|
||||
})
|
||||
await loader.present()
|
||||
this.dataDrives = await this.apiService.getDataDrives()
|
||||
loader.dismiss()
|
||||
}
|
||||
async recoverNav () {
|
||||
await this.navCtrl.navigateForward(`/recover`, { animationDirection: 'forward' })
|
||||
}
|
||||
|
||||
selectDrive(drive: DataDrive) {
|
||||
if (drive.logicalname === this.selectedDrive?.logicalname) {
|
||||
this.selectedDrive = null
|
||||
} else {
|
||||
this.selectedDrive = drive
|
||||
}
|
||||
async embassyNav () {
|
||||
await this.navCtrl.navigateForward(`/embassy`, { animationDirection: 'forward' })
|
||||
}
|
||||
|
||||
async warn() {
|
||||
const alert = await this.alertController.create({
|
||||
cssClass: 'my-custom-class',
|
||||
header: 'Warning!',
|
||||
message: 'This drive will be entirely wiped of all existing memory.',
|
||||
backdropDismiss: false,
|
||||
buttons: [
|
||||
{
|
||||
text: 'Cancel',
|
||||
role: 'cancel',
|
||||
cssClass: 'cancel-button',
|
||||
handler: () => {
|
||||
this.selectedDrive = null
|
||||
}
|
||||
}, {
|
||||
text: 'Okay',
|
||||
cssClass: 'okay-button',
|
||||
handler: async () => {
|
||||
await this.chooseDrive()
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
await alert.present();
|
||||
}
|
||||
|
||||
async chooseDrive() {
|
||||
const loader = await this.loadingCtrl.create({
|
||||
message: 'Selecting data drive'
|
||||
})
|
||||
await loader.present()
|
||||
try {
|
||||
await this.apiService.selectDataDrive(this.selectedDrive.logicalname)
|
||||
this.stateService.dataDrive = this.selectedDrive
|
||||
} catch (e) {
|
||||
} finally {
|
||||
loader.dismiss()
|
||||
}
|
||||
}
|
||||
|
||||
async presentPasswordModal() {
|
||||
const modal = await this.modalController.create({
|
||||
component: PasswordPage,
|
||||
backdropDismiss: false,
|
||||
cssClass: 'pw-modal',
|
||||
})
|
||||
modal.onDidDismiss().then(ret => {
|
||||
if(ret.data) {
|
||||
const pass = ret.data.password
|
||||
if (pass) {
|
||||
this.submitPassword(pass)
|
||||
}
|
||||
}
|
||||
})
|
||||
await modal.present();
|
||||
}
|
||||
|
||||
async submitPassword (pw: string) {
|
||||
const loader = await this.loadingCtrl.create({
|
||||
message: 'Setting up your Embassy'
|
||||
})
|
||||
await loader.present()
|
||||
|
||||
try {
|
||||
await this.apiService.submitPassword(pw)
|
||||
console.log('reloading')
|
||||
location.reload()
|
||||
} catch (e) {
|
||||
} finally {
|
||||
loader.dismiss()
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user