Fix #1335: Added animation UI for WebAuth, add lottie-ios dep. (#1384)

brave · Aug 13, 2019 · f96dad3 · f96dad3
1 parent 7e5a281
commit f96dad3
Show file tree

Hide file tree

Showing 14 changed files with 110 additions and 28 deletions.
diff --git a/Cartfile b/Cartfile
@@ -15,3 +15,4 @@ github "facebook/pop"			"1.0.12"
 github "xmartlabs/Eureka"		"4.3.1"
 github "venmo/Static"			"v3.0.3"
 github "brave/brave-rewards-ios" "master"
+github "airbnb/lottie-ios" "master"
diff --git a/Cartfile.resolved b/Cartfile.resolved
@@ -3,6 +3,7 @@ github "Alamofire/Alamofire" "4.8.2"
 github "DaveWoodCom/XCGLogger" "7.0.0"
 github "SnapKit/SnapKit" "5.0.1"
 github "SwiftyJSON/SwiftyJSON" "4.2.0"
+github "airbnb/lottie-ios" "531eb22d47a9439a2344fdaf96832189f2c6e925"
 github "brave/brave-rewards-ios" "8083f6e5619b6b5202866abe1ee47fea6763d4d9"
 github "cezheng/Fuzi" "2.2.1"
 github "facebook/pop" "1.0.12"

diff --git a/Client.xcodeproj/project.pbxproj b/Client.xcodeproj/project.pbxproj
@@ -61,6 +61,9 @@
 		0A93F1802264C2D200A3571B /* FolderDetailsView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0A93F17F2264C2D200A3571B /* FolderDetailsView.swift */; };
 		0A93F1892264C72000A3571B /* BookmarkFormFieldsProtocol.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0A93F1882264C72000A3571B /* BookmarkFormFieldsProtocol.swift */; };
 		0AA029F8222E899400D6B535 /* Bookmark+Reorder.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0AA029F7222E899400D6B535 /* Bookmark+Reorder.swift */; };
+		0AA21E4A2302C4CC00358988 /* webauth_verify_key.json in Resources */ = {isa = PBXBuildFile; fileRef = 0AA21E472302C4CC00358988 /* webauth_verify_key.json */; };
+		0AA21E4B2302C4CC00358988 /* webauth_insert_key.json in Resources */ = {isa = PBXBuildFile; fileRef = 0AA21E482302C4CC00358988 /* webauth_insert_key.json */; };
+		0AA21E4C2302C4CC00358988 /* webauth_touch_key.json in Resources */ = {isa = PBXBuildFile; fileRef = 0AA21E492302C4CC00358988 /* webauth_touch_key.json */; };
 		0AA4FC392109D685000B173A /* CRUDProtocols.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0AA4FC382109D685000B173A /* CRUDProtocols.swift */; };
 		0AAAAC972249174A009A8763 /* SyncAlerts.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0AAAAC962249174A009A8763 /* SyncAlerts.swift */; };
 		0AAAACAD22491CC7009A8763 /* ErrorExtensions.swift in Sources */ = {isa = PBXBuildFile; fileRef = 0AAAACAC22491CC7009A8763 /* ErrorExtensions.swift */; };
@@ -438,8 +441,8 @@
 		4F514FD41ACD8F2C0022D7EA /* HistoryTests.swift in Sources */ = {isa = PBXBuildFile; fileRef = 4F514FD31ACD8F2C0022D7EA /* HistoryTests.swift */; };
 		4F97573B1AFA6F37006ECC24 /* readerContent.html in Resources */ = {isa = PBXBuildFile; fileRef = 4F9757391AFA6F37006ECC24 /* readerContent.html */; };
 		55A747171DC46FC400CE1B57 /* HomePageUITest.swift in Sources */ = {isa = PBXBuildFile; fileRef = 55A747161DC46FC400CE1B57 /* HomePageUITest.swift */; };
-		59350AFB22612D95004D7445 /* DisplayTextFieldTest.swift in Sources */ = {isa = PBXBuildFile; fileRef = 59350AFA22612D95004D7445 /* DisplayTextFieldTest.swift */; };
 		592F521E2217327C0078395E /* HttpCookieExtension.swift in Sources */ = {isa = PBXBuildFile; fileRef = 592F521D2217327B0078395E /* HttpCookieExtension.swift */; };
