diff options
| author | Andinus <andinus@nand.sh> | 2021-09-26 17:21:15 +0530 |
|---|---|---|
| committer | Andinus <andinus@nand.sh> | 2021-09-26 17:21:15 +0530 |
| commit | 74eb196a74f410754cd0ac3300ac432463df90b9 (patch) | |
| tree | cb707d48b2e64257ca2bdc14abd44b621ae9014d /landing/assets/js | |
| parent | e62f7f13b2602c4764ff949c6d73d9b7dae456c2 (diff) | |
| download | MyMedMemoir-74eb196a74f410754cd0ac3300ac432463df90b9.tar.gz | |
Add landing page
Diffstat (limited to 'landing/assets/js')
| -rw-r--r-- | landing/assets/js/main.js | 126 |
1 files changed, 126 insertions, 0 deletions
diff --git a/landing/assets/js/main.js b/landing/assets/js/main.js new file mode 100644 index 0000000..8d0c8da --- /dev/null +++ b/landing/assets/js/main.js @@ -0,0 +1,126 @@ + +(function() { + "use strict"; + + + const select = (el, all = false) => { + el = el.trim() + if (all) { + return [...document.querySelectorAll(el)] + } else { + return document.querySelector(el) + } + } + + + const on = (type, el, listener, all = false) => { + let selectEl = select(el, all) + if (selectEl) { + if (all) { + selectEl.forEach(e => e.addEventListener(type, listener)) + } else { + selectEl.addEventListener(type, listener) + } + } + } + + + const onscroll = (el, listener) => { + el.addEventListener('scroll', listener) + } + + + let navbarlinks = select('#navbar .scrollto', true) + const navbarlinksActive = () => { + let position = window.scrollY + 200 + navbarlinks.forEach(navbarlink => { + if (!navbarlink.hash) return + let section = select(navbarlink.hash) + if (!section) return + if (position >= section.offsetTop && position <= (section.offsetTop + section.offsetHeight)) { + navbarlink.classList.add('active') + } else { + navbarlink.classList.remove('active') + } + }) + } + window.addEventListener('load', navbarlinksActive) + onscroll(document, navbarlinksActive) + + + const scrollto = (el) => { + let header = select('#header') + let offset = header.offsetHeight + + let elementPos = select(el).offsetTop + window.scrollTo({ + top: elementPos - offset, + behavior: 'smooth' + }) + } + + + let backtotop = select('.back-to-top') + if (backtotop) { + const toggleBacktotop = () => { + if (window.scrollY > 100) { + backtotop.classList.add('active') + } else { + backtotop.classList.remove('active') + } + } + window.addEventListener('load', toggleBacktotop) + onscroll(document, toggleBacktotop) + } + + + on('click', '.mobile-nav-toggle', function(e) { + select('#navbar').classList.toggle('navbar-mobile') + this.classList.toggle('bi-list') + this.classList.toggle('bi-x') + }) + + + on('click', '.navbar .dropdown > a', function(e) { + if (select('#navbar').classList.contains('navbar-mobile')) { + e.preventDefault() + this.nextElementSibling.classList.toggle('dropdown-active') + } + }, true) + + + on('click', '.scrollto', function(e) { + if (select(this.hash)) { + e.preventDefault() + + let navbar = select('#navbar') + if (navbar.classList.contains('navbar-mobile')) { + navbar.classList.remove('navbar-mobile') + let navbarToggle = select('.mobile-nav-toggle') + navbarToggle.classList.toggle('bi-list') + navbarToggle.classList.toggle('bi-x') + } + scrollto(this.hash) + } + }, true) + + + window.addEventListener('load', () => { + if (window.location.hash) { + if (select(window.location.hash)) { + scrollto(window.location.hash) + } + } + }); + + + window.addEventListener('load', () => { + AOS.init({ + duration: 1000, + easing: "ease-in-out", + once: true, + mirror: false + }); + }); + +})() |