added the reverse swap as well
This commit is contained in:
Uthpala Heenatigala
parent
697b105a10
commit
4645b8338b
4 changed files with 257 additions and 61 deletions
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "Deezy",
|
"name": "Deezy",
|
||||||
"short_description": "Join us, make an extension",
|
"short_description": "Join us, make an extension",
|
||||||
"icon": "info",
|
"icon": "swap_horiz",
|
||||||
"contributors": ["Uthpala"]
|
"contributors": ["Uthpala"]
|
||||||
}
|
}
|
||||||
|
|
|
||||||
255
lnbits/extensions/deezy/templates/deezy/index.html
Normal file
255
lnbits/extensions/deezy/templates/deezy/index.html
Normal file
|
|
@ -0,0 +1,255 @@
|
||||||
|
{% extends "base.html" %} {% from "macros.jinja" import window_vars with context
|
||||||
|
%} {% block page %}
|
||||||
|
<q-card>
|
||||||
|
<q-card-section>
|
||||||
|
<h5 class="text-subtitle1 q-mt-none q-mb-md">
|
||||||
|
Deezy
|
||||||
|
</h5>
|
||||||
|
<q-separator class="q-my-lg"></q-separator>
|
||||||
|
<q-card>
|
||||||
|
<q-card-section>
|
||||||
|
<q-btn
|
||||||
|
label="Swap (In)"
|
||||||
|
unelevated
|
||||||
|
color="primary"
|
||||||
|
@click="swapLnToBtc.show = true; swapBtcToLn.show = false"
|
||||||
|
>
|
||||||
|
<q-tooltip class="bg-grey-8" anchor="bottom left" self="top left">
|
||||||
|
Send onchain funds offchain (BTC -> LN)
|
||||||
|
</q-tooltip>
|
||||||
|
</q-btn>
|
||||||
|
<q-btn
|
||||||
|
label="Reverse Swap (Out)"
|
||||||
|
unelevated
|
||||||
|
color="primary"
|
||||||
|
@click="swapBtcToLn.show = true; swapLnToBtc.show = false;"
|
||||||
|
>
|
||||||
|
<q-tooltip class="bg-grey-8" anchor="bottom left" self="top left">
|
||||||
|
Send offchain funds to onchain address (LN -> BTC)
|
||||||
|
</q-tooltip>
|
||||||
|
</q-btn>
|
||||||
|
</q-card-section>
|
||||||
|
</q-card>
|
||||||
|
<div v-show="swapLnToBtc.show" class="q-pa-lg q-pt-xl lnbits__dialog-card">
|
||||||
|
<h6 class="q-mt-none">Lightning Btc -> Btc</h6>
|
||||||
|
<q-form @submit="sendLnToBtc" class="q-gutter-md">
|
||||||
|
<q-input
|
||||||
|
filled
|
||||||
|
dense
|
||||||
|
emit-value
|
||||||
|
v-model.trim="swapLnToBtc.data.amount"
|
||||||
|
label="Amount"
|
||||||
|
type="number"
|
||||||
|
></q-input>
|
||||||
|
<q-input
|
||||||
|
filled
|
||||||
|
dense
|
||||||
|
emit-value
|
||||||
|
v-model.trim="swapLnToBtc.data.refund_address"
|
||||||
|
type="string"
|
||||||
|
label="Onchain address to receive funds"
|
||||||
|
></q-input>
|
||||||
|
<q-input
|
||||||
|
filled
|
||||||
|
dense
|
||||||
|
emit-value
|
||||||
|
v-model.trim="swapLnToBtc.data.onChainFees"
|
||||||
|
label="On chain fees"
|
||||||
|
min="1"
|
||||||
|
type="number"
|
||||||
|
></q-input>
|
||||||
|
<q-btn
|
||||||
|
unelevated
|
||||||
|
color="primary"
|
||||||
|
type="submit"
|
||||||
|
label="Create Swap"
|
||||||
|
></q-btn>
|
||||||
|
<q-btn
|
||||||
|
flat
|
||||||
|
color="grey"
|
||||||
|
class="q-ml-auto"
|
||||||
|
@click="resetSwapLnToBtc"
|
||||||
|
>Cancel</q-btn>
|
||||||
|
</q-form>
|
||||||
|
<q-dialog v-model="swapLnToBtc.showInvoice" persistent>
|
||||||
|
<q-card flat bordered class="my-card">
|
||||||
|
<q-card-section>
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<div class="text-h6">Pay invoice to complete swap</div>
|
||||||
|
<q-btn flat v-close-popup>
|
||||||
|
<q-icon name="close" />
|
||||||
|
</q-btn>
|
||||||
|
</div>
|
||||||
|
</q-card-section>
|
||||||
|
<q-card-section class="q-pt-none">
|
||||||
|
<qrcode
|
||||||
|
:value="swapLnToBtc.response"
|
||||||
|
:options="{width: 360}"
|
||||||
|
class="rounded-borders"
|
||||||
|
></qrcode>
|
||||||
|
</q-card-section>
|
||||||
|
<q-card-section>
|
||||||
|
<q-btn outline @click="copyLnInvoice" label="Copy" color="primary"></q-btn>
|
||||||
|
<q-input
|
||||||
|
v-model="swapLnToBtc.response"
|
||||||
|
type="textarea"
|
||||||
|
readonly
|
||||||
|
@click="$event.target.select()"
|
||||||
|
/>
|
||||||
|
</q-card-section>
|
||||||
|
</q-card>
|
||||||
|
</q-dialog>
|
||||||
|
</div>
|
||||||
|
<div v-show="swapBtcToLn.show" class="q-pa-lg q-pt-xl lnbits__dialog-card">
|
||||||
|
<h6 class="q-mt-none">Btc -> Lightning Btc</h6>
|
||||||
|
<q-form @submit="sendBtcToLn" class="q-gutter-md">
|
||||||
|
<q-input
|
||||||
|
filled
|
||||||
|
dense
|
||||||
|
emit-value
|
||||||
|
v-model.trim="swapBtcToLn.data.lnurl_or_lnaddress"
|
||||||
|
label="Lnurl or Lightning Address"
|
||||||
|
type="string"
|
||||||
|
></q-input>
|
||||||
|
<q-input
|
||||||
|
filled
|
||||||
|
dense
|
||||||
|
emit-value
|
||||||
|
v-model.trim="swapBtcToLn.data.secret_access_key"
|
||||||
|
type="string"
|
||||||
|
label="Secret Access Key"
|
||||||
|
></q-input>
|
||||||
|
<q-input
|
||||||
|
filled
|
||||||
|
dense
|
||||||
|
emit-value
|
||||||
|
v-model.trim="swapBtcToLn.data.webhook_url"
|
||||||
|
label="Webhook url"
|
||||||
|
type="string"
|
||||||
|
></q-input>
|
||||||
|
<q-btn
|
||||||
|
unelevated
|
||||||
|
color="primary"
|
||||||
|
type="submit"
|
||||||
|
label="Create Swap"
|
||||||
|
></q-btn>
|
||||||
|
<q-btn
|
||||||
|
flat
|
||||||
|
color="grey"
|
||||||
|
class="q-ml-auto"
|
||||||
|
@click="resetSwapBtcToLn"
|
||||||
|
>Cancel</q-btn>
|
||||||
|
</q-form>
|
||||||
|
<q-dialog v-model="swapBtcToLn.showDetails" persistent maximized>
|
||||||
|
<q-card flat bordered class="my-card">
|
||||||
|
<q-card-section>
|
||||||
|
<div class="flex justify-between">
|
||||||
|
<div class="text-h6">Response - Important</div>
|
||||||
|
<q-btn flat v-close-popup>
|
||||||
|
<q-icon name="close" />
|
||||||
|
</q-btn>
|
||||||
|
</div>
|
||||||
|
</q-card-section>
|
||||||
|
{% raw %}
|
||||||
|
<q-card-section>
|
||||||
|
Address - {{ swapBtcToLn.response.address }}
|
||||||
|
</q-card-section>
|
||||||
|
<q-card-section>
|
||||||
|
Commitment - {{ swapBtcToLn.response.commitment }}
|
||||||
|
</q-card-section>
|
||||||
|
<q-card-section>
|
||||||
|
Secret Access Key - {{ swapBtcToLn.response.secret_access_key }}
|
||||||
|
</q-card-section>
|
||||||
|
<q-card-section>
|
||||||
|
Signature - {{ swapBtcToLn.response.signature }}
|
||||||
|
</q-card-section>
|
||||||
|
<q-card-section>
|
||||||
|
Webhook Url - {{ swapBtcToLn.response.webhook_url }}
|
||||||
|
</q-card-section>
|
||||||
|
{% endraw %}
|
||||||
|
</q-card>
|
||||||
|
</q-dialog>
|
||||||
|
</div>
|
||||||
|
</q-card>
|
||||||
|
{% endblock %} {% block scripts %} {{ window_vars(user) }}
|
||||||
|
<script>
|
||||||
|
Vue.component(VueQrcode.name, VueQrcode)
|
||||||
|
new Vue({
|
||||||
|
el: '#vue',
|
||||||
|
mixins: [windowMixin],
|
||||||
|
data: function () {
|
||||||
|
return {
|
||||||
|
lightning_btc: "",
|
||||||
|
tools: [],
|
||||||
|
swapLnToBtc: {
|
||||||
|
show: false,
|
||||||
|
showInvoice: false,
|
||||||
|
data: {
|
||||||
|
onChainFees: 1
|
||||||
|
},
|
||||||
|
response: null
|
||||||
|
},
|
||||||
|
swapBtcToLn: {
|
||||||
|
show: false,
|
||||||
|
showDetails: false,
|
||||||
|
data: {},
|
||||||
|
response: {}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
copyLnInvoice() {
|
||||||
|
Quasar.utils.copyToClipboard(this.swapLnToBtc.response)
|
||||||
|
},
|
||||||
|
sendLnToBtc() {
|
||||||
|
var self = this
|
||||||
|
axios.post('https://api-testnet.deezy.io/v1/swap', {
|
||||||
|
amount_sats: self.swapLnToBtc.data.amount,
|
||||||
|
on_chain_address: self.swapLnToBtc.data.on_chain_address,
|
||||||
|
on_chain_sats_per_vbyte: self.swapLnToBtc.data.on_chain_sats_per_vbyte
|
||||||
|
})
|
||||||
|
.then(function (response) {
|
||||||
|
self.swapLnToBtc = {
|
||||||
|
...self.swapLnToBtc,
|
||||||
|
showInvoice: true,
|
||||||
|
response: response.data.bolt11_invoice
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch(function (error) {
|
||||||
|
console.log(error);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
sendBtcToLn() {
|
||||||
|
var self = this
|
||||||
|
axios.post('https://api-testnet.deezy.io/v1/source', {
|
||||||
|
lnurl_or_lnaddress: self.swapBtcToLn.data.lnurl_or_lnaddress,
|
||||||
|
secret_access_key: self.swapBtcToLn.data.secret_access_key,
|
||||||
|
webhook_url: self.swapBtcToLn.data.webhook_url
|
||||||
|
})
|
||||||
|
.then(function (response) {
|
||||||
|
self.swapBtcToLn = {
|
||||||
|
...self.swapBtcToLn,
|
||||||
|
response: response.data,
|
||||||
|
showDetails: true,
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch(function (error) {
|
||||||
|
console.log(error);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
resetSwapBtcToLn() {
|
||||||
|
this.swapBtcToLn = {
|
||||||
|
...this.swapBtcToLn,
|
||||||
|
data: {},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
resetSwapLnToBtc() {
|
||||||
|
this.swapLnToBtc = {
|
||||||
|
...this.swapLnToBtc,
|
||||||
|
data: {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
{% endblock %}
|
||||||
|
|
@ -1,59 +0,0 @@
|
||||||
{% extends "base.html" %} {% from "macros.jinja" import window_vars with context
|
|
||||||
%} {% block page %}
|
|
||||||
<q-card>
|
|
||||||
<q-card-section>
|
|
||||||
<h5 class="text-subtitle1 q-mt-none q-mb-md">
|
|
||||||
Frameworks used by {{SITE_TITLE}}
|
|
||||||
</h5>
|
|
||||||
<q-list>
|
|
||||||
<q-item
|
|
||||||
v-for="tool in tools"
|
|
||||||
:key="tool.name"
|
|
||||||
tag="a"
|
|
||||||
:href="tool.url"
|
|
||||||
target="_blank"
|
|
||||||
>
|
|
||||||
{% raw %}
|
|
||||||
<!-- with raw Flask won't try to interpret the Vue moustaches -->
|
|
||||||
<q-item-section>
|
|
||||||
<q-item-label>{{ tool.name }}</q-item-label>
|
|
||||||
<q-item-label caption>{{ tool.language }}</q-item-label>
|
|
||||||
</q-item-section>
|
|
||||||
{% endraw %}
|
|
||||||
</q-item>
|
|
||||||
</q-list>
|
|
||||||
<q-separator class="q-my-lg"></q-separator>
|
|
||||||
<p>
|
|
||||||
A magical "g" is always available, with info about the user, wallets and
|
|
||||||
extensions:
|
|
||||||
</p>
|
|
||||||
<code class="text-caption">{% raw %}{{ g }}{% endraw %}</code>
|
|
||||||
</q-card-section>
|
|
||||||
</q-card>
|
|
||||||
{% endblock %} {% block scripts %} {{ window_vars(user) }}
|
|
||||||
<script>
|
|
||||||
new Vue({
|
|
||||||
el: '#vue',
|
|
||||||
mixins: [windowMixin],
|
|
||||||
data: function () {
|
|
||||||
return {
|
|
||||||
tools: []
|
|
||||||
}
|
|
||||||
},
|
|
||||||
created: function () {
|
|
||||||
var self = this
|
|
||||||
|
|
||||||
// axios is available for making requests
|
|
||||||
axios({
|
|
||||||
method: 'GET',
|
|
||||||
url: '/example/api/v1/tools',
|
|
||||||
headers: {
|
|
||||||
'X-example-header': 'not-used'
|
|
||||||
}
|
|
||||||
}).then(function (response) {
|
|
||||||
self.tools = response.data
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
{% endblock %}
|
|
||||||
|
|
@ -17,5 +17,5 @@ async def index(
|
||||||
user: User = Depends(check_user_exists), # type: ignore
|
user: User = Depends(check_user_exists), # type: ignore
|
||||||
):
|
):
|
||||||
return deezy_renderer().TemplateResponse(
|
return deezy_renderer().TemplateResponse(
|
||||||
"example/index.html", {"request": request, "user": user.dict()}
|
"deezy/index.html", {"request": request, "user": user.dict()}
|
||||||
)
|
)
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue