Skip to content
This repository has been archived by the owner on Nov 4, 2022. It is now read-only.

Commit

Permalink
Merge pull request #25 from markscamilleri/font2
Browse files Browse the repository at this point in the history 
Font2
  • Loading branch information
@teeks98
teeks98 authored Dec 12, 2019
2 parents 0f36388 + c588cb6 commit b3377ed
Show file tree
Hide file tree
Showing 24 changed files with 11,398 additions and 3,464 deletions.
187 changes: 87 additions & 100 deletions Frontend/App.js
View file
Original file line number Diff line number Diff line change
@@ -1,31 +1,32 @@
import React, {useEffect, useState} from 'react';
import React, {useState} from 'react';
import { View, ScrollView, TouchableOpacity, Text, TextInput, StyleSheet, Platform, Dimensions, StatusBar, ProgressViewIOS,
ProgressBarAndroid } from 'react-native';
import Icon from '@expo/vector-icons/Ionicons';
import { createSwitchNavigator, createAppContainer} from 'react-navigation';
import { createBottomTabNavigator } from 'react-navigation-tabs';
import { createStackNavigator } from 'react-navigation-stack';
import { createDrawerNavigator } from 'react-navigation-drawer';
import { Toolbar, ThemeContext as TP, COLOR, getTheme } from 'react-native-material-ui';
import { Button, ThemeProvider } from 'react-native-elements';
import { Button, ThemeProvider, Divider } from 'react-native-elements';
import Constants from 'expo-constants';
import MapView, { PROVIDER_GOOGLE, Marker } from 'react-native-maps';

import { StateProvider, useStateValue } from './StateContext.js';
import Rainbow from 'rainbowvis.js';
import MapSearch from './screens/MapSearch.js';
import MapData from './screens/MapData.js';
import LiveMap from './screens/MapData.js';
import Login from './screens/Login.js';
import Signup from './screens/Signup.js';

const systemFonts = (Platform.OS === 'android' ? 'Roboto' : 'Arial');

const uiTheme = {
palette: {
primaryColor: '#002366',
primaryColor: '#455a64',
},
toolbar: {
container: {
height: 60,
},
},
fontFamily: systemFonts
fontFamily: systemFonts
};

