vds_ios_sample/VDSSample/ViewControllers/ButtonGroupViewController.swift

//
//  ButtonViewController.swift
//  VDSSample
//
//  Created by Jarrod Courtney on 9/16/22.
//

import Foundation
import UIKit
import VDS
import VDSColorTokens

class ButtonGroupViewController: BaseViewController<ButtonGroup> {
    var collectionView: UICollectionView!
    
    public enum RowQuantity: String, CaseIterable {
        case none, one, two, three, four
        
        init(quantity: Int){
            
            if quantity == 1 {
                self = .one
            } else if quantity == 2 {
                self = .two
            } else if quantity == 3 {
                self = .three
            } else if quantity == 4 {
                self = .four
            } else {
                self = .none
            }
            
        }
        var intValue: Int {
            switch self {
            case .none:
                return 0
            case .one:
                return 1
            case .two:
                return 2
            case .three:
                return 3
            case .four:
                return 4
            }
        }
    }
    
    lazy var buttonPositionSelectorView = {
        PickerSelectorView<ButtonGroup.ButtonPosition>(title: "",
                                                       picker: self.picker,
                                                       items: ButtonGroup.ButtonPosition.allCases)
    }()
    
    lazy var rowQuantitySelectorView = {
        PickerSelectorView<RowQuantity>(title: "",
                                        picker: self.picker,
                                        items: RowQuantity.allCases)
    }()
    
    var disabledSwitch = Toggle()
    var widthTextField = NumericField()
    var percentageTextField = NumericField()

    let smallButtonGroup = ButtonGroup()
    let largeLabel = Label().with{ $0.text = "Large Button Group"; $0.textStyle = .boldTitleSmall }
    let smallLabel = Label().with{ $0.text = "Small Button Group"; $0.textStyle = .boldTitleSmall }

    override func viewDidLoad() {
        super.viewDidLoad()
        
        let stackView = UIStackView(arrangedSubviews: [largeLabel, component, smallLabel, smallButtonGroup])
        stackView.setCustomSpacing(50, after: component)
        stackView.axis = .vertical
        stackView.spacing = 30
        
        let label = actionLabel
        
        component.buttons = [
            makeButton("Secondary", label: label).with{ $0.use = .secondary },
            makeButton("Primary", label: label),
            makeTextLink("Large Text Link", label: label),
            makeButton("Widge Label Button", label: label),
            makeTextLinkCaret("Text Link Caret", label: label),
        ]
        
        smallButtonGroup.buttons = [
            makeTextLink("Small Text Link", label: label).with{ $0.size = .small },
            makeButton("Small Button", label: label).with{$0.size = .small; $0.use = .secondary },
            makeTextLink("Text Link 1", label: label).with{ $0.size = .small },
            makeTextLink("Text Link 2", label: label).with{ $0.size = .small },
            makeButton("Small Button 2", label: label).with{$0.size = .small; $0.use = .secondary }
        ]
        
        addContentTopView(view: stackView)
        percentageTextField.isEnabled = false
        percentageTextField.placeholder = "Active RowQty != none"
        widthTextField.placeholder = "Active RowQty == none"
        setupPicker()
        setupModel()
        
        debugViewSwitch.onChange =  { [weak self] sender in
            self?.component.debugBorder(show: sender.isOn, color: .blue)
            self?.smallButtonGroup.debugBorder(show: sender.isOn, color: .blue)
        }

    }
    
    override func setupForm(){
        super.setupForm()
        addActionRow()
        addFormRow(label: "Surface", view: surfacePickerSelectorView)
        addFormRow(label: "Disabled", view: disabledSwitch)
        addFormRow(label: "Position", view: buttonPositionSelectorView)
        addFormRow(label: "Width", view: widthTextField)
        addFormRow(label: "Row Quantity", view: rowQuantitySelectorView)
        addFormRow(label: "Percentage (1-100)", view: percentageTextField)
        
        disabledSwitch.onChange = { [weak self] sender in
            self?.largeLabel.disabled = sender.isOn
            self?.smallLabel.disabled = sender.isOn
            self?.component.disabled = sender.isOn
            self?.smallButtonGroup.disabled = sender.isOn
        }

        widthTextField
            .numberPublisher
            .sink { [weak self] number in
                if let number {
                    self?.component.buttonWidth = number.cgFloatValue
                    self?.smallButtonGroup.buttonWidth = number.cgFloatValue
                    self?.percentageTextField.text = ""
                } else {
                    self?.component.buttonWidth = nil
                }
            }.store(in: &subscribers)
        
        percentageTextField
            .numberPublisher
            .sink { [weak self] number in
                let rowQty = self?.component.rowQuantity ?? 0
                if let number, number.intValue <= 100, rowQty > 0 {
                    self?.component.buttonPercentage = number.cgFloatValue
                    self?.smallButtonGroup.buttonPercentage = number.cgFloatValue
                    self?.widthTextField.text = ""
                } else {
                    self?.component.buttonPercentage = nil
                    self?.smallButtonGroup.buttonPercentage = nil
                }
            }.store(in: &subscribers)

    }
        
    func setupModel() {
        //setup UI
        surfacePickerSelectorView.text = component.surface.rawValue
        buttonPositionSelectorView.text = component.buttonPosition.rawValue
        disabledSwitch.isOn = component.disabled
        rowQuantitySelectorView.text = RowQuantity(quantity: component.rowQuantity).rawValue
        widthTextField.text = ""
    }
      
    func setupPicker(){
        
        surfacePickerSelectorView.onPickerDidSelect = {  [weak self] item in
            self?.largeLabel.surface = item
            self?.smallLabel.surface = item
            self?.component.surface = item
            self?.smallButtonGroup.surface = item
            self?.contentTopView.backgroundColor = item.color
        }
        
        buttonPositionSelectorView.onPickerDidSelect = {  [weak self] item in
            self?.component.buttonPosition = item
            self?.smallButtonGroup.buttonPosition = item
        }
        
        rowQuantitySelectorView.onPickerDidSelect = {  [weak self] item in
            self?.percentageTextField.isEnabled = item.intValue > 0
            self?.widthTextField.isEnabled = item.intValue == 0
                        
            if item == .none {
                self?.percentageTextField.text = ""
            } else {
                self?.widthTextField.text = ""
                self?.component.buttonWidth = nil
                self?.smallButtonGroup.buttonWidth = nil
            }
            
            if UIDevice.isIPad {
                self?.component.rowQuantityTablet = item.intValue
                self?.smallButtonGroup.rowQuantityTablet = item.intValue
            } else {
                self?.component.rowQuantityPhone = item.intValue
                self?.smallButtonGroup.rowQuantityPhone = item.intValue
            }
        }
    }
}

extension ButtonGroupViewController: Componentable {
    static func getComponent() -> TestViewWrapper {
        let component = Self.makeComponent()
        component.buttons = [
            Button().with{ $0.use = .secondary; $0.text = "Secondary" },
            Button().with{ $0.use = .primary; $0.text = "Primary" },
            TextLink().with { $0.size = .large; $0.text = "Large Text Link" },
            TextLink().with { $0.text = "Widge Label Button" },
            TextLinkCaret().with { $0.text = "Text Link Caret" }
        ]

        return TestViewWrapper(component: component, isTrailing: true)
    }
}