Added intro slide on update, changed planning event display on click

This commit is contained in:
keplyx 2019-09-16 00:10:14 +02:00
parent 74a587cac7
commit 517fea788d
6 changed files with 53 additions and 14 deletions

17
App.js
View file

@ -20,6 +20,7 @@ type Props = {};
type State = {
isLoading: boolean,
showIntro: boolean,
showUpdate: boolean,
currentTheme: ?Object,
};
@ -28,6 +29,7 @@ export default class App extends React.Component<Props, State> {
state = {
isLoading: true,
showIntro: true,
showUpdate: true,
currentTheme: null,
};
@ -47,11 +49,15 @@ export default class App extends React.Component<Props, State> {
}
/**
* Callback when user ends the intro. Save in preferences to avaoid showing back the slides
* Callback when user ends the intro. Save in preferences to avaoid showing back the introSlides
*/
onIntroDone() {
this.setState({showIntro: false});
this.setState({
showIntro: false,
showUpdate: false,
});
AsyncStorageManager.getInstance().savePref(AsyncStorageManager.getInstance().preferences.showIntro.key, '0');
AsyncStorageManager.getInstance().savePref(AsyncStorageManager.getInstance().preferences.showUpdate1.key, '0');
}
async loadAssetsAsync() {
@ -73,7 +79,8 @@ export default class App extends React.Component<Props, State> {
this.setState({
isLoading: false,
currentTheme: ThemeManager.getCurrentTheme(),
showIntro: AsyncStorageManager.getInstance().preferences.showIntro.current === '1'
showIntro: AsyncStorageManager.getInstance().preferences.showIntro.current === '1',
showUpdate: AsyncStorageManager.getInstance().preferences.showUpdate1.current === '1'
// showIntro: true
});
}
@ -91,8 +98,8 @@ export default class App extends React.Component<Props, State> {
/>
);
}
if (this.state.showIntro) {
return <CustomIntroSlider onDone={() => this.onIntroDone()}/>;
if (this.state.showIntro || this.state.showUpdate) {
return <CustomIntroSlider onDone={() => this.onIntroDone()} isUpdate={this.state.showUpdate && !this.state.showIntro}/>;
} else {
const AppNavigator = createAppContainerWithInitialRoute(AsyncStorageManager.getInstance().preferences.defaultStartScreen.current);
return (

View file

@ -39,15 +39,17 @@ const styles = StyleSheet.create({
type Props = {
onDone: Function,
isUpdate: boolean
};
export default class CustomIntroSlider extends React.Component<Props> {
slides: Array<Object>;
introSlides: Array<Object>;
updateSlides: Array<Object>;
constructor() {
super();
this.slides = [
this.introSlides = [
{
key: '1',
title: i18n.t('intro.slide1.title'),
@ -91,11 +93,20 @@ export default class CustomIntroSlider extends React.Component<Props> {
colors: ['#37c13e', '#26852b'],
},
];
this.updateSlides = [
{
key: '1',
title: i18n.t('intro.updateSlide.title'),
text: i18n.t('intro.updateSlide.text'),
icon: 'calendar-range',
colors: ['#e01928', '#be1522'],
},
]
}
/**
* Render item to be used for the intro slides
* Render item to be used for the intro introSlides
* @param item
* @param dimensions
*/
@ -125,7 +136,7 @@ export default class CustomIntroSlider extends React.Component<Props> {
render() {
return (
<AppIntroSlider renderItem={({item, dimensions}) => CustomIntroSlider.getIntroRenderItem(item, dimensions)}
slides={this.slides} onDone={() => this.props.onDone()} bottomButton showSkipButton/>
slides={this.props.isUpdate ? this.updateSlides : this.introSlides} onDone={() => this.props.onDone()} bottomButton showSkipButton/>
);
}

View file

@ -60,7 +60,7 @@ export default class PlanningScreen extends React.Component<Props, State> {
state = {
modalCurrentDisplayItem: {},
refreshing: false,
agendaItems: {}
agendaItems: {},
};
getCurrentDate() {
@ -124,7 +124,7 @@ export default class PlanningScreen extends React.Component<Props, State> {
showItemDetails(item: Object) {
this.setState({
modalCurrentDisplayItem: item
modalCurrentDisplayItem: item,
});
if (this.modalRef.current) {
this.modalRef.current.open();
@ -292,6 +292,12 @@ export default class PlanningScreen extends React.Component<Props, State> {
return array[0] + ':' + array[1];
}
onModalClosed() {
this.setState({
modalCurrentDisplayItem: {},
});
}
render() {
const nav = this.props.navigation;
return (
@ -299,7 +305,9 @@ export default class PlanningScreen extends React.Component<Props, State> {
<Modalize ref={this.modalRef}
modalStyle={{
backgroundColor: ThemeManager.getCurrentThemeVariables().containerBgColor,
}}>
}}
adjustToContentHeight
onClosed={() => this.onModalClosed()}>
{this.getModalContent()}
</Modalize>
<Agenda
@ -310,7 +318,7 @@ export default class PlanningScreen extends React.Component<Props, State> {
// initially selected day
selected={this.getCurrentDate()}
// Minimum date that can be selected, dates before minDate will be grayed out. Default = undefined
minDate={"2019-09-01"}
minDate={this.getCurrentDate()}
// Max amount of months allowed to scroll to the past. Default = 50
pastScrollRange={1}
// Max amount of months allowed to scroll to the future. Default = 50

View file

@ -33,6 +33,10 @@
"slide6": {
"title": "More to come...",
"text": "New features are coming soon, do not hesitate to give us feedback to improve the app"
},
"updateSlide": {
"title": "New in this update!",
"text": "Discover every event occurring on the campus in the new Planning screen!"
}
},
"settingsScreen": {

View file

@ -33,6 +33,10 @@
"slide6": {
"title": "Plus à venir...",
"text": "D'autres fonctionnalités arrivent bientôt, n'hésitez pas à nous donner votre avis pour améliorer l'appli"
},
"updateSlide": {
"title": "Nouveau dans cette mise à jour !",
"text": "Découvre tous les événements du campus dans la nouvelle section Planning !"
}
},
"settingsScreen": {

View file

@ -29,6 +29,11 @@ export default class AsyncStorageManager {
default: '1',
current: '',
},
showUpdate1: {
key: 'showUpdate1',
default: '1',
current: '',
},
proxiwashNotifications: {
key: 'proxiwashNotifications',
default: '5',