updated date picker

Signed-off-by: Matt Bruce <matt.bruce@verizon.com>

VDSSample/ViewControllers/DatePickerViewController.swift

@@ -7,9 +7,11 @@
 
 import Foundation
 import VDS
+import UIKit
 
 class DatePickerViewController: BaseViewController<DatePicker> {
     
+    // Datepicker
     var label = Label()
     var disabledSwitch = Toggle()
     var requiredSwitch = Toggle()
@@ -28,11 +30,50 @@ class DatePickerViewController: BaseViewController<DatePicker> {
                            items: DatePicker.DateFormat.allCases )
     }()
 
+    // Calendar
+    //props
+    var indicators: [CalendarBase.CalendarIndicatorModel] = []
+    var activeDates: [Date] = []
+    var inactiveDates: [Date] = []
+    var minDate: Date = Date().startOfMonth
+    var maxDate: Date = Date().endOfMonth
+
+    //form
+    var containerBorderSwitch = Toggle()
+    var hideCurrentDateIndicatorSwitch = Toggle()
+    var indicatorOneSwitch = Toggle()
+    var indicatorTwoSwitch = Toggle()
+    var indicatorThreeSwitch = Toggle()
+    var clearActiveDatesSwitch = Toggle()
+    var clearInactiveDatesSwitch = Toggle()
+    var activeDatesField = TextField()
+    var inactiveDatesField = TextField()
+    var legendOneField = TextField()
+    var legendTwoField = TextField()
+    var legendThreeField = TextField()
+    
+    private var minDatePicker: UIDatePicker = UIDatePicker()
+    private var maxDatePicker: UIDatePicker = UIDatePicker()
+    private var indicatorOnePicker: UIDatePicker = UIDatePicker()
+    private var indicatorTwoPicker: UIDatePicker = UIDatePicker()
+    private var indicatorThreePicker: UIDatePicker = UIDatePicker()
+    private var activeDatePicker: UIDatePicker = UIDatePicker().with { $0.datePickerMode = .date }
+    private var inactiveDatePicker: UIDatePicker = UIDatePicker().with { $0.datePickerMode = .date }
+    
+    let indicatorOnePickerTag = 1
+    let indicatorTwoPickerTag = 2
+    let indicatorThreePickerTag = 3
+    let minDatePickerTag = 4
+    let maxDatePickerTag = 5
+    let activeDatePickerTag = 6
+    let inactiveDatePickerTag = 7
+
     override func viewDidLoad() {
         super.viewDidLoad()
         addContentTopView(view: component)
         setupModel()
         setupPicker()
+        setupCalendar()
     }
         
     override func setupForm(){
@@ -49,7 +90,7 @@ class DatePickerViewController: BaseViewController<DatePicker> {
         addFormRow(label: "Error Text", view: errorTextField)
         addFormRow(label: "ToolTip Title", view: tooltipTitleTextField)
         addFormRow(label: "ToolTip Content", view: tooltipContentTextField)
-
+        append(section: getCalendarSection())
         disabledSwitch.onChange = { [weak self] sender in
             self?.component.isEnabled = !sender.isOn
         }
@@ -153,3 +194,248 @@ class DatePickerViewController: BaseViewController<DatePicker> {
                                                                             content: content) : nil
     }
 }
