Skip to content

Commit e3bc7ad

Browse files
Merge pull request #71 from woocommerce/issue/22-woo-prologue
Implements Login Prologue
2 parents 10fcb49 + f1ce067 commit e3bc7ad

File tree

18 files changed

+508
-27
lines changed

18 files changed

+508
-27
lines changed

WooCommerce/Classes/AppDelegate.swift

Lines changed: 26 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,13 @@
11
import UIKit
22
import CoreData
3+
34
import CocoaLumberjack
5+
import WordPressUI
46
import WordPressKit
57
import WordPressAuthenticator
68

79

10+
811
// MARK: - Woo's App Delegate!
912
//
1013
@UIApplicationMain
@@ -30,7 +33,7 @@ class AppDelegate: UIResponder, UIApplicationDelegate {
3033

3134
// Setup the Interface!
3235
setupMainWindow()
33-
setupInterfaceAppearance()
36+
setupComponentsAppearance()
3437

3538
// Setup Components
3639
setupAuthenticationManager()
@@ -88,16 +91,36 @@ private extension AppDelegate {
8891
window?.makeKeyAndVisible()
8992
}
9093

94+
/// Sets up all of the component(s) Appearance.
95+
///
96+
func setupComponentsAppearance() {
97+
setupWooAppearance()
98+
setupFancyButtonAppearance()
99+
}
100+
91101
/// Sets up WooCommerce's UIAppearance.
92102
///
93-
func setupInterfaceAppearance() {
103+
func setupWooAppearance() {
94104
UINavigationBar.appearance().barTintColor = StyleManager.wooCommerceBrandColor
95105
UINavigationBar.appearance().titleTextAttributes = [.foregroundColor: UIColor.white]
96106
UINavigationBar.appearance().isTranslucent = false
97107
UINavigationBar.appearance().tintColor = .white
98108
UIApplication.shared.statusBarStyle = .lightContent
99109
}
100110

111+
/// Sets up FancyButton's UIAppearance.
112+
///
113+
func setupFancyButtonAppearance() {
114+
let appearance = FancyButton.appearance()
115+
appearance.titleFont = UIFont.font(forStyle: .headline, weight: .bold)
116+
appearance.primaryNormalBackgroundColor = StyleManager.buttonPrimaryColor
117+
appearance.primaryNormalBorderColor = StyleManager.buttonPrimaryHighlightedColor
118+
appearance.primaryHighlightBackgroundColor = StyleManager.buttonPrimaryHighlightedColor
119+
appearance.primaryHighlightBorderColor = StyleManager.buttonPrimaryHighlightedColor
120+
appearance.disabledBorderColor = StyleManager.buttonPrimaryHighlightedColor
121+
appearance.disabledBackgroundColor = StyleManager.buttonPrimaryHighlightedColor
122+
}
123+
101124
/// Sets up the WordPress Authenticator.
102125
///
103126
func setupAuthenticationManager() {
@@ -135,7 +158,7 @@ private extension AppDelegate {
135158
fatalError()
136159
}
137160

138-
authenticationManager.showLogin(from: rootViewController)
161+
authenticationManager.displayAuthentication(from: rootViewController)
139162
}
140163

141164
/// Indicates if there's a default WordPress.com account.

WooCommerce/Classes/Authentication/AuthenticationManager.swift

Lines changed: 5 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import Foundation
22
import WordPressAuthenticator
3+
import WordPressUI
34

45

56

@@ -13,7 +14,7 @@ class AuthenticationManager {
1314
let configuration = WordPressAuthenticatorConfiguration(wpcomClientId: ApiCredentials.dotcomAppId,
1415
wpcomSecret: ApiCredentials.dotcomSecret,
1516
wpcomScheme: ApiCredentials.dotcomAuthScheme,
16-
wpcomTermsOfServiceURL: Constants.termsOfServiceURL,
17+
wpcomTermsOfServiceURL: WooConstants.termsOfServiceUrl,
1718
googleLoginClientId: ApiCredentials.googleClientId,
1819
googleLoginServerClientId: ApiCredentials.googleServerId,
1920
googleLoginScheme: ApiCredentials.googleAuthScheme,
@@ -26,12 +27,10 @@ class AuthenticationManager {
2627

2728
/// Displays the Login Flow using the specified UIViewController as presenter.
2829
///
29-
func showLogin(from presenter: UIViewController) {
30-
let loginViewController = WordPressAuthenticator.signinForWordPress()
31-
loginViewController.restrictToWPCom = true
32-
loginViewController.offerSignupOption = false
30+
func displayAuthentication(from presenter: UIViewController) {
31+
let prologueViewController = LoginPrologueViewController()
32+
let navigationController = LoginNavigationController(rootViewController: prologueViewController)
3333

34-
let navigationController = LoginNavigationController(rootViewController: loginViewController)
3534
presenter.present(navigationController, animated: true, completion: nil)
3635
}
3736

@@ -169,16 +168,3 @@ extension AuthenticationManager: WordPressAuthenticatorDelegate {
169168
// TODO: Integrate Tracks
170169
}
171170
}
172-
173-
174-
/// Nested Types
175-
///
176-
extension AuthenticationManager {
177-
178-
struct Constants {
179-
180-
/// Terms of Service Website. Displayed by the Authenticator (when / if needed).
181-
///
182-
static let termsOfServiceURL = "https://wordpress.com/tos/"
183-
}
184-
}
Lines changed: 154 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,154 @@
1+
import Foundation
2+
import UIKit
3+
import SafariServices
4+
import WordPressAuthenticator
5+
6+
7+
/// Displays the WooCommerce Prologue UI.
8+
///
9+
class LoginPrologueViewController: UIViewController {
10+
11+
/// White-Background View, to be placed surrounding the bottom area.
12+
///
13+
@IBOutlet var backgroundView: UIView!
14+
15+
/// Label to be displayed at the top of the Prologue.
16+
///
17+
@IBOutlet var upperLabel: UILabel!
18+
19+
/// Disclaimer Label
20+
///
21+
@IBOutlet var disclaimerTextView: UITextView!
22+
23+
/// Jetpack Logo ImageVIew
24+
///
25+
@IBOutlet var jetpackImageView: UIImageView!
26+
27+
/// Default Action Button.
28+
///
29+
@IBOutlet var loginButton: UIButton!
30+
31+
32+
// MARK: - Overridden Properties
33+
34+
override var supportedInterfaceOrientations: UIInterfaceOrientationMask {
35+
return .portrait
36+
}
37+
38+
39+
// MARK: - Overridden Methods
40+
41+
override func viewDidLoad() {
42+
super.viewDidLoad()
43+
44+
setupMainView()
45+
setupBackgroundView()
46+
setupJetpackImage()
47+
setupDisclaimerLabel()
48+
setupUpperLabel()
49+
setupLoginButton()
50+
}
51+
52+
override func viewWillAppear(_ animated: Bool) {
53+
super.viewWillAppear(animated)
54+
navigationController?.setNavigationBarHidden(true, animated: animated)
55+
}
56+
}
57+
58+
59+
// MARK: - Initialization Methods
60+
//
61+
private extension LoginPrologueViewController {
62+
63+
func setupMainView() {
64+
view.backgroundColor = StyleManager.wooCommerceBrandColor
65+
}
66+
67+
func setupBackgroundView() {
68+
backgroundView.layer.masksToBounds = false
69+
backgroundView.layer.shadowOpacity = 0.2
70+
}
71+
72+
func setupUpperLabel() {
73+
upperLabel.text = NSLocalizedString("Check your WooCommerce store on the go, fulfill your orders and get notifications of new sales.", comment: "Login Prologue Legend")
74+
upperLabel.font = UIFont.font(forStyle: .subheadline, weight: .bold)
75+
upperLabel.textColor = .white
76+
}
77+
78+
func setupJetpackImage() {
79+
jetpackImageView.image = UIImage.jetpackLogoImage.imageWithTintColor(.jetpackGreen)
80+
}
81+
82+
func setupDisclaimerLabel() {
83+
disclaimerTextView.attributedText = disclaimerAttributedText
84+
disclaimerTextView.textContainerInset = .zero
85+
}
86+
87+
func setupLoginButton() {
88+
let title = NSLocalizedString("Log in with Jetpack", comment: "Authentication Login Button")
89+
loginButton.setTitle(title, for: .normal)
90+
loginButton.backgroundColor = .clear
91+
}
92+
}
93+
94+
95+
// MARK: - UITextViewDeletgate Conformance
96+
//
97+
extension LoginPrologueViewController: UITextViewDelegate {
98+
99+
func textView(_ textView: UITextView, shouldInteractWith URL: URL, in characterRange: NSRange, interaction: UITextItemInteraction) -> Bool {
100+
displaySafariViewController(at: URL)
101+
return false
102+
}
103+
}
104+
105+
106+
// MARK: - Action Handlers
107+
//
108+
extension LoginPrologueViewController {
109+
110+
/// Opens SafariViewController at the specified URL.
111+
///
112+
func displaySafariViewController(at url: URL) {
113+
let safariViewController = SafariViewController(url: url)
114+
safariViewController.modalPresentationStyle = .pageSheet
115+
present(safariViewController, animated: true, completion: nil)
116+
}
117+
118+
/// Proceeds with the Login Flow.
119+
///
120+
@IBAction func loginWasPressed() {
121+
let loginViewController = WordPressAuthenticator.signinForWordPress()
122+
loginViewController.restrictToWPCom = true
123+
loginViewController.offerSignupOption = false
124+
125+
navigationController?.pushViewController(loginViewController, animated: true)
126+
navigationController?.setNavigationBarHidden(false, animated: true)
127+
}
128+
}
129+
130+
131+
// MARK: - Private Methods
132+
//
133+
private extension LoginPrologueViewController {
134+
135+
/// Returns the Disclaimer Attributed Text (which contains a link to the Jetpack Setup URL).
136+
///
137+
var disclaimerAttributedText: NSAttributedString {
138+
let disclaimerText = NSLocalizedString("This app requires Jetpack to be able to connect to your WooCommerce Store.\nFor configuration instructions, ", comment: "Login Disclaimer Text")
139+
let disclaimerAttributes: [NSAttributedStringKey: Any] = [
140+
.font: UIFont.font(forStyle: .caption1, weight: .thin),
141+
.foregroundColor: UIColor.black
142+
]
143+
144+
let readText = NSLocalizedString("read here.", comment: "Login Disclaimer Linked Text")
145+
var readAttributes = disclaimerAttributes
146+
readAttributes[.link] = URL(string: WooConstants.jetpackSetupUrl)
147+
148+
let readAttrText = NSMutableAttributedString(string: readText, attributes: readAttributes)
149+
let disclaimerAttrText = NSMutableAttributedString(string: disclaimerText, attributes: disclaimerAttributes)
150+
disclaimerAttrText.append(readAttrText)
151+
152+
return disclaimerAttrText
153+
}
154+
}

0 commit comments

Comments
 (0)