+		59350AFB22612D95004D7445 /* DisplayTextFieldTest.swift in Sources */ = {isa = PBXBuildFile; fileRef = 59350AFA22612D95004D7445 /* DisplayTextFieldTest.swift */; };
 		5953AAEF2226E9D800A92DE1 /* HttpCookieExtensionTest.swift in Sources */ = {isa = PBXBuildFile; fileRef = 5953AAEE2226E9D800A92DE1 /* HttpCookieExtensionTest.swift */; };
 		595E0EDB21CAD97C00813D49 /* CookieControl.js in Resources */ = {isa = PBXBuildFile; fileRef = 595E0EDA21CAD97C00813D49 /* CookieControl.js */; };
 		595E0EE121CAEF5B00813D49 /* FileManagerExtension.swift in Sources */ = {isa = PBXBuildFile; fileRef = 595E0EE021CAEF5B00813D49 /* FileManagerExtension.swift */; };
@@ -1199,6 +1202,9 @@
 		0A93F1882264C72000A3571B /* BookmarkFormFieldsProtocol.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = BookmarkFormFieldsProtocol.swift; sourceTree = "<group>"; };
 		0A9B6A3420E6453400712BC9 /* Model8.xcdatamodel */ = {isa = PBXFileReference; lastKnownFileType = wrapper.xcdatamodel; path = Model8.xcdatamodel; sourceTree = "<group>"; };
 		0AA029F7222E899400D6B535 /* Bookmark+Reorder.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "Bookmark+Reorder.swift"; sourceTree = "<group>"; };
+		0AA21E472302C4CC00358988 /* webauth_verify_key.json */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.json; path = webauth_verify_key.json; sourceTree = "<group>"; };
+		0AA21E482302C4CC00358988 /* webauth_insert_key.json */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.json; path = webauth_insert_key.json; sourceTree = "<group>"; };
+		0AA21E492302C4CC00358988 /* webauth_touch_key.json */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.json; path = webauth_touch_key.json; sourceTree = "<group>"; };
 		0AA4FC382109D685000B173A /* CRUDProtocols.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CRUDProtocols.swift; sourceTree = "<group>"; };
 		0AAAAC962249174A009A8763 /* SyncAlerts.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = SyncAlerts.swift; sourceTree = "<group>"; };
 		0AAAACAC22491CC7009A8763 /* ErrorExtensions.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ErrorExtensions.swift; sourceTree = "<group>"; };
@@ -1597,9 +1603,9 @@
 		5929A9F221B6AF03005ECF8D /* en */ = {isa = PBXFileReference; lastKnownFileType = text.plist.strings; name = en; path = en.lproj/Localizable.strings; sourceTree = "<group>"; };
 		5929A9F321B6AF0F005ECF8D /* en */ = {isa = PBXFileReference; lastKnownFileType = text.plist.strings; name = en; path = en.lproj/Shared.strings; sourceTree = "<group>"; };
 		5929A9F421B6AF18005ECF8D /* en */ = {isa = PBXFileReference; lastKnownFileType = text.plist.strings; name = en; path = en.lproj/InfoPlist.strings; sourceTree = "<group>"; };
-		59350AFA22612D95004D7445 /* DisplayTextFieldTest.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = DisplayTextFieldTest.swift; sourceTree = "<group>"; };
 		592F521D2217327B0078395E /* HttpCookieExtension.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = HttpCookieExtension.swift; sourceTree = "<group>"; };
 		59347A7822E22F2000C38919 /* pt-BR */ = {isa = PBXFileReference; lastKnownFileType = text.plist.strings; name = "pt-BR"; path = "pt-BR.lproj/BraveShared.strings"; sourceTree = "<group>"; };
