const navText = [
    '<svg width="27" height="22" viewBox="0 0 27 22" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10.8299 0.527207C10.127 -0.175735 8.98753 -0.175736 8.28459 0.527207L1.40568 7.40611C-0.468533 9.28057 -0.468533 12.3192 1.40568 14.1936L8.28459 21.0725C8.98753 21.7755 10.127 21.7755 10.8299 21.0725C11.5328 20.3696 11.5328 19.2302 10.8299 18.5272L4.90256 12.5999L24.5572 12.5999C25.5514 12.5999 26.3572 11.794 26.3572 10.7999C26.3572 9.80575 25.5514 8.99986 24.5572 8.99986L4.90256 8.99986L10.8299 3.07252C11.5328 2.36958 11.5328 1.23015 10.8299 0.527207Z" fill="#0000FF"/></svg>',
    '<svg width="27" height="22" viewBox="0 0 27 22" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15.5273 0.527209C16.2303 -0.175734 17.3697 -0.175735 18.0727 0.527209L24.9516 7.40612C26.8258 9.28058 26.8258 12.3192 24.9516 14.1936L18.0727 21.0725C17.3697 21.7755 16.2303 21.7755 15.5273 21.0725C14.8244 20.3696 14.8244 19.2302 15.5273 18.5272L21.4547 12.5999L1.8 12.5999C0.805886 12.5999 -8.14363e-07 11.794 -9.44154e-07 10.7999C-8.61892e-07 9.80575 0.805887 8.99986 1.8 8.99986L21.4547 8.99987L15.5273 3.07252C14.8244 2.36958 14.8244 1.23015 15.5273 0.527209Z" fill="#0000FF"/></svg>'
];

class Web
{
    static init()
    {
        Web.initDynamicBG();
        $(document).ready(function(e) {

            $.each($("#cookiesWeb .btnStandard, .bloqueLegalCookies .btnStandard"), function (i, e) {
                const txt = $(e).text();
                $(e).html('<span class="btnStandardTitle">'+txt+'</span><span class="btnStandardIcon"><svg width="18" height="15" viewBox="0 0 18 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10.3516 0.351471C10.8202 -0.117157 11.5798 -0.117157 12.0484 0.351471L16.6344 4.93741C17.8839 6.18705 17.8839 8.21277 16.6344 9.46241L12.0484 14.0483C11.5798 14.517 10.8202 14.517 10.3516 14.0483C9.88293 13.5797 9.88293 12.8201 10.3516 12.3515L14.3031 8.39991H1.2C0.537258 8.39991 1.44466e-07 7.86265 0 7.19991C-3.09709e-09 6.53717 0.537258 5.99991 1.2 5.99991H14.3031L10.3516 2.04835C9.88293 1.57972 9.88293 0.820101 10.3516 0.351471Z" fill="white"></path></svg></span>');
            });

            const btnSubir = $("#btn-subir");
            let toScroll = null;
            $(window).scroll(function ()
            {
                let scrollPosition = $(window).scrollTop();

                if (scrollPosition > 300)
                {
                    clearTimeout(toScroll);
                    toScroll = setTimeout(function ()
                    {
                        btnSubir.removeClass("d-none");
                    }, 100);
                }
                else
                {
                    clearTimeout(toScroll);
                    btnSubir.addClass("d-none");
                }

                btnSubir.click(function ()
                {
                    clearTimeout(toScroll);
                    window.scrollTo({top: 0, behavior: 'smooth'});
                    $(this).addClass("d-none");
                });
            });

            new WOW(
                {
                    boxClass:     "title-animation",
                    offset: 50,
                    callback:     function(box) {
                        $(box).addClass("animate");
                    }
                }
            ).init();
        });
    }

    static initInicio()
    {
    }

