Added bluemind screen, reworked sidemenu and changed planex default zoom

components/CustomHeader.js

@@ -98,14 +98,6 @@ export default class CustomHeader extends React.Component<Props> {
                 </Body>
                 <Right style={{flex: this.props.hasSearchField ? 0 : 1}}>
                     {this.props.rightButton}
-                    {this.props.hasBackButton ? <View/> :
-                        <Touchable
-                            style={{padding: 6}}
-                            onPress={() => this.props.navigation.navigate('SettingsScreen')}>
-                            <CustomMaterialIcon
-                                color={Platform.OS === 'ios' ? ThemeManager.getCurrentThemeVariables().brandPrimary : "#fff"}
-                                icon="settings"/>
-                        </Touchable>}
                 </Right>
             </Header>);
     }

components/Sidebar.js

@@ -41,6 +41,10 @@ export default class SideBar extends React.Component<Props, State> {
         // Dataset used to render the drawer
         // If the link field is defined, clicking on the item will open the link
         this.dataSet = [
+            {
+                name: i18n.t('sidenav.divider1'),
+                route: "Divider1"
+            },
             {
                 name: "Amicale",
                 route: "AmicaleScreen",
@@ -61,6 +65,15 @@ export default class SideBar extends React.Component<Props, State> {
                 route: "TutorInsaScreen",
                 icon: "school",
             },
+            {
+                name: "Mails BlueMind",
+                route: "BlueMindScreen",
+                icon: "email",
+            },
+            {
+                name: i18n.t('sidenav.divider2'),
+                route: "Divider2"
+            },
             {
                 name: i18n.t('screens.availableRooms'),
                 route: "AvailableRoomScreen",
@@ -71,9 +84,68 @@ export default class SideBar extends React.Component<Props, State> {
                 route: "SelfMenuScreen",
                 icon: "silverware-fork-knife",
             },
+            {
+                name: i18n.t('sidenav.divider3'),
+                route: "Divider3"
+            },
+            {
+                name: i18n.t('screens.settings'),
+                route: "SettingsScreen",
+                icon: "settings",
+            },
         ];
     }
 
+    getRenderItem(item: Object) {
+        if (item.icon !== undefined) {
+            return (
+                <ListItem
+                    button
+                    noBorder
+                    selected={this.state.active === item.route}
+                    onPress={() => {
+                        if (item.link !== undefined)
+                            Linking.openURL(item.link).catch((err) => console.error('Error opening link', err));
+                        else
+                            this.navigateToScreen(item.route);
+                    }}
+                >
+                    <Left>
+                        <CustomMaterialIcon
+                            icon={item.icon}
+                            active={this.state.active === item.route}
+                        />
+                        <Text style={styles.text}>
+                            {item.name}
+                        </Text>
+                    </Left>
+                    {item.types &&
+                    <Right style={{flex: 1}}>
+                        <Badge
+                            style={{
+                                borderRadius: 3,
+                                height: 25,
+                                width: 72,
+                                backgroundColor: item.bg
+                            }}
+                        >
+                            <Text
+                                style={styles.badgeText}
+                            >{`${item.types} Types`}</Text>
+                        </Badge>
+                    </Right>}
+                </ListItem>
+            );
+        } else {
+            return (
+                <ListItem itemDivider>
+                    <Text>{item.name}</Text>
+                </ListItem>
+            );
+        }
+
+    }
+
     /**
      * Navigate to the selected route
      * @param route {string} The route name to navigate to
@@ -92,43 +164,7 @@ export default class SideBar extends React.Component<Props, State> {
                     data={this.dataSet}
                     extraData={this.state}
                     keyExtractor={(item) => item.route}
-                    renderItem={({item}) =>
+                    renderItem={({item}) => this.getRenderItem(item)}
-                        <ListItem
-                            button
-                            noBorder
-                            selected={this.state.active === item.route}
-                            onPress={() => {
-                                if (item.link !== undefined)
-                                    Linking.openURL(item.link).catch((err) => console.error('Error opening link', err));
-                                else
-                                    this.navigateToScreen(item.route);
-                            }}
-                        >
-                            <Left>
-                                <CustomMaterialIcon
-                                    icon={item.icon}
-                                    active={this.state.active === item.route}
-                                />
-                                <Text style={styles.text}>
-                                    {item.name}
-                                </Text>
-                            </Left>
-                            {item.types &&
-                            <Right style={{flex: 1}}>
-                                <Badge
-                                    style={{
-                                        borderRadius: 3,
-                                        height: 25,
-                                        width: 72,
-                                        backgroundColor: item.bg
-                                    }}
-                                >
-                                    <Text
-                                        style={styles.badgeText}
-                                    >{`${item.types} Types`}</Text>
-                                </Badge>
-                            </Right>}
-                        </ListItem>}
                 />
             </Container>
         );

native-base-theme/variables/platform.js

@@ -250,7 +250,7 @@ export default {
   // List
   listBg: 'transparent',
   listBorderColor: '#c9c9c9',
-  listDividerBg: '#f4f4f4',
+  listDividerBg: '#e2e2e2',
   listBtnUnderlayColor: '#DDD',
   listItemPadding: platform === PLATFORM.IOS ? 10 : 12,
   listNoteColor: '#808080',

native-base-theme/variables/platformDark.js

@@ -250,7 +250,7 @@ export default {
   // List
   listBg: 'transparent',
   listBorderColor: '#3e3e3e',
-  listDividerBg: '#f4f4f4',
+  listDividerBg: '#222222',
   listBtnUnderlayColor: '#3a3a3a',
   listItemPadding: platform === PLATFORM.IOS ? 10 : 12,
   listNoteColor: '#acacac',

navigation/AppNavigator.js

@@ -9,11 +9,12 @@ import AboutDependenciesScreen from '../screens/About/AboutDependenciesScreen';
 import ProxiwashAboutScreen from '../screens/Proxiwash/ProxiwashAboutScreen';
 import ProximoAboutScreen from '../screens/Proximo/ProximoAboutScreen';
 import SelfMenuScreen from '../screens/SelfMenuScreen';
-import TutorInsaScreen from "../screens/TutorInsaScreen";
+import TutorInsaScreen from "../screens/Websites/TutorInsaScreen";
-import AmicaleScreen from "../screens/AmicaleScreen";
+import AmicaleScreen from "../screens/Websites/AmicaleScreen";
-import WiketudScreen from "../screens/WiketudScreen";
+import WiketudScreen from "../screens/Websites/WiketudScreen";
-import ElusEtudScreen from "../screens/ElusEtudScreen";
+import ElusEtudScreen from "../screens/Websites/ElusEtudScreen";
-import AvailableRoomScreen from "../screens/AvailableRoomScreen";
+import BlueMindScreen from "../screens/Websites/BlueMindScreen";
+import AvailableRoomScreen from "../screens/Websites/AvailableRoomScreen";
 import DebugScreen from '../screens/DebugScreen';
 import {fromRight} from "react-navigation-transitions";
 
@@ -35,6 +36,7 @@ function createAppContainerWithInitialRoute(initialRoute: string) {
                 AmicaleScreen: {screen: AmicaleScreen},
                 WiketudScreen: {screen: WiketudScreen},
                 ElusEtudScreen: {screen: ElusEtudScreen},
+                BlueMindScreen: {screen: BlueMindScreen},
                 AvailableRoomScreen: {screen: AvailableRoomScreen},
                 ProxiwashAboutScreen: {screen: ProxiwashAboutScreen},
                 ProximoAboutScreen: {screen: ProximoAboutScreen},

navigation/MainDrawerNavigator.js

@@ -7,7 +7,7 @@ import HomeScreen from '../screens/HomeScreen';
 import PlanningScreen from '../screens/PlanningScreen';
 import ProxiwashScreen from '../screens/Proxiwash/ProxiwashScreen';
 import ProximoMainScreen from '../screens/Proximo/ProximoMainScreen';
-import PlanexScreen from '../screens/PlanexScreen';
+import PlanexScreen from '../screens/Websites/PlanexScreen';
 import SettingsScreen from '../screens/SettingsScreen';
 import AboutScreen from '../screens/About/AboutScreen';
 import Sidebar from "../components/Sidebar";

navigation/MainTabNavigator.js

@@ -5,7 +5,7 @@ import HomeScreen from '../screens/HomeScreen';
 import PlanningScreen from '../screens/PlanningScreen';
 import ProxiwashScreen from '../screens/Proxiwash/ProxiwashScreen';
 import ProximoMainScreen from '../screens/Proximo/ProximoMainScreen';
-import PlanexScreen from '../screens/PlanexScreen';
+import PlanexScreen from '../screens/Websites/PlanexScreen';
 import CustomMaterialIcon from "../components/CustomMaterialIcon";
 import ThemeManager from "../utils/ThemeManager";
 import AsyncStorageManager from "../utils/AsyncStorageManager";

screens/About/AboutScreen.js

@@ -39,7 +39,7 @@ const links = {
         "Application Amicale INSA Toulouse" +
         "&body=" +
         "Coucou !\n\n",
-    yohanLinkedin: 'https://www.linkedin.com/in/yohan-simard', // TODO set real link
+    yohanLinkedin: 'https://www.linkedin.com/in/yohan-simard',
     react: 'https://facebook.github.io/react-native/',
 };
 

screens/Websites/AmicaleScreen.js

@@ -1,8 +1,8 @@
 // @flow
 
 import * as React from 'react';
-import ThemeManager from "../utils/ThemeManager";
+import ThemeManager from "../../utils/ThemeManager";
-import WebViewScreen from "../components/WebViewScreen";
+import WebViewScreen from "../../components/WebViewScreen";
 
 type Props = {
     navigation: Object,

screens/Websites/AvailableRoomScreen.js

@@ -1,7 +1,7 @@
 // @flow
 
 import * as React from 'react';
-import WebViewScreen from "../components/WebViewScreen";
+import WebViewScreen from "../../components/WebViewScreen";
 import i18n from "i18n-js";
 
 type Props = {

screens/Websites/BlueMindScreen.js

@@ -0,0 +1,53 @@
+// @flow
+
+import * as React from 'react';
+import ThemeManager from "../../utils/ThemeManager";
+import WebViewScreen from "../../components/WebViewScreen";
+import i18n from "i18n-js";
+
+type Props = {
+    navigation: Object,
+}
+
+
+const URL = 'https://etud-mel.insa-toulouse.fr/webmail/';
+
+const CUSTOM_CSS_GENERAL = '';
+
+
+/**
+ * Class defining the app's planex screen.
+ * This screen uses a webview to render the planex page
+ */
+export default class AmicaleScreen extends React.Component<Props> {
+
+    customInjectedJS: string;
+
+    constructor() {
+        super();
+        this.customInjectedJS =
+            '$(document).ready(function() {' +
+            '$("head").append(\'<meta name="viewport" content="width=device-width, initial-scale=1.0">\');' +
+            '$("head").append(\'<link rel="stylesheet" href="' + CUSTOM_CSS_GENERAL + '" type="text/css"/>\');true;';
+    }
+
+    render() {
+        const nav = this.props.navigation;
+        return (
+            <WebViewScreen
+                navigation={nav}
+                data={[
+                    {
+                        url: URL,
+                        icon: '',
+                        name: '',
+                        customJS: ''
+                    },
+                ]}
+                headerTitle={'Mails BlueMind'}
+                hasHeaderBackButton={true}
+                hasSideMenu={false}/>
+        );
+    }
+}
+

screens/Websites/ElusEtudScreen.js

@@ -1,8 +1,8 @@
 // @flow
 
 import * as React from 'react';
-import ThemeManager from "../utils/ThemeManager";
+import ThemeManager from "../../utils/ThemeManager";
-import WebViewScreen from "../components/WebViewScreen";
+import WebViewScreen from "../../components/WebViewScreen";
 
 type Props = {
     navigation: Object,

screens/Websites/PlanexScreen.js

@@ -1,8 +1,8 @@
 // @flow
 
 import * as React from 'react';
-import ThemeManager from "../utils/ThemeManager";
+import ThemeManager from "../../utils/ThemeManager";
-import WebViewScreen from "../components/WebViewScreen";
+import WebViewScreen from "../../components/WebViewScreen";
 import i18n from "i18n-js";
 
 type Props = {
@@ -73,7 +73,7 @@ export default class PlanexScreen extends React.Component<Props> {
         this.customInjectedJS =
             '$(document).ready(function() {' +
             OBSERVE_MUTATIONS_INJECTED +
-            '$("head").append(\'<meta name="viewport" content="width=device-width, initial-scale=1.0">\');' +
+            '$("head").append(\'<meta name="viewport" content="width=device-width, initial-scale=0.8">\');' +
             '$("head").append(\'<link rel="stylesheet" href="' + CUSTOM_CSS_GENERAL + '" type="text/css"/>\');';
 
         if (ThemeManager.getNightMode())

screens/Websites/TutorInsaScreen.js

@@ -1,8 +1,8 @@
 // @flow
 
 import * as React from 'react';
-import ThemeManager from "../utils/ThemeManager";
+import ThemeManager from "../../utils/ThemeManager";
-import WebViewScreen from "../components/WebViewScreen";
+import WebViewScreen from "../../components/WebViewScreen";
 
 type Props = {
     navigation: Object,

screens/Websites/WiketudScreen.js

@@ -1,8 +1,8 @@
 // @flow
 
 import * as React from 'react';
-import ThemeManager from "../utils/ThemeManager";
+import ThemeManager from "../../utils/ThemeManager";
-import WebViewScreen from "../components/WebViewScreen";
+import WebViewScreen from "../../components/WebViewScreen";
 
 type Props = {
     navigation: Object,

translations/en.json

@@ -10,6 +10,11 @@
     "about": "About",
     "debug": "Debug"
   },
+  "sidenav": {
+    "divider1": "Nice websites",
+    "divider2": "Useful services",
+    "divider3": "Personalisation"
+  },
   "intro": {
     "slide1": {
       "title": "Welcome to CAMPUS",

translations/fr.json

@@ -10,6 +10,11 @@
     "about": "À Propos",
     "debug": "Debug"
   },
+  "sidenav": {
+    "divider1": "Sites bien",
+    "divider2": "Services utiles",
+    "divider3": "Personnalisation"
+  },
   "intro": {
     "slide1": {
       "title": "Bienvenue sur CAMPUS",