Sae_LeftOvers
/
LeftOvers
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fusion to get latest work from louison
continuous-integration/drone/push Build is failing Details

Browse Source
pull/20/head
Rémi REGNAULT 1 year ago
parent ffb0ccc810 3c40ffd567
commit ff8bb15315
16 changed files with 446 additions and 366 deletions
Show Stats Download Patch File Download Diff File

6
LeftOvers/App.tsx
Unescape View File

@ -1,8 +1,6 @@
import React from 'react';
import { StyleSheet, Image } from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import { BlurView } from 'expo-blur';
import HomeStackScreen from './navigation/HomeStackScreen';
import ProfilesStackScreen from './navigation/ProfileStackScreen';
@ -10,10 +8,6 @@ import CookingStackScreen from './navigation/CookingStackScreen';
import BottomBar from './navigation/BottomBar';
import { ThemeProvider } from './theme/ThemeContext';
import HomeIcon from './assets/images/home.png';
import ProfileIcon from './assets/images/person_icon.png';
import CookingIcon from './assets/images/cook.png';
const Tab = createBottomTabNavigator();

27
LeftOvers/components/FoodElementText.tsx
Unescape View File

@ -1,13 +1,10 @@
import React from 'react';
import {StyleSheet,Pressable, Text, View, Image} from 'react-native';
import Separator from '../components/Separator';
import plus from '../assets/images/plus.png';
import moins from '../assets/images/minus.png';
interface foodElementImageProps {
source : string
title : string
}
@ -18,7 +15,6 @@ export default function FoodElementText(props : any) {
<View style={styles.container}>
<View style={styles.view}>
<Text style={styles.text}>{props.title}</Text>
<Separator/>
</View>
</View>
</Pressable>
@ -29,33 +25,26 @@ const styles = StyleSheet.create({
button: {
alignItems: 'center',
justifyContent: 'center',
width : 270,
height: 60,
width: "80%",
borderRadius: 5,
elevation: 3,
backgroundColor: '#E3DEC9',
},
text: {
fontSize: 15,
lineHeight: 21,
fontSize: 10,
fontWeight: 'bold',
letterSpacing: 0.25,
padding : 7,
padding : "2%",
color: 'black',
},
view: {
alignItems: 'flex-start',
justifyContent: 'center',
marginRight: 5 // Centre le contenu horizontalement
},
container: {
width :260,
height: 50,
width: "100%",
borderRadius: 5,
elevation: 3,
borderWidth: 2,
borderColor: 'black',
flexDirection: 'row',
justifyContent: 'space-between',
borderWidth: 1,
borderColor: '#3F3C42',
flexDirection: 'column',
justifyContent: 'center',
},
});

27
LeftOvers/components/ListSelect.tsx
Unescape View File

@ -25,6 +25,7 @@ export default function ListSelect(props: ListProps) {
dropdownTextStyles={styles.itemText}
badgeStyles={styles.badges}
badgeTextStyles={styles.badgesText}
notFoundText="All Diets Already Selected"
placeholder={props.title}
label={props.title}/>
);
@ -35,7 +36,6 @@ const styles = StyleSheet.create({
flexDirection: "row",
alignItems: "center",
justifyContent: "stretch",
minHeight: 25,
backgroundColor: "#F2F0E4",
borderTopRightRadius: 15,
borderTopLeftRadius: 15,
@ -43,13 +43,12 @@ const styles = StyleSheet.create({
borderBottomLeftRadius: 0,
borderWidth: 2,
borderColor: "#ACA279",
width: 330,
minWidth: "92%",
maxWidth: "92%",
marginBottom: 0,
overflow: "hidden",
},
arrow: {
height: 20,
width: 20,
resizeMode: 'contain',
tintColor: "#3F3C42",
flex: 0.1,
@ -63,34 +62,36 @@ const styles = StyleSheet.create({
},
itemList: {
//flexDirection: "row",
flexDirection: "row",
alignItems: "flex-start",
//justifyContent: "stretch",
justifyContent: "stretch",
borderWidth: 0,
borderTopRightRadius: 0,
borderTopLeftRadius: 0,
borderBottomRightRadius: 15,
borderBottomLeftRadius: 15,
backgroundColor: "#E3DEC9",
width: 330,
minWidth: "92%",
maxWidth: "92%",
},
itemCell: {
maxHeight: 30,
flex: 1,
padding: 0,
paddingLeft: 10,
paddingTop: "5%",
width: "100%",
minWidth: 250,
maxWidth: 250,
},
itemText: {
fontSize: 13,
textAlign: "left",
flex: 1,
padding: 5,
paddingLeft: 10,
padding: "1%",
paddingLeft: "3%",
color: "#3F3C42",
},
badges: {
backgroundColor: "#59BDCD"
backgroundColor: "#59BDCD",
},
badgesText: {
fontSize: 15,

22
LeftOvers/components/ListWithoutSelect.tsx
Unescape View File

@ -1,5 +1,5 @@
import React from 'react';
import {StyleSheet, Text, TextInput, View, Image, FlatList} from 'react-native';
import {StyleSheet, Text, TextInput, View, Image, FlatList, Pressable} from 'react-native';
import ValidateButton from './ValidateButton';
import HeaderFlatList from './HeaderFlatList';
import { MultipleSelectList, SelectList } from 'react-native-dropdown-select-list'
@ -34,7 +34,6 @@ const styles = StyleSheet.create({
flexDirection: "row",
alignItems: "center",
justifyContent: "stretch",
minHeight: 25,
backgroundColor: "#F2F0E4",
borderTopRightRadius: 15,
borderTopLeftRadius: 15,
@ -42,13 +41,12 @@ const styles = StyleSheet.create({
borderBottomLeftRadius: 0,
borderWidth: 2,
borderColor: "#ACA279",
width: 330,
minWidth: "92%",
maxWidth: "92%",
marginBottom: 0,
overflow: "hidden",
},
arrow: {
height: 20,
width: 20,
resizeMode: 'contain',
tintColor: "#3F3C42",
flex: 0.1,
@ -62,22 +60,24 @@ const styles = StyleSheet.create({
},
itemList: {
//flexDirection: "row",
flexDirection: "row",
alignItems: "flex-start",
//justifyContent: "stretch",
justifyContent: "stretch",
borderWidth: 0,
borderTopRightRadius: 0,
borderTopLeftRadius: 0,
borderBottomRightRadius: 15,
borderBottomLeftRadius: 15,
backgroundColor: "#E3DEC9",
width: 330,
minWidth: "92%",
maxWidth: "92%",
},
itemCell: {
maxHeight: 30,
flex: 1,
padding: 0,
paddingLeft: 10,
paddingTop: "5%",
width: "100%",
minWidth: 250,
maxWidth: 250,
},
itemText: {
fontSize: 13,

64
LeftOvers/components/ProfileDelete.tsx
Unescape View File

@ -21,13 +21,24 @@ export default function ProfileDelete(props: ProfileProps) {
}
};
let imageSource
if (props.avatar == "plus.png"){
imageSource = require('../assets/images/plus.png')
}
else if (props.avatar == "plus_small.png"){
imageSource = require('../assets/images/plus_small.png')
}
else{
imageSource = require('../assets/images/logo.png')
}
return (
<View style={styles.background}>
<View style={styles.pseudoBar}>
<Image source={require("../assets/images/"+props.avatar)} style={styles.avatar}></Image>
<Image source={imageSource} style={styles.avatar}></Image>
<Text style={styles.text}>{props.name}</Text>
</View>
<Pressable onPress={changeListVisibility} style={{height: 20, marginTop: 20,}}>
<Pressable onPress={changeListVisibility} style={{height: "5%", marginTop: "6%", flex: 1, marginBottom: "3%"}}>
<View style={styles.filterBar}>
<Text style={styles.filters}>Filters</Text>
<Image source={require("../assets/images/arrow.png")} style={styles.arrow}></Image>
@ -35,9 +46,8 @@ export default function ProfileDelete(props: ProfileProps) {
</Pressable>
<View style={{display: display}}>
<ListWithoutSelect title="Diets" content={props.diets}></ListWithoutSelect>
<View style={{marginTop: 10}}/>
<View style={{marginTop: "3%"}}/>
<ListWithoutSelect title="Allergies" content={props.allergies}></ListWithoutSelect>
<View style={{marginTop: 10}}/>
</View>
</View>
);
@ -45,69 +55,61 @@ export default function ProfileDelete(props: ProfileProps) {
const styles = StyleSheet.create({
background: {
//maxWidth: 370,
flexDirection: 'column',
alignItems: 'center',
justifyContent: 'center',
borderRadius: 15,
backgroundColor: '#F2F0E4',
padding: 10,
marginHorizontal: 10,
padding: "3%",
marginHorizontal: "3%",
height: "100%",
},
pseudoBar: {
flexDirection: "row",
alignItems: "center",
justifyContent: "center",
flex: 0.7,
width: 330,
marginBottom: 10,
width: "100%",
marginHorizontal: "3%",
marginBottom: "3%",
},
avatar: {
padding: 20,
padding: "5%",
resizeMode: 'contain',
borderWidth: 2,
borderColor: "#ACA279",
borderRadius: 45,
height: "100%",
flex: 0.03,
},
text: {
flex: 1,
fontSize: 20,
color: '#ACA279',
alignItems: 'center',
justifyContent: 'left',
flex: 0.8,
marginLeft: 20,
padding: 5,
textAlign: 'left',
marginLeft: "10%",
padding: "2%",
height: "100%",
},
filterBar: {
flexDirection: "row",
width: 300,
paddingTop: 10,
paddingBottom: 5,
width: "90%",
paddingTop: "3%",
alignItems: "flex-end",
justifyContent: "center",
flex: 0.2,
},
filters: {
flex: 0.5,
fontSize: 20,
color: '#ACA279',
flex: 1,
padding: 5,
padding: "2%",
paddingLeft: 0,
paddingBottom: 0,
},
nbSelected: {
fontSize: 11,
flex: 1,
color: "#3F3C42",
textAlign: "right",
},
arrow: {
height: 20,
width: 20,
height: "100%",
resizeMode: 'contain',
tintColor: "#3F3C42",
flex: 0.1,

81
LeftOvers/components/ProfileDetails.tsx
Unescape View File

@ -25,30 +25,42 @@ export default function ProfileDetails(props: ProfileProps) {
}
};
let imageSource
if (props.avatar == "plus.png"){
imageSource = require('../assets/images/plus.png')
}
else if (props.avatar == "plus_small.png"){
imageSource = require('../assets/images/plus_small.png')
}
else{
imageSource = require('../assets/images/logo.png')
}
return (
<View style={styles.background}>
<View style={styles.pseudoBar}>
<Image source={require("../assets/images/"+props.avatar)} style={styles.avatar}></Image>
<Image source={imageSource} style={styles.avatar}></Image>
<Text style={styles.text}>{props.name}</Text>
<Pressable onPress={() => props.navigation.navigate('ProfileModification')}>
<Image source={require("../assets/images/modify.png")} style={styles.modify}></Image>
</Pressable>
<Pressable onPress={props.onDeleteProfile}>
<Pressable onPress={props.onDeleteProfile} style={{flex: 0.1, marginLeft: "1%",}}>
<Image source={require("../assets/images/delete.png")} style={styles.delete}></Image>
</Pressable>
</View>
<Pressable onPress={changeListVisibility} style={{height: 20, marginTop: 20,}}>
<Pressable onPress={changeListVisibility} style={{height: "5%", marginTop: "6%", flex: 1, marginBottom: "3%"}}>
<View style={styles.filterBar}>
<Text style={styles.filters}>Filters</Text>
<Text style={styles.nbSelected}>3 selected</Text>
<Text style={styles.nbSelected}>{props.diets.length} selected</Text>
<Image source={require("../assets/images/arrow.png")} style={styles.arrow}></Image>
</View>
</Pressable>
<View style={{display: display}}>
<View style={{display: display, alignItems: "center", justifyContent: "center"}}>
<ListWithoutSelect title="Diets" content={props.diets}></ListWithoutSelect>
<View style={{marginTop: 10}}/>
<View style={{marginTop: "3%"}}/>
<ListWithoutSelect title="Allergies" content={props.allergies}></ListWithoutSelect>
<View style={{marginTop: 10}}/>
<View style={{marginTop: "3%"}}/>
</View>
</View>
);
@ -56,72 +68,71 @@ export default function ProfileDetails(props: ProfileProps) {
const styles = StyleSheet.create({
background: {
//maxWidth: 370,
flexDirection: 'column',
alignItems: 'center',
justifyContent: 'center',
borderRadius: 15,
backgroundColor: '#F2F0E4',
padding: 10,
marginHorizontal: 10,
padding: "3%",
marginHorizontal: "3%",
},
pseudoBar: {
flexDirection: "row",
alignItems: "center",
justifyContent: "center",
flex: 0.7,
width: 330,
marginBottom: 10,
width: "100%",
marginHorizontal: "3%",
marginBottom: "3%",
},
avatar: {
padding: 20,
padding: "5%",
resizeMode: 'contain',
borderWidth: 2,
borderColor: "#ACA279",
borderRadius: 45,
height: "100%",
flex: 0.03,
},
text: {
flex: 1,
fontSize: 20,
color: '#ACA279',
alignItems: 'center',
justifyContent: 'left',
flex: 0.8,
marginLeft: 20,
padding: 5,
textAlign: 'left',
marginLeft: "3%",
padding: "2%",
height: "100%",
},
modify: {
height: 20,
width: 20,
height: "100%",
tintColor: "#ACA279",
resizeMode: 'contain',
flex: 0.05,
marginLeft: 15,
flex: 0.1,
marginLeft: "3%",
},
delete: {
height: 20,
width: 20,
height: "100%",
width: "100%",
tintColor: "#ACA279",
resizeMode: 'contain',
flex: 0.05,
flex: 1,
},
filterBar: {
flexDirection: "row",
width: 300,
paddingTop: 10,
paddingBottom: 5,
width: "85%",
paddingTop: "3%",
paddingBottom: "1%",
alignItems: "flex-end",
justifyContent: "center",
flex: 0.2,
flex: 1,
},
filters: {
flex: 0.5,
fontSize: 20,
color: '#ACA279',
flex: 1,
padding: 5,
padding: "2%",
paddingLeft: 0,
paddingBottom: 0,
},
@ -130,10 +141,10 @@ const styles = StyleSheet.create({
flex: 1,
color: "#3F3C42",
textAlign: "right",
marginRight: "3%",
},
arrow: {
height: 20,
width: 20,
height: "100%",
resizeMode: 'contain',
tintColor: "#3F3C42",
flex: 0.1,

53
LeftOvers/components/ProfileElement.tsx
Unescape View File

@ -21,19 +21,34 @@ export default function ProfileElement(props : Profile) {
else{
setWaiting("flex")
}
if (props.isActive == "flex" && waiting == "none"){
if (props.disableSelection){
setSeparator("none")
}
else if (props.isActive == "flex" && waiting == "none"){
setSeparator("flex")
}
else{
setSeparator("none")
}
console.log(waiting, separator, props.name)
};
}
let imageSource
if (props.avatar == "plus.png"){
imageSource = require('../assets/images/plus.png')
}
else if (props.avatar == "plus_small.png"){
imageSource = require('../assets/images/plus_small.png')
}
else{
imageSource = require('../assets/images/logo.png')
}
return (
<Pressable onPress={changeStatus} style={styles.button}>
<View style={{flexDirection: "column"}}>
<View>
<View style={styles.pseudoBar}>
<Image source={require("../assets/images/"+props.avatar)} style={styles.avatar}></Image>
<Image source={imageSource} style={styles.avatar}></Image>
<Text style={styles.text}>{props.name}</Text>
</View>
<View style={styles.pseudoBar}>
@ -54,42 +69,42 @@ const styles = StyleSheet.create({
button: {
alignItems: 'center',
justifyContent: 'flex-start',
height: 80,
//width: "75%",
marginVertical: 15,
height: "80%",
width: "78%",
marginVertical: "3%",
},
pseudoBar: {
flexDirection: "row",
alignItems: "center",
justifyContent: "center",
//width: "120%",
width: 225,
marginHorizontal: 10,
marginBottom: 10,
width: "100%",
marginHorizontal: "3%",
marginBottom: "3%",
},
avatar: {
padding: 20,
padding: "5%",
resizeMode: 'contain',
borderWidth: 2,
borderColor: "#ACA279",
borderRadius: 45,
height: "100%",
flex: 0.01,
},
text: {
fontSize: 15,
color: '#ACA279',
alignItems: 'center',
justifyContent: 'left',
flex: 0.8,
marginLeft: 20,
padding: 5,
width: "100%"
textAlign: 'left',
flex: 0.9,
marginLeft: "10%",
padding: "2%",
},
active: {
borderWidth: 1,
borderRadius: 20,
borderColor: "#59BDCD",
padding: 5,
padding: "1%",
},
textActive: {
fontSize: 10,
@ -100,7 +115,7 @@ const styles = StyleSheet.create({
borderWidth: 1,
borderRadius: 20,
borderColor: "#ACA279",
padding: 5,
padding: "1%",
},
textWaiting: {
fontSize: 10,

60
LeftOvers/components/ProfileModification.tsx
Unescape View File

@ -15,10 +15,21 @@ type ProfileProps = {
export default function ProfileModification(props: ProfileProps) {
const [name, onChangeName] = useState(props.name);
let imageSource
if (props.avatar == "plus.png"){
imageSource = require('../assets/images/plus.png')
}
else if (props.avatar == "plus_small.png"){
imageSource = require('../assets/images/plus_small.png')
}
else{
imageSource = require('../assets/images/logo.png')
}
return (
<View style={styles.background}>
<View style={styles.pseudoBar}>
<Image source={require("../assets/images/"+props.avatar)} style={styles.avatar}></Image>
<Image source={imageSource} style={styles.avatar}></Image>
<TextInput style={styles.textInput} value={name} onChangeText={onChangeName} placeholder="Name"></TextInput>
<Image source={require("../assets/images/modify.png")} style={styles.modify}></Image>
</View>
@ -27,9 +38,9 @@ export default function ProfileModification(props: ProfileProps) {
<Text style={styles.nbSelected}>3 selected</Text>
</View>
<ListSelect title="Diets" content={props.diets}></ListSelect>
<View style={{marginTop: 10}}/>
<View style={{marginTop: "6%"}}/>
<ListWithoutSelect title="Allergies" content={props.allergies}></ListWithoutSelect>
<View style={{marginTop: 10}}/>
<View style={{marginTop: "3%"}}/>
<ValidateButton title="Add Allergy" image="plus.png" colour="#59BDCD" backColour="#E3DEC9"></ValidateButton>
</View>
);
@ -37,77 +48,68 @@ export default function ProfileModification(props: ProfileProps) {
const styles = StyleSheet.create({
background: {
//maxWidth: 370,
flexDirection: 'column',
alignItems: 'center',
justifyContent: 'center',
borderRadius: 15,
backgroundColor: '#F2F0E4',
padding: 10,
marginHorizontal: 10,
padding: "3%",
marginHorizontal: "3%",
},
pseudoBar: {
flexDirection: "row",
alignItems: "center",
justifyContent: "center",
flex: 0.7,
width: 330,
marginBottom: 10,
width: "100%",
marginHorizontal: "3%",
marginBottom: "3%",
},
avatar: {
padding: 20,
padding: "5%",
resizeMode: 'contain',
borderWidth: 2,
borderColor: "#ACA279",
borderRadius: 45,
height: "100%",
flex: 0.04,
},
textInput: {
flex: 0.5,
fontSize: 15,
color: '#ACA279',
width : 150,
borderRadius: 10,
borderWidth: 2,
borderStyle: 'dashed',
borderColor: '#ACA279',
alignItems: 'center',
justifyContent: 'left',
textAlign: 'left',
flex: 0.8,
marginLeft: 20,
padding: 5,
marginLeft: "7%",
padding: "2%",
},
modify: {
height: 20,
width: 20,
height: "100%",
tintColor: "#ACA279",
resizeMode: 'contain',
flex: 0.1,
marginLeft: 5,
marginLeft: "3%",
},
filterBar: {
flexDirection: "row",
width: 300,
paddingTop: 10,
paddingBottom: 5,
width: "85%",
paddingTop: "3%",
paddingBottom: "2%",
alignItems: "flex-end",
justifyContent: "center",
flex: 0.2,
},
filters: {
flex: 0.5,
fontSize: 20,
color: '#ACA279',
flex: 1,
padding: 5,
paddingLeft: 0,
paddingBottom: 0,
},
nbSelected: {
fontSize: 11,
flex: 1,
color: "#3F3C42",
textAlign: "right",
}

13
LeftOvers/components/ProfileSelection.tsx
Unescape View File

@ -36,12 +36,12 @@ export default function ProfileSelection(props: ProfileSelectionProps) {
return (
<View style={styles.background}>
<Pressable onPress={decreaseCounter} style={{}}>
<Image source={bracketLeft} style={{ width: 40, height: 40 }} />
<Pressable onPress={decreaseCounter}>
<Image source={bracketLeft} style={{width: 40, height: 40, resizeMode: "contain"}}/>
</Pressable>
<ProfileElement name={props.listProfile[cpt].name} avatar={props.listProfile[cpt].avatar} isActive={props.listProfile[cpt].isActive} disableSelection={props.disableSelection}/>
<Pressable onPress={increaseCounter} style={{}}>
<Image source={bracketRight} style={{ width: 40, height: 40 }} />
<Pressable onPress={increaseCounter}>
<Image source={bracketRight} style={{width: 40, height: 40, resizeMode: "contain"}}/>
</Pressable>
</View>
);
@ -49,10 +49,9 @@ export default function ProfileSelection(props: ProfileSelectionProps) {
const styles = StyleSheet.create({
background: {
//height: 120,
height: 100,
width: "92%",
height: 80,
borderRadius: 20,
marginHorizontal: 10,
borderWidth: 2,
borderColor: '#ACA279',
backgroundColor: '#E3DEC9',

8
LeftOvers/components/Separator.tsx
Unescape View File

@ -7,11 +7,11 @@ export default function Separator (){
const styles = StyleSheet.create({
separator: {
width: 200, // Largeur de la ligne
backgroundColor: 'black', // Couleur de la ligne
width: "90%",
backgroundColor: '#3F3C42',
borderWidth : 1,
marginLeft : 10,
marginRight : 10,
marginLeft : "5%",
marginRight : "5%",
},
});

59
LeftOvers/components/ValidateButton.tsx
Unescape View File

@ -11,6 +11,47 @@ type ValidateButtonProps = {
}
export default function ValidateButton(props: ValidateButtonProps) {
let imageSource
if (props.image == "cook.png"){
imageSource = require('../assets/images/cook.png')
}
else if (props.image == "cross.png"){
imageSource = require('../assets/images/cross.png')
}
else if (props.image == "delete.png"){
imageSource = require('../assets/images/delete.png')
}
else if (props.image == "modify.png"){
imageSource = require('../assets/images/modify.png')
}
else if (props.image == "parameter.png"){
imageSource = require('../assets/images/parameter.png')
}
else if (props.image == "plus.png"){
imageSource = require('../assets/images/plus.png')
}
else if (props.image == "plus_small.png"){
imageSource = require('../assets/images/plus_small.png')
}
else if (props.image == "save.png"){
imageSource = require('../assets/images/save.png')
}
else if (props.image == "search.png"){
imageSource = require('../assets/images/search.png')
}
else if (props.image == "update.png"){
imageSource = require('../assets/images/update.png')
}
else if (props.image == "validate.png"){
imageSource = require('../assets/images/validate.png')
}
else if (props.image == "warehouse.png"){
imageSource = require('../assets/images/warehouse.png')
}
else{
imageSource = require('../assets/images/logo.png')
}
return (
<Pressable
style={{
@ -28,20 +69,20 @@ export default function ValidateButton(props: ValidateButtonProps) {
alignItems: 'center',
justifyContent: "center",
flexDirection: "row",
padding: 5,
paddingRight: 10,}}>
padding: "2%",
paddingRight: "3%",}}>
<Image
source={require('../assets/images/'+props.image)}
source={imageSource}
style={{
height: 20,
width: 20,
marginLeft: 5,
marginRight: 10,
resizeMode: "center",
height: "90%",
width: "9%",
marginLeft: "2%",
marginRight: "3%",
resizeMode: "contain",
tintColor: props.colour,}}>
</Image>
<Text style={{
fontSize: 20,
fontSize: 15,
color: props.colour,
}}>{props.title}</Text>
</View>

17
LeftOvers/screens/CreateProfile.tsx
Unescape View File

@ -1,5 +1,5 @@
import React from 'react';
import {StyleSheet, View} from 'react-native';
import {StyleSheet, View, ScrollView, useWindowDimensions} from 'react-native';
import ProfileModification from '../components/ProfileModification';
import ValidateButton from '../components/ValidateButton';
import TopBar from '../components/TopBar';
@ -10,16 +10,17 @@ export default function CreateProfile(props) {
const all = []
const die = [{value: "Dairy free"}, {value: "Gluten free"}, {value: "Porkless"}, {value: "Vegan"}, {value: "Vegetarian"}, {value: "Pescatarian"}]
return (
<SafeAreaProvider>
<SafeAreaProvider style={{flex: 1}}>
<TopBar title="Create Profile" isVisible="true"/>
<View style={styles.container}>
<LinearGradient colors={['#2680AA', '#59BDCD']} style={styles.linearGradient}>
<View style={{marginTop: 20}}/>
<ScrollView>
<LinearGradient colors={['#2680AA', '#59BDCD']} style={[styles.linearGradient, {minHeight: useWindowDimensions().height}]}>
<View style={{marginTop: "6%"}}/>
<ProfileModification name="" avatar="plus_small.png" diets={die} allergies={all}></ProfileModification>
<View style={{marginTop: 20}}/>
<View style={{marginTop: "3%"}}/>
<ValidateButton title="Create Profile" image="plus.png" colour="#ACA279" backColour="#F2F0E4"></ValidateButton>
<View style={{marginTop: "20%"}}/>
</LinearGradient>
</View>
</ScrollView>
</SafeAreaProvider>
);
}
@ -37,7 +38,7 @@ const styles = StyleSheet.create({
height: "100%",
width: "100%",
flex: 1,
padding: 10,
padding: "2%",
paddingTop: 0,
},
});

77
LeftOvers/screens/FiltersSelection.tsx
Unescape View File

@ -1,5 +1,5 @@
import React from 'react';
import {StyleSheet, View, Text} from 'react-native';
import {StyleSheet, View, Text, ScrollView, useWindowDimensions} from 'react-native';
import ProfileModification from '../components/ProfileModification';
import ValidateButton from '../components/ValidateButton';
import TopBar from '../components/TopBar';
@ -17,55 +17,72 @@ export default function FiltersSelection(props) {
{name: "David Martinez", avatar: "plus_small.png", isActive: "flex"},
]
let cptActive = 0
profiles.forEach(function (value) {
if(value.isActive=="flex"){
cptActive=cptActive+1
}
})
const die = [{value: "Dairy free"}, {value: "Gluten free"}, {value: "Porkless"}, {value: "Vegan"}, {value: "Vegetarian"}, {value: "Pescatarian"}]
const allProfiles = [{value: "Skimmed Milk"}, {value: "Nuts"}]
const dieProfiles = [{value: "Porkless"}, {value: "Pescatarian"}]
const dieAdd = [{value: "Dairy free"}, {value: "Gluten free"}, {value: "Vegan"}, {value: "Vegetarian"}]
function isInProfileDiets(element, index, array) {
var retType = true
dieProfiles.forEach(function (diets) {
if(diets.value==element.value){
retType = false
}
})
return retType
}
const dieAdd = die.filter(isInProfileDiets);
const allAdd = []
return (
<SafeAreaProvider>
<SafeAreaProvider style={{flex: 1}}>
<TopBar title="Filters Selection" isVisible="true"/>
<View style={styles.container}>
<LinearGradient colors={['#2680AA', '#59BDCD']} style={styles.linearGradient}>
<View style={{marginTop: 20}}/>
<ScrollView>
<LinearGradient colors={['#2680AA', '#59BDCD']} style={[styles.linearGradient, {minHeight: useWindowDimensions().height}]}>
<View style={{marginTop: "6%"}}/>
<View style={styles.profilesSelection}>
<View style={styles.filterBar}>
<Text style={styles.filters}>Profiles</Text>
<Text style={styles.nbSelected}>2 selected, 1 waiting</Text>
<Text style={styles.nbSelected}>{cptActive} selected, 1 waiting</Text>
</View>
<View style={{marginTop: 10}}/>
<View style={{marginTop: "3%"}}/>
<ProfileSelection listProfile={profiles} disableSelection={false}/>
<View style={{marginTop: 20}}/>
<View style={{marginTop: "4%"}}/>
<ValidateButton title="Change Selected Profiles" image="update.png" colour="#59BDCD" backColour="#E3DEC9"></ValidateButton>
</View>
<View style={{marginTop: 20}}/>
<View style={{marginTop: "6%"}}/>
<View style={styles.background}>
<View style={styles.filterBar}>
<Text style={styles.filters}>Filters from Profiles</Text>
</View>
<ListWithoutSelect title="Diets" content={dieProfiles}></ListWithoutSelect>
<View style={{marginTop: 10}}/>
<View style={{marginTop: "3%"}}/>
<ListWithoutSelect title="Allergies" content={allProfiles}></ListWithoutSelect>
</View>
<View style={{marginTop: 20}}/>
<View style={{marginTop: "6%"}}/>
<View style={styles.background}>
<View style={styles.filterBar}>
<Text style={styles.filters}>Additional Filters</Text>
<Text style={styles.nbSelected}>3 selected</Text>
<Text style={styles.nbSelected}>{dieAdd.length} available</Text>
</View>
<ListSelect title="Diets" content={dieAdd}></ListSelect>
<View style={{marginTop: 10}}/>
<View style={{marginTop: "3%"}}/>
<ListWithoutSelect title="Allergies" content={allAdd}></ListWithoutSelect>
<View style={{marginTop: 10}}/>
<View style={{marginTop: "3%"}}/>
<ValidateButton title="Add Allergy" image="plus.png" colour="#59BDCD" backColour="#E3DEC9"></ValidateButton>
</View>
<View style={{marginTop: 20}}/>
<View style={{marginTop: "6%"}}/>
<ValidateButton title="Save Filters" image="save.png" colour="#ACA279" backColour="#F2F0E4"></ValidateButton>
<View style={{marginTop: "20%"}}/>
</LinearGradient>
</View>
</ScrollView>
</SafeAreaProvider>
);
}
@ -83,53 +100,45 @@ const styles = StyleSheet.create({
height: "100%",
width: "100%",
flex: 1,
padding: 10,
padding: "2%",
paddingTop: 0,
},
background: {
//maxWidth: 370,
flexDirection: 'column',
alignItems: 'center',
justifyContent: 'center',
borderRadius: 20,
backgroundColor: '#F2F0E4',
padding: 10,
paddingBottom: 0,
marginHorizontal: 10,
padding: "3%",
marginHorizontal: "3%",
},
filterBar: {
flexDirection: "row",
width: 300,
paddingTop: 10,
paddingBottom: 5,
width: "85%",
paddingTop: "3%",
paddingBottom: "2%",
alignItems: "flex-end",
justifyContent: "center",
flex: 0.2,
},
filters: {
flex: 0.8,
fontSize: 20,
color: '#ACA279',
flex: 1,
padding: 5,
paddingLeft: 0,
paddingBottom: 0,
},
nbSelected: {
fontSize: 11,
//flex: 0.2,
color: "#3F3C42",
textAlign: "right",
},
profilesSelection: {
//maxWidth: 370,
flexDirection: 'column',
alignItems: 'center',
justifyContent: 'center',
borderRadius: 20,
backgroundColor: '#F2F0E4',
marginHorizontal: 10,
marginHorizontal: "3%",
paddingBottom: "3%",
},
});

96
LeftOvers/screens/HomePage.tsx
Unescape View File

@ -1,6 +1,6 @@
import React from 'react';
import { useState } from 'react';
import {StyleSheet, View, Text, Pressable, Image} from 'react-native';
import {StyleSheet, View, Text, Pressable, Image, ScrollView, SafeAreaView} from 'react-native';
import ProfileModification from '../components/ProfileModification';
import ValidateButton from '../components/ValidateButton';
import TopBar from '../components/TopBar';
@ -42,10 +42,15 @@ export default function HomePage({ navigation , props}) {
};
return (
<SafeAreaProvider>
<View style={styles.container}>
<SafeAreaProvider style={{flex: 1}}>
<ScrollView>
<View style={styles.topBar}>
<Image source={require("../assets/images/logo.png")} style={{width: "100%", height: "100%", flex: 0.1, marginLeft: "5%", resizeMode: "contain"}}/>
<Text style={styles.appName}>LeftOvers</Text>
<Image source={require("../assets/images/logo.png")} style={{width: "100%", height: "100%", flex: 0.1, marginRight: "5%", resizeMode: "contain"}}/>
</View>
<LinearGradient colors={['#2680AA', '#59BDCD']} style={styles.linearGradient}>
<View style={{marginTop: 20}}/>
<View style={styles.separator}/>
<View style={styles.welcome}>
<View style={{flexDirection: "column", alignItems: "flex-start", justifyContent: "center", width: "100%"}}>
<View style={{flexDirection: "row"}}>
@ -56,57 +61,57 @@ export default function HomePage({ navigation , props}) {
<Text style={styles.text}>Glad to see you again!</Text>
</View>
</View>
<View style={{marginTop: 20}}/>
<View style={styles.separator}/>
<View style={styles.profilesSelection}>
<View style={styles.filterBar}>
<Text style={styles.filters}>Profiles</Text>
<Text style={styles.nbSelected}>2 selected</Text>
</View>
<View style={{marginTop: 10}}/>
<View style={{marginTop: "3%"}}/>
<ProfileSelection listProfile={profiles} disableSelection={true}/>
<View style={{marginTop: 20}}/>
<View style={{marginTop: "4%"}}/>
<ValidateButton title="Modify Profiles" image="parameter.png" colour="#59BDCD" backColour="#E3DEC9" todo={() => navigation.navigate('Profiles')}/>
</View>
<View style={{marginTop: 20}}/>
<View style={styles.separator}/>
<View style={styles.profilesSelection}>
<View style={styles.filterBar}>
<Text style={styles.filters}>Ingredient Stocks</Text>
</View>
<View style={{marginTop: 10}}/>
<View style={{marginTop: "4%"}}/>
<ValidateButton title="Manage Stocks" image="warehouse.png" colour="#59BDCD" backColour="#E3DEC9" todo={() => console.log('ManageStocks')}/>
</View>
<View style={{marginTop: 20}}/>
<View style={styles.separator}/>
<View style={styles.profilesSelection}>
<View style={styles.filterBar}>
<Text style={styles.filters}>Cooking</Text>
</View>
<View style={{marginTop: 10}}/>
<View style={{marginTop: "3%"}}/>
<View style={styles.ingredientSelection}>
<Text style={{fontSize: 15, color: "#3F3C42"}}>Selected Ingredient</Text>
<View style={{flexDirection: "row", padding: 10, justifyContent: "center", alignItems: "center"}}>
<View style={{flexDirection: "row", padding: "4%", justifyContent: "center", alignItems: "center"}}>
<Pressable onPress={decreaseCounter}>
<Image source={bracketLeft} style={{ width: 40, height: 40 }} />
<Image source={bracketLeft} style={{width: 40, height: 40, resizeMode: "contain"}} />
</Pressable>
<FoodElementText title={ingredientList[cpt].title}/>
<Pressable onPress={increaseCounter}>
<Image source={bracketRight} style={{ width: 40, height: 40 }} />
<Image source={bracketRight} style={{width: 40, height: 40, resizeMode: "contain"}} />
</Pressable>
</View>
</View>
<View style={{marginTop: 15}}/>
<View style={{marginTop: "4%"}}/>
<ValidateButton title="Change Selected Ingredients" image="cook.png" colour="#59BDCD" backColour="#E3DEC9" todo={ () => console.log('Chnge Selected Ingredient')}/>
<View style={{marginTop: 10}}/>
<View style={{marginTop: "3%"}}/>
<ValidateButton title="Search Recipes" image="search.png" colour="#59BDCD" backColour="#E3DEC9" todo={ () => console.log('Go and search for recipe')}/>
</View>
<View style={{marginBottom: "20%"}}/>
</LinearGradient>
</View>
</ScrollView>
</SafeAreaProvider>
);
}
const styles = StyleSheet.create({
container: {
height: "100%",
width: "100%",
flex: 1,
backgroundColor: '#3F3C42',
@ -114,53 +119,51 @@ const styles = StyleSheet.create({
justifyContent: 'center',
},
linearGradient: {
height: "100%",
width: "100%",
flex: 1,
padding: 10,
padding: "2%",
paddingTop: 0,
},
separator: {
marginTop: "6%"
},
filterBar: {
flexDirection: "row",
width: 300,
paddingTop: 10,
paddingBottom: 5,
width: "85%",
paddingTop: "3%",
paddingBottom: "2%",
alignItems: "flex-end",
justifyContent: "center",
flex: 0.2,
},
filters: {
flex: 0.8,
fontSize: 20,
color: '#ACA279',
flex: 1,
padding: 5,
paddingLeft: 0,
paddingBottom: 0,
},
nbSelected: {
fontSize: 11,
color: "#3F3C42",
textAlign: "right",
},
profilesSelection: {
flexDirection: 'column',
alignItems: 'center',
justifyContent: 'center',
borderRadius: 20,
backgroundColor: '#F2F0E4',
paddingTop: 5,
marginHorizontal: 10,
marginHorizontal: "3%",
paddingBottom: "3%",
},
welcome: {
flexDirection: 'column',
alignItems: 'center',
justifyContent: 'center',
borderRadius: 20,
backgroundColor: '#F2F0E4',
paddingVertical: 10,
paddingHorizontal: 25,
marginHorizontal: 10,
paddingVertical: "3%",
paddingHorizontal: "7%",
marginHorizontal: "3%",
},
text: {
fontSize: 20,
@ -170,10 +173,9 @@ const styles = StyleSheet.create({
fontSize: 20,
fontWeight: "bold",
color: '#59BDCD',
textAlign: "left",
},
ingredientSelection: {
flexDirection: 'column',
width: "90%",
alignItems: 'center',
justifyContent: 'center',
@ -181,7 +183,23 @@ const styles = StyleSheet.create({
backgroundColor: '#E3DEC9',
borderWidth: 2,
borderColor: "#ACA279",
marginHorizontal: 10,
padding: 5
padding: "2%"
},
appName: {
fontSize: 20,
fontWeight: "bold",
color: '#3F3C42',
textAlign: "center",
flex: 0.8,
},
topBar: {
flexDirection: 'row',
width: "100%",
height: "11%",
alignItems: 'center',
justifyContent: 'center',
backgroundColor: '#F2F0E4',
paddingTop: "8%",
},
});

17
LeftOvers/screens/ModifyProfile.tsx
Unescape View File

@ -1,5 +1,5 @@
import React from 'react';
import {StyleSheet, View} from 'react-native';
import {StyleSheet, View, ScrollView, useWindowDimensions} from 'react-native';
import ProfileModification from '../components/ProfileModification';
import ValidateButton from '../components/ValidateButton';
import TopBar from '../components/TopBar';
@ -10,15 +10,16 @@ export default function ModifyProfile(props) {
const all = [{value: "Mussels"}, {value: "Skimmed Milk"}, {value: "Nuts"}]
const die = [{value: "Dairy free"}, {value: "Gluten free"}, {value: "Porkless"}, {value: "Vegan"}, {value: "Vegetarian"}, {value: "Pescatarian"}]
return (
<SafeAreaProvider>
<View style={styles.container}>
<LinearGradient colors={['#2680AA', '#59BDCD']} style={styles.linearGradient}>
<View style={{marginTop: 20}}/>
<SafeAreaProvider style={{flex: 1}}>
<ScrollView style={{minHeight: useWindowDimensions().height}}>
<LinearGradient colors={['#2680AA', '#59BDCD']} style={[styles.linearGradient, {minHeight: useWindowDimensions().height}]}>
<View style={{marginTop: "6%"}}/>
<ProfileModification name="Johnny Silverhand" avatar="plus_small.png" diets={die} allergies={all}></ProfileModification>
<View style={{marginTop: 10}}/>
<View style={{marginTop: "3%"}}/>
<ValidateButton title="Update Profile" image="update.png" colour="#ACA279" backColour="#F2F0E4"></ValidateButton>
<View style={{marginBottom: "20%"}}/>
</LinearGradient>
</View>
</ScrollView>
</SafeAreaProvider>
);
}
@ -36,7 +37,7 @@ const styles = StyleSheet.create({
height: "100%",
width: "100%",
flex: 1,
padding: 10,
padding: "2%",
paddingTop: 0,
},
});

73
LeftOvers/screens/Profiles.tsx
Unescape View File

@ -1,12 +1,12 @@
import React from 'react';
import { useState } from 'react';
import {StyleSheet, View, Modal, Pressable, Text, Image} from 'react-native';
import ProfileDetails from '../components/ProfileDetails';
import ProfileDelete from '../components/ProfileDelete';
import TopBar from '../components/TopBar';
import { StyleSheet, View, Modal, Pressable, Text, Image, ScrollView } from 'react-native';
import {LinearGradient} from 'expo-linear-gradient';
import {SafeAreaProvider} from 'react-native-safe-area-context';
import ProfileDetails from '../components/ProfileDetails';
import ProfileDelete from '../components/ProfileDelete';
export default function Profiles({props, navigation}) {
const allJohnny = [{value: "Coconut"}, {value: "Skimmed Milk"}, {value: "Nuts"}]
const dieJohnny = [{value: "Gluten free"}, {value: "Porkless"}, {value: "Pescatarian"}]
@ -24,7 +24,7 @@ export default function Profiles({props, navigation}) {
const [opacity, setOpacity] = useState(1);
const raisePopUp = () => {
setVisible(true)
setOpacity(0.4)
setOpacity(0.3)
}
const erasePopUp = () => {
setVisible(false)
@ -32,19 +32,18 @@ export default function Profiles({props, navigation}) {
}
return (
<SafeAreaProvider>
<View style={styles.container}>
<SafeAreaProvider style={{flex: 1}}>
<ScrollView>
<View style={{opacity: opacity, height: "100%", width: "100%", flex: 1, backgroundColor: '#3F3C42',}}>
<LinearGradient colors={['#2680AA', '#59BDCD']} style={styles.linearGradient}>
<View style={{marginTop: 10}}/>
<LinearGradient colors={['#2680AA', '#59BDCD']} style={[styles.linearGradient, {minHeight: useWindowDimensions().height}]}>
<View style={styles.separator}/>
<ProfileDetails name="Johnny Silverhand" avatar="plus_small.png" diets={dieJohnny} allergies={allJohnny} onDeleteProfile={raisePopUp} navigation={navigation}></ProfileDetails>
<View style={{marginTop: 10}}/>
<View style={styles.separator}/>
<ProfileDetails name="Jackie Welles" avatar="plus_small.png" diets={dieJackie} allergies={allJackie} onDeleteProfile={raisePopUp} navigation={navigation}></ProfileDetails>
<View style={{marginTop: 10}}/>
<View style={styles.separator}/>
<ProfileDetails name="Goro Takemura" avatar="plus_small.png" diets={dieGoro} allergies={allGoro} onDeleteProfile={raisePopUp} navigation={navigation}></ProfileDetails>
<View style={{marginTop: 10}}/>
<View style={styles.separator}/>
<ProfileDetails name="Viktor Vector" avatar="plus_small.png" diets={dieViktor} allergies={allViktor} onDeleteProfile={raisePopUp} navigation={navigation}></ProfileDetails>
<View style={{marginTop: 10}}/>
<View style={styles.modal}>
<Modal visible={visible} onRequestClose={erasePopUp} animationType="fade" transparent={true}>
<View style={styles.modal}>
@ -57,13 +56,13 @@ export default function Profiles({props, navigation}) {
<View style={styles.decisionBar}>
<Pressable onPress={erasePopUp} style={{flex:0.5}}>
<View style={styles.yesButton}>
<Image source={require("../assets/images/validate.png")} style={{tintColor: "#2DE04A", height: 30, width: 30, flex: 0.2, margin: 10}}/>
<Image source={require("../assets/images/validate.png")} style={{tintColor: "#2DE04A", height: "100%", flex: 0.2, margin: "5%", resizeMode: "contain"}}/>
<Text style={styles.yesText}>Yes</Text>
</View>
</Pressable>
<Pressable onPress={erasePopUp} style={{flex:0.5}}>
<View style={styles.noButton}>
<Image source={require("../assets/images/cross.png")} style={{tintColor: "#E02D2D", height: 30, width: 30, flex: 0.2, margin: 10}}/>
<Image source={require("../assets/images/cross.png")} style={{tintColor: "#E02D2D", height: "100%", flex: 0.2, margin: "5%", resizeMode: "contain"}}/>
<Text style={styles.noText}>No</Text>
</View>
</Pressable>
@ -73,9 +72,10 @@ export default function Profiles({props, navigation}) {
</View>
</Modal>
</View>
<View style={{marginBottom: "20%"}}/>
</LinearGradient>
</View>
</View>
</ScrollView>
</SafeAreaProvider>
);
}
@ -88,6 +88,7 @@ const styles = StyleSheet.create({
backgroundColor: '#3F3C42',
alignItems: 'center',
justifyContent: 'center',
marginBottom: 10,
},
linearGradient: {
height: "100%",
@ -96,39 +97,37 @@ const styles = StyleSheet.create({
padding: 10,
paddingTop: 0,
},
separator: {
marginTop: "6%"
},
modal: {
position: 'absolute',
top: '50%',
left: '50%',
top: '8%',
justifyContent: "center",
alignItems: "center",
width: "100%",
transform: [{ translateX: -207 }, { translateY: -140 }],
},
viewModal: {
flexDirection: "column",
padding: 10,
padding: "3%",
alignItems: "center",
justifyContent: "center",
width: "100%",
height: 200,
flex: 1,
},
profileValidation: {
width: "100%",
alignItems: "center",
justifyContent: "center",
paddingBottom: 20,
marginBottom: "6%",
flex: 0.7,
},
decisionBarVertical: {
flexDirection: "column",
width: "100%",
padding: 10,
height: "100%",
width: "90%",
padding: "3%",
borderRadius: 15,
alignItems: "center",
justifyContent: "center",
@ -140,23 +139,21 @@ const styles = StyleSheet.create({
alignItems: 'center',
justifyContent: 'center',
flex: 0.3,
padding: 5,
marginBottom: "2%",
marginHorizontal: "2%",
},
decisionBar: {
flexDirection: "row",
flex: 0.7,
width: "100%",
height: "20%",
borderRadius: 15,
alignItems: "center",
justifyContent: "center",
backgroundColor: "#F2F0E4",
},
yesButton: {
flexDirection: "row",
flex: 0.5,
padding: 10,
marginHorizontal: 10,
padding: "2%",
marginHorizontal: "5%",
width: "90%",
borderRadius: 20,
alignItems: "center",
@ -169,13 +166,13 @@ const styles = StyleSheet.create({
alignItems: 'center',
justifyContent: 'center',
flex: 0.7,
padding: 5,
padding: "4%",
},
noButton: {
flexDirection: "row",
flex: 0.5,
padding: 10,
marginHorizontal: 10,
padding: "2%",
marginHorizontal: "5%",
width: "90%",
borderRadius: 20,
alignItems: "center",
@ -188,6 +185,6 @@ const styles = StyleSheet.create({
alignItems: 'center',
justifyContent: 'center',
flex: 0.7,
padding: 5,
padding: "4%",
},
});
Write Preview
Loading…
Cancel
Save