import SwiftUI

enum ToastState {
    case loading
    case complete
}

struct LoadingToast: View {
    let message: String
    let subtitle: String?
    @State private var auraOffset: CGFloat = -1.2
    @ObservedObject private var generationManager = SongGenerationManager.shared
    
    init(message: String = "Your groove is on the way!", subtitle: String? = "Tap here to view workspace") {
        self.message = message
        self.subtitle = subtitle
    }
    
    var body: some View {
        HStack(spacing: 12) {
            // Left side content based on state
            if generationManager.generationState == .completed {
                // Artwork stack for complete state
                ArtworkStack()
            }
            
            // Text content
            VStack(alignment: .leading, spacing: 0) {
                Text(generationManager.generationState == .completed ? "Song ready, tap to play!" : message)
                    .font(Constants.Typography.small)
                    .foregroundColor(.white)
                    .tracking(0.28)
                    .lineLimit(1)
                
                if let displaySubtitle = generationManager.generationState == .completed ? "Tap here to view workspace" : subtitle {
                    Text(displaySubtitle)
                        .font(Constants.Typography.xSmallTitle)
                        .foregroundColor(.white.opacity(0.5))
                        .tracking(0.24)
                        .lineLimit(1)
                }
            }
            
            Spacer()
            
            // Right side content based on state
            if generationManager.generationState == .generating {
                LoadingSpinner()
            } else {
                MediumButton.auraIcon("Icon/play") {
                    print("Play button tapped")
                }
            }
        }
        .padding(.leading, 24)
        .padding(.trailing, 16)
        .padding(.vertical, 10)
        .background(
            RoundedRectangle(cornerRadius: 100)
                .fill(Constants.Colors.Background.Smoke.dense)
                .background(.ultraThinMaterial, in: RoundedRectangle(cornerRadius: 100))
                .overlay(
                    RoundedRectangle(cornerRadius: 100)
                        .stroke(Color.white.opacity(0.2), lineWidth: 0.5)
                )
        )
        .overlay(
            // Aura shimmer effect
            LinearGradient(
                stops: [
                    Gradient.Stop(color: Color(red: 1, green: 0.68, blue: 0.01).opacity(0), location: 0.00),
                    Gradient.Stop(color: Color(red: 1, green: 0.59, blue: 0.04), location: 0.25),
                    Gradient.Stop(color: Color(red: 1, green: 0.3, blue: 0.15), location: 0.50),
                    Gradient.Stop(color: Color(red: 1, green: 0.24, blue: 0.47), location: 0.75),
                    Gradient.Stop(color: Color(red: 1, green: 0.68, blue: 0.01).opacity(0), location: 1.00),
                ],
                startPoint: UnitPoint(x: 0, y: 0.36),
                endPoint: UnitPoint(x: 0.97, y: 0.9)
            )
            .opacity(0.2)
            .scaleEffect(x: 1.8, y: 1.0, anchor: .center)
            .offset(x: auraOffset * 200) // Use fixed offset instead of geometry-based
            .clipShape(RoundedRectangle(cornerRadius: 100))
        )
        .shadow(color: .black.opacity(0.12), radius: 6, x: 0, y: 0)
        .onAppear {
            startAnimations()
        }
    }
    
    private func startAnimations() {
        // Start aura shimmer ping pong animation with smoother timing
        withAnimation(.easeInOut(duration: 3.0).repeatForever(autoreverses: true)) {
            auraOffset = 1.2
        }
    }
}

struct LoadingSpinner: View {
    @State private var isSpinning = false
    
    var body: some View {
        Image("Small Loader")
            .resizable()
            .frame(width: 40, height: 40)
            .rotationEffect(.degrees(isSpinning ? 360 : 0))
            .animation(.linear(duration: 1.0).repeatForever(autoreverses: false), value: isSpinning)
            .onAppear {
                isSpinning = true
            }
    }
}

struct ArtworkStack: View {
    var body: some View {
        ZStack {
            // Back artwork (rotated left)
            Image("Artwork/2")
                .resizable()
                .aspectRatio(contentMode: .fill)
                .frame(width: 25, height: 34)
                .clipShape(RoundedRectangle(cornerRadius: 6))
                .rotationEffect(.degrees(-7))
                .shadow(color: .black.opacity(0.25), radius: 7, x: 0, y: 0)
                .offset(x: -6, y: 1)
            
            // Front artwork (rotated right)
            Image("Artwork/8")
                .resizable()
                .aspectRatio(contentMode: .fill)
                .frame(width: 25, height: 34)
                .clipShape(RoundedRectangle(cornerRadius: 6))
                .rotationEffect(.degrees(8))
                .shadow(color: .black.opacity(0.25), radius: 7, x: 0, y: 0)
                .offset(x: 6, y: -1)
        }
        .frame(width: 40, height: 40)
    }
}


// MARK: - Preview
#Preview {
    VStack(spacing: 20) {
        LoadingToast()
    }
    .padding()
    .background(Constants.Colors.Background.primary)
}