kosmos/akkounts
kosmos/akkounts
8
1
Fork 0
Code Issues 19 Pull Requests 1 Actions Packages Releases 12 Activity

Add more content/help to wallet page #57

Merged
raucao merged 2 commits from feature/wallet_page_content into master 2022-01-13 00:48:22 +00:00
Conversation 3 Commits 2 Files Changed 4 +113 -15
4 changed files with 113 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
app/assets/images/logos/alby.svg Normal file
View File

@ -0,0 +1,12 @@
<svg width="1210" height="525" viewBox="0 0 1210 525" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle r="36.675" transform="matrix(-1 0 0 1 94.1325 138.143)" fill="black"/>
<path d="M88.02 132.641L156.48 201.101" stroke="black" stroke-width="18.3375"/>
<circle cx="393.645" cy="138.143" r="36.675" fill="black"/>
<path d="M400.369 132.641L331.909 201.101" stroke="black" stroke-width="18.3375"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M104.543 356.993C84.7762 347.583 73.2723 326.451 77.1258 304.901C93.6652 212.406 162.593 143.032 245.111 143.032C327.83 143.032 396.891 212.743 413.216 305.573C417.013 327.163 405.416 348.284 385.581 357.618C343.14 377.591 295.735 388.755 245.723 388.755C195.191 388.755 147.32 377.357 104.543 356.993Z" fill="#FFDF6F"/>
<path d="M413.216 305.573L404.186 307.161L413.216 305.573ZM385.581 357.618L381.677 349.322L381.677 349.322L385.581 357.618ZM86.1514 306.515C102.133 217.14 168.195 152.201 245.111 152.201V133.864C156.991 133.864 85.1975 207.672 68.1002 303.287L86.1514 306.515ZM245.111 152.201C322.214 152.201 388.411 217.457 404.186 307.161L422.246 303.985C405.372 208.028 333.446 133.864 245.111 133.864V152.201ZM381.677 349.322C340.432 368.732 294.358 379.586 245.723 379.586V397.924C297.113 397.924 345.848 386.449 389.485 365.914L381.677 349.322ZM245.723 379.586C196.583 379.586 150.056 368.505 108.484 348.714L100.602 365.271C144.584 386.21 193.798 397.924 245.723 397.924V379.586ZM404.186 307.161C407.23 324.47 397.962 341.659 381.677 349.322L389.485 365.914C412.869 354.91 426.796 329.855 422.246 303.985L404.186 307.161ZM68.1002 303.287C63.4826 329.11 77.2985 354.178 100.602 365.271L108.484 348.714C92.254 340.988 83.062 323.792 86.1514 306.515L68.1002 303.287Z" fill="black"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M139.812 333.998C123.901 327.517 114.463 310.589 119.976 294.317C136.978 244.138 186.576 207.825 245.112 207.825C303.648 207.825 353.246 244.138 370.249 294.317C375.762 310.589 366.324 327.517 350.413 333.998C317.915 347.233 282.365 354.525 245.112 354.525C207.859 354.525 172.309 347.233 139.812 333.998Z" fill="black"/>
<ellipse cx="287.288" cy="286.065" rx="30.5625" ry="24.45" fill="white"/>
<ellipse cx="199.795" cy="286.08" rx="30.5625" ry="24.45" fill="white"/>
<path d="M623.9 134.4H682.14L763.42 349.44L706.14 355.2L690.46 309.12H615.26L600.22 352H542.3L623.9 134.4ZM673.82 263.36L652.06 204.16L631.26 263.36H673.82ZM837.64 352H779.4V129.6L837.64 126.08V352ZM899.003 352H869.563V129.6L927.803 126.08V195.52C931.429 194.24 935.163 193.28 939.003 192.64C942.843 191.787 946.789 191.36 950.843 191.36C966.203 191.36 979.856 194.24 991.803 200C1003.75 205.76 1013.14 214.613 1019.96 226.56C1027 238.507 1030.52 253.76 1030.52 272.32C1030.52 290.667 1027 306.027 1019.96 318.4C1013.14 330.773 1003.54 340.053 991.163 346.24C979.003 352.427 964.709 355.52 948.283 355.52C941.456 355.52 934.736 354.453 928.123 352.32C921.723 350.187 915.323 346.773 908.923 342.08L899.003 352ZM941.883 236.16C937.616 236.16 932.923 237.76 927.803 240.96V306.24C933.563 309.227 939.109 310.72 944.443 310.72C951.696 310.72 957.776 307.413 962.683 300.8C967.803 293.973 970.363 284.587 970.363 272.64C970.363 260.693 967.909 251.627 963.003 245.44C958.096 239.253 951.056 236.16 941.883 236.16ZM1088.12 352.64L1089.4 349.12L1033.72 206.4L1087.48 191.04L1119.16 284.48L1148.92 196.8H1206.84L1138.69 370.24C1135.48 378.56 1130.26 386.24 1123 393.28C1115.75 400.32 1107.33 406.293 1097.72 411.2C1088.12 416.107 1078.2 419.733 1067.96 422.08L1048.44 376.96C1053.56 374.827 1058.9 372.48 1064.44 369.92C1070.2 367.36 1075.32 364.587 1079.8 361.6C1084.28 358.613 1087.06 355.627 1088.12 352.64Z" fill="black"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.6 KiB

