From 5ad1e1d3f3dba957da7d4ce8dc3286cccd461ed3 Mon Sep 17 00:00:00 2001
From: Arnaud Vergnet <vergnet@etud.insa-toulouse.fr>
Date: Thu, 16 Jul 2020 23:31:04 +0200
Subject: [PATCH] Added mascot on home header

---
 src/components/Mascot/Mascot.js | 20 ++++++++++++++------
 src/navigation/TabNavigator.js  | 25 ++++++++++++++++++++++++-
 2 files changed, 38 insertions(+), 7 deletions(-)

diff --git a/src/components/Mascot/Mascot.js b/src/components/Mascot/Mascot.js
index d29528c..80cf9d3 100644
--- a/src/components/Mascot/Mascot.js
+++ b/src/components/Mascot/Mascot.js
@@ -54,15 +54,12 @@ export const MASCOT_STYLE = {
     LOVE: 6,
     COOL: 7,
     ANGRY: 8,
+    RANDOM: 999,
 };
 
 
 class Mascot extends React.Component<Props, State> {
 
-    state = {
-        currentEmotion: this.props.emotion
-    }
-
     static defaultProps = {
         animated: false,
         entryAnimation: {
@@ -91,6 +88,8 @@ class Mascot extends React.Component<Props, State> {
     onPress: (viewRef: AnimatableViewRef) => null;
     onLongPress: (viewRef: AnimatableViewRef) => null;
 
+    initialEmotion: number;
+
     constructor(props: Props) {
         super(props);
         this.viewRef = React.createRef();
@@ -106,12 +105,21 @@ class Mascot extends React.Component<Props, State> {
         this.glassesList[GLASSES_STYLE.NORMAL] = MASCOT_GLASSES;
         this.glassesList[GLASSES_STYLE.COOl] = MASCOT_SUNGLASSES;
 
+        this.initialEmotion = this.props.emotion;
+
+        if (this.initialEmotion === MASCOT_STYLE.RANDOM)
+            this.initialEmotion = Math.floor(Math.random() * MASCOT_STYLE.ANGRY) + 1;
+
+        this.state = {
+            currentEmotion: this.initialEmotion
+        }
+
         if (this.props.onPress == null) {
             this.onPress = (viewRef: AnimatableViewRef) => {
                 if (viewRef.current != null) {
                     this.setState({currentEmotion: MASCOT_STYLE.LOVE});
                     viewRef.current.rubberBand(1500).then(() => {
-                        this.setState({currentEmotion: this.props.emotion});
+                        this.setState({currentEmotion: this.initialEmotion});
                     });
 
                 }
@@ -125,7 +133,7 @@ class Mascot extends React.Component<Props, State> {
                 if (viewRef.current != null) {
                     this.setState({currentEmotion: MASCOT_STYLE.ANGRY});
                     viewRef.current.tada(1000).then(() => {
-                        this.setState({currentEmotion: this.props.emotion});
+                        this.setState({currentEmotion: this.initialEmotion});
                     });
 
                 }
diff --git a/src/navigation/TabNavigator.js b/src/navigation/TabNavigator.js
index 51f954c..c0f3614 100644
--- a/src/navigation/TabNavigator.js
+++ b/src/navigation/TabNavigator.js
@@ -9,7 +9,7 @@ import ProxiwashScreen from '../screens/Proxiwash/ProxiwashScreen';
 import ProxiwashAboutScreen from '../screens/Proxiwash/ProxiwashAboutScreen';
 import PlanexScreen from '../screens/Planex/PlanexScreen';
 import AsyncStorageManager from "../managers/AsyncStorageManager";
-import {useTheme} from 'react-native-paper';
+import {Title, useTheme} from 'react-native-paper';
 import {Platform} from 'react-native';
 import i18n from "i18n-js";
 import ClubDisplayScreen from "../screens/Amicale/Clubs/ClubDisplayScreen";
@@ -22,6 +22,8 @@ import WebsitesHomeScreen from "../screens/Services/ServicesScreen";
 import ServicesSectionScreen from "../screens/Services/ServicesSectionScreen";
 import AmicaleContactScreen from "../screens/Amicale/AmicaleContactScreen";
 import {createScreenCollapsibleStack, getWebsiteStack} from "../utils/CollapsibleUtils";
+import {View} from "react-native-animatable";
+import Mascot, {MASCOT_STYLE} from "../components/Mascot/Mascot";
 
 const modalTransition = Platform.OS === 'ios' ? TransitionPresets.ModalPresentationIOS : TransitionPresets.ModalSlideFromBottomIOS;
 
@@ -113,6 +115,27 @@ function HomeStackComponent(initialRoute: string | null, defaultData: { [key: st
                         headerStyle: {
                             backgroundColor: colors.surface,
                         },
+                        headerTitle: (props) => <View style={{flexDirection: "row"}}>
+                            <Mascot
+                                emotion={MASCOT_STYLE.RANDOM}
+                                size={50}
+                                animated={true}
+                                entryAnimation={{
+                                    animation: "bounceIn",
+                                    duration: 1000
+                                }}
+                                loopAnimation={{
+                                    animation: "pulse",
+                                    duration: 2000,
+                                    iterationCount: "infinite"
+                                }}
+                            />
+                            <Title style={{
+                                marginLeft: 10,
+                                marginTop: "auto",
+                                marginBottom: "auto",
+                            }}>{i18n.t('screens.home.title')}</Title>
+                        </View>
                     }}
                     initialParams={params}
                 />,