updated footer, style tweaks

app.js

@@ -20,6 +20,7 @@ var momentDurationFormat = require("moment-duration-format");
 var rpcApi = require("./app/rpcApi.js");
 var coins = require("./app/coins.js");
 var request = require("request");
+var qrcode = require("qrcode");
 
 
 var baseActionsRouter = require('./routes/baseActionsRouter');
@@ -82,9 +83,26 @@ function refreshExchangeRate() {
 app.runOnStartup = function() {
 	global.env = env;
 	global.coinConfig = coins[env.coin];
+	global.coinConfigs = coins;
 
 	console.log("Running RPC Explorer for coin: " + global.coinConfig.name);
 
+	if (env.donationAddresses) {
+		var getDonationAddressQrCode = function(coinId) {
+			qrcode.toDataURL(env.donationAddresses[coinId].address, function(err, url) {
+				console.log("coinId: " + coinId + ", url: " + url);
+
+				global.donationAddressQrCodeUrls[coinId] = url;
+			});
+		};
+
+		global.donationAddressQrCodeUrls = {};
+
+		env.donationAddresses.coins.forEach(function(item) {
+			getDonationAddressQrCode(item);
+		});
+	}
+
 	if (global.exchangeRate == null) {
 		refreshExchangeRate();
 	}

app/env.js

@@ -33,4 +33,11 @@ module.exports = {
 		username:"rpc-username",
 		password:"rpc-password"
 	}*/
+
+	donationAddresses:{
+		coins:["BTC", "LTC"],
+		
+		"BTC":{address:"3NPGpNyLLmVKCEcuipBs7G4KpQJoJXjDGe", urlPrefix:"bitcoin:"},
+		"LTC":{address:"ME4pXiXuWfEi1ANBDo9irUJVcZBhsTx14i", urlPrefix:"litecoin:"}
+	},
 };

public/css/styling.css

@@ -50,8 +50,26 @@ code, .monospace {
 	text-decoration: underline;
 }
 
+strong {
+	font-weight: 500;
+}
+
 @media (min-width: 1920px) {
 	.container {
 		max-width: 1800px;
 	}
 }
+
+footer {
+	border-top: solid 5px #597FA5;
+	border-bottom: solid 5px #597FA5;
+}
+
+footer a {
+	color: #ccc;
+	text-decoration: underline;
+}
+
+footer a:hover {
+	color: white;
+}

routes/baseActionsRouter.js

@@ -580,16 +580,8 @@ 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

@@ -11,23 +11,25 @@ block content
 
 	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:
+	span Pull requests are welcome! 
+		a(href="https://github.com/janoside/btc-rpc-explorer") github.com/janoside/btc-rpc-explorer
 
+	if (env.donationAddresses)
+		hr
 
-	div(class="row")
+		p If you value this tool and want to support my work on this project, please consider a small donation. Anything is appreciated!
-		div(class="col-md-6 text-center")
+
-			a(href="bitcoin:3NPGpNyLLmVKCEcuipBs7G4KpQJoJXjDGe") Bitcoin (BTC)
+		div(class="row mb-5")
-			br
+			each coin, index in env.donationAddresses.coins
-			span 3NPGpNyLLmVKCEcuipBs7G4KpQJoJXjDGe
+				div(class="col text-center")
-			br
+					if (env.donationAddresses[coin].urlPrefix)
-			img(src=bitcoinDonationQrCodeUrl, alt="3NPGpNyLLmVKCEcuipBs7G4KpQJoJXjDGe", style="border: solid 1px #ccc;")
+						a(href=("bitcoin:" + env.donationAddresses["BTC"])) #{coinConfigs[coin].name} (#{coin})
-			br
+					else
+						span #{coinConfigs[coin].name} (#{coin})
 
-		div(class="col-md-6 text-center")
-			a(href="litecoin:ME4pXiXuWfEi1ANBDo9irUJVcZBhsTx14i") Litecoin (LTC)
 					br
-			span ME4pXiXuWfEi1ANBDo9irUJVcZBhsTx14i
+					span #{env.donationAddresses[coin].address}
 					br
-			img(src=litecoinDonationQrCodeUrl, alt="ME4pXiXuWfEi1ANBDo9irUJVcZBhsTx14i", style="border: solid 1px #ccc;")
+					img(src=donationAddressQrCodeUrls[coin], alt=env.donationAddresses[coin].address, style="border: solid 1px #ccc;")
 					br
 		

views/layout.pug

@@ -6,7 +6,7 @@ html
 		
 		link(rel="stylesheet", href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css", integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4", crossorigin="anonymous")
 		link(rel="stylesheet", href="https://netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css")
-		link(rel="stylesheet", href="https://fonts.googleapis.com/css?family=Lato|Open+Sans|Cousine|Ubuntu")
+		link(rel="stylesheet", href="https://fonts.googleapis.com/css?family=Lato|Open+Sans|Cousine|Ubuntu:400,500,700")
 		link(rel="stylesheet", href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/default.min.css")
 		link(rel='stylesheet', href='/css/styling.css')
 
@@ -90,30 +90,41 @@ html
 
 			div(style="margin-bottom: 30px;")
 
-			footer(class="pt-4 my-md-5 pt-md-5 border-top")
+			footer(class="footer bg-dark text-light pt-3 pb-1 px-3", style="margin-top: 50px;")
-				ul
+				div(class="container")
-					li MIT-licensed source code available on github: 
+					div(class="row")
-						a(href="https://github.com/janoside/btc-rpc-explorer") janoside/btc-rpc-explorer
+						div(class="col-md-6")
-						if (sourcecodeVersion)
+							dl
-							span  (@
+								dt Source
+								dd
+									a(href="https://github.com/janoside/btc-rpc-explorer") github.com/janoside/btc-rpc-explorer
+
+								dt Running Version
+								dd
 									a(href=("https://github.com/janoside/btc-rpc-explorer/commit/" + sourcecodeVersion)) #{sourcecodeVersion}
-							span )
-
-					li Public instance maintained at 
-						a(href="https://btc-explorer.com") https://btc-explorer.com
-					
-					li Donate
-						ul
-							li
-								a(href="bitcoin:3NPGpNyLLmVKCEcuipBs7G4KpQJoJXjDGe") BTC
-								span  - 3NPGpNyLLmVKCEcuipBs7G4KpQJoJXjDGe
-							li
-								a(href="litecoin:ME4pXiXuWfEi1ANBDo9irUJVcZBhsTx14i") LTC
-								span  - ME4pXiXuWfEi1ANBDo9irUJVcZBhsTx14i
 
+								dt Public Demo
+								dd
+									if (coinConfig.demoSiteUrl)
+										a(href=coinConfig.demoSiteUrl) #{coinConfig.demoSiteUrl}
+									else
+										a(href="https://btc-explorer.chaintools.io") https://btc-explorer.chaintools.io
+
+						div(class="col-md-6 text-md-right")
+							dl
+								dt Support Development of #{coinConfig.siteTitle}
+								dd
+									div
+										each coin, index in env.donationAddresses.coins
+											div(style="display: inline-block;", class="text-center", class=(index > 0 ? "ml-3" : false))
+												img(src=donationAddressQrCodeUrls[coin], alt=env.donationAddresses[coin].address, style="border: solid 1px #ccc;")
+												br
+												if (env.donationAddresses[coin].urlPrefix)
+													span #{coin}: 
+													a(href=(env.donationAddresses[coin].urlPrefix + donationAddressQrCodeUrls[coin])) #{env.donationAddresses[coin].address.substring(0, 10)}...
+												else
+													span #{coin}
 
-					li © 2018 
-						a(href="https://danjanosik.com") Dan Janosik
 				
 		if (env.showForkBanner)
 			div(class="d-none d-md-block")