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

import SwiftUI

struct IconView: View {
    @State public var customIcon: CustomIcon
    
    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)
    ]
    
    var body: some View {
        ZStack {
            LazyVGrid(columns: columns, spacing: 0) {
                ForEach(customIcon.background, id: \.self.1) {
                    $0.0
                }
            }
            .frame(width: 200, height: 200)
            .position(x: 100, y: 110)
            
            
            Circle()
                .strokeBorder(Color.black, lineWidth: 12)
                .background(Circle().fill(customIcon.innerColor))
                .frame(width: 120, height: 120, alignment: .center)
            
            VStack {
                Spacer()
                    .frame(height: 70)
                HStack {
                    Spacer()
                        .frame(width: 72)
                    customIcon.leftEye
                    Spacer()
                        .frame(width: 20)
                    customIcon.rightEye
                    Spacer()
                }
                Spacer()
                    .frame(height: 28)
                customIcon.mouth
                Spacer()
            }
        }
        .frame(width: 200, height: 200)
        .background(
            customIcon.bgColor
        )
        .cornerRadius(10)
    }
}

struct IconView_Previews: PreviewProvider {
    static var previews: some View {
        IconView(customIcon: CustomIcon(leftEye: EyeOptions.defaultOption,
                                        rightEye: EyeOptions.defaultOption,
                                        mouth: MouthOptions.defaultOption,
                                        background: [(AnyView, UUID)](),
                                        bgColor: .red,
                                        innerColor: .green))
    }
}