Files
public-pool-ui/src/app/components/splash/splash.component.html
T
2025-07-11 11:28:44 -04:00

322 lines
15 KiB
HTML

<div class="py-4 px-1 md:px4 lg:px-8 mx-0 lg:mx-8 main">
<div class="grid justify-content-center">
<div class="col-12">
<div class="card text-center">
<div>
<img id="logo" style="height: 200px;" src="assets/layout/images/logo.svg" alt="logo">
</div>
<div class="col-12 text-center title">
<h1 class="text-900 font-normal">Public Pool</h1>
</div>
<div class="mb-4">
<a class="ml-4 mr-4" href="https://twitter.com/Public_Pool_BTC" target="_blank">
<i class="pi pi-twitter" style="font-size: 30pt; color: white;"></i>
</a>
<a class="ml-4 mr-4" href="https://discord.gg/pF9smpe3yE" target="_blank">
<i class="pi pi-discord" style="font-size: 30pt; color: white;"></i>
</a>
<a class="ml-4 mr-4" href="https://github.com/benjamin-wilson/public-pool" target="_blank">
<i class="pi pi-github" style="font-size: 30pt; color: white;"></i>
</a>
</div>
<div>
<code>Fully Open Source Solo Bitcoin Mining Pool</code>
<br>
<br>
<div class="info mb-2 p-4 border-dashed border-1 border-round">
<code>stratum+tcp://{{stratumURL}}</code>
<br>
<code>username: &lt;your BTC address&gt;.&lt;worker name&gt;, password: x</code>
</div>
<span><b>NO FEES</b></span>
<br>
<span><b>PLUS AFFILIATE REWARDS</b></span>
<br>
<span>No second best.</span>
</div>
</div>
</div>
<div class="col-12">
<div class="card">
<h4>Login</h4>
<div class="field text-center">
<input [formControl]="address" placeholder="Address (bc1...)" pInputText id="address" type="text"
class="p-inputtext p-component p-element">
<button [disabled]="address.invalid" class="ml-3 mt-3" pButton label="My Workers"
[routerLink]="['app',address.value]"></button>
</div>
</div>
</div>
<div class="col-12">
<div class="card chart">
<div class="text-center mb-2">Uptime: {{uptime$ | async | dateAgo}}</div>
<ng-container *ngIf="chartData$ | async as chartData; else loadingChart">
<p-chart [responsive]="true" type="line" [data]="chartData" [options]="chartOptions"></p-chart>
</ng-container>
<ng-template #loadingChart>
<p-skeleton width="100%" height="40vh"></p-skeleton>
</ng-template>
</div>
</div>
<div class="col-12">
<div class="card">
<h4 style="text-align: center;">Online Devices</h4>
<ng-container *ngIf="userAgents$ | async as userAgents">
<p-table [value]="userAgents">
<ng-template pTemplate="header">
<tr>
<th>Device</th>
<th>Currently Working</th>
<th>Total Hash Rate</th>
<th>Best Difficulty <i class="pi pi-question-circle ml-2"
pTooltip="If you find a solution with a difficulty higher than the network difficulty, you've found a block."></i>
</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-userAgent>
<tr></tr>
<tr>
<td><app-user-agent-link [userAgent]="userAgent.userAgent"></app-user-agent-link></td>
<td>{{ userAgent.count }}</td>
<td>{{ userAgent.totalHashRate | hashSuffix }}</td>
<td>{{ userAgent.bestDifficulty | numberSuffix}}</td>
</tr>
</ng-template>
</p-table>
<div class="text-right mt-2">
<i class="pi pi-star-fill"></i> = Open Source Software & Hardware
</div>
</ng-container>
<ng-template #loadingTable>
<p-table [value]="[{},{},{}]">
<ng-template pTemplate="header">
<tr>
<th>Device</th>
<th>Currently Working</th>
<th>Total Hash Rate</th>
<th>Best Difficulty <i class="pi pi-question-circle ml-2"
pTooltip="If you find a solution with a difficulty higher than the network difficulty, you've found a block."></i>
</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-row>
<tr></tr>
<tr>
<td><p-skeleton></p-skeleton></td>
<td><p-skeleton></p-skeleton></td>
<td><p-skeleton></p-skeleton></td>
<td><p-skeleton></p-skeleton></td>
</tr>
</ng-template>
</p-table>
</ng-template>
</div>
</div>
<div class="col-12">
<div class="card">
<h4 style="text-align: center;">Affiliate Program</h4>
<p>Purchase products through the affiliate links below to enjoy discounts on mining hardware. Every
month, the miner who submits the highest difficulty will be rewarded with 100% of the affiliate
earnings.</p>
<div class="grid" style="padding-top: 20px;">
<div class="col-12 md:col-4">
<a href="https://www.solosatoshi.com/aff/7/" target="_blank">
<div class="text-center">
<h4 class="text-center"> Solo Satoshi (USA)</h4>
<img id="solosatoshi" style="height: 200px; width: 200px; object-fit: contain;"
src="assets/layout/images/solo-logo.webp" alt="solosatoshi">
<h5>Discount Code (6.5%): <code>RealPleb </code></h5>
</div>
</a>
</div>
<div class="col-12 md:col-4">
<a href="https://altairtech.io/aff/36" target="_blank">
<div class="text-center">
<h4>Altair Technology (USA)</h4>
<img id="altair" style="height: 200px; width: 200px; object-fit: cover;"
src="assets/layout/images/altair.png" alt="altair">
<h5>Discount Code: <code>solo</code></h5>
</div>
</a>
</div>
<div class="col-12 md:col-4">
<a href="https://www.thesolomining.co/" target="_blank">
<div class="text-center">
<h4 class="text-center"> The Solo Mining Co (UK)</h4>
<img id="soloco" style="height: 200px; width: 200px; object-fit: cover;"
src="assets/layout/images/soloco.png" alt="soloco">
<h5>Discount Code: <code>solo</code></h5>
</div>
</a>
</div>
<div class="col-12 md:col-4">
<a href="https://d-central.tech/product-category/asics/ref/benjamin.wilson/" target="_blank">
<div class="text-center">
<h4 class="text-center"> D-Central Tech (CA)</h4>
<img id="dcentral" style="height: 200px; width: 200px; object-fit: cover;"
src="assets/layout/images/dcentral.png" alt="dcentral">
<h5>Discount Code: <code>solo</code> (Bitaxe products)</h5>
</div>
</a>
</div>
<div class="col-12 md:col-4">
<a href="https://unfdxj-c2.myshopify.com?ref=public_pool" target="_blank">
<div class="text-center">
<h4>PlebSource (USA)</h4>
<img id="altair" style="height: 200px; width: 200px; object-fit: cover;"
src="assets/layout/images/plebsource.webp" alt="altair">
<!-- <h5>Discount Code (6%): <code>publicpool</code></h5> -->
</div>
</a>
</div>
<!-- <div class="col-12 md:col-4">
<a href="https://gobrrr.me/?coupon=solo" target="_blank">
<div class="text-center">
<h4 class="text-center"> Go Brrr (Austria)</h4>
<img id="GoBrrr" style="height: 200px; width: 200px; object-fit: contain;"
src="assets/layout/images/go-brrr.png" alt="GoBrrr">
</div>
</a>
</div> -->
<div class="col-12 md:col-4">
<a href="https://miningwholesale.eu/?wpam_id=143" target="_blank">
<div class="text-center">
<h4 class="text-center"> Mining Wholesale (EU)</h4>
<img id="GoBrrr" style="height: 200px; width: 200px; object-fit: contain;"
src="assets/layout/images/mining-wholesale.png" alt="GoBrrr">
</div>
</a>
</div>
</div>
</div>
</div>
<div class="col-12" *ngIf="highScores$ | async as highScores">
<div class="card">
<h4 style="text-align: center;">High Scores</h4>
<ng-container>
<p-table [value]="highScores">
<ng-template pTemplate="header">
<tr>
<th>Rank</th>
<th>Difficulty</th>
<th>Device</th>
<th>When</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-highScore let-i="rowIndex">
<tr></tr>
<tr>
<td>#{{i+1}}</td>
<td>{{ highScore.bestDifficulty | numberSuffix }}</td>
<td><app-user-agent-link
[userAgent]="highScore.bestDifficultyUserAgent ? highScore.bestDifficultyUserAgent : 'unknown'"></app-user-agent-link>
</td>
<td>{{ highScore.updatedAt | dateAgo}} ago</td>
</tr>
</ng-template>
</p-table>
<div class="text-right mt-2">
<i class="pi pi-star-fill"></i> = Open Source Software & Hardware
</div>
</ng-container>
<ng-template #loadingTable>
<p-table [value]="[{},{},{}]">
<ng-template pTemplate="header">
<tr>
<th>Device</th>
<th>Currently Working</th>
<th>Total Hash Rate</th>
<th>Best Difficulty <i class="pi pi-question-circle ml-2"
pTooltip="If you find a solution with a difficulty higher than the network difficulty, you've found a block."></i>
</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-row>
<tr></tr>
<tr>
<td><p-skeleton></p-skeleton></td>
<td><p-skeleton></p-skeleton></td>
<td><p-skeleton></p-skeleton></td>
<td><p-skeleton></p-skeleton></td>
</tr>
</ng-template>
</p-table>
</ng-template>
</div>
</div>
<div class="col-12" *ngIf="blockData$ | async as blockData">
<div class="card">
<h4 style="text-align: center;"> Found Blocks</h4>
<p-table [value]="blockData">
<ng-template pTemplate="header">
<tr>
<th>Height</th>
<th>Address</th>
<th>Worker</th>
<th>Session</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-block>
<tr>
<td>{{ block.height }}</td>
<td>{{ block.minerAddress }}</td>
<td>{{ block.worker }}</td>
<td>{{ block.sessionId }}</td>
</tr>
</ng-template>
</p-table>
</div>
</div>
<div class="col-12">
<div class="card">
<div class="grid">
<div class="col-12 md:col-2">
<h3>Donate</h3>
<p>Like the project? Consider a donation. </p>
</div>
<div class="col-12 md:col-4 text-center">
<img style="height: 200px;" src="assets/layout/images/qr-code-ln.svg"
alt="bc1q99n3pu025yyu0jlywpmwzalyhm36tg5u37w20d">
<div>public_pool&#64;strike.me</div>
</div>
<div class="col-12 md:col-6 text-center">
<img style="height: 200px;" src="assets/layout/images/qr-code-onchain.svg"
alt="bc1q99n3pu025yyu0jlywpmwzalyhm36tg5u37w20d">
<div>bc1q99n3pu025yyu0jlywpmwzalyhm36tg5u37w20d</div>
</div>
</div>
</div>
</div>
</div>
</div>