sodalive-ios/SodaLive/Sources/Content/Series/Detail/SeriesDetailView.swift

231 lines
11 KiB
Swift

//
// SeriesDetailView.swift
// SodaLive
//
// Created by klaus on 4/29/24.
//
import SwiftUI
import Kingfisher
struct SeriesDetailView: View {
@ObservedObject var viewModel = SeriesDetailViewModel()
let seriesId: Int
@State private var isShowFollowNotifyDialog: Bool = false {
didSet {
if !isShowFollowNotifyDialog {
creatorId = 0
}
}
}
@State private var creatorId: Int = 0
var body: some View {
BaseView(isLoading: $viewModel.isLoading) {
ZStack(alignment: .top) {
Color.gray11.ignoresSafeArea()
if let seriesDetail = viewModel.seriesDetail {
KFImage(URL(string: seriesDetail.coverImage))
.resizable()
.scaledToFit()
.frame(maxWidth: .infinity)
.blur(radius: 25)
ScrollView(.vertical, showsIndicators: false) {
VStack(spacing: 0) {
HStack(spacing: 0) {
Image("ic_back")
.resizable()
.frame(width: 20, height: 20)
.onTapGesture { AppState.shared.back() }
Spacer()
}
.padding(.horizontal, 13.3)
.frame(height: 50)
ZStack {
Rectangle()
.frame(maxWidth: .infinity)
.foregroundColor(Color.gray11)
.cornerRadius(21.3, corners: [.topLeft, .topRight])
.padding(.top, 94)
KFImage(URL(string: seriesDetail.coverImage))
.resizable()
.scaledToFill()
.frame(
width: 400 * screenSize().width / 1080,
height: 564 * screenSize().width / 1080
)
.cornerRadius(5)
}
VStack(alignment: .leading, spacing: 0) {
Text(seriesDetail.title)
.font(.custom(Font.bold.rawValue, size: 18.3))
.foregroundColor(Color.grayee)
.padding(.horizontal, 13.3)
.padding(.top, 24)
HStack(spacing: 5.3) {
Text(seriesDetail.genre)
.font(.custom(Font.medium.rawValue, size: 12))
.foregroundColor(Color(hex: "3bac6a"))
.padding(.horizontal, 5.3)
.padding(.vertical, 3.3)
.background(Color(hex: "28312b"))
.cornerRadius(2.6)
if seriesDetail.isAdult {
Text("19세")
.font(.custom(Font.medium.rawValue, size: 12))
.foregroundColor(Color(hex: "f1291c"))
.padding(.horizontal, 5.3)
.padding(.vertical, 3.3)
.background(Color(hex: "312827"))
.cornerRadius(2.6)
} else {
Text("전체연령가")
.font(.custom(Font.medium.rawValue, size: 12))
.foregroundColor(Color(hex: "d2d2d2"))
.padding(.horizontal, 5.3)
.padding(.vertical, 3.3)
.background(Color(hex: "222222"))
.cornerRadius(2.6)
}
Text("\(seriesDetail.publishedDaysOfWeek) 연재")
.font(.custom(Font.medium.rawValue, size: 12))
.foregroundColor(Color(hex: "909090"))
}
.padding(.top, 8)
.padding(.horizontal, 13.3)
ScrollView(.horizontal, showsIndicators: false) {
HStack(spacing: 5.3) {
ForEach(0..<seriesDetail.keywordList.count, id: \.self) {
SeriesKeywordChipView(keyword: seriesDetail.keywordList[$0])
}
}
}
.padding(.top, 16)
.padding(.horizontal, 13.3)
HStack(spacing: 5.3) {
KFImage(URL(string: seriesDetail.creator.profileImage))
.resizable()
.scaledToFit()
.clipShape(Circle())
.frame(width: 26.7, height: 26.7)
Text(seriesDetail.creator.nickname)
.font(.custom(Font.medium.rawValue, size: 12))
.foregroundColor(Color(hex: "909090"))
Spacer()
if seriesDetail.creator.creatorId != UserDefaults.int(forKey: .userId) {
Image(
viewModel.isFollow ?
viewModel.isNotify ?
"btn_following_big" :
"btn_following_no_alarm_big" :
"btn_follow_big"
)
.onTapGesture {
if viewModel.isFollow {
creatorId = seriesDetail.creator.creatorId
isShowFollowNotifyDialog = true
} else {
viewModel.follow(seriesDetail.creator.creatorId)
}
}
}
}
.padding(.top, 16)
.padding(.horizontal, 13.3)
HStack(spacing: 0) {
SeriesDetailTabView(
title: "",
width: screenSize().width / 2,
isSelected: viewModel.currentTab == .home
) {
if viewModel.currentTab != .home {
viewModel.currentTab = .home
}
}
SeriesDetailTabView(
title: "작품소개",
width: screenSize().width / 2,
isSelected: viewModel.currentTab == .introduction
) {
if viewModel.currentTab != .introduction {
viewModel.currentTab = .introduction
}
}
}
.padding(.top, 16)
Rectangle()
.foregroundColor(Color.gray90.opacity(0.5))
.frame(height: 1)
.frame(maxWidth: .infinity)
switch(viewModel.currentTab) {
case .introduction:
SeriesDetailIntroductionView(
width: screenSize().width - 26.7,
seriesDetail: seriesDetail
)
default:
SeriesDetailHomeView(
title: seriesDetail.title,
seriesId: seriesDetail.seriesId,
contentCount: seriesDetail.contentCount,
contentList: seriesDetail.contentList
)
}
}
.padding(.bottom, 10)
.background(Color.gray11)
}
}
if isShowFollowNotifyDialog {
CreatorFollowNotifyDialog(
isShowing: $isShowFollowNotifyDialog,
onClickNotifyAll: {
viewModel.follow(creatorId, follow: true, notify: true)
},
onClickNotifyNone: {
viewModel.follow(creatorId, follow: true, notify: false)
},
onClickUnFollow: {
viewModel.follow(creatorId, follow: false, notify: false)
}
)
}
}
}
}
.onAppear {
viewModel.seriesId = seriesId
viewModel.getSeriesDetail()
}
}
}
#Preview {
SeriesDetailView(seriesId: 0)
}