//
//  UserProfileLiveView.swift
//  SodaLive
//
//  Created by klaus on 2023/08/11.
//

import SwiftUI
import Kingfisher

struct UserProfileLiveView: View {
    
    let userId: Int
    let liveRoomList: [LiveRoomResponse]
    let onClickParticipant: (LiveRoomResponse) -> Void
    let onClickReservation: (LiveRoomResponse) -> Void
    
    var body: some View {
        VStack(alignment: .leading, spacing: 26.7) {
            
            HStack(spacing: 0) {
                Text("라이브")
                    .font(.custom(Font.bold.rawValue, size: 16.7))
                    .foregroundColor(Color(hex: "eeeeee"))
            }
            
            VStack(spacing: 13.3) {
                ForEach(0..<liveRoomList.count, id: \.self) {
                    let liveRoom = liveRoomList[$0]
                    VStack(spacing: 13.3) {
                        HStack(spacing: 20) {
                            ZStack(alignment: .topLeading) {
                                KFImage(URL(string: liveRoom.coverImageUrl))
                                    .resizable()
                                    .scaledToFill()
                                    .frame(width: 80, height: 116.7, alignment: .center)
                                    .clipped()
                                    .cornerRadius(4.7)
                                
                                if liveRoom.isAdult {
                                    Text("19")
                                        .font(.custom(Font.bold.rawValue, size: 11.3))
                                        .foregroundColor(Color.white)
                                        .padding(4)
                                        .background(Color(hex: "e53621"))
                                        .clipShape(Circle())
                                        .padding(.top, 6.7)
                                        .padding(.leading, 6.7)
                                }

                                if !liveRoom.isActive {
                                    Rectangle()
                                        .frame(width: 80, height: 116.7, alignment: .top)
                                        .foregroundColor(Color(hex: "909090").opacity(0.5))
                                        .cornerRadius(4.7)
                                }
                            }
                            
                            VStack(alignment: .leading, spacing: 0) {
                                HStack(alignment: .top, spacing: 0) {
                                    VStack(alignment: .leading, spacing: 0) {
                                        Text(liveRoom.beginDateTime)
                                            .font(.custom(Font.medium.rawValue, size: 9.3))
                                            .foregroundColor(Color(hex: "ffd300"))
                                        
                                        Text(liveRoom.managerNickname)
                                            .font(.custom(Font.medium.rawValue, size: 11.3))
                                            .foregroundColor(Color(hex: "bbbbbb"))
                                            .padding(.top, 10)
                                        
                                        Text(liveRoom.title)
                                            .font(.custom(Font.medium.rawValue, size: 15.3))
                                            .foregroundColor(Color(hex: "e2e2e2"))
                                            .padding(.top, 6.7)
                                            .lineLimit(1)
                                    }
                                    
                                    Spacer()
                                    
                                    if liveRoom.isActive {
                                        if liveRoom.channelName != nil {
                                            Text("Live")
                                                .font(.custom(Font.medium.rawValue, size: 11.3))
                                                .foregroundColor(Color(hex: "ff5c49"))
                                                .padding(.horizontal, 7)
                                                .padding(.vertical, 4)
                                                .overlay(
                                                    RoundedRectangle(cornerRadius: 3.3)
                                                        .stroke(Color(hex: "ff5c49"), lineWidth: 1)
                                                )
                                        } else {
                                            Text("예정")
                                                .font(.custom(Font.medium.rawValue, size: 11.3))
                                                .foregroundColor(Color(hex: "fdca2f"))
                                                .padding(.horizontal, 9)
                                                .padding(.vertical, 4)
                                                .overlay(
                                                    RoundedRectangle(cornerRadius: 3.3)
                                                        .stroke(Color(hex: "fdca2f"), lineWidth: 1)
                                                )
                                        }
                                    } else {
                                        Text("종료")
                                            .font(.custom(Font.medium.rawValue, size: 11.3))
                                            .foregroundColor(Color(hex: "777777"))
                                            .padding(.horizontal, 9)
                                            .padding(.vertical, 4)
                                            .overlay(
                                                RoundedRectangle(cornerRadius: 3.3)
                                                    .stroke(Color(hex: "777777"), lineWidth: 1)
                                            )
                                    }
                                }
                                
                                Spacer()
                                
                                if liveRoom.isActive {
                                    if liveRoom.channelName != nil {
                                        if liveRoom.isPaid || liveRoom.price <= 0 {
                                            Text("지금 참여하기")
                                                .font(.custom(Font.bold.rawValue, size: 13.3))
                                                .foregroundColor(Color(hex: "ffffff"))
                                                .frame(
                                                    width: screenSize().width - 26.7 - 100,
                                                    height: 36.7
                                                )
                                                .background(Color(hex: "dd4500"))
                                                .cornerRadius(5.3)
                                                .onTapGesture {
                                                    onClickParticipant(liveRoom)
                                                }
                                        } else {
                                            Text("\(liveRoom.price)코인으로 지금 참여하기")
                                                .font(.custom(Font.bold.rawValue, size: 13.3))
                                                .foregroundColor(Color(hex: "ffffff"))
                                                .frame(
                                                    width: screenSize().width - 26.7 - 100,
                                                    height: 36.7
                                                )
                                                .background(Color(hex: "dd4500"))
                                                .cornerRadius(5.3)
                                                .onTapGesture {
                                                    onClickParticipant(liveRoom)
                                                }
                                        }
                                    } else {
                                        if liveRoom.isReservation {
                                            Text("예약완료")
                                                .font(.custom(Font.bold.rawValue, size: 13.3))
                                                .foregroundColor(Color(hex: "777777"))
                                                .frame(
                                                    width: screenSize().width - 26.7 - 100,
                                                    height: 36.7
                                                )
                                                .background(Color(hex: "525252"))
                                                .cornerRadius(5.3)
                                        } else {
                                            Text("\(liveRoom.price > 0 ? "\(liveRoom.price)코인으로 " : "")예약하기")
                                                .font(.custom(Font.bold.rawValue, size: 13.3))
                                                .foregroundColor(Color(hex: "000000"))
                                                .frame(
                                                    width: screenSize().width - 26.7 - 100,
                                                    height: 36.7
                                                )
                                                .background(Color(hex: "fdca2f"))
                                                .cornerRadius(5.3)
                                                .onTapGesture {
                                                    onClickReservation(liveRoom)
                                                }
                                        }
                                    }
                                } else {
                                    Text("다시듣기를 지원하지 않습니다")
                                        .font(.custom(Font.bold.rawValue, size: 13.3))
                                        .foregroundColor(Color(hex: "777777"))
                                        .frame(
                                            width: screenSize().width - 26.7 - 100,
                                            height: 36.7
                                        )
                                        .background(Color(hex: "525252"))
                                        .cornerRadius(5.3)
                                }
                            }
                        }
                        .frame(height: 116.7)
                        
                        Rectangle()
                            .frame(height: 1)
                            .foregroundColor(Color(hex: "909090").opacity(0.5))
                    }
                }
            }
        }
    }
}