"use strict";

;

(function ($) {
  "use strict";

  $.fn.CalypsoMenu = function (params) {
    // Default options
    var options = $.extend({
      accountBtn: '.my-account-btn',
      accountBox: '.my-account-container',
      menuNav: '.menu-nav',
      menuAllNav: '.menu-nav-all',
      menuCategories: '.menu-categories-container',
      menuDesk: '.menu-desk-container',
      categoryAllBtn: '.menu-item.all-categories',
      handleBtnCategories: '.btn-handle-categories',
      tabletSize: 770
    }, params); // Plugin variables

    var $self = this;
    var toggleMenu = false;
    var activeItem = null;
    var loadedCategories = false;
    var toggleAccountMenu = false; // Put your DOM elements here

    var elements = {
      $accountBtn: $(options.accountBtn),
      $accountBox: $(options.accountBox),
      $boxNavMenu: $(options.menuNav),
      $boxNavMenuAll: $(options.menuAllNav),
      $all_category_container: $(options.menuCategories),
      $menu_desk: $(options.menuDesk),
      $all_category_btn: $(options.categoryAllBtn),
      $btn_handle_categories: $(options.handleBtnCategories),
      $all_categories: [{
        id: 1,
        name: 'Tapicería',
        url: '/tapiceria',
        slug: 'tapiceria',
        subcategories: [].filter(subcategory => subcategory.id !== 3),
        icon: 'ca-icon-Tapiceria'
      }, {
        id: 23,
        name: 'Pisos, alfombras y gramas ',
        slug: 'pisos',
        url: '/pisos-alfombras-y-gramas',
        subcategories: [],
        icon: 'ca-icon-Pisos'
      }, {
        id: 50,
        name: 'Empaque, agro y construcción',
        slug: 'empaque',
        url: '/empaque-agro-y-construccion',
        subcategories: [],
        icon: 'ca-icon-Empaque'
      }, {
        id: 95,
        name: 'Lonas y sintéticos',
        slug: 'lonas',
        url: '/lonas-y-sinteticos',
        subcategories: [],
        icon: 'ca-icon-Lonas'
      }, {
        id: 11,
        name: 'Insumos, calzado y marroquinería',
        slug: 'calzado',
        url: '/insumos-calzado-y-marroquineria',
        subcategories: [],
        icon: 'ca-icon-Calzado'
      }, {
        id: 12,
        name: 'Hogar',
        slug: 'hogar',
        url: '/busca/?fq=H:165',
        subcategories: [],
        icon: 'ca-icon-Hogar'
      }, {
        id: 13,
        name: 'Transporte',
        slug: 'transporte',
        url: '/busca/?fq=H:199',
        subcategories: [],
        icon: 'ca-icon-Transporte'
      }, {
        id: 14,
        name: 'Trajes de dotación',
        slug: 'trajes',
        url: '/busca/?fq=H:200',
        subcategories: [],
        icon: 'ca-icon-Dotacion'
      }, {
        id: 15,
        name: 'Insumos emprendedores',
        slug: 'insumos',
        url: '/busca/?fq=H:201',
        subcategories: [],
        icon: 'ca-icon-Emprendedores'
      },
	  /**{	
        id: 2001,
        name: 'BLACK DAYS',
        slug: 'blackdays',
        url: '/ofertas/black',
        subcategories: [],
        icon: 'ca-icon-blackdays'
      },**/ {
        id: 1001,
        name: 'Liquidación',
        slug: 'liquidacion',
        url: '/busca/?fq=H:399',
        subcategories: [],
        icon: 'ca-icon-liquidation'
      }, {
        id: 1002,
        name: 'Iniciar sesión',
        slug: 'login',
        url: '/login',
        subcategories: [],
        icon: 'ca-icon-login'
      }, {
        id: 1003,
        name: 'Mis pedidos',
        slug: 'pedidos',
        url: '/account#/orders',
        subcategories: [],
        icon: 'ca-icon-pedidos'
      }, {
        id: 1004,
        name: 'Mis favoritos',
        slug: 'fav',
        url: '/wishlist',
        subcategories: [],
        icon: 'ca-icon-fav'
      }, {
        id: 1005,
        name: 'Mi carrito',
        slug: 'cart',
        url: '/checkout#/cart',
        subcategories: [],
        icon: 'ca-icon-cart'
      }, {
        id: 1006,
        name: 'Paga tu factura',
        slug: 'factura',
        url: 'https://checkout.wompi.co/l/ImI0Dh',
        subcategories: [],
        icon: 'ca-icon-factura'
      }, 
        {
          id: 1007,
          name: 'Trabaja con nosotros',
          slug: 'trabaja',
          url: 'https://jobs.tiendascalypso.com/',
          subcategories: [],
          icon: 'ca-icon-trabaja'
        }
        ,
        {
        id: 1000,
        name: 'Blog',
        slug: 'blog',
        url: 'https://blog.tiendascalypso.com/',
        subcategories: [],
        icon: 'ca-icon-blog'
      }]
    };
    var $grid = $('.category-menu').isotope({
      // main isotope options            
      itemSelector: '.category-content',
      transitionDuration: 0,
      masonry: {
        columnWidth: 100,
        horizontalOrder: true
      }
    });
    var methods = {
      init: function init() {
        $(document).on('click', '.view-all-button .close-menu-desktop', function () {
          $('.ca-icon-header-menu-close').click();
          $('.menu-desk-container').css('display', 'none')
        })
        events.resizeWindow();
        events.clickBtnAllCategory();
        events.closeMobileSubcategories();
        methods.setCategoryMenuDeskSize();

        if (window.innerWidth > options.tabletSize) {
          events.mouseUp();
          events.mouseEnterMenu();
          events.mouseLeaveMenu();
        } else {
          events.closeMobileMenuEvent();
          events.showMyAccountMobile(elements.$accountBtn);
          events.hideMyAccountMobile('.overlay-mobile-account');
        }

        if (!loadedCategories) {
          methods.addAllCategories();
          methods.appendCustomItems();
        }
      },
      appendCustomItems: function () {
        if ($('.menu-nav-all .proyectos-especiales').length === 0) {
          const htmlProyectos = `
      <li class="all-menu-item proyectos-especiales" style="background-color:#000;">
        <a href="https://www.calypsoproyectos.com/" target="_blank" class="proyectos-link">
          <img src="/arquivos/logo-proyectos-menu-3-hd.png" alt="Proyectos especiales" style="max-width: 74px; display: block;" />
        </a>
      </li>
    `;
          $('.menu-nav-all').append(htmlProyectos);
        }
      }

      ,
      setCategoryMenuDeskSize: function setCategoryMenuDeskSize() {
        if (window.innerWidth > options.tabletSize) {
          $(elements.$all_category_container).css({
            "top": elements.$all_category_btn.innerHeight() + 2,
            "left": 0
          });
          $(elements.$menu_desk).css({
            "top": elements.$all_category_btn.innerHeight() + 2,
            "left": '50%',
            "transform": 'translateX(-50%)'
          });
        } else {
          $(elements.$all_category_container).css({
            "top": '',
            "width": ''
          });
          $(elements.$menu_desk).css({
            "top": '',
            "left": ''
          });
        }
      },
      setCategories: function setCategories(key) {
        if (key != null) {
          HeaderViewModel.departamentImage(departaments[key].image);
          HeaderViewModel.departamentUrl(departaments[key].url);
          departaments[key].categories.forEach(function (c) {
            HeaderViewModel.addCategory(new Category(c.id, c.name, c.url, c.subcategories, c.icono, c.icon));
          });
        }
      },
      // add random category and subcategory
      addAllCategories: function addAllCategories() {
        elements.$all_categories.forEach(function (category) {
          HeaderViewModel.addAllCategory(new Category(category.id, category.name, category.url, category.subcategories, category.icon, category.slug));
        });
        loadedCategories = true;
        events.showCategories();
      },
      setMenuCategories: function setMenuCategories(e, isMobile, elementse) {
        HeaderViewModel.resetCategories();
        var menuTab = !isMobile ? e.target : e.parentElement;
        var slug = elementse ? elementse.find('.item-menu-control').attr('category-slug') : menuTab.getAttribute('category-slug');

        if (slug == null) {
          console.log("$(menuTab).parents('.hovered-menu-item').length", $(menuTab).parents('.hovered-menu-item').length);

          if ($(menuTab).parents('.hovered-menu-item').length > 0) {
            menuTab = $(menuTab).parent()[0];
          }

          slug = menuTab.getAttribute('category-slug');
        } // Comprobar si el slug es igual a "liquidacion" y añadir la clase al <li>

        console.log('slugslugslugslug', slug)

        if (slug === "liquidacion") {
          $(menuTab).closest('li').addClass(slug); // Añadimos la clase 'liquidacion' al <li>
        }

        if (slug === "blackdays") {
          $(menuTab).closest('li').addClass(slug);
        }

        methods.setCategories(slug);

        if (!isMobile) {
          activeItem = menuTab;
          $('.item-menu-control').removeClass('active');
          $(activeItem).addClass('active');
          elements.$menu_desk.show();

          if ($(menuTab).parent().hasClass("all-menu-item")) {
            elements.$menu_desk.css({
              "left": elements.$all_category_container.innerWidth(),
              "transform": "none"
            });
          } else {
            elements.$menu_desk.css({
              "left": '50%',
              "transform": 'translateX(-50%)'
            });
          }

          $grid.isotope('reloadItems').isotope({
            layoutMode: 'masonry'
          });
          $('.category-title-mobile').html(departaments[slug].name);
        } else {
          $('.category-title-mobile').html(departaments[slug].name);
          $(".subcategory-content").collapse({
            open: function open() {
              this.slideDown(100);
              setTimeout(function () {
                window.psMobile.element.scrollTop += 1;
              }, 100);
              window.psMobile.update();
            },
            close: function close() {
              this.slideUp(100);
              window.psMobile.update();
            }
          });
        }
      },
      showMenu: function showMenu(item, isMobile) {
        $('.item-menu-control[category-slug="liquidacion"]').parent().addClass('liquidacion')
        $('.item-menu-control[category-slug="blackdays"]').parent().addClass('blackdays')
        if (!isMobile) {
          $(item).on('mouseover', '.hovered-menu-item', function (e) {
            console.log('event', e);
            methods.setMenuCategories(e, undefined, $(this));
          });
        } else {
          $(item).click(function (e) {
            e.preventDefault()
            methods.setMenuCategories(e.currentTarget, isMobile);
            gsap.to('.menu-mobile-container-subcategories', {
              duration: .3,
              x: '0%'
            });

            $('.subcategory-content .container-icon-text-category .link-category').each(function () {
              let href = $(this).attr('href')
              let titulo = $(this).html()
              $(this).parents('.subcategory-content').find('.list-subcategory').append('<a class="view-all-mobile" href="' + href + '" >Ver todo ' + titulo + '</a>')

            })

          });
        }
      },
      showMyAccout: function showMyAccout(item) {
        $('.my-account-container').appendTo($('.my-account-btn')).css({
          transform: ''
        });
        $(item).on('mouseenter', function (e) {
          if (HeaderViewModel.order().loggedIn) {
            $(e.target).addClass('active');
            elements.$accountBox.show();
          }
        });
      },
      closeMobileMenu: function closeMobileMenu() {
        if (window.innerWidth <= options.tabletSize) {
          gsap.to($('.note-top-header'), {
            duration: .3,
            y: '0%'
          });
          gsap.to($('.overflow-menu-mobile'), {
            duration: .3,
            opacity: 0
          });
          gsap.to(elements.$all_category_container, {
            duration: .3,
            x: '-100%'
          });
          setTimeout(function () {
            $('.overflow-menu-mobile').css({
              zIndex: -1,
              pointerEvents: 'none'
            });
          }, 400);
          $(document.body).css({
            overflow: ""
          });
        }
      },
      openMobileMenu: function openMobileMenu() {
        if (window.innerWidth <= options.tabletSize) {
          $('.overflow-menu-mobile').css({
            zIndex: 21,
            pointerEvents: 'all'
          });
          gsap.to($('.note-top-header'), {
            duration: .3,
            y: '-100%'
          });
          gsap.to($('.overflow-menu-mobile'), {
            duration: .3,
            opacity: 1
          });
          $(document.body).css({
            overflow: "hidden"
          });
        }
      }
    }; // Plugin events

    var events = {
      resizeWindow: function resizeWindow() {
        window.onresize = function () {
          methods.init();
        };
      },
      closeMobileSubcategories: function closeMobileSubcategories() {
        $('.close-mobile-subcategories').click(function (e) {
          gsap.to('.menu-mobile-container-subcategories', {
            duration: .3,
            x: '-100%'
          });
        });
      },
      mouseUp: function mouseUp() {
        window.onmouseup = function (e) {
          if (!elements.$all_category_container.is(e.target) && elements.$all_category_container.has(e.target).length === 0) {
            if (toggleMenu && !elements.$menu_desk.is(e.target) && elements.$menu_desk.has(e.target).length === 0) {
              gsap.to(elements.$all_category_container, {
                duration: .3,
                x: '-100%'
              });
              toggleMenu = false;
            }
          }
        };
      },
      clickBtnAllCategory: function clickBtnAllCategory() {
        $(elements.$btn_handle_categories).click(function () {
          var style = window.getComputedStyle(elements.$all_category_container[0]);
          var matrix = new WebKitCSSMatrix(style.webkitTransform);

          if (matrix.m41 !== 0) {
            methods.openMobileMenu();
            gsap.to(elements.$all_category_container, {
              duration: .3,
              x: '0%'
            });
            toggleMenu = true;
            $(this).find(".menu-icon").removeClass("ca-icon-header-menu");
            $(this).find(".menu-icon").addClass("ca-icon-header-menu-close");
          } else {
            methods.closeMobileMenu();
            gsap.to(elements.$all_category_container, {
              duration: .3,
              x: '-100%'
            });
            toggleMenu = false;
            $(this).find(".menu-icon").removeClass("ca-icon-header-menu-close");
            $(this).find(".menu-icon").addClass("ca-icon-header-menu");
          }
        });
      },
      mouseEnterMenu: function mouseEnterMenu() {
        methods.showMenu(elements.$boxNavMenu);
        methods.showMenu(elements.$boxNavMenuAll);
        methods.showMyAccout(elements.$accountBtn);
      },
      showMyAccountMobile: function showMyAccountMobile(item) {
        $('.my-account-container').appendTo(document.body);
        $(item).on('click', function (e) {
          if (HeaderViewModel.order().loggedIn && !toggleAccountMenu) {
            gsap.to('.my-account-container', {
              duration: .3,
              y: '-60px'
            });
            $('.overlay-mobile-account').css({
              zIndex: 21
            });
            gsap.to($('.overlay-mobile-account'), {
              duration: .3,
              opacity: 1
            });
            toggleAccountMenu = true;
          }
        });
      },
      hideMyAccountMobile: function hideMyAccountMobile(item) {
        $(item).on('click', function (e) {
          if (HeaderViewModel.order().loggedIn) {
            gsap.to('.my-account-container', {
              duration: .3,
              y: '100%'
            });
            gsap.to($('.overlay-mobile-account'), {
              duration: .3,
              opacity: 0
            });
            setTimeout(function () {
              $('.overlay-mobile-account').css({
                zIndex: -1
              });
            }, 400);
            toggleAccountMenu = false;
          }
        });
      },
      showCategories: function showCategories() {
        methods.showMenu($('.show-more'), true);
      },
      mouseLeaveMenu: function mouseLeaveMenu() {
        $(elements.$boxNavMenu).on('mouseleave', '.hovered-menu-item', function (e) {
          if (e.relatedTarget !== elements.$menu_desk[0]) {
            $(e.target).removeClass('active');
            //elements.$menu_desk.hide();
          }
        });
        $(elements.$boxNavMenu).on('mouseenter', '.ca-icon-header-menu-close', function (e) {
          elements.$menu_desk.hide();
        });

        $(elements.$boxNavMenu).on('mouseleave', function (e) {
          elements.$menu_desk.hide();
        });



        elements.$menu_desk.on('mouseleave', function () {
          $(activeItem).removeClass('active');
          elements.$menu_desk.hide();
        });
        elements.$accountBox.on('mouseleave', function (e) {
          elements.$accountBtn.removeClass('active');
          elements.$accountBox.hide();
        });
      },
      closeMobileMenuEvent: function closeMobileMenuEvent() {
        $('.close-menu-mobile').click(function () {
          methods.closeMobileMenu();
        });
      }
    };
    methods.init();
  };
})(jQuery);