diff --git a/components/BaseContainer.js b/components/BaseContainer.js index 69c8468..99fadc2 100644 --- a/components/BaseContainer.js +++ b/components/BaseContainer.js @@ -18,6 +18,7 @@ type Props = { hasTabs: boolean, hasBackButton: boolean, hasSideMenu: boolean, + isHeaderVisible: boolean } type State = { @@ -34,6 +35,7 @@ export default class BaseContainer extends React.Component { hasTabs: false, hasBackButton: false, hasSideMenu: true, + isHeaderVisible: true, }; @@ -95,20 +97,33 @@ export default class BaseContainer extends React.Component { render() { - return ( - - {this.props.hasSideMenu ? - this.updateMenuState(isOpen)}> - {this.getMainContainer()} - : - this.getMainContainer()} - - ); + if (this.props.isHeaderVisible) { + return ( + + {this.props.hasSideMenu ? + this.updateMenuState(isOpen)}> + {this.getMainContainer()} + : + this.getMainContainer()} + + ); + } else { + return ( + + {this.props.children} + + ); + } + } } diff --git a/components/WebViewScreen.js b/components/WebViewScreen.js index f18cc66..39503ab 100644 --- a/components/WebViewScreen.js +++ b/components/WebViewScreen.js @@ -8,6 +8,8 @@ import Touchable from "react-native-platform-touchable"; import CustomMaterialIcon from "../components/CustomMaterialIcon"; import ThemeManager from "../utils/ThemeManager"; import BaseContainer from "../components/BaseContainer"; +import {ScreenOrientation} from 'expo'; +import {NavigationActions} from 'react-navigation'; type Props = { navigation: Object, @@ -23,10 +25,14 @@ type Props = { hasFooter: boolean, } +type State = { + isLandscape: boolean, +} + /** * Class defining a webview screen. */ -export default class WebViewScreen extends React.Component { +export default class WebViewScreen extends React.Component { static defaultProps = { hasBackButton: false, @@ -34,7 +40,52 @@ export default class WebViewScreen extends React.Component { hasFooter: true, }; + state = { + isLandscape: false, + }; + webviewArray: Array = []; + willFocusSubscription: function; + willBlurSubscription: function; + + /** + * 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({isLandscape: isLandscape}); + const setParamsAction = NavigationActions.setParams({ + params: {showTabBar: !isLandscape}, + key: this.props.navigation.state.key, + }); + this.props.navigation.dispatch(setParamsAction); + }); + } + ); + this.willBlurSubscription = this.props.navigation.addListener( + 'willBlur', + payload => { + ScreenOrientation.lockAsync(ScreenOrientation.Orientation.PORTRAIT); + } + ); + } + + /** + * Unregister from event when un-mounting components + */ + componentWillUnmount() { + if (this.willBlurSubscription !== undefined) + this.willBlurSubscription.remove(); + if (this.willFocusSubscription !== undefined) + this.willFocusSubscription.remove(); + } openWebLink(url: string) { Linking.openURL(url).catch((err) => console.error('Error opening link', err)); @@ -138,7 +189,8 @@ export default class WebViewScreen extends React.Component { headerTitle={this.props.headerTitle} headerRightButton={this.getRefreshButton()} hasBackButton={this.props.hasHeaderBackButton} - hasSideMenu={this.props.hasSideMenu}> + hasSideMenu={this.props.hasSideMenu} + isHeaderVisible={!this.state.isLandscape}> {this.props.data.length === 1 ? this.getWebview(this.props.data[0]) : { + const showTabBar = navigation.state && navigation.state.params ? navigation.state.params.showTabBar : true; + return { + tabBarVisible: showTabBar, + }; + },}, }, { defaultNavigationOptions: ({navigation}) => ({ tabBarIcon: ({focused, horizontal, tintColor}) => { let icon = TAB_ICONS[navigation.state.routeName]; return ; - } + }, + tabBarVisible: true, }), order: ['Proximo', 'Planning', 'Home', 'Proxiwash', 'Planex'], initialRouteName: initialRoute, diff --git a/screens/AvailableRoomScreen.js b/screens/AvailableRoomScreen.js index a5e5902..8bdc0e4 100644 --- a/screens/AvailableRoomScreen.js +++ b/screens/AvailableRoomScreen.js @@ -30,8 +30,8 @@ export default class AvailableRoomScreen extends React.Component { 'document.querySelector(\'head\').innerHTML += \'\';' + 'document.querySelector(\'head\').innerHTML += \'\';' + 'let header = $(".table tbody tr:first");' + - '$("table").prepend("");' + - '$("thead").append(header);'; + '$("table").prepend("");true;' + // Fix for crash on ios + '$("thead").append(header);true;'; this.customBibInjectedJS = 'document.querySelector(\'head\').innerHTML += \'\';' +