//
//  LiveNowItemView.swift
//  SodaLive
//
//  Created by klaus on 2023/08/14.
//

import SwiftUI
import Kingfisher

struct LiveNowItemView: View {
    
    let item: GetRoomListResponse
    
    let width: CGFloat = 133.3
    let height: CGFloat = 176.7
    
    var body: some View {
        VStack(alignment: .leading, spacing: 8) {
            ZStack {
                KFImage(URL(string: item.coverImageUrl))
                    .resizable()
                    .scaledToFill()
                    .frame(width: width, height: height, alignment: .center)
                    .cornerRadius(4.7)
                    .clipped()
                
                LinearGradient(
                    colors: [Color.black.opacity(0.1), Color.black.opacity(0.8)],
                    startPoint: .top,
                    endPoint: .bottom
                )
                
                VStack(alignment: .trailing, spacing: 0) {
                    HStack(spacing: 3.3) {
                        Text(item.price > 0 ? "유료" : "무료")
                            .font(.custom(Font.medium.rawValue, size: 12))
                            .foregroundColor(Color.white)
                            .padding(.horizontal, 7.3)
                            .padding(.vertical, 4)
                            .background(Color(hex: item.price > 0 ? "881609" : "643bc8"))
                            .cornerRadius(10)
                        
                        Spacer()
                        
                        if item.isPrivateRoom {
                            Image("ic_lock")
                                .resizable()
                                .frame(width: 20, height: 20)
                        }
                    }
                    .padding(.horizontal, 3.3)
                    .padding(.top, 3.3)
                    
                    Spacer()
                }
            }
            .frame(width: width, height: height)
            
            Text("\(item.title)")
                .font(.custom(Font.medium.rawValue, size: 12))
                .foregroundColor(Color(hex: "eeeeee"))
                .lineLimit(2)
                .fixedSize(horizontal: false, vertical: true)
            
            if item.tags.count > 0 {
                Text("\(item.tags.map { "#\($0)" }.joined(separator: " "))")
                    .font(.custom(Font.medium.rawValue, size: 11))
                    .foregroundColor(Color(hex: "3bb9f1"))
            }
            
            HStack(spacing: 5.3) {
                KFImage(URL(string: item.creatorProfileImage))
                    .resizable()
                    .scaledToFill()
                    .frame(width: 21.3, height: 21.3, alignment: .center)
                    .clipShape(Circle())
                
                Text("\(item.creatorNickname)")
                    .font(.custom(Font.medium.rawValue, size: 10))
                    .foregroundColor(Color(hex: "777777"))
            }
        }
        .frame(width: width)
    }
}

struct LiveNowItemView_Previews: PreviewProvider {
    static var previews: some View {
        LiveNowItemView(
            item: GetRoomListResponse(
                roomId: 99,
                title: "testtesttesttesttesttesttesttesttesttesttesttesttesttesttesttest",
                content: "testtest",
                beginDateTime: "2022.05.23 Mon 03:00 PM",
                numberOfParticipate: 3,
                numberOfPeople: 5,
                coverImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png",
                isAdult: true,
                price: 0,
                tags: ["팬미팅", "힐링"],
                channelName: nil,
                creatorProfileImage: "https://test-cf.sodalive.net/profile/default-profile.png",
                creatorNickname: "user8",
                creatorId: 19,
                isReservation: false,
                isPrivateRoom: true
            )
        )
    }
}