+
+extension DatePickerViewController {
+    
+    func getCalendarSection() -> FormSection {
+        let section = FormSection()
+        section.title = "Calendar Options"
+        section.addFormRow(label: "Hide Container Border", view: containerBorderSwitch)
+        section.addFormRow(label: "Hide Current Date Indicator", view: hideCurrentDateIndicatorSwitch)
+        section.addFormRow(label: "Min Date", view: minDatePicker)
+        section.addFormRow(label: "Max Date", view: maxDatePicker)
+        section.addFormRow(label: "Active Dates", view: activeDatesField)
+        section.addFormRow(label: "Select ActiveDate", view: activeDatePicker)
+        section.addFormRow(label: "Clear Active Dates", view: clearActiveDatesSwitch)
+        section.addFormRow(label: "Inactive Dates", view: inactiveDatesField)
+        section.addFormRow(label: "Select InActiveDate", view: inactiveDatePicker)
+        section.addFormRow(label: "Clear Inactive Dates", view: clearInactiveDatesSwitch)
+        section.addFormRow(label: "Indicator One", view: indicatorOneSwitch)
+        section.addFormRow(label: "Indicator Two", view: indicatorTwoSwitch)
+        section.addFormRow(label: "Indicator Three", view: indicatorThreeSwitch)
+        section.addFormRow(label: "Legend One", view: legendOneField)
+        section.addFormRow(label: "Legend Two", view: legendTwoField)
+        section.addFormRow(label: "Legend Three", view: legendThreeField)
+        section.addFormRow(label: "Indicator One Date", view: indicatorOnePicker)
+        section.addFormRow(label: "Indicator Two Date", view: indicatorTwoPicker)
+        section.addFormRow(label: "Indicator Three Date", view: indicatorThreePicker)
+        
+        
+        containerBorderSwitch.onChange = { [weak self] sender in
+            self?.updateCalendarModel()
+        }
+        
+        hideCurrentDateIndicatorSwitch.onChange = { [weak self] sender in
+            self?.updateCalendarModel()
+        }
+        
+        clearActiveDatesSwitch.onChange = { [weak self] sender in
+            self?.updateCalendarModel()
+        }
+        
+        clearInactiveDatesSwitch.onChange = { [weak self] sender in
+            self?.updateCalendarModel()
+        }
+        
+        legendOneField
+            .textPublisher
+            .sink {
+                [weak self] text in
+                self?.updateIndicatorData(label: text, date: self?.indicatorOnePicker.date, index: 0)
+            }.store(in: &subscribers)
+        
+        legendTwoField
+            .textPublisher
+            .sink {
+                [weak self] text in
+                self?.updateIndicatorData(label: text, date: self?.indicatorTwoPicker.date, index: 1)
+            }.store(in: &subscribers)
+        
+        legendThreeField
+            .textPublisher
+            .sink {
+                [weak self] text in
+                self?.updateIndicatorData(label: text, date: self?.indicatorThreePicker.date, index: 2)
+            }.store(in: &subscribers)
+        
+        indicatorOneSwitch.onChange = { [weak self] sender in
+            guard let self else { return }
+            if !sender.isOn {
+                self.indicators.removeAll()
+            } else {
+                self.setIndicatorsData()
+            }
+            self.updateCalendarModel()
+        }
+        
+        indicatorTwoSwitch.onChange =  { [weak self] sender in
+            guard let self else { return }
+            if !sender.isOn {
+                if self.indicators.count > 2 {
+                    self.indicators.removeLast()
+                    self.indicators.removeLast()
+                } else if self.indicators.count == 2 {
+                    self.indicators.removeLast()
+                }
+            } else {
+                self.setIndicatorsData()
+            }
+            self.updateCalendarModel()
+        }
+        
+        indicatorThreeSwitch.onChange = { [weak self] sender in
+            guard let self else { return }
+            if !sender.isOn {
+                if self.indicators.count > 2 {
+                    self.indicators.removeLast()
+                }
+            } else {
+                self.setIndicatorsData()
+            }
+            self.updateCalendarModel()
+        }
+        
+        return section
+    }
+    
+    func updateCalendarModel() {
+        component.calendarModel = .init(surface: component.surface,
+                                        hideContainerBorder: containerBorderSwitch.isOn,
+                                        hideCurrentDateIndicator: hideCurrentDateIndicatorSwitch.isOn,
+                                        activeDates: activeDates,
+                                        inactiveDates: inactiveDates,
+                                        minDate: minDate,
+                                        maxDate: maxDate,
+                                        indicators: indicators)
+    }
+    
+    func setupCalendar() {
+        configurePicker(indicatorOnePicker)
+        indicatorOnePicker.tag = indicatorOnePickerTag
+        configurePicker(indicatorTwoPicker)
+        indicatorTwoPicker.tag = indicatorTwoPickerTag
+        configurePicker(indicatorThreePicker)
+        indicatorThreePicker.tag = indicatorThreePickerTag
+        configurePicker(minDatePicker)
+        minDatePicker.tag = minDatePickerTag
+        configurePicker(maxDatePicker)
+        maxDatePicker.tag = maxDatePickerTag
+        configurePicker(activeDatePicker)
+        activeDatePicker.tag = activeDatePickerTag
+        configurePicker(inactiveDatePicker)
+        inactiveDatePicker.tag = inactiveDatePickerTag
+        indicators = [
+            .init(label: "Due Date", date: indicatorOnePicker.date),
+            .init(label: "Auto Pay", date: indicatorTwoPicker.date),
+            .init(label: "Scheduled", date: indicatorThreePicker.date)
+        ]
+        
+        let calendar = Calendar.current
+        let indicatorDate = calendar.startOfDay(for: calendar.date(byAdding: .day, value: 1, to: Date())!)
+        legendOneField.text = "Due Date"
+        legendTwoField.text = "Auto Pay"
+        legendThreeField.text = "Scheduled"
+        indicatorOneSwitch.isOn = true
+        indicatorTwoSwitch.isOn = true
+        indicatorThreeSwitch.isOn = true
+        hideCurrentDateIndicatorSwitch.isOn = false
+        indicatorOnePicker.date = indicatorDate
+        indicatorTwoPicker.date = indicatorDate
+        indicatorThreePicker.date = indicatorDate
+        updateIndicatorData(label: legendOneField.text ?? "", date: indicatorOnePicker.date, index: 0)
+        updateIndicatorData(label: legendTwoField.text ?? "", date: indicatorTwoPicker.date, index: 1)
+        updateIndicatorData(label: legendThreeField.text ?? "", date: indicatorThreePicker.date, index: 2)
+        
+        activeDatesField.isUserInteractionEnabled = false
+        inactiveDatesField.isUserInteractionEnabled = false
+        activeDatesField.isEnabled = false
+        inactiveDatesField.isEnabled = false
+        
+        minDatePicker.date = minDate
+        maxDatePicker.date = maxDate
+
+        updateCalendarModel()
+    }
+    
+    func updateIndicatorData(label: String = "", date: Date?, index:Int) {
+        indicators[index].label = label
+        indicators[index].date = date ?? Date()
+        updateCalendarModel()
+    }
+    
+    func setIndicatorsData() {
+        if indicatorOneSwitch.isOn && indicatorTwoSwitch.isOn && indicatorThreeSwitch.isOn {
+            indicators = [
+                .init(label: self.legendOneField.text ?? "", date: indicatorOnePicker.date),
+                .init(label: self.legendTwoField.text ?? "", date: indicatorTwoPicker.date),
+                .init(label: self.legendThreeField.text ?? "", date: indicatorThreePicker.date)
+            ]
+        } else if indicatorOneSwitch.isOn && indicatorTwoSwitch.isOn && !indicatorThreeSwitch.isOn {
+            indicators = [
+                .init(label: self.legendOneField.text ?? "", date: indicatorOnePicker.date),
+                .init(label: self.legendTwoField.text ?? "", date: indicatorTwoPicker.date),
+            ]
+            
+        } else if indicatorOneSwitch.isOn && !indicatorTwoSwitch.isOn {
+            indicators = [
+                .init(label: self.legendOneField.text ?? "", date: indicatorOnePicker.date),
+            ]
+        }
+    }
+    
+    func configurePicker(_ sender:UIDatePicker) {
+        // Set some of UIDatePicker properties
+        sender.timeZone = NSTimeZone.local
+        sender.backgroundColor = UIColor.white
+        
+        // Add an event to call onDidChangeDate function when value is changed.
+        sender.addTarget(self, action: #selector(self.datePickerValueChanged(_:)), for: .valueChanged)
+    }
+    
+    @objc func datePickerValueChanged(_ sender: UIDatePicker){
+                        
+        switch sender.tag {
+        case indicatorOnePickerTag:
+            updateIndicatorData(label: legendOneField.text ?? "", date: sender.date, index: 0)
+        case indicatorTwoPickerTag:
+            updateIndicatorData(label: legendTwoField.text ?? "", date: sender.date, index: 1)
+        case indicatorThreePickerTag:
+            updateIndicatorData(label: legendThreeField.text ?? "", date: sender.date, index: 2)
+        case minDatePickerTag:
+            minDate = sender.date
+        case maxDatePickerTag:
+            maxDate = sender.date
+        case activeDatePickerTag:
+            activeDates.append(sender.date)
+            var text = activeDatesField.text
+            if let textEmpty = text?.isEmpty, textEmpty == true {
+                text?.append("")
+            } else {
+                text?.append(", ")
+            }
+            text?.append("\(self.getSelectedDate(with: sender.date))")
+            clearActiveDatesSwitch.isOn = false
+            activeDatesField.text = text
+        case inactiveDatePickerTag:
+            inactiveDates.append(sender.date)
+            var text = inactiveDatesField.text
+            if let textEmpty = text?.isEmpty, textEmpty == true {
+                text?.append("")
+            } else {
+                text?.append(", ")
+            }
+            text?.append("\(self.getSelectedDate(with: sender.date))")
+            clearInactiveDatesSwitch.isOn = false
+            inactiveDatesField.text = text
+        default: break
+        }
+    }
+    
+    func getSelectedDate(with date:Date) -> String {
+        let dateFormatter: DateFormatter = DateFormatter()
+        dateFormatter.dateFormat = "MM/dd/yyyy"
+        let day: String = dateFormatter.string(from: date)
+        return day
+    }
+
+}

VDSSample/ViewControllers/MenuViewController.swift

@@ -74,12 +74,12 @@ class MenuViewController: UITableViewController, TooltipLaunchable {
         MenuComponent(title: "Button", completed: true, viewController: ButtonViewController.self),
         MenuComponent(title: "ButtonGroup", completed: true, viewController: ButtonGroupViewController.self),
         MenuComponent(title: "ButtonIcon", completed: true, viewController: ButtonIconViewController.self),
-        MenuComponent(title: "Calendar", completed: false, viewController: CalendarViewController.self),
+        MenuComponent(title: "Calendar", completed: true, viewController: CalendarViewController.self),
         MenuComponent(title: "Carousel Scrollbar", completed: true, viewController: CarouselScrollbarViewConttroller.self),
         MenuComponent(title: "Checkbox", completed: true, viewController: CheckboxViewController.self),
         MenuComponent(title: "CheckboxItem", completed: true, viewController: CheckboxItemViewController.self),
         MenuComponent(title: "CheckboxGroup", completed: true, viewController: CheckboxGroupViewController.self),
-        MenuComponent(title: "DatePicker", completed: false, viewController: DatePickerViewController.self),
+        MenuComponent(title: "DatePicker", completed: true, viewController: DatePickerViewController.self),
         MenuComponent(title: "DropdownSelect", completed: true, viewController: DropdownSelectViewController.self),
         MenuComponent(title: "Icon", completed: true, viewController: IconViewController.self),
         MenuComponent(title: "InputField", completed: true, viewController: InputFieldViewController.self),