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

import SwiftUI


struct CustomIcon {
    let leftEye: Image
    let rightEye: Image
    let mouth: Image
    
    let background: AnyView?
    let bgColor: Color
    let innerColor: Color
}

enum BackGroundOptions: String, CaseIterable {
    case horrible
    case bad
    case average
    case good
    case great
    case random
    
    static var selectable: [BackGroundOptions] {
        return [.great, .good, .average, .bad, .horrible]
    }
}

enum Eyes {
    case left
    case right
}

enum EyeOptions: String, CaseIterable {
    case fire = "fire"
    case bolt = "bolt2"
    case dollar = "dollar"
    
    static public var defaultOption: AnyView {
        let image = Image(EyeOptions.fire.rawValue, bundle: .main)
            .resizable()
            .frame(width: 20, height: 20)
        return AnyView(image)
        
    }
}

enum MouthOptions: String, CaseIterable {
    case moonFill = "moon.fill"
    case flame = "flame"
    case flameCircle = "flame.circle"
    
    static public var defaultOption: MouthOptions {
        return MouthOptions.flameCircle
    }
}

struct CreateIconView: View {
    @State private var bgColor = Color.red
    @State private var innerColor = Color.green
    @State private var bgPattern = [(AnyView, UUID)]()

    @State private var leftEye: AnyView = EyeOptions.defaultOption
    @State private var rightEye: AnyView = EyeOptions.defaultOption
    
    @State private var mouth: Image = Image(systemName: MouthOptions.defaultOption.rawValue)
    
    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))
    ]
    
    let columns = [
        GridItem(.fixed(20), spacing: 0),
        GridItem(.fixed(20), spacing: 0),
        GridItem(.fixed(20), spacing: 0),
        GridItem(.fixed(20), spacing: 0),
        GridItem(.fixed(20), spacing: 0),
        GridItem(.fixed(20), spacing: 0),
        GridItem(.fixed(20), spacing: 0),
        GridItem(.fixed(20), spacing: 0),
        GridItem(.fixed(20), spacing: 0),
        GridItem(.fixed(20), spacing: 0),
        GridItem(.fixed(20), spacing: 0),
        GridItem(.fixed(20), spacing: 0)
    ]
    
    func update(eye: Eyes, eyeOption: EyeOptions) {
        let image = Image(eyeOption.rawValue, bundle: .main)
            .resizable()
            .frame(width: 20, height: 20)
        switch eye {
        case .left:
            leftEye = AnyView(image)
        case .right:
            rightEye = AnyView(image)
        }
    }
    
    func createRandom() {
        bgColor = Color(
            red: .random(in: 0...1),
            green: .random(in: 0...1),
            blue: .random(in: 0...1)
        )
        
        innerColor = Color(
            red: .random(in: 0...1),
            green: .random(in: 0...1),
            blue: .random(in: 0...1)
        )
        
        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) {
        mouth = Image(systemName: mouthOption.rawValue)
    }
    
    func update(background: BackGroundOptions) {
        bgPattern.removeAll()
        
        if background == .random {
            for _ in 0...120 {
                let image = Image(BackGroundOptions.selectable.randomElement()!.rawValue, bundle: .main)

                let sizedImage = image
                    .resizable()
                    .frame(width: 20, height: 20)
                
                bgPattern.append((AnyView(sizedImage), UUID()))
            }
            return
        }
        let image = Image(background.rawValue, bundle: .main)

        let sizedImage = image
            .resizable()
            .frame(width: 20, height: 20)
        
        for _ in 0...120 {
            bgPattern.append((AnyView(sizedImage), UUID()))
        }
    }
    
    var mixBG: some View {
        VStack {
            HStack {
                randomElements[0]
                randomElements[1]
            }
            HStack {
                randomElements[2]
                randomElements[3]
            }
        }
    }
    
    var iconView: some View {
        ZStack {
            LazyVGrid(columns: columns, spacing: 0) {
                ForEach(bgPattern, id: \.self.1) {
                    $0.0
                }
            }
            .frame(width: 200, height: 200)
            .position(x: 100, y: 110)
            
            
            Circle()
                .strokeBorder(Color.black, lineWidth: 12)
                .background(Circle().fill(innerColor))
                .frame(width: 120, height: 120, alignment: .center)

            VStack {
                Spacer()
                    .frame(height: 70)
                HStack {
                    Spacer()
                        .frame(width: 72)
                    leftEye
                    Spacer()
                        .frame(width: 24)
                    rightEye
                    Spacer()
                }
                Spacer()
                    .frame(height: 28)
                mouth
                Spacer()
            }
        }
        .frame(width: 200, height: 200)
        .background(
            bgColor
        )
        .cornerRadius(10)
    }
    
    var body: some View {
        VStack {
            iconView
                .padding()
            Spacer()
            
            VStack {
                ColorPicker("Set the background color", selection: $bgColor)
                .padding([.leading, .trailing])
                ColorPicker("Set the inner color", selection: $innerColor)
                .padding([.leading, .trailing])
            }
            
            HStack {
                Spacer()
                Menu("Left Eye") {
                    ForEach(EyeOptions.allCases, id: \.self) { option in
                        Button(action: {
                            update(eye: .left, eyeOption: option)
                        }, label: {
                            Label(option.rawValue, image: option.rawValue)
                        })
                    }
                }
                Spacer()
                Menu("Right Eye") {
                    ForEach(EyeOptions.allCases, id: \.self) { option in
                        Button(action: {
                            update(eye: .right, eyeOption: option)
                        }, label: {
                            Label(option.rawValue, image: option.rawValue)
                        })
                    }
                }
                Spacer()
                Menu("Mouth") {
                    ForEach(MouthOptions.allCases, id: \.self) { option in
                        Button(action: {
                            update(mouthOption: option)
                        }, label: {
                            Image(systemName: option.rawValue)
                        })
                    }
                }
                Spacer()
            }
            .padding(.top, 10)
            
            VStack{
                Text("Background")
                
                HStack {
                    ForEach(BackGroundOptions.selectable, id: \.self) { bg in
                        Image(bg.rawValue, bundle: .main)
                            .resizable()
                            .frame(width: CGFloat(50), height: CGFloat(50), alignment: .center)
                            .onTapGesture {
                                update(background: bg)
                            }
                    }
                    mixBG
                        .onTapGesture {
                            update(background: .random)
                        }
                }
            }
            .padding(.top, 10)
            
            Button(action: {
                createRandom()
            }, label: {
                Text("Random")
                    .font(.title)
                    .fontWeight(.bold)
                    .foregroundColor(Color(UIColor.white))
                    .frame(minWidth: 0, maxWidth: .infinity)
                    .background(.blue)
            })
            
            Button(action: {
//                let newIcon = CustomIcon(leftEye: leftEye,
//                                         rightEye: rightEye,
//                                         mouth: mouth,
//                                         background: bgPattern,
//                                         bgColor: bgColor,
//                                         innerColor: innerColor)
            }, 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 {
        CreateIconView()
    }
}