Use modal component for LndHub setup code
This commit is contained in:
parent
c78df9e5f1
commit
8a570ce724
@ -8,8 +8,7 @@ class Services::LightningController < ApplicationController
|
|||||||
before_action :fetch_balance
|
before_action :fetch_balance
|
||||||
|
|
||||||
def index
|
def index
|
||||||
@wallet_url = "lndhub://#{current_user.ln_account}:#{current_user.ln_password}@#{ENV['LNDHUB_PUBLIC_URL']}"
|
@wallet_setup_url = "lndhub://#{current_user.ln_account}:#{current_user.ln_password}@#{ENV['LNDHUB_PUBLIC_URL']}"
|
||||||
initialize_lndhub_qr_code
|
|
||||||
end
|
end
|
||||||
|
|
||||||
def transactions
|
def transactions
|
||||||
@ -56,20 +55,6 @@ class Services::LightningController < ApplicationController
|
|||||||
|
|
||||||
private
|
private
|
||||||
|
|
||||||
def initialize_lndhub_qr_code
|
|
||||||
qr_code = RQRCode::QRCode.new(@wallet_url)
|
|
||||||
@lndhub_qr_svg = qr_code.as_svg(
|
|
||||||
color: "000",
|
|
||||||
shape_rendering: "crispEdges",
|
|
||||||
module_size: 6,
|
|
||||||
standalone: true,
|
|
||||||
use_path: true,
|
|
||||||
svg_attributes: {
|
|
||||||
class: 'inline-block'
|
|
||||||
}
|
|
||||||
)
|
|
||||||
end
|
|
||||||
|
|
||||||
def authenticate_with_lndhub(options={})
|
def authenticate_with_lndhub(options={})
|
||||||
if session[:ln_auth_token].present? && !options[:force_reauth]
|
if session[:ln_auth_token].present? && !options[:force_reauth]
|
||||||
@ln_auth_token = session[:ln_auth_token]
|
@ln_auth_token = session[:ln_auth_token]
|
||||||
|
@ -29,7 +29,7 @@
|
|||||||
</p>
|
</p>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section>
|
<section data-controller="modal">
|
||||||
<h3>Wallet Apps</h3>
|
<h3>Wallet Apps</h3>
|
||||||
<p>
|
<p>
|
||||||
You can connect various wallet apps to your Kosmos account. This allows
|
You can connect various wallet apps to your Kosmos account. This allows
|
||||||
@ -40,19 +40,16 @@
|
|||||||
</p>
|
</p>
|
||||||
<p data-controller="clipboard" class="my-6 text-center md:text-left">
|
<p data-controller="clipboard" class="my-6 text-center md:text-left">
|
||||||
<input type="text" disabled class="hidden" aria-hidden=true
|
<input type="text" disabled class="hidden" aria-hidden=true
|
||||||
value="<%= @wallet_url%>" data-clipboard-target="source" />
|
value="<%= @wallet_setup_url %>" data-clipboard-target="source" />
|
||||||
<button id="copy-setup-code" class="btn-md btn-blue w-full sm:w-auto"
|
<button id="copy-setup-code" class="btn-md btn-blue w-full sm:w-auto"
|
||||||
data-action="clipboard#copy" data-clipboard-target="trigger">
|
data-action="clipboard#copy" data-clipboard-target="trigger">
|
||||||
<span class="content-initial">Copy setup code/URL</span>
|
<span class="content-initial">Copy setup code/URL</span>
|
||||||
<span class="content-active hidden">Copied ✔</span>
|
<span class="content-active hidden">Copied ✔</span>
|
||||||
</button>
|
</button>
|
||||||
<span class="mx-2 my-2 md:my-0 block md:inline">or</span>
|
<span class="mx-2 my-2 md:my-0 block md:inline">or</span>
|
||||||
<button id="show-setup-code" class="btn-md btn-blue w-full sm:w-auto">Show setup QR code</button>
|
<button data-action="click->modal#open" class="btn-md btn-blue w-full sm:w-auto">Show setup QR code</button>
|
||||||
<button id="hide-setup-code" class="hidden btn-md btn-blue w-full sm:w-auto">Hide setup QR code</button>
|
|
||||||
</p>
|
|
||||||
<p id="setup-code" class="hidden my-10 w-full text-center">
|
|
||||||
<%= raw @lndhub_qr_svg %>
|
|
||||||
</p>
|
</p>
|
||||||
|
<%= render QrCodeModalComponent.new(qr_content: @wallet_setup_url) %>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section>
|
<section>
|
||||||
@ -119,27 +116,3 @@
|
|||||||
</p>
|
</p>
|
||||||
</section>
|
</section>
|
||||||
<% end %>
|
<% end %>
|
||||||
|
|
||||||
<script type="text/javascript">
|
|
||||||
(function () {
|
|
||||||
const buttonShow = document.querySelector('#show-setup-code');
|
|
||||||
const buttonHide = document.querySelector('#hide-setup-code');
|
|
||||||
const setupCode = document.querySelector('#setup-code');
|
|
||||||
|
|
||||||
buttonShow.addEventListener('click', function(ev) {
|
|
||||||
ev.preventDefault();
|
|
||||||
setupCode.classList.remove('hidden');
|
|
||||||
buttonHide.classList.remove('hidden');
|
|
||||||
buttonShow.classList.add('hidden');
|
|
||||||
setupCode.scrollIntoView({behavior: "smooth", block: "nearest"});
|
|
||||||
});
|
|
||||||
|
|
||||||
buttonHide.addEventListener('click', function(ev) {
|
|
||||||
ev.preventDefault();
|
|
||||||
const el = document.querySelector('#setup-code');
|
|
||||||
setupCode.classList.add('hidden');
|
|
||||||
buttonHide.classList.add('hidden');
|
|
||||||
buttonShow.classList.remove('hidden');
|
|
||||||
});
|
|
||||||
})();
|
|
||||||
</script>
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user