jekyll-crypto-donations 0.1.1 → 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: 92b4068f4fdac48c92aa24986a1c675e6c7edb3a855b6df6abf1c1595011fad3
4
- data.tar.gz: cd5cf6d1cff184697d86d940f4c453e8e1d03ccb7b5cab6d106b0fcae010ff5a
3
+ metadata.gz: 5b3947ad6ae6c09e03f2bb5bba97d8b1a8095380f93ca1e61b3e2dcdfec54bca
4
+ data.tar.gz: c25c7fca6c78ddb0082d9d4376c4353121581c11ef665712bbaf8884258667d4
5
5
  SHA512:
6
- metadata.gz: 6d3160fb73cd97ca22df47ea6cd60ba3e5a5ee6b1a806a41c3da7eafd52719d742f9a90fb888606f3c1d43102d262606c0c320be6a67b5ddc9e63965761120dc
7
- data.tar.gz: 1dc4a9e9693f60c1fee59b78cb3771adbdce8c17ef033455cca20d8fcebd3dd88df5b9eb8ffb7a72a95facbd54f4c95c800a4eab4d468a33016258301e3f6ee0
6
+ metadata.gz: 742ab0cde4fd7ef25fb8824a808a6a8784fb207a25aa53eae22a35f983b6c9941c874996e835db5c61b8fdb7223738288c0dfecb6602761476bf1a4cb9cd1bed
7
+ data.tar.gz: b4d422b13112c96571f99e243f09dab341c8ca1c81ffcfe62522f7c829110d9d0668364d7be472c12c3557c29dfd21fa4935ed03be86e9f64d3114e13fc1c0c5
data/README.md CHANGED
@@ -26,6 +26,15 @@ crypto_donations:
26
26
  usdt_address: "YOUR_USDT_TRC20_ADDRES"
27
27
  ```
28
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
+
29
38
  ## Development
30
39
 
31
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.1"
5
+ VERSION = "0.1.3"
6
6
  end
7
7
  end
@@ -7,48 +7,104 @@ 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
11
  attr_reader :btc_address, :eth_address, :usdt_address
12
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
+
13
19
  def initialize(tag_name, text, tokens)
14
20
  super
15
21
  @text = text
16
22
  end
17
23
 
18
- def btc_html
19
- return "" unless btc_address
20
-
24
+ def currency_html(currency_ticker, address)
25
+ currency = CRYPTO_CURRENCIES[currency_ticker]
21
26
  <<~HTML
22
- <div>
23
- <h3>Bitcoin (BTC)</h3>
24
- <p>Address: #{btc_address}</p>
25
- <p id="btc-donations">Loading...</p>
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>
26
88
  </div>
27
89
  HTML
28
90
  end
29
91
 
92
+ def btc_html
93
+ return "" unless btc_address
94
+
95
+ currency_html(:btc, btc_address)
96
+ end
97
+
30
98
  def eth_html
31
99
  return "" unless eth_address
32
100
 
33
- <<~HTML
34
- <div>
35
- <h3>Ethereum (ETH)</h3>
36
- <p>Address: #{eth_address}</p>
37
- <p id="eth-donations">Loading...</p>
38
- </div>
39
- HTML
101
+ currency_html(:eth, eth_address)
40
102
  end
41
103
 
42
104
  def usdt_html
43
105
  return "" unless usdt_address
44
106
 
45
- <<~HTML
46
- <div>
47
- <h3>USDT (TRC-20)</h3>
48
- <p>Address: #{usdt_address}</p>
49
- <p id="usdt-donations">Loading...</p>
50
- </div>
51
- HTML
107
+ currency_html(:usdt, usdt_address)
52
108
  end
53
109
 
54
110
  def btc_js
@@ -56,7 +112,7 @@ module Jekyll
56
112
 
57
113
  <<~JS
58
114
  const btcDonations = await getDonations('btc', '#{btc_address}');
59
- document.getElementById('btc-donations').innerText = `Total received: ${btcDonations} BTC`;
115
+ document.getElementById('jekyll-crypto-donations_btc-total').innerText = `Total received: ${btcDonations} BTC`;
60
116
  JS
61
117
  end
62
118
 
@@ -65,7 +121,7 @@ module Jekyll
65
121
 
66
122
  <<~JS
67
123
  const ethDonations = await getDonations('eth', '#{eth_address}');
68
- document.getElementById('eth-donations').innerText = `Total received: ${ethDonations} ETH`;
124
+ document.getElementById('jekyll-crypto-donations_eth-total').innerText = `Total received: ${ethDonations} ETH`;
69
125
  JS
70
126
  end
71
127
 
@@ -74,7 +130,7 @@ module Jekyll
74
130
 
75
131
  <<~JS
76
132
  const usdtDonations = await getDonations('usdt', '#{usdt_address}');
77
- document.getElementById('usdt-donations').innerText = `Total received: ${usdtDonations} USDT`;
133
+ document.getElementById('jekyll-crypto-donations_usdt-total').innerText = `Total received: ${usdtDonations} USDT`;
78
134
  JS
79
135
  end
80
136
 
@@ -87,9 +143,10 @@ module Jekyll
87
143
 
88
144
  def opening_html
89
145
  <<~HTML
90
- <div id="crypto-donations">
91
- <h2>Support Us with Crypto Donations</h2>
92
- <p>#{@text}</p>
146
+ <div id="jekyll-crypto-donations">
147
+ <div class="jekyll-crypto-donations__description">
148
+ <span>#{@text}</span>
149
+ </div>
93
150
  HTML
94
151
  end
95
152
 
@@ -98,6 +155,22 @@ module Jekyll
98
155
  </div>
99
156
  <script type="module">
100
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
+ });
101
174
 
102
175
  document.addEventListener('DOMContentLoaded', async () => {
103
176
  HTML
@@ -141,4 +214,17 @@ Jekyll::Hooks.register :site, :post_write do |site|
141
214
  destination = File.join(site.dest, "assets/js/crypto-donations/crypto-donations.js")
142
215
  FileUtils.mkdir_p(File.dirname(destination))
143
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
144
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.1
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