1 files changed, 97 insertions, 0 deletions
diff --git a/html/assets/js/plugins/menu.js b/html/assets/js/plugins/menu.js
new file mode 100644
index 0000000..d6dced2
--- /dev/null
+++ b/html/assets/js/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');
+    });
+});