package com.example.kmptpc_compose_sample.demos.foundation

import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.heightIn
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.text.BasicTextField
import androidx.compose.foundation.text.input.TextFieldState
import androidx.compose.foundation.verticalScroll
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
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.graphics.Color
import androidx.compose.ui.unit.dp

/**
 * Demo 对比两种文本框的选择手势行为：
 *
 * 1. Legacy：BasicTextField(value, onValueChange) → CoreTextField → textFieldPointer。
 *    OHOS 走 cupertinoTapOnlyTextFieldPointer（单击/双击/三击 + 长按选词并拖拽）；iOS 走 cupertinoTextFieldPointer（长按+拖拽仅移动光标）。
 *
 * 2. 新文本框（BTF2）：BasicTextField(state: TextFieldState) → TextFieldSelectionState。
 *    各平台 actual（如 OHOS TextFieldSelectionState.ohos.kt）：单击/长按选词并拖拽/双击选词/三击选段。
 *
 * 在 OHOS 上两种路径手势一致：单击定位、双击选词、三击选段、长按选词并拖拽扩展。
 */
@Composable
internal fun FoundationTextFieldSelectionGestureDemo() {
    val scrollState = rememberScrollState()

    // Legacy：value + onValueChange → CoreTextField
    var legacyMultiLine by remember {
        mutableStateOf(
            "第一段：Legacy 多行。\n" +
            "OHOS 上与 BTF2 手势一致：单击定位、双击选词、三击选段、长按选词并拖拽扩展。\n\n" +
            "第二段：Compare with BTF2 below.\n\n" +
            "第三段：可对比 Legacy 与 BTF2 在同一平台下的表现。"
        )
    }
    var legacySingleLine by remember {
        mutableStateOf("Legacy 单行：BasicTextField(value, onValueChange) → CoreTextField。")
    }

    // 新文本框 BTF2：state: TextFieldState → TextFieldSelectionState
    val btf2MultiLineState = remember {
        TextFieldState(
            "第一段：BTF2 多行。\n" +
            "单击定位光标；长按选词并拖拽扩展；双击选词、三击选段。\n\n" +
            "第二段：Double-tap word, triple-tap paragraph.\n\n" +
            "第三段：走 TextFieldSelectionState 各平台 actual（如 OHOS TextFieldSelectionState.ohos.kt）。"
        )
    }
    val btf2SingleLineState = remember {
        TextFieldState("BTF2 单行：BasicTextField(state: TextFieldState) → TextFieldSelectionState。")
    }

    Column(
        modifier = Modifier
            .verticalScroll(scrollState)
            .padding(16.dp)
    ) {
        Text(
            "文本框选择手势（Legacy vs BTF2）",
            style = MaterialTheme.typography.h6,
            modifier = Modifier.padding(bottom = 8.dp)
        )
        Text(
            "上为 Legacy（value/onValueChange → CoreTextField）；下为 BTF2（state → TextFieldSelectionState）。在 OHOS 上两种路径手势一致：单击/双击/三击/长按选词并拖拽。",
            style = MaterialTheme.typography.caption,
            modifier = Modifier.padding(bottom = 16.dp)
        )

        // ---------- Legacy ----------
        Text(
            "Legacy：BasicTextField(value, onValueChange) → CoreTextField → LegacyTextFieldState + textFieldPointer",
            style = MaterialTheme.typography.subtitle1,
            color = Color.Gray,
            modifier = Modifier.padding(bottom = 8.dp)
        )
        Text(
            "Legacy 多行",
            style = MaterialTheme.typography.caption,
            modifier = Modifier.padding(bottom = 4.dp)
        )
        BasicTextField(
            value = legacyMultiLine,
            onValueChange = { legacyMultiLine = it },
            modifier = Modifier
                .fillMaxWidth()
                .heightIn(min = 120.dp)
                .border(1.dp, Color.Gray, RoundedCornerShape(4.dp))
                .background(MaterialTheme.colors.surface)
                .padding(12.dp)
        )

        Spacer(Modifier.height(12.dp))

        Text(
            "Legacy 单行",
            style = MaterialTheme.typography.caption,
            modifier = Modifier.padding(bottom = 4.dp)
        )
        BasicTextField(
            value = legacySingleLine,
            onValueChange = { legacySingleLine = it },
            modifier = Modifier
                .fillMaxWidth()
                .border(1.dp, Color.Gray, RoundedCornerShape(4.dp))
                .background(MaterialTheme.colors.surface)
                .padding(12.dp)
        )

        Spacer(Modifier.height(24.dp))

        // ---------- BTF2 ----------
        Text(
            "新文本框（BTF2）：BasicTextField(state: TextFieldState) → TextFieldSelectionState → getTextFieldSelectionGestures / detectTextFieldTapGestures",
            style = MaterialTheme.typography.subtitle1,
            color = MaterialTheme.colors.primary,
            modifier = Modifier.padding(bottom = 8.dp)
        )
        Text(
            "BTF2 多行（可试三击选段）",
            style = MaterialTheme.typography.caption,
            modifier = Modifier.padding(bottom = 4.dp)
        )
        BasicTextField(
            state = btf2MultiLineState,
            modifier = Modifier
                .fillMaxWidth()
                .heightIn(min = 120.dp)
                .border(1.dp, Color.Blue, RoundedCornerShape(4.dp))
                .background(MaterialTheme.colors.surface)
                .padding(12.dp)
        )

        Spacer(Modifier.height(12.dp))

        Text(
            "BTF2 单行（可试双击选词）",
            style = MaterialTheme.typography.caption,
            modifier = Modifier.padding(bottom = 4.dp)
        )
        BasicTextField(
            state = btf2SingleLineState,
            modifier = Modifier
                .fillMaxWidth()
                .border(1.dp, Color.Blue, RoundedCornerShape(4.dp))
                .background(MaterialTheme.colors.surface)
                .padding(12.dp)
        )
    }
}
