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

{% block title %}
    {{ parent() }} - Accueil
{% endblock %}

{% block stylesheets %}	
    <link rel="stylesheet" href="{{ asset('lib/scheduler_trial/codebase/dhtmlxscheduler.css') }}">
    
    <!-- Gantt CSS -->
    <link href="{{ asset('css/calendrier.css') }}" rel="stylesheet" />
    <!-- Gantt CSS -->
    <link href="{{ asset('css/gantt.css') }}" rel="stylesheet" />

{% endblock %}

{% block megamenu %}
    
    <div class="d-flex align-items-center border-left border-right pl-3 pr-2">
        <!-- Mega menu -->
        <div class="dropdown mega-menu d-none d-md-block">
            <a href="#" class="btn btn-secondary mr-2 btn-actions-header" id="dropdownMegaMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">{{ ligneDeFabrication.code }}</a>
            <div class="dropdown-menu text-left" aria-labelledby="dropdownMenuButton">
                <div class="row m-0">
                    <div class="col-md-4 p-4">
                        <p class="text-primary text--cap border-bottom-primary d-inline-block">Postes de charge</p>
                        <div class="menu-icon-grid w-auto p-0">
                            {% for ligne in lignes %}
                                <a href="{{ path('calendrier', {'codeLigne': ligne.code}) }}" class="{% if ligneDeFabrication.code == ligne.code %}border border-primary{% endif %}"><i class="i-Gears"></i> {{ ligne.code }}</a>
                            {% endfor %}
                        </div>
                    </div>
                    <div class="col-md-4 p-4">
                        <p class="text-primary text--cap border-bottom-primary d-inline-block">Raccourcis</p>
                        <ul class="links">
                            {#<li><a href="">Tout positionner</a></li>#}
                            <li><a href="#" onclick ="scheduler.exportToPDF()">Export en PDF</a></li>
                        </ul>
                    </div>
                    <div class="col-md-4 p-4">
                        <h2 class="title">Dernière synchro</h2>
                        <h4 class="title mb-4">{{ DERNIERE_SYNCHRO }}</h4>
                        <div class="text-center">
                            <a id="boutonSynchro" class="btn btn-success mr-1" data-style="expand-left" href="{{ path('recuperation-of') }}">
                                <span class="ladda-label"><i class="fas fa-sync"></i> Synchro ERP</span><span class="ladda-spinner"></span><div class="ladda-progress" style="width: 0px;"></div>
                            </a>
                            <a id="boutonPublication" class="btn btn-primary ml-1" data-style="expand-left" href="{{ path('publication-of') }}">
                                <span class="ladda-label"><i class="fas fa-share"></i> Publier le planning</span><span class="ladda-spinner"></span><div class="ladda-progress" style="width: 0px;"></div>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <div class="d-flex align-items-center pl-3 pr-2">
        <i class="fas fa-chevron-left fa-2x cursor-pointer" id="semainePrecedente"></i>
        <span class="semaine border p-1" id="semaine">{{ NUMSEMAINE }}</span>
        <i class="fas fa-chevron-right fa-2x cursor-pointer" id ="semaineSuivante"></i>
    </div>

{% endblock %}

{% block headerbar %}
    <div class="infos-barre-haute">
        <div class="row">
            <div class="col-md-4 infos-ope pl-3 pr-3 border-left border-right"></div>
            <div class="col-md-4 infos-ope2 pl-3 pr-3 border-right"></div>
            <div class="col-md-4 infos-ope3 pl-3 pr-3 border-right"></div>
        </div>
    </div>
{% endblock %}

{% block rightbar %}

{% endblock %}

{% block page %}
    <div id="scheduler" class="" style='width:100%; height:100%;'> 
        <div class="dhx_cal_navline">
            <!--div class='dhx_cal_export pdf' id='export_pdf' title='Export to PDF' onclick="scheduler.exportToPDF()">&nbsp;</div>
            <div class="dhx_cal_prev_button">&nbsp;</div> 
            <div class="dhx_cal_next_button">&nbsp;</div> 
            <div class="dhx_cal_date"></div> 
            <div class="dhx_cal_tab" name="week_tab"></div--> 
        </div> 
        <div class="dhx_cal_header"></div> 
        <div class="dhx_cal_data" id="cal_data"></div>
    </div>
{% endblock %}

{% block javascripts %}
    <script type="text/javascript">
        var horairesLundi    = {% if ligneDeFabrication.horairesLundi == 'Fermé' %}false{% else %}[{{ ligneDeFabrication.horairesLundi|raw }}]{% endif %};
        var horairesMardi    = {% if ligneDeFabrication.horairesMardi == 'Fermé' %}false{% else %}[{{ ligneDeFabrication.horairesMardi|raw }}]{% endif %};
        var horairesMercredi = {% if ligneDeFabrication.horairesMercredi == 'Fermé' %}false{% else %}[{{ ligneDeFabrication.horairesMercredi|raw }}]{% endif %};
        var horairesJeudi    = {% if ligneDeFabrication.horairesJeudi == 'Fermé' %}false{% else %}[{{ ligneDeFabrication.horairesJeudi|raw }}]{% endif %};
        var horairesVendredi = {% if ligneDeFabrication.horairesVendredi == 'Fermé' %}false{% else %}[{{ ligneDeFabrication.horairesVendredi|raw }}]{% endif %};
        var horairesSamedi   = {% if ligneDeFabrication.horairesSamedi == 'Fermé' %}false{% else %}[{{ ligneDeFabrication.horairesSamedi|raw }}]{% endif %};
        var horairesDimanche = {% if ligneDeFabrication.horairesDimanche == 'Fermé' %}false{% else %}[{{ ligneDeFabrication.horairesDimanche|raw }}]{% endif %};
        var HEURE_DEBUT = {{ HEURE_DEBUT }};
        var HEURE_FIN = {{ HEURE_FIN }};

         
    </script>
    
    <script src="{{ asset('lib/scheduler_trial/codebase/dhtmlxscheduler.js') }}"></script>
    <script src="{{ asset('js/calendrier/config-calendrier.js') }}"></script>
    <script src="{{ asset('js/calendrier/events-calendrier.js') }}"></script>
    <script src="https://export.dhtmlx.com/scheduler/api.js"></script>  

    <script type="text/javascript">
        var data = {{ data | raw }};
        
        scheduler.config.icons_select = [
            "icon_details"
        ];

        scheduler.init('scheduler', new Date(), "week");

        //scheduler.load("{{ path('calendrier', {'codeLigne': ligneDeFabrication.code}) }}", "json");
        scheduler.parse(data);

        //console.log(data);

    </script>
{% endblock %}