const OFFER_MEDIA_HOST = 'api.hub.bent.ge'
const OFFER_MEDIA_PATH_PREFIX = '/media/offers/'

const OFFER_VARIANT_WIDTHS = {
  thumb: [96, 192],
  card: [320, 640],
  hero: [640, 1280],
}

const OFFER_VARIANT_SIZES = {
  thumb: '(min-width: 640px) 64px, 48px',
  card: '(min-width: 1024px) 313px, (min-width: 768px) 33vw, 100vw',
  hero: '(min-width: 1280px) 560px, (min-width: 1024px) 46vw, 100vw',
}

function parseUrl(value) {
  try {
    return new URL(String(value || ''), 'https://bent.ge')
  } catch {
    return null
  }
}

function fileStemFromPath(pathname) {
  const fileName = String(pathname || '').split('/').pop() || ''
  return fileName.replace(/\.[^.]+$/, '').trim()
}

export function buildOfferImageAttrs(sourceUrl, options = {}) {
  const fallbackSrc = String(sourceUrl || '').trim()
  const variant = String(options.variant || 'card').trim().toLowerCase()
  const widths = OFFER_VARIANT_WIDTHS[variant] || OFFER_VARIANT_WIDTHS.card
  const sizes = String(options.sizes || OFFER_VARIANT_SIZES[variant] || OFFER_VARIANT_SIZES.card)

  if (!fallbackSrc) {
    return { src: '', srcset: '', sizes: '' }
  }

  const parsed = parseUrl(fallbackSrc)

  if (!parsed || parsed.hostname !== OFFER_MEDIA_HOST || !parsed.pathname.startsWith(OFFER_MEDIA_PATH_PREFIX)) {
    return { src: fallbackSrc, srcset: '', sizes: '' }
  }

  const fileStem = fileStemFromPath(parsed.pathname)

  if (!fileStem) {
    return { src: fallbackSrc, srcset: '', sizes: '' }
  }

  const fileName = `${fileStem}.webp`
  const src = `/content/offers/${widths[0]}/${fileName}`
  const srcset = widths.map((width) => `/content/offers/${width}/${fileName} ${width}w`).join(', ')

  return { src, srcset, sizes }
}

export function buildHomeImageAttrs(sourceUrl, options = {}) {
  const fallbackSrc = String(sourceUrl || '').trim()
  const derivativeWidth = Number(options.derivativeWidth || 680)
  const sizes = String(options.sizes || '(min-width: 1280px) 590px, (min-width: 1024px) 48vw, 100vw')

  if (!fallbackSrc || !Number.isFinite(derivativeWidth) || derivativeWidth <= 0) {
    return { src: fallbackSrc, srcset: '', sizes: '' }
  }

  const parsed = parseUrl(fallbackSrc)
  const path = parsed?.pathname || ''

  if (!path.startsWith('/content/home/')) {
    return { src: fallbackSrc, srcset: '', sizes: '' }
  }

  const fileName = path.split('/').pop()

  if (!fileName) {
    return { src: fallbackSrc, srcset: '', sizes: '' }
  }

  const derivativeSrc = `/content/home/${derivativeWidth}/${fileName}`
  const srcset = `${derivativeSrc} ${derivativeWidth}w, ${path} 1280w`

  return { src: derivativeSrc, srcset, sizes }
}

export function applyImageSourceFallback(event, fallbackSrc) {
  const target = event?.target

  if (!(target instanceof HTMLImageElement)) {
    return
  }

  const fallback = String(fallbackSrc || '').trim()

  if (!fallback || target.dataset.imageFallbackApplied === '1') {
    return
  }

  target.dataset.imageFallbackApplied = '1'
  target.removeAttribute('srcset')
  target.removeAttribute('sizes')
  target.src = fallback
}
