export function formatTime(seconds: number) {
  const minutes = Math.floor(seconds / 60)
  const remainderSeconds = Math.floor(seconds % 60)

  const formattedMinutes = String(minutes).padStart(2, '0')
  const formattedSeconds = String(remainderSeconds).padStart(2, '0')
  return `${formattedMinutes}:${formattedSeconds}`
}

export function throttle(
  callback: (...args: unknown[]) => number | void,
  delay: number
) {
  let timeoutId: number | null = null
  let innerTimeout: number | null | void = null

  return function (...args: unknown[]) {
    if (!timeoutId) {
      if (innerTimeout) {
        window.clearTimeout(innerTimeout)
      }

      innerTimeout = callback(...args)
      timeoutId = window.setTimeout(() => {
        timeoutId = null
      }, delay)
    }
  }
}

export function isMobile() {
  // Check the user agent string
  const userAgent = navigator.userAgent.toLowerCase()
  const mobileKeywords = [
    'android',
    'iphone',
    'ipad',
    'windows phone',
    'iemobile',
    'blackberry',
    'opera mini',
    'mobile',
    'tablet',
  ]
  for (const keyword of mobileKeywords) {
    if (userAgent.indexOf(keyword) !== -1) {
      return true
    }
  }
  if (!window.matchMedia) return false
  const mobileQuery = window.matchMedia('(max-width: 768px)') // Adjust the breakpoint as needed
  return mobileQuery.matches
}

export function isElementVisible(element: HTMLElement) {
  if (!element) return false

  // Check the element's display and visibility properties
  const style = window.getComputedStyle(element)
  const display = style.getPropertyValue('display')
  const visibility = style.getPropertyValue('visibility')
  const opacity = style.getPropertyValue('opacity')
  // Check if the element is hidden by any of these conditions
  if (
    display === 'none' ||
    visibility === 'hidden' ||
    visibility === 'collapse'
  ) {
    return false
  }

  // Check if the element has a zero or negative width or height
  if (
    parseInt(style.getPropertyValue('width')) <= 0 ||
    parseInt(style.getPropertyValue('height')) <= 0 ||
    parseInt(opacity) <= 0.1
  ) {
    return false
  }
  // If none of the above conditions are met, the element is visible
  return true
}