- Generic extensions to show/hide a loading spinner in viewcontrollers and views.

- Present the loading spinner in login and purchase classes

- Generic extensions to show/hide a loading spinner in viewcontrollers and views.
- Present the loading spinner in login and purchase classes
c8573951 · Jose Blaya · 1acb0d5d · c8573951 · c8573951 · c8573951
Commit c8573951 authored Dec 04, 2018 by Jose Blaya
11 changed files
--- a/PIALibrary.podspec
+++ b/PIALibrary.podspec
@@ -42,12 +42,18 @@ Pod::Spec.new do |s|
        p.dependency "PIALibrary/Library"
    end

+    s.subspec "Lottie" do |p|
+        p.dependency "PIALibrary/Core"
+        p.dependency "PIALibrary/Util"
+    end
+
    s.subspec "UI" do |p|
        p.source_files          = "PIALibrary/Sources/UI/Shared/*.swift"
        p.resources             = "PIALibrary/Resources/UI/Shared/**/*"
        p.dependency "PIALibrary/Library"
        p.dependency "SwiftyBeaver"
        p.dependency "SwiftEntryKit", "0.7.2"
+        p.dependency "lottie-ios"

        p.ios.source_files      = "PIALibrary/Sources/UI/iOS/**/*.swift"
        p.ios.resources         = "PIALibrary/Resources/UI/iOS/**/*"

--- a/PIALibrary.xcodeproj/project.pbxproj
+++ b/PIALibrary.xcodeproj/project.pbxproj
@@ -264,6 +264,8 @@
 		DD314991218350D1008E26E8 /* SwiftGen+SeguesStoryboards.swift in Sources */ = {isa = PBXBuildFile; fileRef = DDC81249217617F900CB290C /* SwiftGen+SeguesStoryboards.swift */; };
 		DD58F4BB21AEB99C00D043F7 /* GlossToken.swift in Sources */ = {isa = PBXBuildFile; fileRef = DD58F4BA21AEB99C00D043F7 /* GlossToken.swift */; };
 		DD58F4BD21AEF76100D043F7 /* String+Components.swift in Sources */ = {isa = PBXBuildFile; fileRef = DD58F4BC21AEF76100D043F7 /* String+Components.swift */; };
+		DD6DC5B921B6A83400F9D538 /* UIViewLoading.swift in Sources */ = {isa = PBXBuildFile; fileRef = DD6DC5B821B6A83400F9D538 /* UIViewLoading.swift */; };
+		DD6DC5BC21B6A8FC00F9D538 /* pia-spinner.json in Resources */ = {isa = PBXBuildFile; fileRef = DD6DC5BB21B6A8FC00F9D538 /* pia-spinner.json */; };
 		DD8BF3CB219C6BAA0041357C /* ConfirmVPNPlanViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = DD8BF3CA219C6BAA0041357C /* ConfirmVPNPlanViewController.swift */; };
 		DDD824E32189969400151709 /* Preset.swift in Sources */ = {isa = PBXBuildFile; fileRef = DDD824E22189969400151709 /* Preset.swift */; };
 		DDD824E5218996CD00151709 /* Pages.swift in Sources */ = {isa = PBXBuildFile; fileRef = DDD824E4218996CD00151709 /* Pages.swift */; };
@@ -524,6 +526,8 @@
 		DD31498E21834B3F008E26E8 /* GetStartedViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = GetStartedViewController.swift; sourceTree = "<group>"; };
 		DD58F4BA21AEB99C00D043F7 /* GlossToken.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = GlossToken.swift; sourceTree = "<group>"; };
 		DD58F4BC21AEF76100D043F7 /* String+Components.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "String+Components.swift"; sourceTree = "<group>"; };
+		DD6DC5B821B6A83400F9D538 /* UIViewLoading.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = UIViewLoading.swift; sourceTree = "<group>"; };
+		DD6DC5BB21B6A8FC00F9D538 /* pia-spinner.json */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.json; path = "pia-spinner.json"; sourceTree = "<group>"; };
 		DD8BF3CA219C6BAA0041357C /* ConfirmVPNPlanViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ConfirmVPNPlanViewController.swift; sourceTree = "<group>"; };
 		DDC812472176166500CB290C /* SwiftGen+ScenesStoryboards.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = "SwiftGen+ScenesStoryboards.swift"; sourceTree = "<group>"; };
 		DDC81249217617F900CB290C /* SwiftGen+SeguesStoryboards.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = "SwiftGen+SeguesStoryboards.swift"; sourceTree = "<group>"; };
@@ -818,6 +822,7 @@
 				DD0AC78F218715B8009B576B /* PIAButton.swift */,
 				DDD824E92189CD5700151709 /* NavigationLogoView.swift */,
 				84577FB9213D8EB2006DEC3D /* Styles */,
