Add BTCPay integration
This commit is contained in:
9
res/static/img/btcpay.svg
Normal file
9
res/static/img/btcpay.svg
Normal file
@@ -0,0 +1,9 @@
|
|||||||
|
<svg width="209" height="57" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<rect fill="#0F3B21" width="209" height="57" rx="4"/>
|
||||||
|
<g fill-rule="nonzero">
|
||||||
|
<path d="M32.21 22.294c.795-.134 1.6-.2 2.405-.195 1.239 0 2.146.3 2.723.84.533.48.85 1.215.85 2.115 0 .915-.259 1.635-.749 2.16-.662.735-1.743 1.11-2.967 1.11-.375 0-.721-.015-1.009-.09v4.05H32.21v-9.99zm1.253 4.875c.274.075.62.105 1.037.105 1.513 0 2.435-.765 2.435-2.16 0-1.335-.907-1.979-2.29-1.979-.548 0-.965.045-1.182.105v3.929zm9.851 5.115l-.101-.915h-.043c-.389.57-1.138 1.08-2.132 1.08-1.412 0-2.132-1.035-2.132-2.085 0-1.755 1.498-2.715 4.191-2.7v-.15c0-.6-.158-1.68-1.584-1.68-.648 0-1.325.21-1.815.54l-.288-.87c.576-.39 1.412-.645 2.29-.645 2.132 0 2.65 1.515 2.65 2.97v2.715c0 .63.029 1.245.115 1.74h-1.151zm-.187-3.705c-1.383-.03-2.953.225-2.953 1.635 0 .855.547 1.26 1.195 1.26.907 0 1.483-.6 1.686-1.215.043-.135.072-.285.072-.42v-1.26zm3.897-3.555l1.526 4.29c.159.48.332 1.05.447 1.485h.029c.13-.435.273-.99.446-1.515l1.383-4.26h1.34l-1.901 5.175c-.907 2.49-1.527 3.765-2.391 4.545-.62.57-1.239.795-1.556.855l-.317-1.11a3.32 3.32 0 0 0 1.109-.645c.346-.285.777-.795 1.065-1.47.058-.135.101-.24.101-.315 0-.075-.029-.18-.086-.345l-2.578-6.69h1.383zm11.297 0l.922 3.69c.202.81.389 1.56.519 2.31h.043c.159-.735.389-1.515.62-2.295l1.138-3.705h1.065l1.081 3.63c.259.87.461 1.635.62 2.37h.043c.115-.735.303-1.5.533-2.355l.994-3.645h1.253l-2.247 7.26h-1.152l-1.066-3.465a25 25 0 0 1-.619-2.385h-.029a22.19 22.19 0 0 1-.634 2.4l-1.124 3.45h-1.152l-2.103-7.26h1.295zm11.222-2.04c.014.45-.303.81-.807.81-.447 0-.764-.36-.764-.81 0-.465.331-.825.792-.825.476 0 .779.36.779.825zm-1.412 9.3v-7.26h1.268v7.26h-1.268zm4.329-9.345v2.085h1.815v1.005H72.46v3.915c0 .9.245 1.41.951 1.41.331 0 .576-.045.734-.09l.058.99c-.245.105-.634.18-1.124.18-.59 0-1.066-.195-1.369-.555-.36-.39-.489-1.035-.489-1.89v-3.96H70.14v-1.005h1.081v-1.74l1.239-.345zm3.523-1.305h1.268v4.53h.029c.201-.375.519-.705.907-.93.39-.24.838-.37 1.296-.375.936 0 2.434.6 2.434 3.105v4.32H80.65v-4.17c0-1.17-.417-2.16-1.613-2.16-.821 0-1.469.6-1.699 1.32-.072.18-.087.375-.087.63v4.38h-1.268v-10.65zm47.186.014c.518 0 1.017.051 1.495.153.478.103.898.276 1.261.522.363.246.654.57.873.972.219.402.329.903.329 1.503a3.132 3.132 0 0 1-.596 1.845c-.19.258-.415.477-.674.657-.259.18-.55.306-.873.378v.036c.794.108 1.428.447 1.9 1.017.473.57.708 1.275.708 2.115 0 .204-.017.435-.052.693a3.396 3.396 0 0 1-.657 1.593 2.697 2.697 0 0 1-.786.693c-.328.198-.731.36-1.209.486-.478.126-1.051.189-1.719.189h-4.368V21.648h4.368zm0 5.634c.472 0 .881-.057 1.227-.171.346-.114.634-.27.864-.468a1.92 1.92 0 0 0 .518-.693c.115-.264.173-.546.173-.846 0-1.608-.927-2.412-2.782-2.412h-3.192v4.59h3.192zm0 6.174c.438 0 .852-.039 1.244-.117.37-.07.723-.213 1.037-.423.299-.204.536-.477.708-.819.173-.342.259-.771.259-1.287 0-.828-.279-1.449-.838-1.863-.559-.414-1.362-.621-2.41-.621h-3.192v5.13h3.192zm12.365-11.808v1.044h-3.167V34.5h-1.175V22.692h-3.151v-1.044h7.493zm9.213 2.653a3.504 3.504 0 0 0-.844-.958c-.33-.257-.7-.456-1.097-.589a3.905 3.905 0 0 0-1.258-.202c-.799 0-1.486.158-2.06.475a4.136 4.136 0 0 0-1.41 1.257 5.506 5.506 0 0 0-.811 1.768 7.83 7.83 0 0 0-.262 2.023c0 .68.087 1.351.262 2.013.174.663.444 1.255.811 1.777a4.12 4.12 0 0 0 1.41 1.258c.574.316 1.261.475 2.06.475.563 0 1.069-.105 1.52-.316a3.624 3.624 0 0 0 1.166-.862c.326-.364.591-.789.793-1.275a5.464 5.464 0 0 0 .388-1.574h1.148a7.009 7.009 0 0 1-.523 2.093 5.157 5.157 0 0 1-1.047 1.583 4.408 4.408 0 0 1-1.511 1.002 5.122 5.122 0 0 1-1.933.352c-.946 0-1.776-.179-2.491-.537a5.187 5.187 0 0 1-1.781-1.434 6.196 6.196 0 0 1-1.064-2.076 8.571 8.571 0 0 1-.354-2.479c0-.868.118-1.694.354-2.48a6.274 6.274 0 0 1 1.064-2.084 5.16 5.16 0 0 1 1.781-1.442c.715-.357 1.545-.537 2.491-.537.574 0 1.134.088 1.68.264a4.81 4.81 0 0 1 1.486.783c.444.346.816.771 1.114 1.275a4.42 4.42 0 0 1 .566 1.741h-1.148a4.144 4.144 0 0 0-.5-1.294zm7.957-2.653c.553 0 1.054.081 1.503.243.449.162.835.402 1.158.72.323.318.57.705.743 1.161.173.456.259.972.259 1.548 0 .576-.086 1.943-.259 2.399-.173.456-.42.843-.743 1.161a3.135 3.135 0 0 1-1.158.72c-.45.162-.95.243-1.503.243h-2.884V34.5h-1.175V21.648h4.059zm-.259 7.151c.818 0 1.48-.216 1.987-.648.507-.432.761-1.943.761-2.831 0-.888-.254-1.548-.761-1.98-.507-.432-1.169-.648-1.987-.648h-2.625v6.107h2.625zm9.917-7.151l4.839 12.852h-1.261l-1.504-3.996h-5.616l-1.486 3.996h-1.244l4.959-12.852h1.313zm1.676 7.812l-2.383-6.588-2.473 6.588h4.856zm1.36-7.812h1.382l4.059 6.516 4.043-6.516h1.399l-4.872 7.56V34.5h-1.176v-5.292l-4.835-7.56z" fill="#FFF"/>
|
||||||
|
<path d="M96.329 23.548v-8.32l10.112 4.812-7.447 5.435 3.511 2.537 8.67-6.263c.887-.685 1.469-1.238 1.42-2.137-.069-1.287-.922-1.772-1.695-2.081l-15.396-7.293s-1.7-.78-2.801.482c-.384.44-.453 1.765-.453 1.765v31.58h.029c-.036-1.295 1.166-1.901 1.166-1.901l2.884-1.372V23.548z" fill="#CDD932"/>
|
||||||
|
<path fill="#1D7A44" d="M102.505 28.01l-6.176-4.462v8.928z"/>
|
||||||
|
<path d="M111.176 34.272l-8.67-6.262-3.511 2.536 7.447 5.434-10.112 4.813-2.884 1.372s-1.202.604-1.166 1.901c.009.324.093.689.294 1.101.745 1.521 2.93.615 2.93.615l15.398-7.292c.772-.309 1.625-.793 1.694-2.081.049-.899-.534-1.452-1.42-2.137z" fill="#51B13E"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 5.1 KiB |
@@ -27,23 +27,21 @@ onMount(() => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
let now = new Date().getTime()
|
let now = new Date().getTime()
|
||||||
switch (now % 8) {
|
switch (now % 6) {
|
||||||
case 0:
|
case 0:
|
||||||
case 1:
|
case 1:
|
||||||
case 2:
|
|
||||||
case 3:
|
|
||||||
set_ad_type("aads")
|
set_ad_type("aads")
|
||||||
break
|
break
|
||||||
case 4:
|
case 2:
|
||||||
set_ad_type("brave")
|
set_ad_type("brave")
|
||||||
break
|
break
|
||||||
case 5:
|
case 3:
|
||||||
set_ad_type("ads.plus")
|
set_ad_type("ads.plus")
|
||||||
break
|
break
|
||||||
case 6:
|
case 4:
|
||||||
set_ad_type("adaround")
|
set_ad_type("adaround")
|
||||||
break
|
break
|
||||||
case 7:
|
case 5:
|
||||||
set_ad_type("flyingsquare")
|
set_ad_type("flyingsquare")
|
||||||
break
|
break
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -31,7 +31,7 @@ onMount(async () => {
|
|||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
switch (now % 3) {
|
switch (now % 4) {
|
||||||
case 0:
|
case 0:
|
||||||
set_ad_type("ads.plus")
|
set_ad_type("ads.plus")
|
||||||
break
|
break
|
||||||
@@ -41,6 +41,9 @@ onMount(async () => {
|
|||||||
case 2:
|
case 2:
|
||||||
set_ad_type("flyingsquare")
|
set_ad_type("flyingsquare")
|
||||||
break
|
break
|
||||||
|
case 3:
|
||||||
|
set_ad_type("aads")
|
||||||
|
break
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|||||||
@@ -62,7 +62,7 @@ onMount(() => {
|
|||||||
<i class="icon">shopping_cart</i>
|
<i class="icon">shopping_cart</i>
|
||||||
Subscription
|
Subscription
|
||||||
</a>
|
</a>
|
||||||
{#if window.user.balance_micro_eur !== 0}
|
{#if window.user.subscription.type !== "patreon"}
|
||||||
<a class="button"
|
<a class="button"
|
||||||
href="/user/transactions"
|
href="/user/transactions"
|
||||||
class:button_highlight={page === "transactions"}
|
class:button_highlight={page === "transactions"}
|
||||||
|
|||||||
@@ -62,37 +62,59 @@ const load_transactions = async () => {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
let result = ""
|
let credit_amount = 10
|
||||||
let result_success = false
|
|
||||||
|
|
||||||
const update_subscription = async name => {
|
const checkout = async () => {
|
||||||
loading = true
|
loading = true
|
||||||
|
|
||||||
const form = new FormData()
|
const form = new FormData()
|
||||||
form.append("subscription", name)
|
form.set("amount", credit_amount*1e6)
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const resp = await fetch(
|
const resp = await fetch(
|
||||||
window.api_endpoint+"/user/subscription",
|
window.api_endpoint+"/btcpay/deposit",
|
||||||
{ method: "PUT", body: form },
|
{ method: "POST", body: form },
|
||||||
)
|
)
|
||||||
if(resp.status >= 400) {
|
if(resp.status >= 400) {
|
||||||
let json = await resp.json()
|
let json = await resp.json()
|
||||||
throw json.message
|
throw json.message
|
||||||
}
|
}
|
||||||
|
|
||||||
result_success = true
|
window.location = (await resp.json()).checkout_url
|
||||||
result = "Subscription updated"
|
|
||||||
|
|
||||||
setTimeout(() => {location.reload()}, 2000)
|
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
result_success = false
|
alert(err)
|
||||||
result = "Failed to update subscription: "+err
|
} finally {
|
||||||
loading = false
|
loading = false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
let show_expired = false
|
||||||
|
let invoices = []
|
||||||
|
const load_invoices = async () => {
|
||||||
|
loading = true
|
||||||
|
try {
|
||||||
|
const resp = await fetch(window.api_endpoint+"/btcpay/invoice")
|
||||||
|
if(resp.status >= 400) {
|
||||||
|
throw new Error((await resp.json()).message)
|
||||||
|
}
|
||||||
|
|
||||||
|
let invoices_tmp = await resp.json()
|
||||||
|
invoices_tmp.forEach(row => {
|
||||||
|
row.time = new Date(row.time)
|
||||||
|
})
|
||||||
|
invoices_tmp.sort((a, b) => {
|
||||||
|
return b.time - a.time
|
||||||
|
})
|
||||||
|
invoices = invoices_tmp
|
||||||
|
} catch (err) {
|
||||||
|
alert(err)
|
||||||
|
} finally {
|
||||||
|
loading = false
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
onMount(() => {
|
onMount(() => {
|
||||||
load_transactions()
|
load_transactions()
|
||||||
|
load_invoices()
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -103,6 +125,80 @@ onMount(() => {
|
|||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
<div class="limit_width">
|
<div class="limit_width">
|
||||||
|
<h2>Deposit Bitcoin</h2>
|
||||||
|
<p>
|
||||||
|
You can deposit credit on your pixeldrain account with Bitcoin. We
|
||||||
|
support regular Bitcoin transactions and Lightning transactions. You
|
||||||
|
must pay the full amount as stated on the invoice, else your payment
|
||||||
|
will fail.
|
||||||
|
</p>
|
||||||
|
<div class="indent" style="text-align: center;">
|
||||||
|
<img src="/res/img/btcpay.svg" alt="BTCPay server logo"/>
|
||||||
|
<br/>
|
||||||
|
<form on:submit|preventDefault={checkout} class="checkout_form">
|
||||||
|
<div style="margin: 0.5em;">€</div>
|
||||||
|
<input type="number" bind:value={credit_amount} min="1"/>
|
||||||
|
<button type="submit">
|
||||||
|
<i class="icon">paid</i> Checkout
|
||||||
|
</button>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h3>Open invoices</h3>
|
||||||
|
<div class="table_scroll">
|
||||||
|
<table style="text-align: left;">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<td>Created</td>
|
||||||
|
<td>Amount</td>
|
||||||
|
<td>Status</td>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
{#each invoices as row (row.id)}
|
||||||
|
{#if row.status === "New" || row.status === "InvoiceCreated" || show_expired}
|
||||||
|
<tr>
|
||||||
|
<td>{formatDate(row.time, true, true, false)}</td>
|
||||||
|
<td><Euro amount={row.amount}></Euro></td>
|
||||||
|
<td>
|
||||||
|
{#if row.status === "New" || row.status === "InvoiceCreated"}
|
||||||
|
New (waiting for payment)
|
||||||
|
{:else if row.status === "InvoiceProcessing"}
|
||||||
|
Payment received, waiting for confirmations
|
||||||
|
{:else if row.status === "InvoiceSettled"}
|
||||||
|
Paid
|
||||||
|
{:else if row.status === "InvoiceExpired"}
|
||||||
|
Expired
|
||||||
|
{:else}
|
||||||
|
{row.status}
|
||||||
|
{/if}
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
{#if row.status === "New" || row.status === "InvoiceCreated"}
|
||||||
|
<a href={row.checkout_url} class="button button_highlight">
|
||||||
|
<i class="icon">paid</i> Pay
|
||||||
|
</a>
|
||||||
|
{/if}
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{/if}
|
||||||
|
{/each}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
<div style="text-align: center;">
|
||||||
|
<button on:click={() => {show_expired = !show_expired}}>
|
||||||
|
{#if show_expired}
|
||||||
|
Hide
|
||||||
|
{:else}
|
||||||
|
Show
|
||||||
|
{/if}
|
||||||
|
expired and settled invoices
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<h2>Transaction log</h2>
|
<h2>Transaction log</h2>
|
||||||
<p>
|
<p>
|
||||||
Here is a log of all transactions on your account balance.
|
Here is a log of all transactions on your account balance.
|
||||||
@@ -169,4 +265,10 @@ onMount(() => {
|
|||||||
width: 100px;
|
width: 100px;
|
||||||
z-index: 1000;
|
z-index: 1000;
|
||||||
}
|
}
|
||||||
|
.checkout_form {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user