alumnos/js/secciones/horarios.js

$activo = false;
let tab = 0;
let id = 0;
let datalist_click = [false, false, false, false]; //Grupos, Profesores, Planes, Semestres

/***** GRUPOS *****/
$('#dlGrupo ul li').mousedown({index: 0},mousedownDataList);
$('#dlGrupo ul li').mouseup({elem: 'Grupo', index: 0},mouseupDataList);
$('#inputGrupo').click({elem: 'Grupo'},clickDataList);
$('#inputGrupo').blur({elem: 'Grupo', index: 0},blurDataList);
$('#inputGrupo').keyup({elem: 'Grupo'},inputKeyUp);
$('#iconGrupo').mousedown({index: 0},mousedownDataList);
$('#iconGrupo').mouseup({elem: 'Grupo', index: 0},mouseupDataList);
$('#iconGrupo').click({elem: 'Grupo'},limpiaInputDL);
$('#dlGrupo ul li').click(function (){
    $('#dlGrupo span').removeClass('ing-borrar');
    $('#inputGrupo').val($(this).text());
    $(this).parent('ul').hide();
    id = $(this).data('id');
    tab = 1;
    cargaTabla();
});

/***** PROFESORES *****/
$('#dlProfesor ul li').mousedown({index: 1},mousedownDataList);
$('#dlProfesor ul li').mouseup({elem: 'Profesor', index: 1},mouseupDataList);
$('#inputProfesor').click({elem: 'Profesor'},clickDataList);
$('#inputProfesor').blur({elem: 'Profesor', index: 1},blurDataList);
$('#inputProfesor').keyup({elem: 'Profesor'},inputKeyUp);
$('#iconProfesor').mousedown({index: 1},mousedownDataList);
$('#iconProfesor').mouseup({elem: 'Profesor', index: 1},mouseupDataList);
$('#iconProfesor').click({elem: 'Profesor'},limpiaInputDL);
$('#dlProfesor ul li').click(function (){
    $('#dlProfesor span').removeClass('ing-borrar');
    $('#inputProfesor').val($(this).text());
    $(this).parent('ul').hide();
    id = $(this).data('id');
    tab = 2;
    cargaTabla();
});
$('#dlProfesor ul li').mousedown({index: 1},mousedownDataList);
$('#dlProfesor ul li').mouseup({elem: 'Profesor', index: 1},mouseupDataList);
$('#inputProfesor').click({elem: 'Profesor'},clickDataList);
$('#inputProfesor').blur({elem: 'Profesor', index: 1},blurDataList);
$('#inputProfesor').keyup({elem: 'Profesor'},inputKeyUp);
$('#iconProfesor').mousedown({index: 1},mousedownDataList);
$('#iconProfesor').mouseup({elem: 'Profesor', index: 1},mouseupDataList);
$('#iconProfesor').click({elem: 'Profesor'},limpiaInputDL);
$('#dlProfesor ul li').click(function (){
    $('#dlProfesor span').removeClass('ing-borrar');
    $('#inputProfesor').val($(this).text());
    $(this).parent('ul').hide();
    id = $(this).data('id');
    tab = 2;
    cargaTabla();
});
$('#dlProfesor ul li').mousedown({index: 1},mousedownDataList);
$('#dlProfesor ul li').mouseup({elem: 'Profesor', index: 1},mouseupDataList);
$('#inputProfesor').click({elem: 'Profesor'},clickDataList);
$('#inputProfesor').blur({elem: 'Profesor', index: 1},blurDataList);
$('#inputProfesor').keyup({elem: 'Profesor'},inputKeyUp);
$('#iconProfesor').mousedown({index: 1},mousedownDataList);
$('#iconProfesor').mouseup({elem: 'Profesor', index: 1},mouseupDataList);
$('#iconProfesor').click({elem: 'Profesor'},limpiaInputDL);
$('#dlProfesor ul li').click(function (){
    $('#dlProfesor span').removeClass('ing-borrar');
    $('#inputProfesor').val($(this).text());
    $(this).parent('ul').hide();
    id = $(this).data('id');
    tab = 2;
    cargaTabla();
});

