<script>
    //Fonction pour le panel tab
    function openContent(evt, contentId) {

        var i, tabcontent, tablinks;


        tabcontent = document.getElementsByClassName("panel-block");

        for (i = 0; i < tabcontent.length; i++) {
            tabcontent[i].style.display = "none";
            //console.log(tabcontent[i])
        }


        tablinks = document.getElementsByClassName("tab");
        for (i = 0; i < tablinks.length; i++) {
            tablinks[i].className = tablinks[i].className.replace("is-active", "");
            //console.log(tablinks[i])
        }


        document.getElementById(contentId).style.display = "flex";
        if (evt == null) {
            document.getElementById('default').className += " is-active";
        } else {
            evt.currentTarget.className += " is-active";
        }

    }
    openContent(event, 'info');

    //Hide classe
    $('#niveau_prof_id').change(() => {
        if ($('#niveau_prof_id option:selected').val() == 'Primaire') {
            $('.classe_prof_primaire').removeClass('is-hidden');
            if (!$('.classe_prof_secondaire').hasClass('is-hidden')) {
                $('.classe_prof_secondaire').addClass('is-hidden');
            }
        } else {
            $('.classe_prof_secondaire').removeClass('is-hidden');
            if (!$('.classe_prof_primaire').hasClass('is-hidden')) {
                $('.classe_prof_primaire').addClass('is-hidden');
            }
        }
    });

    if ('{{ $professeur->niveau }}' == 'Primaire') {
        $('.classe_prof_primaire').removeClass('is-hidden');
        if (!$('.classe_prof_secondaire').hasClass('is-hidden')) {
            $('.classe_prof_secondaire').addClass('is-hidden');
        }
    } else {
        $('.classe_prof_secondaire').removeClass('is-hidden');
        if (!$('.classe_prof_primaire').hasClass('is-hidden')) {
            $('.classe_prof_primaire').addClass('is-hidden');
        }
    }

    //Hide matiere
    $('#niveau_prof_id').change(() => {
        if ($('#niveau_prof_id option:selected').val() == 'Primaire') {
            $('.matiere_prof_primaire').removeClass('is-hidden');
            if (!$('.matiere_prof_secondaire').hasClass('is-hidden')) {
                $('.matiere_prof_secondaire').addClass('is-hidden');
            }
        } else {
            $('.matiere_prof_secondaire').removeClass('is-hidden');
            if (!$('.matiere_prof_primaire').hasClass('is-hidden')) {
                $('.matiere_prof_primaire').addClass('is-hidden');
            }
        }
    });

    if ('{{ $professeur->niveau }}' == 'Primaire') {
        $('.matiere_prof_primaire').removeClass('is-hidden');
        if (!$('.matiere_prof_secondaire').hasClass('is-hidden')) {
            $('.matiere_prof_secondaire').addClass('is-hidden');
        }
    } else {
        $('.matiere_prof_secondaire').removeClass('is-hidden');
        if (!$('.matiere_prof_primaire').hasClass('is-hidden')) {
            $('.matiere_prof_primaire').addClass('is-hidden');
        }
    }

    let lesClassesProf = [];
    let lesMatieresProf = [];
</script>

@foreach ($professeur->classes as $uneClasseProf)
    <script>
        lesClassesProf.push('{{ $uneClasseProf->id }}')
    </script>
@endforeach
@foreach ($professeur->matieres as $uneMatiereProf)
    <script>
        lesMatieresProf.push('{{ $uneMatiereProf->id }}')
    </script>
@endforeach

