{% extends 'Game/index.html.twig' %}

{% block title %} - Battle Report{% endblock %}

{% block metas %}
  {%- set shareUrl = url('MineSeekerBundle_battle_share', { uuid: game.uuid }) | replace({'http://': 'https://'}) -%}
  {%- set _ogImage = url('MineSeekerBundle_og_battle', { uuid: game.uuid }) | replace({'http://': 'https://'}) -%}
  <meta property="og:url" content="{{ shareUrl }}"/>
  <meta property="og:type" content="article"/>
  <meta property="og:site_name" content="MineSeeker"/>
  <meta property="og:locale" content="en_US"/>
  <meta property="og:title" content="{{ ogTitle }}"/>
  <meta property="og:description" content="{{ ogDesc }}"/>
  <meta property="og:image" content="{{ _ogImage }}"/>
  <meta property="og:image:width" content="1600"/>
  <meta property="og:image:height" content="627"/>
  <meta property="og:image:alt" content="{{ ogTitle }}"/>
  <meta name="twitter:card" content="summary_large_image"/>
  <meta name="twitter:site" content="@MineSeeker"/>
  <meta name="twitter:title" content="{{ ogTitle }}"/>
  <meta name="twitter:description" content="{{ ogDesc }}"/>
  <meta name="twitter:image" content="{{ _ogImage }}"/>
  <meta name="twitter:image:alt" content="{{ ogTitle }}"/>
{% endblock %}

{% block body %}
  <div class="bshare-page">
    <div class="bshare-card">
      <div class="bshare-card__eyebrow">
        <i class="fas fa-crosshairs"></i> Battle Report
      </div>
      <div class="bshare-vs">
        <div class="bshare-player bshare-player--red">
          <div class="bshare-avatar bshare-avatar--red">
            {% if redAvatar %}
              <img src="{{ redAvatar|imagine_filter('avatar_thumb') }}"
                   alt="{{ redName }}"
                   class="bshare-avatar__img">
            {% else %}
              {{ redName|slice(0,2)|upper }}
            {% endif %}
          </div>
          <span class="bshare-player__name">{{ redName }}</span>
          <span class="bshare-player__side">Red</span>
        </div>
        <div class="bshare-vs__center">
          {% if redPts is not null and bluePts is not null %}
            <div class="bshare-score">
              <span class="bshare-score__red">{{ redPts }}</span>
              <span class="bshare-score__sep">:</span>
              <span class="bshare-score__blue">{{ bluePts }}</span>
            </div>
          {% else %}
            <div class="bshare-score bshare-score--na">— : —</div>
          {% endif %}
          <div class="bshare-vs__label">VS</div>
          {% if resign == 'red' %}
            <div class="bshare-badge bshare-badge--blue">
              <i class="fas fa-trophy"></i> Blue wins
            </div>
          {% elseif resign == 'blue' %}
            <div class="bshare-badge bshare-badge--red">
              <i class="fas fa-trophy"></i> Red wins
            </div>
          {% elseif redPts is not null and bluePts is not null %}
            {% if redPts > bluePts %}
              <div class="bshare-badge bshare-badge--red">
                <i class="fas fa-trophy"></i> Red wins
              </div>
            {% elseif bluePts > redPts %}
              <div class="bshare-badge bshare-badge--blue">
                <i class="fas fa-trophy"></i> Blue wins
              </div>
            {% else %}
              <div class="bshare-badge bshare-badge--draw">
                <i class="fas fa-minus"></i> Draw
              </div>
            {% endif %}
          {% endif %}
        </div>
        <div class="bshare-player bshare-player--blue">
          <div class="bshare-avatar bshare-avatar--blue">
            {% if blueAvatar %}
              <img src="{{ blueAvatar|imagine_filter('avatar_thumb') }}"
                   alt="{{ blueName }}"
                   class="bshare-avatar__img">
            {% else %}
              {{ blueName|slice(0,2)|upper }}
            {% endif %}
          </div>
          <span class="bshare-player__name">{{ blueName }}</span>
          <span class="bshare-player__side">Blue</span>
        </div>
      </div>
      <div class="bshare-details">
        {% if resign %}
          <div class="bshare-detail">
            <i class="fas fa-flag"></i>
            <span>{{ resign|capitalize }} resigned</span>
          </div>
        {% endif %}
        {% if game.redExplodedBomb %}
          <div class="bshare-detail bshare-detail--bomb">
            <i class="fas fa-bomb"></i>
            <span>{{ redName }} hit a mine</span>
          </div>
        {% endif %}
        {% if game.blueExplodedBomb %}
          <div class="bshare-detail bshare-detail--bomb">
            <i class="fas fa-bomb"></i>
            <span>{{ blueName }} hit a mine</span>
          </div>
        {% endif %}
        {% if game.updated %}
          <div class="bshare-detail">
            <i class="fas fa-calendar"></i>
            <span>{{ game.updated|date('Y-m-d H:i') }}</span>
          </div>
        {% endif %}
      </div>
      <div class="bshare-cta">
        <a href="{{ path('MineSeekerBundle_gamePlay') }}" class="bshare-btn">
          <i class="fas fa-play"></i> Play MineSeeker
        </a>
        <a href="{{ path('MineSeekerBundle_homepage') }}" class="bshare-btn bshare-btn--ghost">
          <i class="fas fa-house"></i> Homepage
        </a>
      </div>
    </div>
  </div>
{% endblock %}