From c81cd2bede0320ba6d5245aee982001bdcf90a5e Mon Sep 17 00:00:00 2001 From: Dan Janosik Date: Wed, 9 May 2018 23:57:31 -0400 Subject: [PATCH] /about page and header tweaks --- README.md | 2 +- package.json | 1 + routes/baseActionsRouter.js | 13 +++++++++++++ views/about.pug | 33 +++++++++++++++++++++++++++++++++ views/layout.pug | 18 +++++++++++++++--- 5 files changed, 63 insertions(+), 4 deletions(-) create mode 100644 views/about.pug diff --git a/README.md b/README.md index 382f3d9..21421be 100644 --- a/README.md +++ b/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 diff --git a/package.json b/package.json index b2d8848..5e3a418 100644 --- a/package.json +++ b/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" diff --git a/routes/baseActionsRouter.js b/routes/baseActionsRouter.js index af88aff..c0708b8 100644 --- a/routes/baseActionsRouter.js +++ b/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(); diff --git a/views/about.pug b/views/about.pug new file mode 100644 index 0000000..d57cdb1 --- /dev/null +++ b/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 + \ No newline at end of file diff --git a/views/layout.pug b/views/layout.pug index 3cffb22..0684a27 100644 --- a/views/layout.pug +++ b/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")