// MARK: Custom Table Layout

private let tableSize = CGSize(width: 130, height: 90)
private let guestSize = CGSize(width: 40, height: 40)

/// Which of 6 tables this view represents
private struct TableViewLayoutKey: LayoutValueKey {
    static let defaultValue: Int? = nil
}

extension View {
    fileprivate func tableViewLayoutKey(_ value: Int) -> some View  {
        return layoutValue(key: TableViewLayoutKey.self, value: value)
    }
}

/// Which of 36 guests this view represents
private struct GuestViewLayoutKey: LayoutValueKey {
    static let defaultValue: Int? = 0
}

extension View {

    /// Guests 1 - 36
    fileprivate func guestViewLayoutKey(_ value: Int) -> some View  {
        return layoutValue(key: GuestViewLayoutKey.self, value: value)
    }
}

let initials = [
"Ju",
"As",
"Ma",
"As",
"Ly",
"Ga",
"Ni",
"Ar",
"Ca",
"Do",
"Je",
"Ca",
"Em",
"Ma",
"Ze",
"Jo",
"Da",
"Sh",
"Sa",
"Pl",
"Pa",
"Sc",
"Ma",
"Je",
"Li",
"Ma",
"Ta",
"Je",
"Cu",
"Lu",
"Ra",
"Na",
"Sa",
"Pa",
"Le",
"Pi",
]

struct SeatingChartView: View {

    /// If true, the guests will be positioned in "pods" of tables. No table will touch another table. Otherwise
    /// the guests will side in two longs rows.
    @State private var usePods = true

    var body: some View {
        ZStack(alignment: .bottomTrailing) {
            GeometryReader { proxy in
                SeatingLayout(usePods: usePods).callAsFunction {
                    TableView(tableNumber: 1)
                    TableView(tableNumber: 2)
                    TableView(tableNumber: 3)
                    TableView(tableNumber: 4)
                    TableView(tableNumber: 5)
                    TableView(tableNumber: 6)
                    ForEach(1..<37) { i in
                        SeatedGuestOption2(guestNumber: i - 1)
                    }
                }
                .animation(.default, value: proxy.size)
            }
            .background(.black.opacity(0.13))
            Picker("Arrangement", selection: $usePods.animation()) {
                Text("Pods").tag(true)
                Text("Rows  ").tag(false)
            }
            .fixedSize()
            .pickerStyle(.segmented)
            .padding()
        }
    }
}

/// heh.
struct TableView: View {
    let tableNumber: Int

    var body: some View {
        ZStack(alignment: .bottomTrailing) {
            HStack {
                Image(systemName: "table.furniture")
                    .background(.quaternary.shadow(.inner(radius: 1, y: 1.5)),
                                in: Circle().inset(by: -8))
                    .padding(5)
                Text("Table \(tableNumber)")
            }
            .foregroundStyle(.secondary)
            .padding(8)
            .frame(width: tableSize.width, height: tableSize.height)
            #if os(macOS) || os(iOS)
            .background(.regularMaterial.shadow(.drop(radius: 1, y: 1.5)),
                        in: RoundedRectangle(cornerRadius: 12, style: .continuous))
            #endif
        }

        .tableViewLayoutKey(tableNumber)
    }
}

private let colors: [Color] = [
    .red, .orange, .yellow, .green, .mint, .teal, .cyan, .blue,
    .indigo, .purple, .pink, .gray, .black, .white, .brown,
    .red, .orange, .yellow, .green, .mint, .teal, .cyan, .blue,
    .indigo, .purple, .pink, .gray, .black, .white, .brown, .red,
    .orange, .yellow, .green, .mint, .teal, .cyan
]

struct SeatedGuest: View {

    let guestNumber: Int

    var body: some View {
        Image(systemName: "person")
            .resizable()
            .aspectRatio(contentMode: .fit)
            .padding(9)
            .background(in: Circle())
            .backgroundStyle(
                colors[guestNumber].gradient
            )
            .foregroundStyle(guestNumber == 13 ? .black : .white)
            .frame(width: 40, height: 40)
            .guestViewLayoutKey(guestNumber + 1)
    }
}

struct SeatedGuestOption2: View {
    let guestNumber: Int

