client app file update

src/public/app.js

@@ -1,124 +0,0 @@
-const body = document.querySelector('body')
-
-function isFoldedState(element) {
-	const w = body.clientWidth
-	const toggleWidth = getToggleWidth(element)
-
-	return w <= toggleWidth
-}
-
-function isFolded(element) {
-	return element.classList.contains('HMenu--folded')
-}
-
-function isUnfolded(element) {
-	return element.classList.contains('HMenu--unfolded')
-}
-
-function isOpen(element) {
-	return element.classList.contains('HMenu--open')
-}
-
-function isClosed(element) {
-	return element.classList.contains('HMenu--closed')
-}
-
-function foldMenu(element) {
-	element.classList.remove('HMenu--unfolded')
-	element.classList.add('HMenu--folded')
-
-	return element
-}
-
-function unfoldMenu(element) {
-	element.classList.remove('HMenu--folded')
-	element.classList.add('HMenu--unfolded')
-
-	return element
-}
-
-function openMenu(element) {
-	body.classList.add('no-scroll')
-	element.classList.remove('HMenu--closed')
-	element.classList.add('HMenu--open')
-
-	setTimeout(() => {
-		document.querySelector('main').style.display = 'none'
-	}, 100)
-
-	return element
-}
-
-function closeMenu(element) {
-	body.classList.remove('no-scroll')
-	element.classList.remove('HMenu--open')
-	element.classList.add('HMenu--closed')
-
-	document.querySelector('main').style.display = 'block'
-
-	return element
-}
-
-function toggleMenu(element) {
-	if (isOpen(element)) {
-		closeMenu(element)
-	} else {
-		openMenu(element)
-	}
-}
-
-function createToggle() {
-	return `
-    <div>
-      <a class="HMenu__toggle" href="#">✕</a>
-    </div>
-    `
-}
-
-function getToggleWidth(element) {
-	const value = element.dataset.toggleWidth
-	if (value) return Number(value)
-
-	return 700
-}
-
-function runHmenu() {
-	const menus = [...document.querySelectorAll('.HMenu')]
-
-	function initMenus() {
-		return menus
-			.map(menu => {
-				const toggle = menu.querySelector('.HMenu__toggle')
-				toggle.addEventListener('click', e => {
-					e.preventDefault()
-					toggleMenu(menu)
-				})
-
-				if (isFoldedState(menu)) {
-					return foldMenu(menu)
-				} else {
-					return unfoldMenu(menu)
-				}
-			})
-			.map(menu => closeMenu(menu))
-	}
-
-	function handleMenus() {
-		return menus.map(menu => {
-			const foldedState = isFoldedState(menu)
-
-			if (foldedState && !isFolded(menu)) {
-				return foldMenu(menu)
-			} else if (!foldedState && isFolded(menu)) {
-				return unfoldMenu(menu)
-			} else {
-				return menu
-			}
-		})
-	}
-
-	initMenus()
-	window.addEventListener('resize', handleMenus)
-}
-
-runHmenu()