extends layouts/main
block content

  div(uk-grid)
    div(class="uk-width-1-1 uk-width-auto@m")
      h3= site.name
      div(uk-grid).uk-flex-middle
        .uk-width-auto
          +renderCell('Members', formatCount(stats.memberCount))
        .uk-width-auto
          +renderCell('Posts', formatCount(stats.postCount))
        .uk-width-auto
          +renderCell('Comments', formatCount(stats.commentCount))
    div(class="uk-width-1-1 uk-width-auto@m")
      h3 DTP Constellation
      div(uk-grid).uk-flex-middle
        .uk-width-auto
          +renderCell('Potential Reach', formatCount(stats.constellation.potentialReach))
        .uk-width-auto
          +renderCell('Connected Cores', formatCount(stats.constellation.connectedCount))
        .uk-width-auto
          +renderCell('Pending Cores', formatCount(stats.constellation.pendingCount))

  .uk-margin
    h3 Hourly Sign-Ups
    canvas(id="hourly-signups")

block viewjs
  script(src="/chart.js/chart.min.js")
  script(src="/chartjs-adapter-moment/chartjs-adapter-moment.min.js")
  script.
    window.addEventListener('dtp-load', ( ) => {
      const graphData = !{JSON.stringify(stats.userSignupHourly)};
      dtp.app.renderStatsGraph('#hourly-signups', 'Hourly Signups', graphData);
    });