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


{% block pagewrapper %}

    {% if access=="config" %}
        <div class="pagemenu">
            <a href="{{ path('app_portal_config_project_view', {id:entity.id})}}">{{ entity.name }}</a>
            <a href='{{ path('app_portal_config_project_update', {id:entity.id}) }}' title='Modifier'><i class='fa fa-cog fa-fw'></i></a>
            <a href='{{ path('app_portal_config_project_writer', {id:entity.id}) }}' title='Permission'><i class='fa fa-users fa-fw'></i></a>
            <a href='{{ path('app_portal_config_project_delete', { id: entity.id }) }}' data-method='delete' data-confirm='Êtes-vous sûr de vouloir supprimer ?' title='Supprimer'><i class='fa fa-trash fa-fw'></i></a>
        </div>
        <div style="margin:10px 0px 10px 0px; text-align:left; display:inline-block;width:49%"></div>
    {% endif %}
    
    {% if access!="config" %}
        <div style="margin:10px 0px 10px 0px; text-align:left; display:inline-block;width:49%">
            {% if not idpage is empty %}
            <a href="{{path('app_portal_user_page_view',{id:idpage,usage:'group',group:idgroup})}}" class="btn btn-success">Revenir sur le Groupe</a>
            {% endif %}
        </div>
    {% endif %}

    <div style="margin:10px 0px 10px 0px; text-align:right; display:inline-block;width:50%">
        <label for="alltask" class="control-label">Afficher les tâches fermées</label>
        <input id="alltask" name="alltask" type="checkbox" class="switch" style="margin-right:20px">

        <label for="allmytask" class="control-label" style="margin-left:20px">Afficher que mes tâches</label>
        <input id="allmytask" name="allmytask" type="checkbox" class="switch">
    </div>

    {% if access!="config" %}
        <ul class="nav navbar-default nav-pills">
            <li id="menuproject-0" class="nav-item py-3 {% if entity.id is not defined %}active{%endif%}" style="cursor:pointer">
                <a href="{{ path("app_portal_user_project_view") }}" class="p-3">
                    Tout
                </a>
            </li>

            {% for project in projects %} 
                <li id="menuproject-{{project.id}}" data-open="{% if project.canupdate %}true{%endif%}" class="nav-item py-3 {% if entity.id is defined and entity.id==project.id%}active{%endif%}" style="cursor:pointer">
                    <a href="{{ path("app_portal_user_project_view",{'id':project.id}) }}" class="p-3">
                        {% if not project.groups is empty %}
                            <i class="fa fa-users fa-fw"></i>
                        {% elseif app.user==project.user %}
                            <i class="fa fa-user fa-fw"></i>
                        {%endif%}
                        {{ project.name }}
                        {% if project.canadd %}
                            <i class="fa fa-pencil-alt"></i>
                        {% else %}
                            <i class="fa fa-lock"></i>
                        {% endif %}
                    </a>
                </li>
            {% endfor %}
            
            <div class="ms-auto d-flex">
                {% if canupdate %}
                    <li class="nav-item py-3"><a id="menusubmit" class="px-1 py-3" style="cursor:pointer" onclick="submitProject()" title='Ajouter un projet'><i class='fa fa-plus fa-fw'></i></a></li>
                {% endif %}
                <li class="nav-item py-3"><a id="menuupdate" class="px-1 py-3" style="cursor:pointer;display:none" onclick="updateProject()" title='Modifier un projet'><i class='fa fa-file fa-fw'></i></a></li>
                <li class="nav-item py-3"><a id="menushare" class="px-1 py-3" style="cursor:pointer;display:none" onclick="shareProject()" title='Partager un projet'><i class='fa fa-share-alt fa-fw'></i></a></li>
                <li class="nav-item py-3"><a id="menuwriter" class="px-1 py-3" style="cursor:pointer;display:none" onclick="writerProject()" title='Permission du projet'><i class='fa fa-users fa-fw'></i></a></li>
                <li class="nav-item py-3"><a id="menudelete" class="px-1 py-3" style="cursor:pointer;display:none" onclick="deleteProject()" title='Supprimer un projet'><i class='fa fa-trash fa-fw'></i></a></li>
            </div>
        </ul>
    {% endif %}
    
    <div class="projectpreview mt-3">
        <h1 class="projecttitle">
            {% if entity.id is not defined %}
                Projet
                {% set idproject=0 %}
            {% else %}
                {{ entity.name }}
                {% set idproject=entity.id %}
            {% endif %}
        </h1>

        {% if canadd %}
        <a class="btn btn-primary" href='{{ path('app_portal_'~access~'_projecttask_submit',{'idproject':idproject}) }}' style="width:100%; font-size:20px" title='Ajouter un article'><i class='fa fa-suitcase fa-fw'></i> Ajouter une Tâche</a>
        {% endif %}

        <div class="grid clearfix">
            {% for projecttask in projecttasks %}
                {% if loop.index==1 %}
                    <div class="grid-sizer grid-list"></div>
                    <div class="grid-gutter-sizer"></div>
                {% endif %}

                {% set classmytask="tasknotmy" %}
                {%if app.user%}
                    {% if projecttask.user %}
                        {% if projecttask.user==app.user %}
                            {% set classmytask="taskmy" %}
                        {%endif%}
                    {%elseif projecttask.owner %}
                        {% if projecttask.owner==app.user %}
                            {% set classmytask="taskmy" %}
                        {%endif%}
                    {%endif%}
                {%endif%}

                {% if projecttask.percentage==100%}
                    {% set classstatus="taskclose" %}
                {% else %}
                    {% set classstatus="taskopen" %}
                {%endif%}

                <div class="grid-item grid-list {{classmytask}} {{classstatus}}">
                    {% set colortask = color['main'] %}
                    {% if projecttask.projecttasktag %}
                        {% set colortask = projecttask.projecttasktag.color %}
                    {% endif %}
                    
                    
                    <div class="grid-item-content" style="background-color:#{{ colortask }}">
                        <a href="{{ path('app_portal_'~access~'_projecttask_view',{'id':projecttask.id})  }}">
                            <div class="item-link clearfix">
                                <div class="grid-item-logo" style="height:55px;width:55px;">
                                    {% if projecttask.user is empty %}
                                        <img class='grid-item-img avatar' src="{{ asset("uploads/avatar/"~projecttask.owner.avatar) }}" style="width:55px; height:55px">
                                    {% else %}
                                        <img class='grid-item-img avatar' src="{{ asset("uploads/avatar/"~projecttask.user.avatar) }}" style="width:55px; height:55px">
                                    {% endif %}
                                </div>
                                <div class="grid-item-title">
                                    <h2 style="height:auto;line-height:18px;">{{projecttask.name }}</h2>
                                    <small>Affectée à
                                    {% if projecttask.user is empty %}
                                        {{ projecttask.owner.username }}
                                    {% else %}
                                        {{ projecttask.user.username }}
                                    {% endif %}
                                    <br>Crée le {{ projecttask.submit|date("d/m/Y à H:i") }}
                                    <br>Dans le projet {{projecttask.project.name }}</small>
                                </div>

                                <div class="float-end" style="width:80px; margin:5px 5px 0px 0px; text-align: center;">
                                    <span style="font-size:10px;">Réalisé à</span><br>
                                    <span style="font-size:35px; line-height:30px">{{ projecttask.percentage }}<span style="font-size:12px">%</span></span>
                                </div>

                                <div class="float-end" style="margin:5px 5px 0px 0px; text-align: right; font-size:11px;">
                                    Priorité = {{ projecttask.priority }}</br>
                                    Avant le = {{ projecttask.end|date("d/m/Y") }}</br>
                                    {% if projecttask.projecttasktag %}
                                        Type = {{ projecttask.projecttasktag.name }}<br>
                                    {% endif %}
                                    {% if projecttask.projecttaskstatus %}
                                        Statut = {{ projecttask.projecttaskstatus.name }}<br>
                                    {% endif %}
                                </div>
                            </div>
                        </a>
                    </div>
                </div>
            {% endfor %}
        </div>
    </div>
{% endblock %}