    static initFichaArea() {
        $(document).ready(function () {
            const elementCarouselFotosPrincipal = $("#ficha-area-foto-principal");
            let numItems = elementCarouselFotosPrincipal.find(".item-foto").length;

            elementCarouselFotosPrincipal.owlCarousel({
                margin: 18,
                nav: false,
                dots: false,
                stagePadding: 1,
                lazyLoad: true,
                items: 1,
                loop: numItems > 1,
                drag: numItems > 1
            });

            const elementCarouselFotosSecundarias = $("#ficha-area-fotos-secundarias");
            let numItemsSec = elementCarouselFotosSecundarias.find(".item-foto").length;

            elementCarouselFotosSecundarias.owlCarousel({
                margin: 24,
                nav: true,
                navText: navText,
                dots: false,
                stagePadding: 1,
                lazyLoad: true,
                items: 1,
                responsive: {
                    0: {
                        items: 3,
                        loop: numItemsSec > 3,
                    },
                    576: {
                        items: 4,
                        loop: numItemsSec > 4,
                    }
                }
            });

            elementCarouselFotosPrincipal.on("click", ".item-foto", function (e) {
                e.preventDefault();

                const fotoId = $(this).data("foto");

                const $item = $("#gallery-dimbox").find(`a[data-foto="${fotoId}"]`);

                if ($item.length === 0) return;

                dimbox.open($item[0]);
            });

            elementCarouselFotosPrincipal.on("translated.owl.carousel", function (e) {
                if (elementCarouselFotosSecundarias.length === 0) return;

                const $fotoActual = elementCarouselFotosPrincipal.find(".owl-item.active:not(.cloned) .item-foto").first();
                const fotoId = $fotoActual.data("foto");

                elementCarouselFotosSecundarias.find(".item-foto").removeClass("active");
                elementCarouselFotosSecundarias.find(`.item-foto[data-foto="${fotoId}"]`).addClass("active");
            });

            elementCarouselFotosSecundarias.on("click", ".item-foto", function (e) {
                e.preventDefault();

                const fotoId = $(this).data("foto");

                const $itemsPrincipales = elementCarouselFotosPrincipal.find(".owl-item:not(.cloned) .item-foto");
                let indexReal = -1;

                $itemsPrincipales.each(function (i) {
                    if ($(this).data("foto") == fotoId) {
                        indexReal = i;
                        return false;
                    }
                });

                elementCarouselFotosSecundarias.find(".item-foto").removeClass("active");
                $(this).addClass("active");

                elementCarouselFotosPrincipal.trigger("to.owl.carousel", [indexReal, 300, true]);
            });
        });
    }

    static initCarouselAreas() {
        $(document).ready(function () {

            const elementCarousel = $("#carousel-areas-produccion");

            if (elementCarousel.length === 0) return;

            let numItems = elementCarousel.find(".item-area").length;

            elementCarousel.owlCarousel({
                loop: true,
                margin: 24,
                nav: false,
                dots: false,
                navText: navText,
                responsive: {
                    0: {
                        items: 1,
                        loop: numItems > 1,
                        stagePadding: numItems > 1 ? 40 : 0
                    },
                    576: {
                        items: 2,
                        loop: numItems > 2,
                        stagePadding: numItems > 2 ? 20 : 0
                    },
                    768: {
                        items: 2,
                        loop: numItems > 2,
                        stagePadding: numItems > 2 ? 90 : 0
                    },
                    992: {
                        items: 3,
                        loop: numItems > 3,
                        stagePadding: numItems > 3 ? 70 : 0
                    },
                    1200: {
                        items: 4,
                        loop: numItems > 4,
                    }
                }
            });
        })
    }

    static initDynamicBG()
    {
        $(document).ready(function () {
            new WOW(
                {
                    boxClass:     "dynamic-bg",
                    //offset: 200,
                    callback:     function(box) {
                        $(box).addClass("loaded");
                    },
                }
            ).init();
        });
    }

