//
//  CreateIconView.swift
//  Feels (iOS)
//
//  Created by Trey Tartt on 2/13/22.
//

import SwiftUI

struct CreateIconView: View {
    @AppStorage(UserDefaultsStore.Keys.customIcon.rawValue, store: GroupUserDefaults.groupDefaults) private var savedCustomIcon = Data()
    
    @AppStorage(UserDefaultsStore.Keys.theme.rawValue, store: GroupUserDefaults.groupDefaults) private var theme: Theme = .system
    
    static var iconViewBGs: [(BackGroundOptions, UUID)] = {
        var blah = [(BackGroundOptions, UUID)]()
        for _ in 0...99 {
            blah.append((BackGroundOptions.selectable.randomElement()!, UUID()))
        }
        return blah
    }()
    
    @State private var mouth: MouthOptions = MouthOptions.defaultOption
    @StateObject private var customIcon = CustomIcon(leftEye: EyeOptions.defaultOption,
                                                     rightEye: EyeOptions.defaultOption,
                                                     mouth: MouthOptions.defaultOption,
                                                     background: CreateIconView.iconViewBGs,
                                                     bgColor: .red,
                                                     innerColor: .green,
                                                     bgOverlayColor: .black,
                                                     rightEyeColor: .orange,
                                                     leftEyeColor: .yellow,
                                                     mouthColor: .purple,
                                                     circleStrokeColor: .pink)
    private var randomElements: [AnyView] = [
        AnyView(Image(BackGroundOptions.selectable.randomElement()!.rawValue)
                    .resizable()
                    .frame(width: 20, height: 20)),
        AnyView(Image(BackGroundOptions.selectable.randomElement()!.rawValue)
                    .resizable()
                    .frame(width: 20, height: 20)),
        AnyView(Image(BackGroundOptions.selectable.randomElement()!.rawValue)
                    .resizable()
                    .frame(width: 20, height: 20)),
        AnyView(Image(BackGroundOptions.selectable.randomElement()!.rawValue)
                    .resizable()
                    .frame(width: 20, height: 20))
    ]
    
    func update(eye: Eyes, eyeOption: EyeOptions) {
        switch eye {
        case .left:
            customIcon.leftEye = eyeOption
        case .right:
            customIcon.rightEye = eyeOption
        }
    }
    
    func createRandom() {
        customIcon.bgColor = Color.random()
        customIcon.innerColor = Color.random()
        customIcon.bgOverlayColor = Color.random()
        customIcon.circleStrokeColor = Color.random()
        customIcon.leftEyeColor = Color.random()
        customIcon.rightEyeColor = Color.random()
        customIcon.mouthColor = Color.random()
        
        update(eye: .left, eyeOption: EyeOptions.allCases.randomElement()!)
        update(eye: .right, eyeOption: EyeOptions.allCases.randomElement()!)
        update(mouthOption: MouthOptions.allCases.randomElement()!)
        
        update(background: BackGroundOptions.allCases.randomElement()!)
    }
    
    func update(mouthOption: MouthOptions) {
        customIcon.mouth = mouthOption
    }
    
    func update(background: BackGroundOptions) {
        customIcon.background.removeAll()
        
        if background == .random {
            for _ in 0...CustomIcon.numberOfBGItems {
                customIcon.background.append((BackGroundOptions.selectable.randomElement()!, UUID()))
            }
            return
        }
        for _ in 0...CustomIcon.numberOfBGItems {
            customIcon.background.append((background, UUID()))
        }
    }
    
    var mixBG: some View {
        VStack {
            HStack {
                randomElements[0]
                randomElements[1]
            }
            HStack {
                randomElements[2]
                randomElements[3]
            }
        }
    }
    
    var iconView: some View {
        IconView(customIcon: customIcon, isPreview: true)
    }
    
