123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199 |
- // @flow
-
- import * as React from 'react';
- import {Dimensions, FlatList, Image, Platform, StyleSheet, View} from 'react-native';
- import i18n from "i18n-js";
- import * as WebBrowser from 'expo-web-browser';
- import SidebarDivider from "./SidebarDivider";
- import SidebarItem from "./SidebarItem";
- import {TouchableRipple} from "react-native-paper";
-
- const deviceWidth = Dimensions.get("window").width;
-
- type Props = {
- navigation: Object,
- state: Object,
- };
-
- type State = {
- active: string,
- };
-
- /**
- * Class used to define a navigation drawer
- */
- export default class SideBar extends React.PureComponent<Props, State> {
-
- dataSet: Array<Object>;
-
- state = {
- active: 'Home',
- };
-
- getRenderItem: Function;
-
- /**
- * Generate the datasets
- *
- * @param props
- */
- constructor(props: Props) {
- super(props);
- // Dataset used to render the drawer
- this.dataSet = [
- {
- name: i18n.t('screens.home'),
- route: "Main",
- icon: "home",
- },
- {
- name: i18n.t('sidenav.divider2'),
- route: "Divider2"
- },
- {
- name: i18n.t('screens.menuSelf'),
- route: "SelfMenuScreen",
- icon: "silverware-fork-knife",
- },
- {
- name: i18n.t('screens.availableRooms'),
- route: "AvailableRoomScreen",
- icon: "calendar-check",
- },
- {
- name: i18n.t('screens.bib'),
- route: "BibScreen",
- icon: "book",
- },
- {
- name: i18n.t('screens.bluemind'),
- route: "BlueMindScreen",
- link: "https://etud-mel.insa-toulouse.fr/webmail/",
- icon: "email",
- },
- {
- name: i18n.t('screens.ent'),
- route: "EntScreen",
- link: "https://ent.insa-toulouse.fr/",
- icon: "notebook",
- },
- {
- name: i18n.t('sidenav.divider1'),
- route: "Divider1"
- },
- {
- name: "Amicale",
- route: "AmicaleScreen",
- link: "https://amicale-insat.fr/",
- icon: "alpha-a-box",
- },
- {
- name: "Élus Étudiants",
- route: "ElusEtudScreen",
- link: "https://etud.insa-toulouse.fr/~eeinsat/",
- icon: "alpha-e-box",
- },
- {
- name: "Wiketud",
- route: "WiketudScreen",
- link: "https://wiki.etud.insa-toulouse.fr",
- icon: "wikipedia",
- },
- {
- name: "Tutor'INSA",
- route: "TutorInsaScreen",
- link: "https://www.etud.insa-toulouse.fr/~tutorinsa/",
- icon: "school",
- },
- {
- name: i18n.t('sidenav.divider3'),
- route: "Divider3"
- },
- {
- name: i18n.t('screens.settings'),
- route: "SettingsScreen",
- icon: "settings",
- },
- {
- name: i18n.t('screens.about'),
- route: "AboutScreen",
- icon: "information",
- },
- ];
- this.getRenderItem = this.getRenderItem.bind(this);
- }
-
- onListItemPress(item: Object) {
- if (item.link === undefined)
- this.props.navigation.navigate(item.route);
- else
- WebBrowser.openBrowserAsync(item.link);
- }
-
-
- listKeyExtractor(item: Object) {
- return item.route;
- }
-
-
- getRenderItem({item}: Object) {
- const onListItemPress = this.onListItemPress.bind(this, item);
- if (item.icon !== undefined) {
- return (
- <SidebarItem
- title={item.name}
- icon={item.icon}
- onPress={onListItemPress}
- />
- );
- } else {
- return (
- <SidebarDivider title={item.name}/>
- );
- }
-
- }
-
- render() {
- const onPress = this.onListItemPress.bind(this, {route: 'TetrisScreen'});
- return (
- <View style={{height: '100%'}}>
- <TouchableRipple
- onPress={onPress}
- >
- <Image
- source={require("../assets/drawer-cover.png")}
- style={styles.drawerCover}
- />
- </TouchableRipple>
- <FlatList
- data={this.dataSet}
- extraData={this.state}
- keyExtractor={this.listKeyExtractor}
- renderItem={this.getRenderItem}
- />
- </View>
- );
- }
- }
-
- const styles = StyleSheet.create({
- drawerCover: {
- height: deviceWidth / 3,
- width: 2 * deviceWidth / 3,
- position: "relative",
- marginBottom: 10,
- marginTop: 20
- },
- text: {
- fontWeight: Platform.OS === "ios" ? "500" : "400",
- fontSize: 16,
- marginLeft: 20
- },
- badgeText: {
- fontSize: Platform.OS === "ios" ? 13 : 11,
- fontWeight: "400",
- textAlign: "center",
- marginTop: Platform.OS === "android" ? -3 : undefined
- }
- });
|