MineSeeker/templates/Game/play.html.twig

{% extends 'base.html.twig' %}

{% block title %} - Play!{% endblock %}

{% block body %}
    <div class="game-brand-bar">
        <a class="back-from-game" href="{{ path('MineSeekerBundle_homepage') }}">
            <img src="{{ asset('/images/mine-logo-txt.png') }}" alt="Mineseeker Logo">
        </a>
        <a class="game-cap-badge" href="https://trycap.dev" target="_blank" rel="noopener noreferrer">
            <i class="fas fa-shield-halved"></i> Protected by Cap
        </a>
    </div>
    <div class="mine-container">
        <div id="mine-wrapper"
             data-env="{{ env }}"
             data-game-id="{{ app.request.get('gameAssoc') }}"
             data-opponent-name="{{ opponent_name }}"
             data-is-authenticated="{{ app.user ? '1' : '0' }}"
             data-mercure-hub-url="{{ mercure_hub_url }}"
             data-mercure-subscriber-jwt="{{ mercure_subscriber_jwt }}"
             data-cap-api-endpoint="{{ cap_api_endpoint }}">
        </div>
    </div>
{% endblock %}

{% block metas %}
    <meta property="og:url" content="{{ url('MineSeekerBundle_gamePlay') | replace({'http://': 'https://'}) }}"/>
    <meta property="og:type" content="website"/>
    <meta property="og:title" content="Your friend challenges YOU!"/>
    <meta property="og:description" content="Do you accept the challenge?"/>
    <meta property="og:image"
          content="https://{{ app.request.host }}{{ asset('/images/mine-1600x627.png') }}"/>
{% endblock %}

{% block stylesheets %}
    {{ vite_entry_link_tags('mineseekerStyle') }}
    <style>
        .mine-container {
            background: url('/images/bg-mineseeker-{{ random(1) }}-outbg.jpg') no-repeat;
        }
    </style>
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    {{ vite_entry_script_tags('mineseeker', { dependency: 'react' }) }}
{% endblock %}