    var body: some View {
        VStack(spacing: 0) {
            iconView
                .frame(width: 256, height: 256)
                .cornerRadius(10)
                .padding(.top)
            
            Spacer()
            
            Divider().background(Color(UIColor.tertiarySystemBackground))
            
            Group {
                HStack(alignment: .center) {
                    Spacer()
                    VStack(alignment: .center) {
                        Menu("Left Eye") {
                            ForEach(EyeOptions.allCases, id: \.self) { option in
                                Button(action: {
                                    update(eye: .left, eyeOption: option)
                                }, label: {
                                    Label(option.rawValue, image: option.rawValue)
                                })
                            }
                        }
                        .foregroundColor(Color(UIColor.label))
                    }
                    Spacer()
                    VStack(alignment: .center) {
                        Menu("Right Eye") {
                            ForEach(EyeOptions.allCases, id: \.self) { option in
                                Button(action: {
                                    update(eye: .right, eyeOption: option)
                                }, label: {
                                    Label(option.rawValue, image: option.rawValue)
                                })
                            }
                        }
                        .foregroundColor(Color(UIColor.label))
                    }
                    Spacer()
                    VStack(alignment: .center) {
                        Menu("Mouth") {
                            ForEach(MouthOptions.allCases, id: \.self) { option in
                                Button(action: {
                                    update(mouthOption: option)
                                }, label: {
                                    Label(option.rawValue, image: option.rawValue)
                                })
                            }
                        }
                        .foregroundColor(Color(UIColor.label))
                    }
                    Spacer()
                }
                .padding()
                .background(
                    Color(uiColor: theme.currentTheme.secondaryBGColor)
                )
            }
            
            Divider().background(Color(UIColor.tertiarySystemBackground))
            
            Group {
                HStack {
                    ForEach(BackGroundOptions.selectable, id: \.self) { bg in
                        Image(bg.rawValue, bundle: .main)
                            .resizable()
                            .aspectRatio(contentMode: .fill)
                            .frame(minWidth: 10, idealWidth: 40, maxWidth: 40,
                                   minHeight: 10, idealHeight: 40, maxHeight: 40,
                                   alignment: .center)
                            .onTapGesture {
                                update(background: bg)
                            }
                    }
                    mixBG
                        .onTapGesture {
                            update(background: .random)
                        }
                    
                    ColorPicker("", selection: $customIcon.bgOverlayColor)
                }
                .padding()
                .background(
                    Color(uiColor: theme.currentTheme.secondaryBGColor)
                )
            }
            
            
            Divider().background(Color(UIColor.tertiarySystemBackground))
            
            Group {
                VStack {
                    HStack(spacing: 0) {
                        VStack(alignment: .center) {
                            Text("background")
                            ColorPicker("", selection: $customIcon.bgColor)
                                .labelsHidden()
                        }
                        .frame(minWidth: 0, maxWidth: .infinity)
                        
                        VStack(alignment: .center) {
                            Text("Inner")
                            ColorPicker("", selection: $customIcon.innerColor)
                                .labelsHidden()
                        }
                        .frame(minWidth: 0, maxWidth: .infinity)
                        
                        VStack(alignment: .center) {
                            Text("Face Outline")
                            ColorPicker("", selection: $customIcon.circleStrokeColor)
                                .labelsHidden()
                        }
                        .frame(minWidth: 0, maxWidth: .infinity)
                    }
                    
                    HStack(spacing: 0) {
                        VStack(alignment: .center) {
                            Text("Left Eye")
                            ColorPicker("", selection: $customIcon.leftEyeColor)
                                .labelsHidden()
                        }
                        .frame(minWidth: 0, maxWidth: .infinity)
                        
                        VStack(alignment: .center) {
                            Text("right eye")
                            ColorPicker("", selection: $customIcon.rightEyeColor)
                                .labelsHidden()
                        }
                        .frame(minWidth: 0, maxWidth: .infinity)
                        
                        VStack(alignment: .center) {
                            Text("mouth")
                            ColorPicker("", selection: $customIcon.mouthColor)
                                .labelsHidden()
                        }
                        .frame(minWidth: 0, maxWidth: .infinity)
                    }
                }
                .padding()
                .background(
                    Color(uiColor: theme.currentTheme.secondaryBGColor)
                )
            }
            
            Divider().background(Color(UIColor.tertiarySystemBackground))
            
            Group {
                HStack(alignment: .center, spacing: 0) {
                    Button(action: {
                        createRandom()
                    }, label: {
                        Text("Random")
                            .font(.title)
                            .fontWeight(.bold)
                            .foregroundColor(Color(UIColor.white))
                        
                    })
                        .frame(minWidth: 0, maxWidth: .infinity)
                        .background(.blue)
                    
                    Button(action: {
                        let bigIconView = IconView(customIcon: customIcon, isPreview: false)
                            .frame(width: 512, height: 512, alignment: .center)
                            .aspectRatio(contentMode: .fill)
                        let icon = bigIconView.snapshot()
                        if let data = icon.pngData() {
                            savedCustomIcon = data
                            
                            let impactMed = UIImpactFeedbackGenerator(style: .heavy)
                            impactMed.impactOccurred()
                        }
                    }, label: {
                        Text("Save")
                            .font(.title)
                            .fontWeight(.bold)
                            .foregroundColor(Color(UIColor.white))
                        
                    })
                        .frame(minWidth: 0, maxWidth: .infinity)
                        .background(.green)
                }
            }
        }
    }
}

struct CreateIconView_Previews: PreviewProvider {
    static var previews: some View {
        Group {
            CreateIconView()
            
            CreateIconView()
                .preferredColorScheme(.dark)
        }
    }
}