{% block localjavascript %}
    var idproject;

    $('document').ready(function(){
        $(".switch").bootstrapSwitch();

        {% if entity.id is defined %}
            {% for project in projects %} 
                {% if project.id==entity.id %}
                    showProject({{ project.id }}, {{ project.canadd }});
                {% endif %}
            {% endfor %}
        {% else %}
            showProject(0, {{ canupdate }});
        {% endif %}  

        // Swith task
        switchtask();
    });

    function submitProject() {
        var url="{{ path('app_portal_'~access~'_project_submit') }}";
        $(location).attr('href',url);
    }  

    function updateProject() {
        var url="{{ path('app_portal_'~access~'_project_update',{id:'xx'}) }}";
        url=url.replace('xx',idproject);

        $(location).attr('href',url);
    }    

    function shareProject() {
        var url="{{ path('app_portal_'~access~'_project_share',{id:'xx'}) }}";
        url=url.replace('xx',idproject);

        $(location).attr('href',url);
    } 

    function writerProject() {
        var url="{{ path('app_portal_'~access~'_project_writer',{id:'xx'}) }}";
        url=url.replace('xx',idproject);

        $(location).attr('href',url);
    } 

    function deleteProject() {
        if (confirm('Êtes-vous sûr de vouloir supprimer ?')) {
            var url="{{ path('app_portal_'~access~'_project_delete',{id:'xx'}) }}";
            url=url.replace('xx',idproject);

            $(location).attr('href',url);
        }
    } 

    // Affichages des projects
    function showProject(id,canupdate) {
        idproject=id;

        // Rendre actif le page en cours dans le menu
        $(".navbar-top-links li").removeClass("active");
        $("#menuproject-"+id).addClass("active");

        // Cacher les actions possibles sur la page
        $("#menuupdate").hide();
        $("#menushare").hide();
        $("#menuwriter").hide();
        $("#menudelete").hide();

        if($("#menuproject-"+id).data("open")) {
            $("#menuupdate").show();
            $("#menushare").show();
            $("#menuwriter").show();
            $("#menudelete").show();
        }
    }

    taskmy=false;
    taskclosed=false;
    $('#allmytask').on('switchChange.bootstrapSwitch', function (event, state) {
        taskmy=state;
        switchtask();
    });
    $('#alltask').on('switchChange.bootstrapSwitch', function (event, state) {
        taskclosed=state;
        switchtask();
    });

    // Masquer les taches en fonction des flags
    function switchtask() {

        $(".grid-item").show();
        
        $(".grid-item").each(function() {
            tohide=false;
            if(taskmy&&$(this).hasClass("tasknotmy"))
                tohide=true;
            if(!taskclosed&&$(this).hasClass("taskclose"))
                tohide=true;
            if(tohide) $( this ).hide();
        });
        
        if(taskmy) {
            $(".tasknotmy").hide();
        }

        console.log("taskmy = "+taskmy);
        console.log("taskclosed = "+taskclosed);

        if(!taskclosed) {
            $(".taskclose").hide();
        }


        // Création des grilles d'items
        var optiongrid={columnWidth: '.grid-sizer', itemSelector: '.grid-item', gutter: '.grid-gutter-sizer'};
        var grid = $('.grid').masonry(optiongrid);       

    }

    
{% endblock %}
