jekyll-crypto-donations 0.1.0 → 0.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: a5d5ea87cefd682c25c18bab453335ef3dc97aaf35c218cd77573e224bc311f1
4
- data.tar.gz: 07d2b2de58ce62db995ad2274ee00476489cdaa55817a20e2608aef3540a8d8f
3
+ metadata.gz: 5b3947ad6ae6c09e03f2bb5bba97d8b1a8095380f93ca1e61b3e2dcdfec54bca
4
+ data.tar.gz: c25c7fca6c78ddb0082d9d4376c4353121581c11ef665712bbaf8884258667d4
5
5
  SHA512:
6
- metadata.gz: 8489eee5de4ba22a6e47c8fa9244907f31318515942cafef6966620f46df9c3564b57e915a36129fdb2006853a45e3f92f743399b55c7060af3b70fee9ac0b20
7
- data.tar.gz: eb967af2aab40612fc708deea2cccdce13091361c2a146a53f974f6f6b6ae189bb617e577879768885ee2a20db64f891b7d91b1725f73cdcf5512c0e6508f995
6
+ metadata.gz: 742ab0cde4fd7ef25fb8824a808a6a8784fb207a25aa53eae22a35f983b6c9941c874996e835db5c61b8fdb7223738288c0dfecb6602761476bf1a4cb9cd1bed
7
+ data.tar.gz: b4d422b13112c96571f99e243f09dab341c8ca1c81ffcfe62522f7c829110d9d0668364d7be472c12c3557c29dfd21fa4935ed03be86e9f64d3114e13fc1c0c5
data/README.md CHANGED
@@ -1,5 +1,7 @@
1
1
  # Jekyll::CryptoDonations 🤑
2
2
 
