From 2b6970d33afd75be5bfef951dc3691d492004d43 Mon Sep 17 00:00:00 2001 From: George Halkiadakis Date: Tue, 18 Apr 2023 01:11:37 +0300 Subject: admin back-office environment (skeleton); admin categories --- .../assets/js/_dependency-control/plugins/menu.js | 97 ++++++++++++++++++++++ 1 file changed, 97 insertions(+) create mode 100644 public/assets/js/_dependency-control/plugins/menu.js (limited to 'public/assets/js/_dependency-control/plugins/menu.js') diff --git a/public/assets/js/_dependency-control/plugins/menu.js b/public/assets/js/_dependency-control/plugins/menu.js new file mode 100644 index 0000000..d6dced2 --- /dev/null +++ b/public/assets/js/_dependency-control/plugins/menu.js @@ -0,0 +1,97 @@ +$$plugins.define('menu', ['domHelper'], function (element, options, $) { + var level1 = $('.mainNav__link--hasChildren', element), + closeElements = $('.mainLayer, .megamenu__close'), + body = $('body'), + burgerMenu = $('.burgerMenu'), + mainContainer = $('.mainContainer'), + header = $('.header'), + megaMenuBack = $('.megamenu__back'), + positionTopDesktop, + scrollBarWidth; + + + level1.on('click', function (event) { + event.preventDefault(); + var $this = $(this); + if ($this.parent('.mainNav__item').is('.mainNav__item--active')) { + closeMenuLevel1($this); + } + else { + openMenuLevel1($this); + } + }); + + //close menu + closeElements.on('click', function () { + if (window.innerWidth < 1024) { + closeMobileMenu(); + } else { + closeMenuLevel1($('.mainNav__item--active .mainNav__link')); + } + }); + + function openMenuLevel1($activeItem) { + var $activeItemParent = $activeItem.parent('.mainNav__item'); + + positionTopDesktop = -window.scrollY; + scrollBarWidth = window.innerWidth - mainContainer.innerWidth(); + + var activeItemsExceptCurrent = $('.mainNav__item--active').not($activeItemParent); + if (activeItemsExceptCurrent.length > 0) { + activeItemsExceptCurrent.removeClass('mainNav__item--active').addClass('mainNav__item--fadeOut'); + setTimeout(function () { + activeItemsExceptCurrent.removeClass('mainNav__item--fadeOut'); + }, 350); + } + + $activeItemParent.addClass('mainNav__item--active'); + body.addClass('menuOpened menuOpened--level2').each(e => e.style.paddingRight = scrollBarWidth + "px"); + burgerMenu.addClass('burgerMenu--opened'); + + mainContainer.each(e => e.style.transform = "translateY(" + positionTopDesktop + "px)"); + header.each(e => e.style.width = "calc(100vw - " + scrollBarWidth + "px)"); + } + + function closeMenuLevel1($activeItem) { + var $activeItemParent = $activeItem.parent('.mainNav__item'); + $activeItemParent.removeClass('mainNav__item--active'); + body.removeClass('menuOpened').each(e => e.style.paddingRight = ""); + burgerMenu.removeClass('burgerMenu--opened'); + mainContainer.each(e => e.style.transform = ""); + header.each(e => e.style.width = ""); + body.scroll({ + top: -positionTopDesktop + }); + } + + burgerMenu.on('click', function (e) { + e.preventDefault(); + if (e.target.matches('.burgerMenu--opened')) { + closeMobileMenu(); + } else { + openMobileMenu(); + } + }); + + var positionTop; + function openMobileMenu() { + positionTop = -window.scrollY; + burgerMenu.addClass('burgerMenu--opened'); + body.addClass('menuOpened menuOpened--level2'); + mainContainer.each(e => e.style.transform = "translateY(" + positionTop + "px)"); + } + + function closeMobileMenu() { + burgerMenu.removeClass('burgerMenu--opened'); + body.removeClass('menuOpened menuOpened--level2'); + mainContainer.each(e => e.style.transform = ""); + body.scroll({ + top: -positionTop + }); + } + + megaMenuBack.on('click', function (event) { + $('.mainNav__item--active').removeClass('mainNav__item--active'); + body.removeClass('menuOpened--level2'); + }); +}); -- cgit v1.2.3