{% extends 'base_backend.html.twig' %}
{% block nombreMessage %}{{ nbrMsg }}{% endblock %}

{% block body %}

    <div class="row wrapper border-bottom white-bg page-heading">
        <div class="col-sm-4">
            <h2> <strong>Produits</strong> </h2>
            <ol class="breadcrumb">
                <li>
                    <a href="{{ path('homeback') }}">Home</a>
                </li>
                <li>
                    <a href="{{ path('realisations') }}">Gestion des produits</a>
                </li>
                <li class="active">
                    <strong>Realisation</strong>
                </li>
            </ol>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-12">
            <div class="wrapper wrapper-content animated fadeInUp">

                <div class="ibox">
                    <div class="ibox-title">
                        <h5>Liste des Produits</h5>



                        <div class="ibox-tools">
                            <a href="#" class="btn btn-primary btn-sm " data-toggle="modal" data-target="#myModal">Nouveau Produit</a>

                        </div>
                    </div>
                    <div class="ibox-content">
                        <div class="row m-b-sm m-t-sm">
                            <div class="col-md-1">
                                <button type="button" id="loading-example-btn" class="btn btn-white btn-sm" ><i class="fa fa-refresh"></i> Actualisé</button>
                            </div>
                            <div class="col-md-11">

                            </div>
                        </div>

                        <div class="project-list">

                            <table class="table table-hover">
                                <tbody>
                                <tr>
                                    <td class="project-title" style="text-align: right;">
                                        Nom
                                    </td>
                                    <td class="project-title">
                                        <a href="#" style="float: right">Image</a>
                                    </td>
                                    <td class="project-title">
                                        <a href="#" style="float: right">Action</a>
                                    </td>
                                </tr>
                                {% for r in realisations %}
                                    <tr>
                                        <td class="project-people" style="float: right">
                                            <a href="#"  style="text-align: left;"> {{ r.nom }} </a>
                                        </td>

                                        <td class="project-people">
                                            <a href="#"><img alt="image" class="img-circle" src="{{ asset(imagepath ~ r.image1 ) }}"></a>
                                        </td>
                                        <td class="project-actions" >

                                            {% if r.affiche=='1' %}<a href="{{ path('RealisationAffiche',{'id':r.id}) }}" class="btn btn-primary btn-sm"><i class="fa fa-eye btn-primary" ></i></a>{% else %}<a href="{{ path('RealisationAffiche',{'id':r.id}) }}" class="btn btn-danger btn-sm"><i class="fa fa-eye-slash btn-black" ></i></a>{% endif %}
                                            <a href="{{ path('editrealisation',{'id':r.id}) }}" class="btn btn-white btn-sm"><i class="fa fa-pencil"></i> Editer </a>
                                            <a href="{{ path('realisationdelete',{'id':r.id}) }}" class="btn btn-white btn-sm"><i class="fa fa-remove"></i> Supprimer </a>
                                        </td>
                                    </tr>
                                {% endfor %}
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="modal inmodal" id="myModal" tabindex="-1" role="dialog" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content animated fadeIn">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                        <h4 class="modal-title">Ajout produit</h4>
                        <small class="font-bold"></small>
                    </div>
                    {{ form_start(form) }}
                    <div class="modal-body">
                        <div class="row">
                            <div class="col-sm-12">
                                <div class="form-group">
                                    <label class="control-label" for="order_id">image 1 :</label>
                                    {{ form_widget(form.image1,{ 'attr': {'class': 'form-control filebtn'} }) }}
                                    {{ form_errors(form.image1) }}
                                    <h4 style="display: none;color: red;width: 300px;" id="error" >Veuillez télécharger une image valide !</h4>
                                </div>
                            </div>
                            <div class="col-sm-12">
                                <div class="form-group">
                                    <label class="control-label" for="order_id">image 2 :</label>
                                    {{ form_widget(form.image2,{ 'attr': {'class': 'form-control filebtn'} }) }}
                                    {{ form_errors(form.image2) }}
                                    <h4 style="display: none;color: red;width: 300px;" id="error" >Veuillez télécharger une image valide !</h4>
                                </div>
                            </div>
                            <div class="col-sm-12">
                                <div class="form-group">
                                    <label class="control-label" for="order_id">Nom :</label>
                                    {{ form_widget(form.nom,{ 'attr': {'class': 'form-control'} }) }}
                                </div>
                            </div>
                            <div class="col-sm-12">
                                <div class="form-group">
                                    <label class="control-label" for="order_id">Categorie :</label>
                                    {{ form_widget(form.category,{ 'attr': {'class': 'form-control'} }) }}
                                </div>
                            </div>
                            <div class="col-sm-12">
                                <div class="form-group">
                                    <label class="control-label" for="order_id">Date :</label>
                                    {{ form_widget(form.Date,{ 'attr': {'class': 'date'} }) }}
                                </div>
                            </div>
                            <div class="col-sm-12">
                                <div class="form-group">
                                    <label class="control-label" for="order_id">Description 1 :</label>
                                    {{ form_widget(form.desc1,{ 'attr': {'class': 'form-control'} }) }}
                                </div>
                            </div>
                            <div class="col-sm-12">
                                <div class="form-group">
                                    <label class="control-label" for="order_id">Description 2 :</label>
                                    {{ form_widget(form.desc2,{ 'attr': {'class': 'form-control'} }) }}
                                </div>
                            </div>
                            <div class="col-sm-12">
                                <div class="form-group">
                                    <label class="control-label" for="order_id">Description 3 :</label>
                                    {{ form_widget(form.desc3,{ 'attr': {'class': 'form-control'} }) }}
                                </div>
                            </div>
                            <div class="col-sm-6">
                                <div class="form-group">
                                    <label class="control-label" for="order_id">image détail réalisation  1:</label>
                                    {{ form_widget(form.img1,{ 'attr': {'class': 'form-control filebtn'} }) }}
                                    {{ form_errors(form.img1) }}
                                    <h4 style="display: none;color: red;width: 300px;" id="error" >Veuillez télécharger une image valide !</h4>
                                </div>
                            </div>
                            <div class="col-sm-6">
                                <div class="form-group">
                                    <label class="control-label" for="order_id">image détail réalisation  2:</label>
                                    {{ form_widget(form.img2,{ 'attr': {'class': 'form-control filebtn'} }) }}
                                    {{ form_errors(form.img2) }}
                                    <h4 style="display: none;color: red;width: 300px;" id="error" >Veuillez télécharger une image valide !</h4>
                                </div>
                            </div>
                            <div class="col-sm-6">
                                <div class="form-group">
                                    <label class="control-label" for="order_id">image détail réalisation  3:</label>
                                    {{ form_widget(form.img3,{ 'attr': {'class': 'form-control filebtn'} }) }}
                                    {{ form_errors(form.img3) }}
                                    <h4 style="display: none;color: red;width: 300px;" id="error" >Veuillez télécharger une image valide !</h4>
                                </div>
                            </div>
                            <div class="col-sm-6">
                                <div class="form-group">
                                    <label class="control-label" for="order_id">image détail réalisation  4:</label>
                                    {{ form_widget(form.img4,{ 'attr': {'class': 'form-control filebtn'} }) }}
                                    {{ form_errors(form.img4) }}
                                    <h4 style="display: none;color: red;width: 300px;" id="error" >Veuillez télécharger une image valide !</h4>
                                </div>
                            </div>
                            <div class="col-sm-6">
                                <div class="form-group">
                                    <label class="control-label" for="order_id">image détail réalisation  5:</label>
                                    {{ form_widget(form.img5,{ 'attr': {'class': 'form-control filebtn'} }) }}
                                    {{ form_errors(form.img5) }}
                                    <h4 style="display: none;color: red;width: 300px;" id="error" >Veuillez télécharger une image valide !</h4>
                                </div>
                            </div>
                            <div class="col-sm-6">
                                <div class="form-group">
                                    <label class="control-label" for="order_id">image détail réalisation  6:</label>
                                    {{ form_widget(form.img6,{ 'attr': {'class': 'form-control filebtn'} }) }}
                                    {{ form_errors(form.img6) }}
                                    <h4 style="display: none;color: red;width: 300px;" id="error" >Veuillez télécharger une image valide !</h4>
                                </div>
                            </div>
                            <div class="col-sm-6">
                                <div class="form-group">
                                    <label class="control-label" for="order_id">image détail réalisation  7:</label>
                                    {{ form_widget(form.img7,{ 'attr': {'class': 'form-control filebtn'} }) }}
                                    {{ form_errors(form.img7) }}
                                    <h4 style="display: none;color: red;width: 300px;" id="error" >Veuillez télécharger une image valide !</h4>
                                </div>
                            </div>
                            <div class="col-sm-6">
                                <div class="form-group">
                                    <label class="control-label" for="order_id">image détail réalisation  8:</label>
                                    {{ form_widget(form.img8,{ 'attr': {'class': 'form-control filebtn'} }) }}
                                    {{ form_errors(form.img8) }}
                                    <h4 style="display: none;color: red;width: 300px;" id="error" >Veuillez télécharger une image valide !</h4>
                                </div>
                            </div>




                        </div>

                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-primary">Enregistrer</button>
                    </div>
                    {{ form_rest(form) }}
                    {{ form_end(form) }}
                </div>
            </div>
        </div>
    </div>
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <script>
        $(function()
        {
            $('.filebtn').on('change',function (event)
            {
                if(event.target.files[0].type.indexOf("image")==-1){
                    $('#error').show();
                }
                else {
                    $('#error').hide();
                }
            });

            $('.filebtn2').on('change',function (event)
            {
                if(event.target.files[0].type.indexOf("pdf")==-1){
                    $('#error2').show();
                }
                else {
                    $('#error2').hide();
                }
            });
        });

    </script>
    {#<script>#}
    {#$(document).ready(function(){#}


    {#$('.summernote').summernote("code");#}

    {#});#}
    {#</script>#}
{% endblock %}