+				DD6DC5B821B6A83400F9D538 /* UIViewLoading.swift */,
 			);
 			path = iOS;
 			sourceTree = "<group>";
@@ -825,6 +830,7 @@
 		0EB8C07E1F9CE11A005857E4 /* Resources */ = {
 			isa = PBXGroup;
 			children = (
+				DD6DC5BA21B6A8F200F9D538 /* Lottie */,
 				0E9D62831FDE95A1009A90CF /* Library */,
 				0EB8C07F1F9CE11A005857E4 /* UI */,
 			);
@@ -1072,6 +1078,14 @@
 			name = Pods;
 			sourceTree = "<group>";
 		};
+		DD6DC5BA21B6A8F200F9D538 /* Lottie */ = {
+			isa = PBXGroup;
+			children = (
+				DD6DC5BB21B6A8FC00F9D538 /* pia-spinner.json */,
+			);
+			path = Lottie;
+			sourceTree = "<group>";
+		};
 /* End PBXGroup section */

 /* Begin PBXHeadersBuildPhase section */
@@ -1283,6 +1297,7 @@
 				0E6B0A791FA4986D00EBB916 /* UI.strings in Resources */,
 				0E9D62871FDE95A1009A90CF /* PIA.pub in Resources */,
 				0E7361B41FD9683B00706BFF /* Signup.strings in Resources */,
+				DD6DC5BC21B6A8FC00F9D538 /* pia-spinner.json in Resources */,
 				0EB8C0831F9CE11A005857E4 /* UI.xcassets in Resources */,
 				0E7361E61FD9731F00706BFF /* Signup.storyboard in Resources */,
 				0E2ADD581FE189E800BB170C /* IPsec-Client.p12 in Resources */,
@@ -1371,6 +1386,7 @@
 				"${BUILT_PRODUCTS_DIR}/ReachabilitySwift/Reachability.framework",
 				"${BUILT_PRODUCTS_DIR}/SwiftEntryKit/SwiftEntryKit.framework",
 				"${BUILT_PRODUCTS_DIR}/SwiftyBeaver/SwiftyBeaver.framework",
