chore: improve scrolling experience on discover title bar (#1788)

openedx-unsupported · Aug 18, 2023 · cb92fce · cb92fce
1 parent 5b93cd8
commit cb92fce
Show file tree

Hide file tree

Showing 6 changed files with 116 additions and 17 deletions.
diff --git a/Source/DiscoveryViewController.swift b/Source/DiscoveryViewController.swift
@@ -47,7 +47,7 @@ class DiscoveryViewController: UIViewController, InterfaceOrientationOverriding
     private func configureDiscoveryController() {
         guard environment.config.discovery.isEnabled else { return }
 
-        let coursesController = self.environment.config.discovery.type == .webview ? OEXFindCoursesViewController(environment: environment, showBottomBar: false, bottomBar: bottomBar, searchQuery: self.searchQuery) : CourseCatalogViewController(environment: self.environment)
+        let coursesController = self.environment.config.discovery.type == .webview ? OEXFindCoursesViewController(environment: environment, showBottomBar: false, bottomBar: bottomBar, searchQuery: self.searchQuery, fromStartupScreen: false) : CourseCatalogViewController(environment: self.environment)
 
         addChild(coursesController)
         didMove(toParent: self)

diff --git a/Source/DiscoveryWebViewHelper.swift b/Source/DiscoveryWebViewHelper.swift
@@ -43,6 +43,8 @@ class DiscoveryWebViewHelper: NSObject {
         self.init(environment: environment, delegate: delegate, bottomBar: bottomBar, searchQuery: nil)
     }
 
+    private lazy var titleView = UIView()
+
     @objc init(environment: Environment, delegate: WebViewNavigationDelegate?, bottomBar: UIView?, searchQuery: String?) {
         self.environment = environment
         self.webView = WKWebView(frame: .zero, configuration: environment.config.webViewConfiguration())
@@ -69,8 +71,57 @@ class DiscoveryWebViewHelper: NSObject {
         refreshView()
     }
 
+    private func addShowTitleView() {
+        guard let container = delegate?.webViewContainingController() else { return }
+
+        if contentView.contains(titleView) {
+            if titleView.alpha != 1 {
+                UIView.animate(withDuration: 0.4) { [weak self] in
+                    self?.titleView.alpha = 1
+                }
+                contentView.bringSubviewToFront(titleView)
+            }
+        }
+        else {
+            titleView.backgroundColor = OEXStyles.shared().navigationBarColor()
+            contentView.addSubview(titleView)
+            titleView.alpha = 0
+            let title = UILabel()
+            title.textColor = OEXStyles.shared().navigationItemTintColor()
+            title.text = Strings.exploreTheCatalog
+            titleView.addSubview(title)
+
+            title.snp.remakeConstraints { make in
+                make.center.equalTo(titleView)
+            }
+        }
+
+        let offSet = container.view.viewWithTag(statuBarViewTag)?.frame.size.height ?? 0
+        titleView.snp.remakeConstraints { make in
+            make.top.equalTo(contentView).offset(offSet)
+            make.trailing.equalTo(contentView)
+            make.leading.equalTo(contentView)
+            make.height.equalTo(44)
+        }
+    }
+
+    private func hideTitleView() {
+        UIView.animate(withDuration: 0.4) { [weak self] in
+            self?.titleView.alpha = 0
+        }
+    }
+
+    @objc func updateTitleViewVisibility() {
+        if webView.scrollView.contentOffset.y >= 0 {
+            addShowTitleView()
+        }
+        else {
+            hideTitleView()
+        }
+    }
+
     @objc func refreshView() {
-        guard let _ = delegate?.webViewContainingController() else { return }
+        guard let container = delegate?.webViewContainingController() else { return }
         contentView.subviews.forEach { $0.removeFromSuperview() }
         let isUserLoggedIn = environment.session.currentUser != nil
 
@@ -93,6 +144,14 @@ class DiscoveryWebViewHelper: NSObject {
         }
 
         addObserver()
+
+        if let container  = container as? OEXFindCoursesViewController {
+            if !container.fromStartupScreen {
+                webView.scrollView.delegate = self
+                container.setStatusBar(color: OEXStyles.shared().navigationBarColor())
+                addShowTitleView()
+            }
+        }
     }
 
     private func addObserver() {
@@ -342,3 +401,31 @@ extension WKWebView {
         configuration.userContentController.addUserScript(script)
     }
 }
+
+extension DiscoveryWebViewHelper: UIScrollViewDelegate {
+    func scrollViewDidScroll(_ scrollView: UIScrollView) {
+        if scrollView.contentOffset.y >= 0 {
+            addShowTitleView()
+        }
+        else {
+            hideTitleView()
+        }
+    }
+}
+
+extension OEXFindCoursesViewController {
+    open override var preferredStatusBarStyle: UIStatusBarStyle {
+        return .darkContent
+    }
+
+    open override func viewWillTransition(to size: CGSize, with coordinator: UIViewControllerTransitionCoordinator) {
+
+        coordinator.animate { [weak self] _ in
+            guard let weakSelf = self else { return }
+            DispatchQueue.main.async {
+                weakSelf.setStatusBar(color: OEXStyles.shared().navigationBarColor())
+                weakSelf.updateTitleViewVisibility()
+            }
+        }
+    }
+}
diff --git a/Source/NewCourseDashboardViewController.swift b/Source/NewCourseDashboardViewController.swift
@@ -8,6 +8,9 @@
 
 import UIKit
 
+// view used at the exact same location of status bar in case of hidden navbar
+let statuBarViewTag: Int = 123454321
+
 public protocol NewCourseDashboardViewControllerDelegate: AnyObject {
     func showCourseDates(bannerInfo: DatesBannerInfo?, delegate: CourseOutlineTableController?)
     func hideCourseDates()
@@ -600,20 +603,19 @@ extension NewCourseDashboardViewController: NewCourseDashboardViewControllerDele
 
 public extension UIViewController {
     func setStatusBar(inside contentView: UIView? = nil, color: UIColor) {
-        let tag = 123454321
         let overView: UIView
 
-        if let contentView = contentView, let taggedView = contentView.viewWithTag(tag) {
+        if let contentView = contentView, let taggedView = contentView.viewWithTag(statuBarViewTag) {
             overView = taggedView
         } else if contentView != nil {
             overView = UIView()
-            overView.tag = tag
+            overView.tag = statuBarViewTag
             contentView?.addSubview(overView)
-        } else if let taggedView = view.viewWithTag(tag) {
+        } else if let taggedView = view.viewWithTag(statuBarViewTag) {
             overView = taggedView
         } else {
             overView = UIView()
-            overView.tag = tag
+            overView.tag = statuBarViewTag
             view.addSubview(overView)
         }
 

diff --git a/Source/OEXFindCoursesViewController.h b/Source/OEXFindCoursesViewController.h
@@ -17,8 +17,10 @@ typedef NS_ENUM(NSInteger, OEXFindCoursesBaseType) {
 @interface OEXFindCoursesViewController : UIViewController
 
 @property (readonly, strong, nonatomic) UIView* bottomBar;
-- (instancetype) initWithEnvironment:(RouterEnvironment* _Nullable)environment showBottomBar:(BOOL) showBottomBar bottomBar:(UIView* _Nullable)bottomBar searchQuery:(nullable NSString*)searchQuery;
+- (void) updateTitleViewVisibility;
+- (instancetype) initWithEnvironment:(RouterEnvironment* _Nullable)environment showBottomBar:(BOOL) showBottomBar bottomBar:(UIView* _Nullable)bottomBar searchQuery:(nullable NSString*)searchQuery fromStartupScreen:(BOOL) fromStartupScreen;
 @property (nonatomic) OEXFindCoursesBaseType startURL;
+@property (nonatomic) BOOL fromStartupScreen;
 @end
 
 NS_ASSUME_NONNULL_END
diff --git a/Source/OEXFindCoursesViewController.m b/Source/OEXFindCoursesViewController.m
@@ -34,13 +34,14 @@ @interface OEXFindCoursesViewController () <WebViewNavigationDelegate, Interface
 
 @implementation OEXFindCoursesViewController
 
-- (instancetype) initWithEnvironment:(RouterEnvironment *)environment showBottomBar:(BOOL) showBottomBar bottomBar:(UIView *)bottomBar searchQuery:(nullable NSString *)searchQuery  {
+- (instancetype) initWithEnvironment:(RouterEnvironment *)environment showBottomBar:(BOOL) showBottomBar bottomBar:(UIView *)bottomBar searchQuery:(nullable NSString *)searchQuery fromStartupScreen:(BOOL) fromStartupScreen {
     self = [super init];
     if (self) {
         _environment = environment;
         _bottomBar = bottomBar;
         _searchQuery = searchQuery;
         _showBottomBar = showBottomBar;
+        _fromStartupScreen = fromStartupScreen;
 
         [self loadCourseDiscovery];
     }
@@ -85,13 +86,20 @@ - (void) viewWillAppear:(BOOL)animated {
     }
 
     [self.environment.analytics trackScreenWithName:OEXAnalyticsScreenFindCourses];
-    self.navigationController.navigationBar.prefersLargeTitles = true;
-    self.extendedLayoutIncludesOpaqueBars = true;
+
+    if (!_fromStartupScreen) {
+        [self.navigationController setNavigationBarHidden:true animated:animated];
+        [self.webViewHelper updateTitleViewVisibility];
+    }
+}
+
+- (void)viewWillDisappear:(BOOL)animated {
+    [super viewWillDisappear:animated];
+    [self.navigationController setNavigationBarHidden:false animated:animated];
 }
 
-- (void)viewDidDisappear:(BOOL)animated {
-    [super viewDidDisappear:animated];
-    self.navigationController.navigationBar.prefersLargeTitles = false;
+- (void) updateTitleViewVisibility {
+    [self.webViewHelper updateTitleViewVisibility];
 }
 
 - (DiscoveryConfig*)discoveryConfig {

diff --git a/Source/OEXRouter+Swift.swift b/Source/OEXRouter+Swift.swift
@@ -575,18 +575,18 @@ extension OEXRouter {
     }
 
     func showCourseCatalog(fromController: UIViewController? = nil, bottomBar: UIView? = nil, searchQuery: String? = nil) {
-        guard let controller = discoveryViewController(bottomBar: bottomBar, searchQuery: searchQuery) else { return }
+        guard let controller = discoveryViewController(bottomBar: bottomBar, searchQuery: searchQuery, fromStartupScreen: true) else { return }
         if let fromController = fromController {
             fromController.tabBarController?.selectedIndex = EnrolledTabBarViewController.courseCatalogIndex
         } else {
             showControllerFromStartupScreen(controller: controller)
         }
     }
 
-    func discoveryViewController(bottomBar: UIView? = nil, searchQuery: String? = nil) -> UIViewController? {
+    func discoveryViewController(bottomBar: UIView? = nil, searchQuery: String? = nil, fromStartupScreen: Bool = false) -> UIViewController? {
         guard environment.config.discovery.isEnabled else { return nil }
 
-        return environment.config.discovery.type == .webview ? OEXFindCoursesViewController(environment: environment, showBottomBar: true, bottomBar: bottomBar, searchQuery: searchQuery) : CourseCatalogViewController(environment: environment)
+        return environment.config.discovery.type == .webview ? OEXFindCoursesViewController(environment: environment, showBottomBar: true, bottomBar: bottomBar, searchQuery: searchQuery, fromStartupScreen: fromStartupScreen) : CourseCatalogViewController(environment: environment)
     }
 
     func showProgramDetail(from controller: UIViewController, with pathId: String, bottomBar: UIView?) {