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

{% block head_style %}
    {{ encore_entry_link_tags('app') }}
    {{ encore_entry_link_tags('fullcalendar') }}
{% endblock head_style %}

{% block localstyle %}
    .fc-header-toolbar h2 {
        text-transform: uppercase;
    }

    .fc-day-grid-event {
        padding:0px;
        border-radius:0px;
        border: none;
    }
    .fc-content {
        height: 40px;
    }
    
    .fc-title {
        font-weight: bolder;
        font-size: 12px;        
    }

    .eventAvatar {
        width: 20px;
        margin: 0px 5px 0px 0px;
        float: left;
    }

    .eventInfo{ 
        margin: -5px 5px 0px 0px;
        clear: both;
    }

    .eventUser{
        clear: both;
    }

    .eventEstimate { 
        margin: -3px 10px;
    }
{% endblock %}

{% block body %}
    <div id="fullcalendar" style="width:100%; margin-top:10px;"></div>

    
    {{ encore_entry_script_tags('fullcalendar') }}
{% endblock %}




{% block localjavascript %}

$(document).ready(function() {
    $("#modalsubmit #user").select2({
        theme: 'bootstrap4',
        language: "fr"
    }); 

    $("#modalsubmit #task").select2({
        placeholder: "Selectionnez un projet",
        allowClear: true,
        theme: 'bootstrap4',
        language: "fr"
    }); 

    $("#modalupdate #user").select2({
        theme: 'bootstrap4',
        language: "fr"
    }); 

    $("#modalupdate #task").select2({
        placeholder: "Selectionnez un projet",
        theme: 'bootstrap4',
        language: "fr"
    }); 
});

// Rendu d'un évenement
function eventRender(info) {
    console.log(info.event.extendedProps);
    // Récupération des divers élements du rendu event
    var content=$(info.el).children('.fc-content');
    var title=$(content).children('.fc-title');

    // Ajouter l'avatar
    content.prepend("<img src="+info.event.extendedProps.avatar+" class='eventAvatar'>");
    content.append("<span class='eventUser float-left small'>"+info.event.extendedProps.username+"</span>");
    var eventInfo=$(content).children('.eventUser');

    // Ajout container 
    content.append("<span class='eventInfo float-right'></span>");
    var eventInfo=$(content).children('.eventInfo');

    // Ajouter le verrou si event non editable
    if(info.event.extendedProps.locked) {
        eventInfo.append("<i class='fa fa-lock float-right'></i>");
    }

    // Ajout estimation
    eventInfo.append("<span class='eventEstimate float-right small'>"+info.event.extendedProps.estimate+"</span>");

    // Description
    content.attr("title",info.event.extendedProps.fulldescription);
}

// Formulaire Création d'un évelement
var allDay;
function eventSelect(selectionInfo) {
    var start=moment(selectionInfo.start);
    var end=moment(selectionInfo.end);
    var end=end.subtract(1, 'd');
    allDay=(start.format("DD/MM/YYYY") != end.format("DD/MM/YYYY"));

    // Controle
    if(start.month()!=end.month()) {
        alert("Une tâche ne peut être sur deux mois différents");
        return false;
    }

    if(start.week()!=end.week()) {
        alert("Une tâche ne peut être sur deux semaines différentes");
        return false;
    }

    // Valeur par défaut
    {% if (is_granted('ROLE_ADMIN') or is_granted('ROLE_VALIDATOR') or is_granted('ROLE_MASTER')) and app.session.get('iduser')!="all" %}  
        $('#usersubmit').val({{app.session.get('iduser')}}).trigger("change");
    {% else %}
        $('#usersubmit').val({{app.user.id}}).trigger("change");
    {% endif %}

    // Si jour de fin un samedi ou un dimanche : on est forcement en astreinte
    if(moment(end).day()==0||moment(end).day()==6) {
        $("#modalsubmit #astreinte").prop("checked",true);
        $("#modalsubmit #astreinte").attr("disabled",true);
        allDay=true;
    }
    else {
        $("#modalsubmit #astreinte").prop('checked', false);
        $("#modalsubmit #astreinte").attr('disabled', false);
    }

    $('#modalsubmit #amsubmit').prop("checked",true);
    $('#modalsubmit #apsubmit').prop("checked",true);
    $('#modalsubmit #amsubmit').attr("disabled",allDay);
    $('#modalsubmit #apsubmit').attr("disabled",allDay);

    $('#modalsubmit #start').val(start.format("YYYY-MM-DD"));
    $('#modalsubmit #end').val(end.format("YYYY-MM-DD"));
    
    $('#modalsubmit #description').val("");
    
    $("#modalsubmit .alert").remove();

    // Formulaire de création d'un évènement
    $('#modalsubmit').modal();
}



// On change astreinte
$("#astreinte").change(function() {
    console.log(allDay)
    if(this.checked) {
        $("#amsubmit").prop("disabled",true);
        $("#apsubmit").prop("disabled",true);

        $('#modalsubmit #amsubmit').prop("checked",true);
        $('#modalsubmit #apsubmit').prop("checked",true);
    }
    else {
        $("#amsubmit").prop("disabled",allDay);
        $("#apsubmit").prop("disabled",allDay);

        $('#modalsubmit #amsubmit').prop("checked",true);
        $('#modalsubmit #apsubmit').prop("checked",true);
    }
});

{% endblock %}