UI: update call view

Change-Id: I809dcb60e7a8322b9794adb0a07c4c30ab7cc81c

Ring/Ring/Calls/ButtonsContainerView.swift

@@ -22,31 +22,35 @@ import UIKit
 import Reusable
 import RxSwift
 
-class ButtonsContainerView: UIView, NibLoadable {
+class ButtonsContainerView: UIView, NibLoadable, UIScrollViewDelegate {
 
     //Outlets
     @IBOutlet var containerView: UIView!
     @IBOutlet  weak var container: UIView!
     @IBOutlet weak var stackView: UIStackView!
+    @IBOutlet weak var firstPageStackView: UIStackView!
+    @IBOutlet weak var secondPageStackView: UIStackView!
     @IBOutlet weak var backgroundBlurEffect: UIVisualEffectView!
-    @IBOutlet  weak var muteAudioButton: UIButton!
-    @IBOutlet  weak var muteVideoButton: UIButton!
-    @IBOutlet  weak var pauseCallButton: UIButton!
-    @IBOutlet  weak var dialpadButton: UIButton!
-    @IBOutlet  weak var switchSpeakerButton: UIButton!
-    @IBOutlet  weak var cancelButton: UIButton!
-    @IBOutlet  weak var switchCameraButton: UIButton!
-    @IBOutlet  weak var acceptCallButton: UIButton!
+    @IBOutlet  weak var cancelButton: UIButton! // cancel pending outgoing call
+    @IBOutlet  weak var pageControl: UIPageControl!
+    @IBOutlet  weak var scrollView: UIScrollView!
 
     //Constraints
     @IBOutlet weak var cancelButtonWidthConstraint: NSLayoutConstraint!
-    @IBOutlet weak var cancelButtonCenterConstraint: NSLayoutConstraint!
-    @IBOutlet weak var cancelButtonBottomConstraint: NSLayoutConstraint!
     @IBOutlet weak var cancelButtonHeightConstraint: NSLayoutConstraint!
-    @IBOutlet weak var stackViewYConstraint: NSLayoutConstraint!
-    @IBOutlet weak var stackViewWidthConstraint: NSLayoutConstraint!
+    @IBOutlet weak var cancelButtonBottomConstraint: NSLayoutConstraint!
     @IBOutlet weak var containerHeightConstraint: NSLayoutConstraint!
 
+    //Buttons
+    var muteAudioButton: UIButton!
+    var muteVideoButton: UIButton!
+    var pauseCallButton: UIButton!
+    var dialpadButton: UIButton!
+    var stopButton: UIButton! // stop current call
+    var switchCameraButton: UIButton!
+    var switchSpeakerButton: UIButton!
+    var addParticipantButton: UIButton!
+
     let disposeBag = DisposeBag()
     var isCallStarted: Bool = false
 
@@ -59,9 +63,9 @@ class ButtonsContainerView: UIView, NibLoadable {
                     case .none:
                         self?.withoutOptions()
                     case .optionsWithoutSpeakerphone:
-                        self?.optionsWithoutSpeaker()
+                        self?.update(withSpeakerEnable: false)
                     case .optionsWithSpeakerphone:
-                        self?.optionsWithSpeaker()
+                        self?.update(withSpeakerEnable: true)
                     }
                 })
                 .disposed(by: self.disposeBag)
