forked from vergnet/application-amicale
Added self menu,added screen animations, improved themes
This commit is contained in:
parent
228a3dbabf
commit
7d7b17765d
12 changed files with 118 additions and 39 deletions
4
App.js
4
App.js
|
@ -51,8 +51,8 @@ export default class App extends React.Component<Props, State> {
|
||||||
this.setState({
|
this.setState({
|
||||||
isLoading: false,
|
isLoading: false,
|
||||||
currentTheme: ThemeManager.getCurrentTheme(),
|
currentTheme: ThemeManager.getCurrentTheme(),
|
||||||
// showIntro: AsyncStorageManager.getInstance().preferences.showIntro.current === '1'
|
showIntro: AsyncStorageManager.getInstance().preferences.showIntro.current === '1'
|
||||||
showIntro: true
|
// showIntro: true
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -12,6 +12,7 @@ const drawerCover = require("../assets/drawer-cover.png");
|
||||||
|
|
||||||
const WIKETUD_LINK = "https://www.etud.insa-toulouse.fr/wiketud";
|
const WIKETUD_LINK = "https://www.etud.insa-toulouse.fr/wiketud";
|
||||||
const Amicale_LINK = "https://www.etud.insa-toulouse.fr/~amicale";
|
const Amicale_LINK = "https://www.etud.insa-toulouse.fr/~amicale";
|
||||||
|
const RU_LINK = "http://m.insa-toulouse.fr/ru.html";
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
navigation: Object,
|
navigation: Object,
|
||||||
|
@ -54,16 +55,11 @@ export default class SideBar extends React.Component<Props, State> {
|
||||||
icon: "wikipedia",
|
icon: "wikipedia",
|
||||||
link: WIKETUD_LINK
|
link: WIKETUD_LINK
|
||||||
},
|
},
|
||||||
// {
|
{
|
||||||
// name: i18n.t('screens.settings'),
|
name: i18n.t('screens.menuSelf'),
|
||||||
// route: "Settings",
|
route: "SelfMenuScreen",
|
||||||
// icon: "settings",
|
icon: "silverware-fork-knife",
|
||||||
// },
|
},
|
||||||
// {
|
|
||||||
// name: i18n.t('screens.about'),
|
|
||||||
// route: "About",
|
|
||||||
// icon: "information",
|
|
||||||
// },
|
|
||||||
];
|
];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -73,7 +69,6 @@ export default class SideBar extends React.Component<Props, State> {
|
||||||
*/
|
*/
|
||||||
navigateToScreen(route: string) {
|
navigateToScreen(route: string) {
|
||||||
this.props.navigation.navigate(route);
|
this.props.navigation.navigate(route);
|
||||||
this.props.navigation.closeDrawer();
|
|
||||||
};
|
};
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
|
|
|
@ -115,7 +115,7 @@ export default {
|
||||||
brandLight: "#f4f4f4",
|
brandLight: "#f4f4f4",
|
||||||
|
|
||||||
//Container
|
//Container
|
||||||
containerBgColor: "#333333",
|
containerBgColor: "#222222",
|
||||||
|
|
||||||
//Date Picker
|
//Date Picker
|
||||||
datePickerTextColor: "#fff",
|
datePickerTextColor: "#fff",
|
||||||
|
@ -150,7 +150,7 @@ export default {
|
||||||
|
|
||||||
// Header
|
// Header
|
||||||
toolbarBtnColor: platform === "ios" ? "#be1522" : "#fff",
|
toolbarBtnColor: platform === "ios" ? "#be1522" : "#fff",
|
||||||
toolbarDefaultBg: platform === "ios" ? "#F8F8F8" : "#be1522",
|
toolbarDefaultBg: platform === "ios" ? "#333333" : "#be1522",
|
||||||
toolbarHeight: platform === "ios" ? 64 : 56,
|
toolbarHeight: platform === "ios" ? 64 : 56,
|
||||||
toolbarSearchIconSize: platform === "ios" ? 20 : 23,
|
toolbarSearchIconSize: platform === "ios" ? 20 : 23,
|
||||||
toolbarInputColor: platform === "ios" ? "#CECDD2" : "#fff",
|
toolbarInputColor: platform === "ios" ? "#CECDD2" : "#fff",
|
||||||
|
@ -241,7 +241,7 @@ export default {
|
||||||
tabFontSize: 15,
|
tabFontSize: 15,
|
||||||
|
|
||||||
// Text
|
// Text
|
||||||
textColor: "#d6d6d6",
|
textColor: "#ebebeb",
|
||||||
inverseTextColor: "#000",
|
inverseTextColor: "#000",
|
||||||
noteFontSize: 14,
|
noteFontSize: 14,
|
||||||
get defaultTextColor() {
|
get defaultTextColor() {
|
||||||
|
@ -253,7 +253,7 @@ export default {
|
||||||
titleFontSize: platform === "ios" ? 17 : 19,
|
titleFontSize: platform === "ios" ? 17 : 19,
|
||||||
subTitleFontSize: platform === "ios" ? 11 : 14,
|
subTitleFontSize: platform === "ios" ? 11 : 14,
|
||||||
subtitleColor: platform === "ios" ? "#8e8e93" : "#FFF",
|
subtitleColor: platform === "ios" ? "#8e8e93" : "#FFF",
|
||||||
titleFontColor: platform === "ios" ? "#000" : "#FFF",
|
titleFontColor: platform === "ios" ? "#FFF" : "#FFF",
|
||||||
|
|
||||||
|
|
||||||
// CUSTOM
|
// CUSTOM
|
||||||
|
|
|
@ -6,6 +6,8 @@ import SettingsScreen from '../screens/SettingsScreen';
|
||||||
import AboutScreen from '../screens/About/AboutScreen';
|
import AboutScreen from '../screens/About/AboutScreen';
|
||||||
import ProximoListScreen from '../screens/Proximo/ProximoListScreen';
|
import ProximoListScreen from '../screens/Proximo/ProximoListScreen';
|
||||||
import AboutDependenciesScreen from '../screens/About/AboutDependenciesScreen';
|
import AboutDependenciesScreen from '../screens/About/AboutDependenciesScreen';
|
||||||
|
import SelfMenuScreen from '../screens/SelfMenuScreen';
|
||||||
|
import {fromRight} from "react-navigation-transitions";
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Create a stack navigator using the drawer to handle navigation between screens
|
* Create a stack navigator using the drawer to handle navigation between screens
|
||||||
|
@ -18,10 +20,12 @@ export default createAppContainer(
|
||||||
SettingsScreen: {screen: SettingsScreen},
|
SettingsScreen: {screen: SettingsScreen},
|
||||||
AboutScreen: {screen: AboutScreen},
|
AboutScreen: {screen: AboutScreen},
|
||||||
AboutDependenciesScreen: {screen: AboutDependenciesScreen},
|
AboutDependenciesScreen: {screen: AboutDependenciesScreen},
|
||||||
|
SelfMenuScreen: {screen: SelfMenuScreen},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
initialRouteName: "Main",
|
initialRouteName: "Main",
|
||||||
mode: 'card',
|
mode: 'card',
|
||||||
headerMode: "none"
|
headerMode: "none",
|
||||||
|
transitionConfig: () => fromRight(),
|
||||||
})
|
})
|
||||||
);
|
);
|
||||||
|
|
5
package-lock.json
generated
5
package-lock.json
generated
|
@ -6372,6 +6372,11 @@
|
||||||
"react-native-tab-view": "^1.4.1"
|
"react-native-tab-view": "^1.4.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"react-navigation-transitions": {
|
||||||
|
"version": "1.0.12",
|
||||||
|
"resolved": "https://registry.npmjs.org/react-navigation-transitions/-/react-navigation-transitions-1.0.12.tgz",
|
||||||
|
"integrity": "sha512-Hp0wX9KoXwsFch6Fgiz9HpGjQZDhnyucLbCai0LcaOC3VpmgYmvkbeAg/mQ5Z5exuY6PPrh/+FXU00yMPDHkcw=="
|
||||||
|
},
|
||||||
"react-proxy": {
|
"react-proxy": {
|
||||||
"version": "1.1.8",
|
"version": "1.1.8",
|
||||||
"resolved": "https://registry.npmjs.org/react-proxy/-/react-proxy-1.1.8.tgz",
|
"resolved": "https://registry.npmjs.org/react-proxy/-/react-proxy-1.1.8.tgz",
|
||||||
|
|
|
@ -29,7 +29,8 @@
|
||||||
"react-native-status-bar-height": "^2.3.1",
|
"react-native-status-bar-height": "^2.3.1",
|
||||||
"react-native-webview": "^5.8.1",
|
"react-native-webview": "^5.8.1",
|
||||||
"react-navigation": "^3.11.0",
|
"react-navigation": "^3.11.0",
|
||||||
"react-navigation-material-bottom-tabs": "^1.0.0"
|
"react-navigation-material-bottom-tabs": "^1.0.0",
|
||||||
|
"react-navigation-transitions": "^1.0.12"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"babel-preset-expo": "^5.1.1",
|
"babel-preset-expo": "^5.1.1",
|
||||||
|
|
|
@ -76,7 +76,7 @@ export default class HomeScreen extends FetchedDataSectionList {
|
||||||
}}>
|
}}>
|
||||||
<CardItem>
|
<CardItem>
|
||||||
<Left>
|
<Left>
|
||||||
<Thumbnail source={ICON_AMICALE}/>
|
<Thumbnail source={ICON_AMICALE} square/>
|
||||||
<Body>
|
<Body>
|
||||||
<Text>{NAME_AMICALE}</Text>
|
<Text>{NAME_AMICALE}</Text>
|
||||||
<Text note>{HomeScreen.getFormattedDate(item.created_time)}</Text>
|
<Text note>{HomeScreen.getFormattedDate(item.created_time)}</Text>
|
||||||
|
|
|
@ -13,23 +13,14 @@ type Props = {
|
||||||
navigation: Object,
|
navigation: Object,
|
||||||
}
|
}
|
||||||
|
|
||||||
type State = {
|
|
||||||
isFinishedLoading: boolean
|
|
||||||
}
|
|
||||||
|
|
||||||
// const PLANEX_URL = 'http://planex.insa-toulouse.fr/';
|
const PLANEX_URL = 'http://planex.insa-toulouse.fr/';
|
||||||
// TODO use real url in prod
|
|
||||||
const PLANEX_URL = 'https://srv-falcon.etud.insa-toulouse.fr/~vergnet/planex/planex.insa-toulouse.fr.html';
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Class defining the app's planex screen.
|
* Class defining the app's planex screen.
|
||||||
* This screen uses a webview to render the planex page
|
* This screen uses a webview to render the planex page
|
||||||
*/
|
*/
|
||||||
export default class PlanningScreen extends React.Component<Props, State> {
|
export default class PlanningScreen extends React.Component<Props> {
|
||||||
|
|
||||||
state = {
|
|
||||||
isFinishedLoading: false,
|
|
||||||
};
|
|
||||||
|
|
||||||
webview: WebView;
|
webview: WebView;
|
||||||
|
|
||||||
|
@ -46,7 +37,6 @@ export default class PlanningScreen extends React.Component<Props, State> {
|
||||||
};
|
};
|
||||||
|
|
||||||
refreshWebview() {
|
refreshWebview() {
|
||||||
this.setState({isFinishedLoading: false});
|
|
||||||
this.webview.reload();
|
this.webview.reload();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -65,6 +55,9 @@ export default class PlanningScreen extends React.Component<Props, State> {
|
||||||
renderLoading={() =>
|
renderLoading={() =>
|
||||||
<View style={{
|
<View style={{
|
||||||
backgroundColor: ThemeManager.getCurrentThemeVariables().containerBgColor,
|
backgroundColor: ThemeManager.getCurrentThemeVariables().containerBgColor,
|
||||||
|
position: 'absolute',
|
||||||
|
top: 0,
|
||||||
|
right: 0,
|
||||||
width: '100%',
|
width: '100%',
|
||||||
height: '100%',
|
height: '100%',
|
||||||
flex: 1,
|
flex: 1,
|
||||||
|
|
|
@ -267,13 +267,6 @@ export default class ProxiwashScreen extends FetchedDataSectionList {
|
||||||
|
|
||||||
createDataset(fetchedData: Object) {
|
createDataset(fetchedData: Object) {
|
||||||
return [
|
return [
|
||||||
{
|
|
||||||
title: i18n.t('proxiwashScreen.dryers'),
|
|
||||||
icon: 'tumble-dryer',
|
|
||||||
data: fetchedData.dryers === undefined ? [] : fetchedData.dryers,
|
|
||||||
extraData: super.state,
|
|
||||||
keyExtractor: this.getDryersKeyExtractor
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
title: i18n.t('proxiwashScreen.washers'),
|
title: i18n.t('proxiwashScreen.washers'),
|
||||||
icon: 'washing-machine',
|
icon: 'washing-machine',
|
||||||
|
@ -281,6 +274,14 @@ export default class ProxiwashScreen extends FetchedDataSectionList {
|
||||||
extraData: super.state,
|
extraData: super.state,
|
||||||
keyExtractor: this.getWashersKeyExtractor
|
keyExtractor: this.getWashersKeyExtractor
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: i18n.t('proxiwashScreen.dryers'),
|
||||||
|
icon: 'tumble-dryer',
|
||||||
|
data: fetchedData.dryers === undefined ? [] : fetchedData.dryers,
|
||||||
|
extraData: super.state,
|
||||||
|
keyExtractor: this.getDryersKeyExtractor
|
||||||
|
},
|
||||||
|
|
||||||
];
|
];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
78
screens/SelfMenuScreen.js
Normal file
78
screens/SelfMenuScreen.js
Normal file
|
@ -0,0 +1,78 @@
|
||||||
|
// @flow
|
||||||
|
|
||||||
|
import * as React from 'react';
|
||||||
|
import {Platform, View} from 'react-native';
|
||||||
|
import {Container, Spinner} from 'native-base';
|
||||||
|
import WebView from "react-native-webview";
|
||||||
|
import Touchable from "react-native-platform-touchable";
|
||||||
|
import CustomMaterialIcon from "../components/CustomMaterialIcon";
|
||||||
|
import ThemeManager from "../utils/ThemeManager";
|
||||||
|
import CustomHeader from "../components/CustomHeader";
|
||||||
|
import i18n from "i18n-js";
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
navigation: Object,
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
const RU_URL = 'http://m.insa-toulouse.fr/ru.html';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Class defining the app's planex screen.
|
||||||
|
* This screen uses a webview to render the planex page
|
||||||
|
*/
|
||||||
|
export default class SelfMenuScreen extends React.Component<Props> {
|
||||||
|
|
||||||
|
webview: WebView;
|
||||||
|
|
||||||
|
getRefreshButton() {
|
||||||
|
return (
|
||||||
|
<Touchable
|
||||||
|
style={{padding: 6}}
|
||||||
|
onPress={() => this.refreshWebview()}>
|
||||||
|
<CustomMaterialIcon
|
||||||
|
color={Platform.OS === 'ios' ? ThemeManager.getCurrentThemeVariables().brandPrimary : "#fff"}
|
||||||
|
icon="refresh"/>
|
||||||
|
</Touchable>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
refreshWebview() {
|
||||||
|
this.webview.reload();
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const nav = this.props.navigation;
|
||||||
|
return (
|
||||||
|
<Container>
|
||||||
|
<CustomHeader navigation={nav} title={i18n.t('screens.menuSelf')} hasBackButton={true}
|
||||||
|
rightButton={this.getRefreshButton()}/>
|
||||||
|
<WebView
|
||||||
|
ref={ref => (this.webview = ref)}
|
||||||
|
source={{uri: RU_URL}}
|
||||||
|
style={{
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
}}
|
||||||
|
startInLoadingState={true}
|
||||||
|
renderLoading={() =>
|
||||||
|
<View style={{
|
||||||
|
backgroundColor: ThemeManager.getCurrentThemeVariables().containerBgColor,
|
||||||
|
position: 'absolute',
|
||||||
|
top: 0,
|
||||||
|
right: 0,
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
flex: 1,
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center'
|
||||||
|
}}>
|
||||||
|
<Spinner/>
|
||||||
|
</View>
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
</Container>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -4,6 +4,7 @@
|
||||||
"planning": "Planning",
|
"planning": "Planning",
|
||||||
"proxiwash": "Proxiwash",
|
"proxiwash": "Proxiwash",
|
||||||
"proximo": "Proximo",
|
"proximo": "Proximo",
|
||||||
|
"menuSelf": "UR Menu",
|
||||||
"settings": "Settings",
|
"settings": "Settings",
|
||||||
"about": "About"
|
"about": "About"
|
||||||
},
|
},
|
||||||
|
|
|
@ -4,6 +4,7 @@
|
||||||
"planning": "Planning",
|
"planning": "Planning",
|
||||||
"proxiwash": "Proxiwash",
|
"proxiwash": "Proxiwash",
|
||||||
"proximo": "Proximo",
|
"proximo": "Proximo",
|
||||||
|
"menuSelf": "Menu Ru",
|
||||||
"settings": "Paramètres",
|
"settings": "Paramètres",
|
||||||
"about": "À Propos"
|
"about": "À Propos"
|
||||||
},
|
},
|
||||||
|
|
Loading…
Reference in a new issue