//
//  ClockView.swift
//  TheNoiseClock
//
//  Created by Matt Bruce on 9/7/25.
//

import SwiftUI

/// Main clock display view with settings and display mode
struct ClockView: View {
    
    // MARK: - Properties
    @State private var viewModel = ClockViewModel()
    @State private var showSettings = false
    
    // MARK: - Body
    var body: some View {
        ZStack {
            viewModel.style.backgroundColor
                .ignoresSafeArea()
            
            GeometryReader { geometry in
                ZStack {
                    // Main clock display container
                    ClockDisplayContainer(
                        currentTime: viewModel.currentTime,
                        style: viewModel.style,
                        isDisplayMode: viewModel.isDisplayMode
                    )
                    
                    // Top overlay container
                    ClockOverlayContainer(style: viewModel.style)
                }
            }
        }
        .ignoresSafeArea(.all, edges: viewModel.isDisplayMode ? .bottom : [])
        .statusBarHidden(viewModel.isDisplayMode)
        .sheet(isPresented: $showSettings) {
            ClockSettingsView(style: viewModel.style) { newStyle in
                viewModel.updateStyle(newStyle)
            }
            .presentationDetents(UIDevice.current.userInterfaceIdiom == .pad ? [.large] : [.medium, .large])
            .presentationDragIndicator(.visible)
            .presentationBackgroundInteraction(.enabled)
        }
        .overlay {
            // Toolbar overlay
            ClockToolbar(
                isDisplayMode: viewModel.isDisplayMode,
                onSettingsTap: { showSettings = true }
            )
        }
        .overlay {
            // Tab bar management overlay
            ClockTabBarManager(isDisplayMode: viewModel.isDisplayMode)
        }
        .overlay {
            // Gesture handling overlay
            ClockGestureHandler {
                viewModel.toggleDisplayMode()
            }
        }
    }
}

// MARK: - Preview
#Preview {
    NavigationStack {
        ClockView()
    }
    .frame(width: 400, height: 600)
    .background(Color.black)
}
