Skip to content

2
2023-029
Commit 5378cc0a authored by janithGamage's avatar janithGamage
Browse files
Options

fix: update 

Desc : update project
parent 8d807298
Show whitespace changes
Inline Side-by-side
Showing with 413 additions and 68 deletions
Project/Backend/Server_Node/controllers/curriculum.controller.js 0 → 100644
View file @ 5378cc0a
import mongoose from 'mongoose';
import Curriculum from '../models/curriculum.model.js';
export const getAllCurricula = async (req, res) => {
try {
const curricula = await Curriculum.find();
res.status(200).json({ code: "01", result: curricula });
} catch (error) {
res.status(500).json({ code: "00", message: "Something went wrong" });
}
};
export const getCurriculumById = async (req, res) => {
const { id } = req.params;
try {
if (!mongoose.Types.ObjectId.isValid(id)) {
return res.status(404).json({ code: "02", message: `No Curriculum for this id: ${id}` });
}
const curriculum = await Curriculum.findById(id);
if (!curriculum) {
return res.status(404).json({ code: "02", message: `No Curriculum found for this id: ${id}` });
}
res.status(200).json({ code: "01", result: curriculum });
} catch (error) {
res.status(500).json({ code: "00", message: "Something went wrong" });
}
};
export const getTutorialsByCurriculumId = async (req, res) => {
const { curriculumId } = req.params;
try {
if (!mongoose.Types.ObjectId.isValid(curriculumId)) {
return res.status(404).json({ code: "02", message: `No Curriculum for this id: ${curriculumId}` });
}
const curriculum = await Curriculum.findById(curriculumId);
if (!curriculum) {
return res.status(404).json({ code: "02", message: `No Curriculum found for this id: ${curriculumId}` });
}
const tutorials = curriculum.tutorials;
res.status(200).json({ code: "01", result: tutorials });
} catch (error) {
res.status(500).json({ code: "00", message: "Something went wrong" });
}
};
export const getTasksByCurriculumAndTutorialId = async (req, res) => {
const { curriculumId, tutorialId } = req.params;
try {
if (!mongoose.Types.ObjectId.isValid(curriculumId)) {
return res.status(404).json({ code: "02", message: `No Curriculum for this id: ${curriculumId}` });
}
const curriculum = await Curriculum.findById(curriculumId);
if (!curriculum) {
return res.status(404).json({ code: "02", message: `No Curriculum found for this id: ${curriculumId}` });
}
const tutorial = curriculum.tutorials.id(tutorialId);
if (!tutorial) {
return res.status(404).json({ code: "02", message: `No Tutorial found for this id: ${tutorialId}` });
}
const tasks = tutorial.tasks;
res.status(200).json({ code: "01", result: tasks });
} catch (error) {
res.status(500).json({ code: "00", message: "Something went wrong" });
}
};
Project/Backend/Server_Node/controllers/user.controller.js
View file @ 5378cc0a
...@@ -103,7 +103,6 @@ export const signUp = async (req, res) => { ...@@ -103,7 +103,6 @@ export const signUp = async (req, res) => {
const userDetails = new User({ const userDetails = new User({
email, email,
password: hashedPassword, password: hashedPassword,
type,
userDetails: { userDetails: {
userQNumber: uuidv4(), userQNumber: uuidv4(),
userEmail: email, userEmail: email,
...@@ -178,53 +177,59 @@ export const updateUser = async (req, res) => { ...@@ -178,53 +177,59 @@ export const updateUser = async (req, res) => {
return res.status(404).json({ code: "02", message: `No User for this id: ${id}` }); return res.status(404).json({ code: "02", message: `No User for this id: ${id}` });
} }
if (data.type == "buyer" || data.type == "admin") { // if (data.type == "buyer" || data.type == "admin") {
const updateUser = { ...data, _id: id } // const updateUser = { ...data, _id: id }
await User.findByIdAndUpdate(id, updateUser, { new: true }) // await User.findByIdAndUpdate(id, updateUser, { new: true })
res.status(200); // res.status(200);
res.json({ code: "01", result: updateUser }) // res.json({ code: "01", result: updateUser })
} else if (data.type == "trader") { // } else if (data.type == "trader") {
var password = Math.random().toString(36).slice(-8); // var password = Math.random().toString(36).slice(-8);
const hashPassword = await bcrypt.hash(password, 12) // const hashPassword = await bcrypt.hash(password, 12)
const updateUser = { ...data, password: hashPassword, _id: id } // const updateUser = { ...data, password: hashPassword, _id: id }
await User.findByIdAndUpdate(id, updateUser, { new: true }) // await User.findByIdAndUpdate(id, updateUser, { new: true })
//call email service // //call email service
let transporter = nodemailer.createTransport({
service: 'gmail',
auth: {
type: 'OAuth2',
user: process.env.MAIL_USERNAME,
pass: process.env.MAIL_PASSWORD,
clientId: process.env.OAUTH_CLIENTID,
clientSecret: process.env.OAUTH_CLIENT_SECRET,
refreshToken: process.env.OAUTH_REFRESH_TOKEN
}
});
let mailOptions = { // let transporter = nodemailer.createTransport({
from: "janithgamage1.ed@gmail.com", // service: 'gmail',
to: updateUser.email, // auth: {
subject: 'Shop House Project', // type: 'OAuth2',
text: `You are Successfully Approved, you're username: ${updateUser.email} , you're password : ${password}` // user: process.env.MAIL_USERNAME,
}; // pass: process.env.MAIL_PASSWORD,
// clientId: process.env.OAUTH_CLIENTID,
transporter.sendMail(mailOptions, function (err, data) { // clientSecret: process.env.OAUTH_CLIENT_SECRET,
if (err) { // refreshToken: process.env.OAUTH_REFRESH_TOKEN
console.log("Error " + err); // }
} else { // });
console.log("Email sent successfully");
} // let mailOptions = {
}); // from: "janithgamage1.ed@gmail.com",
// to: updateUser.email,
// subject: 'Shop House Project',
// text: `You are Successfully Approved, you're username: ${updateUser.email} , you're password : ${password}`
// };
// transporter.sendMail(mailOptions, function (err, data) {
// if (err) {
// console.log("Error " + err);
// } else {
// console.log("Email sent successfully");
// }
// });
// res.status(200);
// res.json({ code: "01", result: updateUser })
// }
const updateUser = { ...data, _id: id }
await User.findByIdAndUpdate(id, updateUser, { new: true })
res.status(200); res.status(200);
res.json({ code: "01", result: updateUser }) res.json({ code: "01", result: updateUser })
}
} catch (error) { } catch (error) {
......
Project/Backend/Server_Node/models/curriculum.model.js 0 → 100644
View file @ 5378cc0a
import mongoose from "mongoose";
const tutorialSchema = mongoose.Schema({
id: String,
title: String,
description: String,
image: String,
items: [
{
id: String,
title: String,
description: String,
howToDo: [String],
image: String,
video: String,
},
],
});
const curriculumSchema = mongoose.Schema({
id: String,
title: String,
description: String,
image: String,
tutorials: [tutorialSchema],
createdAt: {
type: Date,
default: Date.now,
},
updatedAt: {
type: Date,
default: Date.now,
},
});
const curriculum = mongoose.model("Curriculums", curriculumSchema);
export default curriculum;
Project/Backend/Server_Node/models/user.model.js
View file @ 5378cc0a
...@@ -11,7 +11,7 @@ const userSchema = mongoose.Schema({ ...@@ -11,7 +11,7 @@ const userSchema = mongoose.Schema({
}, },
type: { type: {
type: String, type: String,
required: true default: "N/A",
}, },
userDetails: { userDetails: {
userQNumber: { userQNumber: {
...@@ -37,7 +37,6 @@ const userSchema = mongoose.Schema({ ...@@ -37,7 +37,6 @@ const userSchema = mongoose.Schema({
userType: { userType: {
type: String, type: String,
default: "N/A", default: "N/A",
required: true
}, },
}, },
states: { states: {
......
Project/Backend/Server_Node/routes/curriculum.routes.js 0 → 100644
View file @ 5378cc0a
import express from "express";
import { getAllCurricula, getCurriculumById, getTasksByCurriculumAndTutorialId, getTutorialsByCurriculumId } from "../controllers/curriculum.controller.js";
const router = express.Router();
router.get("/", getAllCurricula);
router.get("/:id", getCurriculumById);
router.get("/:curriculumId/tutorials", getTutorialsByCurriculumId);
router.get("/:curriculumId/tutorials/:tutorialId/tasks", getTasksByCurriculumAndTutorialId);
export default router;
Project/Backend/Server_Node/server.js
View file @ 5378cc0a
...@@ -5,9 +5,11 @@ import express from "express"; ...@@ -5,9 +5,11 @@ import express from "express";
import mongoose from "mongoose"; import mongoose from "mongoose";
//import routes //import routes
import curriculumRoutes from "./routes/curriculum.routes.js";
import translateRoutes from "./routes/translate.routes.js"; import translateRoutes from "./routes/translate.routes.js";
import userRoutes from "./routes/user.routes.js"; import userRoutes from "./routes/user.routes.js";
dotenv.config(); dotenv.config();
const app = express(); const app = express();
...@@ -23,6 +25,7 @@ app.get("/", (req, res) => { ...@@ -23,6 +25,7 @@ app.get("/", (req, res) => {
//implement routes //implement routes
app.use("/rest_node/user", userRoutes); app.use("/rest_node/user", userRoutes);
app.use("/rest_node/ssl", translateRoutes); app.use("/rest_node/ssl", translateRoutes);
app.use("/rest_node/curriculum", curriculumRoutes);
const CONNECTION_URL = `mongodb+srv://${process.env.DB_USERNAME}:${process.env.DB_PASSWORD}@cluster0.dmza8yi.mongodb.net/?retryWrites=true&w=majority`; const CONNECTION_URL = `mongodb+srv://${process.env.DB_USERNAME}:${process.env.DB_PASSWORD}@cluster0.dmza8yi.mongodb.net/?retryWrites=true&w=majority`;
const PORT = process.env.PORT || 5000; const PORT = process.env.PORT || 5000;
......
Project/Frontend/Web_App/src/_mock/arrays/curriculums.json 0 → 100644
View file @ 5378cc0a
[
{
"id": "1",
"title": "Base Level - Learn Sign Language",
"description": "Begin your journey to learn sign language with our Base Level Curriculum. This Curriculum is designed for beginners who want to acquire essential sign language skills. Explore the rich world of sign language as you learn basic vocabulary, grammar, and sentence structures. Discover the art of expressing yourself through gestures and facial expressions, opening doors to effective communication with the deaf and hard of hearing community. With a supportive learning environment, interactive lessons, and hands-on practice, our Base Level Curriculum provides a solid foundation for your sign language journey. Start building connections and breaking down barriers today!",
"image": "https://drive.google.com/uc?export=view&id=1YACBlu7X-O7-DKv5DoW3AM9kgfT7Yhdc",
"tutorials": [
{
"id": "1",
"title": "Numbers and Counting in Sign Language",
"description": "Learn how to express numbers and counting in sign language. This tutorial focuses on teaching you the signs for numbers one to ten. Mastering number signs will enhance your ability to communicate effectively in various contexts. Through interactive lessons and practice exercises, you will gain confidence in using sign language for numerical expressions.",
"image": "https://drive.google.com/uc?export=view&id=1GeFzoy3xt8UnfCQE3IPVjPXoAg7GAWgf",
"items": [
{
"id": "1",
"title": "Learn Number One",
"description": "In this lesson, you will learn how to sign the number one. Understanding this basic sign is crucial for counting and expressing singular items or concepts in sign language. Practice the hand shape, movement, and facial expression associated with the sign to improve your fluency.",
"howToDo": [
"- Extend your index finger straight up.",
"- Keep the rest of your fingers closed.",
"- Hold your hand in front of your chest."
],
"image": "https://drive.google.com/uc?export=view&id=17sHGfW9zip8xAwbRtUihzxkseKq-Qn7q",
"video": ""
},
{
"id": "2",
"title": "Learn Number Two",
"description": "In this lesson, you will learn how to sign the number two. Mastering this sign is essential for counting and expressing pairs or dual concepts in sign language. Pay attention to the hand shape, movement, and facial expression involved in signing the number two to enhance your signing skills.",
"howToDo": [
"- Extend your index and middle fingers straight up.",
"- Keep the rest of your fingers closed.",
"- Hold your hand in front of your chest."
],
"image": "https://drive.google.com/uc?export=view&id=1Nm-we15Rrr04ovRC1sr-ZVMNHbnALRm2",
"video": ""
},
{
"id": "3",
"title": "Learn Number Three",
"description": "In this lesson, you will learn how to sign the number three in sign language. Mastering this sign is essential for expressing the quantity or position of three items. Pay attention to the hand shape, movement, and facial expression involved in signing the number three to enhance your signing skills.",
"howToDo": [
"- Extend your index, middle, and ring fingers straight up.",
"- Keep the rest of your fingers closed.",
"- Hold your hand in front of your chest."
],
"image": "https://drive.google.com/uc?export=view&id=1mKY8D1utbqm8flnNM7DZRKtuPQDXqFSm",
"video": ""
},
{
"id": "4",
"title": "Learn Number Four",
"description": "In this lesson, you will learn how to sign the number four in sign language. This sign is commonly used for counting or indicating the quantity or position of four items. Focus on the hand shape, movement, and expression to accurately convey the number four in sign language.",
"howToDo": [
"- Extend your thumb, index, middle, and ring fingers straight up.",
"- Keep your pinky finger folded.",
"- Hold your hand in front of your chest."
],
"image": "https://drive.google.com/uc?export=view&id=1VtbHehsxbOC04fVR6_Ca6HDv6csH17SJ",
"video": "https://example.com/number_four_video.mp4"
},
{
"id": "5",
"title": "Learn Number Five",
"description": "In this lesson, you will learn how to sign the number five in sign language. Mastering this sign is crucial for counting, expressing quantities, or representing the concept of five. Practice the hand shape, movement, and facial expression to effectively communicate the number five in sign language.",
"howToDo": [
"- Extend all your fingers straight up.",
"- Keep your thumb resting on the side of your palm.",
"- Hold your hand in front of your chest."
],
"image": "https://drive.google.com/uc?export=view&id=1G6qx4dhHTKUPvNag0R3qlDJugNOgcTqM",
"video": ""
},
{
"id": "6",
"title": "Learn Number Six",
"description": "In this lesson, you will learn how to sign the number six in sign language. This sign is commonly used for counting, indicating quantities, or representing the concept of six. Pay attention to the hand shape, movement, and expression involved in signing the number six to enhance your signing proficiency.",
"howToDo": [
"- Extend your thumb and pinky finger straight up.",
"- Keep the rest of your fingers closed.",
"- Hold your hand in front of your chest."
],
"image": "https://drive.google.com/uc?export=view&id=1Q2TbcPTx8KuLp4v2mPL_7GHO0l52DZXw",
"video": "https://example.com/number_six_video.mp4"
},
{
"id": "7",
"title": "Learn Number Seven",
"description": "In this lesson, you will learn how to sign the number seven in sign language. Mastering this sign is essential for counting, expressing quantities, or representing the concept of seven. Focus on the hand shape, movement, and facial expression to accurately convey the number seven in sign language.",
"howToDo": [
"- Extend your index, middle, and ring fingers straight up.",
"- Keep your thumb, pinky, and pinky finger folded.",
"- Hold your hand in front of your chest."
],
"image": "https://drive.google.com/uc?export=view&id=1Jwt1TqXO1L7t3JFqQYzKL4S4GCuqULJ1",
"video": "https://example.com/number_seven_video.mp4"
},
{
"id": "8",
"title": "Learn Number Eight",
"description": "In this lesson, you will learn how to sign the number eight in sign language. This sign is commonly used for counting, indicating quantities, or representing the concept of eight. Practice the hand shape, movement, and expression to effectively communicate the number eight in sign language.",
"howToDo": [
"- Extend all your fingers straight up.",
"- Cross your index and middle fingers over your ring and pinky fingers.",
"- Hold your hand in front of your chest."
],
"image": "https://drive.google.com/uc?export=view&id=1zSf4hmqIUCcfebgoD6DTWmJ3NxY36LJL",
"video": "https://example.com/number_eight_video.mp4"
},
{
"id": "9",
"title": "Learn Number Nine",
"description": "In this lesson, you will learn how to sign the number nine in sign language. Mastering this sign is crucial for counting, expressing quantities, or representing the concept of nine. Pay attention to the hand shape, movement, and expression involved in signing the number nine to enhance your signing proficiency.",
"howToDo": [
"- Extend your thumb and all your fingers straight up.",
"- Keep your pinky finger folded.",
"- Hold your hand in front of your chest."
],
"image": "https://drive.google.com/uc?export=view&id=16WB1Ifhq_ozKOO-ehfIqVRB6oC3B5STw",
"video": "https://example.com/number_nine_video.mp4"
},
{
"id": "10",
"title": "Learn Number Ten",
"description": "In this lesson, you will learn how to sign the number ten in sign language. This sign is commonly used for counting, indicating quantities, or representing the concept of ten. Focus on the hand shape, movement, and facial expression to accurately convey the number ten in sign language.",
"howToDo": [
"- Extend your thumb, index, and middle fingers straight up.",
"- Keep the rest of your fingers closed.",
"- Hold your hand in front of your chest."
],
"image": "https://drive.google.com/uc?export=view&id=11tCYFYjdVrr5LIFGyzOrIUg8bTURATZh",
"video": "https://example.com/number_ten_video.mp4"
}
]
},
{
"id": "2",
"title": "Learn the Basics of Sign Language",
"description": "Introduce the concept of sign language and its importance.\nTeach basic greetings and expressions, such as hello, goodbye, thank you, and sorry.\nProvide visual demonstrations and practice exercises for learners to practice these basic signs.",
"image": "https://drive.google.com/uc?export=view&id=1BeJ4OS7mWsO3IuaJaORotEFGpcRuhonq",
"items": []
},
{
"id": "3",
"title": "Family Signs in Sign Language",
"description": "Teach signs for family members, such as mother, father, sister, brother, etc.\nIntroduce signs for common family-related words, such as family, love, and home.\nProvide visual demonstrations and practice exercises for learners to practice these family signs.",
"image": "https://drive.google.com/uc?export=view&id=1_b3-0HAAWu5Ze20IAAKWxUSUS-fac6Dg",
"items": []
},
{
"id": "4",
"title": "Everyday Vocabulary in Sign Language",
"description": "Teach signs for everyday objects and activities, such as eat, drink, sleep, book, pen, etc.\nIntroduce signs for common words used in daily life.\nProvide visual demonstrations and interactive exercises for learners to practice using these signs.",
"image": "https://drive.google.com/uc?export=view&id=1QqmeBBiAojz7jaHUUdQGLyqUVR-mKSsy",
"items": []
},
{
"id": "5",
"title": "Basic Conversational Phrases in Sign Language",
"description": "Teach simple conversational phrases, such as \"What is your name?\" or \"How are you?\"\nIntroduce signs for common question words and phrases.\nProvide visual demonstrations and practice exercises for learners to practice these conversational phrases.",
"image": "https://drive.google.com/uc?export=view&id=1McSxkqPb7ZnlsDKfZfTj6OTS5GvXXKFE",
"items": []
}
]
},
{
"id": "2",
"title": "Medium Level - Enhancing Sign Language Skills",
"description": "Take your sign language skills to the next level with our Medium Level Curriculum. Designed for learners with some basic knowledge of sign language, this Curriculum focuses on expanding your vocabulary, improving grammar usage, and honing your expressive abilities. Dive deeper into the intricacies of sign language communication, including idiomatic expressions and storytelling techniques. Engage in interactive exercises, role-playing scenarios, and conversations to strengthen your fluency. With challenging yet rewarding lessons, our Medium Level Curriculum empowers you to communicate more effectively and connect with the deaf community on a deeper level.",
"image": "https://drive.google.com/uc?export=view&id=1b5C6VNO55k3Wj6DJ-vJiUFFEuQnXs5Jo",
"tutorials": []
},
{
"id": "3",
"title": "Advanced Level - Mastering Sign Language",
"description": "Become a proficient sign language user with our Advanced Level Curriculum. Designed for experienced sign language learners, this comprehensive Curriculum delves into advanced topics, such as complex grammar structures, specialized vocabulary, and cultural nuances. Refine your receptive and expressive skills through immersive activities, real-life simulations, and in-depth discussions. Explore various sign language modalities and gain a deep understanding of different signing systems. With personalized feedback and guidance from expert instructors, our Advanced Level Curriculum propels you towards mastery of sign language and equips you to engage in diverse contexts with confidence.",
"image": "https://drive.google.com/uc?export=view&id=1k-CtiCkM3efhmTBet-JZt2izxVrAdBL3",
"tutorials": []
}
]
\ No newline at end of file
Project/Frontend/Web_App/src/pages/dashboard/learning-module/curriculum/curriculums/[curriculumId]/tutorials/[tutorialId].tsx
View file @ 5378cc0a
...@@ -12,6 +12,7 @@ import Scrollbar from 'src/components/scrollbar/Scrollbar'; ...@@ -12,6 +12,7 @@ import Scrollbar from 'src/components/scrollbar/Scrollbar';
import { Upload } from 'src/components/upload'; import { Upload } from 'src/components/upload';
import { NAV } from 'src/config'; import { NAV } from 'src/config';
import useCountup from 'src/hooks/useCountup'; import useCountup from 'src/hooks/useCountup';
import CameraCapture from 'src/sections/@dashboard/learning-module/curriculum/CameraCapture';
import { useSettingsContext } from '../../../../../../../components/settings'; import { useSettingsContext } from '../../../../../../../components/settings';
import DashboardLayout from '../../../../../../../layouts/dashboard'; import DashboardLayout from '../../../../../../../layouts/dashboard';
...@@ -196,6 +197,7 @@ export default function TutorialViewPage() { ...@@ -196,6 +197,7 @@ export default function TutorialViewPage() {
<StyledListContainer> <StyledListContainer>
<List> <List>
{menuItems.length < 0 && <><Alert severity='warning'>No Items for this tutorials</Alert></>}
{menuItems.map((item: { id: string, title: string, onItemClick: any, icon: string, handleCheck: any }, index: number) => { {menuItems.map((item: { id: string, title: string, onItemClick: any, icon: string, handleCheck: any }, index: number) => {
index = parseInt(item.id) index = parseInt(item.id)
return ( return (
...@@ -323,7 +325,7 @@ export default function TutorialViewPage() { ...@@ -323,7 +325,7 @@ export default function TutorialViewPage() {
<CardHeader title={`${action.toUpperCase()} - ${itemContent?.title}`} /> <CardHeader title={`${action.toUpperCase()} - ${itemContent?.title}`} />
<CardContent> <CardContent>
<Grid container spacing={3}> <Grid container spacing={3}>
<Grid item md={5}> <Grid item md={6}>
<ButtonGroup aria-label="outlined button group"> <ButtonGroup aria-label="outlined button group">
<Button variant={sourceData == "upload" ? "contained" : "outlined"} onClick={() => { setSourceData("upload") }}>Upload Image</Button> <Button variant={sourceData == "upload" ? "contained" : "outlined"} onClick={() => { setSourceData("upload") }}>Upload Image</Button>
<Button variant={sourceData == "capture" ? "contained" : "outlined"} onClick={() => { setSourceData("capture") }}>Capture Image</Button> <Button variant={sourceData == "capture" ? "contained" : "outlined"} onClick={() => { setSourceData("capture") }}>Capture Image</Button>
...@@ -331,11 +333,23 @@ export default function TutorialViewPage() { ...@@ -331,11 +333,23 @@ export default function TutorialViewPage() {
{!sourceData && <><Alert severity='info'>Select a sourceData Type</Alert></>} {!sourceData && <><Alert severity='info'>Select a sourceData Type</Alert></>}
{sourceData == "upload" && <> {sourceData == "upload" && <>
<Upload sx={{ mt: 3 }} file={file} onDrop={handleDropSingleFile} onDelete={() => setFile(null)} /> <Upload sx={{ mt: 3 }} file={file} onDrop={handleDropSingleFile} onDelete={() => setFile(null)} />
{/* {file != null &&
<>
<Image
disabledEffect
alt={"Reference Image"}
src={"https://drive.google.com/uc?export=view&id=1T7djlWSfUgCFUNrrW5teXUJglZ-uTHLk"}
ratio={"1/1"}
sx={{ borderRadius: 1, mt: 6 }}
/>
<Alert severity='info' sx={{ mt: 2 }}>Captured source</Alert>
</>
} */}
</>} </>}
{sourceData == "capture" && <> {sourceData == "capture" && <>
<Card sx={{ mt: 3 }}> <Card sx={{ mt: 3 }}>
<CardContent> <CardContent>
<Typography variant="h5" paragraph> {/* <Typography variant="h5" paragraph>
Coming Soon! Coming Soon!
</Typography> </Typography>
...@@ -343,13 +357,14 @@ export default function TutorialViewPage() { ...@@ -343,13 +357,14 @@ export default function TutorialViewPage() {
We are currently working hard on this page! We are currently working hard on this page!
</Typography> </Typography>
<ComingSoonIllustration sx={{ my: 1, height: 200 }} /> <ComingSoonIllustration sx={{ my: 1, height: 200 }} /> */}
<CameraCapture />
</CardContent> </CardContent>
</Card> </Card>
</>} </>}
<Alert severity='info' sx={{ mt: 2 }}>Capture a source</Alert> <Alert severity='info' sx={{ mt: 2 }}>Capture a source</Alert>
</Grid> </Grid>
<Grid item md={4}> <Grid item md={6}>
<Grid container spacing={3} rowSpacing={2} sx={{ mt: 8 }}> <Grid container spacing={3} rowSpacing={2} sx={{ mt: 8 }}>
<Grid item md={12}> <Grid item md={12}>
<TextField <TextField
...@@ -382,16 +397,6 @@ export default function TutorialViewPage() { ...@@ -382,16 +397,6 @@ export default function TutorialViewPage() {
</Grid> </Grid>
</Grid> </Grid>
</Grid> </Grid>
<Grid item md={3}>
<Image
disabledEffect
alt={"Reference Image"}
src={"https://drive.google.com/uc?export=view&id=1T7djlWSfUgCFUNrrW5teXUJglZ-uTHLk"}
ratio={"1/1"}
sx={{ borderRadius: 1, mt: 6 }}
/>
<Alert severity='info' sx={{ mt: 2 }}>Captured source</Alert>
</Grid>
</Grid> </Grid>
</CardContent> </CardContent>
</Card> </Card>
......
Project/Frontend/Web_App/src/sections/@dashboard/learning-module/curriculum/CameraCapture.tsx 0 → 100644
View file @ 5378cc0a
import React, { useRef, useState } from 'react';
import Webcam from 'react-webcam';
import Button from '@mui/material/Button';
const CameraCapture: React.FC = () => {
const webcamRef = useRef<Webcam>(null);
const [capturedImage, setCapturedImage] = useState<string | null>(null);
const capture = () => {
if (webcamRef.current) {
const imageSrc = webcamRef.current.getScreenshot();
setCapturedImage(imageSrc);
}
};
return (
<div>
<Webcam audio={false} ref={webcamRef} screenshotFormat="image/jpeg" />
<Button variant="contained" onClick={capture} fullWidth>
Capture
</Button>
{capturedImage && (
<div>
<h2>Captured Image:</h2>
<img src={capturedImage} alt="Captured" />
</div>
)}
</div>
);
};
export default CameraCapture;
Project/Frontend/Web_App/yarn.lock
View file @ 5378cc0a
...@@ -4706,7 +4706,7 @@ react-transition-group@^4.4.5: ...@@ -4706,7 +4706,7 @@ react-transition-group@^4.4.5:
react-webcam@^7.0.1: react-webcam@^7.0.1:
version "7.0.1" version "7.0.1"
resolved "https://registry.npmjs.org/react-webcam/-/react-webcam-7.0.1.tgz" resolved "https://registry.yarnpkg.com/react-webcam/-/react-webcam-7.0.1.tgz#8249e1d621eb4bba7e3f52135f562439d0528df3"
integrity sha512-8E/Eb/7ksKwn5QdLn67tOR7+TdP9BZdu6E5/DSt20v8yfW/s0VGBigE6VA7R4278mBuBUowovAB3DkCfVmSPvA== integrity sha512-8E/Eb/7ksKwn5QdLn67tOR7+TdP9BZdu6E5/DSt20v8yfW/s0VGBigE6VA7R4278mBuBUowovAB3DkCfVmSPvA==
react@^18.2.0: react@^18.2.0:
......
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