const buttontheme = {
Expand All @@ -39,14 +40,14 @@ const buttontheme = {
}

const styles = StyleSheet.create({

container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
fontFamily: systemFonts,
},
},
title: {
marginTop: Constants.statusBarHeight + 20,
fontSize: 18,
Expand Down Expand Up @@ -74,104 +75,91 @@ const styles = StyleSheet.create({
});


const WelcomeScreen = ({navigation}) => {

const Welcome = ({navigation}) => {
var myRainbow = new Rainbow();
myRainbow.setSpectrum('red', 'yellow', 'green');
const [{ userDetails }, dispatch] = useStateValue();
return (
<>
<View style={styles.nav}>
<StatusBar barStyle="dark-content" />
<TP.Provider value={getTheme(uiTheme)}>
<Toolbar
centerElement="ASE Project Group 2 | Home"
/>
</TP.Provider>
<View style={styles.button}>
<ThemeProvider theme={buttontheme}>
<Button
title="LOGIN"
onPress={()=>{{navigation.navigate('Dashboard')}}}
/>
</ThemeProvider>
</View>
</View>
<View style={{alignContent: 'center'}}>
<Text style={{fontSize: 20, marginTop: 10, textAlign: 'center'}}>Welcome {userDetails.username}</Text>
<Text style={{textAlign: 'center'}}>Welcome to the Map App</Text>
<Text style={{textAlign: 'center', marginTop: 10}}>Choose to display your current location and view property prices in 'LiveMap'
or enter a given location to view property prices within a given radius in 'MapSearch'. Enjoy!</Text>
<Text style={{textAlign: 'center', marginTop: 10}}>Edit your settings within the 'Settings' page. These you can customize
your given radius and number of postcodes searched for within the radius. The logout button is located here! </Text>
<Text style={{textAlign: 'center', marginTop: 10}}>Properties are colour coded with a gradient effect to visually show their prices where red is the
most expensive and green is the cheapest in the radius.</Text>
</View>
</>
);
}



const DashboardScreen = ({navigation}) => {


return (
<>
<View style={styles.nav}>
<StatusBar barStyle="dark-content" />
<TP.Provider value={getTheme(uiTheme)}>
<Toolbar
leftElement="menu"
centerElement="ASE Project Group 2"
onLeftElementPress={
() => navigation.openDrawer()
}
/>
</TP.Provider>
</View>
</>
);
}

const Settings = ({navigation}) => {
const [value, setValue] = useState('');

const [{ mapprops }, dispatch] = useStateValue();
const [radi, setRadi] = useState(mapprops.radius);
const [limi, setLimi] = useState(mapprops.limit);

return (
<View style={styles.nav}>
<TP.Provider value={getTheme(uiTheme)}>
<Toolbar
centerElement="ASE Project Group 2 | Map"
centerElement="ASE Project Group 2 | Settings"
/>
</TP.Provider>
<Text style={{textAlign: 'center', marginTop: 10}}>---Change MapView Settings---</Text>
<Text style={{textAlign: 'center', marginTop: 10, fontSize: 20}}>Change MapView Settings</Text>
<View style={styles.button}>

<Text style={{marginBottom: 5}}>Set Search Radius (Meters):</Text>
<TextInput
<TextInput
style={{height: 30, borderWidth: 1, marginBottom: 10, borderRadius: 5}}
onChangeText={text => setValue(text)}
defaultValue={value}
onChangeText={rad => setRadi(rad)}
defaultValue={mapprops.radius+""}
/>

<Text style={{ marginBottom: 5}}>Set Number of Results:</Text>
<TextInput
<Text style={{ marginBottom: 5}}>Set Number of Postcodes:</Text>
<TextInput
style={{height: 30, borderWidth: 1, marginBottom: 10, borderRadius: 5}}
onChangeText={text => setValue(text)}
defaultValue={value}
onChangeText={lim => setLimi(lim)}
defaultValue={mapprops.limit+""}
/>

<ThemeProvider theme={buttontheme}>
<Button
title="Submit"
onPress={()=>{{}}}
onPress={() => dispatch({
type: 'changeParams',
params: { radius: radi, limit: limi}
})}
/>
</ThemeProvider>
</View>
</View>
);
}

const Search = ({navigation}) => {
return (
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
<StatusBar barStyle="light-content" />
<Text>Profile</Text>
<Divider style={{ marginTop: 10, backgroundColor: '#455a64' , height: 5}} />

<View style={styles.button}><ThemeProvider theme={buttontheme}>
<Button
title="LOGOUT"
onPress={()=>{{console.log("LOGOUT")} {navigation.navigate("Login")}}}
/>
</ThemeProvider></View>
</View>
</View>
);
}


const DashboardTabNavigator = createBottomTabNavigator(
{
MapData,
Welcome,
LiveMap,
MapSearch,
Settings,
},
Expand All @@ -188,45 +176,44 @@ const DashboardTabNavigator = createBottomTabNavigator(
}
);

const DashboardStackNavigator = createStackNavigator(
{
DashboardTabNavigator: DashboardTabNavigator
},
{

defaultNavigationOptions: ({ navigation }) => {
return {
headerLeft: (
<>
<Icon
style={{ paddingLeft: 10, backgroundColor: '#002366', color: 'white' }}
onPress={() => navigation.openDrawer()}
name="md-menu"
size={30}
/>
</>
)
};
}
}
);

const AppDrawerNavigator = createDrawerNavigator({
Home: {
screen: DashboardStackNavigator
},
DashboardScreen: {
screen: DashboardScreen
}
});


const AppSwitchNavigator = createSwitchNavigator({
Welcome: { screen: WelcomeScreen },
Dashboard: { screen: DashboardTabNavigator }
Login: { screen: Login },
Dashboard: { screen: DashboardTabNavigator },
Signup: {screen: Signup }
});


const App = createAppContainer(AppSwitchNavigator);

export default App;
export default function mem() {

const initialState = {
mapprops: { radius: 100, limit: 100 },
userDetails: {username: ''}
};

const reducer = (state, action) => {
switch (action.type) {
case 'changeParams':
return {
...state,
mapprops: action.params
};
case 'addUsername':
return {
...state,
userDetails: action.params
};

default:
return state;
}
};

return (
<StateProvider initialState={initialState} reducer={reducer}>
<App />
</StateProvider>
);
}
Loading

0 comments on commit b3377ed

Please sign in to comment.