/about page and header tweaks

README.md

@@ -4,7 +4,7 @@ Simple, database-free Bitcoin blockchain explorer, via RPC. Built with Node.js,
 
 This tool is intended to be a simple, self-hosted explorer for the Bitcoin blockchain, driven by RPC calls to your own bitcoind node. This tool is easy to run but lacks features compared to full-fledged (database-backed) explorers.
 
-I built this tool because I wanted to use it myself. Whatever reasons one might have for running a full node (trustlessness, technical curiosity, supporting the network, etc) it's helpful to appreciate the "fullness" of your node. With this explorer, you can not only explore the blockchain (in the traditional sense of the term "explorer"), but also explore the capabilities of your own node.
+I built this tool because I wanted to use it myself. Whatever reasons one might have for running a full node (trustlessness, technical curiosity, supporting the network, etc) it's helpful to appreciate the "fullness" of your node. With this explorer, you can not only explore the blockchain (in the traditional sense of the term "explorer"), but also explore the functional capabilities of your own node.
 
 A live demo of the tool is available at https://btc-explorer.com
 

package.json

@@ -19,6 +19,7 @@
     "moment-duration-format": "2.2.2",
     "morgan": "~1.9.0",
     "pug": "2.0.1",
+    "qrcode": "1.2.0",
     "request": "2.85.0",
     "serve-favicon": "~2.3.2",
     "simple-git": "1.92.0"

routes/baseActionsRouter.js

@@ -6,6 +6,7 @@ var utils = require('./../app/utils');
 var env = require("./../app/env");
 var bitcoinCore = require("bitcoin-core");
 var rpcApi = require("./../app/rpcApi");
+var qrcode = require('qrcode');
 
 router.get("/", function(req, res) {
 	if (req.session.host == null || req.session.host.trim() == "") {
@@ -578,6 +579,18 @@ router.get("/rpc-browser", function(req, res) {
 	});
 });
 
+router.get("/about", function(req, res) {
+	qrcode.toDataURL('3NPGpNyLLmVKCEcuipBs7G4KpQJoJXjDGe', function(err, url) {
+		res.locals.bitcoinDonationQrCodeUrl = url;
+
+		qrcode.toDataURL('ME4pXiXuWfEi1ANBDo9irUJVcZBhsTx14i', function(err, url) {
+			res.locals.litecoinDonationQrCodeUrl = url;
+
+			res.render("about");
+		});
+	});
+});
+
 router.get("/fun", function(req, res) {
 	res.locals.historicalData = rpcApi.getHistoricalData();
 	

views/about.pug

@@ -0,0 +1,33 @@
+extends layout
+
+block headContent
+	title About
+
+block content
+	h1(class="h2") About
+	hr
+
+	p This tool is intended to be a simple, self-hosted explorer for the #{coinConfig.name} blockchain, driven by RPC calls to your own node. This tool is easy to run but lacks some features compared to database-backed explorers.
+
+	p I built this tool because I wanted to use it myself. Whatever reasons one might have for running a full node (trustlessness, technical curiosity, supporting the network, etc) it's helpful to appreciate the "fullness" of your own node. With this explorer, you can not only explore the blockchain (in the traditional sense of the term "explorer"), but also explore the functional capabilities of your own node.
+
+	p If you'd like to support my continued work on this project, please consider a small donation:
+
+
+	div(class="row")
+		div(class="col-md-6 text-center")
+			a(href="bitcoin:3NPGpNyLLmVKCEcuipBs7G4KpQJoJXjDGe") Bitcoin (BTC)
+			br
+			span 3NPGpNyLLmVKCEcuipBs7G4KpQJoJXjDGe
+			br
+			img(src=bitcoinDonationQrCodeUrl, alt="3NPGpNyLLmVKCEcuipBs7G4KpQJoJXjDGe", style="border: solid 1px #ccc;")
+			br
+
+		div(class="col-md-6 text-center")
+			a(href="litecoin:ME4pXiXuWfEi1ANBDo9irUJVcZBhsTx14i") Litecoin (LTC)
+			br
+			span ME4pXiXuWfEi1ANBDo9irUJVcZBhsTx14i
+			br
+			img(src=litecoinDonationQrCodeUrl, alt="ME4pXiXuWfEi1ANBDo9irUJVcZBhsTx14i", style="border: solid 1px #ccc;")
+			br
+	

views/layout.pug

@@ -31,9 +31,19 @@ html
 					if (client)
 						ul(class="navbar-nav mr-auto")
 							li(class="nav-item")
-								a(href="/node-details", class="nav-link")
-									i(class="fas fa-info-circle")
-									span  Node Details
+								a(href="/about", class="nav-link")
+									span About
+
+							if (env.headerDropdownLinks)
+								li(class="nav-item dropdown")
+									a(class="nav-link dropdown-toggle", href="javascript:void(0)", id="navbarDropdown", role="button", data-toggle="dropdown", aria-haspopup="true", aria-expanded="false") 
+										span  #{env.headerDropdownLinks.title}
+									div(class="dropdown-menu", aria-labelledby="navbarDropdown")
+										each item in env.headerDropdownLinks.links
+											a(class="dropdown-item", href=item.url)
+												img(src=item.imgUrl, style="width: 24px; height: 24px;")
+												span  #{item.name}
+
 							li(class="nav-item dropdown")
 								a(class="nav-link dropdown-toggle", href="javascript:void(0)", id="navbarDropdown", role="button", data-toggle="dropdown", aria-haspopup="true", aria-expanded="false") 
 									i(class="fas fa-cog")
@@ -56,6 +66,8 @@ html
 
 		div(id="sub-menu", class="container mb-4", style="margin-top: -1.0rem;")
 			ul(class="nav")
+				li(class="nav-item")
+					a(href="/node-details", class="nav-link") Node Details
 				li(class="nav-item")
 					a(href="/rpc-browser", class="nav-link") RPC Browser
 				li(class="nav-item")