package com.horrortv.app.presentation.home

import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.clickable
import androidx.compose.foundation.focusable
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusRequester
import androidx.compose.ui.focus.onFocusChanged
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.graphicsLayer
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.unit.dp
import com.horrortv.app.domain.model.Movie
import com.horrortv.app.presentation.common.PosterImage
import com.horrortv.app.presentation.theme.HorrorColors

private val CardShape = RoundedCornerShape(8.dp)
private val CardWidth = 180.dp
private val CardHeight = 270.dp

@Composable
fun MoviePosterCard(
    movie: Movie,
    onClick: () -> Unit,
    isFirstCard: Boolean = false,
    firstCardFocusRequester: FocusRequester? = null,
    modifier: Modifier = Modifier
) {
    var isFocused by remember { mutableStateOf(false) }
    val localFocusRequester = remember { FocusRequester() }
    val interactionSource = remember { MutableInteractionSource() }
    
    val activeFocusRequester = if (isFirstCard && firstCardFocusRequester != null) {
        firstCardFocusRequester
    } else {
        localFocusRequester
    }
    
    val scale = if (isFocused) 1.08f else 1.0f
    val borderW = if (isFocused) 8.dp else 1.dp
    val borderC = if (isFocused) Color.Red else HorrorColors.HorrorLightGray
    
    Box(
        modifier = modifier
            .width(CardWidth)
            .height(CardHeight)
            .graphicsLayer {
                scaleX = scale
                scaleY = scale
                shadowElevation = if (isFocused) 24.dp.toPx() else 0.dp.toPx()
                ambientShadowColor = if (isFocused) Color.Red else Color.Transparent
                spotShadowColor = if (isFocused) Color.Red else Color.Transparent
            }
            .clip(CardShape)
            .background(HorrorColors.HorrorGray)
            .border(borderW, borderC, CardShape)
            .focusRequester(activeFocusRequester)
            .focusable(interactionSource = interactionSource)
            .onFocusChanged { isFocused = it.isFocused }
            .clickable(interactionSource = interactionSource, indication = null, onClick = onClick)
    ) {
        PosterImage(
            url = movie.posterUrl,
            contentDescription = movie.title,
            modifier = Modifier.fillMaxSize(),
            contentScale = ContentScale.Crop,
            shape = CardShape
        )
        
        if (isFocused) {
            Box(
                modifier = Modifier
                    .fillMaxSize()
                    .background(Color.Red.copy(alpha = 0.2f))
            )
        }
    }
}