extends layout

block content
  include ./includes/common.pug

  if settings.richlist_page.wealth_distribution.show_distribution_chart == true
    script.
      $(document).ready(function() {
        var data = [
          ['Top 1-25', !{dista.percent}],
          ['Top 26-50', !{distb.percent}],
          ['Top 51-75', !{distc.percent}],
          ['Top 76-100', !{distd.percent}],
          ['101+', !{diste.percent}]
        ];
        var burned = '!{burned}';
        if ('#{settings.richlist_page.burned_coins.include_burned_coins_in_distribution}' == 'true' && burned != 'null' && burned != '' && burned != '0')
          data.push(['Burned Coins', parseFloat(((burned / 100000000) / !{stats.supply}) * 100)]);
        var piePlot = $.jqplot('pieChart', [data],
          {
            seriesColors: !{JSON.stringify(settings.richlist_page.wealth_distribution.colors)},
            series: [{
              renderer: $.jqplot.PieRenderer,
              rendererOptions: {
                diameter: 260,
                padding: 0,
                sliceMargin: 4,
                showDataLabels: false
              }
            }],
            grid: {borderWidth:0, shadow:false},
            legend: {
              show: false,
              rendererOptions: {
                numberRows: 1,
                border: 'none'
              },
              location: 's'
            }
          }
        );

        if ('#{settings.richlist_page.page_header.show_last_updated}' == 'true') {
          var lastUpdatedDate = #{(last_updated == null || last_updated == '0' ? 0 : last_updated)};

          if (lastUpdatedDate != 0) {
            $('span#lastUpdatedDate').html(' ' + format_unixtime(lastUpdatedDate));

            if (#{settings.shared_pages.date_time.enable_alt_timezone_tooltips} == true) {
              $('span#lastUpdatedDate').attr('data-bs-toggle', 'tooltip').attr('data-bs-placement', 'auto').attr('title', format_unixtime(lastUpdatedDate, true));
              enableTooltips();
            }
          } else
            $('span#lastUpdatedDate').html(' N/A');
        }
        if (#{settings.shared_pages.page_header.page_title_image.enable_animation} == true && #{settings.richlist_page.page_header.show_img} == true)
          startRotateElement('img#header-img');
        $(window).resize(function () {
          if (piePlot != null && $('#pieChart').is(':visible')) {
            let parentWidth = $('#pieChart').parent().outerWidth();

            $('#pieChart').css('height', (parentWidth <= 300 ? parentWidth + 5 : 305).toString() + 'px');
            $('#pieChart').css('width', (parentWidth <= 300 ? parentWidth : 300).toString() + 'px');
            piePlot.replot({ resetAxes: false });
          }
        });
      });
  - var theadClasses = [];
  if settings.shared_pages.table_header_bgcolor != null && settings.shared_pages.table_header_bgcolor != ''
    - theadClasses.push('table-' + settings.shared_pages.table_header_bgcolor);
  if settings.richlist_page.page_header.show_img == true || settings.richlist_page.page_header.show_title == true || settings.richlist_page.page_header.show_last_updated == true || settings.richlist_page.page_header.show_description == true
    .row(style='margin: 0 0 5px 0;')
      div(class=(settings.richlist_page.wealth_distribution.show_distribution_table == true || settings.richlist_page.wealth_distribution.show_distribution_chart == true ? 'col-xs-12' : 'col-12'))
        .container
          #page-header-container(style='align-items:' + (settings.richlist_page.page_header.show_img == true && settings.richlist_page.page_header.show_title == true && settings.richlist_page.page_header.show_last_updated == true && settings.richlist_page.page_header.show_description == true ? 'flex-start' : 'center'))
            if settings.richlist_page.page_header.show_img == true
              #header-img-container
                img#header-img(src=(settings.shared_pages.page_header.page_title_image == null || settings.shared_pages.page_header.page_title_image.image_path == null || settings.shared_pages.page_header.page_title_image.image_path == '' ? '/img/page-title-img.png' : settings.shared_pages.page_header.page_title_image.image_path))
            #page-title-container
              if settings.richlist_page.page_header.show_title == true
                h3#page-title #{settings.locale.rl_title.replace('{1}', settings.coin.name)}
              if settings.richlist_page.page_header.show_last_updated == true
                if settings.richlist_page.page_header.show_title != true && settings.richlist_page.page_header.show_description != true
                  #page-title-container
                    .sub-page-header
                      span.fw-bold=settings.locale.last_updated + ':'
                      span.text-muted#lastUpdatedDate
                else
                  .sub-page-header(style='margin-bottom:' + (settings.richlist_page.page_header.show_description == true ? '5' : '0') + 'px')
                    span.fw-bold=settings.locale.last_updated + ':'
                    span.text-muted#lastUpdatedDate
              if settings.richlist_page.page_header.show_description == true
                if settings.richlist_page.page_header.show_title != true && settings.richlist_page.page_header.show_last_updated != true
                  #page-title-container
                    .sub-page-header.text-muted=settings.locale.rl_description.replace('{1}', settings.coin.name)
                else
                  .sub-page-header.text-muted=settings.locale.rl_description.replace('{1}', settings.coin.name)
          .cardSpacer.clearfix
  .row(style='margin-left:0;margin-right:0;')
    if settings.richlist_page.show_current_balance == true || settings.richlist_page.show_received_coins == true
      div(class=(settings.richlist_page.wealth_distribution.show_distribution_table == true || settings.richlist_page.wealth_distribution.show_distribution_chart == true ? 'col-xs-12 col-lg-8' : 'col-12'))
        .container
          ul.nav.nav-tabs(role='tablist')
            if settings.richlist_page.show_current_balance == true
              li.nav-item(role='presentation')
                a(class='nav-link' + (settings.richlist_page.show_current_balance == true ? ' active' : ''), href='#balance', aria-controls='balance', role='tab', data-bs-toggle='tab') #{settings.locale.rl_current_balance}
            if settings.richlist_page.show_received_coins == true
              li.nav-item(role='presentation')
                a(class='nav-link' + (!settings.richlist_page.show_current_balance ? ' active' : ''), href='#received', aria-controls='received', role='tab', data-bs-toggle='tab') #{settings.locale.rl_received_coins}
        .tab-content
          if settings.richlist_page.show_current_balance == true
            #balance(class='container tab-pane' + (settings.richlist_page.show_current_balance == true ? ' active' : ''), style='margin-top:0;')
              .card.card-default.border-0
                table.table.table-hover.table-bordered.table-striped.summary-table.right-border-0(style='margin-bottom:0;', cellspacing='0')
                  thead
                    tr(class=theadClasses)
                      th.text-center
                        span.fa.fa-flag-checkered
                      th #{settings.locale.tx_address}
                      th.text-center #{settings.locale.rl_balance}
                        span.small.fw-normal  (#{settings.coin.symbol})
                      th.text-center %
                  tbody
                    - var count = 0;
                    each address in balance
                      - count = count + 1;
                      - var itemFixed = (parseInt(address.balance) / 100000000);
                      - var itemFixedParts = Number(itemFixed).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':8,'useGrouping':true}).split(".");
                      - var percent = Number((itemFixed / stats.supply) * 100).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':2,'useGrouping':false});
                      - var percentParts = percent.split(".");
                      tr
                        td.text-center
                          =count
                        td
                          if settings.claim_address_page.enabled == false || address.name == null || address.name == ''
                            a.breakWord(href='/address/' + address.a_id) #{address.a_id}
                          else
                            a.breakWord(href='/address/' + address.a_id) #{address.name}
                          include ./includes/rl_labels.pug
                        td.text-center #{itemFixedParts[0]}.
                          span.decimal #{itemFixedParts[1]}
                        td.text-center #{percentParts[0]}.
                          span.decimal #{percentParts[1]}
          if settings.richlist_page.show_received_coins == true
            #received(class='container tab-pane' + (!settings.richlist_page.show_current_balance ? ' active' : ''), style='margin-top:0;')
              .card.card-default.border-0
                table.table.table-hover.table-bordered.table-striped.summary-table.right-border-0(style='margin-bottom:0;', cellspacing='0')
                  thead
                    tr(class=theadClasses)
                      th.text-center
                        span.fa.fa-flag-checkered
                      th #{settings.locale.tx_address}
                      th.text-center #{settings.locale.rl_received}
                        span.small.fw-normal  (#{settings.coin.symbol})
                  tbody
                    - var count = 0;
                    each address in received
                      - count = count + 1;
                      - var itemFixed = Number(parseInt(address.received) / 100000000).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':8,'useGrouping':true});
                      - var itemFixedParts = itemFixed.split(".");
                      tr
                        td.text-center
                          =count
                        td
                          if settings.claim_address_page.enabled == false || address.name == null || address.name == ''
                            a.breakWord(href='/address/' + address.a_id) #{address.a_id}
                          else
                            a.breakWord(href='/address/' + address.a_id) #{address.name}
                          include ./includes/rl_labels.pug
                        td.text-center #{itemFixedParts[0]}.
                          span.decimal #{itemFixedParts[1]}
    if settings.richlist_page.wealth_distribution.show_distribution_table == true || settings.richlist_page.wealth_distribution.show_distribution_chart == true
      div(class=(settings.richlist_page.show_received_coins == true || settings.richlist_page.show_current_balance == true ? 'col-xs-12 col-lg-4' : 'col-12'))
        if settings.richlist_page.wealth_distribution.show_distribution_table == true
          #summary-panel.card.card-default.border-0(style='margin-top:' + (settings.richlist_page.show_current_balance == true || settings.richlist_page.show_received_coins == true ? '34' : '0') + 'px;')
            .card-header
              strong #{settings.locale.rl_wealth}
            table.table.table-hover.table-bordered.summary-table.right-border-0(style='margin-bottom:0;')
              thead
                tr(class=theadClasses)
                  th
                  th.text-center Amount
                    span.small.fw-normal  (#{settings.coin.symbol})
                  th.text-center %
              tbody
                tr
                  td.fw-bold
                    div.float-start.wealth-dist-color-box(style=('background-color:' + settings.richlist_page.wealth_distribution.colors[0] + ';'))
                    span #{settings.locale.rl_top25}
                  - var total = Number(dista.total).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':8,'useGrouping':true});
                  - var totalParts = total.split(".");
                  - var percent = parseFloat(dista.percent).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':2,'useGrouping':false});
                  - var percentParts = percent.split(".");
                  td.text-center.breakWord #{totalParts[0]}.
                    span.decimal.breakWord #{totalParts[1]}
                  td.text-center #{percentParts[0]}.
                    span.decimal #{percentParts[1]}
                tr
                  td.fw-bold
                    div.float-start.wealth-dist-color-box(style=('background-color:' + settings.richlist_page.wealth_distribution.colors[1] + ';'))
                    span #{settings.locale.rl_top50}
                  - var total = Number(distb.total).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':8,'useGrouping':true});
                  - var totalParts = total.split(".");
                  - var percent = parseFloat(distb.percent).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':2,'useGrouping':false});
                  - var percentParts = percent.split(".");
                  td.text-center.breakWord #{totalParts[0]}.
                    span.decimal.breakWord #{totalParts[1]}
                  td.text-center #{percentParts[0]}.
                    span.decimal #{percentParts[1]}
                tr
                  td.fw-bold
                    div.float-start.wealth-dist-color-box(style=('background-color:' + settings.richlist_page.wealth_distribution.colors[2] + ';'))
                    span #{settings.locale.rl_top75}
                  - var total = Number(distc.total).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':8,'useGrouping':true});
                  - var totalParts = total.split(".");
                  - var percent = parseFloat(distc.percent).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':2,'useGrouping':false});
                  - var percentParts = percent.split(".");
                  td.text-center.breakWord #{totalParts[0]}.
                    span.decimal.breakWord #{totalParts[1]}
                  td.text-center #{percentParts[0]}.
                    span.decimal #{percentParts[1]}
                tr
                  td.fw-bold
                    div.float-start.wealth-dist-color-box(style=('background-color:' + settings.richlist_page.wealth_distribution.colors[3] + ';'))
                    span #{settings.locale.rl_top100}
                  - var total = Number(distd.total).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':8,'useGrouping':true});
                  - var totalParts = total.split(".");
                  - var percent = parseFloat(distd.percent).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':2,'useGrouping':false});
                  - var percentParts = percent.split(".");
                  td.text-center.breakWord #{totalParts[0]}.
                    span.decimal.breakWord #{totalParts[1]}
                  td.text-center #{percentParts[0]}.
                    span.decimal #{percentParts[1]}
                tr.text-end
                  td.fw-bold
                    span #{settings.locale.total_top_100}
                  - var total = Number(parseFloat(dista.total) + parseFloat(distb.total) + parseFloat(distc.total) + parseFloat(distd.total)).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':8,'useGrouping':true});
                  - var totalParts = total.split(".");
                  - var percent = (parseFloat(dista.percent)+parseFloat(distb.percent)+parseFloat(distc.percent)+parseFloat(distd.percent)).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':2,'useGrouping':false});
                  - var percentParts = percent.split(".");
                  td.text-center.fw-bold.breakWord #{totalParts[0]}.
                    span.decimal.breakWord #{totalParts[1]}
                  td.fw-bold.text-center #{percentParts[0]}.
                    span.decimal #{percentParts[1]}
                tr
                  td.fw-bold
                    div.float-start.wealth-dist-color-box(style=('background-color:' + settings.richlist_page.wealth_distribution.colors[4] + ';'))
                    span 101+
                  - var total = Number(diste.total).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':8,'useGrouping':true});
                  - var totalParts = total.split(".");
                  - var percent = parseFloat(diste.percent).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':2,'useGrouping':false});
                  - var percentParts = percent.split(".");
                  td.text-center.breakWord #{totalParts[0]}.
                    span.decimal.breakWord #{totalParts[1]}
                  td.text-center #{percentParts[0]}.
                    span.decimal #{percentParts[1]}
                if settings.richlist_page.burned_coins.include_burned_coins_in_distribution == true && burned != null && burned > 0
                  tr
                    td.fw-bold
                      div.float-start.wealth-dist-color-box(style=('background-color:' + settings.richlist_page.wealth_distribution.colors[5] + ';'))
                      span Burned Coins
                    - var total = Number(burned / 100000000).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':8,'useGrouping':true});
                    - var totalParts = total.split(".");
                    - var percent = parseFloat(((burned / 100000000) / stats.supply) * 100).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':2,'useGrouping':false});
                    - var percentParts = percent.split(".");
                    td.text-center.breakWord #{totalParts[0]}.
                      span.decimal.breakWord #{totalParts[1]}
                    td.text-center #{percentParts[0]}.
                      span.decimal #{percentParts[1]}
                tr.text-end
                  td.fw-bold
                    span #{settings.locale.total}
                  - var total = Number(parseFloat(dista.total) + parseFloat(distb.total) + parseFloat(distc.total) + parseFloat(distd.total) + parseFloat(diste.total) + (settings.richlist_page.burned_coins.include_burned_coins_in_distribution == true && burned != null && burned > 0 ? burned / 100000000 : 0)).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':8,'useGrouping':true});
                  - var totalParts = total.split(".");
                  - var percent = (parseFloat(dista.percent) + parseFloat(distb.percent) + parseFloat(distc.percent) + parseFloat(distd.percent) + parseFloat(diste.percent) + parseFloat((settings.richlist_page.burned_coins.include_burned_coins_in_distribution == true && burned != null && burned > 0 ? ((burned / 100000000) / stats.supply) * 100 : 0))).toLocaleString('en',{'minimumFractionDigits':2,'maximumFractionDigits':2,'useGrouping':false});
                  - var percentParts = percent.split(".");
                  td.text-center.fw-bold.breakWord #{totalParts[0]}.
                    span.decimal.breakWord #{totalParts[1]}
                  td.fw-bold.text-center #{percentParts[0]}.
                    span.decimal #{percentParts[1]}
        if settings.richlist_page.wealth_distribution.show_distribution_chart == true
          div#pieChart(style="max-width:300px;max-height:305px;margin:0 auto;")