From 82efa969547050d540d471afffbe0c2bc7e0ea73 Mon Sep 17 00:00:00 2001 From: joeuhren <46763106+joeuhren@users.noreply.github.com> Date: Tue, 22 Dec 2020 15:57:19 -0700 Subject: [PATCH] Fix + add better tooltips where applicable -Moved code to enable tooltips into a global function and the call is now made closer to page load being complete -Added error checking for browsers with no tooltip support -Added a few new locale strings for tooltip titles --- lib/locale.js | 8 ++++-- locale/en.json | 10 +++++--- views/address.pug | 4 +-- views/block.pug | 4 +-- views/claim_address.pug | 4 +-- views/includes/rl_labels.pug | 4 +-- views/layout.pug | 48 ++++++++++++++++++++---------------- views/market.pug | 4 --- views/tx.pug | 8 +++--- 9 files changed, 51 insertions(+), 43 deletions(-) diff --git a/lib/locale.js b/lib/locale.js index 6f0cd3b..ba1eeba 100644 --- a/lib/locale.js +++ b/lib/locale.js @@ -34,11 +34,15 @@ exports.tx_contributors = "Contributor(s)", exports.tx_hash = "Hash", exports.tx_address = "Address", exports.tx_nonstandard = "NONSTANDARD TX", +exports.view_raw_tx_data = "View Raw Transaction Data", +exports.view_block = "View Block", exports.block_title = "Block Details", -exports.block_previous = "Previous", -exports.block_next = "Next", +exports.block_previous = "Previous Block", +exports.block_next = "Next Block", exports.block_genesis = "GENESIS", +exports.view_raw_block_data = "View Raw Block Data", +exports.view_tx = "View Transaction", exports.difficulty = "Difficulty", exports.network = "Network", diff --git a/locale/en.json b/locale/en.json index 764ba89..a868816 100644 --- a/locale/en.json +++ b/locale/en.json @@ -1,7 +1,5 @@ /* This file must be valid JSON. But comments are allowed - - Please edit en.json, not en.json.template */ { // menu items @@ -34,12 +32,16 @@ "tx_hash": "Hash", "tx_address": "Address", "tx_nonstandard": "NONSTANDARD TX", + "view_raw_tx_data": "View Raw Transaction Data", + "view_block": "View Block", // block view - "block_previous": "Previous", - "block_next": "Next", + "block_previous": "Previous Block", + "block_next": "Next Block", "block_title": "Block Details", "block_genesis": "GENESIS", + "view_raw_block_data": "View Raw Block Data", + "view_tx": "View Transaction", // global "difficulty": "Difficulty", diff --git a/views/address.pug b/views/address.pug index f72c4d6..ffdbdc6 100644 --- a/views/address.pug +++ b/views/address.pug @@ -16,13 +16,13 @@ block content label.d-none.d-sm-block.badge.float-right(class='badge-'+settings.labels[address.a_id].type, style='margin-left:15px;margin-bottom:0;') =settings.labels[address.a_id].label if settings.labels[address.a_id].url - a(href=settings.labels[address.a_id].url, target='_blank', alt='Visit site', title='Visit site') + a(href=settings.labels[address.a_id].url, target='_blank', alt='Visit site', title='Visit site', data-toggle='tooltip', data-placement='top') span.fa.fa-question-circle(style='margin-left:5px;') else label.d-none.d-sm-block.badge.badge-default.float-right(style='margin-left:15px;margin-bottom:0;') =settings.labels[address.a_id].label if settings.labels[address.a_id].url - a(href=settings.labels[address.a_id].url, target='_blank', alt='Visit site', title='Visit site') + a(href=settings.labels[address.a_id].url, target='_blank', alt='Visit site', title='Visit site', data-toggle='tooltip', data-placement='top') span.fa.fa-question-circle(style='margin-left:5px;') else if address.name !== "" && typeof address.name !== "undefined" diff --git a/views/block.pug b/views/block.pug index beb2a9c..7d0b4bd 100644 --- a/views/block.pug +++ b/views/block.pug @@ -20,7 +20,7 @@ block content if block.nextblockhash != null a(href='/block/' + block.nextblockhash) span.fa.fa-chevron-right.iquidus.block-next(data-toggle='tooltip', data-placement='top', title=settings.locale.block_next) - a(href='/api/getblock?hash=' + block.hash, style='margin-left: auto;') + a(href='/api/getblock?hash=' + block.hash, style='margin-left: auto;', data-toggle='tooltip', data-placement='top', title=settings.locale.view_raw_block_data) span.fa.fa-info-circle.iquidus table.table.table-bordered.summary-table thead(class=theadClasses) @@ -105,4 +105,4 @@ block content span.decimal #{totalParts[1]} td.text-center a(href='/tx/' + txn.txid) - span.fa.fa-eye \ No newline at end of file + span.fa.fa-eye(data-toggle='tooltip', data-placement='top', title=settings.locale.view_tx) \ No newline at end of file diff --git a/views/claim_address.pug b/views/claim_address.pug index dc5caa5..bb625e8 100644 --- a/views/claim_address.pug +++ b/views/claim_address.pug @@ -53,13 +53,13 @@ block content label.d-none.d-sm-block.badge.float-right(class='badge-'+settings.labels[address.a_id].type, style='margin-left:15px;margin-bottom:0;') =settings.labels[address.a_id].label if settings.labels[address.a_id].url - a(href=settings.labels[address.a_id].url, target='_blank', alt='Visit site', title='Visit site') + a(href=settings.labels[address.a_id].url, target='_blank', alt='Visit site', title='Visit site', data-toggle='tooltip', data-placement='top') span.fa.fa-question-circle(style='margin-left:5px;') else label.d-none.d-sm-block.badge.badge-default.float-right(style='margin-left:15px;margin-bottom:0;') =settings.labels[address.a_id].label if settings.labels[address.a_id].url - a(href=settings.labels[address.a_id].url, target='_blank', alt='Visit site', title='Visit site') + a(href=settings.labels[address.a_id].url, target='_blank', alt='Visit site', title='Visit site', data-toggle='tooltip', data-placement='top') span.fa.fa-question-circle(style='margin-left:5px;') table.table.table-bordered.table-striped.summary-table.mobile-border-right - var theadClasses = []; diff --git a/views/includes/rl_labels.pug b/views/includes/rl_labels.pug index 182d396..a583b84 100644 --- a/views/includes/rl_labels.pug +++ b/views/includes/rl_labels.pug @@ -3,13 +3,13 @@ if settings.labels[item.a_id] label(class='badge badge-' + settings.labels[item.a_id].type + ' float-right d-none d-md-block', style='margin-left:15px;margin-bottom:0;') =settings.labels[item.a_id].label if settings.labels[item.a_id].url - a(href=settings.labels[item.a_id].url, target='_blank', alt='Visit site', title='Visit site') + a(href=settings.labels[item.a_id].url, target='_blank', alt='Visit site', title='Visit site', data-toggle='tooltip', data-placement='top') span.fa.fa-question-circle(style='margin-left:5px;') else label.badge.badge-default.float-right.d-none.d-md-block(style='margin-left:15px;margin-bottom:0;') =settings.labels[item.a_id].label if settings.labels[item.a_id].url - a(href=settings.labels[item.a_id].url, target='_blank', alt='Visit site', title='Visit site') + a(href=settings.labels[item.a_id].url, target='_blank', alt='Visit site', title='Visit site', data-toggle='tooltip', data-placement='top') span.fa.fa-question-circle(style='margin-left:5px;') else if item.name !== "" && typeof item.name !== "undefined" diff --git a/views/layout.pug b/views/layout.pug index 6b38dfc..b5476a9 100644 --- a/views/layout.pug +++ b/views/layout.pug @@ -87,15 +87,24 @@ html(lang='en') return retVal; } + function enableTooltips() { + if ($().tooltip) { + // Enable tooltips only if browser supports them + $('[data-toggle="tooltip"]').tooltip(); + } + } $(document).ready(function() { if ('#{active}' != '') $('##{active}').addClass('active'); function update_stats() { $.ajax({url: '/ext/summary', success: function(json) { - $("#masternodeCountOnline").text(json.data[0].masternodeCountOnline).prop("alt", json.data[0].masternodeCountOnline+" nodes online").prop("title", json.data[0].masternodeCountOnline+" nodes online"); - $("#masternodeCountOffline").text(json.data[0].masternodeCountOffline).prop("alt", json.data[0].masternodeCountOffline+" unreachable nodes").prop("title", json.data[0].masternodeCountOffline+" unreachable nodes"); - $("#spnMasternodeCountOnline").prop("alt", json.data[0].masternodeCountOnline+" nodes online").prop("title", json.data[0].masternodeCountOnline+" nodes online"); - $("#spnMasternodeCountOffline").prop("alt", json.data[0].masternodeCountOffline+" unreachable nodes").prop("title", json.data[0].masternodeCountOffline+" unreachable nodes"); + var mnOnlineText = json.data[0].masternodeCountOnline+" node"+(json.data[0].masternodeCountOnline == 1 ? "" : "s")+" online"; + var mnOfflineText = json.data[0].masternodeCountOffline+" unreachable node"+(json.data[0].masternodeCountOffline == 1 ? "" : "s"); + + $("#masternodeCountOnline").text(json.data[0].masternodeCountOnline).prop("alt", mnOnlineText).prop("title", mnOnlineText).attr("data-original-title", mnOnlineText); + $("#masternodeCountOffline").text(json.data[0].masternodeCountOffline).prop("alt", mnOfflineText).prop("title", mnOfflineText).attr("data-original-title", mnOfflineText); + $("#spnMasternodeCountOnline").prop("alt", mnOnlineText).prop("title", mnOnlineText).attr("data-original-title", mnOnlineText); + $("#spnMasternodeCountOffline").prop("alt", mnOfflineText).prop("title", mnOfflineText).attr("data-original-title", mnOfflineText); var supplyString = json.data[0].supply; var diffString = json.data[0].difficulty; @@ -119,10 +128,6 @@ html(lang='en') $("#lblX1").text(' '); }}); } - $('.block-last-next').tooltip({ - animation: true, - delay: { hide: 500 } - }); if ($('#history-table tbody tr').length) { $('#history-table').dataTable({ searching: false, @@ -177,7 +182,7 @@ html(lang='en') return '
#{settings.locale.difficulty}
'+difficultyType+'
'; } function getMasternodesPanel() { - return '
#{settings.locale.masternodecount}
'; + return '
#{settings.locale.masternodecount}
'; } function getCoinSupplyPanel() { var supplyType=''; @@ -225,6 +230,7 @@ html(lang='en') hideShowPanel('#{settings.panel4}', 'pnlFour'); hideShowPanel('#{settings.panel5}', 'pnlFive'); fixFooterHeightAndPosition(); + enableTooltips(); }); body - var navbarClasses = ['nav','navbar','navbar-expand-lg']; @@ -256,7 +262,7 @@ html(lang='en') else if settings.homelink == 'coin' a.navbar-brand(href='/', style='order:-1;') #{settings.coin} else if settings.homelink == 'logo' - a(href='/', alt=settings.coin + ' Home', title=settings.coin + ' Home', style='order:-1;') + a(href='/', alt=settings.coin + ' Home', title=settings.coin + ' Home', style='order:-1;', data-toggle='tooltip', data-placement='bottom') img.logo-main(src=settings.logo, style='margin:0;max-height:' + settings.logoheight + 'px;') .collapse.navbar-collapse(id='navbar-collapse') ul.navbar-nav.mr-auto @@ -336,47 +342,47 @@ html(lang='en') ul.nav.justify-content-left if settings.display.github li.float-left - a#github-icon.nav-link.social-link.border-0(href="https://github.com/" + settings.github, target='_blank', alt=settings.coin + ' Github', title=settings.coin + ' Github') + a#github-icon.nav-link.social-link.border-0(href="https://github.com/" + settings.github, target='_blank', alt=settings.coin + ' Github', title=settings.coin + ' Github', data-toggle='tooltip', data-placement='top') span.glyphicon.fab.fa-github if settings.display.discord li.float-left - a#discord-icon.nav-link.social-link.border-0(href=settings.discord, target='_blank', alt=settings.coin + ' Discord', title=settings.coin + ' Discord') + a#discord-icon.nav-link.social-link.border-0(href=settings.discord, target='_blank', alt=settings.coin + ' Discord', title=settings.coin + ' Discord', data-toggle='tooltip', data-placement='top') span.glyphicon.fab.fa-discord if settings.display.telegram li.float-left - a#telegram-icon.nav-link.social-link.border-0(href="https://t.me/" + settings.telegram, target='_blank', alt=settings.coin + ' Telegram', title=settings.coin + ' Telegram') + a#telegram-icon.nav-link.social-link.border-0(href="https://t.me/" + settings.telegram, target='_blank', alt=settings.coin + ' Telegram', title=settings.coin + ' Telegram', data-toggle='tooltip', data-placement='top') span.glyphicon.fab.fa-telegram if settings.display.reddit li.float-left - a#reddit-icon.nav-link.social-link.border-0(href="https://reddit.com/r/" + settings.reddit, target='_blank', alt=settings.coin + ' Reddit', title=settings.coin + ' Reddit') + a#reddit-icon.nav-link.social-link.border-0(href="https://reddit.com/r/" + settings.reddit, target='_blank', alt=settings.coin + ' Reddit', title=settings.coin + ' Reddit', data-toggle='tooltip', data-placement='top') span.glyphicon.fab.fa-reddit if settings.display.youtube li.float-left - a#youtube-icon.nav-link.social-link.border-0(href=settings.youtube, target='_blank', alt=settings.coin + ' YouTube', title=settings.coin + ' YouTube') + a#youtube-icon.nav-link.social-link.border-0(href=settings.youtube, target='_blank', alt=settings.coin + ' YouTube', title=settings.coin + ' YouTube', data-toggle='tooltip', data-placement='top') span.glyphicon.fab.fa-youtube if settings.display.slack li.float-left - a#slack-icon.nav-link.social-link.border-0(href=settings.slack, target='_blank', alt=settings.coin + ' Slack', title=settings.coin + ' Slack') + a#slack-icon.nav-link.social-link.border-0(href=settings.slack, target='_blank', alt=settings.coin + ' Slack', title=settings.coin + ' Slack', data-toggle='tooltip', data-placement='top') span.glyphicon.fab.fa-slack if settings.display.twitter li.float-left - a#twitter-icon.nav-link.social-link.border-0(href="https://twitter.com/" + settings.twitter, target='_blank', alt=settings.coin + ' Twitter', title=settings.coin + ' Twitter') + a#twitter-icon.nav-link.social-link.border-0(href="https://twitter.com/" + settings.twitter, target='_blank', alt=settings.coin + ' Twitter', title=settings.coin + ' Twitter', data-toggle='tooltip', data-placement='top') span.glyphicon.fab.fa-twitter if settings.display.facebook li.float-left - a#facebook-icon.nav-link.social-link.border-0(href="https://www.facebook.com/" + settings.facebook, target='_blank', alt=settings.coin + ' Facebook', title=settings.coin + ' Facebook') + a#facebook-icon.nav-link.social-link.border-0(href="https://www.facebook.com/" + settings.facebook, target='_blank', alt=settings.coin + ' Facebook', title=settings.coin + ' Facebook', data-toggle='tooltip', data-placement='top') span.glyphicon.fab.fa-facebook if settings.display.googleplus li.float-left - a#googleplus-icon.nav-link.social-link.border-0(href="https://plus.google.com/" + settings.googleplus, target='_blank', alt=settings.coin + ' Google+', title=settings.coin + ' Google+') + a#googleplus-icon.nav-link.social-link.border-0(href="https://plus.google.com/" + settings.googleplus, target='_blank', alt=settings.coin + ' Google+', title=settings.coin + ' Google+', data-toggle='tooltip', data-placement='top') span.glyphicon.fab.fa-google-plus if settings.display.bitcointalk li.float-left - a#bitcointalk-icon.nav-link.social-link.border-0(href="https://bitcointalk.org/index.php?topic=" + settings.bitcointalk, target='_blank', alt=settings.coin + ' Bitcointalk', title=settings.coin + ' Bitcointalk') + a#bitcointalk-icon.nav-link.social-link.border-0(href="https://bitcointalk.org/index.php?topic=" + settings.bitcointalk, target='_blank', alt=settings.coin + ' Bitcointalk', title=settings.coin + ' Bitcointalk', data-toggle='tooltip', data-placement='top') span.glyphicon.fab.fa-btc if settings.display.website li.float-left - a#website-icon.nav-link.social-link.border-0(href=settings.website, target='_blank', alt=settings.coin + ' Website', title=settings.coin + ' Website') + a#website-icon.nav-link.social-link.border-0(href=settings.website, target='_blank', alt=settings.coin + ' Website', title=settings.coin + ' Website', data-toggle='tooltip', data-placement='top') span.glyphicon.fa.fa-link .col-4.navbar-nav ul.nav.justify-content-center diff --git a/views/market.pug b/views/market.pug index f9904fe..5bd0711 100644 --- a/views/market.pug +++ b/views/market.pug @@ -16,10 +16,6 @@ block content autowidth: true, responsive: true }); - $('.market-toggle').tooltip({ - animation: true, - delay: { hide: 500 } - }); }); .col-xs-12.col-md-12 if settings.markets.enabled.length > 1 diff --git a/views/tx.pug b/views/tx.pug index 8d55ae4..2baae42 100644 --- a/views/tx.pug +++ b/views/tx.pug @@ -11,7 +11,7 @@ block content .card-header strong=settings.symbol + ' TXid: ' + tx.txid a.d-none.d-md-inline(href=`/api/getrawtransaction?txid=${tx.txid}&decrypt=1`) - span.fa.fa-info-circle.iquidus.float-right + span.fa.fa-info-circle.iquidus.float-right(data-toggle='tooltip', data-placement='top', title=settings.locale.view_raw_tx_data) table.table.table-bordered.table-striped.summary-table.mobile-border-right thead(class=theadClasses) tr @@ -29,7 +29,7 @@ block content td #{time} td.text-center a(href='/block/'+tx.blockhash) - span.fa.fa-eye + span.fa.fa-eye(data-toggle='tooltip', data-placement='top', title=settings.locale.view_block) else if confirms < (confirmations / 2) tr.bg-danger @@ -39,7 +39,7 @@ block content td #{time} td.text-center a(href='/block/'+tx.blockhash) - span.fa.fa-eye + span.fa.fa-eye(data-toggle='tooltip', data-placement='top', title=settings.locale.view_block) else tr.table-warning td #{confirms} @@ -48,7 +48,7 @@ block content td #{time} td.text-center a(href='/block/'+tx.blockhash) - span.fa.fa-eye + span.fa.fa-eye(data-toggle='tooltip', data-placement='top', title=settings.locale.view_block) if tx.vout.length < 1 .alert.alert-info.text-center(role='alert', style='margin-bottom:0;') strong #{settings.locale.tx_nonstandard}