From 57725b2eeff986cbb60cf17807b64c8a165eb881 Mon Sep 17 00:00:00 2001
From: Yohan Simard <ysimard@etud.insa-toulouse.fr>
Date: Wed, 29 Jan 2020 00:29:29 +0100
Subject: [PATCH] Planex webview is no longer reloading on orientation change

---
 components/BaseContainer.js | 75 ++++++++++++++++++++++---------------
 components/WebViewScreen.js |  3 +-
 2 files changed, 46 insertions(+), 32 deletions(-)

diff --git a/components/BaseContainer.js b/components/BaseContainer.js
index 99fadc2..30d1889 100644
--- a/components/BaseContainer.js
+++ b/components/BaseContainer.js
@@ -1,13 +1,14 @@
 // @flow
 
 import * as React from 'react';
-import {Container, Right} from "native-base";
+import {Container} from "native-base";
 import CustomHeader from "./CustomHeader";
 import CustomSideMenu from "./CustomSideMenu";
 import CustomMaterialIcon from "./CustomMaterialIcon";
 import {Platform, View} from "react-native";
 import ThemeManager from "../utils/ThemeManager";
 import Touchable from "react-native-platform-touchable";
+import {ScreenOrientation} from "expo";
 
 
 type Props = {
@@ -18,29 +19,30 @@ type Props = {
     hasTabs: boolean,
     hasBackButton: boolean,
     hasSideMenu: boolean,
-    isHeaderVisible: boolean
 }
 
 type State = {
-    isOpen: boolean
+    isOpen: boolean,
+    isHeaderVisible: boolean
 }
 
 
 export default class BaseContainer extends React.Component<Props, State> {
 
     willBlurSubscription: function;
+    willFocusSubscription: function;
 
     static defaultProps = {
         headerRightButton: <View/>,
         hasTabs: false,
         hasBackButton: false,
         hasSideMenu: true,
-        isHeaderVisible: true,
     };
 
 
     state = {
         isOpen: false,
+        isHeaderVisible: true,
     };
 
     toggle() {
@@ -57,6 +59,15 @@ export default class BaseContainer extends React.Component<Props, State> {
      * Register for blur event to close side menu on screen change
      */
     componentDidMount() {
+        this.willFocusSubscription = this.props.navigation.addListener('willFocus', payload => {
+            ScreenOrientation.unlockAsync();
+            ScreenOrientation.addOrientationChangeListener((OrientationChangeEvent) => {
+                let isLandscape = OrientationChangeEvent.orientationInfo.orientation === ScreenOrientation.Orientation.LANDSCAPE ||
+                    OrientationChangeEvent.orientationInfo.orientation === ScreenOrientation.Orientation.LANDSCAPE_LEFT ||
+                    OrientationChangeEvent.orientationInfo.orientation === ScreenOrientation.Orientation.LANDSCAPE_RIGHT;
+                this.setState({isHeaderVisible: !isLandscape});
+            });
+        });
         this.willBlurSubscription = this.props.navigation.addListener(
             'willBlur',
             payload => {
@@ -71,25 +82,29 @@ export default class BaseContainer extends React.Component<Props, State> {
     componentWillUnmount() {
         if (this.willBlurSubscription !== undefined)
             this.willBlurSubscription.remove();
+        if (this.willFocusSubscription !== undefined)
+            this.willFocusSubscription.remove();
     }
 
     getMainContainer() {
         return (
             <Container>
-                <CustomHeader
-                    navigation={this.props.navigation} title={this.props.headerTitle}
-                    leftButton={
-                        <Touchable
-                            style={{padding: 6}}
-                            onPress={() => this.toggle()}>
-                            <CustomMaterialIcon
-                                color={Platform.OS === 'ios' ? ThemeManager.getCurrentThemeVariables().brandPrimary : "#fff"}
-                                icon="menu"/>
-                        </Touchable>
-                    }
-                    rightButton={this.props.headerRightButton}
-                    hasTabs={this.props.hasTabs}
-                    hasBackButton={this.props.hasBackButton}/>
+                {this.state.isHeaderVisible ?
+                    <CustomHeader
+                        navigation={this.props.navigation} title={this.props.headerTitle}
+                        leftButton={
+                            <Touchable
+                                style={{padding: 6}}
+                                onPress={() => this.toggle()}>
+                                <CustomMaterialIcon
+                                    color={Platform.OS === 'ios' ? ThemeManager.getCurrentThemeVariables().brandPrimary : "#fff"}
+                                    icon="menu"/>
+                            </Touchable>
+                        }
+                        rightButton={this.props.headerRightButton}
+                        hasTabs={this.props.hasTabs}
+                        hasBackButton={this.props.hasBackButton}/>
+                    : null}
                 {this.props.children}
             </Container>
         );
@@ -97,7 +112,7 @@ export default class BaseContainer extends React.Component<Props, State> {
 
 
     render() {
-        if (this.props.isHeaderVisible) {
+        // if (this.state.isHeaderVisible) {
             return (
                 <View style={{
                     backgroundColor: ThemeManager.getCurrentThemeVariables().sideMenuBgColor,
@@ -113,17 +128,17 @@ export default class BaseContainer extends React.Component<Props, State> {
                         this.getMainContainer()}
                 </View>
             );
-        } else {
-            return (
-                <View style={{
-                    backgroundColor: ThemeManager.getCurrentThemeVariables().sideMenuBgColor,
-                    width: '100%',
-                    height: '100%'
-                }}>
-                    {this.props.children}
-                </View>
-            );
-        }
+        // } else {
+        //     return (
+        //         <View style={{
+        //             backgroundColor: ThemeManager.getCurrentThemeVariables().sideMenuBgColor,
+        //             width: '100%',
+        //             height: '100%'
+        //         }}>
+        //             {this.props.children}
+        //         </View>
+        //     );
+        // }
 
     }
 }
diff --git a/components/WebViewScreen.js b/components/WebViewScreen.js
index ef53fe5..59dd396 100644
--- a/components/WebViewScreen.js
+++ b/components/WebViewScreen.js
@@ -189,8 +189,7 @@ export default class WebViewScreen extends React.Component<Props, State> {
                 headerTitle={this.props.headerTitle}
                 headerRightButton={this.getRefreshButton()}
                 hasBackButton={this.props.hasHeaderBackButton}
-                hasSideMenu={this.props.hasSideMenu}
-                isHeaderVisible={!this.state.isLandscape}>
+                hasSideMenu={this.props.hasSideMenu}>
                 {this.props.data.length === 1 ?
                     this.getWebview(this.props.data[0]) :
                     <Tabs