@@ -81,6 +85,7 @@ class ButtonsContainerView: UIView, NibLoadable {
     override func didMoveToWindow() {
         super.didMoveToWindow()
         self.cancelButton.backgroundColor = UIColor.red
+        self.stopButton.backgroundColor = UIColor.red
     }
 
     func commonInit() {
@@ -88,93 +93,106 @@ class ButtonsContainerView: UIView, NibLoadable {
         addSubview(containerView)
         containerView.frame = self.bounds
         self.container.clipsToBounds = false
+        scrollView.delegate = self
+        muteAudioButton = configureButton(image: UIImage(asset: Asset.audioMuted))
+        muteVideoButton = configureButton(image: UIImage(asset: Asset.videoMuted))
+        pauseCallButton = configureButton(image: UIImage(asset: Asset.pauseCall))
+        dialpadButton = configureButton(image: UIImage(asset: Asset.dialpad))
+        stopButton = configureButton(image: UIImage(asset: Asset.stopCall))
+        stopButton.borderColor = UIColor.red
+        switchCameraButton = configureButton(image: UIImage(asset: Asset.switchCamera))
+        switchSpeakerButton = configureButton(image: UIImage(asset: Asset.enableSpeakerphone))
+        addParticipantButton = configureButton(image: UIImage(asset: Asset.addPerson))
+        pageControl.addTarget(self, action: #selector(changePage), for: UIControl.Event.valueChanged)
+    }
+
+    func configureButton(image: UIImage?) -> UIButton {
+        let button = UIButton()
+        button.heightAnchor.constraint(equalToConstant: 50).isActive = true
+        button.widthAnchor.constraint(equalToConstant: 50).isActive = true
+        button.cornerRadius = 25
+        button.borderWidth = 1
+        button.borderColor = UIColor.white
+        button.tintColor = UIColor.white
+        button.setImage(image, for: .normal)
+        return button
     }
 
     func withoutOptions() {
         self.container.backgroundColor = UIColor.clear
         self.backgroundBlurEffect.isHidden = true
-        switchCameraButton.isHidden = true
-        muteAudioButton.isHidden = true
-        muteVideoButton.isHidden = true
-        pauseCallButton.isHidden = true
-        dialpadButton.isHidden = true
-        switchSpeakerButton.isHidden = true
         cancelButton.isHidden = false
+        firstPageStackView.removeSubviews()
+        secondPageStackView.removeSubviews()
+        pageControl.isHidden = true
         if self.viewModel?.isIncoming ?? false {
-            acceptCallButton.isHidden = false
             cancelButtonBottomConstraint.constant = 60
-            cancelButtonCenterConstraint.constant = -80
             return
         }
-        cancelButtonCenterConstraint.constant = 0
         cancelButtonBottomConstraint.constant = 20
+        scrollView.isScrollEnabled = false
     }
 
-    func optionsWithSpeaker() {
-        acceptCallButton.isHidden = true
-        cancelButtonCenterConstraint.constant = 0
+    func update(withSpeakerEnable enable: Bool) {
         self.backgroundBlurEffect.isHidden = false
-        muteAudioButton.isHidden = false
-        if self.viewModel?.isAudioOnly ?? false {
-            muteVideoButton.isHidden = true
-            switchCameraButton.isHidden = true
-            if self.viewModel?.isSipCall ?? false {
-                dialpadButton.isHidden = false
-            }
-            cancelButtonBottomConstraint.constant = 20
+        cancelButton.isHidden = true
+        switchSpeakerButton.isEnabled = enable
+        let isSip = self.viewModel?.isSipCall ?? false
+        let audioOnly = self.viewModel?.isAudioOnly ?? false
+        var havePages = false
+        if isSip {
+            firstPageStackView.removeSubviews()
+            secondPageStackView.removeSubviews()
+            firstPageStackView.addArrangedSubview(stopButton)
+            firstPageStackView.addArrangedSubview(pauseCallButton)
+            firstPageStackView.addArrangedSubview(muteAudioButton)
+            firstPageStackView.addArrangedSubview(switchSpeakerButton)
+            firstPageStackView.addArrangedSubview(dialpadButton)
+        } else if audioOnly {
+            firstPageStackView.removeSubviews()
+            secondPageStackView.removeSubviews()
+            firstPageStackView.addArrangedSubview(stopButton)
+            firstPageStackView.addArrangedSubview(pauseCallButton)
+            firstPageStackView.addArrangedSubview(muteAudioButton)
+            firstPageStackView.addArrangedSubview(switchSpeakerButton)
+            firstPageStackView.addArrangedSubview(addParticipantButton)
         } else {
-            muteVideoButton.isHidden = false
-            switchCameraButton.isHidden = false
-            cancelButtonBottomConstraint.constant = 80
+            let screenRect = UIScreen.main.bounds
+            let screenWidth: CGFloat = screenRect.size.width
+            let buttonsWidth: CGFloat = 7 * 50 + 30 * 6 //540
+            havePages = screenWidth < buttonsWidth
+            firstPageStackView.removeSubviews()
+            secondPageStackView.removeSubviews()
+            firstPageStackView.addArrangedSubview(stopButton)
+            firstPageStackView.addArrangedSubview(pauseCallButton)
+            firstPageStackView.addArrangedSubview(switchCameraButton)
+            firstPageStackView.addArrangedSubview(switchSpeakerButton)
+            firstPageStackView.addArrangedSubview(addParticipantButton)
+            if havePages {
+                secondPageStackView.addArrangedSubview(muteAudioButton)
+                secondPageStackView.addArrangedSubview(muteVideoButton)
+            } else {
+                firstPageStackView.addArrangedSubview(muteAudioButton)
+                firstPageStackView.addArrangedSubview(muteVideoButton)
             }
-        pauseCallButton.isHidden = false
-        switchSpeakerButton.isEnabled = true
-        switchSpeakerButton.isHidden = false
-        cancelButton.isHidden = false
-        setUpConference()
-        setButtonsColor()
         }
-
-    func optionsWithoutSpeaker() {
-        acceptCallButton.isHidden = true
-        cancelButtonCenterConstraint.constant = 0
+        pageControl.isHidden = !havePages
+        scrollView.isScrollEnabled = havePages
         if self.viewModel?.isAudioOnly ?? false {
-            muteVideoButton.isHidden = true
-            switchCameraButton.isHidden = true
-            if self.viewModel?.isSipCall ?? false {
-                dialpadButton.isHidden = false
-            }
             cancelButtonBottomConstraint.constant = 20
         } else {
-            switchCameraButton.isHidden = false
-            muteVideoButton.isHidden = false
             cancelButtonBottomConstraint.constant = 80
         }
-        switchSpeakerButton.isEnabled = false
-        self.muteAudioButton.isHidden = false
-        switchSpeakerButton.isHidden = false
-        self.backgroundBlurEffect.isHidden = false
-        pauseCallButton.isHidden = false
-        cancelButton.isHidden = false
-        setUpConference()
         setButtonsColor()
     }
 
-    func setUpConference() {
-        if !(self.viewModel?.isConference ?? false) {
-            return
-        }
-        pauseCallButton.isHidden = true
-        muteAudioButton.isHidden = true
-        muteVideoButton.isHidden = true
-        cancelButtonBottomConstraint.constant = 0
-    }
-
     func updateView() {
-        if switchSpeakerButton.isEnabled && !switchSpeakerButton.isHidden {
-            self.optionsWithSpeaker()
+        if firstPageStackView.subviews.isEmpty {
+            self.withoutOptions()
+        } else if switchSpeakerButton.isEnabled && !switchSpeakerButton.isHidden {
+            self.update(withSpeakerEnable: true)
         } else if !switchSpeakerButton.isHidden {
-            self.optionsWithoutSpeaker()
+            self.update(withSpeakerEnable: false)
         }
     }
 
@@ -202,4 +220,16 @@ class ButtonsContainerView: UIView, NibLoadable {
         muteVideoButton.borderColor = UIColor.white
         switchCameraButton.tintColor = UIColor.white
     }
+
+    @objc
+    func changePage(sender: AnyObject) {
+        let xpoint = CGFloat(pageControl.currentPage) * scrollView.frame.size.width
+        scrollView.setContentOffset(CGPoint(x: xpoint, y: 0), animated: true)
+    }
+
+    func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
+        let pageNumber = round(scrollView.contentOffset.x / scrollView.frame.size.width)
+        pageControl.currentPage = Int(pageNumber)
+    }
+
 }

Ring/Ring/Calls/CallViewController.swift

@@ -49,7 +49,6 @@ class CallViewController: UIViewController, StoryboardBased, ViewModelBased, Con
     @IBOutlet weak var capturedVideoBlurEffect: UIVisualEffectView!
     @IBOutlet weak var viewCapturedVideo: UIView!
     @IBOutlet private weak var infoContainer: UIView!
-    //@IBOutlet private weak var callProfileImage: UIImageView!
     @IBOutlet private weak var callNameLabel: UILabel!
     @IBOutlet private weak var callInfoTimerLabel: UILabel!
     @IBOutlet private weak var buttonsContainer: ButtonsContainerView!
@@ -74,8 +73,6 @@ class CallViewController: UIViewController, StoryboardBased, ViewModelBased, Con
     @IBOutlet weak var conferenceLayout: ConferenceLayout!
 
     @IBOutlet weak var sendMessageButton: UIButton!
-    @IBOutlet weak var inConferenceAddContactButton: UIView!
-    @IBOutlet weak var conferenceCallsLeading: NSLayoutConstraint!
     @IBOutlet weak var conferenceCallsTop: NSLayoutConstraint!
 
     var viewModel: CallViewModel!
@@ -124,7 +121,6 @@ class CallViewController: UIViewController, StoryboardBased, ViewModelBased, Con
         UIApplication.shared.isIdleTimerDisabled = true
         initCallAnimation()
         self.configureConferenceLayout()
-        self.inConferenceAddContactButton.isHidden = !self.viewModel.conferenceMode.value
         if callCurrent {
             self.capturedVideoBlurEffect.alpha = 1
             hideCapturedVideo()
@@ -146,14 +142,6 @@ class CallViewController: UIViewController, StoryboardBased, ViewModelBased, Con
         buttonsStackView.isHidden = self.viewModel.isBoothMode()
     }
 
-    @IBAction func addParticipant(_ sender: Any) {
-        let children = self.children
-        for child in children where child.isKind(of: (ContactPickerViewController).self) {
-            return
-        }
-        self.viewModel.showContactPickerVC()
-    }
-
     func addTapGesture() {
         self.mainView.addGestureRecognizer(tapGestureRecognizer)
     }
@@ -237,19 +225,16 @@ class CallViewController: UIViewController, StoryboardBased, ViewModelBased, Con
                 self?.removeFromScreen()
             })
             .disposed(by: self.disposeBag)
-        self.sendMessageButton.rx.tap
+        self.buttonsContainer.stopButton.rx.tap
             .subscribe(onNext: { [weak self] in
-                self?.viewModel.showConversations()
-                self?.dismiss(animated: false, completion: nil)
+                self?.viewModel.cancelCall(stopProvider: true)
+                self?.removeFromScreen()
             })
             .disposed(by: self.disposeBag)
-
-        self.buttonsContainer.acceptCallButton.rx.tap
+        self.sendMessageButton.rx.tap
             .subscribe(onNext: { [weak self] in
-                guard let self = self else { return }
-                self.viewModel.answerCall()
-                    .subscribe()
-                    .disposed(by: self.disposeBag)
+                self?.viewModel.showConversations()
+                self?.dismiss(animated: false, completion: nil)
             })
             .disposed(by: self.disposeBag)
 
@@ -290,7 +275,16 @@ class CallViewController: UIViewController, StoryboardBased, ViewModelBased, Con
                 self?.viewModel.switchSpeaker()
             })
             .disposed(by: self.disposeBag)
-
+        self.buttonsContainer.addParticipantButton.rx.tap
+            .subscribe(onNext: { [weak self] in
+                guard let self = self else { return }
+                let children = self.children
+                for child in children where child.isKind(of: (ContactPickerViewController).self) {
+                    return
+                }
+                self.viewModel.showContactPickerVC()
+            })
+            .disposed(by: self.disposeBag)
         //Data bindings
         self.viewModel.videoButtonState
             .observeOn(MainScheduler.instance)
@@ -356,8 +350,6 @@ class CallViewController: UIViewController, StoryboardBased, ViewModelBased, Con
                     if self?.viewModel.isAudioOnly ?? true {
                         self?.buttonContainerHeightConstraint.constant = 200
                         self?.buttonsContainer.containerHeightConstraint.constant = 200
-                        self?.buttonsContainer.stackViewYConstraint.constant = 110
-                        self?.buttonsContainer.stackViewWidthConstraint.priority = UILayoutPriority(rawValue: 999)
                         UIView.animate(withDuration: 0.3, animations: {
                             self?.durationLabel.alpha = 1
                             self?.buttonsContainer.stackView.alpha = 1
@@ -461,25 +453,23 @@ class CallViewController: UIViewController, StoryboardBased, ViewModelBased, Con
                 self?.buttonsContainer.updateView()
                 self?.infoContainer.isHidden = enteredConference ? true : false
                 self?.resizeCapturedVideo(withInfoContainer: false)
-                self?.inConferenceAddContactButton.isHidden = !enteredConference
-                self?.conferenceCallsLeading.constant = enteredConference ? 0 : -80
                 // if entered conference add first participant to conference list
                 if enteredConference {
                     self?.removeConferenceParticipantMenu()
                     guard let injectionBag = self?.viewModel.injectionBag
                     else { return }
                     // add self as a master call
-                    let masterCallView =
+                    let mainCallView =
                         ConferenceParticipantView(frame: CGRect(x: 0,
                                                                 y: 0,
                                                                 width: inConfViewWidth,
                                                                 height: inConfViewHeight))
-                    let masterCallViewModel =
+                    let mainCallViewModel =
                         ConferenceParticipantViewModel(with: nil,
                                                        injectionBag: injectionBag)
-                    masterCallView.viewModel = masterCallViewModel
-                    masterCallView.delegate = self
-                    self?.conferenceCalls.insertArrangedSubview(masterCallView, at: 0)
+                    mainCallView.viewModel = mainCallViewModel
+                    mainCallView.delegate = self
+                    self?.conferenceCalls.insertArrangedSubview(mainCallView, at: 0)
                     let callView =
                         ConferenceParticipantView(frame: CGRect(x: 0,
                                                                 y: 0,
@@ -642,6 +632,7 @@ class CallViewController: UIViewController, StoryboardBased, ViewModelBased, Con
             DispatchQueue.main.async { [weak self] in
                 //guard let hidden = self?.infoContainer.isHidden else {return}
                 self?.resizeCapturedVideo(withInfoContainer: false)
+                self?.buttonsContainer.updateView()
                 if UIDevice.current.hasNotch && (UIDevice.current.orientation == .landscapeRight || UIDevice.current.orientation == .landscapeLeft) && self?.infoContainer.isHidden == false {
                     self?.buttonsContainerBottomConstraint.constant = 1
                 }
@@ -733,7 +724,6 @@ class CallViewController: UIViewController, StoryboardBased, ViewModelBased, Con
             self.infoContainer.isHidden = false
         } else {
             self.conferenceCallsScrolView.isHidden = false
-            self.inConferenceAddContactButton.isHidden = false
         }
         self.view.layoutIfNeeded()
 
@@ -763,7 +753,6 @@ class CallViewController: UIViewController, StoryboardBased, ViewModelBased, Con
                     self?.infoContainer.isHidden = true
                 } else {
                     self?.conferenceCallsScrolView.isHidden = true
-                    self?.inConferenceAddContactButton.isHidden = true
                 }
                 self?.buttonsContainer.isHidden = true
         })

Ring/Ring/Calls/Conference/ContactPickerViewController.swift

@@ -141,7 +141,7 @@ class ContactPickerViewController: UIViewController, StoryboardBased, ViewModelB
 
                 var contact = contactItem.contacts.first!
                 cell.nameLabel.text = contact.firstLine
-                cell.lastMessagePreviewLabel?.text = contact.secondLine
+                cell.lastMessagePreviewLabel?.isHidden = true
 
                 var imageData: Data?
                 if let contactProfile = contact.profile, let photo = contactProfile.photo,