mirror of
https://github.com/btcpayserver/btcpayserver.git
synced 2025-02-26 15:41:29 +01:00
c97b859963
Based on the `ur-registry` upgrade I refactored the `CameraScanner` and `ShowQR` partials: Besides general code changes, the main change is that most of the configuration and result handling now happens on the outer view. Those partials and functions are now generalized and don't know about their purpose (like handling PSBTs): They can be instantiated with simple data (e.g. for displaying a plain QR code) or different modes (like showing a static and the UR version of a QR code) and the result handling is done via callback. The callbacks can now also distinguish between the different results (data as plain string vs. UR-type objects for wallet data or PSBT) and also handle the specific type of data. For instance: Before it wasn't possible to strip the leading derivation path from an xpub when scanning the QR code, because the scanner didn't know about the type of data it was handling. Now that the data is handled in the callback, we can implement that functionality for the scan view only.
97 lines
3.2 KiB
Text
97 lines
3.2 KiB
Text
@model WalletSetupViewModel
|
||
@{
|
||
Layout = "_LayoutWalletSetup";
|
||
ViewData.SetActivePage(StoreNavPages.OnchainSettings, "Scan QR code", Context.GetStoreData().Id);
|
||
}
|
||
|
||
@section Navbar {
|
||
<a asp-controller="UIStores" asp-action="ImportWallet" asp-route-storeId="@Model.StoreId" asp-route-cryptoCode="@Model.CryptoCode" asp-route-method="">
|
||
<vc:icon symbol="back" />
|
||
</a>
|
||
}
|
||
|
||
<header class="text-center">
|
||
<h1>@ViewData["Title"]</h1>
|
||
<p class="lead text-secondary mt-3">Scan the extended public key, also called "xpub", shown on your wallet's display.</p>
|
||
</header>
|
||
|
||
@if (!ViewContext.ModelState.IsValid)
|
||
{
|
||
<div asp-validation-summary="All" class="text-danger"></div>
|
||
}
|
||
|
||
<div class="my-5">
|
||
<partial name="CameraScanner"/>
|
||
<form id="qr-import-form" method="post">
|
||
<input asp-for="WalletFileContent" type="hidden" />
|
||
</form>
|
||
</div>
|
||
|
||
<p class="mt-5">
|
||
Generate a QR code of the extended public key in your wallet (see instructions for supported wallets below).
|
||
Allow the browser access to your camera and hold the code to the camera when the scan prompt appears.
|
||
</p>
|
||
|
||
<table class="table table-hover">
|
||
<thead>
|
||
<tr>
|
||
<th>Wallet</th>
|
||
<th>Instructions</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td>BlueWallet</td>
|
||
<td>Open Wallet Settings ❯ Show Wallet XPUB</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-nowrap">Cobo Vault</td>
|
||
<td>Open Wallet Settings ❯ Show/Export XPUB</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-nowrap">Keystone Vault</td>
|
||
<td>Open Wallet Settings ❯ Show/Export XPUB</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Passport</td>
|
||
<td>Pair Wallet ❯ BTCPay ❯ QR Code</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Specter DIY</td>
|
||
<td>Master public keys ❯ Select key ❯ Disable "Show derivation path"</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
|
||
@section PageHeadContent {
|
||
<link href="~/vendor/vue-qrcode-reader/vue-qrcode-reader.css" rel="stylesheet" asp-append-version="true"/>
|
||
}
|
||
|
||
@section PageFootContent {
|
||
<partial name="_ValidationScriptsPartial"/>
|
||
<bundle name="wwwroot/bundles/camera-bundle.min.js"></bundle>
|
||
<script>
|
||
window.coinName = "@Model.Network.DisplayName.ToLowerInvariant()";
|
||
document.addEventListener("DOMContentLoaded", function () {
|
||
initCameraScanningApp("Scan wallet QR", data => {
|
||
let xpub = "";
|
||
if (typeof(data) === "object") {
|
||
if (data.type === "crypto-account") {
|
||
const account = window.URlib.CryptoAccount.fromCBOR(data.cbor);
|
||
const [descriptor] = account.getOutputDescriptors();
|
||
xpub = descriptor.getHDKey().getBip32Key();
|
||
} else {
|
||
console.error('Unexpected UR type', data.type)
|
||
}
|
||
} else if (typeof(data) === 'string') {
|
||
xpub = data;
|
||
}
|
||
// remove potentially leading derivation path
|
||
xpub = xpub.replace(/^\[.*?\]/, '');
|
||
// submit
|
||
document.getElementById("WalletFileContent").value = xpub;
|
||
document.getElementById("qr-import-form").submit();
|
||
});
|
||
});
|
||
</script>
|
||
}
|