From 8b201efabfa5673afbe610b6bdd752419a683551 Mon Sep 17 00:00:00 2001 From: Arnaud Vergnet Date: Wed, 15 Jul 2020 18:05:56 +0200 Subject: [PATCH] Added mascot to equipment screen --- locales/en.json | 8 +- locales/fr.json | 8 +- src/managers/AsyncStorageManager.js | 5 + .../Amicale/Equipment/EquipmentListScreen.js | 115 ++++++++++++------ 4 files changed, 94 insertions(+), 42 deletions(-) diff --git a/locales/en.json b/locales/en.json index 89949b7..cf3fa0a 100644 --- a/locales/en.json +++ b/locales/en.json @@ -269,7 +269,6 @@ "title": "Equipment Booking", "book": "Book", "confirm": "Confirmation", - "message": "Thanks to the Amicale, students have access to some equipment like BBQs and others. To book one of those items, click the equipment of your choice in the list bellow, enter your lend dates, then come around the Amicale to claim it and give your bail.", "bail": "Bail: %{cost}€", "available": "Available %{date}", "today": "today", @@ -284,7 +283,12 @@ "dialogTitle": "Confirm booking?", "dialogTitleLoading": "Sending your booking...", "dialogMessage": "Are you sure you want to confirm your booking?\n\nYou will then be able to claim the selected equipment at the Amicale for the duration of your booking in exchange of a bail.", - "bookingConfirmedMessage": "Do not forget to come by the Amicale to give your bail in exchange of the equipment." + "bookingConfirmedMessage": "Do not forget to come by the Amicale to give your bail in exchange of the equipment.", + "mascotDialog": { + "title": "How does it work ?", + "message": "Thanks to the Amicale, students have access to some equipment like BBQs and others. To book one of those items, click the equipment of your choice in the list bellow, enter your lend dates, then come around the Amicale to claim it and give your bail.", + "button": "Ok" + } }, "scanner": { diff --git a/locales/fr.json b/locales/fr.json index c6eaf3e..57ea6c1 100644 --- a/locales/fr.json +++ b/locales/fr.json @@ -268,7 +268,6 @@ "title": "Réservation de Matériel", "book": "Réserver", "confirm": "Confirmation", - "message": "L'Amicale met à disposition des étudiants du matériel comme des BBQ, des appareils à raclette et autres. Pour réserver l'un de ces formidables appareils, clique sur celui de ton choix dans la liste, indique les dates du prêt, puis passe à l'Amicale pour le récupérer et donner la caution.", "bail": "Caution : %{cost}€", "available": "Disponible %{date}", "today": "aujourd'hui", @@ -283,7 +282,12 @@ "dialogTitle": "Confirmer la réservation ?", "dialogTitleLoading": "Envoi de votre réservation...", "dialogMessage": "Est-tu sûr de confirmer ta réservation ?\n\nTu pourras ensuite passer à l'Amicale récupérer le matériel pour la durée de la réservation en échange d'une caution.", - "bookingConfirmedMessage": "N'oublie pas de passer à L'Amicale pour donner la caution en échange du matériel." + "bookingConfirmedMessage": "N'oublie pas de passer à L'Amicale pour donner la caution en échange du matériel.", + "mascotDialog": { + "title": "Comme ça marche ?", + "message": "L'Amicale met à disposition des étudiants du matériel comme des BBQ, des appareils à raclette et autres. Pour réserver l'un de ces formidables appareils, clique sur celui de ton choix dans la liste, indique les dates du prêt, puis passe à l'Amicale pour le récupérer et donner la caution.", + "button": "Merci !" + } }, "scanner": { diff --git a/src/managers/AsyncStorageManager.js b/src/managers/AsyncStorageManager.js index b58ea7d..7f40ef9 100644 --- a/src/managers/AsyncStorageManager.js +++ b/src/managers/AsyncStorageManager.js @@ -94,6 +94,11 @@ export default class AsyncStorageManager { default: '1', current: '', }, + equipmentShowBanner: { + key: 'equipmentShowBanner', + default: '1', + current: '', + }, proxiwashWatchedMachines: { key: 'proxiwashWatchedMachines', default: '[]', diff --git a/src/screens/Amicale/Equipment/EquipmentListScreen.js b/src/screens/Amicale/Equipment/EquipmentListScreen.js index 65bf353..f0ea799 100644 --- a/src/screens/Amicale/Equipment/EquipmentListScreen.js +++ b/src/screens/Amicale/Equipment/EquipmentListScreen.js @@ -1,8 +1,8 @@ // @flow import * as React from 'react'; -import {Animated, Image} from "react-native"; -import {Card, Paragraph, withTheme} from 'react-native-paper'; +import {Animated, View} from "react-native"; +import {Button, withTheme} from 'react-native-paper'; import AuthenticatedScreen from "../../../components/Amicale/AuthenticatedScreen"; import {Collapsible} from "react-navigation-collapsible"; import {withCollapsible} from "../../../utils/withCollapsible"; @@ -11,6 +11,9 @@ import type {CustomTheme} from "../../../managers/ThemeManager"; import i18n from "i18n-js"; import type {club} from "../Clubs/ClubListScreen"; import EquipmentListItem from "../../../components/Lists/Equipment/EquipmentListItem"; +import MascotPopup from "../../../components/Mascot/MascotPopup"; +import {MASCOT_STYLE} from "../../../components/Mascot/Mascot"; +import AsyncStorageManager from "../../../managers/AsyncStorageManager"; type Props = { navigation: StackNavigationProp, @@ -18,6 +21,10 @@ type Props = { collapsibleStack: Collapsible, } +type State = { + mascotDialogVisible: boolean, +} + export type Device = { id: number, name: string, @@ -32,10 +39,13 @@ export type RentedDevice = { end: string, } -const ICON_AMICALE = require('../../../../assets/amicale.png'); const LIST_ITEM_HEIGHT = 64; -class EquipmentListScreen extends React.Component { +class EquipmentListScreen extends React.Component { + + state = { + mascotDialogVisible: AsyncStorageManager.getInstance().preferences.equipmentShowBanner.current === "1" + } data: Array; userRents: Array; @@ -84,24 +94,24 @@ class EquipmentListScreen extends React.Component { * @returns {*} */ getListHeader() { - return - + + + ); } keyExtractor = (item: club) => item.id.toString(); @@ -141,25 +151,54 @@ class EquipmentListScreen extends React.Component { ) }; + showMascotDialog = () => { + this.setState({mascotDialogVisible: true}) + }; + + hideMascotDialog = () => { + AsyncStorageManager.getInstance().savePref( + AsyncStorageManager.getInstance().preferences.equipmentShowBanner.key, + '0' + ); + this.setState({mascotDialogVisible: false}) + }; + render() { return ( - + + + + ); } }