2020-10-25 02:57:39 -04:00
|
|
|
import React, { useState } from 'react';
|
2020-08-09 17:01:25 -04:00
|
|
|
import {
|
|
|
|
|
SafeAreaView,
|
|
|
|
|
StyleSheet,
|
|
|
|
|
ScrollView,
|
|
|
|
|
View,
|
|
|
|
|
Text,
|
|
|
|
|
StatusBar,
|
2020-10-25 02:57:39 -04:00
|
|
|
Modal,
|
|
|
|
|
TouchableHighlight,
|
|
|
|
|
Image,
|
2020-12-23 00:23:53 -05:00
|
|
|
FlatList,
|
2020-12-24 01:35:25 -05:00
|
|
|
Linking,
|
2020-08-09 17:01:25 -04:00
|
|
|
} from 'react-native';
|
|
|
|
|
|
|
|
|
|
import {
|
|
|
|
|
Header,
|
|
|
|
|
LearnMoreLinks,
|
|
|
|
|
Colors,
|
|
|
|
|
DebugInstructions,
|
|
|
|
|
ReloadInstructions,
|
|
|
|
|
} from 'react-native/Libraries/NewAppScreen';
|
2020-10-25 02:57:39 -04:00
|
|
|
import styles from './styles/morestyles'
|
2020-12-23 00:23:53 -05:00
|
|
|
import liststyles from './styles/liststyles'
|
2020-12-21 22:34:09 -05:00
|
|
|
import { url } from './resources/fetchInfo.json'
|
|
|
|
|
import LinearGradient from 'react-native-linear-gradient';
|
2020-12-23 00:23:53 -05:00
|
|
|
import StudentWeek from './StudentWeek';
|
|
|
|
|
import { TouchableOpacity } from 'react-native-gesture-handler';
|
|
|
|
|
import { NavigationContainer } from '@react-navigation/native'
|
|
|
|
|
import { createStackNavigator } from '@react-navigation/stack'
|
2020-12-24 01:35:25 -05:00
|
|
|
import Announcements from './Announcements'
|
2020-12-23 00:23:53 -05:00
|
|
|
import AsyncStorage from '@react-native-community/async-storage'
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const getCurrentDate=()=>{
|
|
|
|
|
var date = new Date().getDate();
|
|
|
|
|
var month = new Date().getMonth() + 1;
|
|
|
|
|
var year = new Date().getFullYear();
|
|
|
|
|
|
2020-12-24 01:35:25 -05:00
|
|
|
return year + ',' + month + ',' + date;
|
|
|
|
|
}
|
|
|
|
|
const getWeekDate=()=>{
|
|
|
|
|
var date = new Date().getDate()-8;
|
|
|
|
|
var month = new Date().getMonth()+1;
|
|
|
|
|
var year = new Date().getFullYear();
|
|
|
|
|
|
|
|
|
|
return year + ',' + month + ',' + date;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const STORAGE_KEY = "teacherAnnouncements"
|
|
|
|
|
const Stack = createStackNavigator()
|
|
|
|
|
|
|
|
|
|
const Announcement = ({item}) => {
|
|
|
|
|
const date = new Date
|
|
|
|
|
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={liststyles.item1}>
|
|
|
|
|
<View style = {{display: 'flex', flexDirection: 'row', justifyContent: 'space-between'}}>
|
|
|
|
|
<View style = {{width: '75%'}}>
|
|
|
|
|
<Text style={liststyles.title3}>{item.item.message}</Text>
|
|
|
|
|
</View>
|
|
|
|
|
<View style = {{display: 'flex', flexDirection: 'row'}}>
|
|
|
|
|
{dateInfo!==undefined?<Text style={{fontSize: 16, alignSelf: 'center'}}>{dateInfo}</Text>:<></>}
|
|
|
|
|
</View>
|
|
|
|
|
</View>
|
|
|
|
|
|
|
|
|
|
</View>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
export const TeacherList = ({route}) => {
|
|
|
|
|
return (
|
|
|
|
|
<View style={{}}>
|
|
|
|
|
<FlatList
|
|
|
|
|
data={route.params.data}
|
|
|
|
|
renderItem={item=><Announcement item={item}/>}
|
|
|
|
|
keyExtractor={item=>JSON.stringify(item)}
|
|
|
|
|
/>
|
|
|
|
|
</View>
|
|
|
|
|
)
|
2020-12-23 00:23:53 -05:00
|
|
|
}
|
|
|
|
|
|
2020-12-24 01:35:25 -05:00
|
|
|
export const whatsNew = ({route}) => {
|
|
|
|
|
const item = route.params
|
|
|
|
|
return (
|
|
|
|
|
<View style={{display:'flex', paddingHorizontal: '2%', backgroundColor: 'white', height: '100%'}}>
|
|
|
|
|
<View style={{height: '33%'}}>
|
|
|
|
|
<Text style={[liststyles.homeTitle, {marginBottom: '2%'}]}>Today</Text>
|
|
|
|
|
<ScrollView horizontal='true' style={{height: '100%', display: 'flex', flexDirection: 'row', paddingHorizontal: '2%'}}>
|
|
|
|
|
<View style={{display:'flex', flexDirection: 'row'}}>
|
|
|
|
|
<FlatList
|
|
|
|
|
data={item.data}
|
|
|
|
|
renderItem={item=><Today item={item}/>}
|
|
|
|
|
keyExtractor={item=>JSON.stringify(item)}
|
|
|
|
|
horizontal
|
|
|
|
|
/>
|
|
|
|
|
</View>
|
|
|
|
|
</ScrollView>
|
|
|
|
|
</View>
|
|
|
|
|
<View style={{height: '33%'}}>
|
|
|
|
|
<Text style={[liststyles.homeTitle, {marginBottom: '2%'}]}>Future</Text>
|
|
|
|
|
<ScrollView horizontal='true' style={{height: '100%', display: 'flex', flexDirection: 'row', paddingHorizontal: '2%'}}>
|
|
|
|
|
<View style={{display:'flex', flexDirection: 'row'}}>
|
|
|
|
|
<FlatList
|
|
|
|
|
data={item.data}
|
|
|
|
|
renderItem={item=><Future item={item}/>}
|
|
|
|
|
keyExtractor={item=>JSON.stringify(item)}
|
|
|
|
|
horizontal
|
|
|
|
|
/>
|
|
|
|
|
</View>
|
|
|
|
|
</ScrollView>
|
|
|
|
|
</View>
|
|
|
|
|
<View style={{height: '33%'}}>
|
|
|
|
|
<Text style={[liststyles.homeTitle, {marginBottom: '2%'}]}>Past Week</Text>
|
|
|
|
|
<ScrollView horizontal='true' style={{height: '100%', display: 'flex', flexDirection: 'row', paddingHorizontal: '2%'}}>
|
|
|
|
|
<View style={{display:'flex', flexDirection: 'row'}}>
|
|
|
|
|
<FlatList
|
|
|
|
|
data={item.data}
|
|
|
|
|
renderItem={item=><PastWeek item={item}/>}
|
|
|
|
|
keyExtractor={item=>JSON.stringify(item)}
|
|
|
|
|
horizontal
|
|
|
|
|
/>
|
|
|
|
|
</View>
|
|
|
|
|
</ScrollView>
|
|
|
|
|
</View>
|
|
|
|
|
</View>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const Today = ({item}) => {
|
|
|
|
|
const newIconURI = item.item.icon !== undefined?`data:image/png;charset=utf-8;base64,${item.item.icon}`:''
|
2020-12-23 00:23:53 -05:00
|
|
|
const today = new Date(getCurrentDate())
|
|
|
|
|
const itemDate = new Date(item.item.date)
|
|
|
|
|
|
2020-12-24 01:35:25 -05:00
|
|
|
if (itemDate.getTime() == today.getTime()) {
|
2020-12-23 00:23:53 -05:00
|
|
|
return (
|
2020-12-24 01:35:25 -05:00
|
|
|
<View style={{display:'flex', borderWidth:2, borderColor: 'black', borderRadius: 8, width: 120, height: '100%', marginRight: 10}} onPress={()=>setVisible(!visible)} activeOpacity={0.8}>
|
|
|
|
|
<Image source = {{newIconURI}} style = {{height: '76%', width: '100%', borderTopLeftRadius: 8, borderTopRightRadius: 8}}/>
|
2020-12-24 02:34:47 -05:00
|
|
|
<View style={{height: '24%', paddingHorizontal: '2%', borderTopWidth: 1}}>
|
2020-12-24 01:35:25 -05:00
|
|
|
<Text style={{fontSize: 16}}>{item.item.name}</Text>
|
|
|
|
|
<Text style={{fontSize: 12}}>{item.item.date}</Text>
|
2020-12-23 00:23:53 -05:00
|
|
|
</View>
|
2020-12-24 01:35:25 -05:00
|
|
|
</View>
|
2020-12-23 00:23:53 -05:00
|
|
|
)
|
|
|
|
|
}
|
2020-12-24 01:35:25 -05:00
|
|
|
else {
|
2020-12-23 00:23:53 -05:00
|
|
|
return (
|
2020-12-24 01:35:25 -05:00
|
|
|
null
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
const Future = ({item}) => {
|
|
|
|
|
const newIconURI = item.item.icon !== undefined?`data:image/png;charset=utf-8;base64,${item.item.icon}`:''
|
|
|
|
|
const today = new Date(getCurrentDate())
|
|
|
|
|
const itemDate = new Date(item.item.date)
|
|
|
|
|
|
|
|
|
|
if (itemDate.getTime() > today.getTime()) {
|
|
|
|
|
return (
|
|
|
|
|
<View style={{display:'flex', borderWidth:2, borderColor: 'black', borderRadius: 8, width: 120, height: '100%', marginRight: 10}} onPress={()=>setVisible(!visible)} activeOpacity={0.8}>
|
|
|
|
|
<Image source = {{newIconURI}} style = {{height: '76%', width: '100%', borderTopLeftRadius: 8, borderTopRightRadius: 8}}/>
|
2020-12-24 02:34:47 -05:00
|
|
|
<View style={{height: '24%', paddingHorizontal: '2%', borderTopWidth: 1}}>
|
2020-12-24 01:35:25 -05:00
|
|
|
<Text style={{fontSize: 16}}>{item.item.name}</Text>
|
|
|
|
|
<Text style={{fontSize: 12}}>{item.item.date}</Text>
|
|
|
|
|
</View>
|
|
|
|
|
</View>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
return (
|
|
|
|
|
null
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
const PastWeek = ({item}) => {
|
|
|
|
|
const newIconURI = item.item.icon !== undefined?`data:image/png;charset=utf-8;base64,${item.item.icon}`:''
|
|
|
|
|
const today = new Date(getCurrentDate())
|
|
|
|
|
const week = new Date(getWeekDate())
|
|
|
|
|
const itemDate = new Date(item.item.date)
|
|
|
|
|
|
|
|
|
|
if (itemDate.getTime() >= week.getTime() && today.getTime()>itemDate.getTime()) {
|
|
|
|
|
return (
|
|
|
|
|
<View style={{display:'flex', borderWidth:2, borderColor: 'black', borderRadius: 8, width: 120, height: '100%', marginRight: 10}} onPress={()=>setVisible(!visible)} activeOpacity={0.8}>
|
|
|
|
|
<Image source = {{newIconURI}} style = {{height: '76%', width: '100%', borderTopLeftRadius: 8, borderTopRightRadius: 8}}/>
|
2020-12-24 02:34:47 -05:00
|
|
|
<View style={{height: '24%', paddingHorizontal: '2%', borderTopWidth: 1}}>
|
2020-12-24 01:35:25 -05:00
|
|
|
<Text style={{fontSize: 16}}>{item.item.name}</Text>
|
|
|
|
|
<Text style={{fontSize: 12}}>{item.item.date}</Text>
|
|
|
|
|
</View>
|
|
|
|
|
</View>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
return (
|
|
|
|
|
null
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const AnnouncementToday = ({item}) => {
|
|
|
|
|
const date = new Date
|
|
|
|
|
const dateStr = `${date.getMonth()+1}/${date.getDate()}/${date.getFullYear()}`
|
|
|
|
|
const dateInfo = dateStr===item.item.date&&item.item.time!==undefined?item.item.time:'';
|
|
|
|
|
const itemDate = new Date(item.item.date)
|
|
|
|
|
const today = new Date(getCurrentDate())
|
|
|
|
|
const teacher = item.item.teacher !==""?item.item.teacher:"No Teacher"
|
|
|
|
|
|
|
|
|
|
if (itemDate.getTime()===today.getTime()) {
|
|
|
|
|
return (
|
|
|
|
|
<View style = {{display: 'flex', flexDirection: 'row', alignItems: 'center', paddingVertical: '2%', justifyContent: 'space-between', borderBottomWidth: 1, borderTopWidth: 1}}>
|
|
|
|
|
<View style = {{width: '75%'}}>
|
|
|
|
|
<Text style={{fontSize: 18}}>{item.item.message}</Text>
|
|
|
|
|
</View>
|
|
|
|
|
<View style = {{width: '25%', display: 'flex', flexDirection: 'row'}}>
|
|
|
|
|
<Text style={{fontSize: 14, alignSelf: 'center'}}>{teacher}{'\t'}{dateInfo}</Text>
|
2020-12-23 00:23:53 -05:00
|
|
|
</View>
|
|
|
|
|
</View>
|
2020-12-24 01:35:25 -05:00
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
return (
|
|
|
|
|
null
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const New = ({item}) => {
|
|
|
|
|
const calendarIconURI = item.item.icon !== undefined?`data:image/png;charset=utf-8;base64,${item.item.icon}`:''
|
|
|
|
|
const today = new Date(getCurrentDate())
|
|
|
|
|
const week = new Date(getWeekDate())
|
|
|
|
|
const itemDate = new Date(item.item.date)
|
|
|
|
|
|
|
|
|
|
if (itemDate.getTime() >= today.getTime()) {
|
|
|
|
|
return (
|
|
|
|
|
<View style={{display:'flex', borderWidth:2, borderColor: 'black', borderRadius: 8, width: 120, height: '95%', marginRight: 10}} onPress={()=>setVisible(!visible)} activeOpacity={0.8}>
|
2020-12-24 02:34:47 -05:00
|
|
|
<Image source = {{calendarIconURI}} style = {{height: '76%', width: '100%', borderTopLeftRadius: 8, borderTopRightRadius: 8, borderTopWidth: 1}}/>
|
|
|
|
|
<View style={{height: '24%', paddingHorizontal: '2%', borderTopWidth: 2}}>
|
2020-12-24 01:35:25 -05:00
|
|
|
<Text style={{fontSize: 16}}>{item.item.name}</Text>
|
|
|
|
|
<Text style={{fontSize: 12}}>{item.item.date}</Text>
|
|
|
|
|
</View>
|
|
|
|
|
</View>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
else if (itemDate.getTime() >= week.getTime()){
|
|
|
|
|
return (
|
|
|
|
|
<View style={{backgroundColor: '#e3e3e', display:'flex', borderWidth:1, borderColor: 'black', borderRadius: 8, width: 120, height: '95%', marginRight: 10}} onPress={()=>setVisible(!visible)} activeOpacity={0.8}>
|
|
|
|
|
<Image source = {{calendarIconURI}} style = {{height: '76%', width: '100%', borderTopLeftRadius: 8, borderTopRightRadius: 8}}/>
|
2020-12-24 02:34:47 -05:00
|
|
|
<View style={{height: '24%', paddingHorizontal: '2%', backgroundColor: '#e3e3e3', borderBottomLeftRadius: 8, borderBottomRightRadius: 8, borderTopWidth: 1}}>
|
2020-12-24 01:35:25 -05:00
|
|
|
<Text style={{fontSize: 16}}>{item.item.name}</Text>
|
|
|
|
|
<Text style={{fontSize: 12}}>{item.item.date}</Text>
|
|
|
|
|
</View>
|
|
|
|
|
</View>
|
2020-12-23 00:23:53 -05:00
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
return (
|
|
|
|
|
null
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
2020-10-25 02:57:39 -04:00
|
|
|
function Home1() {
|
2020-12-24 02:34:47 -05:00
|
|
|
const [modalVisible, setModalVisible] = useState(true);
|
2020-10-25 02:57:39 -04:00
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<View>
|
|
|
|
|
<View>
|
|
|
|
|
<Modal animationType="slide" transparent={true} visible={modalVisible}>
|
|
|
|
|
<View style={styles.modal}>
|
|
|
|
|
<View style={{display: 'flex', flexDirection:'row', justifyContent: 'flex-end'}}>
|
2020-12-23 00:23:53 -05:00
|
|
|
<TouchableHighlight onPress={() => {setModalVisible(false);}}>
|
2020-10-25 02:57:39 -04:00
|
|
|
<Image source = {require('./assets/exit.png')} style = {{height: 40, width: 40}}/>
|
|
|
|
|
</TouchableHighlight>
|
|
|
|
|
</View>
|
|
|
|
|
<View>
|
|
|
|
|
<Image source = {require('./assets/blair_logo.png')} style = {{alignSelf: 'center', marginTop: '5%', height: 325, width: 325}}/>
|
2020-12-21 22:34:09 -05:00
|
|
|
<Text style={styles.modalText}>{url}</Text>
|
2020-10-25 02:57:39 -04:00
|
|
|
</View>
|
|
|
|
|
</View>
|
|
|
|
|
</Modal>
|
|
|
|
|
</View>
|
2020-12-24 01:35:25 -05:00
|
|
|
</View>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
const background = (<LinearGradient
|
|
|
|
|
colors={['#f99', 'white']}
|
|
|
|
|
style = {{flex:1,borderBottomColor:'black',borderBottomWidth:0.5}}
|
|
|
|
|
/>)
|
|
|
|
|
|
|
|
|
|
function HomeStack() {
|
|
|
|
|
return (
|
|
|
|
|
<NavigationContainer independent={true}>
|
|
|
|
|
<Stack.Navigator>
|
|
|
|
|
<Stack.Screen
|
|
|
|
|
name="Home"
|
|
|
|
|
component={Home}
|
|
|
|
|
options={{
|
|
|
|
|
title:'Blair',
|
|
|
|
|
headerTitleStyle:styles.headerTitle,
|
|
|
|
|
headerBackground: ()=>background
|
|
|
|
|
}}
|
|
|
|
|
/>
|
|
|
|
|
<Stack.Screen
|
|
|
|
|
name="new"
|
|
|
|
|
component={whatsNew}
|
|
|
|
|
options={({route})=> ({
|
|
|
|
|
title:"What's New",
|
|
|
|
|
headerTitleStyle:styles.headerTitle,
|
|
|
|
|
headerBackground: ()=>background
|
|
|
|
|
})}
|
|
|
|
|
/>
|
|
|
|
|
<Stack.Screen
|
|
|
|
|
name="Announcements"
|
|
|
|
|
component={Announcements}
|
|
|
|
|
options={({route})=> ({
|
|
|
|
|
title:"Announcements",
|
|
|
|
|
headerTitleStyle:styles.headerTitle,
|
|
|
|
|
headerBackground: ()=>background
|
|
|
|
|
})}
|
|
|
|
|
/>
|
|
|
|
|
<Stack.Screen
|
|
|
|
|
name="TeacherList"
|
|
|
|
|
component={TeacherList}
|
|
|
|
|
options={({route})=>({
|
|
|
|
|
headerTitleStyle:[styles.headerTitle,{alignSelf:'center',fontSize:Math.min(24,24*23/route.params.name.length)}],
|
|
|
|
|
title:route.params.name,
|
|
|
|
|
headerRight:()=>(<></>),
|
|
|
|
|
headerBackground: ()=>background
|
|
|
|
|
})}
|
|
|
|
|
/>
|
|
|
|
|
</Stack.Navigator>
|
|
|
|
|
</NavigationContainer>
|
|
|
|
|
)
|
|
|
|
|
}
|
2020-10-25 02:57:39 -04:00
|
|
|
|
2020-12-24 01:35:25 -05:00
|
|
|
function HomeScreen (props) {
|
2020-12-24 02:34:47 -05:00
|
|
|
const iconURI = props.studentData.icon !== undefined?`data:image/png;charset=utf-8;base64,${props.studentData.icon}`:`data:image/png;base64,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
|
2020-12-24 01:35:25 -05:00
|
|
|
return(
|
|
|
|
|
<ScrollView style={{height: '100%', backgroundColor: 'white'}}>
|
|
|
|
|
<View style={{height: 275, backgroundColor: 'white', padding: '2%'}}>
|
|
|
|
|
<View style={{display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between', marginBottom: '2%'}}>
|
|
|
|
|
<Text style={liststyles.homeTitle}>What's New?</Text>
|
|
|
|
|
<TouchableOpacity onPress={()=>props.navigation.navigate('new', {data:props.data})}>
|
|
|
|
|
<Text style={{color: 'blue', textDecorationLine: 'underline'}}>View All</Text>
|
|
|
|
|
</TouchableOpacity>
|
|
|
|
|
</View>
|
|
|
|
|
<ScrollView horizontal='true' style={{display: 'flex', flexDirection: 'row', paddingHorizontal: '2%'}}></ScrollView>
|
|
|
|
|
<View style={{display:'flex', flexDirection: 'row', padding: '2%'}}>
|
|
|
|
|
<FlatList
|
|
|
|
|
data={props.data}
|
|
|
|
|
renderItem={item=><New item={item}/>}
|
|
|
|
|
keyExtractor={item=>JSON.stringify(item)}
|
|
|
|
|
horizontal
|
|
|
|
|
/>
|
|
|
|
|
</View>
|
|
|
|
|
|
2020-10-25 02:57:39 -04:00
|
|
|
</View>
|
2020-12-24 01:35:25 -05:00
|
|
|
|
|
|
|
|
<View style={{height: 275, backgroundColor: 'white', padding: '2%'}}>
|
|
|
|
|
<Text style={liststyles.homeTitle}>Student of the Week</Text>
|
|
|
|
|
<View style={{display: 'flex', flexDirection: 'row', paddingTop: '5%', paddingHorizontal: '2%', justifyContent: 'space-between'}}>
|
|
|
|
|
<View style={{display: 'flex', borderWidth: 1, borderColor: 'black', borderRadius: 8, width: '32%', height: '100%'}}>
|
|
|
|
|
<View style={{height:'70%'}}>
|
|
|
|
|
<Image source = {{iconURI}} style = {{height:'100%', width: '100%', borderTopRightRadius: 8, borderTopLeftRadius:8}}/>
|
|
|
|
|
</View>
|
2020-12-24 02:34:47 -05:00
|
|
|
<View style ={{paddingHorizontal: '2%', height: '15%', borderTopWidth: 1}}>
|
2020-12-24 01:35:25 -05:00
|
|
|
<Text style={{fontWeight: 'bold', fontSize: 18}}>{props.studentData.name}</Text>
|
|
|
|
|
<Text>Grade {props.studentData.year}</Text>
|
|
|
|
|
</View>
|
|
|
|
|
</View>
|
|
|
|
|
<View style={{borderWidth: 1, borderColor: 'black', borderRadius: 8, width: '64%', height: '100%', padding: '2%'}}>
|
|
|
|
|
<Text style={{fontSize: 16}}><Text style={{fontWeight: 'bold'}}>Hobbies: </Text>{props.studentData.hobbies}</Text>
|
|
|
|
|
<Text style={{fontSize: 16}}><Text style={{fontWeight: 'bold'}}>Achievements: </Text>{props.studentData.achievements}</Text>
|
|
|
|
|
<Text style={{fontSize: 16}}><Text style={{fontWeight: 'bold'}}>Messages: </Text>{props.studentData.messages}</Text>
|
|
|
|
|
</View>
|
|
|
|
|
</View>
|
|
|
|
|
</View>
|
|
|
|
|
|
|
|
|
|
<View style={{padding: '2%'}}>
|
|
|
|
|
<View style ={{display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between', marginBottom: '2%'}}>
|
|
|
|
|
<Text style={liststyles.homeTitle}>Announcements</Text>
|
|
|
|
|
<TouchableOpacity onPress={()=>props.navigation.navigate(Announcements)}>
|
|
|
|
|
<Text style={{color: 'blue', textDecorationLine: 'underline'}}>View All</Text>
|
|
|
|
|
</TouchableOpacity>
|
|
|
|
|
</View>
|
|
|
|
|
<FlatList
|
|
|
|
|
data={props.annData}
|
|
|
|
|
renderItem={item=><AnnouncementToday item={item}/>}
|
|
|
|
|
keyExtractor={item=>JSON.stringify(item)}
|
|
|
|
|
/>
|
|
|
|
|
</View>
|
|
|
|
|
|
|
|
|
|
<View style={{height: 220, display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between'}}>
|
|
|
|
|
<View style={{display: 'flex', alignItems: 'center', width: '50%'}}>
|
|
|
|
|
<TouchableOpacity onPress={() => Linking.openURL(props.challengeData.link)}>
|
|
|
|
|
<Image source={require('./assets/challenge.png')} style={{height: 200, width: 200}}/>
|
|
|
|
|
</TouchableOpacity>
|
|
|
|
|
|
|
|
|
|
</View>
|
|
|
|
|
<View style={{display: 'flex', alignItems: 'center', width: '50%'}}>
|
|
|
|
|
<TouchableOpacity onPress={() => Linking.openURL(props.pollData.link)}>
|
|
|
|
|
<Image source={require('./assets/polls.png')} style={{height: 200, width: 200}}/>
|
|
|
|
|
</TouchableOpacity>
|
|
|
|
|
</View>
|
|
|
|
|
</View>
|
|
|
|
|
|
|
|
|
|
</ScrollView>
|
2020-10-25 02:57:39 -04:00
|
|
|
)
|
|
|
|
|
}
|
2020-12-23 00:23:53 -05:00
|
|
|
|
2020-08-09 17:01:25 -04:00
|
|
|
class Home extends React.Component {
|
2020-10-25 02:57:39 -04:00
|
|
|
constructor(props) {
|
|
|
|
|
super(props)
|
|
|
|
|
this.state = {
|
2020-12-23 00:23:53 -05:00
|
|
|
studentData: [],
|
2020-12-24 01:35:25 -05:00
|
|
|
annData:[],
|
2020-12-23 00:23:53 -05:00
|
|
|
data:[],
|
2020-12-24 01:35:25 -05:00
|
|
|
pollData:[],
|
|
|
|
|
challengeData:[],
|
|
|
|
|
teacherNames: [],
|
|
|
|
|
favoriteNames: [],
|
2020-12-21 22:34:09 -05:00
|
|
|
isLoading:true
|
2020-10-25 02:57:39 -04:00
|
|
|
}
|
|
|
|
|
}
|
2020-12-23 00:23:53 -05:00
|
|
|
addFavorite = (name) => {
|
|
|
|
|
const favoriteNames = this.state.favoriteNames.slice().map(({name})=>name)
|
|
|
|
|
const index = favoriteNames.indexOf(name)
|
|
|
|
|
if (index < 0) {
|
|
|
|
|
favoriteNames.push(name)
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
favoriteNames.splice(index,1)
|
|
|
|
|
}
|
|
|
|
|
favoriteNames.sort()
|
|
|
|
|
this.setState({favoriteNames:favoriteNames.map(name=>({name:name}))})
|
|
|
|
|
AsyncStorage.setItem(STORAGE_KEY,JSON.stringify(favoriteNames)).catch(console.log).done()
|
|
|
|
|
}
|
|
|
|
|
componentDidMount() {
|
2020-12-24 01:35:25 -05:00
|
|
|
fetch(`${url}/api/en/challenge`,{
|
2020-10-25 02:57:39 -04:00
|
|
|
headers: {
|
|
|
|
|
'Cache-Control': 'no-cache'
|
|
|
|
|
}}
|
|
|
|
|
).then((response) => {
|
2020-12-24 01:35:25 -05:00
|
|
|
return response.text();
|
2020-10-25 02:57:39 -04:00
|
|
|
}).then((json) => {
|
2020-12-24 01:35:25 -05:00
|
|
|
this.setState({challengeData: JSON.parse(json),isLoading:false});
|
2020-12-23 00:23:53 -05:00
|
|
|
}).catch((error) => console.error(error))
|
2020-12-24 01:35:25 -05:00
|
|
|
|
|
|
|
|
fetch(`${url}/api/en/student`,{
|
2020-12-23 00:23:53 -05:00
|
|
|
headers: {
|
|
|
|
|
'Cache-Control': 'no-cache'
|
|
|
|
|
}}
|
|
|
|
|
).then((response) => {
|
2020-12-24 01:35:25 -05:00
|
|
|
return response.text();list
|
2020-12-23 00:23:53 -05:00
|
|
|
}).then((json) => {
|
2020-12-24 01:35:25 -05:00
|
|
|
this.setState({studentData: JSON.parse(json),isLoading:false});
|
|
|
|
|
}).catch((error) => console.error(error))
|
2020-12-23 00:23:53 -05:00
|
|
|
|
|
|
|
|
this.getData()
|
|
|
|
|
this.props.navigation.addListener(
|
|
|
|
|
'focus',
|
|
|
|
|
() => {
|
|
|
|
|
this.getData()
|
|
|
|
|
}
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
this.getData1()
|
|
|
|
|
AsyncStorage.getItem(STORAGE_KEY)
|
|
|
|
|
.then(value=>value==null?[]:JSON.parse(value).map(x=>({name:x})))
|
|
|
|
|
.then(names=>this.setState({favoriteNames:names}))
|
|
|
|
|
.catch(console.log)
|
|
|
|
|
.done()
|
|
|
|
|
}
|
|
|
|
|
|
2020-12-24 01:35:25 -05:00
|
|
|
getData() {
|
|
|
|
|
fetch(`${url}/api/en/new`,{
|
|
|
|
|
headers: {
|
|
|
|
|
'Cache-Control': 'no-cache'
|
|
|
|
|
} })
|
|
|
|
|
.then((response) => {
|
|
|
|
|
return response.text();
|
|
|
|
|
})
|
|
|
|
|
.then((json) => {
|
|
|
|
|
const data = JSON.parse(json).data
|
|
|
|
|
data.sort((a,b)=>new Date(b.date).getTime()-new Date(a.date).getTime())
|
|
|
|
|
this.setState({data: data});
|
|
|
|
|
})
|
|
|
|
|
.catch((error) => console.error(error))
|
|
|
|
|
}
|
|
|
|
|
|
2020-12-23 00:23:53 -05:00
|
|
|
getData1() {
|
|
|
|
|
fetch(`${url}/api/en/announcements`,{
|
|
|
|
|
headers: {
|
|
|
|
|
'Cache-Control': 'no-cache'
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
)
|
|
|
|
|
.then((response) => {
|
|
|
|
|
return response.text()
|
|
|
|
|
})
|
|
|
|
|
.then((txt) => {
|
|
|
|
|
const data = JSON.parse(txt).data;
|
|
|
|
|
const teacherNames = [...new Set(data.filter(x=>x.teacher!=null&&x.teacher.trim()!=='').map(x=>x.teacher))];
|
|
|
|
|
teacherNames.sort()
|
2020-12-24 01:35:25 -05:00
|
|
|
this.setState({annData: data, teacherNames: teacherNames.map(x=>({name:x})),isLoading:false});
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
.catch((error) => console.error(error))
|
|
|
|
|
|
2020-12-23 00:23:53 -05:00
|
|
|
}
|
2020-10-25 02:57:39 -04:00
|
|
|
|
2020-08-09 17:01:25 -04:00
|
|
|
render() {
|
2020-12-23 00:23:53 -05:00
|
|
|
return (
|
2020-10-25 02:57:39 -04:00
|
|
|
<View>
|
|
|
|
|
<Home1></Home1>
|
2020-12-24 01:35:25 -05:00
|
|
|
<HomeScreen navigation={this.props.navigation} annData={this.state.annData} studentData={this.state.studentData} data={this.state.data} challengeData = {this.state.challengeData}></HomeScreen>
|
2020-10-25 02:57:39 -04:00
|
|
|
</View>
|
2020-08-09 17:01:25 -04:00
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
}
|
2020-12-24 01:35:25 -05:00
|
|
|
export default HomeStack;
|