38
app/assets/images/logos/bluewallet.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 28 KiB

5
app/controllers/wallet_controller.rb
View File

@ -15,7 +15,10 @@ class WalletController < ApplicationController
shape_rendering: "crispEdges",
module_size: 6,
standalone: true,
use_path: true
use_path: true,
svg_attributes: {
class: 'inline-block'
}
)
@balance = fetch_balance rescue nil

73
app/views/wallet/index.html.erb
View File

@ -19,25 +19,70 @@
</section>
<section>
<h3>Blue Wallet</h3>
<p class="mb-6">
You can connect
<%= link_to "Blue Wallet", "https://bluewallet.io",
class: "ks-text-link", target: "_blank" %>
(Android or iOS) to your Kosmos lightning wallet. In order to do so,
scan the setup QR code from the Import Wallet screen in the app.
<h3>Lightning Address</h3>
<p>
Your Kosmos user address is also a
<a class="ks-text-link" href="https://lightningaddress.com/" target="_blank">Lightning Address</a>!
The easiest way to receive sats is by just giving out your address:
</p>
<p class="mb-6">
<button id="show-setup-code" class="btn-sm btn-blue">Show setup code</button>
<button id="hide-setup-code" class="btn-sm btn-blue hidden">Hide setup code</button>
<span class="mx-2">or</span>
<button id="copy-setup-code" class="btn-sm btn-blue">Copy setup code</button>
<p>
<strong><%= current_user.address %></strong>
</p>
<p id="setup-code" class="hidden">
</section>
<section>
<h3>Wallet Apps</h3>
<p>
You can connect various wallet apps to your Kosmos account. This allows
you to both receive and send sats. Any wallet that supports
<a href="https://bluewallet.io/lndhub/" class="ks-text-link" target="_blank">LNDHub</a>
accounts should be able to add/import your account using our setup
code/URL:
</p>
<p class="my-6 text-center md:text-left">
<button id="copy-setup-code" class="btn-md btn-blue">Copy setup code/URL</button>
<span class="mx-2 my-2 md:my-0 block md:inline">or</span>
<button id="show-setup-code" class="btn-md btn-blue">Show setup QR code</button>
<button id="hide-setup-code" class="btn-md btn-blue hidden">Hide setup QR code</button>
</p>
<p id="setup-code" class="hidden my-10 w-full text-center">
<%= raw @svg %>
</p>
</section>
<section>
<h3>Recommended Apps</h3>
<div class="w-full grid grid-cols-1 gap-y-4 md:grid-cols-12
md:gap-y-6 md:gap-x-4 md:items-center">
<h4 class="md:col-span-3">
<a href="https://bluewallet.io" class="ks-text-link text-xl"
title="Blue Wallet" target="_blank">
<%= image_tag("/assets/logos/bluewallet.svg", class: 'h-16') %>
</a>
</h4>
<p class="md:col-span-4 mb-0 text-gray-500">
Android / iOS / macOS
</p>
<p class="md:col-span-5 mb-0">
When adding a wallet, choose "Import wallet" on the bottom of the screen,
then scan the setup QR code.
</p>
<h4 class="md:col-span-3">
<a href="https://getalby.com/" class="ks-text-link text-xl"
title="Alby" target="_blank">
<%= image_tag("/assets/logos/alby.svg", class: 'h-16') %>
</a>
</h4>
<p class="md:col-span-4 mb-0 text-gray-500">
Firefox / Chrome (Opera, Brave, Chromium-based browsers)
</p>
<p class="md:col-span-5 mb-0">
Choose "LNDHub (Bluewallet)" in the connect dialog and paste the setup
URL in the "LNDHub Export URI" field.
</p>
</div>
</section>
<script type="text/javascript">
(function () {
const buttonShow = document.querySelector('#show-setup-code');
@ -50,7 +95,7 @@
setupCode.classList.remove('hidden');
buttonHide.classList.remove('hidden');
buttonShow.classList.add('hidden');
window.scrollTo(0, document.body.scrollHeight);
setupCode.scrollIntoView({behavior: "smooth", block: "nearest"});
});
buttonHide.addEventListener('click', function(ev) {