    var body: some View {
        Circle()
            .stroke(colors[guestNumber], style: StrokeStyle(lineWidth: 3))
            .background(.white.gradient, in: Circle())
            .frame(width: guestSize.width, height: guestSize.height)
            .guestViewLayoutKey(guestNumber + 1)
            .overlay {
                Text(initials[guestNumber])
                    .foregroundColor(.secondary)
                    .font(.callout)

            }
    }
}

struct SeatingChartView_Previews: PreviewProvider {
    static var previews: some View {
        SeatingChartView()
            .frame(width: 600, height: 600)
    }
}

struct SeatingLayout: Layout {

    /// If true, the guests will be positioned in "pods" of tables. No table will touch another table. Otherwise
    /// the guests will side in two longs rows.
    let usePods: Bool

    struct Cache {
        ///  The width proposed to the view. We assume a certain height, otherwise, overlapping views
        var width: CGFloat?
    }

    func sizeThatFits(
        proposal: ProposedViewSize,
        subviews: LayoutSubviews,
        cache: inout Cache
    ) -> CGSize {
        cache.width = proposal.width
        return proposal.replacingUnspecifiedDimensions()
    }

    func makeCache(subviews: Subviews) -> Cache { Cache() }

    func placeSubviews(in bounds: CGRect,
                       proposal: ProposedViewSize,
                       subviews: Subviews,
                       cache: inout Cache) {
        guard let width = cache.width else { return }

        /// Helper function: Place 6 guests around all edges of a table.
        func seat(_ guests: [LayoutSubview], around table: CGRect) {
            guests[0].place(
                at: .init(
                    x: table.origin.x + 3 - guestSize.width,
                    y: table.origin.y + (table.height / 2.0) - (guestSize.height / 2.0)),
                proposal: .infinity)
            guests[1].place(
                at: .init(
                    x: table.origin.x + (table.width / 4.0) - guestSize.width / 2.0,
                    y: table.origin.y + 5 - guestSize.height),
                proposal: .infinity)
            guests[2].place(
                at: .init(
                    x: table.origin.x + table.width * 0.75 - guestSize.width / 2.0,
                    y: table.origin.y + 5 - guestSize.height),
                proposal: .infinity)
            guests[3].place(
                at: .init(
                    x: table.maxX - 5,
                    y: table.origin.y + (table.height / 2.0) - (guestSize.height / 2.0)),
                proposal: .infinity)
            guests[4].place(
                at: .init(
                    x: table.origin.x + table.width * 0.75 - guestSize.width / 2.0,
                    y: table.maxY - 5),
                proposal: .infinity)
            guests[5].place(
                at: .init(
                    x: table.origin.x + (table.width / 4.0) - guestSize.width / 2.0,
                    y: table.maxY - 5),
                proposal: .infinity)
        }

        /// Helper function: Place 6 guests, dining hall style (not along the shorter sides of a table)
        func seat(_ guests: [LayoutSubview], along table: CGRect) {
            guests[0].place(
                at: .init(
                    x: table.minX + tableSize.width / 3 - guestSize.width - 4,
                    y: table.origin.y + 5 - guestSize.height),
                proposal: .infinity)
            guests[1].place(
                at: .init(
                    x: table.minX + tableSize.width * 2/3 - guestSize.width - 4,
                    y: table.origin.y + 5 - guestSize.height),
                proposal: .infinity)
            guests[2].place(
                at: .init(
                    x: table.minX + tableSize.width - guestSize.width - 4,
                    y: table.origin.y + 5 - guestSize.height),
                proposal: .infinity)
            guests[3].place(
                at: .init(
                    x: table.minX + tableSize.width / 3 - guestSize.width - 4,
                    y: table.maxY - 5),
                proposal: .infinity)
            guests[4].place(
                at: .init(
                    x: table.minX + tableSize.width * 2/3 - guestSize.width - 4,
                    y: table.maxY - 5),
                proposal: .infinity)
            guests[5].place(
                at: .init(
                    x: table.minX + tableSize.width - guestSize.width - 4,
                    y: table.maxY - 5),
                proposal: .infinity)
        }

        // Get tables
        let table1 = subviews.first(where: { $0[TableViewLayoutKey.self] == 1 })!
        let table2 = subviews.first(where: { $0[TableViewLayoutKey.self] == 2 })!
        let table3 = subviews.first(where: { $0[TableViewLayoutKey.self] == 3 })!
        let table4 = subviews.first(where: { $0[TableViewLayoutKey.self] == 4 })!
        let table5 = subviews.first(where: { $0[TableViewLayoutKey.self] == 5 })!
        let table6 = subviews.first(where: { $0[TableViewLayoutKey.self] == 6 })!

        // Get guests
        let table1Guests = subviews
            .filter {
                guard let guestNumber = $0[GuestViewLayoutKey.self] else { return false }
                return guestNumber >= 1 && guestNumber <= 6
            }
        let table2Guests = subviews
            .filter {
                guard let guestNumber = $0[GuestViewLayoutKey.self] else { return false }
                return guestNumber >= 7 && guestNumber <= 12
            }
        let table3Guests = subviews
            .filter {
                guard let guestNumber = $0[GuestViewLayoutKey.self] else { return false }
                return guestNumber >= 13 && guestNumber <= 18
            }
        let table4Guests = subviews
            .filter {
                guard let guestNumber = $0[GuestViewLayoutKey.self] else { return false }
                return guestNumber >= 19 && guestNumber <= 24
            }
        let table5Guests = subviews
            .filter {
                guard let guestNumber = $0[GuestViewLayoutKey.self] else { return false }
                return guestNumber >= 25 && guestNumber <= 30
            }
        let table6Guests = subviews
            .filter {
                guard let guestNumber = $0[GuestViewLayoutKey.self] else { return false }
                return guestNumber >= 31 && guestNumber <= 36
            }

        if usePods {
            let table1Origin = CGPoint(x: 60, y: 120)
            let table2Origin = CGPoint(x: 200, y: 280)
            let table3Origin = CGPoint(x: 50, y: 450)
            let table4Origin = CGPoint(x: 300, y: 120)
            let table5Origin = CGPoint(x: 440, y: 280)
            let table6Origin = CGPoint(x: 290, y: 450)
            table1.place(at: table1Origin, proposal: .infinity)
            table2.place(at: table2Origin, proposal: .infinity)
            table3.place(at: table3Origin, proposal: .infinity)
            table4.place(at: table4Origin, proposal: .infinity)
            table5.place(at: table5Origin, proposal: .infinity)
            table6.place(at: table6Origin, proposal: .infinity)
            seat(table1Guests, around: CGRect(origin: table1Origin, size: tableSize))
            seat(table2Guests, around: CGRect(origin: table2Origin , size: tableSize))
            seat(table3Guests, around: CGRect(origin: table3Origin, size: tableSize))
            seat(table4Guests, around: CGRect(origin: table4Origin, size: tableSize))
            seat(table5Guests, around: CGRect(origin: table5Origin , size: tableSize))
            seat(table6Guests, around: CGRect(origin: table6Origin, size: tableSize))
        } else {
            let table1Origin = CGPoint(x: width / 2.0 - 6 - tableSize.width * 1.5, y: 130)
            let table2Origin = CGPoint(x: table1Origin.x + tableSize.width + 6, y: 130)
            let table3Origin = CGPoint(x: table2Origin.x + tableSize.width + 6, y: 130)
            let table4Origin = CGPoint(x: width / 2.0 - 6 - tableSize.width * 1.5, y: 360)
            let table5Origin = CGPoint(x: table1Origin.x + tableSize.width + 6, y: 360)
            let table6Origin = CGPoint(x: table2Origin.x + tableSize.width + 6, y: 360)
            table1.place(at: table1Origin, proposal: .infinity)
            table2.place(at: table2Origin, proposal: .infinity)
            table3.place(at: table3Origin, proposal: .infinity)
            table4.place(at: table4Origin, proposal: .infinity)
            table5.place(at: table5Origin, proposal: .infinity)
            table6.place(at: table6Origin, proposal: .infinity)
            seat(table1Guests, along: CGRect(origin: table1Origin, size: tableSize))
            seat(table2Guests, along: CGRect(origin: table2Origin , size: tableSize))
            seat(table3Guests, along: CGRect(origin: table3Origin, size: tableSize))
            seat(table4Guests, along: CGRect(origin: table4Origin, size: tableSize))
            seat(table5Guests, along: CGRect(origin: table5Origin , size: tableSize))
            seat(table6Guests, along: CGRect(origin: table6Origin, size: tableSize))
        }
    }
}