mirror of
https://github.com/Start9Labs/start-os.git
synced 2026-03-30 20:14:49 +00:00
40d47c9f44
* fix duplicate patch updates, add scroll button to setup success * update path * update patch * update patch
246 lines
8.1 KiB
HTML
246 lines
8.1 KiB
HTML
<ion-content [scrollEvents]="true" (ionScrollEnd)="checkBottom()">
|
|
<ion-grid>
|
|
<ion-row>
|
|
<ion-col>
|
|
<ion-card color="dark">
|
|
<ion-card-header class="ion-text-center" color="success">
|
|
<ion-icon
|
|
style="font-size: 80px"
|
|
name="checkmark-circle-outline"
|
|
></ion-icon>
|
|
<ion-card-title>Setup Complete</ion-card-title>
|
|
<ion-card-subtitle
|
|
><b
|
|
>You have successully claimed your Embassy!</b
|
|
></ion-card-subtitle
|
|
>
|
|
<br />
|
|
</ion-card-header>
|
|
<ion-card-content>
|
|
<br />
|
|
<br />
|
|
<h2
|
|
*ngIf="recoverySource && recoverySource.type === 'disk'"
|
|
class="ion-padding-bottom"
|
|
>
|
|
You can now safely unplug your backup drive.
|
|
</h2>
|
|
<h2 style="font-weight: bold">
|
|
Access your Embassy using the methods below. You should
|
|
<a (click)="download()" class="inline">
|
|
download this page <ion-icon name="download-outline"></ion-icon>
|
|
</a>
|
|
for your records.
|
|
</h2>
|
|
|
|
<div class="line"></div>
|
|
|
|
<!-- LAN Instructions -->
|
|
<h1><b>From Home (LAN)</b></h1>
|
|
|
|
<div class="ion-padding ion-text-start">
|
|
<p>
|
|
Visit the address below when you are conncted to the same WiFi
|
|
or Local Area Network (LAN) as your Embassy:
|
|
</p>
|
|
|
|
<br />
|
|
|
|
<p>
|
|
<b>Note:</b> embassy.local was for setup purposes only, it will
|
|
no longer work.
|
|
</p>
|
|
|
|
<ion-item
|
|
lines="none"
|
|
color="dark"
|
|
class="ion-padding-top ion-padding-bottom"
|
|
>
|
|
<ion-label class="ion-text-wrap">
|
|
<code
|
|
><ion-text color="light"
|
|
><b>{{ lanAddress }}</b></ion-text
|
|
></code
|
|
>
|
|
</ion-label>
|
|
<ion-button
|
|
color="light"
|
|
fill="clear"
|
|
[href]="lanAddress"
|
|
target="_blank"
|
|
>
|
|
<ion-icon slot="icon-only" name="open-outline"></ion-icon>
|
|
</ion-button>
|
|
<ion-button
|
|
color="light"
|
|
fill="clear"
|
|
(click)="copy(lanAddress)"
|
|
>
|
|
<ion-icon slot="icon-only" name="copy-outline"></ion-icon>
|
|
</ion-button>
|
|
</ion-item>
|
|
|
|
<p>
|
|
<b>Important!</b>
|
|
Your browser will warn you that the website is untrusted. You
|
|
can bypass this warning on most browsers. The warning will go
|
|
away after you
|
|
<a
|
|
href="https://start9.com/latest/user-manual/connecting/connecting-lan"
|
|
target="_blank"
|
|
rel="noreferrer"
|
|
class="inline"
|
|
>
|
|
follow the instructions
|
|
<ion-icon name="open-outline"></ion-icon>
|
|
</a>
|
|
to downlaod and trust your Embassy's Root Certificate Authority.
|
|
</p>
|
|
|
|
<ion-button style="margin-top: 24px" (click)="installCert()">
|
|
Download Root CA
|
|
<ion-icon slot="end" name="download-outline"></ion-icon>
|
|
</ion-button>
|
|
</div>
|
|
|
|
<div class="line"></div>
|
|
|
|
<!-- Tor Instructions -->
|
|
<h1><b>On The Go (Tor)</b></h1>
|
|
|
|
<div class="ion-padding ion-text-start">
|
|
<p>Visit the address below when you are away from home:</p>
|
|
|
|
<ion-item
|
|
lines="none"
|
|
color="dark"
|
|
class="ion-padding-top ion-padding-bottom"
|
|
>
|
|
<ion-label class="ion-text-wrap">
|
|
<code
|
|
><ion-text color="light"
|
|
><b>{{ torAddress }}</b></ion-text
|
|
></code
|
|
>
|
|
</ion-label>
|
|
<ion-button
|
|
color="light"
|
|
fill="clear"
|
|
(click)="copy(torAddress)"
|
|
>
|
|
<ion-icon slot="icon-only" name="copy-outline"></ion-icon>
|
|
</ion-button>
|
|
</ion-item>
|
|
|
|
<p>
|
|
<b>Important!</b>
|
|
This address will only work from a
|
|
<a
|
|
href="https://start9.com/latest/user-manual/connecting/connecting-tor"
|
|
target="_blank"
|
|
rel="noreferrer"
|
|
class="inline"
|
|
>
|
|
Tor-enabled browser
|
|
<ion-icon name="open-outline"></ion-icon> </a
|
|
>.
|
|
</p>
|
|
</div>
|
|
</ion-card-content>
|
|
<div id="bottom-div"></div>
|
|
</ion-card>
|
|
|
|
<!-- scroll down -->
|
|
<div
|
|
[ngStyle]="{
|
|
position: 'fixed',
|
|
bottom: isOnBottom ? '-42px' : '24px',
|
|
transition: 'bottom 0.15s ease-out 0s',
|
|
right: '50%',
|
|
width: '120px',
|
|
'margin-right': '-60px',
|
|
'z-index': '1000'
|
|
}"
|
|
>
|
|
<ion-button color="warning" (click)="scrollToBottom()">
|
|
More
|
|
<ion-icon slot="end" name="chevron-down"></ion-icon>
|
|
</ion-button>
|
|
</div>
|
|
|
|
<!-- cert elem -->
|
|
<a hidden id="install-cert" download="embassy.crt"></a>
|
|
|
|
<!-- download elem -->
|
|
<div hidden id="downloadable">
|
|
<div style="padding: 0 24px; font-family: Courier">
|
|
<h1>Embassy Info</h1>
|
|
|
|
<section style="padding: 16px; border: solid 1px">
|
|
<h2>Tor Info</h2>
|
|
<p>
|
|
To use your Embassy over Tor, visit its unique Tor address from
|
|
any Tor-enabled browser.
|
|
</p>
|
|
<p>
|
|
For a list of recommended browsers, click
|
|
<a
|
|
href="https://start9.com/latest/user-manual/connecting/connecting-tor"
|
|
target="_blank"
|
|
rel="noreferrer"
|
|
><b>here</b></a
|
|
>.
|
|
</p>
|
|
<p><b>Tor Address: </b><code id="tor-addr"></code></p>
|
|
</section>
|
|
|
|
<section style="padding: 16px; border: solid 1px; border-top: none">
|
|
<h2>LAN Info</h2>
|
|
<p>To use your Embassy locally, you must:</p>
|
|
<ol>
|
|
<li>
|
|
Currently be connected to the same Local Area Network (LAN) as
|
|
your Embassy.
|
|
</li>
|
|
<li>Download your Embassy's Root Certificate Authority.</li>
|
|
<li>
|
|
Trust your Embassy's Root CA on <i>both</i> your
|
|
computer/phone and in your browser settings.
|
|
</li>
|
|
</ol>
|
|
<p>
|
|
For step-by-step instructions, click
|
|
<a
|
|
href="https://start9.com/latest/user-manual/connecting/connecting-lan"
|
|
target="_blank"
|
|
rel="noreferrer"
|
|
><b>here</b></a
|
|
>.
|
|
</p>
|
|
|
|
<div style="margin: 42px 0">
|
|
<a
|
|
id="cert"
|
|
download="embassy.crt"
|
|
style="
|
|
background: #25272b;
|
|
padding: 10px;
|
|
text-decoration: none;
|
|
text-align: center;
|
|
border-radius: 4px;
|
|
color: white;
|
|
"
|
|
>
|
|
Download Root CA
|
|
</a>
|
|
</div>
|
|
|
|
<p><b>LAN Address: </b><code id="lan-addr"></code></p>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
</ion-col>
|
|
</ion-row>
|
|
</ion-grid>
|
|
</ion-content>
|