    static initTexto()
    {
        $("document").ready(function()
        {
            //$(".textoSeccion a").attr("target", "_blank");
            $(".textoSeccion a[href^='tel']").removeAttr("target");

            $(".textoSeccion img[style^='float: left'], .textoSeccion img[style^='float:left']").addClass("margin-right-20 margin-bottom-20 img-float");
            $(".textoSeccion img[style^='float: right'], .textoSeccion img[style^='float:right']").addClass("margin-left-20 margin-bottom-20 img-float");

            $(".textoSeccion img:not(.imagenDerecha)").addClass("img-fluid").css("max-width", "100%").css("height", "auto").css("object-fit", "cover");
        });
    }

    static initBanner()
    {
        $(document).ready(function () {
            if ($('#carousel-banner').length) {
                $('#carousel-banner').owlCarousel({
                    animateOut: 'fadeOut',
                    animateIn: 'fadeIn',
                    loop:true,
                    lazyLoad:true,
                    margin:0,
                    nav:true,
                    navText: navText,
                    dots:false,
                    mouseDrag: false,
                    smartSpeed: 900,
                    autoplay: true,
                    autoplayTimeout: 7000,
                    items:1,
                });
            }
        });
    }

    static initContacto()
    {
        $(document).ready(function(e) {
            $("#btnEnviarContacto").click(enviarFormulario);
        });

        function enviarFormulario(event) {
            event.preventDefault();

            var extraMsg = "";

            if (!$("#politica").is(":checked")) {
                extraMsg = $("#politica").attr("title");
            }

            Utils.sendStandardAjax("formContacto", "https://www.prodeintec.es/ajax/Contacto.enviar.php", {
                extraErroresForm: extraMsg,
                successCallback: null,
                resetFormOnSuccess: true
            });
        }
    }
}

function findPos(obj) {
    var curtop = 0;
    if (obj.offsetParent) {
        do {
            curtop += obj.offsetTop;
        } while (obj = obj.offsetParent);
        return [curtop];
    }
}

function isEmail(email) {
    var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;
    return regex.test(email);
}


