Commit 95213577 authored by Quentin Muret's avatar Quentin Muret Committed by Kateryna Kostiuk

call view: improve UI / UX

- improve UI / UX: the view has been refactored
- add UIDevice extension allowing to know if the device has a notch or not
- doesn't show hours of the duration label when the call is under 1 hour
- management of the screen orientation for both audio and video calls
- the Name Label is showing bigger and the Duration label is showing smaller
- the UI has been adapted to the size of the iPhone 5
- fix the bug concerning the disappearance of the info and buttons containers
- show the Ring ID when the display name doesn't exist

Change-Id: I78203660603e451a2b088a3fcad1e64bbbe4f8e0
Reviewed-by: Kateryna Kostiuk<kateryna.kostiuk@savoirfairelinux.com>
parent d752c4eb
...@@ -133,10 +133,12 @@ struct AccountModelHelper { ...@@ -133,10 +133,12 @@ struct AccountModelHelper {
let accountUsernameKey = ConfigKeyModel(withKey: ConfigKey.accountUsername) let accountUsernameKey = ConfigKeyModel(withKey: ConfigKey.accountUsername)
let accountUsername = self.account.details?.get(withConfigKeyModel: accountUsernameKey) let accountUsername = self.account.details?.get(withConfigKeyModel: accountUsernameKey)
guard let userName = accountUsername else {
if accountUsername!.contains(AccountModelHelper.ringIdPrefix) { return nil
let index = accountUsername?.range(of: AccountModelHelper.ringIdPrefix)?.upperBound }
return accountUsername?.substring(from: index!) if userName.contains(AccountModelHelper.ringIdPrefix) {
let index = userName.range(of: AccountModelHelper.ringIdPrefix)?.upperBound
return userName.substring(from: index!)
} else { } else {
return nil return nil
} }
......
...@@ -23,6 +23,7 @@ import RxSwift ...@@ -23,6 +23,7 @@ import RxSwift
class ButtonsContainerView: UIView, NibLoadable { class ButtonsContainerView: UIView, NibLoadable {
//Outlets
@IBOutlet var containerView: UIView! @IBOutlet var containerView: UIView!
@IBOutlet weak var container: UIView! @IBOutlet weak var container: UIView!
@IBOutlet weak var stackView: UIStackView! @IBOutlet weak var stackView: UIStackView!
...@@ -33,12 +34,17 @@ class ButtonsContainerView: UIView, NibLoadable { ...@@ -33,12 +34,17 @@ class ButtonsContainerView: UIView, NibLoadable {
@IBOutlet weak var switchCameraButton: UIButton! @IBOutlet weak var switchCameraButton: UIButton!
@IBOutlet weak var switchSpeakerButton: UIButton! @IBOutlet weak var switchSpeakerButton: UIButton!
@IBOutlet weak var cancelButton: UIButton! @IBOutlet weak var cancelButton: UIButton!
//Constraints
@IBOutlet weak var cancelButtonWidthConstraint: NSLayoutConstraint!
@IBOutlet weak var cancelButtonBottomConstraint: NSLayoutConstraint!
@IBOutlet weak var cancelButtonHeightConstraint: NSLayoutConstraint! @IBOutlet weak var cancelButtonHeightConstraint: NSLayoutConstraint!
@IBOutlet weak var containerHeightConstraint: NSLayoutConstraint! @IBOutlet weak var stackViewYConstraint: NSLayoutConstraint!
@IBOutlet weak var stackViewWidthConstraint: NSLayoutConstraint! @IBOutlet weak var stackViewWidthConstraint: NSLayoutConstraint!
@IBOutlet weak var stackViewBottomConstraint: NSLayoutConstraint! @IBOutlet weak var containerHeightConstraint: NSLayoutConstraint!
let disposeBag = DisposeBag() let disposeBag = DisposeBag()
var isCallStarted: Bool = false
var viewModel: ButtonsContainerViewModel? { var viewModel: ButtonsContainerViewModel? {
didSet { didSet {
...@@ -73,7 +79,6 @@ class ButtonsContainerView: UIView, NibLoadable { ...@@ -73,7 +79,6 @@ class ButtonsContainerView: UIView, NibLoadable {
guard let window = self.window else { guard let window = self.window else {
return return
} }
self.container.bottomAnchor.constraint(equalTo: window.bottomAnchor).isActive = true
} }
} }
...@@ -84,47 +89,52 @@ class ButtonsContainerView: UIView, NibLoadable { ...@@ -84,47 +89,52 @@ class ButtonsContainerView: UIView, NibLoadable {
} }
func withoutOptions() { func withoutOptions() {
self.container.backgroundColor = UIColor.clear self.container.backgroundColor = UIColor.clear
self.backgroundBlurEffect.isHidden = true self.backgroundBlurEffect.isHidden = true
muteAudioButton.isHidden = true muteAudioButton.isHidden = true
muteVideoButton.isHidden = true muteVideoButton.isHidden = true
pauseCallButton.isHidden = true pauseCallButton.isHidden = true
switchCameraButton.isHidden = true switchCameraButton.isHidden = true
switchSpeakerButton.isHidden = true switchSpeakerButton.isHidden = true
cancelButton.isHidden = false cancelButton.isHidden = false
} }
func optionsWithSpeaker() { func optionsWithSpeaker() {
self.backgroundBlurEffect.isHidden = false if !self.isCallStarted {
muteAudioButton.isHidden = false self.isCallStarted = true
if self.viewModel?.isAudioOnly ?? false { self.backgroundBlurEffect.isHidden = false
self.stackViewWidthConstraint.constant = 200 muteAudioButton.isHidden = false
muteVideoButton.isHidden = true if self.viewModel?.isAudioOnly ?? false {
switchCameraButton.isHidden = true muteVideoButton.isHidden = true
} else { switchCameraButton.isHidden = true
muteVideoButton.isHidden = false } else {
switchCameraButton.isHidden = false muteVideoButton.isHidden = false
switchCameraButton.isHidden = false
}
pauseCallButton.isHidden = false
switchSpeakerButton.isHidden = false
switchSpeakerButton.alpha = 1.00
switchSpeakerButton.isEnabled = true
cancelButton.isHidden = false
} }
pauseCallButton.isHidden = false
switchSpeakerButton.isHidden = false
switchSpeakerButton.alpha = 1.00
switchSpeakerButton.isEnabled = true
cancelButton.isHidden = false
} }
func optionsWithoutSpeaker() { func optionsWithoutSpeaker() {
if self.viewModel?.isAudioOnly ?? false { if !self.isCallStarted {
self.stackViewWidthConstraint.constant = 150 self.isCallStarted = true
muteVideoButton.isHidden = true if self.viewModel?.isAudioOnly ?? false {
switchCameraButton.isHidden = true muteVideoButton.isHidden = true
} else { switchCameraButton.isHidden = true
muteVideoButton.isHidden = false switchSpeakerButton.isHidden = true
switchCameraButton.isHidden = false } else {
muteVideoButton.isHidden = false
switchCameraButton.isHidden = false
switchSpeakerButton.isHidden = false
}
self.muteAudioButton.isHidden = false
self.backgroundBlurEffect.isHidden = false
pauseCallButton.isHidden = false
cancelButton.isHidden = false
} }
self.backgroundBlurEffect.isHidden = false
muteAudioButton.isHidden = false
pauseCallButton.isHidden = false
switchSpeakerButton.isHidden = true
cancelButton.isHidden = false
} }
} }
This diff is collapsed.
This diff is collapsed.
...@@ -310,7 +310,12 @@ class CallViewModel: Stateable, ViewModel { ...@@ -310,7 +310,12 @@ class CallViewModel: Stateable, ViewModel {
let seconds = interval % 60 let seconds = interval % 60
let minutes = (interval / 60) % 60 let minutes = (interval / 60) % 60
let hours = (interval / 3600) let hours = (interval / 3600)
return String(format: "%02d:%02d:%02d", hours, minutes, seconds) switch hours {
case 0:
return String(format: "%02d:%02d", minutes, seconds)
default:
return String(format: "%02d:%02d:%02d", hours, minutes, seconds)
}
} }
func cancelCall() { func cancelCall() {
......
...@@ -23,6 +23,15 @@ import UIKit ...@@ -23,6 +23,15 @@ import UIKit
public extension UIDevice { public extension UIDevice {
var hasNotch: Bool {
var bottom: CGFloat = 0
if #available(iOS 11.0, *) {
bottom = UIApplication.shared.keyWindow?.safeAreaInsets.bottom ?? 0
} else {
bottom = 0
}
return bottom > 0
}
static let modelName: String = { static let modelName: String = {
var systemInfo = utsname() var systemInfo = utsname()
uname(&systemInfo) uname(&systemInfo)
......
...@@ -48,7 +48,6 @@ extension UIColor { ...@@ -48,7 +48,6 @@ extension UIColor {
static let ringMsgTextFieldBorder = UIColor(red: 220, green: 220, blue: 220, alpha: 1.0) static let ringMsgTextFieldBorder = UIColor(red: 220, green: 220, blue: 220, alpha: 1.0)
static let ringUITableViewCellSelection = UIColor(red: 209, green: 210, blue: 210, alpha: 1.0) static let ringUITableViewCellSelection = UIColor(red: 209, green: 210, blue: 210, alpha: 1.0)
static let ringNavigationBar = UIColor(red: 235, green: 235, blue: 235, alpha: 1.0) static let ringNavigationBar = UIColor(red: 235, green: 235, blue: 235, alpha: 1.0)
static let ringCallInfos = UIColor(hex: 0x626262, alpha: 1.0)
static let ringCallPulse = UIColor(red: 99, green: 191, blue: 208, alpha: 1.0) static let ringCallPulse = UIColor(red: 99, green: 191, blue: 208, alpha: 1.0)
static let ringSuccess = UIColor(hex: 0x00b20b, alpha: 1.0) static let ringSuccess = UIColor(hex: 0x00b20b, alpha: 1.0)
static let ringFailure = UIColor(hex: 0xf00000, alpha: 1.0) static let ringFailure = UIColor(hex: 0xf00000, alpha: 1.0)
......
...@@ -350,7 +350,7 @@ class ConversationViewModel: Stateable, ViewModel { ...@@ -350,7 +350,7 @@ class ConversationViewModel: Stateable, ViewModel {
if self.conversation.value.messages.isEmpty { if self.conversation.value.messages.isEmpty {
self.sendContactRequest() self.sendContactRequest()
} }
self.stateSubject.onNext(ConversationState.startCall(contactRingId: self.conversation.value.recipientRingId, userName: self.userName.value)) self.stateSubject.onNext(ConversationState.startCall(contactRingId: self.conversation.value.recipientRingId, userName: self.displayName.value ?? self.userName.value))
} }
func startAudioCall() { func startAudioCall() {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment