-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
181 lines (153 loc) · 7.52 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="styles.css">
<link href="https://cdn.lineicons.com/5.0/lineicons.css" rel="stylesheet">
<!-- Apple Touch Icon -->
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<!-- Favicons -->
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<!-- Web Manifest -->
<link rel="manifest" href="/site.webmanifest">
<!-- Windows Tile Icon -->
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-config" content="/browserconfig.xml">
<!-- Theme Color -->
<meta name="theme-color" content="#ffffff">
<title>Hi Satoshi</title>
</head>
<body>
<!-- Copy text notification -->
<div id="copyNotification" class="copy-notification">Text copied to clipboard!</div>
<!-- Burger menu -->
<a href="#menu" id="toggle"><span></span></a>
<div id="menu">
<ul>
<li><a href="#">Home</a></li>
<li><a href="whitepaper.html">Bitcoin whitepaper</a></li>
<li><a href="quotes.html">Words of Satoshi</a></li>
<li><a href="nip05.html">NIP-05</a></li>
<li><a href="converter.html">Converter</a></li>
<li><a href="MoscowTime.html">Moscow time</a></li>
</ul>
</div>
<!-- Explanation in JS tab -->
<!-- The two texts -->
<div id="container">
<span id="text1"></span>
<span id="text2"></span>
</div>
<!-- The SVG filter used to create the merging effect -->
<svg id="filters">
<defs>
<filter id="threshold">
<!-- Basically just a threshold effect - pixels with a high enough opacity are set to full opacity, and all other pixels are set to completely transparent. -->
<feColorMatrix in="SourceGraphic"
type="matrix"
values="1 0 0 0 0
0 1 0 0 0
0 0 1 0 0
0 0 0 255 -140" />
</filter>
</defs>
</svg>
<!-- ---------------------------------------------------------------------- -->
<!-- Footer with Email, Lightning Icon, Block Height, and Fee Rate -->
<footer class="footer">
<!-- Email Link -->
<a href="mailto:one@satoshi.si?subject=mail to one Satoshi from satoshi.si" target="_blank">
</a>
<!-- Block Height Display (Left Side) -->
<span id="block-height" title="Block Height" onclick="openMempoolTinyDataModal()">
</span>
<!-- Fee Rate Display (Right Side) -->
<span id="fee-rate" title="Network fee rate" onclick="openMempoolTinyDataModal()">
</span>
<!-- Lightning Icon -->
<i class="lni lni-bolt-2" onclick="openQRCodeModal()" title="Support me with a sat or two!"></i>
</footer>
<!-- Mempool Tiny Data Modal -->
<div id="mempoolTinyDataModal" class="description-modal">
<div class="modal-content">
<span class="close-icon" onclick="closeMempoolTinyDataModal()">×</span>
<div class="modal-navigation">
<span class="left-arrow" title="Previous Block">⤝</span>
<h2 class="modal-title"></h2>
<span class="right-arrow" title="Next Block">⤞</span>
</div>
<!-- Block Data Content -->
<div class="block-data" style="display: none;">
<div class="avg-fee-rate" title="Median fee rate"></div>
<div class="fee-range" title="Fee Range from Lowest to Highest"></div>
<div class="total-fees-btc" title="Total fees in Bitcoin"></div>
<div class="total-fees-sats" title="Total fees in Satoshis"></div>
<div class="tx-count" title="Number of transactions"></div>
<div class="time-passed" title="Time passed since this block was mined"></div>
<div class="mined-by" title="Miner of the block"></div>
</div>
<!-- Fee Rate Content -->
<div class="fee-data" style="display: none;">
<!-- <div class="fee-info" title="Current Half-Hour Fee Rate"></div> -->
<div class="economy-fee" title="Economy Fee Rate"></div>
<div class="fastest-fee" title="Fastest Fee Rate"></div>
<div class="half-hour-fee" title="Half-Hour Fee Rate"></div>
<div class="hour-fee" title="Hourly Fee Rate"></div>
<div class="minimum-fee" title="Minimum Fee Rate"></div>
</div>
</div>
</div>
<!-- Modal for QR Code donation -->
<div id="qrCodeModal" class="description-modal">
<div class="modal-content">
<span class="close-icon" onclick="closeQRCodeModal()">×</span>
<h4 id="gratitudeHeader">If you find this website valuable, consider contributing a sat or two. Thank you.</h4>
<div class="qr-code-container">
<!-- Lightning QR Code -->
<div class="qr-code-wrapper">
<img src="/img/qrLND.svg" alt="Lightning QR Code" class="qr-code" id="lightningQRCode" title="LNURL1DP68GURN8GHJ7EM9W3SKCCNE9E3K7MF0WQHHXAR9D3KXZUNNW3HKJCEWDFEK7MSS3L3TN">
<p class="qr-code-text" id="lightningAddress">LNURL1DP68GURN8GHJ7EM9W3SKCCNE9E3K7MF0WQHHXAR9D3KXZUNNW3HKJCEWDFEK7MSS3L3TN</p>
</div>
<!-- Onchain QR Code -->
<div class="qr-code-wrapper">
<img src="/img/qrOC.svg" alt="Onchain QR Code" class="qr-code" id="onchainQRCode" title="bc1q2ytw4gwrkw5jg6ekutcwrgw8x5nlkahyk54l5e">
<p class="qr-code-text" id="onchainAddress">bc1q2ytw4gwrkw5jg6ekutcwrgw8x5nlkahyk54l5e</p>
</div>
</div>
</div>
</div>
<!-- Cookie Consent Modal -->
<div id="cookieConsentModal" class="description-modal">
<div class="modal-content">
<h4>Listen Up, Cookie Crunchers!</h4>
<h6>The G.D.P.R. (Greatly Demanding Privacy Rules) requires us to share this with you...</h6>
<p>We don't really give a damn about cookies. But some settings, like our fancy currency rates converter, store your preferences so you don't have to waste time setting things up every damn time you visit.</p>
<br>
<p>But seriously, we don't track you, we don't sell your data, and we definitely don't care about what you're doing online (unless you're baking actual cookies, in which case, send some our way digitally in sats. <span style="color: aliceblue">⚡</span>)</p>
<br>
<p>If you're cool with us making your life a little bit easier, click the button below. If not, hey, that's cool too. Just remember! stay humble and stack sats.</p>
<br>
<!-- Button container with Flexbox -->
<div class="consent-button-container">
<button onclick="acceptCookies()" class="consent-icon-button green-check" title="Yeah, whatever, just do it!">
✔ <!-- Unicode checkmark -->
</button>
<button onclick="declineCookies()" class="consent-icon-button red-cross" title="Nope, delete sll none essential cookies">
✘ <!-- Unicode cross -->
</button>
</div>
</div>
</div>
<script src="coockieConsent.js"></script>
<script src="copyonclick.js"></script>
<script src="mempoolWebSocket.js"></script>
<script src="text.js"></script>
<script src="index.js"></script>
<script src="burgerMenu.js"></script>
<script src="nameForm.js"></script>
</body>
</html>