package com.craigvg.lichun_android.ui.screens.onboarding

import androidx.compose.animation.core.*
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.verticalScroll
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.*
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.alpha
import androidx.compose.ui.draw.scale
import androidx.compose.ui.draw.shadow
import androidx.compose.ui.graphics.Brush
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.craigvg.lichun_android.ui.theme.AppColors
import com.craigvg.lichun_android.ui.theme.AppSpacing
import com.craigvg.lichun_android.ui.theme.AppTypography
import kotlinx.coroutines.delay

/**
 * Welcome screen for new players starting their BaoLife journey
 * Ported from iOS WelcomeView.swift
 */
@Composable
fun WelcomeScreen(
    onBeginJourney: () -> Unit = {}
) {
    var isLoaded by remember { mutableStateOf(false) }

    // Animation states
    val infiniteTransition = rememberInfiniteTransition(label = "welcome")

    val imageFloat by infiniteTransition.animateFloat(
        initialValue = 0f,
        targetValue = -8f,
        animationSpec = infiniteRepeatable(
            animation = tween(3000, easing = EaseInOut),
            repeatMode = RepeatMode.Reverse
        ),
        label = "float"
    )

    val imageBreathe by infiniteTransition.animateFloat(
        initialValue = 1f,
        targetValue = 1.02f,
        animationSpec = infiniteRepeatable(
            animation = tween(2500, easing = EaseInOut),
            repeatMode = RepeatMode.Reverse
        ),
        label = "breathe"
    )

    val glowAlpha by infiniteTransition.animateFloat(
        initialValue = 0.3f,
        targetValue = 0.5f,
        animationSpec = infiniteRepeatable(
            animation = tween(2000, easing = EaseInOut),
            repeatMode = RepeatMode.Reverse
        ),
        label = "glow"
    )

    LaunchedEffect(Unit) {
        delay(100)
        isLoaded = true
    }

    Box(
        modifier = Modifier
            .fillMaxSize()
            .background(
                Brush.linearGradient(
                    colors = listOf(
                        AppColors.background,
                        AppColors.background
                    )
                )
            )
    ) {
        Column(
            modifier = Modifier
                .fillMaxSize()
                .verticalScroll(rememberScrollState())
                .padding(horizontal = AppSpacing.xl),
            horizontalAlignment = Alignment.CenterHorizontally
        ) {
            Spacer(modifier = Modifier.height(AppSpacing.xl))

            // Welcome message with gradient
            Column(
                horizontalAlignment = Alignment.CenterHorizontally,
                modifier = Modifier
                    .alpha(if (isLoaded) 1f else 0f)
            ) {
                Text(
                    text = "Welcome to",
                    style = AppTypography.headline,
                    color = AppColors.secondaryText
                )

                Spacer(modifier = Modifier.height(AppSpacing.sm))

                Text(
                    text = "BaoLife",
                    fontSize = 48.sp,
                    fontWeight = FontWeight.Bold,
                    color = AppColors.primary,
                    modifier = Modifier
                        .shadow(
                            elevation = 8.dp,
                            spotColor = AppColors.primary.copy(alpha = glowAlpha)
                        )
                )
            }

            Spacer(modifier = Modifier.height(AppSpacing.lg))

            // Subtitle in a cozy card
            Card(
                modifier = Modifier
                    .fillMaxWidth()
                    .alpha(if (isLoaded) 1f else 0f),
                shape = RoundedCornerShape(AppSpacing.cornerRadius),
                colors = CardDefaults.cardColors(
                    containerColor = AppColors.surfaceElevated.copy(alpha = 0.8f)
                )
            ) {
                Text(
                    text = "Your journey begins here. Create a unique character, make meaningful choices, and experience the beautiful complexity of life in a warm, welcoming world.",
                    style = AppTypography.body,
                    color = AppColors.primaryText,
                    textAlign = TextAlign.Center,
                    modifier = Modifier.padding(AppSpacing.md)
                )
            }

            Spacer(modifier = Modifier.height(AppSpacing.xl))

            // Animated placeholder for image
            Box(
                modifier = Modifier
                    .size(280.dp)
                    .offset(y = imageFloat.dp)
                    .scale(imageBreathe)
                    .alpha(if (isLoaded) 1f else 0f)
                    .background(
                        Brush.linearGradient(
                            colors = listOf(
                                AppColors.primary.copy(alpha = 0.2f),
                                AppColors.accent.copy(alpha = 0.2f)
                            )
                        ),
                        RoundedCornerShape(AppSpacing.cornerRadius)
                    ),
                contentAlignment = Alignment.Center
            ) {
                Icon(
                    imageVector = Icons.Default.Face,
                    contentDescription = null,
                    tint = AppColors.primary,
                    modifier = Modifier.size(120.dp)
                )
            }

            Spacer(modifier = Modifier.height(AppSpacing.lg))

            // Inviting features list
            Column(
                verticalArrangement = Arrangement.spacedBy(AppSpacing.sm),
                modifier = Modifier.alpha(if (isLoaded) 1f else 0f)
            ) {
                FeaturePill(
                    icon = Icons.Default.AutoAwesome,
                    text = "AI-powered life simulation"
                )
                FeaturePill(
                    icon = Icons.Default.Favorite,
                    text = "Build meaningful relationships"
                )
                FeaturePill(
                    icon = Icons.Default.Star,
                    text = "Shape your unique story"
                )
            }

            Spacer(modifier = Modifier.height(AppSpacing.xl))

            // Call to action
            Button(
                onClick = onBeginJourney,
                modifier = Modifier
                    .fillMaxWidth()
                    .height(AppSpacing.buttonHeight)
                    .alpha(if (isLoaded) 1f else 0f),
                colors = ButtonDefaults.buttonColors(
                    containerColor = AppColors.primary
                ),
                shape = RoundedCornerShape(AppSpacing.cornerRadius)
            ) {
                Text(
                    text = "Begin Your Journey",
                    style = AppTypography.button
                )
            }

            Spacer(modifier = Modifier.height(AppSpacing.lg))
        }
    }
}

@Composable
private fun FeaturePill(
    icon: ImageVector,
    text: String
) {
    Row(
        modifier = Modifier
            .fillMaxWidth()
            .background(
                AppColors.surfaceElevated.copy(alpha = 0.6f),
                RoundedCornerShape(AppSpacing.pillCornerRadius)
            )
            .padding(horizontal = AppSpacing.md, vertical = AppSpacing.sm),
        verticalAlignment = Alignment.CenterVertically
    ) {
        Icon(
            imageVector = icon,
            contentDescription = null,
            tint = AppColors.primary,
            modifier = Modifier.size(20.dp)
        )
        Spacer(modifier = Modifier.width(AppSpacing.sm))
        Text(
            text = text,
            style = AppTypography.body,
            color = AppColors.primaryText
        )
    }
}