Improve information structure on Lightning page

This commit is contained in:
Dennis Reimann 2020-06-29 16:54:07 +02:00
parent d3325f17c5
commit 04acbf6509
No known key found for this signature in database
GPG Key ID: 5009E1797F03F8D0
5 changed files with 106 additions and 64 deletions

View File

@ -159,7 +159,7 @@ namespace BTCPayServer.Controllers
await handler.TestConnection(info, cts.Token); await handler.TestConnection(info, cts.Token);
} }
} }
TempData[WellKnownTempData.SuccessMessage] = $"Connection to the lightning node succeeded ({info})"; TempData[WellKnownTempData.SuccessMessage] = $"Connection to the lightning node succeeded. Your node address: {info}";
} }
catch (Exception ex) catch (Exception ex)
{ {

View File

@ -23,6 +23,8 @@ namespace BTCPayServer.Models.StoreViewModels
} }
public string InternalLightningNode { get; internal set; } public string InternalLightningNode { get; internal set; }
public bool SkipPortTest { get; set; } public bool SkipPortTest { get; set; }
[Display(Name="Lightning enabled")]
public bool Enabled { get; set; } = true; public bool Enabled { get; set; } = true;
public string StoreId { get; set; } public string StoreId { get; set; }

View File

@ -1,24 +1,22 @@
@model LightningNodeViewModel @model LightningNodeViewModel
@{ @{
Layout = "../Shared/_NavLayout.cshtml"; Layout = "../Shared/_NavLayout.cshtml";
ViewData.SetActivePageAndTitle(StoreNavPages.Index, "Add lightning node (Experimental)"); ViewData.SetActivePageAndTitle(StoreNavPages.Index, "Add lightning node");
} }
<partial name="_StatusMessage" /> <partial name="_StatusMessage" />
<div class="alert alert-warning alert-dismissible" role="alert"> <div class="alert alert-warning alert-dismissible mb-5" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button> <h4 class="alert-heading">Warning</h4>
<p> <p>
<span>Before you proceed, please understand that the Lightning Network is still considered experimental and is under active development.</span> <span>Before you proceed, please understand that the Lightning Network is still considered experimental and is under active development.</span>
</p> </p>
<p><strong>Do not add money that you can't afford to lose - there's a high risk of loss of funds.</strong></p> <p><strong>Do not add money that you can't afford to lose - there's a high risk of loss of funds.</strong></p>
<p> <p class="mb-2">Take time to familiarize yourself with the risks, some of which are:</p>
Take time to familiarize yourself with the risks, some of which are: <ul class="mb-4">
</p>
<ul>
<li>Most BTCPay Server deployments run on a pruned node which, while working, is not officially supported by lightning network implementations.</li> <li>Most BTCPay Server deployments run on a pruned node which, while working, is not officially supported by lightning network implementations.</li>
<li> <li>
Lightning keys are NOT automatically backed up by BTCPay Server; your keys are in a hot-wallet. This means: Lightning keys are NOT automatically backed up by BTCPay Server. Your keys are in a hot-wallet. This means:
<ul> <ul>
<li>If you erase your BTCPay Server virtual machine: you lose all the funds.</li> <li>If you erase your BTCPay Server virtual machine: you lose all the funds.</li>
<li>If your server gets hacked: a hacker can take all of your funds by accessing your keys.</li> <li>If your server gets hacked: a hacker can take all of your funds by accessing your keys.</li>
@ -26,84 +24,109 @@
</ul> </ul>
</li> </li>
</ul> </ul>
<hr>
<p>To proceed, please ensure that:</p> <p class="mb-2">To proceed, please ensure that:</p>
<ul> <ul>
<li>You accept being #reckless and being the sole responsible party for any loss of funds.</li> <li>You accept being #reckless and being the sole responsible party for any loss of funds.</li>
<li>You agree to keep on your lightning node only what you can afford to lose.</li> <li>You agree to keep on your lightning node only what you can afford to lose.</li>
</ul> </ul>
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div> </div>
<div class="row"> <div class="row">
<div class="col-md-10"> <div class="col">
<h3 class="mb-3">Lightning Node Connection</h3>
<form method="post"> <form method="post">
<div class="form-group"> <div class="form-group">
<p>This connection string encapsulates the necessary information BTCPay needs to connect to your lightning node, we currently support:</p> <p class="mb-2">The connection string encapsulates the configuration for connecting to your lightning node. We currently support:</p>
<ul> <ul>
<li><code>clightning</code> via TCP or unix domain socket connection</li> <li class="mb-2">
<li><code>lightning charge</code> via HTTPS</li> <strong>c-lightning</strong> via TCP or unix domain socket connection:
<li><code>lnd</code> via the REST proxy</li> <ul>
<li>
<code><b>type=</b>clightning;<b>server=</b>unix://root/.lightning/lightning-rpc</code>
</li>
<li>
<code><b>type=</b>clightning;<b>server=</b>tcp://1.1.1.1:27743/</code>
</li>
</ul>
</li>
<li class="mb-2">
<strong>Lightning Charge</strong> via HTTPS:
<ul>
<li>
<code><b>type=</b>charge;<b>server=</b>https://charge:8080/;<b>api-token=</b>myapitoken...</code>
</li>
</ul>
</li>
<li class="mb-2">
<strong>Eclair</strong> via HTTPS:
<ul>
<li>
<code><b>type=</b>eclair;<b>server=</b>https://eclair:8080/;<b>password=</b>eclairpassword...</code>
</li>
</ul>
</li>
<li class="mb-2">
<strong>LND</strong> via the REST proxy:
<ul>
<li>
<code><b>type=</b>lnd-rest;<b>server=</b>https://mylnd:8080/;<b>macaroon=</b>abef263adfe...</code>
</li>
<li>
<code><b>type=</b>lnd-rest;<b>server=</b>https://mylnd:8080/;<b>macaroon=</b>abef263adfe...;<b>certthumbprint=</b>abef263adfe...</code>
</li>
<li>
<code><b>type=</b>lnd-rest;<b>server=</b>http://mylnd:8080/;<b>macaroonfilepath=</b>/root/.lnd/admin.macaroon;<b>allowinsecure=</b>true</code>
</li>
</ul>
<a class="d-inline-block my-2 text-secondary text-decoration-none" data-toggle="collapse" href="#lnd-notes" role="button" aria-expanded="false" aria-controls="lnd-notes">
<span class="fa fa-question-circle-o" title="More information..."></span> More information on the LND settings
</a>
<div class="collapse" id="lnd-notes">
<div class="card card-body">
<p>For the macaroon options you need to provide the <code>admin.macaroon</code>.</p>
<p>The path to the LND data directory may vary, the following example assume <code>/root/.lnd</code>.</p>
<p class="mb-2">The <code>macaroon</code> parameter expects the HEX value, it can be obtained using this command:</p>
<pre class="mb-4">xxd -plain /root/.lnd/data/chain/bitcoin/mainnet/admin.macaroon | tr -d '\n'</pre>
<p>You can omit <code>certthumbprint</code> if the certificate is trusted by your machine.</p>
<p class="mb-2">The <code>certthumbprint</code> can be obtained using this command:</p>
<pre class="mb-4">openssl x509 -noout -fingerprint -sha256 -in /root/.lnd/tls.cert | sed -e 's/.*=//;s/://g'</pre>
<p class="mb-0">If your LND REST server is using HTTP or HTTPS with an untrusted certificate, you can set <code>allowinsecure=true</code> as a fallback.</p>
</div>
</div>
</li>
</ul> </ul>
<table class="table table-sm table-responsive-md">
<thead>
<tr>
<th>Examples</th>
</tr>
</thead>
<tbody>
<tr>
<th class="small"><b>type=</b>clightning;<b>server=</b>unix://root/.lightning/lightning-rpc</th>
</tr>
<tr>
<th class="small"><b>type=</b>clightning;<b>server=</b>tcp://1.1.1.1:27743/</th>
</tr>
<tr>
<th class="small"><b>type=</b>lnd-rest;<b>server=</b>http://mylnd:8080/;<b>macaroonfilepath=</b>/root/.lnd/admin.macaroon;<b>allowinsecure=</b>true</th>
</tr>
<tr>
<th class="small"><b>type=</b>lnd-rest;<b>server=</b>https://mylnd:8080/;<b>macaroon=</b>abef263adfe...</th>
</tr>
<tr>
<th class="small"><b>type=</b>lnd-rest;<b>server=</b>https://mylnd:8080/;<b>macaroon=</b>abef263adfe...;<b>certthumbprint=</b>abef263adfe...</th>
</tr>
<tr>
<th class="small"><b>type=</b>charge;<b>server=</b>https://charge:8080/;<b>api-token=</b>myapitoken...</th>
</tr>
<tr>
<th class="small"><b>type=</b>eclair;<b>server=</b>https://eclair:8080/;<b>password=</b>eclairpassword...</th>
</tr>
</tbody>
</table>
<p>Note that the <code>certthumbprint</code> to connect to your LND node can be obtained through this command line:</p>
<p><pre><code>openssl x509 -noout -fingerprint -sha256 -inform pem -in /root/.lnd/tls.cert | sed -e 's/.*=//' -e 's/://g'</code></pre></p>
<p>You can omit <code>certthumbprint</code> if the certificate is trusted by your machine</p>
<p>You can set <code>allowinsecure</code> to <code>true</code> if your LND REST server is using HTTP or HTTPS with an untrusted certificate which you don't know the <code>certthumbprint</code></p>
</div> </div>
<div class="form-group"> <div class="form-group">
<label asp-for="ConnectionString"></label> <label asp-for="ConnectionString"></label>
<input id="lightningurl" asp-for="ConnectionString" class="form-control" /> <input asp-for="ConnectionString" class="form-control"/>
<span asp-validation-for="ConnectionString" class="text-danger"></span> <span asp-validation-for="ConnectionString" class="text-danger"></span>
@if (Model.InternalLightningNode != null) @if (Model.InternalLightningNode != null)
{ {
<p class="form-text text-muted"> <p class="form-text text-muted">
You can use the internal lightning node by <a href="#" id="internal-ln-node-setter" onclick="$('#lightningurl').val('@Model.InternalLightningNode'); return false;">clicking here</a> Use the internal lightning node of this BTCPay Server instance by
<a href="#" id="internal-ln-node-setter" onclick="$('#ConnectionString').val('@Model.InternalLightningNode');return false;">clicking here</a>.
</p> </p>
} }
</div> </div>
<div class="form-group"> <div class="form-group form-check">
<label asp-for="Enabled"></label> <input asp-for="Enabled" type="checkbox" class="form-check-input"/>
<input asp-for="Enabled" type="checkbox" class="form-check" /> <label asp-for="Enabled" class="form-check-label"></label>
</div> </div>
<button id="save" name="command" type="submit" value="save" class="btn btn-primary">Submit</button> <button id="save" name="command" type="submit" value="save" class="btn btn-primary">Submit</button>
<button name="command" type="submit" value="test" class="btn btn-secondary">Test connection</button> <button name="command" type="submit" value="test" class="btn btn-secondary mr-3">Test connection</button>
<a <a
class="btn btn-secondary" class="text-secondary"
asp-controller="PublicLightningNodeInfo" asp-controller="PublicLightningNodeInfo"
asp-action="ShowLightningNodeInfo" asp-action="ShowLightningNodeInfo"
asp-route-cryptoCode="@Model.CryptoCode" asp-route-cryptoCode="@Model.CryptoCode"
asp-route-storeId="@Model.StoreId" asp-route-storeId="@Model.StoreId"
target="_blank"> target="_blank">
<span class="fa fa-info-circle" title="More information..."></span>
Open Public Node Info Page Open Public Node Info Page
</a> </a>
</form> </form>

