package com.example.kmptpc_compose_sample.demos.navigation

import androidx.compose.animation.core.tween
import androidx.compose.animation.fadeIn
import androidx.compose.animation.fadeOut
import androidx.compose.animation.slideInHorizontally
import androidx.compose.animation.slideOutHorizontally
import androidx.compose.foundation.gestures.detectHorizontalDragGestures
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.material.Button
import androidx.compose.material.Card
import androidx.compose.material.MaterialTheme
import androidx.compose.material.OutlinedButton
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.input.pointer.pointerInput
import androidx.compose.ui.platform.LocalDensity
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import androidx.navigation.compose.NavHost
import androidx.navigation.compose.composable
import androidx.navigation.compose.rememberNavController

/**
 * 仅用于测试「导航 + 手势」的 Demo：
 * - 使用 NavHost + composable，与 NavigationLibraryTestDemo 结构类似但不改原 Demo。
 * - 支持横向滑动手势触发导航：向右滑返回，向左滑下一页（若有）。
 */
@Composable
internal fun NavigationGestureDemoScreen() {
    val navController = rememberNavController()

    Column(Modifier.fillMaxSize().padding(16.dp)) {
        Text(
            "导航手势测试",
            style = MaterialTheme.typography.h6,
            modifier = Modifier.padding(bottom = 4.dp)
        )
        Text(
            "横向滑动：向右滑返回，向左滑下一页。也可用底部按钮。",
            style = MaterialTheme.typography.caption,
            modifier = Modifier.padding(bottom = 12.dp)
        )

        Card(
            modifier = Modifier
                .fillMaxWidth()
                .weight(1f),
            elevation = 4.dp,
            backgroundColor = MaterialTheme.colors.surface
        ) {
            NavHost(
                navController = navController,
                startDestination = "g1",
                modifier = Modifier.fillMaxSize(),
                enterTransition = {
                    slideInHorizontally(
                        animationSpec = tween(300),
                        initialOffsetX = { -it }
                    ) + fadeIn(animationSpec = tween(200))
                },
                exitTransition = {
                    slideOutHorizontally(
                        animationSpec = tween(300),
                        targetOffsetX = { -it }
                    ) + fadeOut(animationSpec = tween(200))
                },
                popEnterTransition = {
                    slideInHorizontally(
                        animationSpec = tween(300),
                        initialOffsetX = { it }
                    ) + fadeIn(animationSpec = tween(200))
                },
                popExitTransition = {
                    slideOutHorizontally(
                        animationSpec = tween(300),
                        targetOffsetX = { it }
                    ) + fadeOut(animationSpec = tween(200))
                }
            ) {
                composable("g1") {
                    NavGesturePage(
                        title = "第 1 页",
                        hint = "向左滑 → 下一页",
                        onNext = { navController.navigate("g2") },
                        onBack = null
                    )
                }
                composable("g2") {
                    NavGesturePage(
                        title = "第 2 页",
                        hint = "向右滑 ← 返回 · 向左滑 → 下一页",
                        onNext = { navController.navigate("g3") },
                        onBack = { navController.popBackStack() }
                    )
                }
                composable("g3") {
                    NavGesturePage(
                        title = "第 3 页",
                        hint = "向右滑 ← 返回",
                        onNext = null,
                        onBack = { navController.popBackStack() }
                    )
                }
            }
        }
    }
}

@Composable
private fun NavGesturePage(
    title: String,
    hint: String,
    onNext: (() -> Unit)?,
    onBack: (() -> Unit)?
) {
    val density = LocalDensity.current
    val thresholdPx = with(density) { 80.dp.toPx() }

    val gestureModifier = Modifier.pointerInput(onBack, onNext) {
        var totalDrag = 0f
        detectHorizontalDragGestures(
            onDragStart = { totalDrag = 0f },
            onDragEnd = {
                when {
                    totalDrag > thresholdPx && onBack != null -> onBack()
                    totalDrag < -thresholdPx && onNext != null -> onNext()
                }
            },
            onHorizontalDrag = { _, dragAmount -> totalDrag += dragAmount }
        )
    }

    Column(
        modifier = Modifier
            .fillMaxSize()
            .padding(24.dp)
            .then(gestureModifier),
        verticalArrangement = Arrangement.SpaceBetween
    ) {
        Column {
            Text(title, style = MaterialTheme.typography.h5)
            Spacer(Modifier.height(8.dp))
            Text(
                hint,
                style = MaterialTheme.typography.body2,
                fontSize = 14.sp
            )
        }
        Row(
            modifier = Modifier.fillMaxWidth(),
            horizontalArrangement = Arrangement.SpaceBetween
        ) {
            if (onBack != null) {
                OutlinedButton(onClick = onBack) { Text("返回") }
            } else {
                Spacer(Modifier)
            }
            if (onNext != null) {
                Button(onClick = onNext) { Text("下一页") }
            } else {
                Spacer(Modifier)
            }
        }
    }
}