<script>
    lesClassesProf.forEach(uneClasseProf => {
        $('.classe_prof[value=' + uneClasseProf + ']').prop('checked', true);
    });

    lesMatieresProf.forEach(uneMatiereProf => {
        $('.matiere_prof[value=' + uneMatiereProf + ']').prop('checked', true);
    });
    //Add classes
    let lesClasses = lesClassesProf;
    $(document).ready(function() {
        $('.classe_prof').change(function() {
            if ($(this).prop("checked") == true) {
                lesClasses.push($(this).val());
            } else if ($(this).prop("checked") == false) {
                lesClasses = lesClasses.filter(uneClasse => uneClasse !== $(this).val())
            }
        });
    });

    //Add matieres
    let lesMatieres = lesMatieresProf;
    $(document).ready(function() {
        $('.matiere_prof').change(function() {
            if ($(this).prop("checked") == true) {
                lesMatieres.push($(this).val());
            } else if ($(this).prop("checked") == false) {
                lesMatieres = lesMatieres.filter(uneMatiere => uneMatiere !== $(this).val())
            }
        });
    });

    //Fonction d'activation des champs au clic sur le bouton modifier
    function modifier(id) {
        $('.input').prop('disabled', false);
        $('select').prop('disabled', false);
        $('#btn_modif').prop('disabled', true);
        $('#btn_enr').prop('disabled', false);
        $('.matiere_prof').prop('disabled', false);
        $('.classe_prof').prop('disabled', false);

    }

    //JS pour la modification et l'enregistrement des infos du prof
    $('#btn_enr').on('click', function() {
        $('#info_prof').validate({
            rules: {
                nom_prof: {
                    required: true,
                },
                prenom_prof: {
                    required: true,
                },
                date_naissance_prof: {
                    required: true,
                },
                lieu_naissance_prof: {
                    required: true,
                },
                adresse_prof: {
                    required: true,
                },
                telephone_prof: {
                    required: true,
                },
                email_prof: {
                    required: false,
                },
                niveau_prof: {
                    required: true,
                },
                salaire_prof: {
                    required: true,
                },
            },
            messages: {
                nom_prof: {
                    required: "Le nom est obligatoire!",
                },
                prenom_prof: {
                    required: "Le prénom est obligatoire!",
                },
                date_naissance_prof: {
                    required: "La date de naissance est obligatoire!",
                },
                lieu_naissance_prof: {
                    required: "Le lieu de naissance est obligatoire!",
                },
                adresse_prof: {
                    required: "L'adresse est obligatoire!",
                },
                telephone_prof: {
                    required: "Le numéro de téléphone est obligatoire!",
                },
                email_prof: {
                    required: "L\'email' est obligatoire!",
                },
                niveau_prof: {
                    required: "Le niveau est obligatoire!",
                },
                salaire_prof: {
                    required: "Le salaire est obligatoire!",
                },
            },
            submitHandler: function() {
                $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    }
                });
                $.ajax({
                    url: "/accueil/professeurs/detailsProf/{{ request('prof_slug') }}/modifier",
                    type: "POST",
                    dataType: 'json',
                    beforeSend: function() {
                        $('#loader').removeClass('is-hidden')
                        $('*').css('pointer-events', 'none')
                    },
                    complete: function() { // Set our complete callback, adding the .hidden class and hiding the spinner.
                        $('#loader').addClass('is-hidden')
                        $('*').css('pointer-events', 'all')
                    },
                    data: {
                        nom_prof: $('#nom_prof_id').val(),
                        prenom_prof: $('#prenom_prof_id').val(),
                        date_naissance_prof: $('#date_naissance_prof_id').val(),
                        lieu_naissance_prof: $('#lieu_naissance_prof_id').val(),
                        adresse_prof: $('#adresse_prof_id').val(),
                        telephone_prof: $('#telephone_prof_id').val(),
                        email_prof: $('#email_prof_id').val(),
                        niveau_prof: $('#niveau_prof_id').val(),
                        salaire_prof: Number($('#salaire_prof_id').val().replace(/\s/g,
                            '')),
                        lesClasses: lesClasses,
                        lesMatieres: lesMatieres,
                    },
                    success: function(response) {
                        if (response == true) {
                            window.location.replace(
                                '/accueil/professeurs/detailsProf/{{ request('prof_slug') }}'
                            );
                        }
                    },
                    error: function(response) {
                        console.log(response);
                    }
                });
            }
        });
    });

    //JS pour la suppression d'un professeur
    $('#btn_supp').on('click', function() {
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });
        $.ajax({
            url: "/accueil/professeurs/detailsProf/{{ request('prof_slug') }}/supprimer",
            type: "POST",
            dataType: 'json',
            beforeSend: function() {
                $('#loader').removeClass('is-hidden')
                $('*').css('pointer-events', 'none')
            },
            complete: function () { // Set our complete callback, adding the .hidden class and hiding the spinner.
                $('#loader').addClass('is-hidden')
                $('*').css('pointer-events', 'all')
            },
            data: {
                nom_prof: $('#nom_prof_id').val(),
                prenom_prof: $('#prenom_prof_id').val(),
                date_naissance_prof: $('#date_naissance_prof_id').val(),
                lieu_naissance_prof: $('#lieu_naissance_prof_id').val(),
                adresse_prof: $('#adresse_prof_id').val(),
                telephone_prof: $('#telephone_prof_id').val(),
                email_prof: $('#email_prof_id').val(),
                niveau_prof: $('#niveau_prof_id').val(),
                salaire_prof: Number($('#salaire_prof_id').val().replace(/\s/g, '')),
            },
            success: function(response) {
                if (response == true) {
                    window.location.replace(
                        '/accueil/professeurs'
                    );
                }
            },
            error: function(response) {
                console.log(response);
            }
        });
    });

    var cleave = new Cleave('#telephone_prof_id', {
        phone: true,
        phoneRegionCode: 'SN'
    });

    var cleave = new Cleave('#salaire_prof_id', {
        delimiter: ' ',
        numeral: true,
        numeralThousandsGroupStyle: 'thousand'
    });

    //Reinitialisation password
    let compte_slug = "";

    function get_compte_slug(slug) {
        compte_slug = slug;
    }

    $('#btn_reinPassword').on('click', function() {

        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });
        $.ajax({
            url: "/accueil/comptes/compte/" + compte_slug + "/reinpassword",
            type: "POST",
            dataType: 'json',
            beforeSend: function() {
                $('#loader').removeClass('is-hidden')
                $('*').css('pointer-events', 'none')
            },
            complete: function () { // Set our complete callback, adding the .hidden class and hiding the spinner.
                $('#loader').addClass('is-hidden')
                $('*').css('pointer-events', 'all')
            },
            data: {

            },
            success: function(response) {
                if (response == true) {
                    window.location.replace(
                        '/accueil/comptes/compte/' + compte_slug,
                    );
                }
            },
            error: function(response) {
                console.log(response);
            }
        });
    });
</script>
