Some small changes throughout the app to improve it

This commit is contained in:
M10T 2020-11-06 16:34:17 -05:00
parent a2dcb7a623
commit 62146eccd1
9 changed files with 48 additions and 67 deletions

View File

@ -31,9 +31,9 @@ const Announcement = ({item}) => {
const dateStr = `${date.getMonth()+1}/${date.getDate()}/${date.getFullYear()}`
const dateInfo = dateStr===item.item.date&&item.item.time!==undefined?item.item.time:item.item.date;
return (
<View style={styles.item}>
<View style={styles.item1}>
{dateInfo!==undefined?<Text style={styles.date}>{dateInfo}</Text>:<></>}
<Text style={styles.title}>{item.item.message}</Text>
<Text style={{fontSize:20}}>{item.item.message}</Text>
</View>
)
}
@ -51,13 +51,13 @@ export const TeacherList = ({route}) => {
}
function TeacherButton(props) {
const [color, setColor] = useState(props.color?props.color:'white')
const [color, setColor] = useState(props.color?props.color:'lightgrey')
return (
<View style={[styles.item,{flexDirection:'row'}]}>
<View style={[styles.item1,{flexDirection:'row'}]}>
<TouchableOpacity style={{flex:1}} onPress={()=>props.navigation.navigate('TeacherList',{data:props.data,name:props.name})} activeOpacity={0.8}>
<Text style={styles.title}>{props.name}</Text>
</TouchableOpacity>
{props.icon?<Icon.Button color={color} backgroundColor="#bababa" name="star" size={30} style={{alignSelf:'center'}} onPress={()=>{setColor(color=='yellow'?'white':'yellow');props.addFavorite(props.name)}}/>:<></>}
{props.icon?<Icon.Button color={color} name="star" size={30} style={{alignSelf:'center'}} backgroundColor="white" onPress={()=>{setColor(color=='#dba309'?'lightgrey':'#dba309');props.addFavorite(props.name)}}/>:<></>}
</View>
)
}
@ -120,7 +120,7 @@ class Announcements extends React.Component {
<TeacherButton data={this.state.data.filter(x=>x.teacher==null||x.teacher.trim()==='')} name="No Teacher" navigation={this.props.navigation} />
<FlatList
data={this.state.favoriteNames.concat(this.state.teacherNames.filter(x=>this.state.favoriteNames.map(({name})=>name).indexOf(x.name) < 0))}
renderItem={({item})=><TeacherButton color={this.state.favoriteNames.indexOf(item) >= 0?'yellow':'white'} item={item} data={this.state.data.filter(x=>x.teacher===item.name)} name={item.name} navigation={this.props.navigation} icon={true} addFavorite={this.addFavorite}/>}
renderItem={({item})=><TeacherButton color={this.state.favoriteNames.indexOf(item) >= 0?'#dba309':'lightgrey'} item={item} data={this.state.data.filter(x=>x.teacher===item.name)} name={item.name} navigation={this.props.navigation} icon={true} addFavorite={this.addFavorite}/>}
keyExtractor={(item,index)=>item.name+index}
/>
</View>

View File

@ -25,6 +25,7 @@ import { NavigationContainer } from '@react-navigation/native'
import { createStackNavigator } from '@react-navigation/stack'
import { SearchBar } from 'react-native-elements';
import styles from './styles/liststyles'
import morestyles from './styles/morestyles'
import { url } from './resources/fetchInfo.json'
import LinearGradient from 'react-native-linear-gradient';
@ -79,7 +80,9 @@ function Club () {
name = "ClubInfo"
component = {ClubInfo}
options={({route})=>({
title:route.params.name
title:route.params.name,
headerTitleStyle:[morestyles.headerTitle,{alignSelf:'center'}],
headerRight:()=>(<></>)
})}
/>
</Stack.Navigator>

View File

@ -28,7 +28,6 @@ export const LunchInfo = ({route}) => {
const item = route.params;
return (
<View style = {{padding: 10}}>
<Text style = {styles.eventTitle}>{item.name}</Text>
<View style ={styles.infoContainer}>
<Text style = {styles.title1}>Description: </Text>
<Text style = {styles.title}>{item.text}</Text>
@ -55,30 +54,6 @@ function LunchEvent (props) {
)
}
function Lunch () {
return (
<NavigationContainer independent={true}>
<Stack.Navigator>
<Stack.Screen
name = "LunchEvents"
component = {LunchEvents}
options={({
headerShown: false
})}
/>
<Stack.Screen
name = "LunchInfo"
component = {LunchInfo}
options={({route})=>({
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
title:route.params.name
})}
/>
</Stack.Navigator>
</NavigationContainer>
)
}
class LunchEvents extends React.Component {
constructor(props) {
@ -117,5 +92,5 @@ class LunchEvents extends React.Component {
}
}
export default Lunch;
export default LunchEvents;

View File

@ -25,8 +25,8 @@ import styles from './styles/morestyles'
import Announcements, {TeacherList} from './Announcements'
import Resources from './Resources'
import StudentWeek from './StudentWeek'
import SSLOps from './SSLOps'
import LunchEvents from './LunchEvents'
import SSLOps, {SSLInfo} from './SSLOps'
import LunchEvents, {LunchInfo} from './LunchEvents'
import ChallengeWeek from './ChallengeWeek'
import { LinearGradient } from 'react-native-linear-gradient'
@ -133,7 +133,24 @@ class More extends React.Component {
name="TeacherList"
component={TeacherList}
options={({route})=>({
headerTitleStyle:[styles.headerTitle,{alignSelf:'center',marginLeft:"-20%"}],
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
title:route.params.name,
headerRight:()=>(<></>)
})}
/>
<Stack.Screen
name="LunchInfo"
component={LunchInfo}
options={({route})=>({
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
title:route.params.name
})}
/>
<Stack.Screen
name="SSLInfo"
component={SSLInfo}
options={({route})=>({
headerTitleStyle:[styles.headerTitle,{alignSelf:'center'}],
title:route.params.name
})}
/>

View File

@ -30,7 +30,6 @@ export const SSLInfo = ({route}) => {
console
return (
<View style = {{padding: 10}}>
<Text style = {styles.eventTitle}>{item.name}</Text>
<View style ={styles.infoContainer}>
<Text style = {styles.title1}>Description: </Text>
<Text style = {styles.title}>{item.text}</Text>
@ -60,28 +59,6 @@ function SSLElement (props) {
</View>
)
}
function SSLOpp () {
return (
<NavigationContainer independent={true}>
<Stack.Navigator>
<Stack.Screen
name = "SSLOps"
component = {SSLOps}
options={({
headerShown: false
})}
/>
<Stack.Screen
name = "SSLInfo"
component = {SSLInfo}
options={({route})=>({
title:route.params.title
})}
/>
</Stack.Navigator>
</NavigationContainer>
)
}
class SSLOps extends React.Component {
@ -121,4 +98,4 @@ class SSLOps extends React.Component {
}
}
export default SSLOpp;
export default SSLOps;

View File

@ -9,7 +9,8 @@ import {
ActivityIndicator,
FlatList,
TouchableOpacity,
Image
Image,
Linking
} from 'react-native';
import {
@ -24,8 +25,8 @@ import styles from './styles/liststyles'
import { url } from './resources/fetchInfo.json'
const StaffElement = ({item}) => {
const [visible, setVisible] = useState(0)
const extra = [...item.item.emails.map(email=>(<Text key={email}>{'\n'}Email: {email}</Text>))]
const [visible, setVisible] = useState(false)
const extra = [...item.item.emails.map(email=>(<Text key={email}>{'\n'}Email: <Text style={styles.linktext} onPress={()=>Linking.openURL("mailto:"+email)}>{email}</Text></Text>))]
return(
<View>
<TouchableOpacity style={styles.item1} onPress={()=>setVisible(!visible)} activeOpacity={0.8}>

View File

@ -6,12 +6,10 @@ const styles = StyleSheet.create({
marginTop: StatusBar.currentHeight || 0,
},
item: {
backgroundColor: '#bababa',
backgroundColor: 'white',
padding: 20,
marginHorizontal: 16,
borderBottomWidth: 1.5,
borderColor: 'black',
borderRadius: 12,
borderColor: 'black'
},
item1: {
backgroundColor: 'white',
@ -63,6 +61,10 @@ const styles = StyleSheet.create({
fontWeight: 'bold',
padding: 5,
marginBottom: 10,
},
linktext: {
color:'blue',
textDecorationLine: 'underline'
}
});

5
package-lock.json generated
View File

@ -10136,6 +10136,11 @@
"resolved": "https://registry.npmjs.org/react-native-screens/-/react-native-screens-2.10.1.tgz",
"integrity": "sha512-Z2kKSk4AwWRQNCBmTjViuBQK0/Lx0jc25TZptn/2gKYUCOuVRvCekoA26u0Tsb3BIQ8tWDsZW14OwDlFUXW1aw=="
},
"react-native-splash-screen": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/react-native-splash-screen/-/react-native-splash-screen-3.2.0.tgz",
"integrity": "sha512-Ls9qiNZzW/OLFoI25wfjjAcrf2DZ975hn2vr6U9gyuxi2nooVbzQeFoQS5vQcbCt9QX5NY8ASEEAtlLdIa6KVg=="
},
"react-native-status-bar-height": {
"version": "2.5.0",
"resolved": "https://registry.npmjs.org/react-native-status-bar-height/-/react-native-status-bar-height-2.5.0.tgz",

View File

@ -23,6 +23,7 @@
"react-native-reanimated": "^1.10.2",
"react-native-safe-area-context": "^3.1.4",
"react-native-screens": "^2.10.1",
"react-native-splash-screen": "^3.2.0",
"react-native-vector-icons": "^7.0.0"
},
"devDependencies": {