package coffee.liz.abstractionengine.ui

import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp

enum class Direction {
    UP, DOWN, LEFT, RIGHT
}

@Composable
fun DPad(
    onDirectionPressed: (Direction) -> Unit,
    modifier: Modifier = Modifier
) {
    Box(
        modifier = modifier
            .size(140.dp)
            .background(
                color = MaterialTheme.colorScheme.surfaceVariant.copy(alpha = 0.6f),
                shape = CircleShape
            )
            .border(1.dp, MaterialTheme.colorScheme.outline, CircleShape)
    ) {
        // Up button
        DirectionButton(
            text = "▲",
            onClick = { onDirectionPressed(Direction.UP) },
            modifier = Modifier
                .align(Alignment.TopCenter)
                .offset(y = 20.dp)
        )

        // Down button
        DirectionButton(
            text = "▼",
            onClick = { onDirectionPressed(Direction.DOWN) },
            modifier = Modifier
                .align(Alignment.BottomCenter)
                .offset(y = (-20).dp)
        )

        // Left button
        DirectionButton(
            text = "◀",
            onClick = { onDirectionPressed(Direction.LEFT) },
            modifier = Modifier
                .align(Alignment.CenterStart)
                .offset(x = 20.dp)
        )

        // Right button
        DirectionButton(
            text = "▶",
            onClick = { onDirectionPressed(Direction.RIGHT) },
            modifier = Modifier
                .align(Alignment.CenterEnd)
                .offset(x = (-20).dp)
        )

        // Center circle
        Box(
            modifier = Modifier
                .align(Alignment.Center)
                .size(38.dp)
                .background(
                    color = MaterialTheme.colorScheme.surface.copy(alpha = 0.5f),
                    shape = CircleShape
                )
                .border(1.dp, MaterialTheme.colorScheme.outline, CircleShape)
        )
    }
}

@Composable
private fun DirectionButton(
    text: String,
    onClick: () -> Unit,
    modifier: Modifier = Modifier
) {
    Button(
        onClick = onClick,
        modifier = modifier.size(38.dp),
        shape = RoundedCornerShape(4.dp),
        colors = ButtonDefaults.buttonColors(
            containerColor = MaterialTheme.colorScheme.surfaceVariant.copy(alpha = 0.6f),
            contentColor = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.3f)
        ),
        contentPadding = PaddingValues(0.dp)
    ) {
        Text(
            text = text,
            fontSize = 14.sp,
            style = MaterialTheme.typography.headlineMedium
        )
    }
}