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


{% block body %}
<section class='article'>

    <article>
    <br>
    <br>
    <br>
        <h2>{{ proposition.title }}</h2>
        <div class="metadata"> Ecrit le {{ proposition.createdAt | date ('d/m/Y') }} à {{ proposition.createdAt |
            date('H:i')}} dans la catégorie {{ proposition.category.title }}</div>
        <div class="content">
            <img id="image_proposition" src="/SiteDemocratie/public/{{ vich_uploader_asset(proposition) }}" alt="{{ proposition.title }}" /> <br>
            {{ proposition.content | raw }}
        </div>
    </article>

    <br>
    {% if proposition.DateFinVote|date('Y-m-d') <  "now"|date('Y-m-d')   %}
    <div class="progress">
        <div class="progress-bar progress-bar-striped bg-success progress-bar-animated" role="progressbar" aria-valuenow=""
            aria-valuemin="0" aria-valuemax="100"  style="width: {{proposition.PourcentagePour}}%">Pour - {{proposition.PourcentagePour}}%
            <span class ="sr-only">{{proposition.PourcentagePour}}%</span>
            </div>
    </div>
    <br>
      <div class="progress">
            <div class="progress-bar progress-bar-striped bg-danger progress-bar-animated" role="progressbar"
                aria-valuenow="" aria-valuemin="0" aria-valuemax="100" style="width: {{proposition.PourcentageContre}}%">Contre - {{proposition.PourcentageContre}}%
                </div>
        </div>
        <br>
        {% endif %}
        <br>
        {% if proposition_vote is not null %}
        <h3>Votre vote a été pris en compte  {{app.user.username}}  </h3>
        
        {% else  %}
        {% if  proposition.DateFinVote|date('Y-m-d') >  "now"|date('Y-m-d')  %}
         <a href="{{path('proposition_pour', {'id': proposition.id }) }}" class="btn btn-success">POUR</a> 
         <a href="{{path('proposition_contre', {'id': proposition.id }) }}"class="btn btn-danger">CONTRE</a>
        
        <br>
        {% endif %}
        {% endif %}
        <br>

    <section id="commentaires">
        <h1>({{ proposition.comments | length }}) Commetaires : </h1>
        {% for comment in proposition.comments %}
        <div class="comment">
            <div class="row">
                <div class="col-3">
                    {{comment.author}} ( <small>{{comment.createdAt | date ('d/m/Y à H:i')}}</small> )
                </div>
                <div class="col">
                    {{comment.content | raw}}
                </div>
            </div>
        </div>
        {% endfor %}

        <br>
      
        <br>

        {% if app.user %}
        <h1>Commenté !</h1>
        {{ form_start(commentForm) }}

        {{ form_row(commentForm.author, {'attr': {'placeholder': "Votre nom"}})}} <br>
        {{ form_row(commentForm.content, {'attr': {'placeholder': "Votre Commentaire"}})}} <br>

        <button type="submit" class="btn btn-success">Commenter !</button>
        {{form_end(commentForm)}}

        {% else %}
        <h2>Connectez-vous pour pouvoir commenter </h2> <br>
        <a href="{{path('security_login')}}" class="btn btn-outline-info">Connexion</a> <br><br>
        {% endif %}



    </section>
    {% endblock %}