Commit 065e790b authored by Lihinikaduwa D.N.R.  's avatar Lihinikaduwa D.N.R.

Merge branch

parents d18191f3 4377b9c5
......@@ -3,9 +3,15 @@
from flask import Flask, redirect, url_for, render_template, request, jsonify, make_response
import random
import os
<<<<<<< HEAD
from API.model.colorModel import get_color_activities1, get_color_activities2, get_color_activity_result
from API.model.readModel import get_reading_activities, save_activity_details
from API.model.userModel import getUser, saveUserSession
=======
from API.model.colorModel import get_color_activities1, get_color_activities2, get_color_activity_result, storeResult
from API.model.readModel import get_reading_activities
from API.model.userModel import getStudentByName
>>>>>>> 4377b9c5fafb5c155a043560f662f4da96c37e12
from API.routers.router import funtion_one
# from backend.IT18218640.keyword_spotting_service import Keyword_Spotting_service
......@@ -45,22 +51,33 @@ def getColorActivitiesResult():
@app.route("/predict", methods=["POST"])
def predict():
<<<<<<< HEAD
data = request.get_json()
print((f"{data}"))
=======
fileitem = data['uri']
try:
data = request.get_json()
>>>>>>> 4377b9c5fafb5c155a043560f662f4da96c37e12
# if fileitem.filename:
# # strip the leading path from the file name
fn = os.path.basename(fileitem)
#
# # open read and write the file into the server
open(fn, 'wb').write(fileitem.file.read())
fileitem = data['uri']
colorName = data['colorNmae']
# print((f"{colorName}"))
# if fileitem.filename:
# # strip the leading path from the file name
fn = os.path.basename(fileitem)
#
# # open read and write the file into the server
# open(fn, 'wb').write(fileitem.file.read())
resp = make_response(request.get_json())
resp.headers['Access-Control-Allow-Origin'] = '*'
resp.headers['Content-Type'] = 'application/json'
return resp
resp = make_response(request.get_json())
resp.headers['Access-Control-Allow-Origin'] = '*'
resp.headers['Content-Type'] = 'application/json'
return resp
except ValueError:
print(ValueError)
# get audio file and save it
# audio_file = request.files["file"]
......@@ -97,6 +114,26 @@ def predict():
# return jsonify("print")
# return "Print"
@app.route("/store", methods=["POST"])
def store():
req = request.get_json()
value = req['value']
date = req['date']
result = "Good"
time = "2S"
usersId = 1
try:
response = storeResult(value, date, result, time, usersId)
return response
except Exception as e:
print(e)
return e
# Read Function Route (IT)
......@@ -160,4 +197,10 @@ def reading():
if __name__ == "__main__":
<<<<<<< HEAD
app.run(host='192.168.1.101')
=======
app.run(host='192.168.8.101')
# app.run(host='192.168.8.102')
# app.run(debug=True)
>>>>>>> 4377b9c5fafb5c155a043560f662f4da96c37e12
......@@ -12,7 +12,7 @@ def create_con():
database="helply",
host="127.0.0.1",
user="root",
password="12345678"
password="rp19970520"
)
return db
......
from flask import jsonify
from API.db.dbConnection import get_all_data
from API.db.dbConnection import get_all_data, insert_data_json, insert_data, insert
def get_color_activities1():
data_dic = []
......@@ -42,6 +43,20 @@ def get_color_activities2():
return jsonify(data_dic)
def storeResult(value, date, result, time, usersId):
try:
qry = 'INSERT INTO coloractivityresult VALUES (NULL, %s, %s, %s, %s, %s)'
args = (date, result, usersId, time, value)
response = insert(qry, args)
return response
except Exception as e:
print(e)
return e
def get_color_activity_result():
data_dic = []
......@@ -51,7 +66,7 @@ def get_color_activity_result():
for row in result:
ob = {
"idcoloractivityresult": row[0],
"idColorActivityResult": row[0],
"idcolorActivities": row[1],
"date": row[2],
"time": row[3],
......
......@@ -4,6 +4,7 @@ import android.app.Application;
import android.content.Context;
import com.facebook.react.PackageList;
import com.facebook.react.ReactApplication;
import net.no_mad.tts.TextToSpeechPackage;
import com.facebook.react.ReactInstanceManager;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
......
rootProject.name = 'firstApp'
include ':react-native-tts'
project(':react-native-tts').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-tts/android')
apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
include ':app'
......@@ -12,6 +12,8 @@ target 'firstApp' do
:hermes_enabled => false
)
pod 'TextToSpeech', :path => '../node_modules/react-native-tts'
target 'firstAppTests' do
inherit! :complete
# Pods for testing
......
This diff is collapsed.
......@@ -20,6 +20,8 @@
"react": "17.0.2",
"react-native": "0.66.2",
"react-native-audio-record": "^0.2.2",
"react-native-awesome-alerts": "^1.5.2",
"react-native-countdown-circle-timer": "^3.0.9",
"react-native-countdown-component": "^2.7.1",
"react-native-elements": "^3.4.2",
"react-native-fontawesome": "^7.0.0",
......@@ -30,6 +32,7 @@
"react-native-safe-area-context": "^3.3.2",
"react-native-screens": "^3.9.0",
"react-native-table-component": "^1.2.1",
"react-native-tts": "^4.1.0",
"react-native-vector-icons": "^9.0.0",
"react-redux": "^7.2.6",
"redux": "^4.1.2"
......
......@@ -10,7 +10,7 @@ export default function ColorActivity(props){
const navigation = useNavigation();
return(
<TouchableOpacity onPress={()=> {navigation.navigate("Blue", {color})}}
<TouchableOpacity onPress={()=> {navigation.navigate("Blue2", {color})}}
style={{
borderWidth: 5,
borderColor: color,
......
export default {
primary: '#f7287b',
secondary: '#c717fc'
secondary: '#1DCE92'
}
\ No newline at end of file
......@@ -7,9 +7,15 @@ import Home from '../screen/home';
import Start from '../screen/Start';
import Register from '../screen/auth/Register';
import Login from '../screen/auth/Login';
import Splash from '../screen/splash/splash';
import Splash from '../screen/splash/Splash';
import Color from '../screen/Color';
import Blue from '../screen/activity/Blue';
import Blue2 from '../screen/activity/Blue2';
import Red from '../screen/activity/Red';
import Green from '../screen/activity/Green';
import Black from '../screen/activity/Black';
import Yellow from '../screen/activity/Yellow';
import White from '../screen/activity/White';
import Read from '../screen/Read';
import ReadActivity from '../screen/reading/ReadActivity';
import ReadActivityBird from '../screen/reading/advanced/ReadActivityBird';
......@@ -32,6 +38,8 @@ import GameScreenSix from '../screen/memory/elementry/GameScreenSix';
import GameScreenSixAll from '../screen/memory/elementry/GameScreenSixAll';
import GameOverScreen from '../screen/memory/GameOverScreen';
import Sam from '../screen/sample/sam';
const Stack = createNativeStackNavigator();
const AppRouter = () => {
......@@ -64,7 +72,11 @@ const AppRouter = () => {
component={Start}
/>
<Stack.Screen
options={{headerShown: false}}
options={{
title: 'Color Activity',
headerTintColor: 'white',
headerStyle: {backgroundColor: Colors.secondary},
}}
name="Color"
component={Color}
/>
......@@ -73,6 +85,36 @@ const AppRouter = () => {
name="Blue"
component={Blue}
/>
<Stack.Screen
options={{headerShown: false}}
name="Blue2"
component={Blue2}
/>
<Stack.Screen
options={{headerShown: false}}
name="Red"
component={Red}
/>
<Stack.Screen
options={{headerShown: false}}
name="Green"
component={Green}
/>
<Stack.Screen
options={{headerShown: false}}
name="Black"
component={Black}
/>
<Stack.Screen
options={{headerShown: false}}
name="Yellow"
component={Yellow}
/>
<Stack.Screen
options={{headerShown: false}}
name="White"
component={White}
/>
<Stack.Screen
options={{
title: 'Read Activity',
......@@ -196,6 +238,11 @@ const AppRouter = () => {
name="SecondaryType"
component={SecondaryType}
/>
<Stack.Screen
options={{headerShown: false}}
name="Sam"
component={Sam}
/>
</Stack.Navigator>
</NavigationContainer>
);
......
......@@ -25,14 +25,14 @@ export default function Color() {
<SafeAreaView>
<ScrollView>
<View>
{/* <View>
<View>
<ImageBackground source={require("../assets/color/background.png")}
style={styles.image}>
<Text style={styles.title}>Color Activity</Text>
</ImageBackground>
</View>
</View>
</View> */}
<View style={{ marginTop: 40 }}>
<TouchableOpacity onPress={() => { navigation.navigate("PrimaryType", { title: 'Primary Activities', id: 1 }) }}
......
import { useNavigation } from "@react-navigation/native";
import Orientation from 'react-native-orientation-locker';
import React, { useEffect, useState } from "react";
import { Text, TouchableOpacity, StyleSheet, View, Dimensions, SafeAreaView, ImageBackground, Button, Image, StatusBar } from 'react-native';
import axios from "axios";
import CountDown from 'react-native-countdown-component';
import client from "../client/Client";
import Voice from '@react-native-voice/voice';
import BackButton from "../../component/BackButton"
export default function Black() {
const navigation = useNavigation();
const backColor = "black";
React.useEffect(() => {
StatusBar.setHidden(true);
const unsubscribe = navigation.addListener("focus", () => {
Orientation.unlockAllOrientations();
Orientation.lockToLandscape();
});
return unsubscribe;
}, [navigation]);
useEffect(() => {
Voice.onSpeechStart = onSpeechStartHandler;
Voice.onSpeechEnd = onSpeechEndHandler;
Voice.onSpeechResults = onSpeechResultsHandler;
Voice.onSpeechPartialResults = onSpeechPartialResults;
// console.log(backColor);
return () => {
Voice.destroy().then(Voice.removeAllListeners);
};
}, []);
const onSpeechStartHandler = e => {
// console.log('start handler =>> ', e);
};
const onSpeechEndHandler = e => {
// console.log('end handler =>> ', e);
};
const onSpeechResultsHandler = e => {
// console.log('result handler =>> ', e);
// setTimeout(() => {
// alert("Please Pronouce Color");
// }, 3000);
const value = e.value;
if (value.includes(backColor) == true) {
var color = "Red";
console.log('Your Answer is Correct');
sendData(color)
showAlert = () => {
this.setState({
showAlert: true
});
};
} else {
console.log('Your Answer is Incorrect', value);
}
};
function sendData(value) {
var date = new Date().getDate();
var month = new Date().getMonth() + 1;
var year = new Date().getFullYear();
var todayData = date + '-' + month + '-' + year;
var data = {
value: value,
date: todayData
}
data = JSON.stringify(data);
client.post('store', data, {
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
},
}).then((response) => {
console.log(response.data);
}).catch(err => {
console.log(err);
})
}
const onSpeechPartialResults = e => {
// console.log('onSpeechPartialResults: ', e);
// const value = e.value;
// console.log(value.length)
// setPartialResults(e.value);
};
const onFinishCD = () => {
Alert.alert('Countdown Finished...');
}
const onPressCD = () => {
Alert.alert('Countdown Component Pressed...');
}
const startRecording = async () => {
try {
await Voice.start('en-US');
} catch (error) {
console.log('error =>> ', error);
}
};
const stopRecording = async () => {
try {
await Voice.stop();
} catch (error) {
console.log(error);
}
};
return (
<SafeAreaView>
<View style={{ flexDirection: "column" }}>
<ImageBackground style={styles.image} source={require("../../assets/game/gameback.png")}>
<View>
<View style={styles.textBody}>
<Text style={styles.text}>Say the name of this color?</Text>
</View>
<Image style={styles.robo} source={require("../../assets/game/robo.png")}></Image>
</View>
<View>
<Image style={styles.blackboard} source={require("../../assets/game/blackboard.png")}></Image>
<View style={{ width: 180, height: 180, backgroundColor: backColor, marginTop: -370, marginLeft: 455, borderRadius: 100 }}>
</View>
</View>
<View style={{ marginTop: 10 }}>
<BackButton path="Color" />
</View>
<View style={{ flexDirection: "row", marginLeft: 420, marginTop: -50 }}>
<View style={{}}>
<TouchableOpacity onPress={startRecording}
style={{ width: "30%", height: "35%", borderRadius: 50 }}>
<Image source={require('../../assets/game/mic2.png')} resizeMode='contain' style={{ flex: 1, marginLeft: -190 }} />
</TouchableOpacity>
</View>
<View style={{ marginLeft: -100, marginTop: -15 }}>
<TouchableOpacity onPress={() => { }}
style={{ width: "60%", height: "50%", borderRadius: 50 }}>
<Image source={require('../../assets/game/finish.png')} resizeMode='contain' style={{ flex: .9, marginLeft: -120 }} />
</TouchableOpacity>
</View>
</View>
</ImageBackground>
</View>
</SafeAreaView>
)
}
const styles = StyleSheet.create({
body: {
flex: 1,
},
image: {
width: "100%",
height: "100%",
},
blackboard: {
marginTop: -420,
marginLeft: 240,
width: "70%",
height: 500,
},
robo: {
marginTop: -70,
marginLeft: -5,
width: 150,
height: 200,
},
textBody: {
marginTop: 150,
marginLeft: 95,
backgroundColor: "#1DCE92",
width: 200,
borderRadius: 50,
padding: 5,
},
text: {
fontSize: 25,
justifyContent: 'center',
alignItems: 'center',
color: "white",
textAlign: 'center',
fontWeight: 'bold'
},
button: {
padding: 10,
marginRight: 50,
color: "#000000",
marginLeft: 50,
}
})
\ No newline at end of file
......@@ -94,25 +94,12 @@ export default function Blue(color) {
const formData = new FormData();
var obj = {
uri: `file://${audioFile}`,
uri: `file:${audioFile}`,
type: 'audio/wav',
name: 'color.wav',
colorNmae: backColor
}
// formData.append(
// 'file',
// {
// uri: `file://${audioFile}`,
// type: 'audio/wav',
// name: 'color.wav',
// }
// );
// formData.append(
// 'name', backColor
// );
var data = JSON.stringify(obj)
console.log(data);
......
import { useNavigation } from "@react-navigation/native";
import Orientation from 'react-native-orientation-locker';
import React, { useEffect, useState } from "react";
import { Text, TouchableOpacity, StyleSheet, View, Dimensions, SafeAreaView, ImageBackground, Button, Image, StatusBar } from 'react-native';
import axios from "axios";
import CountDown from 'react-native-countdown-component';
import client from "../client/Client";
import Voice from '@react-native-voice/voice';
import BackButton from "../../component/BackButton"
export default function Blue2() {
const navigation = useNavigation();
const backColor = "blue";
React.useEffect(() => {
StatusBar.setHidden(true);
const unsubscribe = navigation.addListener("focus", () => {
Orientation.unlockAllOrientations();
Orientation.lockToLandscape();
});
return unsubscribe;
}, [navigation]);
useEffect(() => {
Voice.onSpeechStart = onSpeechStartHandler;
Voice.onSpeechEnd = onSpeechEndHandler;
Voice.onSpeechResults = onSpeechResultsHandler;
Voice.onSpeechPartialResults = onSpeechPartialResults;
// console.log(backColor);
return () => {
Voice.destroy().then(Voice.removeAllListeners);
};
}, []);
const onSpeechStartHandler = e => {
// console.log('start handler =>> ', e);
};
const onSpeechEndHandler = e => {
// console.log('end handler =>> ', e);
};
const onSpeechResultsHandler = e => {
// console.log('result handler =>> ', e);
// setTimeout(() => {
// alert("Please Pronouce Color");
// }, 3000);
const value = e.value;
if(value.includes(backColor) == true){
console.log('Your Answer is Correct');
showAlert = () => {
this.setState({
showAlert: true
});
};
}else{
console.log('Your Answer is Incorrect', value);
}
};
const onSpeechPartialResults = e => {
// console.log('onSpeechPartialResults: ', e);
// const value = e.value;
// console.log(value.length)
// setPartialResults(e.value);
};
const onFinishCD = () => {
Alert.alert('Countdown Finished...');
}
const onPressCD = () => {
Alert.alert('Countdown Component Pressed...');
}
const startRecording = async () => {
try {
await Voice.start('en-US');
} catch (error) {
console.log('error =>> ', error);
}
};
const stopRecording = async () => {
try {
await Voice.stop();
} catch (error) {
console.log(error);
}
};
return (
<SafeAreaView>
<View style={{ flexDirection: "column" }}>
<ImageBackground style={styles.image} source={require("../../assets/game/gameback.png")}>
<View>
<View style={styles.textBody}>
<Text style={styles.text}>Say the name of this color?</Text>
</View>
<Image style={styles.robo} source={require("../../assets/game/robo.png")}></Image>
</View>
<View>
<Image style={styles.blackboard} source={require("../../assets/game/blackboard.png")}></Image>
<View style={{ width: 180, height: 180, backgroundColor: backColor, marginTop: -370, marginLeft: 455, borderRadius: 100 }}>
</View>
</View>
<View style={{ marginTop: 10 }}>
<BackButton path="Color" />
</View>
<View style={{ flexDirection: "row", marginLeft: 420, marginTop: -50 }}>
<View style={{}}>
<TouchableOpacity onPress={startRecording}
style={{ width: "30%", height: "40%", borderRadius: 50 }}>
<Image source={require('../../assets/game/mic2.png')} resizeMode='contain' style={{ flex: 1, marginLeft: -190 }} />
</TouchableOpacity>
</View>
<View style={{ marginLeft: -100 }}>
<TouchableOpacity onPress={() => { }}
style={{ width: "60%", height: "40%", borderRadius: 50 }}>
<Image source={require('../../assets/game/next.png')} resizeMode='contain' style={{ flex: .9, marginLeft: -90 }} />
</TouchableOpacity>
</View>
</View>
</ImageBackground>
</View>
</SafeAreaView>
)
}
const styles = StyleSheet.create({
body: {
flex: 1,
},
image: {
width: "100%",
height: "100%",
},
blackboard: {
marginTop: -420,
marginLeft: 240,
width: "70%",
height: 500,
},
robo: {
marginTop: -70,
marginLeft: -5,
width: 150,
height: 200,
},
textBody: {
marginTop: 150,
marginLeft: 95,
backgroundColor: "#1DCE92",
width: 200,
borderRadius: 50,
padding: 5,
},
text: {
fontSize: 25,
justifyContent: 'center',
alignItems: 'center',
color: "white",
textAlign: 'center',
fontWeight: 'bold'
},
button: {
padding: 10,
marginRight: 50,
color: "#000000",
marginLeft: 50,
}
})
\ No newline at end of file
import { useNavigation } from "@react-navigation/native";
import Orientation from 'react-native-orientation-locker';
import React, { useEffect, useState } from "react";
import { Text, TouchableOpacity, StyleSheet, View, Dimensions, SafeAreaView, ImageBackground, Button, Image, StatusBar } from 'react-native';
import axios from "axios";
import CountDown from 'react-native-countdown-component';
import client from "../client/Client";
import Voice from '@react-native-voice/voice';
import BackButton from "../../component/BackButton"
export default function Green() {
const navigation = useNavigation();
const backColor = "green";
React.useEffect(() => {
StatusBar.setHidden(true);
const unsubscribe = navigation.addListener("focus", () => {
Orientation.unlockAllOrientations();
Orientation.lockToLandscape();
});
return unsubscribe;
}, [navigation]);
useEffect(() => {
Voice.onSpeechStart = onSpeechStartHandler;
Voice.onSpeechEnd = onSpeechEndHandler;
Voice.onSpeechResults = onSpeechResultsHandler;
Voice.onSpeechPartialResults = onSpeechPartialResults;
// console.log(backColor);
return () => {
Voice.destroy().then(Voice.removeAllListeners);
};
}, []);
const onSpeechStartHandler = e => {
// console.log('start handler =>> ', e);
};
const onSpeechEndHandler = e => {
// console.log('end handler =>> ', e);
};
const onSpeechResultsHandler = e => {
// console.log('result handler =>> ', e);
// setTimeout(() => {
// alert("Please Pronouce Color");
// }, 3000);
const value = e.value;
if(value.includes(backColor) == true){
console.log('Your Answer is Correct');
showAlert = () => {
this.setState({
showAlert: true
});
};
}else{
console.log('Your Answer is Incorrect', value);
}
};
const onSpeechPartialResults = e => {
// console.log('onSpeechPartialResults: ', e);
// const value = e.value;
// console.log(value.length)
// setPartialResults(e.value);
};
const onFinishCD = () => {
Alert.alert('Countdown Finished...');
}
const onPressCD = () => {
Alert.alert('Countdown Component Pressed...');
}
const startRecording = async () => {
try {
await Voice.start('en-US');
} catch (error) {
console.log('error =>> ', error);
}
};
const stopRecording = async () => {
try {
await Voice.stop();
} catch (error) {
console.log(error);
}
};
return (
<SafeAreaView>
<View style={{ flexDirection: "column" }}>
<ImageBackground style={styles.image} source={require("../../assets/game/gameback.png")}>
<View>
<View style={styles.textBody}>
<Text style={styles.text}>Say the name of this color?</Text>
</View>
<Image style={styles.robo} source={require("../../assets/game/robo.png")}></Image>
</View>
<View>
<Image style={styles.blackboard} source={require("../../assets/game/back2.png")}></Image>
<View style={{ width: 180, height: 180, backgroundColor: backColor, marginTop: -370, marginLeft: 455, borderRadius: 100 }}>
</View>
</View>
<View style={{ marginTop: 10 }}>
<BackButton path="Color" />
</View>
<View style={{ flexDirection: "row", marginLeft: 420, marginTop: -50 }}>
<View style={{}}>
<TouchableOpacity onPress={startRecording}
style={{ width: "30%", height: "40%", borderRadius: 50 }}>
<Image source={require('../../assets/game/mic2.png')} resizeMode='contain' style={{ flex: 1, marginLeft: -190 }} />
</TouchableOpacity>
</View>
<View style={{ marginLeft: -100 }}>
<TouchableOpacity onPress={() => { }}
style={{ width: "60%", height: "40%", borderRadius: 50 }}>
<Image source={require('../../assets/game/next.png')} resizeMode='contain' style={{ flex: .9, marginLeft: -90 }} />
</TouchableOpacity>
</View>
</View>
</ImageBackground>
</View>
</SafeAreaView>
)
}
const styles = StyleSheet.create({
body: {
flex: 1,
},
image: {
width: "100%",
height: "100%",
},
blackboard: {
marginTop: -420,
marginLeft: 240,
width: "70%",
height: 500,
},
robo: {
marginTop: -70,
marginLeft: -5,
width: 150,
height: 200,
},
textBody: {
marginTop: 150,
marginLeft: 95,
backgroundColor: "#1DCE92",
width: 200,
borderRadius: 50,
padding: 5,
},
text: {
fontSize: 25,
justifyContent: 'center',
alignItems: 'center',
color: "white",
textAlign: 'center',
fontWeight: 'bold'
},
button: {
padding: 10,
marginRight: 50,
color: "#000000",
marginLeft: 50,
}
})
\ No newline at end of file
......@@ -30,7 +30,7 @@ export default function PrimaryType(title) {
React.useEffect(() => {
getColorActivity1();
// getColorActivity1();
const unsubscribe = navigation.addListener("focus", () => {
// The screen is focused
......@@ -48,7 +48,7 @@ export default function PrimaryType(title) {
<SafeAreaView>
<ScrollView>
<View style={{marginBottom:50}}>
<View style={{ marginBottom: 50 }}>
<View>
<ImageBackground source={require("../../assets/color/background.png")}
style={styles.image}>
......@@ -57,9 +57,167 @@ export default function PrimaryType(title) {
</View>
</View>
{names.map((data, index) => {
return (<ColorActivity key={index} title={data.name} image={data.image} id={data.idcolorActivities} des={data.des} color={data.color} />)
})}
{/* {names.map((data, index) => {
return (<ColorActivity key={index} title={data.name}
image={data.image} id={data.idcolorActivities}
des={data.des} color={data.color} />)
})} */}
<TouchableOpacity onPress={() => { navigation.navigate("Red") }}
style={{
borderWidth: 5,
borderColor: "red",
marginVertical: 20,
backgroundColor: "#fff",
paddingVertical: 8,
paddingHorizontal: 15,
padding: 15,
width: 380,
marginHorizontal: 20,
borderRadius: 30,
shadowColor: "#000",
shadowOffset: {
width: 2,
height: 2
},
shadowOpacity: 0.3,
shadowRadius: 1.5,
marginBottom: 50,
}}>
<View style={[{ flexDirection: "row" }]}>
<View style={styles.cardImage}>
<Image source={require("../../assets/color/red.jpg")}
style={{ width: 100, height: 100, borderRadius: 30 }}></Image>
</View>
<View style={{ flex: 0.6 }}>
{/* <Text style={styles.cardDescription}>{id}</Text> */}
<Text style={styles.cardTitle}>Red Color</Text>
<Text style={styles.cardLocation}>Primary Activity</Text>
<View
style={{
marginLeft: 10,
marginTop: 5,
width: 40,
height: 40,
borderRadius: 100,
backgroundColor: "red",
borderWidth: 1,
borderColor: "black",
}}>
</View>
</View>
</View>
</TouchableOpacity>
<TouchableOpacity onPress={() => { navigation.navigate("Green") }}
style={{
borderWidth: 5,
borderColor: "green",
marginVertical: 20,
backgroundColor: "#fff",
paddingVertical: 8,
paddingHorizontal: 15,
padding: 15,
width: 380,
marginHorizontal: 20,
borderRadius: 30,
shadowColor: "#000",
shadowOffset: {
width: 2,
height: 2
},
shadowOpacity: 0.3,
shadowRadius: 1.5,
marginBottom: 50,
}}>
<View style={[{ flexDirection: "row" }]}>
<View style={styles.cardImage}>
<Image source={require("../../assets/color/green.jpg")}
style={{ width: 100, height: 100, borderRadius: 30 }}></Image>
</View>
<View style={{ flex: 0.6 }}>
{/* <Text style={styles.cardDescription}>{id}</Text> */}
<Text style={styles.cardTitle}>Green Color</Text>
<Text style={styles.cardLocation}>Primary Activity</Text>
<View
style={{
marginLeft: 10,
marginTop: 5,
width: 40,
height: 40,
borderRadius: 100,
backgroundColor: "green",
borderWidth: 1,
borderColor: "black",
}}>
</View>
</View>
</View>
</TouchableOpacity>
<TouchableOpacity onPress={() => { navigation.navigate("Black") }}
style={{
borderWidth: 5,
borderColor: "black",
marginVertical: 20,
backgroundColor: "#fff",
paddingVertical: 8,
paddingHorizontal: 15,
padding: 15,
width: 380,
marginHorizontal: 20,
borderRadius: 30,
shadowColor: "#000",
shadowOffset: {
width: 2,
height: 2
},
shadowOpacity: 0.3,
shadowRadius: 1.5,
marginBottom: 50,
}}>
<View style={[{ flexDirection: "row" }]}>
<View style={styles.cardImage}>
<Image source={require("../../assets/color/black.jpg")}
style={{ width: 100, height: 100, borderRadius: 30 }}></Image>
</View>
<View style={{ flex: 0.6 }}>
<Text style={styles.cardTitle}>Black Color</Text>
<Text style={styles.cardLocation}>Primary Activity</Text>
<View
style={{
marginLeft: 10,
marginTop: 5,
width: 40,
height: 40,
borderRadius: 100,
backgroundColor: "black",
borderWidth: 1,
borderColor: "black",
}}>
</View>
</View>
</View>
</TouchableOpacity>
</ScrollView>
</SafeAreaView>
......@@ -91,6 +249,43 @@ const styles = StyleSheet.create({
position: "absolute",
left: 50,
bottom: 50
},
card: {
marginVertical: 20,
backgroundColor: "#fff",
paddingVertical: 8,
paddingHorizontal: 15,
padding: 15,
width: 380,
marginHorizontal: 20,
borderRadius: 30,
shadowColor: "#000",
shadowOffset: {
width: 2,
height: 2
},
shadowOpacity: 0.3,
shadowRadius: 1.5,
},
cardTitle: {
fontWeight: "bold",
fontSize: 30,
marginLeft: 10,
},
cardLocation: {
fontSize: 16,
color: "#777",
marginLeft: 10,
},
cardDescription: {
fontSize: 18,
marginVertical: 8,
marginLeft: 10,
},
cardImage: {
padding: 0,
flex: 0.4
}
})
import { useNavigation } from "@react-navigation/native";
import Orientation from 'react-native-orientation-locker';
import React, { useEffect, useState } from "react";
import { Text, TouchableOpacity, StyleSheet, View, Dimensions, SafeAreaView, ImageBackground, Button, Image, StatusBar } from 'react-native';
import axios from "axios";
import CountDown from 'react-native-countdown-component';
import client from "../client/Client";
import Voice from '@react-native-voice/voice';
import BackButton from "../../component/BackButton"
export default function Red() {
const navigation = useNavigation();
const backColor = "red";
React.useEffect(() => {
StatusBar.setHidden(true);
const unsubscribe = navigation.addListener("focus", () => {
Orientation.unlockAllOrientations();
Orientation.lockToLandscape();
});
return unsubscribe;
}, [navigation]);
useEffect(() => {
Voice.onSpeechStart = onSpeechStartHandler;
Voice.onSpeechEnd = onSpeechEndHandler;
Voice.onSpeechResults = onSpeechResultsHandler;
Voice.onSpeechPartialResults = onSpeechPartialResults;
// console.log(backColor);
return () => {
Voice.destroy().then(Voice.removeAllListeners);
};
}, []);
const onSpeechStartHandler = e => {
// console.log('start handler =>> ', e);
};
const onSpeechEndHandler = e => {
// console.log('end handler =>> ', e);
};
const onSpeechResultsHandler = e => {
// console.log('result handler =>> ', e);
// setTimeout(() => {
// alert("Please Pronouce Color");
// }, 3000);
const value = e.value;
if(value.includes(backColor) == true){
console.log('Your Answer is Correct');
showAlert = () => {
this.setState({
showAlert: true
});
};
}else{
console.log('Your Answer is Incorrect', value);
}
};
const onSpeechPartialResults = e => {
// console.log('onSpeechPartialResults: ', e);
// const value = e.value;
// console.log(value.length)
// setPartialResults(e.value);
};
const onFinishCD = () => {
Alert.alert('Countdown Finished...');
}
const onPressCD = () => {
Alert.alert('Countdown Component Pressed...');
}
const startRecording = async () => {
try {
await Voice.start('en-US');
} catch (error) {
console.log('error =>> ', error);
}
};
const stopRecording = async () => {
try {
await Voice.stop();
} catch (error) {
console.log(error);
}
};
return (
<SafeAreaView>
<View style={{ flexDirection: "column" }}>
<ImageBackground style={styles.image} source={require("../../assets/game/gameback.png")}>
<View>
<View style={styles.textBody}>
<Text style={styles.text}>Say the name of this color?</Text>
</View>
<Image style={styles.robo} source={require("../../assets/game/robo.png")}></Image>
</View>
<View>
<Image style={styles.blackboard} source={require("../../assets/game/blackboard.png")}></Image>
<View style={{ width: 180, height: 180, backgroundColor: backColor, marginTop: -370, marginLeft: 455, borderRadius: 100 }}>
</View>
</View>
<View style={{ marginTop: 10 }}>
<BackButton path="Color" />
</View>
<View style={{ flexDirection: "row", marginLeft: 420, marginTop: -50 }}>
<View style={{}}>
<TouchableOpacity onPress={startRecording}
style={{ width: "30%", height: "40%", borderRadius: 50 }}>
<Image source={require('../../assets/game/mic2.png')} resizeMode='contain' style={{ flex: 1, marginLeft: -190 }} />
</TouchableOpacity>
</View>
<View style={{ marginLeft: -100 }}>
<TouchableOpacity onPress={() => { }}
style={{ width: "60%", height: "40%", borderRadius: 50 }}>
<Image source={require('../../assets/game/next.png')} resizeMode='contain' style={{ flex: .9, marginLeft: -90 }} />
</TouchableOpacity>
</View>
</View>
</ImageBackground>
</View>
</SafeAreaView>
)
}
const styles = StyleSheet.create({
body: {
flex: 1,
},
image: {
width: "100%",
height: "100%",
},
blackboard: {
marginTop: -420,
marginLeft: 240,
width: "70%",
height: 500,
},
robo: {
marginTop: -70,
marginLeft: -5,
width: 150,
height: 200,
},
textBody: {
marginTop: 150,
marginLeft: 95,
backgroundColor: "#1DCE92",
width: 200,
borderRadius: 50,
padding: 5,
},
text: {
fontSize: 25,
justifyContent: 'center',
alignItems: 'center',
color: "white",
textAlign: 'center',
fontWeight: 'bold'
},
button: {
padding: 10,
marginRight: 50,
color: "#000000",
marginLeft: 50,
}
})
\ No newline at end of file
......@@ -14,7 +14,7 @@ export default function SecondaryType(title) {
const navigation = useNavigation();
const[names, setNames] = useState([]);
const [names, setNames] = useState([]);
function getColorActivity2() {
client
......@@ -46,7 +46,7 @@ export default function SecondaryType(title) {
<SafeAreaView>
<ScrollView>
<View style={{marginBottom:50}}>
<View style={{ marginBottom: 50 }}>
<View>
<ImageBackground source={require("../../assets/color/background.png")}
style={styles.image}>
......@@ -55,9 +55,165 @@ export default function SecondaryType(title) {
</View>
</View>
{names.map((data, index) => {
{/* {names.map((data, index) => {
return (<ColorActivity key={index} title={data.name} image={data.image} id={data.idcolorActivities} des={data.des} color={data.color} />)
})}
})} */}
<TouchableOpacity onPress={() => { navigation.navigate("Yellow") }}
style={{
borderWidth: 5,
borderColor: "yellow",
marginVertical: 20,
backgroundColor: "#fff",
paddingVertical: 8,
paddingHorizontal: 15,
padding: 15,
width: 380,
marginHorizontal: 20,
borderRadius: 30,
shadowColor: "#000",
shadowOffset: {
width: 2,
height: 2
},
shadowOpacity: 0.3,
shadowRadius: 1.5,
marginBottom: 50,
}}>
<View style={[{ flexDirection: "row" }]}>
<View style={styles.cardImage}>
<Image source={require("../../assets/color/yellow.png")}
style={{ width: 100, height: 100, borderRadius: 30 }}></Image>
</View>
<View style={{ flex: 0.6 }}>
{/* <Text style={styles.cardDescription}>{id}</Text> */}
<Text style={styles.cardTitle}>Yellow Color</Text>
<Text style={styles.cardLocation}>Secondary Activity</Text>
<View
style={{
marginLeft: 10,
marginTop: 5,
width: 40,
height: 40,
borderRadius: 100,
backgroundColor: "yellow",
borderWidth: 1,
borderColor: "black",
}}>
</View>
</View>
</View>
</TouchableOpacity>
<TouchableOpacity onPress={() => { navigation.navigate("Blue2") }}
style={{
borderWidth: 5,
borderColor: "blue",
marginVertical: 20,
backgroundColor: "#fff",
paddingVertical: 8,
paddingHorizontal: 15,
padding: 15,
width: 380,
marginHorizontal: 20,
borderRadius: 30,
shadowColor: "#000",
shadowOffset: {
width: 2,
height: 2
},
shadowOpacity: 0.3,
shadowRadius: 1.5,
marginBottom: 50,
}}>
<View style={[{ flexDirection: "row" }]}>
<View style={styles.cardImage}>
<Image source={require("../../assets/color/blue.jpg")}
style={{ width: 100, height: 100, borderRadius: 30 }}></Image>
</View>
<View style={{ flex: 0.6 }}>
{/* <Text style={styles.cardDescription}>{id}</Text> */}
<Text style={styles.cardTitle}>Blue Color</Text>
<Text style={styles.cardLocation}>Secondary Activity</Text>
<View
style={{
marginLeft: 10,
marginTop: 5,
width: 40,
height: 40,
borderRadius: 100,
backgroundColor: "blue",
borderWidth: 1,
borderColor: "black",
}}>
</View>
</View>
</View>
</TouchableOpacity>
<TouchableOpacity onPress={() => { navigation.navigate("White") }}
style={{
borderWidth: 5,
borderColor: "white",
marginVertical: 20,
backgroundColor: "#fff",
paddingVertical: 8,
paddingHorizontal: 15,
padding: 15,
width: 380,
marginHorizontal: 20,
borderRadius: 30,
shadowColor: "#000",
shadowOffset: {
width: 2,
height: 2
},
shadowOpacity: 0.3,
shadowRadius: 1.5,
marginBottom: 50,
}}>
<View style={[{ flexDirection: "row" }]}>
<View style={styles.cardImage}>
<Image source={require("../../assets/color/white.jpg")}
style={{ width: 100, height: 100, borderRadius: 30 }}></Image>
</View>
<View style={{ flex: 0.6 }}>
{/* <Text style={styles.cardDescription}>{id}</Text> */}
<Text style={styles.cardTitle}>White Color</Text>
<Text style={styles.cardLocation}>Secondary Activity</Text>
<View
style={{
marginLeft: 10,
marginTop: 5,
width: 40,
height: 40,
borderRadius: 100,
backgroundColor: "white",
borderWidth: 1,
borderColor: "black",
}}>
</View>
</View>
</View>
</TouchableOpacity>
</ScrollView>
</SafeAreaView>
......@@ -89,6 +245,43 @@ const styles = StyleSheet.create({
position: "absolute",
left: 50,
bottom: 50
},
card: {
marginVertical: 20,
backgroundColor: "#fff",
paddingVertical: 8,
paddingHorizontal: 15,
padding: 15,
width: 380,
marginHorizontal: 20,
borderRadius: 30,
shadowColor: "#000",
shadowOffset: {
width: 2,
height: 2
},
shadowOpacity: 0.3,
shadowRadius: 1.5,
},
cardTitle: {
fontWeight: "bold",
fontSize: 30,
marginLeft: 10,
},
cardLocation: {
fontSize: 16,
color: "#777",
marginLeft: 10,
},
cardDescription: {
fontSize: 18,
marginVertical: 8,
marginLeft: 10,
},
cardImage: {
padding: 0,
flex: 0.4
}
})
import { useNavigation } from "@react-navigation/native";
import Orientation from 'react-native-orientation-locker';
import React, { useEffect, useState } from "react";
import { Text, TouchableOpacity, StyleSheet, View, Dimensions, SafeAreaView, ImageBackground, Button, Image, StatusBar } from 'react-native';
import axios from "axios";
import CountDown from 'react-native-countdown-component';
import client from "../client/Client";
import Voice from '@react-native-voice/voice';
import BackButton from "../../component/BackButton"
export default function White() {
const navigation = useNavigation();
const backColor = "white";
React.useEffect(() => {
StatusBar.setHidden(true);
const unsubscribe = navigation.addListener("focus", () => {
Orientation.unlockAllOrientations();
Orientation.lockToLandscape();
});
return unsubscribe;
}, [navigation]);
useEffect(() => {
Voice.onSpeechStart = onSpeechStartHandler;
Voice.onSpeechEnd = onSpeechEndHandler;
Voice.onSpeechResults = onSpeechResultsHandler;
Voice.onSpeechPartialResults = onSpeechPartialResults;
// console.log(backColor);
return () => {
Voice.destroy().then(Voice.removeAllListeners);
};
}, []);
const onSpeechStartHandler = e => {
// console.log('start handler =>> ', e);
};
const onSpeechEndHandler = e => {
// console.log('end handler =>> ', e);
};
const onSpeechResultsHandler = e => {
// console.log('result handler =>> ', e);
// setTimeout(() => {
// alert("Please Pronouce Color");
// }, 3000);
const value = e.value;
if(value.includes(backColor) == true){
console.log('Your Answer is Correct');
showAlert = () => {
this.setState({
showAlert: true
});
};
}else{
console.log('Your Answer is Incorrect', value);
}
};
const onSpeechPartialResults = e => {
// console.log('onSpeechPartialResults: ', e);
// const value = e.value;
// console.log(value.length)
// setPartialResults(e.value);
};
const onFinishCD = () => {
Alert.alert('Countdown Finished...');
}
const onPressCD = () => {
Alert.alert('Countdown Component Pressed...');
}
const startRecording = async () => {
try {
await Voice.start('en-US');
} catch (error) {
console.log('error =>> ', error);
}
};
const stopRecording = async () => {
try {
await Voice.stop();
} catch (error) {
console.log(error);
}
};
return (
<SafeAreaView>
<View style={{ flexDirection: "column" }}>
<ImageBackground style={styles.image} source={require("../../assets/game/gameback.png")}>
<View>
<View style={styles.textBody}>
<Text style={styles.text}>Say the name of this color?</Text>
</View>
<Image style={styles.robo} source={require("../../assets/game/robo.png")}></Image>
</View>
<View>
<Image style={styles.blackboard} source={require("../../assets/game/blackboard.png")}></Image>
<View style={{ width: 180, height: 180, backgroundColor: backColor, marginTop: -370, marginLeft: 455, borderRadius: 100 }}>
</View>
</View>
<View style={{ marginTop: 10 }}>
<BackButton path="Color" />
</View>
<View style={{ flexDirection: "row", marginLeft: 420, marginTop: -50 }}>
<View style={{}}>
<TouchableOpacity onPress={startRecording}
style={{ width: "30%", height: "35%", borderRadius: 50 }}>
<Image source={require('../../assets/game/mic2.png')} resizeMode='contain' style={{ flex: 1, marginLeft: -190 }} />
</TouchableOpacity>
</View>
<View style={{ marginLeft: -100, marginTop:-15 }}>
<TouchableOpacity onPress={() => { }}
style={{ width: "60%", height: "50%", borderRadius: 50 }}>
<Image source={require('../../assets/game/finish.png')} resizeMode='contain' style={{ flex: .9, marginLeft: -120, }} />
</TouchableOpacity>
</View>
</View>
</ImageBackground>
</View>
</SafeAreaView>
)
}
const styles = StyleSheet.create({
body: {
flex: 1,
},
image: {
width: "100%",
height: "100%",
},
blackboard: {
marginTop: -420,
marginLeft: 240,
width: "70%",
height: 500,
},
robo: {
marginTop: -70,
marginLeft: -5,
width: 150,
height: 200,
},
textBody: {
marginTop: 150,
marginLeft: 95,
backgroundColor: "#1DCE92",
width: 200,
borderRadius: 50,
padding: 5,
},
text: {
fontSize: 25,
justifyContent: 'center',
alignItems: 'center',
color: "white",
textAlign: 'center',
fontWeight: 'bold'
},
button: {
padding: 10,
marginRight: 50,
color: "#000000",
marginLeft: 50,
}
})
\ No newline at end of file
import { useNavigation } from "@react-navigation/native";
import Orientation from 'react-native-orientation-locker';
import React, { useEffect, useState } from "react";
import { Text, TouchableOpacity, StyleSheet, View, Dimensions, SafeAreaView, ImageBackground, Button, Image, StatusBar } from 'react-native';
import axios from "axios";
import CountDown from 'react-native-countdown-component';
import client from "../client/Client";
import Voice from '@react-native-voice/voice';
import BackButton from "../../component/BackButton"
export default function Yellow() {
const navigation = useNavigation();
const backColor = "yellow";
React.useEffect(() => {
StatusBar.setHidden(true);
const unsubscribe = navigation.addListener("focus", () => {
Orientation.unlockAllOrientations();
Orientation.lockToLandscape();
});
return unsubscribe;
}, [navigation]);
useEffect(() => {
Voice.onSpeechStart = onSpeechStartHandler;
Voice.onSpeechEnd = onSpeechEndHandler;
Voice.onSpeechResults = onSpeechResultsHandler;
Voice.onSpeechPartialResults = onSpeechPartialResults;
// console.log(backColor);
return () => {
Voice.destroy().then(Voice.removeAllListeners);
};
}, []);
const onSpeechStartHandler = e => {
// console.log('start handler =>> ', e);
};
const onSpeechEndHandler = e => {
// console.log('end handler =>> ', e);
};
const onSpeechResultsHandler = e => {
// console.log('result handler =>> ', e);
// setTimeout(() => {
// alert("Please Pronouce Color");
// }, 3000);
const value = e.value;
if(value.includes(backColor) == true){
console.log('Your Answer is Correct');
showAlert = () => {
this.setState({
showAlert: true
});
};
}else{
console.log('Your Answer is Incorrect', value);
}
};
const onSpeechPartialResults = e => {
// console.log('onSpeechPartialResults: ', e);
// const value = e.value;
// console.log(value.length)
// setPartialResults(e.value);
};
const onFinishCD = () => {
Alert.alert('Countdown Finished...');
}
const onPressCD = () => {
Alert.alert('Countdown Component Pressed...');
}
const startRecording = async () => {
try {
await Voice.start('en-US');
} catch (error) {
console.log('error =>> ', error);
}
};
const stopRecording = async () => {
try {
await Voice.stop();
} catch (error) {
console.log(error);
}
};
return (
<SafeAreaView>
<View style={{ flexDirection: "column" }}>
<ImageBackground style={styles.image} source={require("../../assets/game/gameback.png")}>
<View>
<View style={styles.textBody}>
<Text style={styles.text}>Say the name of this color?</Text>
</View>
<Image style={styles.robo} source={require("../../assets/game/robo.png")}></Image>
</View>
<View>
<Image style={styles.blackboard} source={require("../../assets/game/blackboard.png")}></Image>
<View style={{ width: 180, height: 180, backgroundColor: backColor, marginTop: -370, marginLeft: 455, borderRadius: 100 }}>
</View>
</View>
<View style={{ marginTop: 10 }}>
<BackButton path="Color" />
</View>
<View style={{ flexDirection: "row", marginLeft: 420, marginTop: -50 }}>
<View style={{}}>
<TouchableOpacity onPress={startRecording}
style={{ width: "30%", height: "40%", borderRadius: 50 }}>
<Image source={require('../../assets/game/mic2.png')} resizeMode='contain' style={{ flex: 1, marginLeft: -190 }} />
</TouchableOpacity>
</View>
<View style={{ marginLeft: -100 }}>
<TouchableOpacity onPress={() => { }}
style={{ width: "60%", height: "40%", borderRadius: 50 }}>
<Image source={require('../../assets/game/next.png')} resizeMode='contain' style={{ flex: .9, marginLeft: -90 }} />
</TouchableOpacity>
</View>
</View>
</ImageBackground>
</View>
</SafeAreaView>
)
}
const styles = StyleSheet.create({
body: {
flex: 1,
},
image: {
width: "100%",
height: "100%",
},
blackboard: {
marginTop: -420,
marginLeft: 240,
width: "70%",
height: 500,
},
robo: {
marginTop: -70,
marginLeft: -5,
width: 150,
height: 200,
},
textBody: {
marginTop: 150,
marginLeft: 95,
backgroundColor: "#1DCE92",
width: 200,
borderRadius: 50,
padding: 5,
},
text: {
fontSize: 25,
justifyContent: 'center',
alignItems: 'center',
color: "white",
textAlign: 'center',
fontWeight: 'bold'
},
button: {
padding: 10,
marginRight: 50,
color: "#000000",
marginLeft: 50,
}
})
\ No newline at end of file
......@@ -2,6 +2,10 @@ import axios from 'axios';
// export default axios.create({ baseURL: 'http://192.168.8.102:5000/', timeout: 15000, });
export default axios.create({
<<<<<<< HEAD
baseURL: 'http://192.168.1.101:5000/',
=======
baseURL: 'http://192.168.8.101:5000/',
>>>>>>> 4377b9c5fafb5c155a043560f662f4da96c37e12
timeout: 15000,
});
import { useNavigation } from "@react-navigation/native";
import Orientation from 'react-native-orientation-locker';
import React, { useEffect, useState } from "react";
import { Text,TouchableOpacity, StyleSheet, View, Dimensions, SafeAreaView, ImageBackground, Button, Image, StatusBar} from 'react-native'
import Tts from 'react-native-tts';
export default function sam() {
const hand = () =>{
Tts.speak('Hello');
Tts.setDefaultLanguage('si-US');
Tts.voices().then(voices => console.log(voices));
Tts.sto
}
React.useEffect(() => {
// Tts.speak('Hello, world!');
// Tts.voices().then(voices => console.log(voices));
}, []);
return (
<SafeAreaView>
<Text onPress={() => hand()} >Hellow</Text>
</SafeAreaView>
)
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment