{% extends "layout/backEndLayout.html.twig" %}

{% block content %}

    <div class="row mt-4">
        <div class="col-1 mar-bot30">
          {% if is_granted('ROLE_ADMIN') %}
            <a class="btn btn-info" href="{{ path('admin_classrooms_new') }}">
                <i class="fa fa-plus"></i>
                
                                                                                                                                                
                                                                                                                            
                                                                                                            
                                                                                            
     
            </a>
            {% endif %}
        </div>
          
          
        </div>

        <div class="col-11 jumbotron">
            <article class="p-3">
                <table class="table table-hover record_properties center">
                    <tbody>
                        <tr>
                            <th scope="row">
                                Nom
                                                                                                                                                                                                                                                            
                                                                                                                                                                                                                            
                                                                                                                                                                                            
                                                                                                                                                            
                                                                                                                            
                                                                                            
                                                            
                            </th>
                            <td>
                                {{ classroom.name }}
                            </td>
                        </tr>
                        <tr>
                            <th scope="row">
                                Niveau
                                                                                                                                                                                                                                                            
                                                                                                                                                                                                                            
                                                                                                                                                                                            
                                                                                                                                                            
                                                                                                                            
                                                                                            
                                                            
                            </th>
                            <td>
                                {{ classroom.level }}
                            </td>
                        </tr>
                        <tr>
                            <th scope="row">
                                Titulaire
                                                                                                                                                                                                                                                            
                                                                                                                                                                                                                            
                                                                                                                                                                                            
                                                                                                                                                            
                                                                                                                            
                                                                                            
                                                            
                            </th>
                            <td>
                                {% if mainteacher is null %}
                                    
                                    {% else %}
                                      {{mainteacher.fullName}}
                                {% endif %}
                             
                            </td>
                        </tr>
                        <tr>
                            <th scope="row">
                                Classe d'examen                                                                                                                                                                                                                                                             
                                                                                                                                                                                                                            
                                                                                                                                                                                            
                                                                                                                                                            
                                                                                                                            
                                                                                            
                                                            
                            </th>
                            <td>
                                {% if (classroom.apc == true) %}
                                    OUI
                                                                                                                                                                                                                                                                                                								
                                                                                                                                                                                                                                                                                            
                                                                                                                                                                                                                                                        
                                                                                                                                                                                                                    
                                                                                                                                                                                
                                                                                                                                            
                                                                                                        
                                                                    
                                {% else %}
                                    NON
                                                                                                                                                                                                                                                                                                								
                                                                                                                                                                                                                                                                                            
                                                                                                                                                                                                                                                        
                                                                                                                                                                                                                    
                                                                                                                                                                                
                                                                                                                                            
                                                                                                        
                                                                    
                                {% endif %}
                            </td>
                        </tr>
                    </tbody>
                </table>

                <div class="btn-group record_actions">

                    <a class="btn btn-info" href="{{ path('admin_classrooms') }}">
                        <i class="fa fa-list"></i>
                       
                    </a>
                    {% if is_granted('ROLE_ADMIN') %}
                        <a class="btn btn-primary" href="{{ path('admin_classrooms_edit', {id: classroom.id}) }}">
                            <i class="fa fa-edit"></i>
                      
                        </a>
                
                    <a target="_blank" class="btn btn-file" id="recap_seq"  data-toggle="modal" data-target="#form_modal_courses" data-action="{{ path('admin_classrooms_recapitulatif_seq', {'id':classroom.id}) }}">
                        <i class="fa fa-file-pdf-o"></i>
                        Recap. Seq
                                
                    </a>
                    <a target="_blank" class="btn btn-warning" href="{{ path('admin_classrooms_reportcards_seq', {id: classroom.id}) }}">
                        <i class="fa fa-file"></i>
                        Bull Seq
                                                                                                                                                                                                                    
                    </a>

                    <a  target="_blank" class="btn btn-file" data-toggle="modal" id="bull_trim" data-target="#form_modal_reportcard_params" data-action="{{ path('admin_classrooms_reportcards_trim_2024', {'id':classroom.id}) }}">
                        <i class="fa fa-file"></i>
                        Bull Trim
                    </a>
                     <a target="_blank" class="btn btn-outline-info"  id="bull_ann" data-toggle="modal" data-target="#form_modal_reportcard_params" data-action="{{ path('admin_class_reportcards_year_2024', {'id': classroom.id}) }}" >
                         <i class="fa fa-file-pdf-o"></i>
                        Bull Ann 
                    </a>
                    <a target="_blank" class="btn btn-outline-warning"  id="recap_trim" data-toggle="modal" data-target="#form_modal_courses" data-action="{{ path('admin_classrooms_recapitulatif_trim', {id: classroom.id}) }}" >
                        <i class="fa fa-file-pdf-o"></i>
                        Recap Trim
                                
                    </a>
                     <a target="_blank" class="btn btn-outline-success"  id="recap_trim_excel" data-toggle="modal" data-target="#form_modal_courses" data-action="{{ path('admin_classrooms_recapitulatif_ann_excel', {id: classroom.id}) }}" >
                        <i class="fa fa-file-excel-o"></i>
                        Recap Ann
                                
                    </a>
                    <a  target="_blank" class="btn btn-file" href="{{ path('admin_class_reportcards_apc_year', {id: classroom.id}) }}">
                        <i class="fa fa-file"></i>
                        Bull Ann V1               
                    </a>
                    
                  
                    
                        <button class="btn btn-danger" type="submit">
                            <i class="fa fa-trash-o"></i>
                         
                        </button>
                    {% endif %}
                </div>

                <div class="card-header text-center">
                    <h2>
                        Liste des élèves incrits dans la classe 
                                                                                                                                                                                            
                                                                                                                                                                    
                                                                                                                                            
                                                                                                                    
                                                                                            
                                                                    
                                            
                    </h2>
                </div>
                <table class="table table-striped table-hover table-bordered records_list center">
                    <thead>
                        <tr>
                            <th scope="col">
                                Matricule
                                                                                                                                                                                                                                                            
                                                                                                                                                                                                                            
                                                                                                                                                                                            
                                                                                                                                                            
                                                                                                                            
                                                                                            
                                                            
                            </th>
                            <th scope="col">
                                Nom
                                                                                                                                                                                                                                                            
                                                                                                                                                                                                                            
                                                                                                                                                                                            
                                                                                                                                                            
                                                                                                                            
                                                                                            
                                                            
                            </th>
                            <th scope="col">
                                Prénom
                                                                                                                                                                                                                                                            
                                                                                                                                                                                                                            
                                                                                                                                                                                            
                                                                                                                                                            
                                                                                                                            
                                                                                            
                                                            
                            </th>
                            <th scope="col">
                                Photo
                                                                                                                                                                                                                                                            
                                                                                                                                                                                                                            
                                                                                                                                                                                            
                                                                                                                                                            
                                                                                                                            
                                                                                            
                                                            
                            </th>
                             <th scope="col">
                                Action
                                                                                                                                                                                                                                                            
                                                                                                                                                                                                                            
                                                                                                                                                                                            
                                                                                                                                                            
                                                                                                                            
                                                                                            
                                                            
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                        {% set effectif =0 %}
                        {% for std in studentEnrolled %}
                            <tr>
                                <td>
                                    <a href="{{ path('admin_students_show', {id: std.id}) }}">
                                        {{ std.matricule }}
                                    </a>
                                </td>
                                <td>
                                    {{ std.lastname }}
                                </td>
                                <td>
                                    {{ std.firstname }}
                                </td>
                                <td>
                                    {{ fileExists[std.id] }}
                                </td>
                                <td>
                                    {% if is_granted('ROLE_ADMIN') %}
                                        <a class="btn btn-outline-danger" href="{{ path('admin_students_unregister', {id: std.id, room_id:classroom.id}) }}">
                                                <i class="fa fa-ban"></i>
                                        </a>
                                        <a class="btn btn-outline-warning" href="{{ path('admin_students_edit', {id: std.id}) }}">
                                        <i class="fa fa-pencil-square-o" aria-hidden="true"></i>                                 
                                        </a>
                                    {% endif %}
                                    
                                </td>
                                {% set effectif = effectif + 1 %}

                            </tr>

                        {% endfor %}
                        <tr>
                            <td class="center" colspan="2">
                                Effectif
                                                                                                                                                                                                                                                            
                                                                                                                                                                                                                            
                                                                                                                                                                                            
                                                                                                                                                            
                                                                                                                            
                                                                                            
                                                            
                            </td>
                            <td>
                                {{ effectif }}
                            </td>
                        </tr>
                    </tbody>
                </table>

                <div class="card-header text-center">
                    <h2>
                        Matières programmées dans la classe 
                                                                                                                                                                                            
                                                                                                                                                                    
                                                                                                                                            
                                                                                                                    
                                                                                            
                                                                    
                                            
                    </h2>
                </div>
                <table class="table table-striped table-hover table-bordered records_list center">
                    <thead>
                        <tr>

                            <th scope="col">
                                Module 
                                                                                                                                                                                                                                                            
                                                                                                                                                                                                                            
                                                                                                                                                                                            
                                                                                                                                                            
                                                                                                                            
                                                                                            
                                                            
                            </th>
                            <th scope="col">
                                Code 
                                                                                                                                                                                                                                                            
                                                                                                                                                                                                                            
                                                                                                                                                                                            
                                                                                                                                                            
                                                                                                                            
                                                                                            
                                                            
                            </th>
                            <th scope="col">
                                Intitulé 
                                                                                                                                                                                                                                                            
                                                                                                                                                                                                                            
                                                                                                                                                                                            
                                                                                                                                                            
                                                                                                                            
                                                                                            
                                                            
                            </th>
                            <th scope="col">
                                Coef 
                                                                                                                                                                                                                                                            
                                                                                                                                                                                                                            
                                                                                                                                                                                            
                                                                                                                                                            
                                                                                                                            
                                                                                            
                                                            
                            </th>
                            <th scope="col">
                                Enseignant 
                                                                                                                                                                                                                                                            
                                                                                                                                                                                                                            
                                                                                                                                                                                            
                                                                                                                                                            
                                                                                                                            
                                                                                            
                                                            
                            </th>

                        </tr>
                    </thead>
                    <tbody>

                        {% set totalCoef =0 %}
                        {% for module in modules %}
                            <tr>

                                {% for course in module.courses %}
                                    <tr>
                                        <td>
                                            {{ module.name }}
                                        </td>
                                        <td>
                                            <a href="{{ path('admin_courses_show', {id: course.id}) }}">
                                                {{ course.code }}
                                            </a>
                                        </td>
                                        <td>

                                            {{ course.wording }}
                                        </td>
                                        <td>
                                            {{ course.coefficient }}
                                        </td>
                                        <td>

                                            {% if attributions[course.id] is defined %}
                                                {% if is_granted('ROLE_ADMIN') %}
                                                    <a href="{{ path('admin_attributions_edit', {id: attributions[course.id].id}) }}">
                                                        {{attributions[course.id].teacher.fullName}}
                                                    </a>
                                                {% else %}
                                                    {{attributions[course.id].teacher.fullName}}
                                                {% endif %}
                                            {% else %}
                                            {% if is_granted('ROLE_ADMIN') %}
                                                <a href="{{ path('admin_attributions_new') }}">
                                                    Pas encore attribue
                                                </a>
                                             {% endif %}
                                            {% endif %}

                                        </td>
                                        {% set totalCoef = totalCoef+course.coefficient %}
                                    </tr>
                                {% endfor %}

                            </tr>
                            <tr>
                                <td class="center" colspan="3">
                                    total cumul coef 
                                                                                                                                                                                                                                                                                            
                                                                                                                                                                                                                                                        
                                                                                                                                                                                                                    
                                                                                                                                                                                
                                                                                                                                            
                                                                                                        
                                                                    
                                </td>
                                <td>
                                    {{ totalCoef }}
                                </td>
                            </tr>
                        {% endfor %}

                    </tbody>
                </table>
            </article>
            <section id="graphs">
                <article class="p-3">
                    <canvas id="schoolPerformanceGraph" width="700" height="250"></canvas>
                </article>
                {% if classroom.apc %}
                  <article class="p-3">
                    <canvas id="officialExamsGraph" width="200" height="220" ></canvas>
                </article>
                {% endif %}
            </section>
        </div>
    </div>
<!-- Modal pour le choix de cours qui vont figurer dans le recaputulatif sequentiel -->
<div class="modal fade" id="form_modal_courses" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-header border-bottom-0">
        <h5 class="modal-title" id="exampleModalLabel">Choisir les cours a qui doivent figurer dans le recapitulatif</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <!-- href=" -->
      <form action="#" method="post">
        <div class="modal-body">
          <div class="form-group">
             {% for module in modules %}
                {% for course in module.courses %}
                <li class="list-group-item">
                        <input class="form-check-input me-1" type="checkbox" checked name="selected_courses[]" value={{course.id}} >
                        {{course.wording}}
                </li>
                {% endfor %}
             {% endfor %}
          </div>
        </div>
      
        <div class="modal-footer border-top-0 d-flex justify-content-center">
          <button type="submit" class="btn btn-success">Submit</button>
        </div>
      </form>
    </div>
  </div>
</div>
<!-- Modal pour le parametrage de la presentation des bulletins. -->
<div class="modal fade" id="form_modal_reportcard_params" tabindex="-1" role="dialog" aria-labelledby="exampleModalRange" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-header border-bottom-0">
        <h5 class="modal-title" id="exampleModalLabel">Reajuster les  parametres de production des bulletins</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <form method="post">
        <div class="modal-body">
           <div class="form-group">
            <label for="header_font_size">Taille de des caracteres dans l entete</label>
            <input type="range" class="form-control" name="header_font_size" id="header_font_size" min="1" max="1.6" step="0.01">
          </div>
          <div class="form-group">
            <label for="line_height">Hauteur des lignes dans le tableau</label>
            <input type="range" class="form-control" name="line_height" id="line_height" min="0.5" max="1.5" step="0.01">
          </div>
          <div class="form-check">
            <input class="form-check-input" type="checkbox"  id="copyright"  name="copyright">
            <label class="form-check-label" for="copyright">
                Ajout du copyright en pied du bulletin?
            </label>
         </div>
         <div class="form-check">
            <input class="form-check-input" type="checkbox"  id="reverse"  name="reverse">
            <label class="form-check-label" for="reverse">
                Sens inverse
            </label>
         </div>
        </div>
      
        <div class="modal-footer border-top-0 d-flex justify-content-center">
          <button type="submit" class="btn btn-success">Submit</button>
        </div>
      </form>
    </div>
  </div>
</div>
{% endblock %}
{% block javascripts %}
    {{ parent() }}
     <script type="text/javascript">
        // Attendre que le DOM soit complètement chargé
        $(document).ready(function() {
            // Quand le modal est ouvert
            $('#form_modal_courses').on('show.bs.modal', function(event) {
            // Récupérer l'élément qui a déclenché l'ouverture du modal
            var button = $(event.relatedTarget);
            
            // Récupérer l'URL dynamique depuis l'attribut "data-action"
            var actionUrl = button.data('action');
            
            // Mettre à jour l'attribut "action" du formulaire
            $('#form_modal_courses form').attr('action', actionUrl);
            });
        });
        </script>
    <script type="text/javascript">
       
         $(document).ready(function () {
            // Quand on clique sur un lien qui ouvre le modal
            $('[data-toggle="modal"]').on('click', function () {
            // Récupère l'URL depuis data-action
            var actionUrl = $(this).data('action');
            console.log(actionUrl);
            // Met à jour l'attribut action du formulaire du modal
            $('#form_modal_reportcard_params form').attr('action', actionUrl);
            });
        });
    </script>

    <script type="text/javascript">
                        const schoolPerformanceGraph = $("#schoolPerformanceGraph");                       
                        const datasets = [];
                        //Generate a random color
                        const randomRgbColor = () => {
                            let r = Math.floor(Math.random() * 256); // Random between 0-255
                            let g = Math.floor(Math.random() * 256); // Random between 0-255
                            let b = Math.floor(Math.random() * 256); // Random between 0-255
                            return 'rgb(' + r + ',' + g + ',' + b + ')';
                        };

                       
                       
                                {% if session1 is defined %}
                                    datasets.push( {
                                        label: "Session 1",
                                        data : {{session1|raw}},
                                        fill : false,
                                        backgroundColor: randomRgbColor()
                                    } )
                                {% endif %}
                                {% if session2 is defined %}
                                    datasets.push( {
                                        label: "Session 2",
                                        data : {{session2|raw}},
                                        fill : false,
                                        backgroundColor: randomRgbColor()
                                    } )
                                {% endif %}
                                 {% if session3 is defined %}
                                    datasets.push( {
                                        label: "Session 3",
                                        data : {{session3|raw}},
                                        fill : false,
                                        backgroundColor: randomRgbColor()
                                    } )
                                {% endif %}
                                 {% if session4 is defined %}
                                    datasets.push( {
                                        label: "Session 4",
                                        data : {{session4|raw}},
                                        fill : false,
                                        backgroundColor: randomRgbColor()
                                    } )
                                {% endif %}
                                 {% if session5 is defined %}
                                    datasets.push( {
                                        label: "Session 5",
                                        data : {{session5|raw}},
                                        fill : false,
                                        backgroundColor: randomRgbColor()
                                    } )
                                {% endif %}
                                 {% if session6 is defined %}
                                    datasets.push( {
                                        label: "Session 6",
                                        data : {{session6|raw}},
                                        fill : false,
                                        backgroundColor: randomRgbColor()
                                    } )
                                {% endif %}
                           
                            
                           
                            
                        
                             
                       

                       let graph = new Chart(schoolPerformanceGraph, {
                            type:"bar",
                            data : {
                                labels: {{ cours|raw }},
                                datasets: datasets,
                            }, 
                             options: {
                                plugins: {
                                    title: {
                                        display: true,
                                        text: 'Performances generales annuelles ',
                                        font: {
                                            size: 24,
                                            style: 'bold',
                                            family: 'Helvetica Neue',
                                        },
                                        position: 'bottom',
                                        
                                    }
                                }
                            }
                        });
       
             
                                
                                    
    
    // Get the chart element for student category
    let studentCategoryChartElement = document.querySelector("#studentCategoryChart");
    // Create the chart for student category
    let studentCategoryChart = new Chart(studentCategoryChartElement, {
        type: "pie",
        data: {
            labels: ["Passed", "Failed"],
            datasets: [{
                data: [/* Add data here for the number of students passed and failed */],
                backgroundColor: ["green", "red"]
            }]
        }
    });

    // Get the chart element for mention category
    let officialExamsGraph = document.querySelector("#officialExamsGraph");
    // Create the chart for mention category
    const colors = [];
    const mentionCountCategories = {{mentionCountCategories}};
    mentionCountCategories.map(cat => {
        colors.push(randomRgbColor());
    })
    let officialExamsChart = new Chart(officialExamsGraph, {
        type: "pie",
        data: {
            labels:  {{ mentionCategories|raw }},
            datasets: [{
                data: {{mentionCountCategories|raw}},
                backgroundColor: colors
            }]
        }, 
         options: {
                                plugins: {
                                    title: {
                                        display: true,
                                        text: 'Resultats aux examens officiels ',
                                        font: {
                                            size: 24,
                                            style: 'bold',
                                            family: 'Helvetica Neue',
                                        },
                                        position: 'bottom',
                                        
                                    }
                                }
                            }
    });
</script>



{% endblock %}