sodalive-ios/SodaLive/Sources/Live/Room/Routlette/RoulettePreviewDialog.swift

200 lines
8.7 KiB
Swift

//
// RoulettePreviewDialog.swift
// SodaLive
//
// Created by klaus on 2023/12/06.
//
import SwiftUI
struct RoulettePreviewDialog: View {
@Binding var isShowing: Bool
let title: String?
let onClickSpin: ((Int) -> Void)?
let previewList: [RoulettePreview]
@State var selectedRoulette = SelectedRoulette.ROULETTE_1
var body: some View {
GeometryReader { geo in
ZStack {
VStack(spacing: 16.7) {
if previewList.count > 1 {
HStack(spacing: 13.3) {
SelectedButtonView(
title: "룰렛 1",
isActive: true,
isSelected: selectedRoulette == .ROULETTE_1
)
.onTapGesture {
if selectedRoulette != .ROULETTE_1 {
selectedRoulette = .ROULETTE_1
}
}
SelectedButtonView(
title: "룰렛 2",
isActive: true,
isSelected: selectedRoulette == .ROULETTE_2,
checkImage: "ic_select_check_black",
bgSelectedColor: Color(hex: "ffcb14"),
textSelectedColor: Color.black,
textDefaultColor: Color(hex: "ffcb14")
)
.onTapGesture {
if selectedRoulette != .ROULETTE_2 {
selectedRoulette = .ROULETTE_2
}
}
if previewList.count > 2 {
SelectedButtonView(
title: "룰렛 3",
isActive: true,
isSelected: selectedRoulette == .ROULETTE_3,
bgSelectedColor: Color(hex: "ff14d9"),
textDefaultColor: Color(hex: "ff14d9")
)
.onTapGesture {
if selectedRoulette != .ROULETTE_3 {
selectedRoulette = .ROULETTE_3
}
}
}
}
.padding(.top, 16.7)
}
HStack(spacing: 0) {
Text(title ?? "룰렛")
.font(.custom(Font.bold.rawValue, size: 18.3))
.foregroundColor(.white)
Spacer()
if let _ = onClickSpin {
HStack(spacing: 6.7) {
Image("ic_can")
Text("\(UserDefaults.int(forKey: .can))")
.font(.custom(Font.bold.rawValue, size: 16))
.foregroundColor(Color(hex: "eeeeee"))
Image("ic_forward")
}
.onTapGesture {
isShowing = false
DispatchQueue.main.async {
AppState.shared.setAppStep(step: .canCharge(refresh: {}, afterCompletionToGoBack: true))
}
}
}
}
.padding(.top, previewList.count > 1 ? 0 : 16.7)
.padding(.horizontal, 13.3)
LazyVStack(alignment: .leading, spacing: 13.3) {
ForEach(previewList[selectedRoulette.rawValue].items.indices, id: \.self) { index in
HStack(spacing:13.3) {
Text("\(index + 1)")
.font(.custom(Font.bold.rawValue, size: 14.7))
.foregroundColor(Color(hex: "e2e2e2"))
Text("\(previewList[selectedRoulette.rawValue].items[index].title) (\(previewList[selectedRoulette.rawValue].items[index].percent))")
.font(.custom(Font.medium.rawValue, size: 14.7))
.foregroundColor(Color(hex: "e2e2e2"))
}
}
}
.padding(.horizontal, 13.3)
HStack(spacing: 13.3) {
Text("취소")
.font(.custom(Font.bold.rawValue, size: 16))
.foregroundColor(
selectedRoulette == .ROULETTE_2 ? Color(hex: "ffcb14") :
selectedRoulette == .ROULETTE_3 ? Color(hex: "ff14d9") :
Color.button
)
.padding(.horizontal, 18)
.padding(.vertical, 16)
.overlay(
RoundedRectangle(cornerRadius: 10)
.stroke(
selectedRoulette == .ROULETTE_2 ? Color(hex: "ffcb14") :
selectedRoulette == .ROULETTE_3 ? Color(hex: "ff14d9") :
Color.button,
lineWidth: 1
)
)
.onTapGesture {
isShowing = false
}
Text("\(previewList[selectedRoulette.rawValue].can)캔으로 룰렛 돌리기")
.font(.custom(Font.bold.rawValue, size: 16))
.foregroundColor(selectedRoulette == .ROULETTE_2 ? .black : .white)
.padding(.vertical, 16)
.frame(maxWidth: .infinity)
.background(
selectedRoulette == .ROULETTE_2 ? Color(hex: "ffcb14") :
selectedRoulette == .ROULETTE_3 ? Color(hex: "ff14d9") :
Color.button
)
.cornerRadius(10)
.onTapGesture {
if let onClickSpin = onClickSpin {
onClickSpin(previewList[selectedRoulette.rawValue].id)
}
isShowing = false
}
}
.padding(.top, 6.7)
}
.padding(13.3)
.background(Color(hex: "222222"))
.cornerRadius(16.7)
.padding(.horizontal, 13.3)
}
.frame(width: geo.size.width, height: geo.size.height)
.background(Color.black.opacity(0.7))
}
}
}
struct RoulettePreviewDialog_Previews: PreviewProvider {
static var previews: some View {
RoulettePreviewDialog(
isShowing: .constant(true),
title: nil,
onClickSpin: nil,
previewList: [
RoulettePreview(
id: 0,
can: 100,
items: [
RoulettePreviewItem(title: "옵션1", percent: "33.40%"),
RoulettePreviewItem(title: "옵션2", percent: "66.60%"),
]
),
RoulettePreview(
id: 1,
can: 10,
items: [
RoulettePreviewItem(title: "옵션3", percent: "10.8%"),
RoulettePreviewItem(title: "옵션4", percent: "89.2%"),
]
),
RoulettePreview(
id: 2,
can: 1000,
items: [
RoulettePreviewItem(title: "옵션5", percent: "10%"),
RoulettePreviewItem(title: "옵션6", percent: "90%"),
]
)
]
)
}
}