export const toggleMin = (appName, apps, setApps) => setApps([
  ...apps.map(a => a.name === appName ? {...a, min: !a.min} : a )
])

export const toggleMax = (appName, apps, setApps) => setApps([
  ...apps.map(a => a.name === appName ? {...a, max: !a.max} : a )
])

export const close = (appName, apps, setApps) => { setApps(apps.filter(a => a.name !== appName)) }

export const open = (appName, apps, setApps) => {
  apps.some(app => app.name === appName)
    ? toggleMin(appName, apps, setApps)
    : setApps([...apps, {name: appName, min: false, max: false, pos: []}])
}

export const move = (appName, winRef, apps, setApps) => {
  winRef.current.onmousedown = (event) => {
    if (event.target.classList && event.target.classList.contains('window__title')) {
      const shiftX = event.clientX - winRef.current.getBoundingClientRect().left
      const shiftY = event.clientY - winRef.current.getBoundingClientRect().top
      winRef.current.classList.add('moving')

      function moveAt(pageX, pageY) {
        const x = pageX - shiftX
        const y = pageY - shiftY - 32
        setApps([...apps.map(a => a.name === appName
          ? {...a, pos: [x + 'px', y < 0 ? 0 : y + 'px']}
          : a
        )])
      }

      const onMouseMove = (event) => {
        moveAt(event.pageX, event.pageY)
      }

      document.addEventListener('mousemove', onMouseMove)

      document.onmouseup = () => {
        document.removeEventListener('mousemove', onMouseMove)
        winRef.current.classList.remove('moving')
        document.onmouseup = null
      }
    }
  }

  winRef.current.ondragstart = () => null
}