@extends('layouts.app')

@section('content')
<div class="container">
    <div class="row">
        <div class="col-md-12">

          <table class="table scoreboard">
          <thead>
            <tr>
              <th>Team</th>
              @foreach($missions as $mission)
              <th class="score">
                <h3>{{ $mission->id }}</h3>
                {{ $mission->hashtag }}
              </th>
              @endforeach
              <th class="score">Score</th>
            </tr>
          </thead>
          <tbody>
          @foreach($teams as $team)
            <tr>
              <td>
                <div class="team">
                  <span class="team-icon" style="background-color: #{{ $team->color }};"></span> 
                  <span class="team-name">{{ $team->name }}</span>
                </div>
                <div class="players">
                  @foreach($team->players as $player)
                    <a href="https://twitter.com/{{ $player->twitter }}">{{ '@'.$player->twitter }}</a>
                  @endforeach
                </div>
              </td>
              @foreach($missions as $mission)
              <td class="score">
                <div class="team-wrap">
                  <div class="team">
                    @if($mission->progress($team)[0] >= 1)
                      <span class="team-icon outlined {{ $mission->complete($team) ? '' : 'empty' }}" 
                        style="background-color: #{{ $team->color }}; border-color: #{{ $team->color }};">
                        @if(!Auth::guest())
                          {{ $mission->score($team) }}
                        @endif
                      </span> 
                    @endif
                  </div>
                </div>
              </td>
              @endforeach
              <td class="total score">
                <b>{{ $team->total_score() }}</b>
              </td>
            </tr>
          @endforeach
          </tbody>
          </table>

        </div>
    </div>
</div>
@endsection