/*
    ClassBlockUI.abrirBlockUIEstandar(contenedorIDAMostrar[, accionCerrar, headerText, extraClass, restaurarElemento]);
    ClassBlockUI.abrirBlockUIEstandarMensaje(mensaje[, isAlertOrButtons, onClose]);
    ClassBlockUI.abrirBlockUIConfirm(mensaje, textoBotonAceptar, accionBotonAceptar, textoBotonCancelar[, accionBotonCancelar]); //accionBotonCancelar="close"
    ClassBlockUI.abrirBlockUIEsperePorFavor:([mensaje]);
*/
var ClassBlockUI =
    {
        restaurarElemento: function()
        {
            var data = $("body").data('blockUIEstandar.history');
            if (data)
            {
                data.el.style.display = data.display;
                data.el.style.position = data.position;
                if (data.parent)
                    data.parent.appendChild(data.el);
                $("body").removeData('blockUIEstandar.history');
                $("#"+data.generatedId).remove();
            }
        },
		        abrirBlockUIEstandar: function(contenedorIDAMostrar, accionCerrar, headerText, extraClass, restaurarElemento)
        {
            if(restaurarElemento || restaurarElemento == undefined)
            {
                ClassBlockUI.restaurarElemento();
            }
            $(".modalAutoHide").modal("hide");
            if($(".modal").length>0){$("body").addClass("modal-open")}

            if(contenedorIDAMostrar == undefined || $("#"+contenedorIDAMostrar).length == 0){return;}

            //var blockUIId="blockUI_"+new Date().getTime();
            var blockUIId="blockUI_"+contenedorIDAMostrar;

            extraClass = extraClass == undefined ? "" : extraClass; //modal-lg

            var object = $("#"+contenedorIDAMostrar);
            var node = object[0];
            var data = {};
            $("body").data('blockUIEstandar.history', data);
            data.el = node;
            data.parent = node.parentNode;
            data.display = node.style.display;
            data.position = node.style.position;
            data.generatedId = blockUIId;
            data.object = object;
            if (data.parent)
                data.parent.removeChild(node);

            var header = headerText != undefined ? headerText : "";

            var message = ''+
                '<div class="modal" data-bs-backdrop="static" id="'+blockUIId+'" role="dialog">'+
                <!-- Añadiendo la clase modal-lg, modal-md o modal-sm podemos cambiar el tamaño del modal (modal-xs no existe) -->
                '	<div class="modal-dialog '+extraClass+' animated">'+
                <!-- Modal content-->
                '      <div class="modal-content">'+
                '	      <div class="modal-header">' +
                '			<button type="button" class="close btnCerrarModalEquis tooltipStandard" data-custom-dismiss="modal" aria-label="" title=""><img src="https://www.prodeintec.es/img/iconos/cerrar.svg" alt="Cerrar" /></button>'+
                '	        <div class="modal-title">'+header+'</div>'+
                '          </div>'+
                '          <div class="modal-body"></div>'+
                '        </div>'+
                '    </div>'+
                '</div>';

            $("body").append(message);

            var modal = $("#"+blockUIId);
            modal.find(".modal-body").append(node);
            modal.find(".modal-dialog").addClass("fadeIn");

            modal.on('hidden.bs.modal', function () {
                ClassBlockUI.restaurarElemento();
            })

            var myModal = new bootstrap.Modal($(modal)[0], {
                keyboard: false
            })

            myModal.show();

            if(accionCerrar==undefined) //boton cerrar tiene accion por defecto
            {
                $("#"+blockUIId+" .btnCerrarModalEquis").click(function(){
                    myModal.hide();
                    if($(".modal").length>0){$("body").addClass("modal-open")}
                });
            }
            else if(accionCerrar==false) //oculta el boton cerrar
            {
                $("#"+blockUIId+" .btnCerrarModalEquis").hide();
            }
            else	//boton cerrar con accion especial
            {
                $("#"+blockUIId+" .btnCerrarModalEquis").click(accionCerrar);
            }

            return modal;
        },
		        abrirBlockUIEstandarMensaje: function(mensaje, isAlertOrButtons, onClose, extraClass, title)
        {
            $(".modalAutoHide").modal("hide");
            if($(".modal").length>0){$("body").addClass("modal-open")}

            var blockUIId="blockUI_"+new Date().getTime();

            extraClass = extraClass == null || extraClass == undefined ? "" : extraClass; //modal-lg
            title = title == null || title == undefined ? "Aviso" : title;

            if(isAlertOrButtons==undefined) isAlertOrButtons=false;
            if(onClose==undefined) onClose=false;

            var botonera = "";
            var botoneraEspecial = false;

            if(isAlertOrButtons === false)
            {
                botonera = "";
            }
            else if (isAlertOrButtons === true)
            {
                let textoBoton = "Aceptar";

                botonera = `<div class='text-center botoneraBlockUI contieneBtnStandard'>
                                <button type='button' class='btnStandard btnCerrarBlockUIAlert'>
                                    <span class='btnStandardTitle'>${textoBoton}</span>
                                    <span class="btnStandardIcon">
                                        <svg width="18" height="15" viewBox="0 0 18 15" fill="none" xmlns="http://www.w3.org/2000/svg">
                                            <path d="M10.3516 0.351471C10.8202 -0.117157 11.5798 -0.117157 12.0484 0.351471L16.6344 4.93741C17.8839 6.18705 17.8839 8.21277 16.6344 9.46241L12.0484 14.0483C11.5798 14.517 10.8202 14.517 10.3516 14.0483C9.88293 13.5797 9.88293 12.8201 10.3516 12.3515L14.3031 8.39991H1.2C0.537258 8.39991 1.44466e-07 7.86265 0 7.19991C-3.09709e-09 6.53717 0.537258 5.99991 1.2 5.99991H14.3031L10.3516 2.04835C9.88293 1.57972 9.88293 0.820101 10.3516 0.351471Z" fill="white"></path>
                                        </svg>
                                    </span>
                                </button>
                            </div>`;
            }
            else
            {
                botoneraEspecial = true;
                botonera = "<div class='text-center botoneraBlockUI contieneBtnStandard'>";
                for(var index in isAlertOrButtons)
                {
                    botonera +=  " <span class='btnStandard "+index+"'>"+isAlertOrButtons[index]["text"]+"</span> ";
                }
                botonera += "</div>";
            }

            var message = '';
            message += '<div class="modal '+(isAlertOrButtons==false ? 'modalAutoHide' : '')+'" data-bs-backdrop="static" id="'+blockUIId+'" role="dialog">';
            <!-- Añadiendo la clase modal-lg, modal-md o modal-sm podemos cambiar el tamaño del modal (modal-xs no existe) -->
            message += '	<div class="modal-dialog '+extraClass+' animated">';
            <!-- Modal content-->
            message += '      <div class="modal-content">';

            if(isAlertOrButtons!=false)
            {
                message += '	      <div class="modal-header">';
                message += '			<button type="button" class="close btnCerrarModalEquis tooltipStandard" data-custom-dismiss="modal" aria-label="" title=""><img src="https://www.prodeintec.es/img/iconos/cerrar.svg" alt="Cerrar" /></button>';
                message += '	        <h4 class="modal-title" id="myModalLabel">'+title+'</h4>';
                message += '          </div>';
            }

            message += '          <div class="modal-body">'+mensaje+'</div>';

            if(botonera != "")
            {
                message += '          <div class="modal-footer">'+botonera+'</div>';
            }

            message += '        </div>';
            message += '    </div>';
            message += '</div>';

            $("body").append(message);
            var modal = $("#"+blockUIId);
            modal.find(".modal-dialog").css("animation-duration", "500ms").addClass("zoomIn");

            modal.on('hidden.bs.modal', function () {
                modal.remove();
            })

            var myModal = new bootstrap.Modal($(modal)[0], {
                keyboard: false
            });

            myModal.show();

            //Acciones de los botones especiales
            if(botoneraEspecial)
            {
                for(var index in isAlertOrButtons)
                {
                    if(isAlertOrButtons[index]["action"] == "close")
                    {
                        isAlertOrButtons[index]["action"] = function(){
                            myModal.hide();
                            if($(".modal").length>0){$("body").addClass("modal-open")}
                        };
                    }
                    $("#"+blockUIId+" ."+index).unbind("click").click(isAlertOrButtons[index]["action"]);
                }
            }

            var fnOnClose;
            if(onClose==false)
            {
                fnOnClose = function(){
                    myModal.hide();
                    if($(".modal").length>0){$("body").addClass("modal-open")}
                };
            }
            else if (typeof onClose === "function")
            {
                fnOnClose = function(){onClose()};
            }
            else if (onClose == "location")
            {
                fnOnClose = function(){window.location.reload()};
            }
            else if (onClose == "back")
            {
                fnOnClose = function(){history.go(-1);};
            }
            else
            {
				                fnOnClose = function(){window.location = onClose};
            }

            $("#"+blockUIId+" .btnCerrarBlockUIAlert, #"+blockUIId+" .btnCerrarModalEquis").unbind("click").click(fnOnClose);

            return modal;
        },
        abrirBlockUIConfirm: function(mensaje, textoAceptar, accionAceptar, textoCancelar, accionCancelar, extraClass, title)
        {
            accionCancelar = accionCancelar == undefined ? "close" : accionCancelar;

            extraClass = extraClass == null || extraClass == undefined ? "" : extraClass;

            var buttons =
                {
                    "btnAceptarBUI_CONFIRM":
                        {
                            "text": textoAceptar,
                            "action": accionAceptar
                        },
                    "btnCancelarBUI_CONFIRM":
                        {
                            "text": textoCancelar,
                            "action": accionCancelar
                        }
                };
            return ClassBlockUI.abrirBlockUIEstandarMensaje(mensaje, buttons, false, extraClass, title);
        },
        abrirBlockUIEsperePorFavor: function(mensaje)
        {
            if(mensaje == undefined){ mensaje = "<div class='text-center'><span class='esperePorFavor'>Espere por favor...</span></div>"; };
            return ClassBlockUI.abrirBlockUIEstandarMensaje(mensaje, undefined, false, "modalEspere");
        }
    };