+				"${BUILT_PRODUCTS_DIR}/lottie-ios/Lottie.framework",
 			);
 			name = "[CP] Embed Pods Frameworks";
 			outputFileListPaths = (
@@ -1384,6 +1400,7 @@
 				"${TARGET_BUILD_DIR}/${FRAMEWORKS_FOLDER_PATH}/Reachability.framework",
 				"${TARGET_BUILD_DIR}/${FRAMEWORKS_FOLDER_PATH}/SwiftEntryKit.framework",
 				"${TARGET_BUILD_DIR}/${FRAMEWORKS_FOLDER_PATH}/SwiftyBeaver.framework",
+				"${TARGET_BUILD_DIR}/${FRAMEWORKS_FOLDER_PATH}/Lottie.framework",
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 			shellPath = /bin/sh;
@@ -1429,6 +1446,7 @@
 				"${BUILT_PRODUCTS_DIR}/ReachabilitySwift/Reachability.framework",
 				"${BUILT_PRODUCTS_DIR}/SwiftEntryKit/SwiftEntryKit.framework",
 				"${BUILT_PRODUCTS_DIR}/SwiftyBeaver/SwiftyBeaver.framework",
+				"${BUILT_PRODUCTS_DIR}/lottie-ios/Lottie.framework",
 			);
 			name = "[CP] Embed Pods Frameworks";
 			outputFileListPaths = (
@@ -1442,6 +1460,7 @@
 				"${TARGET_BUILD_DIR}/${FRAMEWORKS_FOLDER_PATH}/Reachability.framework",
 				"${TARGET_BUILD_DIR}/${FRAMEWORKS_FOLDER_PATH}/SwiftEntryKit.framework",
 				"${TARGET_BUILD_DIR}/${FRAMEWORKS_FOLDER_PATH}/SwiftyBeaver.framework",
+				"${TARGET_BUILD_DIR}/${FRAMEWORKS_FOLDER_PATH}/Lottie.framework",
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 			shellPath = /bin/sh;
@@ -1679,6 +1698,7 @@
 				0E2ADCCA1FE06D7A00BB170C /* Array+Math.swift in Sources */,
 				0E2ADD331FE1472F00BB170C /* VPNStatus.swift in Sources */,
 				0E0F95961FD560C40046DC64 /* CircleProgressView.swift in Sources */,
+				DD6DC5B921B6A83400F9D538 /* UIViewLoading.swift in Sources */,
 				0E2ADCF11FE09C6C00BB170C /* ServersPinger.swift in Sources */,
 				0E2ADD4F1FE15C2200BB170C /* VPNConfiguration.swift in Sources */,
 				0EA7065F1F80F448001E4F88 /* AccountProvider.swift in Sources */,

--- a/PIALibrary/Resources/Lottie/pia-spinner.json
+++ b/PIALibrary/Resources/Lottie/pia-spinner.json
+{"v":"5.1.17","fr":29.9700012207031,"ip":0,"op":90.0000036657751,"w":160,"h":160,"nm":"Comp 1","ddd":0,"assets":[],"layers":[{"ddd":0,"ind":1,"ty":4,"nm":"spinner2 Outlines","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.833],"y":[0.833]},"o":{"x":[0.167],"y":[0.167]},"n":["0p833_0p833_0p167_0p167"],"t":0,"s":[0],"e":[1080]},{"t":90.0000036657751}],"ix":10},"p":{"a":0,"k":[80,80,0],"ix":2},"a":{"a":0,"k":[80,80,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,-25.344],[0,0],[20.629,12.196],[0,0]],"o":[[0,0],[0,-23.936],[0,0],[21.841,12.912]],"v":[[18.722,31.01],[14.722,31.01],[-18.722,-27.567],[-16.687,-31.01]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"gf","o":{"a":0,"k":100,"ix":10},"r":1,"g":{"p":3,"k":{"a":0,"k":[0,0.298,0.714,0.286,0.5,0.298,0.714,0.286,1,0.298,0.714,0.286,0,1,0.5,0.9,0.999,0.8],"ix":9}},"s":{"a":0,"k":[17.593,28.038],"ix":5},"e":{"a":0,"k":[17.708,-27.53],"ix":6},"t":1,"nm":"Gradient Fill 1","mn":"ADBE Vector Graphic - G-Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[133.331,49.101],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 1","np":2,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false},{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[12.669,-11.968],[0,0],[-18.463,0],[-11.042,-6.528],[0,0],[12.18,0]],"o":[[0,0],[13.415,-12.673],[12.895,0],[0,0],[-10.427,-6.164],[-17.437,0]],"v":[[-40.265,11.28],[-43.012,8.372],[6.422,-11.28],[43.012,-1.301],[40.977,2.142],[6.422,-7.28]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"gf","o":{"a":0,"k":100,"ix":10},"r":1,"g":{"p":3,"k":{"a":0,"k":[0,0.298,0.714,0.286,0.5,0.298,0.714,0.286,1,0.298,0.714,0.286,0,0.8,0.5,0.7,1,0.6],"ix":9}},"s":{"a":0,"k":[36.252,1.852],"ix":5},"e":{"a":0,"k":[-36.911,1.539],"ix":6},"t":1,"nm":"Gradient Fill 1","mn":"ADBE Vector Graphic - G-Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[73.578,19.28],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 2","np":2,"cix":2,"ix":2,"mn":"ADBE Vector Group","hd":false},{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,0],[0,16.235],[-14.552,13.747],[0,0],[0,-18.9],[-9.422,-12.049]],"o":[[-9.979,-12.76],[0,-20.011],[0,0],[-13.744,12.983],[0,15.333],[0,0]],"v":[[2.596,48.335],[-12.656,4.015],[9.91,-48.335],[12.656,-45.426],[-8.656,4.015],[5.747,45.87]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"gf","o":{"a":0,"k":100,"ix":10},"r":1,"g":{"p":3,"k":{"a":0,"k":[0,0.298,0.714,0.286,0.5,0.298,0.714,0.286,1,0.298,0.714,0.286,0,0.4,0.5,0.5,1,0.6],"ix":9}},"s":{"a":0,"k":[1.303,42.93],"ix":5},"e":{"a":0,"k":[0.576,-44.195],"ix":6},"t":1,"nm":"Gradient Fill 1","mn":"ADBE Vector Graphic - G-Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[20.657,75.986],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 3","np":2,"cix":2,"ix":3,"mn":"ADBE Vector Group","hd":false},{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[17.645,0],[13.758,17.591],[0,0],[-21.066,0],[-12.446,11.055],[0,0]],"o":[[-22.306,0],[0,0],[12.994,16.616],[16.664,0],[0,0],[-13.178,11.706]],"v":[[4.475,15.073],[-52.272,-12.607],[-49.121,-15.072],[4.475,11.073],[49.616,-6.07],[52.272,-3.079]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"gf","o":{"a":0,"k":100,"ix":10},"r":1,"g":{"p":3,"k":{"a":0,"k":[0,0.298,0.714,0.286,0.5,0.298,0.714,0.286,1,0.298,0.714,0.286,0,0.4,0.5,0.3,1,0.2],"ix":9}},"s":{"a":0,"k":[-48.376,-12.58],"ix":5},"e":{"a":0,"k":[51.078,-4.37],"ix":6},"t":1,"nm":"Gradient Fill 1","mn":"ADBE Vector Graphic - G-Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[75.525,136.927],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 4","np":2,"cix":2,"ix":4,"mn":"ADBE Vector Group","hd":false},{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[13.066,-11.606],[0,0],[-2.053,16.294],[0,0]],"o":[[0,0],[12.342,-10.963],[0,0],[-2.175,17.256]],"v":[[-10.49,22.629],[-13.146,19.639],[9.176,-22.629],[13.145,-22.129]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"gf","o":{"a":0,"k":100,"ix":10},"r":1,"g":{"p":3,"k":{"a":0,"k":[0,0.298,0.714,0.286,0.5,0.298,0.714,0.286,1,0.298,0.714,0.286,0,0,0.5,0.1,1,0.2],"ix":9}},"s":{"a":0,"k":[11.308,-22.716],"ix":5},"e":{"a":0,"k":[-11.557,20.516],"ix":6},"t":1,"nm":"Gradient Fill 1","mn":"ADBE Vector Graphic - G-Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[138.286,111.219],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 5","np":2,"cix":2,"ix":5,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":90.0000036657751,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"circle Outlines","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[80,80,0],"ix":2},"a":{"a":0,"k":[80,80,0],"ix":1},"s":{"a":0,"k":[102.564,102.564,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[43.078,0],[0,-43.078],[-43.078,0],[0,43.078]],"o":[[-43.078,0],[0,43.078],[43.078,0],[0,-43.078]],"v":[[0,-78],[-78,0],[0,78],[78,0]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ind":1,"ty":"sh","ix":2,"ks":{"a":0,"k":{"i":[[0,38.66],[-38.66,0],[0,-38.66],[38.66,0]],"o":[[0,-38.66],[38.66,0],[0,38.66],[-38.66,0]],"v":[[-70,0],[0,-70],[70,0],[0,70]],"c":true},"ix":2},"nm":"Path 2","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"mm","mm":1,"nm":"Merge Paths 1","mn":"ADBE Vector Filter - Merge","hd":false},{"ty":"fl","c":{"a":0,"k":[0.13300000359,0.144999994016,0.180000005984,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[80,80],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 1","np":4,"cix":2,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":90.0000036657751,"st":0,"bm":0}],"markers":[]}
\ No newline at end of file
--- a/PIALibrary/Sources/UI/iOS/UIViewLoading.swift
+++ b/PIALibrary/Sources/UI/iOS/UIViewLoading.swift
+//
+//  UIViewLoading.swift
+//  PIALibrary-iOS
+//
+//  Created by Jose Antonio Blaya Garcia on 04/12/2018.
+//  Copyright © 2018 London Trust Media. All rights reserved.
+//
+
+import Foundation
+import Lottie
+
+extension UIView: AnimatingLoadingDelegate {
+    
+    private struct LottieRepos {
+        static var graphLoad: LOTAnimationView?
+    }
+    
+    var graphLoad: LOTAnimationView? {
+        get {
+            return objc_getAssociatedObject(self, &LottieRepos.graphLoad) as? LOTAnimationView
+        }
+        set {
+            if let unwrappedValue = newValue {
+                objc_setAssociatedObject(self, &LottieRepos.graphLoad, unwrappedValue as LOTAnimationView?, .OBJC_ASSOCIATION_RETAIN_NONATOMIC)
+            }
+        }
+    }
+    
+    public func showLoadingAnimation() {
+        if graphLoad == nil {
+            graphLoad = LOTAnimationView(name: "pia-spinner")
+            adjustLottieSize()
+        }
+        addLoadingAnimation()
+    }
+    
+    private func addLoadingAnimation() {
+        graphLoad?.loopAnimation = true
+        if let graphLoad = graphLoad {
+            self.addSubview(graphLoad)
+            graphLoad.play()
+        }
+    }
+    
+    public func hideLoadingAnimation() {
+        graphLoad?.stop()
+        graphLoad?.removeFromSuperview()
+    }
+    
+    public func adjustLottieSize() {
+        let lottieWidth = self.frame.width/2
+        graphLoad?.frame = CGRect(
+            x: lottieWidth/2,
+            y: (self.frame.height - lottieWidth)/2,
+            width: lottieWidth,
+            height: lottieWidth
+        )
+    }
+}
--- a/PIALibrary/Sources/UI/iOS/ViewControllers/AutolayoutViewController.swift
+++ b/PIALibrary/Sources/UI/iOS/ViewControllers/AutolayoutViewController.swift
@@ -7,7 +7,7 @@
 //

 import UIKit
-
+import Lottie
 /// Declares a generic, dismissable modal controller.
 public protocol ModalController: class {

@@ -17,6 +17,12 @@ public protocol ModalController: class {
    func dismissModal()
 }

+public protocol AnimatingLoadingDelegate: class {
+    func showLoadingAnimation()
+    func hideLoadingAnimation()
+    func adjustLottieSize()
+}
+
 /// Enum used to determinate the status of the view controller and apply effects over the UI elements
 public enum ViewControllerStatus {
    case initial
@@ -136,3 +142,71 @@ open class AutolayoutViewController: UIViewController, ModalController, Restylab
    }

 }
+
+extension AutolayoutViewController: AnimatingLoadingDelegate {
+    
+    private struct LottieRepos {
+        static var graphLoad: LOTAnimationView?
+        static var containerView: UIView?
+    }
+    
+    var graphLoad: LOTAnimationView? {
+        get {
+            return objc_getAssociatedObject(self, &LottieRepos.graphLoad) as? LOTAnimationView
+        }
+        set {
+            if let unwrappedValue = newValue {
+                objc_setAssociatedObject(self, &LottieRepos.graphLoad, unwrappedValue as LOTAnimationView?, .OBJC_ASSOCIATION_RETAIN_NONATOMIC)
+            }
+        }
+    }
+
+    var containerView: UIView? {
+        get {
+            return LottieRepos.containerView
+        }
+        set {
+            if let unwrappedValue = newValue {
+                LottieRepos.containerView = unwrappedValue
+            }
+        }
+    }
+
+    public func showLoadingAnimation() {
+        if graphLoad == nil {
+            containerView = UIView(frame: self.view.frame)
+            containerView?.backgroundColor = .white
+            containerView?.alpha = 0.2
+            graphLoad = LOTAnimationView(name: "pia-spinner")
+            adjustLottieSize()
+        }
+        addLoadingAnimation()
+    }
+    
+    private func addLoadingAnimation() {
+        graphLoad?.loopAnimation = true
+        if let graphLoad = graphLoad,
+            let containerView = containerView {
+            view.addSubview(containerView)
+            view.addSubview(graphLoad)
+            graphLoad.play()
+        }
+    }
+    
+    public func hideLoadingAnimation() {
+        graphLoad?.stop()
+        graphLoad?.removeFromSuperview()
+        containerView?.removeFromSuperview()
+    }
+    
+    public func adjustLottieSize() {
+        let lottieWidth = view.frame.width/4
+        graphLoad?.frame = CGRect(
+            x: (view.frame.width/2) - (lottieWidth/2),
+            y: (view.frame.height - lottieWidth)/2,
+            width: lottieWidth,
+            height: lottieWidth
+        )
+    }
+
+}
--- a/PIALibrary/Sources/UI/iOS/ViewControllers/ConfirmVPNPlanViewController.swift
+++ b/PIALibrary/Sources/UI/iOS/ViewControllers/ConfirmVPNPlanViewController.swift
@@ -132,10 +132,12 @@ public class ConfirmVPNPlanViewController: AutolayoutViewController, BrandableNa
        log.debug("Will purchase plan: \(plan.product)")
        
        disableInteractions()
+        self.showLoadingAnimation()
        
        preset?.accountProvider.purchase(plan: plan.plan) { (transaction, error) in
            self.enableInteractions()
-            
+            self.hideLoadingAnimation()
+
            guard let transaction = transaction else {
                if let error = error {
                    log.error("Purchase failed (error: \(error))")

--- a/PIALibrary/Sources/UI/iOS/ViewControllers/LoginViewController.swift
+++ b/PIALibrary/Sources/UI/iOS/ViewControllers/LoginViewController.swift
@@ -104,9 +104,13 @@ class LoginViewController: AutolayoutViewController, WelcomeChild {

        enableInteractions(false)

+        self.showLoadingAnimation()
+        
        preset?.accountProvider.login(with: request) { (user, error) in
            self.enableInteractions(true)

+            self.hideLoadingAnimation()
+
            guard let user = user else {
                var errorMessage: String?
                if let error = error {

--- a/PIALibrary/Sources/UI/iOS/ViewControllers/PurchaseViewController.swift
+++ b/PIALibrary/Sources/UI/iOS/ViewControllers/PurchaseViewController.swift
@@ -134,6 +134,7 @@ class PurchaseViewController: AutolayoutViewController, WelcomeChild {
    }
    
    private func disableInteractions(fully: Bool) {
+        self.showLoadingAnimation()
        collectionPlans.isUserInteractionEnabled = false
        if fully {
            parent?.view.isUserInteractionEnabled = false
@@ -141,6 +142,7 @@ class PurchaseViewController: AutolayoutViewController, WelcomeChild {
    }
    
    private func enableInteractions() {
+        self.hideLoadingAnimation()
        collectionPlans.isUserInteractionEnabled = true
        parent?.view.isUserInteractionEnabled = true
    }

--- a/PIALibrary/Sources/UI/iOS/ViewControllers/RestoreSignupViewController.swift
+++ b/PIALibrary/Sources/UI/iOS/ViewControllers/RestoreSignupViewController.swift
@@ -108,7 +108,9 @@ public class RestoreSignupViewController: AutolayoutViewController, BrandableNav
    
        enableInteractions(false)
        isRunningActivity = true
+        self.showLoadingAnimation()
        preset?.accountProvider.restorePurchases { (error) in
+            self.hideLoadingAnimation()
            self.isRunningActivity = false
            if let _ = error {
                self.reportRestoreFailure(error)

--- a/Podfile
+++ b/Podfile
@@ -7,6 +7,7 @@ abstract_target 'PIALibrary' do
    pod 'Alamofire', '~> 4'
    pod 'ReachabilitySwift'
    pod 'SwiftEntryKit', '0.7.2'
+    pod 'lottie-ios'
    pod 'PIATunnel', :path => '/Users/ueshiba/Desktop/PIA/tunnel-apple'
    #pod 'PIATunnel', '~> 1.1.7'


--- a/Podfile.lock
+++ b/Podfile.lock
 PODS:
  - Alamofire (4.7.3)
  - Gloss (2.0.1)
+  - lottie-ios (2.5.2)
  - OpenSSL-Apple (1.1.0h)
  - PIATunnel (1.1.8):
    - PIATunnel/AppExtension (= 1.1.8)
@@ -20,6 +21,7 @@ PODS:
 DEPENDENCIES:
  - Alamofire (~> 4)
  - Gloss (~> 2)
+  - lottie-ios
  - PIATunnel (from `/Users/ueshiba/Desktop/PIA/tunnel-apple`)
  - ReachabilitySwift
  - SwiftEntryKit (= 0.7.2)
@@ -29,6 +31,7 @@ SPEC REPOS:
  https://github.com/cocoapods/specs.git:
    - Alamofire
    - Gloss
+    - lottie-ios
    - OpenSSL-Apple
    - QuickLayout
    - ReachabilitySwift
@@ -42,6 +45,7 @@ EXTERNAL SOURCES:
 SPEC CHECKSUMS:
  Alamofire: c7287b6e5d7da964a70935e5db17046b7fde6568
  Gloss: 1e8743f8de1fbe14a97f220ff901cba91ae5f8f8
+  lottie-ios: 3fef45d3fabe63e3c7c2eb603dd64ddfffc73062
  OpenSSL-Apple: cd153d705ef350eb834ae7ff5f21f792b51ed208
  PIATunnel: fc7e7d0a812c6c98138ac315e7a43008aadd15b2
  QuickLayout: a730730b646b231fd4ef7cffaeb1e81fe0e1ca92
@@ -49,6 +53,6 @@ SPEC CHECKSUMS:
  SwiftEntryKit: 83d312243af7397e38a222b17b7a744b9a7d2145
  SwiftyBeaver: ccfcdf85a04d429f1633f668650b0ce8020bda3a

-PODFILE CHECKSUM: 69dc247f30af562636213a5c232d74220b2ec50d
+PODFILE CHECKSUM: 779be591b3b48081d1a8f10fff64a068d022b520

 COCOAPODS: 1.5.3