diff --git a/WordPress/Classes/ViewRelated/Reader/Detail/ReaderDetailViewController.storyboard b/WordPress/Classes/ViewRelated/Reader/Detail/ReaderDetailViewController.storyboard index 530b04a7a568..49c2b482ecac 100644 --- a/WordPress/Classes/ViewRelated/Reader/Detail/ReaderDetailViewController.storyboard +++ b/WordPress/Classes/ViewRelated/Reader/Detail/ReaderDetailViewController.storyboard @@ -1,9 +1,9 @@ - + - + @@ -136,174 +136,10 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - @@ -311,14 +147,10 @@ - - - - @@ -327,7 +159,6 @@ - @@ -343,8 +174,6 @@ - - diff --git a/WordPress/Classes/ViewRelated/Reader/Detail/ReaderDetailViewController.swift b/WordPress/Classes/ViewRelated/Reader/Detail/ReaderDetailViewController.swift index 7b2da6cce258..b1b8f7a7fed1 100644 --- a/WordPress/Classes/ViewRelated/Reader/Detail/ReaderDetailViewController.swift +++ b/WordPress/Classes/ViewRelated/Reader/Detail/ReaderDetailViewController.swift @@ -69,9 +69,6 @@ class ReaderDetailViewController: UIViewController, ReaderDetailView { /// Wrapper for the Likes summary view @IBOutlet weak var likesContainerView: UIView! - /// The loading view, which contains all the ghost views - @IBOutlet weak var loadingView: UIView! - /// The loading view, which contains all the ghost views @IBOutlet weak var actionStackView: UIStackView! @@ -80,6 +77,8 @@ class ReaderDetailViewController: UIViewController, ReaderDetailView { @IBOutlet weak var toolbarHeightConstraint: NSLayoutConstraint! + private let activityIndicator = UIActivityIndicatorView(style: .medium) + /// The actual header private let featuredImage: ReaderDetailFeaturedImageView = .loadFromNib() @@ -291,24 +290,32 @@ class ReaderDetailViewController: UIViewController, ReaderDetailView { } } - /// Show ghost cells indicating the content is loading func showLoading() { - let style = GhostStyle() - loadingView.startGhostAnimation(style: style) + if activityIndicator.superview == nil { + for view in allContentViews { + view.alpha = 0 + } + scrollView.addSubview(activityIndicator) + activityIndicator.translatesAutoresizingMaskIntoConstraints = false + NSLayoutConstraint.activate([ + activityIndicator.centerXAnchor.constraint(equalTo: webView.centerXAnchor), + activityIndicator.topAnchor.constraint(equalTo: webView.topAnchor, constant: 64), + ]) + activityIndicator.startAnimating() + } } - /// Hide the ghost cells func hideLoading() { guard !featuredImage.isLoading, !isLoadingWebView else { return } - UIView.animate(withDuration: 0.3, animations: { - self.loadingView.alpha = 0.0 - }) { (_) in - self.loadingView.isHidden = true - self.loadingView.stopGhostAnimation() - self.loadingView.alpha = 1.0 + activityIndicator.stopAnimating() + activityIndicator.removeFromSuperview() + UIView.animate(withDuration: 0.25) { + for view in self.allContentViews { + view.alpha = 1 + } } guard let post = post else { @@ -318,6 +325,10 @@ class ReaderDetailViewController: UIViewController, ReaderDetailView { fetchRelatedPostsIfNeeded(for: post) } + private var allContentViews: [UIView] { + [webView, likesContainerView, commentsTableView, relatedPostsTableView, actionStackView] + } + func fetchRelatedPostsIfNeeded(for post: ReaderPost) { guard shouldFetchRelatedPosts else { return @@ -552,7 +563,7 @@ class ReaderDetailViewController: UIViewController, ReaderDetailView { featuredImage.delegate = coordinator - view.insertSubview(featuredImage, belowSubview: loadingView) + view.insertSubview(featuredImage, belowSubview: webView) NSLayoutConstraint.activate([ featuredImage.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 0),