@set('_class', {
  0: '/images/tk.gif',
  1: '/images/fm.gif',
  2: '/images/bm.gif',
  3: '/images/ht.gif'
})
@set('kingdom', {
  0: '/assets/images/white.jpg',
  8: '/assets/images/red.jpg',
  7: '/assets/images/blue.jpg'
})
@set('evolution', {
  1: 'Mortal',
  2: 'Arch',
  3: 'Celestial',
  4: 'Celestial',
  5: 'SubCelestial'
})
@set('rankid', (data.currentPage - 1) * 10)

@section('body')
<div class="container">
  <div class="content">
    <div class="rankBlock tab-block active" id="topPlayers">
      <div class="scroll-tableBlock">
        <div class="scroll-table" style="display: flex; gap: 20px; justify-content: center;">
          
          <!-- TABELA CIDADES -->
          <div style="flex: 1;">
            <table class="tableRank">
              <thead>
                <tr><td colspan="5" style="text-align:center;"><h1>Cidades</h1></td></tr>
                <tr>
                  <td>ARMIA</td>
                  <td>AZRAN</td>
                  <td>ERION</td>
                  <td>NIPPLEHEIM</td>
                  <td>NOATUN</td>
                </tr>
              </thead>
               
              <tbody >
                <tr>
                  <td><b><img src="/img_guilds/b0{{ 1000000 + cities[0].armia }}.bmp" alt=""/></b></td>
                  <td><b><img src="/img_guilds/b0{{ 1000000 + cities[0].azran }}.bmp" alt=""/></b></td>
                  <td><b><img src="/img_guilds/b0{{ 1000000 + cities[0].erion }}.bmp" alt=""/></b></td>
                  <td><b><img src="/img_guilds/b0{{ 1000000 + cities[0].nippleheim }}.bmp" alt=""/></b></td>
                  <td><b><img src="/img_guilds/b0{{ 1000000 + cities[0].noatun }}.bmp" alt=""/></b></td>
                </tr>
              </tbody>
            </table>

          <!-- TABELA RANKING --> 
          <div style="padding-top:50px">
            <table class="tableRank">
              <thead>
                <tr><td colspan="6" style="text-align:center;"><h1>Ranking Top Level</h1></td></tr>
                <tr>
                  <td>#</td>
                  <td>Nome Jogador</td>
                  <td>Capa</td>
                  <td>Level</td>
                  <td>Classe</td>
                  <td>Evolução</td>
                </tr>
              </thead>
              <tbody>
                @each(ranking in ranking)
                @set('rankid', rankid + 1)
                <tr>
                  <td>{{ rankid }}</td>
                  @if(ranking.guildlevel == 2)
                  <td><img style="border: 2px solid yellow;" src="/img_guilds/b0{{ 1000000 + ranking.guild_id }}.bmp" alt=""/> {{ ranking.nick }}</td>
                  @else
                  <td><img src="/img_guilds/b0{{ 1000000 + ranking.guild_id }}.bmp" alt=""/> {{ ranking.nick }}</td>
                  @endif
                  <td><img style="width: 25px" src="{{ kingdom[ranking.kingdom] }}"></td>
                  <td>{{ ranking.level + 1 }}</td>
                  <td><img class="w-50" src="{{ _class[ranking.class] }}"></td>
                  <td>{{ evolution[ranking.evolution] }}</td>
                </tr>
                @endeach
              </tbody>
            </table> 
          </div>

          </div>
        </div><!-- .scroll-table -->
      </div><!-- .scroll-tableBlock -->
    </div><!-- .rankBlock -->
  </div><!-- .content -->
</div><!-- .container -->
<div class="container" style="padding-top:100px">
</div><!-- .container -->

@endsection