View File

@ -9,6 +9,7 @@
<!-- Bootstrap --> <!-- Bootstrap -->
<link href="main/bootstrap/bootstrap.css" rel="stylesheet" /> <link href="main/bootstrap/bootstrap.css" rel="stylesheet" />
<link href="main/bootstrap4-creativestart/creative.css" rel="stylesheet" /> <link href="main/bootstrap4-creativestart/creative.css" rel="stylesheet" />
<link href="main/site.css" rel="stylesheet" />
<script> <script>
const theme = window.location.search.replace('?theme=','') || 'default'; const theme = window.location.search.replace('?theme=','') || 'default';
document.write(`<link href="main/themes/${theme}.css" rel="stylesheet" />`) document.write(`<link href="main/themes/${theme}.css" rel="stylesheet" />`)

View File

@ -47,6 +47,15 @@ a {
transition-property: background, color; transition-property: background, color;
} }
ul {
padding-left: 1em;
}
ul li {
padding-top: .2em;
padding-bottom: .2em;
}
.navbar .onion { .navbar .onion {
margin-right: auto; margin-right: auto;
} }
@ -174,3 +183,10 @@ pre {
margin-top: -36px; margin-top: -36px;
margin-left: 16px; margin-left: 16px;
} }
.alert hr {
display: block;
width: unset;
height: 1px;
background: none;
}