+		59350AFA22612D95004D7445 /* DisplayTextFieldTest.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = DisplayTextFieldTest.swift; sourceTree = "<group>"; };
 		5953AAEE2226E9D800A92DE1 /* HttpCookieExtensionTest.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = HttpCookieExtensionTest.swift; sourceTree = "<group>"; };
 		595E0EDA21CAD97C00813D49 /* CookieControl.js */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.javascript; path = CookieControl.js; sourceTree = "<group>"; };
 		595E0EE021CAEF5B00813D49 /* FileManagerExtension.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = FileManagerExtension.swift; sourceTree = "<group>"; };
@@ -2537,6 +2543,16 @@
 			path = Bookmarks;
 			sourceTree = "<group>";
 		};
+		0AA21E4D2302C94800358988 /* Lottie_Assets */ = {
+			isa = PBXGroup;
+			children = (
+				0AA21E482302C4CC00358988 /* webauth_insert_key.json */,
+				0AA21E492302C4CC00358988 /* webauth_touch_key.json */,
+				0AA21E472302C4CC00358988 /* webauth_verify_key.json */,
+			);
+			path = Lottie_Assets;
+			sourceTree = "<group>";
+		};
 		0AADC4BB20D2A4F700FDE368 /* HomePanel */ = {
 			isa = PBXGroup;
 			children = (
@@ -4295,6 +4311,7 @@
 		F930CDB02270029B00A23FE1 /* WebAuthN */ = {
 			isa = PBXGroup;
 			children = (
+				0AA21E4D2302C94800358988 /* Lottie_Assets */,
 				F930CDC8227006D600A23FE1 /* WebAuthnRegisterRequest.swift */,
 				F930CDD02270F09000A23FE1 /* WebAuthnAuthenticateRequest.swift */,
 				F930CDD62270F14300A23FE1 /* WebAuthnUtils.swift */,
@@ -5133,6 +5150,7 @@
 				27658272217130D900754B2F /* GlobalSign_r3.cer in Resources */,
 				5DE5250F218CE92C000DFAA6 /* upgrade-http.json in Resources */,
 				0A0D3D3E21A4BE6C00BEE65B /* simple_malware.txt in Resources */,
+				0AA21E4B2302C4CC00358988 /* webauth_insert_key.json in Resources */,
 				5DE5250D218CE92C000DFAA6 /* block-ads.json in Resources */,
 				F35B8D2B1D6380EA008E3D61 /* SessionRestore.html in Resources */,
 				5E4845C022DE381200372022 /* WindowRenderHelper.js in Resources */,
@@ -5177,12 +5195,14 @@
 				59C8119922D754D4005D5BBC /* BraveShared.strings in Resources */,
 				E4ECCDAE1AB131770005E717 /* FiraSans-Medium.ttf in Resources */,
 				E4424B3C1AC71FB400F44C38 /* FiraSans-Book.ttf in Resources */,
+				0AA21E4C2302C4CC00358988 /* webauth_touch_key.json in Resources */,
 				5DE52511218CE92C000DFAA6 /* block-trackers.json in Resources */,
 				39A35AED1C0662A3006B9E87 /* SpotlightHelper.js in Resources */,
 				D0FCF8071FE4772D004A7995 /* MainFrameAtDocumentEnd.js in Resources */,
 				E4D6BEB91A0930EC00F538BD /* LaunchScreen.xib in Resources */,
 				2F44FB2D1A9D5D8500FD20CC /* FiraSans-BoldItalic.ttf in Resources */,
 				D03F8F23200EAC1F003C2224 /* AllFramesAtDocumentStart.js in Resources */,
+				0AA21E4A2302C4CC00358988 /* webauth_verify_key.json in Resources */,
 				279C75C821A5B37D001CD1CB /* FingerprintingProtection.js in Resources */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
@@ -5254,6 +5274,7 @@
 				"$(SRCROOT)/Carthage/Build/iOS/OnePasswordExtension.framework",
 				"$(SRCROOT)/Carthage/Build/iOS/BraveRewardsUI.framework",
 				"$(SRCROOT)/Carthage/Checkouts/brave-rewards-ios/lib/BraveRewards.framework",
+				"$(SRCROOT)/Carthage/Build/iOS/Lottie.framework",
 			);
 			name = "Copy Carthage Dependencies";
 			outputPaths = (

diff --git a/Client/Assets/Images.xcassets/WebAuth/Contents.json b/Client/Assets/Images.xcassets/WebAuth/Contents.json
@@ -0,0 +1,6 @@
+{
+  "info" : {
+    "version" : 1,
+    "author" : "xcode"
+  }
+}
diff --git a/Client/Assets/Images.xcassets/WebAuth/enter_pin.imageset/Contents.json b/Client/Assets/Images.xcassets/WebAuth/enter_pin.imageset/Contents.json
@@ -0,0 +1,12 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "filename" : "[email protected]"
+    }
+  ],
+  "info" : {
+    "version" : 1,
+    "author" : "xcode"
+  }
+}
diff --git a/Client/Assets/Images.xcassets/WebAuth/enter_pin.imageset/[email protected] b/Client/Assets/Images.xcassets/WebAuth/enter_pin.imageset/[email protected]
diff --git a/Client/Frontend/Browser/BrowserViewController.swift b/Client/Frontend/Browser/BrowserViewController.swift
@@ -1294,7 +1294,7 @@ class BrowserViewController: UIViewController {
 
         topToolbar.leaveOverlayMode()
 
-        let popup = AlertPopupView(image: #imageLiteral(resourceName: "browser_lock_popup"), title: Strings.Browser_lock_callout_title, message: Strings.Browser_lock_callout_message)
+        let popup = AlertPopupView(imageView: UIImageView(image: #imageLiteral(resourceName: "browser_lock_popup")), title: Strings.Browser_lock_callout_title, message: Strings.Browser_lock_callout_message)
         popup.addButton(title: Strings.Browser_lock_callout_not_now) { () -> PopupViewDismissType in
             Preferences.Popups.browserLock.value = true
             self.browserLockPopup = nil
@@ -1336,7 +1336,7 @@ class BrowserViewController: UIViewController {
 
         topToolbar.leaveOverlayMode()
 
-        let popup = AlertPopupView(image: UIImage(named: "duckduckgo"), title: Strings.DDG_callout_title, message: Strings.DDG_callout_message)
+        let popup = AlertPopupView(imageView: UIImageView(image: #imageLiteral(resourceName: "duckduckgo")), title: Strings.DDG_callout_title, message: Strings.DDG_callout_message)
         popup.dismissHandler = { [weak self] in
             self?.presentBrowserLockCallout()
         }

diff --git a/Client/Frontend/Popup/AlertPopupView.swift b/Client/Frontend/Popup/AlertPopupView.swift
@@ -4,9 +4,10 @@
 
 import UIKit
 import BraveShared
+import Lottie
 
 class AlertPopupView: PopupView {
-    fileprivate var dialogImage: UIImageView?
+    fileprivate var dialogImage: UIView?
     fileprivate var titleLabel: UILabel!
     fileprivate var messageLabel: UILabel!
     fileprivate var containerView: UIView!
@@ -19,7 +20,8 @@ class AlertPopupView: PopupView {
     fileprivate let kAlertPopupScreenFraction: CGFloat = 0.8
     fileprivate let kPadding: CGFloat = 20.0
 
-    init(image: UIImage?, title: String, message: String, inputType: UIKeyboardType? = nil, secureInput: Bool = false, inputPlaceholder: String? = nil) {
+    init(imageView: UIView?, title: String, message: String, inputType: UIKeyboardType? = nil,
+         secureInput: Bool = false, inputPlaceholder: String? = nil) {
         super.init(frame: CGRect.zero)
 
         overlayDismisses = false
@@ -30,10 +32,9 @@ class AlertPopupView: PopupView {
         containerView = UIView(frame: CGRect.zero)
         containerView.autoresizingMask = [.flexibleWidth]
 
-        if let image = image {
-            let di = UIImageView(image: image)
-            containerView.addSubview(di)
-            dialogImage = di
+        if let imageView = imageView {
+            containerView.addSubview(imageView)
+            dialogImage = imageView
         }
 
         titleLabel = UILabel(frame: CGRect.zero)
@@ -100,13 +101,19 @@ class AlertPopupView: PopupView {
             messageLabel.adjustsFontSizeToFitWidth = true
             updateSubviews(resizePercentage: resizePercentage)
         }
+
+        // Lottie animation stops playing when view is not visible, the animation needs to be resumed.
+        if let animationView = dialogImage as? AnimationView, !animationView.isAnimationPlaying {
+            animationView.play()
+        }
     }
 
     fileprivate func updateSubviews(resizePercentage: CGFloat) {
         let width: CGFloat = dialogWidth
 
         var imageFrame: CGRect = dialogImage?.frame ?? CGRect.zero
-        if let dialogImage = dialogImage, let dialogImageSize = dialogImage.image?.size {
+        if let dialogImage = dialogImage {
+            let dialogImageSize = dialogImage.frame.size
             imageFrame.size = CGSize(width: dialogImageSize.width * resizePercentage, height: dialogImageSize.height * resizePercentage)
             imageFrame.origin.x = (width - imageFrame.width) / 2.0
             imageFrame.origin.y = kPadding * 2.0 * resizePercentage

diff --git a/Client/Frontend/Popup/PopupView.swift b/Client/Frontend/Popup/PopupView.swift
@@ -297,6 +297,7 @@ class PopupView: UIView, UIGestureRecognizerDelegate {
         showHandler?()
 
         delegate?.popupViewDidShow(self)
+        setNeedsLayout()
     }
 
     func dismiss() {

diff --git a/Client/Frontend/Sync/SyncSettingsTableViewController.swift b/Client/Frontend/Sync/SyncSettingsTableViewController.swift
@@ -158,7 +158,7 @@ class SyncSettingsTableViewController: UITableViewController {
 
         guard let popupTitle = title, let popupMessage = message, let popupButtonName = removeButtonName else { fatalError() }
 
-        let popup = AlertPopupView(image: nil, title: popupTitle, message: popupMessage)
+        let popup = AlertPopupView(imageView: nil, title: popupTitle, message: popupMessage)
         let fontSize: CGFloat = 15
 
         popup.addButton(title: Strings.CancelButtonTitle, fontSize: fontSize) { return .flyDown }