import type { Block } from 'payload'
import { anchorField } from '@/fields/anchorField'

export const FDVideoBlock: Block = {
  slug: 'fdVideo',
  imageURL: '/block-thumbnails/fd-video.png',
  imageAltText: 'FD Video',
  interfaceName: 'FDVideoBlock',
  labels: {
    singular: 'FD Video',
    plural: 'FD Videor',
  },
  fields: [
    // --- Content fields ---
    {
      name: 'heading',
      type: 'text',
      localized: true,
      label: 'Rubrik (valfri)',
    },
    {
      name: 'description',
      type: 'textarea',
      localized: true,
      label: 'Beskrivning (valfri)',
    },
    // --- Video source ---
    {
      name: 'videoSource',
      type: 'select',
      label: 'Videokälla',
      required: true,
      defaultValue: 'upload',
      options: [
        { label: 'Uppladdad video', value: 'upload' },
        { label: 'YouTube', value: 'youtube' },
        { label: 'Vimeo', value: 'vimeo' },
      ],
    },
    // Upload field
    {
      name: 'videoFile',
      type: 'upload',
      relationTo: 'media',
      label: 'Videofil',
      admin: {
        condition: (_, siblingData) => siblingData?.videoSource === 'upload',
        description: 'Ladda upp en MP4, WebM eller annan videofil',
      },
    },
    // YouTube URL
    {
      name: 'youtubeUrl',
      type: 'text',
      label: 'YouTube URL',
      admin: {
        condition: (_, siblingData) => siblingData?.videoSource === 'youtube',
        description: 'Full YouTube-länk, t.ex. https://www.youtube.com/watch?v=abc123 eller https://youtu.be/abc123',
      },
    },
    // Vimeo URL
    {
      name: 'vimeoUrl',
      type: 'text',
      label: 'Vimeo URL',
      admin: {
        condition: (_, siblingData) => siblingData?.videoSource === 'vimeo',
        description: 'Full Vimeo-länk, t.ex. https://vimeo.com/123456789',
      },
    },
    // --- Thumbnail ---
    {
      name: 'thumbnail',
      type: 'upload',
      relationTo: 'media',
      label: 'Anpassad miniatyrbild (valfri)',
      admin: {
        description:
          'Ersätter standardminiatyrbilden. Visas innan videon spelas. Rekommenderad storlek: 1920×1080 (16:9) eller 1920×1200 (16:10)',
      },
    },
    // --- Aspect ratio ---
    {
      name: 'aspectRatio',
      type: 'select',
      label: 'Bildförhållande',
      defaultValue: '16/9',
      options: [
        { label: '16:9 (standard)', value: '16/9' },
        { label: '16:10', value: '16/10' },
      ],
    },
    // --- Autoplay / loop for uploaded ---
    {
      name: 'autoplay',
      type: 'checkbox',
      label: 'Autospela (mutat)',
      defaultValue: false,
      admin: {
        condition: (_, siblingData) => siblingData?.videoSource === 'upload',
        description: 'Spelar videon automatiskt utan ljud vid sidladdning',
      },
    },
    {
      name: 'loop',
      type: 'checkbox',
      label: 'Loopa',
      defaultValue: false,
      admin: {
        condition: (_, siblingData) => siblingData?.videoSource === 'upload',
      },
    },
    // --- Layout/style ---
    {
      name: 'maxWidth',
      type: 'select',
      label: 'Maxbredd',
      defaultValue: 'default',
      options: [
        { label: 'Standard (1200px)', value: 'default' },
        { label: 'Smal (900px)', value: 'narrow' },
        { label: 'Bred (1400px)', value: 'wide' },
      ],
    },
    {
      name: 'sectionBackground',
      type: 'select',
      label: 'Sektionsbakgrund',
      defaultValue: 'white',
      options: [
        { label: 'Vit', value: 'white' },
        { label: 'Navy', value: 'navy' },
        { label: 'Grå', value: 'gray' },
        { label: 'Gul', value: 'yellow' },
        { label: 'Transparent', value: 'transparent' },
      ],
    },
    {
      name: 'textColor',
      type: 'select',
      label: 'Textfärg',
      defaultValue: 'auto',
      options: [
        { label: 'Automatisk', value: 'auto' },
        { label: 'Navy', value: 'navy' },
        { label: 'Vit', value: 'white' },
      ],
    },
    anchorField,
  ],
}