Adds donation banner and modal window.

Includes auto-conversions between USD and BTC and autogeneration of QR code.
This commit is contained in:
Igor Kuzmenko 2017-08-05 22:23:57 +02:00
parent 0a4820ad1a
commit 9dc45b2827
7 changed files with 380 additions and 0 deletions

View file

@ -16,6 +16,8 @@ http://opensource.org/licenses/MIT.
{% if page.lang == 'bg' or page.lang == 'el' or page.lang == 'ko' or page.lang == 'hi' or page.lang == 'pl' or page.lang == 'sl' or page.lang == 'ro' or page.lang == 'ru' or page.lang == 'tr' or page.lang == 'uk' or page.lang == 'zh_CN' or page.lang == 'zh_TW' %}<link rel="stylesheet" href="/css/sans.css">{% endif %}
<script type="text/javascript" src="/js/base.js"></script>
{% if page.id != 'download' %}<script type="text/javascript" src="/js/main.js"></script>{% endif %}
<script src="/js/jquery/jquery-1.11.2.min.js"></script>
<script src="/js/jquery.qrcode.min.js"></script>
<link rel="shortcut icon" href="/favicon.png">
<link rel="apple-touch-icon-precomposed" href="/img/icons/logo_ios.png"/>
<script>

View file

@ -0,0 +1,71 @@
{% comment %}
This file is licensed under the MIT License (MIT) available on
http://opensource.org/licenses/MIT.
{% endcomment %}
<div class="donation-container">
<div class="donation-text">
<p>
{% translate donation-banner-text layout %}
</p>
<button class="donation-btn" onclick="openDonationModal()">
{% translate donation-banner-donate-button layout %}
</button>
</div>
<div class="donation-visibility-toggle" onclick="toggleDonationBanner()">
{% translate donation-banner-toggle-button layout %}
</div>
</div>
<div
id="donation-modal"
style="display: none"
class="donation-modal hidden">
<div class="modal-dialog">
<div class="modal-header">
<div class="modal-close-btn" onclick="closeDonationModal()">×</div>
<p class="modal-header-text">{% translate donation-modal-header layout %}</p>
</div>
<p class="modal-subheader">{% translate donation-modal-subheader layout %}</p>
<div style="text-align: center;">
<div id="donation-qr-code" data-address="{{ site.donation_banner.address }}"></div>
</div>
<div>
<a
class="donation-btc-address"
href="bitcoin:{{ site.donation_banner.address }}"
target="_blank">
{{ site.donation_banner.address }}
</a>
</div>
<div class="modal-body bg-white" style="overflow-y:hidden;text-align: center;">
<div>
{% for amount in site.donation_banner.amounts_in_usd %}
<button class="donation-amount-btn" data-amount-usd="{{ amount }}">
${{ amount }}.00
<div class="donation-amount-usd-in-btc">(... BTC)</div>
</button>
{% endfor %}
</div>
<div>
<input
style="margin-right: 15px"
type="text"
placeholder="{% translate donation-modal-input-custom-amount layout %} (BTC)"
id="donation-input-amount-btc" class="donation-amount-input">
<input
type="text"
placeholder="{% translate donation-modal-input-custom-amount layout %} (USD)"
id="donation-input-amount-usd" class="donation-amount-input">
</div>
<div>
<textarea
class="donation-amount-input"
id="donation-input-message"
placeholder="{% translate donation-modal-optional-message layout %}"></textarea>
</div>
</div>
</div>
</div>