finished version of app

app/Announcements.js

@@ -99,8 +99,8 @@ export const TeacherList = ({route}) => {
 		else if (itemDate.getTime() > todayDate.getTime() && itemDate.getTime() <= weekFutureDate.getTime()) {
 			future.push(route.params.data[i])
 		}
-		//else if (itemDate >= weekPastDate && itemDate < todayDate) {
+		else if (itemDate >= weekPastDate && itemDate < todayDate) {
-		else if (itemDate.getTime() < todayDate.getTime()) {
+		//else if (itemDate.getTime() < todayDate.getTime()) {
 			past.push(route.params.data[i])
 		}
 	}

app/Calendar.js

@@ -35,14 +35,12 @@ const getCurrentDate=()=>{
 }
 export const EventInfo = ({route}) => {
   const item = route.params;
-  const itemDate = new Date(item.event_date)
+  const itemDate = new Date(parseInt(String(item.event_date).split('-')[0]), parseInt(String(item.event_date).split('-')[1])-1, parseInt(String(item.event_date).split('-')[2]))
   const days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']
   const months = ['January','February','March','April','May','June','July','August','September','October','November','December',]
-  const dayOfWeek = days[itemDate.getDay()+1]
+  const dayOfWeek = days[itemDate.getDay()]
   const month = months[itemDate.getMonth()]
-  const date = itemDate.getDate()+1
+  const date = itemDate.getDate()
-
-  console.log(itemDate.getDate())
   
   return (
     <ScrollView style = {{backgroundColor: 'white', flex:1, padding: '5%', paddingRight: '10%'}}>
@@ -216,8 +214,8 @@ class Calendar extends React.Component {
           else if (itemDate > todayDate && itemDate <= weekFutureDate) {
             future.push(this.state.data[i])
           }
-          //else if (itemDate >= weekPastDate && itemDate < todayDate) {
+          else if (itemDate >= weekPastDate && itemDate < todayDate) {
-          else if (itemDate < todayDate) {
+          //else if (itemDate < todayDate) {
             past.push(this.state.data[i])
           }
         }

app/Home.js

@@ -113,8 +113,8 @@ export const TeacherList = ({route}) => {
 		else if (itemDate.getTime() > todayDate.getTime() && itemDate.getTime() <= weekFutureDate.getTime()) {
 			future.push(route.params.data[i])
 		}
-		//else if (itemDate >= weekPastDate && itemDate < todayDate) {
+		else if (itemDate >= weekPastDate && itemDate < todayDate) {
-		else if (itemDate.getTime() < todayDate.getTime()) {
+		//else if (itemDate.getTime() < todayDate.getTime()) {
 			past.push(route.params.data[i])
 		}
 	}
@@ -168,15 +168,15 @@ export const whatsNew = ({route}) => {
 	var futureBoolean = true
 	
 	for (var i = 0; i < route.params.data.length; i++) {
-		const itemDate = new Date(route.params.data[i].date)
+		const itemDate = new Date(parseInt(String(route.params.data[i].new_date).split('-')[0]), parseInt(String(route.params.data[i].new_date).split('-')[1])-1, parseInt(String(route.params.data[i].new_date).split('-')[2]))
 		if (itemDate.getTime() == todayDate.getTime()) {
 			today.push(route.params.data[i])
 		}
 		else if (itemDate.getTime() > todayDate.getTime() && itemDate.getTime() <= weekFutureDate.getTime()) {
 			future.push(route.params.data[i])
 		}
-		//else if (itemDate >= weekPastDate && itemDate < todayDate) {
+		else if (itemDate >= weekPastDate && itemDate < todayDate) {
-		else if (itemDate.getTime() < todayDate.getTime()) {
+		//else if (itemDate.getTime() < todayDate.getTime()) {
 			past.push(route.params.data[i])
 		}
 	}
@@ -196,16 +196,16 @@ export const whatsNew = ({route}) => {
 
 export const NewItem = ({route}) => {
   const item = route.params.data
-  const iconURI = item.image !== undefined?`data:image/png;charset=utf-8;base64,${item.image}`:''
   
   return (
     <ScrollView style={{height: '100%', backgroundColor: 'white'}}>
       <View style={{backgroundColor: '#e3e3e3'}}>
-        <Image source={require('./assets/blair_logo.png')} style={{width: windowWidth, height: windowHeight*.6, alignSelf: 'center'}}/>
+        <Image source={{uri: item.image}} style={{width: windowWidth, height: windowHeight*.6, alignSelf: 'center'}}/>
       </View>
       <View style={{backgroundColor: 'white', marginTop: '-5%', padding: '5%', borderTopLeftRadius: 20, borderTopRightRadius: 20}}>
-        <Text style={{fontSize: 14, fontWeight: '200', textAlign: 'center'}}>{item.date}</Text>
+        <Text style={{fontSize: 14, fontWeight: '200', textAlign: 'center'}}>{item.new_date}</Text>
         <Text style={{fontSize: 20, textAlign: 'center', paddingBottom: '2%', fontWeight: 'bold'}}>{item.name}</Text>
+        <Text style={{fontSize: 14}}>{item.text}</Text>
       </View>
     </ScrollView>
   )
@@ -247,9 +247,9 @@ const New = (props) => {
   return (
     <View style={{paddingRight: '2%'}}>
       <TouchableOpacity onPress={()=>props.navigation.navigate('NewItem', {data:props.item.item})}>
-        <ImageBackground style = {{width: windowWidth*.4, height: windowWidth*.55, backgroundColor:'#e3e3e3', borderRadius: 16, alignItems: 'baseline'}}source = {{iconURI}}>
+        <ImageBackground style = {{width: windowWidth*.4, height: windowWidth*.55, backgroundColor:'#e3e3e3', borderRadius: 16, alignItems: 'baseline'}}source = {{uri: item.item.image}}>
           <View style={{padding: '5%', flex: 1, justifyContent: 'flex-end', width: windowWidth*.4, height: windowWidth*.2, shadowColor: '#323232', shadowOffset: {width: 0, height: 0}, shadowOpacity: 0.5}}>
-            <Text style={{fontSize: 12, color: 'white', fontWeight: '700'}}>{item.item.date}</Text>
+            <Text style={{fontSize: 12, color: 'white', fontWeight: '500'}}>{item.item.new_date}</Text>
             <Text style={{fontSize: 16, color: 'white', fontWeight: 'bold'}}>{text}</Text>
           </View>
         </ImageBackground>
@@ -380,7 +380,6 @@ function HomeStack() {
 }
 
 function HomeScreen (props) {
-  console.log(props.studentData)
   var showStudent = true
   if (props.studentData.length==0) {showStudent = false}
   const iconURI = null
@@ -393,14 +392,13 @@ function HomeScreen (props) {
   var todayNewBoolean = true
   var showLunch = false
   for (var i = 0; i < props.annData.length; i++) {
-    const itemDate = new Date(props.annData[i].date)
+    const itemDate = new Date(parseInt(String(props.annData[i].date).split('-')[0]), parseInt(String(props.annData[i].date).split('-')[1])-1, parseInt(String(props.annData[i].date).split('-')[2]))
-    if (itemDate == todayDate) todayAnn.push(props.annData[i])
+    if (itemDate.getTime() == todayDate.getTime()) todayAnn.push(props.annData[i])
-    else todayAnn.push(props.annData[i])
   }
 
   for (var i = 0; i < props.data.length; i++) {
-    const itemDate = new Date(props.data[i].date)
+    const itemDate = new Date(parseInt(String(props.data[i].new_date).split('-')[0]), parseInt(String(props.data[i].new_date).split('-')[1])-1, parseInt(String(props.data[i].new_date).split('-')[2]))
-    if (itemDate == todayDate) todayNew.push(props.data[i])
+    if (itemDate.getTime() == todayDate.getTime()) todayNew.push(props.data[i])
   }
   
   if (todayAnn.length === 0) todayAnnBoolean = false
@@ -467,7 +465,7 @@ function HomeScreen (props) {
         <Text style={[liststyles.homeTitle, {paddingBottom: '5%'}]}>{I18n.t('home.SOTW')}</Text>
         <View style={{display: 'flex', flexDirection: 'row'}}>
           <View style={{backgroundColor: 'white', width: windowWidth*.30, height: windowWidth*.30, shadowColor: 'red', shadowOffset: {width: 0, height: 2}, shadowOpacity: 0.5, shadowRadius: 7, borderRadius: (windowWidth*.30)/2}}>
-            <Image source = {{iconURI}} style = {{height:'100%', width: '100%', borderTopRightRadius: 8, borderTopLeftRadius:8}}/>
+            <Image source = {{uri: props.studentData[props.studentData.length-1].image}} style = {{height:'100%', width: '100%', borderTopRightRadius: 8, borderTopLeftRadius:8}}/>
           </View>
           <View style ={{width: windowWidth*.60, display: 'flex', paddingLeft: '5%', paddingHorizontal: '2%', alignItems: 'center', justifyContent: 'space-around'}}>
             <Text style={{fontSize: 18, textAlign: 'center'}}>{props.studentData[props.studentData.length-1].name}, <Text style={{fontWeight: '200', textAlign: 'center'}}>Grade {props.studentData[props.studentData.length-1].grade}</Text></Text>
@@ -560,10 +558,11 @@ class Home extends React.Component {
 			return response.text();
 		  })
 		  .then((json) => {
-			const data = JSON.parse(json).data
+			const data = JSON.parse(json)
       data.sort((a,b)=>a.id-b.id)
 			data.sort((a,b)=>new Date(b.date).getTime()-new Date(a.date).getTime())
 			this.setState({data: data});
+      console.log(this.state.data)
 		  })
 		  .catch((error) => console.error(error))
 	}

app/Staff.js

@@ -33,13 +33,13 @@ import I18n from './i18n';
 
 const Stack = createStackNavigator();
 
-export const StaffInfo = ({route}) => {
+/*export const StaffInfo = ({route}) => {
   const item = route.params;
 
   console.log(item);
 
   return (
-    /*<View style = {{padding: 10, backgroundColor: 'white', height: '100%'}}>
+    <View style = {{padding: 10, backgroundColor: 'white', height: '100%'}}>
       {item.emails.map(email =>
         <View style ={[styles.infoContainer, {flexDirection: 'row', alignItems: 'center'}]}>
           <View style={{display: 'flex', justifyContent: 'center'}}>
@@ -50,10 +50,10 @@ export const StaffInfo = ({route}) => {
           </View>
         </View>
       )}
-    </View>*/
+    </View>
     <ScrollView style={{paddingTop:'5%',paddingHorizontal:'10%', backgroundColor: 'white', height: '100%'}}>
       <View style={{backgroundColor: 'white',borderRadius: 150, height: 300, width: 300, alignSelf: 'center', shadowColor: 'red', shadowOffset: {width: 0, height: 2}, shadowOpacity: 0.5, shadowRadius: 7}}>
-        <Image style={{resizeMode: 'cover',borderRadius: 150, height: 300, width: 300, alignSelf: 'center'}} source = {{/* CHANGE */}} /> 
+        <Image style={{resizeMode: 'cover',borderRadius: 150, height: 300, width: 300, alignSelf: 'center'}} source = {{/* CHANGE }} /> 
       </View>
       <Text style={{fontSize:28,marginTop:'5%',textAlign:'center'}}>{item.name}</Text>
       <Text style={{fontSize:20,textAlign:'center', fontWeight: '200'}}>{item.position || ""}</Text>
@@ -91,21 +91,32 @@ export const StaffInfo = ({route}) => {
       }
     </ScrollView>
   )
-}
+}*/
 function StaffElement (props) {
   const item = props.item;
+  const [expand, setExpand] = useState(false);
+
   return(
-	<View>
+    <View>
-      <TouchableOpacity style={[styles.listItem]} onPress={()=>props.navigation.navigate('StaffInfo', {data:props.data,name:props.name,emails:item.emails})} activeOpacity={0.8}>
+        <TouchableOpacity style={styles.listItem} onPress={()=>setExpand(!expand)}>
-        <View style = {[styles.container2, {justifyContent: 'space-between'}]}>
+            <View style={styles.container2}>
-          <View style={{display: 'flex', flexDirection: 'row'}}> 
+                <Ionicons name="ios-nutrition-outline" size={36} color={'#323232'} style={{marginRight: 15}} />
-            <Ionicons name = "ios-nutrition-outline" size={36} color={'#323232'} style={{marginRight: 15}} />
+                <View style = {styles.accordian}>
-            <Text style={[styles.title, {alignSelf:'center'}]}>{props.item.name}</Text>
+                    <Text style={styles.title}>{item.name}</Text>
-          </View>
+                    {expand?<LinearGradient start={{x: 0, y: 0.25}} end={{x: .5, y: 1}} colors={['red', '#FF7373']} style={{borderRadius: 24, alignSelf: 'center'}}><Image source = {require('./assets/collapse.png')} style={{tintColor: 'white'}}/></LinearGradient>:<Image source = {require('./assets/expand.png')} style={{tintColor: '#b2b2b2', alignSelf: 'center'}}/>}
-          <Image source = {require('./assets/forward.png')} style={{tintColor: '#b2b2b2'}}/>
+                </View>
-        </View>
+            </View>
-      </TouchableOpacity>
+            {expand?
-	</View>
+            <View style={{marginLeft: 50}}>
+                <Text style={styles.accordianHeader}>Email</Text>
+                <Text style={styles.accordianText}>{item.email}</Text>
+                <Text style={styles.accordianHeader}>{'\n'}Phone Number</Text>
+                <Text style={[styles.accordianText, {paddingBottom: '4%'}]}>{item.phone}</Text>
+                <Text syle={styles.accordianHeader}>{'\n'}Position</Text>
+                <Text style={[styles.accordianText, {paddingBottom: '4%'}]}>{item.position}</Text>
+            </View>:<></>}
+        </TouchableOpacity>
+    </View>
   )
 }
 
@@ -132,18 +143,6 @@ function Staff () {
             headerTitleAlign: 'center'
           })}
         />
-        <Stack.Screen 
-          name = "StaffInfo"
-          component = {StaffInfo}
-          options={({route})=>({
-            title:route.params.name,
-            headerTitleStyle:[morestyles.headerTitle,{alignSelf:'center'}],
-            headerBackground: ()=>background,
-            headerBackTitleVisible:false,
-            headerTintColor: 'black',
-            headerTitleAlign: 'center',
-          })}
-        />
       </Stack.Navigator>
     </NavigationContainer>
   ) 

app/StudentWeek.js

@@ -75,15 +75,16 @@ class StudentWeek extends React.Component {
 					</View>
 				)
 			} else {
-				console.log(this.state.data[this.state.data.length-1].image)
+				//const iconURI = this.state.data[this.state.data.length-1].image !== undefined?`data:image/png;charset=utf-8;base64,${this.state.data[this.state.data.length-1].image}`:'';
-				const iconURI = this.state.data[this.state.data.length-1].image !== undefined?`data:image/png;charset=utf-8;base64,${this.state.data[this.state.data.length-1].image}`:'';
 				const hobbyText = (<Text style = {{marginLeft: 50, paddingHorizontal: '2%', paddingBottom: '2%'}}>{this.state.data[this.state.data.length-1].hobbies}</Text>)
 				const achievementText = (<Text style = {{marginLeft: 50, paddingHorizontal: '2%', paddingBottom: '2%'}}>{this.state.data[this.state.data.length-1].achievements}</Text>)
 				const messageText = (<Text style = {{marginLeft: 50, paddingHorizontal: '2%', paddingBottom: '2%'}}>{this.state.data[this.state.data.length-1].messages}</Text>)
 				return (
 					<ScrollView style={{paddingTop:'5%',paddingHorizontal:'10%', backgroundColor: 'white', height: '100%'}}>
+						<Image source = {{uri: "https://reactnative.dev/img/tiny_logo.png"}} />
 						<View style={{backgroundColor: 'white',borderRadius: 150, height: 300, width: 300, alignSelf: 'center', shadowColor: 'red', shadowOffset: {width: 0, height: 2}, shadowOpacity: 0.5, shadowRadius: 7}}>
-							<Image style={{resizeMode: 'cover',borderRadius: 150, height: 300, width: 300, alignSelf: 'center'}} source = {{iconURI}} /> 
+							<Image style={{resizeMode: 'cover',borderRadius: 150, height: 300, width: 300, alignSelf: 'center'}} source = {{uri: this.state.data[this.state.data.length-1].image}} /> 
+							
 						</View>
 						<Text style={{fontSize:28,marginTop:'5%',textAlign:'center'}}>{this.state.data[this.state.data.length-1].name}</Text>
 						<Text style={{fontSize:20,textAlign:'center', fontWeight: '200'}}>{I18n.t('student.Grade')} {this.state.data[this.state.data.length-1].grade}</Text>

cms/migrations/setup/up.sql

@@ -23,8 +23,7 @@ CREATE TABLE teachers (
     name VARCHAR NOT NULL,
     email VARCHAR NOT NULL,
     phone VARCHAR NOT NULL,
-    position VARCHAR NOT NULL,
+    position VARCHAR NOT NULL
-    image VARCHAR
 );
 
 CREATE TABLE announcements (
@@ -75,6 +74,7 @@ CREATE TABLE new (
     lang VARCHAR,
     image VARCHAR,
     name VARCHAR NOT NULL,
+    text VARCHAR NOT NULL,
     new_date DATE
 );
 

cms/src/data/mod.rs

@@ -164,7 +164,6 @@ api_route! {
         email: (Text, String, String),
         phone: (Text, String, String),
         position: (Text, String, String),
-        image: (Text, String, Image),
     }
 }
 
@@ -221,6 +220,7 @@ api_route! {
     new {
         image: (Text, String, Image),
         name: (Text, String, String),
+        text: (Text, String, String),
         new_date: (Date, NaiveDate, DateForm),
     }
 }

cms/templates/new.html.hbs

@@ -29,6 +29,7 @@
                     <small>ID: {{id}} | LANG: {{lang}}</small>
                     <h3 class="my-2" style="font-size: 18px;">{{name}}</h3>
                     <p class="mb-2">{{image}}</p>
+                    <p class="mb-2">{{text}}</p>
                     <p class="mb-2">{{new_date}}</p>
                     <form action="new/del" method="post">
                         <div class="d-flex mt-3">
@@ -71,13 +72,22 @@
 
                     <div class="d-flex mt-3">
                     <div style="flex: 1; justify-content: center;">
-                        <p class="my-0">Information</p> 
+                        <p class="my-0">Title</p> 
                     </div>
                     <div style="flex: 1; align: center;">
                         <input type="text" class="form-control form-control-sm" id="name" name="name" required>
                     </div>
                     </div>
 
+                    <div class="d-flex mt-3">
+                    <div style="flex: 1; justify-content: center;">
+                        <p class="my-0">Information</p> 
+                    </div>
+                    <div style="flex: 1; align: center;">
+                        <input type="text" class="form-control form-control-sm" id="text" name="text" required>
+                    </div>
+                    </div>
+
                     <div class="d-flex mt-3">
                     <div style="flex: 1; justify-content: center;">
                         <p class="my-0">Date of What's New Item</p> 
@@ -124,13 +134,22 @@
 
                     <div class="d-flex mt-3">
                     <div style="flex: 1; justify-content: center;">
-                        <p class="my-0">Information</p> 
+                        <p class="my-0">Title</p> 
                     </div>
                     <div style="flex: 1; align: center;">
                         <input type="text" class="form-control form-control-sm" id="name" name="name" required>
                     </div>
                     </div>
 
+                    <div class="d-flex mt-3">
+                    <div style="flex: 1; justify-content: center;">
+                        <p class="my-0">Information</p> 
+                    </div>
+                    <div style="flex: 1; align: center;">
+                        <input type="text" class="form-control form-control-sm" id="text" name="text" required>
+                    </div>
+                    </div>
+
                     <div class="d-flex mt-3">
                     <div style="flex: 1; justify-content: center;">
                         <p class="my-0">Date of What's New Item</p> 

cms/templates/teachers.html.hbs

@@ -31,7 +31,6 @@
                     <p class="mb-2">{{email}}</p>
                     <p class="mb-2">{{phone}}</p>
                     <p class="mb-2">{{position}}</p>
-                    <p class="mb-2">{{image}}</p>
                     <form action="teachers/del" method="post">
                         <div class="d-flex mt-3">
                         <input type="number" class="form-control form-control-sm" id="id" name="id" value = {{id}} style="display: none">
@@ -98,15 +97,6 @@
                     </div>
                     </div>
 
-                    <div class="d-flex mt-3">
-                    <div style="flex: 1; justify-content: center;">
-                        <p class="my-0">Staff Picture</p> 
-                    </div>
-                    <div style="flex: 1; align: center;">
-                        <input type="text" class="form-control form-control-sm" name="image" id="image" required>
-                    </div>
-                    </div>
-                    
                     <input type="submit" value="Submit">
                 </form>
                 </div>
@@ -169,15 +159,6 @@
                     </div>
                     </div>
 
-                    <div class="d-flex mt-3">
-                    <div style="flex: 1; justify-content: center;">
-                        <p class="my-0">Staff Picture</p> 
-                    </div>
-                    <div style="flex: 1; align: center;">
-                        <input type="text" class="form-control form-control-sm" name="image" id="image" required>
-                    </div>
-                    </div>
-
                     <input type="submit", value="Submit">
                 </form>
                 </div>