From a9072370ca1eb9a5cce928b1d487db0f307edea6 Mon Sep 17 00:00:00 2001 From: ivarlovlie Date: Tue, 20 Sep 2022 15:24:27 +0800 Subject: feat: Move old apps into it's own directory --- .../src/app/pages/nav/js/_2_side-navigation-v4.js | 73 ++++++++++++++++++++++ 1 file changed, 73 insertions(+) create mode 100644 old-apps/projects/src/app/pages/nav/js/_2_side-navigation-v4.js (limited to 'old-apps/projects/src/app/pages/nav/js/_2_side-navigation-v4.js') diff --git a/old-apps/projects/src/app/pages/nav/js/_2_side-navigation-v4.js b/old-apps/projects/src/app/pages/nav/js/_2_side-navigation-v4.js new file mode 100644 index 0000000..63ef9c4 --- /dev/null +++ b/old-apps/projects/src/app/pages/nav/js/_2_side-navigation-v4.js @@ -0,0 +1,73 @@ +// File#: _2_side-navigation-v4 +// Usage: codyhouse.co/license +(function() { + function initSideNav(nav) { + // create btns - visible on mobile only + createBtns(nav); + // toggle sublists on mobile when clicking on buttons + toggleSubLists(nav); + // init diagonal movement + initDiagonalMove(nav); + }; + + function createBtns(nav) { + // on mobile -> create a '; + link.insertAdjacentHTML('afterend', btnHtml); + // add class to link element + Util.addClass(link, 'sidenav-v4__link--href'); + // check if we need to add the collpsed class to the
  • element + var listItem = link.parentElement; + if(!Util.hasClass(listItem, 'sidenav-v4__item--current')) Util.addClass(listItem, 'sidenav-v4__item--collapsed'); + }; + + function hasSubList(link) { + // check if link has submenu + var sublist = link.nextElementSibling; + if(!sublist) return false; + return Util.hasClass(sublist, 'sidenav-v4__sub-list'); + }; + + function toggleSubLists(nav) { + // open/close sublist on mobile + nav.addEventListener('click', function(event){ + var btn = event.target.closest('.js-sidenav-v4__btn'); + if(!btn) return; + Util.toggleClass(btn.parentElement, 'sidenav-v4__item--collapsed', !Util.hasClass(btn.parentElement, 'sidenav-v4__item--collapsed')); + }); + }; + + function initDiagonalMove(nav) { + // improve dropdown navigation + new menuAim({ + menu: nav.querySelector('ul'), + activate: function(row) { + Util.addClass(row, 'sidenav-v4__item--hover'); + }, + deactivate: function(row) { + Util.removeClass(row, 'sidenav-v4__item--hover'); + }, + exitMenu: function() { + return true; + }, + }); + }; + + var sideNavs = document.getElementsByClassName('js-sidenav-v4'); + if( sideNavs.length > 0 ) { + for( var i = 0; i < sideNavs.length; i++) { + (function(i){initSideNav(sideNavs[i]);})(i); + } + } +}()); \ No newline at end of file -- cgit v1.3