Skip to content
GitLab
Commit 6bf49655 authored by Jose Blaya's avatar Jose Blaya
Browse files

- PIAX Select a VPN Plan redesign

parent cfd95e82
Expand all Hide whitespace changes
Inline Side-by-side
PIALibrary/Resources/UI/iOS/UI.xcassets/PIAX/Global/plan-selected.imageset/Contents.json 0 → 100644
View file @ 6bf49655
{
"images" : [
{
"idiom" : "universal",
"filename" : "group3.pdf"
}
],
"info" : {
"version" : 1,
"author" : "xcode"
}
}
\ No newline at end of file
PIALibrary/Resources/UI/iOS/UI.xcassets/PIAX/Global/plan-unselected.imageset/Contents.json 0 → 100644
View file @ 6bf49655
{
"images" : [
{
"idiom" : "universal",
"filename" : "oval3.pdf"
}
],
"info" : {
"version" : 1,
"author" : "xcode"
}
}
\ No newline at end of file
PIALibrary/Resources/UI/iOS/en.lproj/Welcome.strings
View file @ 6bf49655
......@@ -23,7 +23,7 @@
"purchase.title" = "Select a VPN plan";
"purchase.subtitle" = "7-day money back guarantee";
"purchase.email.placeholder" = "Email address";
"purchase.submit" = "BUY NOW";
"purchase.submit" = "Continue";
"purchase.login.footer" = "Already have an account?";
"purchase.login.button" = "Sign in";
"purchase.error.title" = "Purchase";
......
PIALibrary/Sources/UI/iOS/PurchasePlanCell.swift
View file @ 6bf49655
......@@ -12,30 +12,28 @@ class PurchasePlanCell: UICollectionViewCell, Restylable {
// XXX
private static let textPlaceholder = " "
private static let pricePlaceholder = " "
private static let bestValueContainerHeight: CGFloat = 20.0
private static let priceBottomConstant: CGFloat = 26.0
@IBOutlet private weak var viewContainer: UIView!
@IBOutlet private weak var viewHeader: UIView!
@IBOutlet private weak var viewBestValue: UIView!
@IBOutlet private weak var labelBestValue: UILabel!
@IBOutlet private weak var labelPlan: UILabel!
@IBOutlet private weak var viewSpacer: UIView!
@IBOutlet private weak var labelPrice: UILabel!
@IBOutlet private weak var labelDetail: UILabel!
@IBOutlet private weak var unselectedPlanImageView: UIImageView!
@IBOutlet private weak var selectedPlanImageView: UIImageView!
@IBOutlet private weak var bestValueHeightConstraint: NSLayoutConstraint!
@IBOutlet weak var priceBottomConstraint: NSLayoutConstraint!
override func awakeFromNib() {
super.awakeFromNib()
isSelected = false
labelBestValue.text = L10n.Welcome.Plan.bestValue
labelBestValue.text = L10n.Welcome.Plan.bestValue.uppercased()
selectedPlanImageView.alpha = 0
}
func fill(plan: PurchasePlan) {
......@@ -60,6 +58,15 @@ class PurchasePlanCell: UICollectionViewCell, Restylable {
labelDetail.text = plan.detail
labelPrice.text = L10n.Welcome.Plan.priceFormat(plan.monthlyPriceString)
viewBestValue.isHidden = !plan.bestValue
if viewBestValue.isHidden {
bestValueHeightConstraint.constant = 0
priceBottomConstraint.constant = 0
} else {
bestValueHeightConstraint.constant = PurchasePlanCell.bestValueContainerHeight
priceBottomConstraint.constant = PurchasePlanCell.priceBottomConstant
}
self.layoutSubviews()
accessibilityLabel = "\(plan.title), \(plan.accessibleMonthlyPriceString) \(L10n.Welcome.Plan.Accessibility.perMonth)"
}
......@@ -72,13 +79,13 @@ class PurchasePlanCell: UICollectionViewCell, Restylable {
// Theme.current.applyTitle(labelPrice, appearance:(isSelected ? .emphasis : .dark))
if isSelected {
Theme.current.applySolidSelection(viewHeader)
Theme.current.applyTitle(labelPlan, appearance: .light)
viewSpacer.isHidden = true
UIView.animate(withDuration: 0.2, animations: {
self.selectedPlanImageView.alpha = 1
})
} else {
viewHeader.backgroundColor = .clear
Theme.current.applyTitle(labelPlan, appearance: .dark)
viewSpacer.isHidden = false
UIView.animate(withDuration: 0.2, animations: {
self.selectedPlanImageView.alpha = 0
})
}
}
}
......@@ -86,11 +93,11 @@ class PurchasePlanCell: UICollectionViewCell, Restylable {
// MARK: Restylable
func viewShouldRestyle() {
Theme.current.applyCorner(viewBestValue, factor: 0.5)
Theme.current.applyCorner(viewBestValue, factor: 1.0)
Theme.current.applyWarningBackground(viewBestValue)
Theme.current.applyTag(labelBestValue, appearance: .light)
Theme.current.applyDivider(viewSpacer)
Theme.current.applyBlackLabelInBox(labelBestValue)
Theme.current.applySubtitle(labelPlan)
Theme.current.applyTitle(labelPrice, appearance: .dark)
Theme.current.applySmallInfo(labelDetail, appearance: .dark)
Theme.current.applySubtitle(labelDetail)
}
}
PIALibrary/Sources/UI/iOS/SwiftGen+SeguesStoryboards.swift
View file @ 6bf49655
......@@ -20,6 +20,7 @@ internal enum StoryboardSegue {
case unwindInternetUnreachableSegueIdentifier = "UnwindInternetUnreachableSegueIdentifier"
}
internal enum Welcome: String, SegueType {
case purchaseVPNPlanSegue = "PurchaseVPNPlanSegue"
case redeemGiftCardSegue = "RedeemGiftCardSegue"
case signupQRCameraScannerSegue = "SignupQRCameraScannerSegue"
case signupViaPurchaseSegue = "SignupViaPurchaseSegue"
......
PIALibrary/Sources/UI/iOS/SwiftGen+Strings.swift
View file @ 6bf49655
......@@ -203,7 +203,7 @@ internal enum L10n {
}
}
internal enum Purchase {
/// BUY NOW
/// Continue
internal static let submit = L10n.tr("Welcome", "purchase.submit")
/// 7-day money back guarantee
internal static let subtitle = L10n.tr("Welcome", "purchase.subtitle")
......
PIALibrary/Sources/UI/iOS/Theme+LightPalette.swift
View file @ 6bf49655
......@@ -24,7 +24,7 @@ extension Theme.Palette {
palette.lineColor = .piaGreenDark20
palette.subtitleColor = .piaGrey8
palette.emphasis = Macros.color(hex: 0x29cc41, alpha: 0xff)
palette.accent1 = Macros.color(hex: 0xf7941d, alpha: 0xff)
palette.accent1 = UIColor.piaOrange
palette.accent2 = Macros.color(hex: 0xe60924, alpha: 0xff)
palette.setDarkText(Macros.color(hex: 0x001b31, alpha: 0xff), alphas: [0.87, 0.67, 0.37])
palette.setLightText(.white, alphas: [0.87, 0.67, 0.37])
......
PIALibrary/Sources/UI/iOS/Theme.swift
View file @ 6bf49655
......@@ -101,7 +101,7 @@ public class Theme {
lineColor = .piaGreenDark20
// primary = .black
emphasis = .green
accent1 = .orange
accent1 = .piaOrange
accent2 = .red
darkText = .black
......@@ -472,6 +472,12 @@ public class Theme {
label.textColor = palette.textColor(forRelevance: 1, appearance: appearance)
}
/// :nodoc:
public func applyBlackLabelInBox(_ label: UILabel) {
label.font = typeface.regularFont(size: 12.0)
label.textColor = .black
}
/// :nodoc:
public func applyList(_ label: UILabel, appearance: Appearance) {
applyList(label, appearance: appearance, relevance: 2)
......
PIALibrary/Sources/UI/iOS/ViewControllers/GetStartedViewController.swift
View file @ 6bf49655
......@@ -49,14 +49,20 @@ public class GetStartedViewController: AutolayoutViewController, ConfigurationAc
}
public override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
guard let vc = segue.destination as? PIAWelcomeViewController else {
return
}
switch segue.identifier {
case StoryboardSegue.Welcome.redeemGiftCardSegue.rawValue:
if let vc = segue.destination as? PIAWelcomeViewController {
vc.preset.pages = .redeem
}
case StoryboardSegue.Welcome.purchaseVPNPlanSegue.rawValue:
vc.preset.pages = .purchase
default:
break
}
}
/// :nodoc:
......
PIALibrary/Sources/UI/iOS/ViewControllers/PurchaseViewController.swift
View file @ 6bf49655
......@@ -19,22 +19,15 @@ class PurchaseViewController: AutolayoutViewController, WelcomeChild {
@IBOutlet private weak var scrollView: UIScrollView!
@IBOutlet private weak var labelTitle: UILabel!
@IBOutlet private weak var textEmail: BorderedTextField!
@IBOutlet private weak var labelSubtitle: UILabel!
//@IBOutlet private weak var textEmail: BorderedTextField!
@IBOutlet private weak var collectionPlans: UICollectionView!
@IBOutlet private weak var textAgreement: UITextView!
@IBOutlet private weak var buttonPurchase: ActivityButton!
@IBOutlet private weak var viewFooter: UIView!
@IBOutlet private weak var viewLogin: UIView!
@IBOutlet private weak var labelLogin1: UILabel!
@IBOutlet private weak var labelLogin2: UILabel!
@IBOutlet private weak var buttonPurchase: PIAButton!
var preset: Preset?
......@@ -62,10 +55,10 @@ class PurchaseViewController: AutolayoutViewController, WelcomeChild {
}
collectionPlans.isUserInteractionEnabled = false
viewFooter.isHidden = omitsSiblingLink
labelTitle.text = L10n.Welcome.Purchase.title
textEmail.placeholder = L10n.Welcome.Purchase.Email.placeholder
labelSubtitle.text = L10n.Welcome.Purchase.subtitle
//textEmail.placeholder = L10n.Welcome.Purchase.Email.placeholder
textAgreement.attributedText = Theme.current.agreementText(
withMessage: L10n.Welcome.Agreement.message,
tos: L10n.Welcome.Agreement.Message.tos,
......@@ -73,15 +66,12 @@ class PurchaseViewController: AutolayoutViewController, WelcomeChild {
privacy: L10n.Welcome.Agreement.Message.privacy,
privacyUrl: Client.configuration.privacyUrl
)
buttonPurchase.title = L10n.Welcome.Purchase.submit
labelLogin1.text = L10n.Welcome.Purchase.Login.footer
labelLogin2.text = L10n.Welcome.Purchase.Login.button
viewLogin.accessibilityLabel = "\(labelLogin1.text!) \(labelLogin2.text!)"
textEmail.text = preset.purchaseEmail
//textEmail.text = preset.purchaseEmail
let nc = NotificationCenter.default
nc.addObserver(self, selector: #selector(productsDidFetch(notification:)), name: .__InAppDidFetchProducts, object: nil)
stylePurchaseButton()
}
override func viewWillAppear(_ animated: Bool) {
......@@ -142,15 +132,12 @@ class PurchaseViewController: AutolayoutViewController, WelcomeChild {
}
@IBAction private func signUp(_ sender: Any?) {
guard !buttonPurchase.isRunningActivity else {
return
}
guard let planIndex = selectedPlanIndex else {
return
}
let errorTitle = L10n.Welcome.Purchase.Error.title
let errorMessage = L10n.Welcome.Purchase.Error.validation
/*
guard let email = textEmail.text?.trimmed(), Validator.validate(email: email) else {
signupEmail = nil
let alert = Macros.alert(errorTitle, errorMessage)
......@@ -158,7 +145,8 @@ class PurchaseViewController: AutolayoutViewController, WelcomeChild {
present(alert, animated: true, completion: nil)
return
}
*/
let plan = allPlans[planIndex]
guard !plan.isDummy else {
let alert = Macros.alert(
......@@ -181,8 +169,8 @@ class PurchaseViewController: AutolayoutViewController, WelcomeChild {
self?.present(alert, animated: true, completion: nil)
return
}
self?.startPurchaseProcessWithEmail(email,
andPlan: plan)
//self?.startPurchaseProcessWithEmail(email,
// andPlan: plan)
})
}
......@@ -190,7 +178,7 @@ class PurchaseViewController: AutolayoutViewController, WelcomeChild {
private func startPurchaseProcessWithEmail(_ email: String,
andPlan plan: PurchasePlan) {
textEmail.text = email
//textEmail.text = email
log.debug("Will purchase plan: \(plan.product)")
disableInteractions(fully: true)
......@@ -223,13 +211,6 @@ class PurchaseViewController: AutolayoutViewController, WelcomeChild {
}
@IBAction private func logIn(_ sender: Any?) {
guard let pageController = parent as? WelcomePageViewController else {
fatalError("Not running in WelcomePageViewController")
}
pageController.show(page: .login)
}
override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
if (segue.identifier == StoryboardSegue.Welcome.signupViaPurchaseSegue.rawValue) {
let nav = segue.destination as! UINavigationController
......@@ -253,13 +234,11 @@ class PurchaseViewController: AutolayoutViewController, WelcomeChild {
if fully {
parent?.view.isUserInteractionEnabled = false
}
buttonPurchase.startActivity()
}
private func enableInteractions() {
collectionPlans.isUserInteractionEnabled = true
parent?.view.isUserInteractionEnabled = true
buttonPurchase.stopActivity()
}
// MARK: Notifications
......@@ -275,15 +254,22 @@ class PurchaseViewController: AutolayoutViewController, WelcomeChild {
override func viewShouldRestyle() {
super.viewShouldRestyle()
Theme.current.applySolidLightBackground(collectionPlans)
Theme.current.applyLightBackground(view)
Theme.current.applyLightBackground(scrollView)
Theme.current.applyLightBackground(collectionPlans)
Theme.current.applyTitle(labelTitle, appearance: .dark)
Theme.current.applyInput(textEmail)
Theme.current.applySubtitle(labelSubtitle)
//Theme.current.applyInput(textEmail)
Theme.current.applyLinkAttributes(textAgreement)
Theme.current.applyActionButton(buttonPurchase)
Theme.current.applyBody1(labelLogin1, appearance: .dark)
Theme.current.applyTextButton(labelLogin2)
}
private func stylePurchaseButton() {
buttonPurchase.setRounded()
buttonPurchase.style(style: TextStyle.Buttons.piaGreenButton)
buttonPurchase.setTitle(L10n.Welcome.Purchase.submit.uppercased(),
for: [])
}
}
extension PurchaseViewController: UICollectionViewDataSource, UICollectionViewDelegate {
......@@ -306,9 +292,10 @@ extension PurchaseViewController: UICollectionViewDataSource, UICollectionViewDe
extension PurchaseViewController: UICollectionViewDelegateFlowLayout {
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
let itemWidth = (collectionView.bounds.size.width - 10.0) / 2.0
return CGSize(width: itemWidth, height: collectionView.bounds.size.height)
let itemWidth = collectionView.bounds.size.width
let itemHeight = (collectionView.bounds.size.height - 13) / 2.0
return CGSize(width: itemWidth,
height: itemHeight)
}
}
......@@ -320,9 +307,9 @@ extension PurchaseViewController: UITextViewDelegate {
extension PurchaseViewController: UITextFieldDelegate {
func textFieldShouldReturn(_ textField: UITextField) -> Bool {
if (textField == textEmail) {
signUp(nil)
}
//if (textField == textEmail) {
// signUp(nil)
//}
return true
}
}
Supports Markdown
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