/***** EXTRAORDINARIOS *****/
$('#dlPlan ul li').mousedown({index: 2},mousedownDataList);
$('#dlPlan ul li').mouseup({elem: 'Plan', index: 2},mouseupDataList);
$('#inputPlan').click({elem: 'Plan'},clickDataList);
$('#inputPlan').blur({elem: 'Plan', index: 2},blurDataList);
$('#inputPlan').keyup({elem: 'Plan'},inputKeyUp);
$('#iconPlan').mousedown({index: 1},mousedownDataList);
$('#iconPlan').mouseup({elem: 'Plan', index: 2},mouseupDataList);
$('#iconPlan').click({elem: 'Plan'},limpiaInputDL);
$('#dlPlan ul li').click({elem: 'Plan'},itemDataList);
$('#dlSemestre ul li').mousedown({index: 3},mousedownDataList);
$('#dlSemestre ul li').mouseup({elem: 'Semestre', index: 3},mouseupDataList);
$('#inputSemestre').click({elem: 'Semestre'},clickDataList);
$('#inputSemestre').blur({elem: 'Semestre', index: 3},blurDataList);
$('#inputSemestre').keyup({elem: 'Semestre'},inputKeyUp);
$('#iconSemestre').mousedown({index: 3},mousedownDataList);
$('#iconSemestre').mouseup({elem: 'Semestre', index: 3},mouseupDataList);
$('#iconSemestre').click({elem: 'Semestre'},limpiaInputDL);
$('#dlSemestre ul li').click({elem: 'Semestre'}, itemDataList);
$('#btnExtras').click(function(){
    $.ajax({
        url:  'action/horarios_action.php',
        type: 'POST', 
        dataType: 'json',
        data: { id: 0, tipo: 3, periodo: '', plan: $('#dlPlan').data('id'), semestre: $('#dlSemestre').data('id') },
        success: function(result) {
            $('#tablaExtras').html(result['html']);
        },
        error: function(jqXHR, textStatus, errorThrown ){
            $('#tablaExtras').html(`<div class="marco">
                <div class='msgAviso d-flex flex-row justify-content-between align-items-stretch mt-4'>
                    <div class='iconAviso bg-warning d-flex justify-content-center align-items-center'><i class='display-3 ing-importante'></i></div>
                    <div class='txtAviso flex-grow-1 d-flex flex-column justify-content-center align-items-center'>
                        <div class='display-5 indivisa-text-black mb-3'>¡Lo sentimos!</div>
                        <div class='text-center'>Se presentó un error inesperado en el sistema.<br />Por favor inténtalo más tarde.</div>
                    </div>
                </div>
            </div>`);
        }
    });
});

/***** GENERALES *****/
$('.nav-tabs.tabGral button').on('show.bs.tab', function(event){
    $($(this).data('target')).find('input.busca').val('');
    $($(this).data('target')).find('.tabla').html('');
    $($(this).data('target')).find('.btns').addClass('oculto');
});
function cargaTabla(){
    let tabla = '';
    $.ajax({
        url:  'action/horarios_action.php',
        type: 'POST', 
        dataType: 'json',
        data: { id: id, tipo: tab, periodo: $('#periodo').val() },
        success: function(result) {
            switch(tab){
                case 1: tabla = 'Grupo'; break;
                case 2: tabla = 'Profesor'; break;    
            }
            $('#tabla' + tabla).html(result['html']);
            if (result['tabla']){
                if (!$activo) {
                    $('#tabla' + tabla).siblings('.btns').removeClass('oculto');
                    ajustaColumnas('#tabla' + tabla);
                } else
                    $('#tabla' + tabla).siblings('.btns').addClass('oculto');
            } else {
                if (!$('#tabla' + tabla).siblings('.btns').hasClass('oculto'))
                    $('#tabla' + tabla).siblings('.btns').addClass('oculto');
            }
        },
        error: function(jqXHR, textStatus, errorThrown ){
            $('#tabla').html(`<div class="marco">
                <div class='msgAviso d-flex flex-row justify-content-between align-items-stretch mt-4'>
                    <div class='iconAviso bg-warning d-flex justify-content-center align-items-center'><i class='display-3 ing-importante'></i></div>
                    <div class='txtAviso flex-grow-1 d-flex flex-column justify-content-center align-items-center'>
                        <div class='display-5 indivisa-text-black mb-3'>¡Lo sentimos!</div>
                        <div class='text-center'>Se presentó un error inesperado en el sistema.<br />Por favor inténtalo más tarde.</div>
                    </div>
                </div>
            </div>`);
        }
    });
}
$('.prev').click(function(){
    if (!$(this).hasClass('inactivo')){
        $(this).siblings('.next').removeClass('inactivo');
        if (screen375.matches){
            if ((columnas - 1) >= min){
                $('.dia' + columnas).addClass('oculto');
                columnas--;
                $('.dia' + columnas).removeClass('oculto');
                if(columnas == min)
                    $(this).addClass('inactivo');
            }
        } else {
            if (screen576.matches){
                if ((columnas[0] - 1) >= min){
                    $('.dia' + columnas[1]).addClass('oculto');
                    columnas[1] = columnas[0];
                    columnas[0]--;
                    $('.dia' + columnas[0]).removeClass('oculto');
                    if(columnas[0] == min)
                        $(this).addClass('inactivo');
                }
            } else {
                if (screen768.matches){
                    if ((columnas[0] - 1) >= min){
                        $('.dia' + columnas[2]).addClass('oculto');
                        columnas[2] = columnas[1];
                        columnas[1] = columnas[0];
                        columnas[0]--;
                        $('.dia' + columnas[0]).removeClass('oculto');
                        if(columnas[0] == min)
                            $(this).addClass('inactivo');
                    }
                }            
            }
        }
    }
});
$('.next').click(function(){
    if (!$(this).hasClass('inactivo')){
        $(this).siblings('.prev').removeClass('inactivo');
        if (screen375.matches){
            if ((columnas + 1) <= max){
                $('.dia' + columnas).addClass('oculto');
                columnas++;
                $('.dia' + columnas).removeClass('oculto');
                if(columnas == max)
                    $(this).addClass('inactivo');
            }
        } else {
            if (screen576.matches){
                if ((columnas[1] + 1) <= max){
                    $('.dia' + columnas[0]).addClass('oculto');
                    columnas[0] = columnas[1];
                    columnas[1]++;
                    $('.dia' + columnas[1]).removeClass('oculto');
                    if(columnas[1] == max)
                        $(this).addClass('inactivo');
                }
            } else {
                if (screen768.matches){
                    if ((columnas[2] + 1) <= max){
                        $('.dia' + columnas[0]).addClass('oculto');
                        columnas[0] = columnas[1];
                        columnas[1] = columnas[2];
                        columnas[2]++;
                        $('.dia' + columnas[2]).removeClass('oculto');
                        if(columnas[2] == max)
                            $(this).addClass('inactivo');
                    }
                }            
            }
        }
    }
});

/***** RESOLUCIONES *****/
let screen768 = window.matchMedia("(max-width: 768px)");
let screen576 = window.matchMedia("(max-width: 576px)");
let screen375 = window.matchMedia("(max-width: 375px)");
let min = 1;
let max = 6;
let columnas;
function ajustaColumnas(tabla) {
    if (!$(tabla).siblings('.prev').hasClass('inactivo')){
        $(tabla).siblings('.prev').addClass('inactivo');
        $(tabla).siblings('.next').removeClass('inactivo');
    }
    if (screen375.matches){
        muestraHorario(1);
        columnas = 1;
    } else {
        if (screen576.matches){
            muestraHorario(2);
            columnas = [1,2];
        } else {
            if (screen768.matches){
                muestraHorario(3);
                columnas = [1,2,3];
            } else {
                muestraHorario(0);
            }            
        }
    }
}
function muestraHorario(cols){
    switch(cols){
        case 1:
            $('.dia2').addClass('oculto');
            $('.dia3').addClass('oculto');
            $('.dia4').addClass('oculto');
            $('.dia5').addClass('oculto');
            $('.dia6').addClass('oculto');
            break;
        case 2:
            $('.dia3').addClass('oculto');
            $('.dia4').addClass('oculto');
            $('.dia5').addClass('oculto');
            $('.dia6').addClass('oculto');
            break;
        case 3:
            $('.dia4').addClass('oculto');
            $('.dia5').addClass('oculto');
            $('.dia6').addClass('oculto');
            break;
    }
}
$(window).on( "orientationchange", function(event) {
    cargaTabla();
});