3
+ [![Gem Version](https://badge.fury.io/rb/jekyll-crypto-donations.svg)](https://badge.fury.io/rb/jekyll-crypto-donations)
4
+
3
5
  ## About
4
6
 
5
7
  The **Jekyll Crypto Donations** plugin is a simple and efficient solution for integrating cryptocurrency donations into Jekyll-generated websites. In the initial iteration, the plugin supports Bitcoin (BTC), Ethereum (ETH), and USDT (TRC-20). It allows website owners to display current donation amounts and provide easy access for visitors to contribute using these cryptocurrencies. The plugin is designed to be easy to install and configure, making it a seamless addition to any Jekyll site. By leveraging real-time API calls, it ensures that the displayed donation amounts are always up-to-date, providing transparency and encouraging more contributions.
@@ -24,6 +26,15 @@ crypto_donations:
24
26
  usdt_address: "YOUR_USDT_TRC20_ADDRES"
25
27
  ```
26
28
 
29
+ Use `{% crypto_donations %}` or `{% crypto_donations Any text you can share with donations block %}` at the jekyll page source.
30
+
31
+ ## Demo
32
+
33
+ To see the Crypto Donations plugin in action, check out the demo on my website: [madmatvey.github.io](https://madmatvey.github.io/about/#donate-me).
34
+
35
+ You can see how the donation addresses and total received amounts are displayed for Bitcoin (BTC), Ethereum (ETH), and USDT (TRC-20). The demo showcases the real-time integration and functionality of the plugin.
36
+
37
+
27
38
  ## Development
28
39
 
29
40
  After checking out the repo, run `bin/setup` to install dependencies. Then, run `rake spec` to run the tests. You can also run `bin/console` for an interactive prompt that will allow you to experiment.
@@ -0,0 +1,116 @@
1
+ #jekyll-crypto-donations {
2
+ font-family: Arial, sans-serif;
3
+ margin: 20px 0;
4
+ color: var(--text-primary);
5
+ padding: 30px 20px 20px;
6
+ text-align: center
7
+ }
8
+
9
+ .jekyll-crypto-donations__title {
10
+ font-family: CharterC,sans-serif;
11
+ font-size: 32px;
12
+ font-weight: 700;
13
+ line-height: 38px
14
+ }
15
+
16
+ .jekyll-crypto-donations__item {
17
+ border: 1px solid var(--text-color);
18
+ padding: 10px;
19
+ margin-bottom: 10px;
20
+ border-radius: 5px;
21
+ margin-top: 24px
22
+ }
23
+
24
+ .jekyll-crypto-donations__crypto-name {
25
+ font-weight: bold;
26
+ margin-bottom: 5px;
27
+ }
28
+
29
+ .jekyll-crypto-donations__crypto-code span {
30
+ font-family: monospace;
31
+ background:var(--background-color);
32
+ padding: 5px;
33
+ border-radius: 3px;
34
+ display: inline-block;
35
+ }
36
+
37
+ .jekyll-crypto-donations__crypto-buttons {
38
+ margin-top: -10px;
39
+ }
40
+
41
+ .jekyll-crypto-donations__button:hover {
42
+ color: var(--text-primary)!important
43
+ }
44
+
45
+ @media (min-width: 885px) {
46
+ .jekyll-crypto-donations__button {
47
+ font-size:14px
48
+ }
49
+ }
50
+
51
+
52
+ .jekyll-crypto-donations__crypto-btn-copy,
53
+ .jekyll-crypto-donations__crypto-btn-qr {
54
+ border: none;
55
+ padding: 5px 10px;
56
+ margin-right: 5px;
57
+ fill: var(--text-color);
58
+ background: none;
59
+ height: 20px;
60
+ opacity: .5;
61
+ transition: opacity .2s ease;
62
+ width: 20px
63
+ }
64
+
65
+ .jekyll-crypto-donations__crypto-btn-copy:hover,
66
+ .jekyll-crypto-donations__crypto-btn-qr:hover {
67
+ opacity: 1
68
+ }
69
+
70
+ .jekyll-crypto-donations__button>* {
71
+ position: relative
72
+ }
73
+
74
+ .jekyll-crypto-donations__button:active:before {
75
+ background-color: var(--background-color)
76
+ }
77
+
78
+ .jekyll-crypto-donations__button:hover:before {
79
+ opacity: 1
80
+ }
81
+
82
+ .jekyll-crypto-donations__button:before {
83
+ background-color: var(--background-color);
84
+ border-radius: inherit;
85
+ content: "";
86
+ height: 100%;
87
+ left: 0;
88
+ opacity: 0;
89
+ position: absolute;
90
+ top: 0;
91
+ transition: opacity .3s ease;
92
+ width: 100%
93
+ }
94
+
95
+ .jekyll-crypto-donations__crypto-image-qr {
96
+ display: none;
97
+ }
98
+
99
+ .jekyll-crypto-donations__crypto--show-qr .jekyll-crypto-donations__crypto-image-qr {
100
+ display: inline-block;
101
+ }
102
+
103
+ .jekyll-crypto-donations__crypto-code--is-copied span {
104
+ display: none;
105
+ text-align: center
106
+ }
107
+
108
+ .jekyll-crypto-donations__crypto-code--is-copied:before {
109
+ color: var(--text-color);
110
+ content: "Copied!";
111
+ font-family: monospace;
112
+ background: var(--background-color);
113
+ padding: 5px;
114
+ border-radius: 3px;
115
+ display: inline-block;
116
+ }
@@ -2,6 +2,6 @@
2
2
 
3
3
  module Jekyll
4
4
  module CryptoDonations
5
- VERSION = "0.1.0"
5
+ VERSION = "0.1.3"
6
6
  end
7
7
  end
@@ -7,58 +7,201 @@ require "jekyll-crypto-donations/version"
7
7
  module Jekyll
8
8
  module CryptoDonations
9
9
  # describe {% crypto_donations %} tag content
10
- class DonationsTag < Liquid::Tag
10
+ class DonationsTag < Liquid::Tag # rubocop:disable Metrics/ClassLength
11
+ attr_reader :btc_address, :eth_address, :usdt_address
12
+
13
+ CRYPTO_CURRENCIES = {
14
+ btc: { name: "Bitcoin", ticker: "BTC" },
15
+ eth: { name: "Ethereum", ticker: "ETH" },
16
+ usdt: { name: "Tether", ticker: "USDT TRC-20" }
17
+ }.freeze
18
+
11
19
  def initialize(tag_name, text, tokens)
12
20
  super
13
21
  @text = text
14
22
  end
15
23
 
16
- def render(context)
24
+ def currency_html(currency_ticker, address)
25
+ currency = CRYPTO_CURRENCIES[currency_ticker]
26
+ <<~HTML
27
+ <div class="jekyll-crypto-donations__item">
28
+ <span class="jekyll-crypto-donations__crypto-name">#{currency[:name]} (#{currency[:ticker]})</span>
29
+ <div class="jekyll-crypto-donations__crypto">
30
+ <div class="jekyll-crypto-donations__crypto-value">
31
+ <div class="jekyll-crypto-donations__crypto-code">
32
+ <span>#{address}</span>
33
+ </div>
34
+ <div class="jekyll-crypto-donations__crypto-buttons">
35
+ <button class="jekyll-crypto-donations__crypto-btn-copy">
36
+ <svg id="svg" fill="#ededed" stroke="#ededed" width="20" height="20" version="1.1" viewBox="144 144 512 512" xmlns="http://www.w3.org/2000/svg" stroke-width="20">
37
+ <g id="IconSvg_bgCarrier" stroke-width="0"></g>
38
+ <g id="IconSvg_tracerCarrier" stroke-linecap="round" stroke-linejoin="round" stroke="#CCCCCC" stroke-width="0">
39
+ <g xmlns="http://www.w3.org/2000/svg">
40
+ <path d="m458.74 466.8h123.13 17.23c5.4414 0 10.078-4.6367 10.078-10.078v-86.957-139.15-31.84c0-5.4414-4.6367-10.078-10.078-10.078h-87.359-138.95-31.641c-5.4414 0-10.078 4.6367-10.078 10.078v126.66 17.938c0 13 20.152 13 20.152 0v-126.66-17.938c-3.3242 3.3242-6.75 6.75-10.078 10.078h87.359 138.95 31.641c-3.3242-3.3242-6.75-6.75-10.078-10.078v86.957 139.15 31.84l10.078-10.078h-123.13-17.23c-12.992 0.003906-12.992 20.156 0.003907 20.156z"></path>
41
+ <path d="m458.74 591.14h-86.957-139.15-31.84l10.078 10.078v-86.957-139.15-31.84c-3.3242 3.3242-6.75 6.75-10.078 10.078h86.957 139.15 31.84c-3.3242-3.3242-6.75-6.75-10.078-10.078v86.957 139.15 31.84c0 13 20.152 13 20.152 0v-86.957-139.15-31.84c0-5.4414-4.6367-10.078-10.078-10.078h-86.957-139.15-31.84c-5.4414 0-10.078 4.6367-10.078 10.078v86.957 139.15 31.84c0 5.4414 4.6367 10.078 10.078 10.078h86.957 139.15 31.84c13.004-0.003906 13.004-20.156 0.003907-20.156z"></path>
42
+ </g>
43
+ </g>
44
+ <g id="IconSvg_iconCarrier">
45
+ <g xmlns="http://www.w3.org/2000/svg">
46
+ <path d="m458.74 466.8h123.13 17.23c5.4414 0 10.078-4.6367 10.078-10.078v-86.957-139.15-31.84c0-5.4414-4.6367-10.078-10.078-10.078h-87.359-138.95-31.641c-5.4414 0-10.078 4.6367-10.078 10.078v126.66 17.938c0 13 20.152 13 20.152 0v-126.66-17.938c-3.3242 3.3242-6.75 6.75-10.078 10.078h87.359 138.95 31.641c-3.3242-3.3242-6.75-6.75-10.078-10.078v86.957 139.15 31.84l10.078-10.078h-123.13-17.23c-12.992 0.003906-12.992 20.156 0.003907 20.156z"></path>
47
+ <path d="m458.74 591.14h-86.957-139.15-31.84l10.078 10.078v-86.957-139.15-31.84c-3.3242 3.3242-6.75 6.75-10.078 10.078h86.957 139.15 31.84c-3.3242-3.3242-6.75-6.75-10.078-10.078v86.957 139.15 31.84c0 13 20.152 13 20.152 0v-86.957-139.15-31.84c0-5.4414-4.6367-10.078-10.078-10.078h-86.957-139.15-31.84c-5.4414 0-10.078 4.6367-10.078 10.078v86.957 139.15 31.84c0 5.4414 4.6367 10.078 10.078 10.078h86.957 139.15 31.84c13.004-0.003906 13.004-20.156 0.003907-20.156z"></path>
48
+ </g>
49
+ </g>
50
+ </svg>
51
+ </button>
52
+ <button class="jekyll-crypto-donations__crypto-btn-qr">
53
+ <svg id="svg" fill="#ededed" stroke="#ededed" width="20" height="20" version="1.1" viewBox="144 144 512 512" xmlns="http://www.w3.org/2000/svg" stroke-width="0">
54
+ <g id="IconSvg_bgCarrier" stroke-width="0"></g>
55
+ <g id="IconSvg_tracerCarrier" stroke-linecap="round" stroke-linejoin="round" stroke="#CCCCCC" stroke-width="0">
56
+ <g xmlns="http://www.w3.org/2000/svg">
57
+ <path d="m379.01 588.93h-167.94v-167.93h167.94zm-125.95-41.984h83.969v-83.965h-83.969z"></path>
58
+ <path d="m588.93 379.01h-167.93v-167.94h167.94zm-125.95-41.984h83.969l-0.003906-83.969h-83.965z"></path>
59
+ <path d="m379.01 379.01h-167.94v-167.94h167.94zm-125.95-41.984h83.969v-83.969h-83.969z"></path>
60
+ <path d="m588.93 588.93h-83.969v-41.984h41.984v-41.984h41.984z"></path>
61
+ <path d="m462.98 588.93h-41.984v-83.969h41.984v-41.98h41.98v83.965h-41.98z"></path>
62
+ <path d="m420.99 420.99h41.984v41.984h-41.984z"></path>
63
+ <path d="m504.96 420.99h83.969v41.984h-83.969z"></path>
64
+ </g>
65
+ </g>
66
+ <g id="IconSvg_iconCarrier">
67
+ <g xmlns="http://www.w3.org/2000/svg">
68
+ <path d="m379.01 588.93h-167.94v-167.93h167.94zm-125.95-41.984h83.969v-83.965h-83.969z"></path>
69
+ <path d="m588.93 379.01h-167.93v-167.94h167.94zm-125.95-41.984h83.969l-0.003906-83.969h-83.965z"></path>
70
+ <path d="m379.01 379.01h-167.94v-167.94h167.94zm-125.95-41.984h83.969v-83.969h-83.969z"></path>
71
+ <path d="m588.93 588.93h-83.969v-41.984h41.984v-41.984h41.984z"></path>
72
+ <path d="m462.98 588.93h-41.984v-83.969h41.984v-41.98h41.98v83.965h-41.98z"></path>
73
+ <path d="m420.99 420.99h41.984v41.984h-41.984z"></path>
74
+ <path d="m504.96 420.99h83.969v41.984h-83.969z"></path>
75
+ </g>
76
+ </g>
77
+ </svg>
78
+ </button>
79
+ <div class="jekyll-crypto-donations__crypto-total-received">
80
+ <span id="jekyll-crypto-donations_#{currency_ticker}-total">Loading...</span>
81
+ </div>
82
+ </div>
83
+ </div>
84
+ <div class="jekyll-crypto-donations__crypto-image-qr">
85
+ <img alt="" width="150px" heght="150px" src="https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=#{address}">
86
+ </div>
87
+ </div>
88
+ </div>
89
+ HTML
90
+ end
91
+
92
+ def btc_html
93
+ return "" unless btc_address
94
+
95
+ currency_html(:btc, btc_address)
96
+ end
97
+
98
+ def eth_html
99
+ return "" unless eth_address
100
+
101
+ currency_html(:eth, eth_address)
102
+ end
103
+
104
+ def usdt_html
105
+ return "" unless usdt_address
106
+
107
+ currency_html(:usdt, usdt_address)
108
+ end
109
+
110
+ def btc_js
111
+ return "" unless btc_address
112
+
113
+ <<~JS
114
+ const btcDonations = await getDonations('btc', '#{btc_address}');
115
+ document.getElementById('jekyll-crypto-donations_btc-total').innerText = `Total received: ${btcDonations} BTC`;
116
+ JS
117
+ end
118
+
119
+ def eth_js
120
+ return "" unless eth_address
121
+
122
+ <<~JS
123
+ const ethDonations = await getDonations('eth', '#{eth_address}');
124
+ document.getElementById('jekyll-crypto-donations_eth-total').innerText = `Total received: ${ethDonations} ETH`;
125
+ JS
126
+ end
127
+
128
+ def usdt_js
129
+ return "" unless usdt_address
130
+
131
+ <<~JS
132
+ const usdtDonations = await getDonations('usdt', '#{usdt_address}');
133
+ document.getElementById('jekyll-crypto-donations_usdt-total').innerText = `Total received: ${usdtDonations} USDT`;
134
+ JS
135
+ end
136
+
137
+ def site_config(context)
17
138
  site_config = context.registers.fetch(:site).config
18
- btc_address = site_config.dig("crypto_donations", "btc_address")
19
- eth_address = site_config.dig("crypto_donations", "eth_address")
20
- usdt_address = site_config.dig("crypto_donations", "usdt_address")
139
+ @btc_address = site_config.dig("crypto_donations", "btc_address")
140
+ @eth_address = site_config.dig("crypto_donations", "eth_address")
141
+ @usdt_address = site_config.dig("crypto_donations", "usdt_address")
142
+ end
21
143
 
144
+ def opening_html
22
145
  <<~HTML
23
- <div id="crypto-donations">
24
- <h2>Support Us with Crypto Donations</h2>
25
- <p>#{@text}</p>
26
- <div>
27
- <h3>Bitcoin (BTC)</h3>
28
- <p id="btc-address">#{btc_address}</p>
29
- <p id="btc-donations">Loading...</p>
30
- </div>
31
- <div>
32
- <h3>Ethereum (ETH)</h3>
33
- <p id="eth-address">#{eth_address}</p>
34
- <p id="eth-donations">Loading...</p>
35
- </div>
36
- <div>
37
- <h3>USDT (TRC-20)</h3>
38
- <p id="usdt-address">Address: #{usdt_address}</p>
39
- <p id="usdt-donations">Loading...</p>
146
+ <div id="jekyll-crypto-donations">
147
+ <div class="jekyll-crypto-donations__description">
148
+ <span>#{@text}</span>
40
149
  </div>
150
+ HTML
151
+ end
152
+
153
+ def closing_html
154
+ <<~HTML
41
155
  </div>
42
156
  <script type="module">
43
157
  import { getDonations } from '/assets/js/crypto-donations/crypto-donations.js';
158
+ document.addEventListener('DOMContentLoaded', function () {
159
+ document.querySelectorAll('.jekyll-crypto-donations__item').forEach((item) => {
160
+ item.querySelector('.jekyll-crypto-donations__crypto-btn-copy').addEventListener('click', () => {
161
+ const code = item.querySelector('.jekyll-crypto-donations__crypto-code');
162
+ navigator.clipboard.writeText(code.innerText);
163
+ code.classList.add('jekyll-crypto-donations__crypto-code--is-copied');
164
+ setTimeout(() => {
165
+ code.classList.remove('jekyll-crypto-donations__crypto-code--is-copied');
166
+ }, 1500);
167
+ });
168
+
169
+ item.querySelector('.jekyll-crypto-donations__crypto-btn-qr').addEventListener('click', () => {
170
+ item.querySelector('.jekyll-crypto-donations__crypto').classList.toggle('jekyll-crypto-donations__crypto--show-qr');
171
+ });
172
+ });
173
+ });
44
174
 
45
175
  document.addEventListener('DOMContentLoaded', async () => {
46
- const btcAddress = '#{btc_address}';
47
- const ethAddress = '#{eth_address}';
48
- const usdtAddress = '#{usdt_address}'
176
+ HTML
177
+ end
178
+
179
+ def closing_js
180
+ <<~JS
181
+ });
182
+ </script>
183
+ JS
184
+ end
49
185
 
50
- const usdtDonations = await getDonations('usdt', usdtAddress);
51
- document.getElementById('usdt-donations').innerText = `Total received: ${usdtDonations} USDT`;
186
+ def render(context)
187
+ site_config(context)
188
+ return if btc_address.nil? && eth_address.nil? && usdt_address.nil?
52
189
 
53
- const btcDonations = await getDonations('btc', btcAddress);
54
- document.getElementById('btc-donations').innerText = `Total received: ${btcDonations} BTC`;
190
+ content = opening_html
55
191
 
56
- const ethDonations = await getDonations('eth', ethAddress);
57
- document.getElementById('eth-donations').innerText = `Total received: ${ethDonations} ETH`;
192
+ content += btc_html
193
+ content += eth_html
194
+ content += usdt_html
58
195
 
59
- });
60
- </script>
61
- HTML
196
+ content += closing_html
197
+
198
+ content += btc_js
199
+ content += eth_js
200
+ content += usdt_js
201
+
202
+ content += closing_js
203
+
204
+ content
62
205
  end
63
206
  end
64
207
  end
@@ -71,4 +214,17 @@ Jekyll::Hooks.register :site, :post_write do |site|
71
214
  destination = File.join(site.dest, "assets/js/crypto-donations/crypto-donations.js")
72
215
  FileUtils.mkdir_p(File.dirname(destination))
73
216
  FileUtils.cp(source, destination)
217
+
218
+ source_css = File.expand_path("../assets/css/crypto-donations/crypto-donations.css", __dir__)
219
+ destination_css = File.join(site.dest, "assets/css/crypto-donations.css")
220
+ FileUtils.mkdir_p(File.dirname(destination_css))
221
+ FileUtils.cp(source_css, destination_css)
222
+ end
223
+
224
+ Jekyll::Hooks.register :documents, :pre_render do |document|
225
+ if document.output_ext == ".html"
226
+ document.content = <<~HTML + document.content # rubocop:disable Style/StringConcatenation
227
+ <link rel="stylesheet" href="/assets/css/crypto-donations.css">
228
+ HTML
229
+ end
74
230
  end
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: jekyll-crypto-donations
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.1.0
4
+ version: 0.1.3
5
5
  platform: ruby
6
6
  authors:
7
7
  - madmatvey
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2024-06-07 00:00:00.000000000 Z
11
+ date: 2024-06-09 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: jekyll
@@ -64,6 +64,7 @@ extra_rdoc_files:
64
64
  files:
65
65
  - LICENSE
66
66
  - README.md
67
+ - assets/css/crypto-donations/crypto-donations.css
67
68
  - assets/js/crypto-donations/crypto-donations.js
68
69
  - lib/jekyll-crypto-donations.rb
69
70
  - lib/jekyll-crypto-donations/version.rb