forked from vergnet/application-amicale
Added mascot to vote screen
This commit is contained in:
parent
57c3e7d9d7
commit
9a379ffb3d
6 changed files with 129 additions and 87 deletions
|
@ -230,6 +230,7 @@
|
|||
},
|
||||
"vote": {
|
||||
"title": "Elections",
|
||||
"noVote": "No vote available",
|
||||
"select": {
|
||||
"title": "Elections open",
|
||||
"subtitle": "Vote now!",
|
||||
|
@ -258,11 +259,10 @@
|
|||
"totalVotes": "Total votes:",
|
||||
"votes": "votes"
|
||||
},
|
||||
"main": {
|
||||
"title": "The Elections",
|
||||
"subtitle": "Why your vote is important",
|
||||
"paragraph1": "The Amicale's elections is the right moment for you to choose the next team, which will handle different projects on the campus, help organizing your favorite events, animate the campus life during the whole year, and relay your ideas to the administration, so that your campus life is the most enjoyable possible!\nYour turn to make a change!\uD83D\uDE09",
|
||||
"paragraph2": "Note: If there is only one list, it is still important to vote to show your support, so that the administration knows the current list is supported by students. It is always a plus when taking difficult decisions! \uD83D\uDE09"
|
||||
"mascotDialog": {
|
||||
"title": "Why vote?",
|
||||
"message": "The Amicale's elections is the right moment for you to choose the next team, which will handle different projects on the campus, help organizing your favorite events, animate the campus life during the whole year, and relay your ideas to the administration, so that your campus life is the most enjoyable possible!\nYour turn to make a change!\uD83D\uDE09\n\nNote: If there is only one list, it is still important to vote to show your support, so that the administration knows the current list is supported by students. It is always a plus when taking difficult decisions! \uD83D\uDE09",
|
||||
"button": "Ok"
|
||||
}
|
||||
},
|
||||
"equipment": {
|
||||
|
|
|
@ -229,6 +229,7 @@
|
|||
},
|
||||
"vote": {
|
||||
"title": "Élections",
|
||||
"noVote": "Pas de vote en cours",
|
||||
"select": {
|
||||
"title": "Élections ouvertes",
|
||||
"subtitle": "Vote maintenant !",
|
||||
|
@ -257,11 +258,10 @@
|
|||
"totalVotes": "Nombre total de votes :",
|
||||
"votes": "votes"
|
||||
},
|
||||
"main": {
|
||||
"title": "Les Élections",
|
||||
"subtitle": "Pourquoi ton vote est important",
|
||||
"paragraph1": "Les élections de l'amicale, c'est le moment pour toi de choisir la prochaine équipe qui portera les différents projets du campus, qui soutiendra les organisations de tes événements favoris, qui te proposera des animations tout au long de l'année, et qui poussera tes idées à l’administration pour que la vie de campus soit des plus riches !\nAlors à toi de jouer ! \uD83D\uDE09",
|
||||
"paragraph2": "NB : Si par cas il n'y a qu'une liste qui se présente, il est important que tout le monde vote, afin qui la liste puisse montrer à l’administration que les INSAiens la soutiennent ! Ça compte toujours pour les décisions difficiles ! \uD83D\uDE09"
|
||||
"mascotDialog": {
|
||||
"title": "Pourquoi voter ?",
|
||||
"message": "Les élections de l'amicale, c'est le moment pour toi de choisir la prochaine équipe qui portera les différents projets du campus, qui soutiendra les organisations de tes événements favoris, qui te proposera des animations tout au long de l'année, et qui poussera tes idées à l’administration pour que la vie de campus soit des plus riches !\nAlors à toi de jouer ! \uD83D\uDE09\n\nNB : Si par cas il n'y a qu'une liste qui se présente, il est important que tout le monde vote, afin qui la liste puisse montrer à l’administration que les INSAiens la soutiennent ! Ça compte toujours pour les décisions difficiles ! \uD83D\uDE09",
|
||||
"button": "Oké"
|
||||
}
|
||||
},
|
||||
"equipment": {
|
||||
|
|
37
src/components/Amicale/Vote/VoteNotAvailable.js
Normal file
37
src/components/Amicale/Vote/VoteNotAvailable.js
Normal file
|
@ -0,0 +1,37 @@
|
|||
// @flow
|
||||
|
||||
import * as React from 'react';
|
||||
import {View} from 'react-native';
|
||||
import {Headline, withTheme} from "react-native-paper";
|
||||
import i18n from 'i18n-js';
|
||||
import type {CustomTheme} from "../../../managers/ThemeManager";
|
||||
|
||||
type Props = {
|
||||
theme: CustomTheme
|
||||
}
|
||||
|
||||
class VoteNotAvailable extends React.Component<Props> {
|
||||
|
||||
shouldComponentUpdate() {
|
||||
return false;
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<View style={{
|
||||
width: "100%",
|
||||
marginTop: 10,
|
||||
marginBottom: 10,
|
||||
}}>
|
||||
<Headline
|
||||
style={{
|
||||
color: this.props.theme.colors.textDisabled,
|
||||
textAlign: "center",
|
||||
}}
|
||||
>{i18n.t("screens.vote.noVote")}</Headline>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default withTheme(VoteNotAvailable);
|
|
@ -1,48 +0,0 @@
|
|||
// @flow
|
||||
|
||||
import * as React from 'react';
|
||||
import {Card, Paragraph} from "react-native-paper";
|
||||
import {Image, StyleSheet} from "react-native";
|
||||
import i18n from 'i18n-js';
|
||||
|
||||
const ICON_AMICALE = require('../../../../assets/amicale.png');
|
||||
|
||||
export default class VoteTitle extends React.Component<{}> {
|
||||
|
||||
shouldComponentUpdate() {
|
||||
return false;
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Card style={styles.card}>
|
||||
<Card.Title
|
||||
title={i18n.t('screens.vote.main.title')}
|
||||
subtitle={i18n.t('screens.vote.main.subtitle')}
|
||||
left={(props) => <Image
|
||||
{...props}
|
||||
style={{
|
||||
width: props.size,
|
||||
height: props.size,
|
||||
}}
|
||||
source={ICON_AMICALE}
|
||||
/>}
|
||||
/>
|
||||
<Card.Content>
|
||||
<Paragraph>
|
||||
{i18n.t('screens.vote.main.paragraph1')}
|
||||
</Paragraph>
|
||||
<Paragraph>
|
||||
{i18n.t('screens.vote.main.paragraph2')}
|
||||
</Paragraph>
|
||||
</Card.Content>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
card: {
|
||||
margin: 10,
|
||||
},
|
||||
});
|
|
@ -89,6 +89,11 @@ export default class AsyncStorageManager {
|
|||
default: '1',
|
||||
current: '',
|
||||
},
|
||||
voteShowBanner: {
|
||||
key: 'voteShowBanner',
|
||||
default: '1',
|
||||
current: '',
|
||||
},
|
||||
proxiwashWatchedMachines: {
|
||||
key: 'proxiwashWatchedMachines',
|
||||
default: '[]',
|
||||
|
|
|
@ -4,12 +4,17 @@ import * as React from 'react';
|
|||
import {FlatList, RefreshControl, View} from "react-native";
|
||||
import AuthenticatedScreen from "../../components/Amicale/AuthenticatedScreen";
|
||||
import {getTimeOnlyString, stringToDate} from "../../utils/Planning";
|
||||
import VoteTitle from "../../components/Amicale/Vote/VoteTitle";
|
||||
import VoteTease from "../../components/Amicale/Vote/VoteTease";
|
||||
import VoteSelect from "../../components/Amicale/Vote/VoteSelect";
|
||||
import VoteResults from "../../components/Amicale/Vote/VoteResults";
|
||||
import VoteWait from "../../components/Amicale/Vote/VoteWait";
|
||||
import {StackNavigationProp} from "@react-navigation/stack";
|
||||
import i18n from "i18n-js";
|
||||
import {MASCOT_STYLE} from "../../components/Mascot/Mascot";
|
||||
import MascotPopup from "../../components/Mascot/MascotPopup";
|
||||
import AsyncStorageManager from "../../managers/AsyncStorageManager";
|
||||
import {Button} from "react-native-paper";
|
||||
import VoteNotAvailable from "../../components/Amicale/Vote/VoteNotAvailable";
|
||||
|
||||
export type team = {
|
||||
id: number,
|
||||
|
@ -37,10 +42,10 @@ type objectVoteDates = {
|
|||
}
|
||||
|
||||
// const FAKE_DATE = {
|
||||
// "date_begin": "2020-04-19 15:50",
|
||||
// "date_end": "2020-04-19 15:50",
|
||||
// "date_result_begin": "2020-04-19 19:50",
|
||||
// "date_result_end": "2020-04-19 22:50",
|
||||
// "date_begin": "2020-08-19 15:50",
|
||||
// "date_end": "2020-08-19 15:50",
|
||||
// "date_result_begin": "2020-08-19 19:50",
|
||||
// "date_result_end": "2020-08-19 22:50",
|
||||
// };
|
||||
//
|
||||
// const FAKE_DATE2 = {
|
||||
|
@ -92,6 +97,7 @@ type Props = {
|
|||
|
||||
type State = {
|
||||
hasVoted: boolean,
|
||||
mascotDialogVisible: boolean,
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -101,6 +107,7 @@ export default class VoteScreen extends React.Component<Props, State> {
|
|||
|
||||
state = {
|
||||
hasVoted: false,
|
||||
mascotDialogVisible: AsyncStorageManager.getInstance().preferences.voteShowBanner.current === "1",
|
||||
};
|
||||
|
||||
teams: Array<team>;
|
||||
|
@ -200,11 +207,23 @@ export default class VoteScreen extends React.Component<Props, State> {
|
|||
|
||||
mainRenderItem = ({item}: { item: { key: string } }) => {
|
||||
if (item.key === 'info')
|
||||
return <VoteTitle/>;
|
||||
else if (item.key === 'main' && this.dates != null)
|
||||
return this.getContent();
|
||||
return (
|
||||
<View>
|
||||
<Button
|
||||
mode={"contained"}
|
||||
icon={"help-circle"}
|
||||
onPress={this.showMascotDialog}
|
||||
style={{
|
||||
marginLeft: "auto",
|
||||
marginRight: "auto",
|
||||
marginTop: 20
|
||||
}}>
|
||||
{i18n.t("screens.vote.mascotDialog.title")}
|
||||
</Button>
|
||||
</View>
|
||||
);
|
||||
else
|
||||
return null;
|
||||
return this.getContent();
|
||||
};
|
||||
|
||||
getScreen = (data: Array<{ [key: string]: any } | null>) => {
|
||||
|
@ -254,7 +273,7 @@ export default class VoteScreen extends React.Component<Props, State> {
|
|||
else if (this.isResultRunning())
|
||||
return this.getVoteResultCard();
|
||||
else
|
||||
return null;
|
||||
return <VoteNotAvailable/>;
|
||||
}
|
||||
|
||||
onVoteSuccess = () => this.setState({hasVoted: true});
|
||||
|
@ -278,7 +297,7 @@ export default class VoteScreen extends React.Component<Props, State> {
|
|||
this.datesString.date_result_end)}
|
||||
/>;
|
||||
else
|
||||
return null;
|
||||
return <VoteNotAvailable/>;
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -289,7 +308,7 @@ export default class VoteScreen extends React.Component<Props, State> {
|
|||
return <VoteTease
|
||||
startDate={this.getDateString(this.dates.date_begin, this.datesString.date_begin)}/>;
|
||||
else
|
||||
return null;
|
||||
return <VoteNotAvailable/>;
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -304,6 +323,18 @@ export default class VoteScreen extends React.Component<Props, State> {
|
|||
isVoteRunning={this.isVoteRunning()}/>;
|
||||
}
|
||||
|
||||
showMascotDialog = () => {
|
||||
this.setState({mascotDialogVisible: true})
|
||||
};
|
||||
|
||||
hideMascotDialog = () => {
|
||||
AsyncStorageManager.getInstance().savePref(
|
||||
AsyncStorageManager.getInstance().preferences.voteShowBanner.key,
|
||||
'0'
|
||||
);
|
||||
this.setState({mascotDialogVisible: false})
|
||||
};
|
||||
|
||||
/**
|
||||
* Renders the authenticated screen.
|
||||
*
|
||||
|
@ -313,23 +344,40 @@ export default class VoteScreen extends React.Component<Props, State> {
|
|||
*/
|
||||
render() {
|
||||
return (
|
||||
<AuthenticatedScreen
|
||||
{...this.props}
|
||||
ref={this.authRef}
|
||||
requests={[
|
||||
{
|
||||
link: 'elections/teams',
|
||||
params: {},
|
||||
mandatory: false,
|
||||
},
|
||||
{
|
||||
link: 'elections/dates',
|
||||
params: {},
|
||||
mandatory: false,
|
||||
},
|
||||
]}
|
||||
renderFunction={this.getScreen}
|
||||
/>
|
||||
<View style={{flex: 1}}>
|
||||
<AuthenticatedScreen
|
||||
{...this.props}
|
||||
ref={this.authRef}
|
||||
requests={[
|
||||
{
|
||||
link: 'elections/teams',
|
||||
params: {},
|
||||
mandatory: false,
|
||||
},
|
||||
{
|
||||
link: 'elections/dates',
|
||||
params: {},
|
||||
mandatory: false,
|
||||
},
|
||||
]}
|
||||
renderFunction={this.getScreen}
|
||||
/>
|
||||
<MascotPopup
|
||||
visible={this.state.mascotDialogVisible}
|
||||
title={i18n.t("screens.vote.mascotDialog.title")}
|
||||
message={i18n.t("screens.vote.mascotDialog.message")}
|
||||
icon={"vote"}
|
||||
buttons={{
|
||||
action: null,
|
||||
cancel: {
|
||||
message: i18n.t("screens.vote.mascotDialog.button"),
|
||||
icon: "check",
|
||||
onPress: this.hideMascotDialog,
|
||||
}
|
||||
}}
|
||||
emotion={MASCOT_STYLE.CUTE}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue