//
//  WorkoutView.swift
//  Keging
//
//  운동 진행 화면 — 국면 원이 수축 때 줄고 이완 때 커진다. 중단 시 이 세트는 기록 없음.
//

import SwiftUI

struct WorkoutView: View {
    @EnvironmentObject private var engine: KegelEngine
    @State private var confirmStop = false

    var body: some View {
        ZStack {
            AppTheme.background.ignoresSafeArea()
            switch engine.state {
            case let .running(phase, rep, phaseStart, phaseEnd):
                runningView(phase: phase, rep: rep, phaseStart: phaseStart, phaseEnd: phaseEnd)
            case let .finished(reps):
                finishedView(reps: reps)
            case .idle:
                Color.clear
            }
        }
        .onAppear {
            #if DEBUG
            if CommandLine.arguments.contains("-confirmStop") { confirmStop = true }
            #endif
        }
    }

    private func runningView(phase: KegelPhase, rep: Int, phaseStart: Date, phaseEnd: Date) -> some View {
        let phaseColor = Self.color(for: phase)
        let progress = phase == .prepare
            ? 0
            : (Double(rep - 1) + (phase == .relax ? 0.5 : 0)) / Double(max(1, engine.config.reps))
        return VStack(spacing: 0) {
            HStack(alignment: .firstTextBaseline, spacing: 5) {
                Text(verbatim: "\(rep)")
                    .font(.system(size: 46, weight: .bold))
                    .monospacedDigit()
                    .foregroundStyle(phaseColor)
                    .contentTransition(.numericText())
                    .animation(.snappy, value: rep)
                Text(verbatim: "/ \(engine.config.reps)")
                    .font(.title3.weight(.semibold))
                    .monospacedDigit()
                    .foregroundStyle(.secondary)
            }
            .padding(.top, 16)
            .accessibilityElement(children: .ignore)
            .accessibilityLabel(Text("현재 \(rep)번째, 전체 \(engine.config.reps)회"))

            Spacer()

            ZStack {
                // 세트 진행 링 — 국면 색으로 채워진다
                Circle()
                    .stroke(AppTheme.surface, lineWidth: 10)
                    .frame(width: 344, height: 344)
                Circle()
                    .trim(from: 0, to: progress)
                    .stroke(phaseColor.opacity(0.85), style: StrokeStyle(lineWidth: 10, lineCap: .round))
                    .rotationEffect(.degrees(-90))
                    .frame(width: 344, height: 344)
                    .animation(.easeInOut(duration: 0.5), value: progress)
                PhaseCircle(phase: phase, phaseStart: phaseStart, phaseEnd: phaseEnd)
                VStack(spacing: 6) {
                    Text(phase.label)
                        .font(.system(size: 44, weight: .bold))
                    Text(timerInterval: phaseStart...phaseEnd, countsDown: true)
                        .font(.title2.weight(.medium))
                        .monospacedDigit()
                        .opacity(0.85)
                }
                .foregroundStyle(Self.textColor(for: phase))
            }

            Spacer()

            // 중단 확인 — 버튼 자리에서 바로 펼쳐지는 인라인 방식 (하단 시트가 뚝 떨어져 보이던 문제 해소)
            Group {
                if confirmStop {
                    VStack(spacing: 12) {
                        Text("중단하면 이 세트는 기록되지 않아요.")
                            .font(.footnote)
                            .foregroundStyle(.secondary)
                        HStack(spacing: 12) {
                            Button {
                                withAnimation(.snappy) { confirmStop = false }
                            } label: {
                                Text("계속하기")
                                    .font(.headline)
                                    .frame(maxWidth: .infinity)
                            }
                            .buttonStyle(.borderedProminent)
                            Button(role: .destructive) {
                                engine.stop()
                            } label: {
                                Text("중단하기")
                                    .font(.headline)
                                    .frame(maxWidth: .infinity)
                            }
                            .buttonStyle(.bordered)
                            .tint(.red)
                        }
                    }
                    .padding(.horizontal, 24)
                    .transition(.scale(scale: 0.9).combined(with: .opacity))
                } else {
                    Button {
                        withAnimation(.snappy) { confirmStop = true }
                    } label: {
                        Text("중단")
                            .font(.headline)
                            .frame(maxWidth: 160)
                    }
                    .buttonStyle(.bordered)
                    .tint(.red)
                    .transition(.scale(scale: 0.9).combined(with: .opacity))
                }
            }
            .padding(.bottom, 30)
        }
    }

    /// 준비=차분한 회그린, 수축=그린, 이완=앰버
    static func color(for phase: KegelPhase) -> Color {
        switch phase {
        case .prepare: Color(light: Color(hex: "#7C8A81"), dark: Color(hex: "#5E6B64"))
        case .contract: AppTheme.green
        case .relax: AppTheme.yellow
        }
    }

    static func textColor(for phase: KegelPhase) -> Color {
        switch phase {
        case .prepare: Color(light: .white, dark: Color(hex: "#10140F"))
        case .contract: Color(light: .white, dark: Color(hex: "#0F2018"))
        case .relax: Color(hex: "#33260A")
        }
    }

    private func finishedView(reps: Int) -> some View {
        VStack(spacing: 18) {
            Image(systemName: "checkmark.circle.fill")
                .font(.system(size: 84))
                .foregroundStyle(AppTheme.green)
            Text("완료!")
                .font(.largeTitle.bold())
            Text("\(reps)회를 모두 마쳤어요.")
                .font(.body)
                .foregroundStyle(.secondary)
            Button {
                engine.acknowledgeFinish()
            } label: {
                Text("확인")
                    .font(.headline)
                    .frame(maxWidth: 160)
            }
            .buttonStyle(.borderedProminent)
            .padding(.top, 12)
        }
    }
}

/// 수축이면 오므라들고 이완이면 부풀어 오르는 국면 원 — 색도 국면 따라(수축 그린·이완 앰버)
private struct PhaseCircle: View {
    let phase: KegelPhase
    let phaseStart: Date
    let phaseEnd: Date

    @State private var scale: CGFloat = 1

    private var color: Color { WorkoutView.color(for: phase) }

    var body: some View {
        Circle()
            .fill(
                LinearGradient(
                    colors: [color, color.opacity(0.8)],
                    startPoint: .top, endPoint: .bottom
                )
            )
            .frame(width: 300, height: 300)
            .scaleEffect(scale)
            .shadow(color: color.opacity(0.3), radius: 26, x: 0, y: 10)
            .animation(.easeInOut(duration: 0.4), value: phase)
            .onAppear { animate() }
            .onChange(of: phase) { animate() }
    }

    private func animate() {
        let duration = max(0.3, phaseEnd.timeIntervalSince(phaseStart))
        // 준비: 작게 → 천천히 부풀며 첫 수축(가득 찬 원에서 오므리기)에 이어짐
        let (from, to): (CGFloat, CGFloat) = switch phase {
        case .prepare: (0.62, 1.0)
        case .contract: (1.0, 0.62)
        case .relax: (0.62, 1.0)
        }
        var transaction = Transaction()
        transaction.disablesAnimations = true
        withTransaction(transaction) { scale = from }
        withAnimation(.easeInOut(duration: duration)) { scale = to }
    }
}