Skip to content

2
2023-029
Commit b8e51d59 authored by Gamage B.G.J's avatar Gamage B.G.J
Browse files
Options

Merge branch 'IT20251000' into 'master' 

It20251000

See merge request !22
parents 934fd58c 0d2a5544
Show whitespace changes
Inline Side-by-side
Showing with 528 additions and 133 deletions
Project/Backend/Server_Node/yarn.lock
View file @ b8e51d59
......@@ -486,14 +486,14 @@
"version" "1.0.0"
"js-tokens@^3.0.0 || ^4.0.0":
version "4.0.0"
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
integrity sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==
"integrity" "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ=="
"resolved" "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz"
"version" "4.0.0"
jsonwebtoken@^9.0.0:
version "9.0.1"
resolved "https://registry.yarnpkg.com/jsonwebtoken/-/jsonwebtoken-9.0.1.tgz#81d8c901c112c24e497a55daf6b2be1225b40145"
integrity sha512-K8wx7eJ5TPvEjuiVSkv167EVboBDv9PZdDoF7BgeQnBLVvZWW9clr2PsQHVJDTKaEIH5JBIwHujGcHp7GgI2eg==
"jsonwebtoken@^9.0.0":
"integrity" "sha512-tuGfYXxkQGDPnLJ7SibiQgVgeDgfbPq2k2ICcbgqW8WxWLBAxKQM/ZCu/IT8SOSwmaYl4dpTFCW5xZv7YbbWUw=="
"resolved" "https://registry.npmjs.org/jsonwebtoken/-/jsonwebtoken-9.0.0.tgz"
"version" "9.0.0"
dependencies:
"jws" "^3.2.2"
"lodash" "^4.17.21"
......@@ -527,17 +527,17 @@ jsonwebtoken@^9.0.0:
"resolved" "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz"
"version" "4.17.21"
loose-envify@^1.4.0:
version "1.4.0"
resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==
"loose-envify@^1.1.0", "loose-envify@^1.4.0":
"integrity" "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q=="
"resolved" "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz"
"version" "1.4.0"
dependencies:
js-tokens "^3.0.0 || ^4.0.0"
"js-tokens" "^3.0.0 || ^4.0.0"
lru-cache@^6.0.0:
version "6.0.0"
resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-6.0.0.tgz#6d6fe6570ebd96aaf90fcad1dafa3b2566db3a94"
integrity sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==
"lru-cache@^6.0.0":
"integrity" "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA=="
"resolved" "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz"
"version" "6.0.0"
dependencies:
"yallist" "^4.0.0"
......@@ -749,19 +749,19 @@ lru-cache@^6.0.0:
"resolved" "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz"
"version" "2.0.1"
prop-types@^15.5.10:
version "15.8.1"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.8.1.tgz#67d87bf1a694f48435cf332c24af10214a3140b5"
integrity sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==
"prop-types@^15.5.10", "prop-types@^15.6.0", "prop-types@^15.6.2":
"integrity" "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg=="
"resolved" "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz"
"version" "15.8.1"
dependencies:
loose-envify "^1.4.0"
object-assign "^4.1.1"
react-is "^16.13.1"
"loose-envify" "^1.4.0"
"object-assign" "^4.1.1"
"react-is" "^16.13.1"
proxy-addr@~2.0.7:
version "2.0.7"
resolved "https://registry.yarnpkg.com/proxy-addr/-/proxy-addr-2.0.7.tgz#f19fe69ceab311eeb94b42e70e8c2070f9ba1025"
integrity sha512-llQsMLSUDUPT44jdrU/O37qlnifitDP+ZwrmmZcoSKyLKvtZxpyV0n2/bD/N4tBAAZ/gJEdZU7KMraoK1+XYAg==
"proxy-addr@~2.0.7":
"integrity" "sha512-llQsMLSUDUPT44jdrU/O37qlnifitDP+ZwrmmZcoSKyLKvtZxpyV0n2/bD/N4tBAAZ/gJEdZU7KMraoK1+XYAg=="
"resolved" "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz"
"version" "2.0.7"
dependencies:
"forwarded" "0.2.0"
"ipaddr.js" "1.9.1"
......@@ -808,28 +808,28 @@ proxy-addr@~2.0.7:
"iconv-lite" "0.4.24"
"unpipe" "1.0.0"
react-ga@^2.2.0:
version "2.7.0"
resolved "https://registry.yarnpkg.com/react-ga/-/react-ga-2.7.0.tgz#24328f157f31e8cffbf4de74a3396536679d8d7c"
integrity sha512-AjC7UOZMvygrWTc2hKxTDvlMXEtbmA0IgJjmkhgmQQ3RkXrWR11xEagLGFGaNyaPnmg24oaIiaNPnEoftUhfXA==
"react-ga@^2.2.0":
"integrity" "sha512-AjC7UOZMvygrWTc2hKxTDvlMXEtbmA0IgJjmkhgmQQ3RkXrWR11xEagLGFGaNyaPnmg24oaIiaNPnEoftUhfXA=="
"resolved" "https://registry.npmjs.org/react-ga/-/react-ga-2.7.0.tgz"
"version" "2.7.0"
react-is@^16.13.1:
version "16.13.1"
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
"react-is@^16.13.1":
"integrity" "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
"resolved" "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz"
"version" "16.13.1"
react-mic@^12.4.6:
version "12.4.6"
resolved "https://registry.yarnpkg.com/react-mic/-/react-mic-12.4.6.tgz#e66ca4e1074ebfd26f6972f26ba2d99d85fd3bc2"
integrity sha512-2/DZoz7thR2nJyekF10zBvs/7a8HhUQ4L8MV6BpC+Q/T8G1MvpRHGSHjSlVtnbzaCMDJ3R1MdThoLu15WuVh/g==
"react-mic@^12.4.6":
"integrity" "sha512-2/DZoz7thR2nJyekF10zBvs/7a8HhUQ4L8MV6BpC+Q/T8G1MvpRHGSHjSlVtnbzaCMDJ3R1MdThoLu15WuVh/g=="
"resolved" "https://registry.npmjs.org/react-mic/-/react-mic-12.4.6.tgz"
"version" "12.4.6"
dependencies:
prop-types "^15.5.10"
react-ga "^2.2.0"
"prop-types" "^15.5.10"
"react-ga" "^2.2.0"
readable-stream@^2.2.2:
version "2.3.8"
resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.3.8.tgz#91125e8042bba1b9887f49345f6277027ce8be9b"
integrity sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==
"react@^15.6.2 || ^16.0", "react@16.x":
"integrity" "sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g=="
"resolved" "https://registry.npmjs.org/react/-/react-16.14.0.tgz"
"version" "16.14.0"
dependencies:
"core-util-is" "~1.0.0"
"inherits" "~2.0.3"
......
Project/Backend/Server_Python/controllers/video_to_sign_language_controller.py
View file @ b8e51d59
......@@ -5,6 +5,7 @@ import speech_recognition as sr
from fastapi import APIRouter, File, HTTPException, UploadFile
from fastapi.responses import JSONResponse
from pymongo.mongo_client import MongoClient
from bson import ObjectId
from core.logger import setup_logger
......@@ -26,6 +27,21 @@ router = APIRouter()
logger = setup_logger()
# @router.get("/rest_pyton/items")
# async def read_root():
# return {"message": "Hello, World!"}
@router.get("/rest_pyton/items")
async def read_items():
items = []
for item in items_collection.find():
item_dict = dict(item)
item_dict['_id'] = str(item_dict['_id']) # Convert _id to a string
items.append(item_dict)
return {"items": items}
@router.post("/rest_pyton/uploaded_video")
async def uploaded_video(file: UploadFile = File(...)):
try:
......
Project/Backend/Server_Python/main.py
View file @ b8e51d59
from fastapi import FastAPI
from controllers import translate_controler, users_controller, video_to_sign_language_controller
from controllers import (
translate_controler,
users_controller,
video_to_sign_language_controller,
)
from fastapi.responses import RedirectResponse
from fastapi.middleware.cors import CORSMiddleware
from pymongo.mongo_client import MongoClient
......@@ -33,7 +37,6 @@ async def shutdown_db_client():
app.mongodb_client.close()
logger = setup_logger()
app.include_router(users_controller.router)
......@@ -47,16 +50,26 @@ origins = [
"http://localhost:8080",
"http://localhost:8004",
"http://localhost:3000",
"http://127.0.0.1:8000"
"http://127.0.0.1:8000",
"127.0.0.1:55553",
"http://localhost:52823",
"http://localhost:53826",
"http://localhost:51373",
"http://localhost:51489",
"https://v6p9d9t4.ssl.hwcdn.net",
"https://64f66d39fdef493229b2ddd9--lambent-unicorn-97396a.netlify.app"
]
app.add_middleware(CORSMiddleware,
app.add_middleware(
CORSMiddleware,
allow_origins=origins,
allow_credentials=True,
allow_methods=["*"],
allow_headers=["*"])
allow_headers=["*"],
)
@app.get('/')
@app.get("/")
async def root():
url = app.docs_url or '/docs'
url = app.docs_url or "/docs"
return RedirectResponse(url)
Project/Backend/Server_Python/node_modules/.yarn-integrity 0 → 100644
View file @ b8e51d59
{
"systemParams": "win32-x64-93",
"modulesFolders": [],
"flags": [],
"linkedModules": [],
"topLevelPatterns": [],
"lockfileEntries": {},
"files": [],
"artifacts": {}
}
\ No newline at end of file
Project/Backend/Server_Python/yarn.lock 0 → 100644
View file @ b8e51d59
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
# yarn lockfile v1
Project/Frontend/SignConnectPlus/package.json
View file @ b8e51d59
......@@ -96,6 +96,7 @@
"react-table-sticky": "^1.1.3",
"react-timer-hook": "^3.0.5",
"react-to-print": "^2.14.12",
"react-unity-webgl": "^9.4.3",
"react-webcam": "^7.1.1",
"react-window": "^1.8.9",
"react-zoom-pan-pinch": "^3.0.7",
......@@ -110,11 +111,7 @@
"util": "^0.12.5",
"uuid": "^9.0.0",
"web-vitals": "^3.3.1",
"yup": "^1.1.1",
"@material-ui/core": "^4.12.4",
"@mui/icons-material": "^5.14.6",
"react-material-file-upload": "^0.0.4",
"react-webcam": "^7.1.1"
"yup": "^1.1.1"
},
"scripts": {
"start": "react-app-rewired start",
......
Project/Frontend/SignConnectPlus/src/pages/video-to-sign-language/VideoTranslate/VideoTranslate.tsx
View file @ b8e51d59
......@@ -24,7 +24,19 @@ import { CloudUploadOutlined, CopyOutlined, HighlightOutlined, TranslationOutlin
import axios from 'axios';
import { MuiFileInput } from 'mui-file-input';
import { useSnackbar } from 'notistack';
import { useState } from 'react';
import React, { useState } from 'react';
// import Unity, { UnityContext } from "react-unity-webgl";
// ---------- * Unity Application * ------------------------------
// const unityContext = new UnityContext ({
// loaderUrl: "build/myunityapp.loader.js",
// dataUrl: "build/myunityapp.data",
// frameworkUrl: "build/myunityapp.framework.js",
// codeUrl: "build/myunityapp.wasm",
// });
// ==============================|| List ||============================== //
......@@ -35,6 +47,7 @@ const VideoTranslate = () => {
const [value, setValue] = useState('');
const [translatedTextSi, setTranslatedTextSi] = useState('');
const [translatedTextEn, setTranslatedTextEn] = useState('');
const [showUnityWebGL, setShowUnityWebGL] = useState(false);
const handleDropSingleFile = (files: any) => {
if (files) {
......@@ -103,6 +116,10 @@ const VideoTranslate = () => {
});
setTranslatedTextEn(response.data.translated_text_en)
setTranslatedTextSi(response.data.translated_text_si)
// Show the Unity WebGL build
setShowUnityWebGL(true);
setLoading(false)
} catch (error) {
......@@ -217,7 +234,7 @@ const VideoTranslate = () => {
</Card>
</Grid>
<Grid item xs={12} md={6}>
<Card sx={{ p: 5, minHeight: 300, marginBottom: '10px', marginRight: '10px' }}>
<Card sx={{ p: 7, minHeight: 300, marginBottom: '10px', marginRight: '10px' }}>
<Box display="grid" gap={5}>
<Stack spacing={2}>
<Grid container spacing={1}>
......@@ -248,6 +265,67 @@ const VideoTranslate = () => {
>
Translate
</Button>
{/* ... other JSX ... */}
{/* Conditionally render the Unity WebGL build */}
{showUnityWebGL && (
<iframe
src="https://64f66d39fdef493229b2ddd9--lambent-unicorn-97396a.netlify.app/"
width="700px"
height="700px" // Adjust the height as needed
title="Unity WebGL"
style={{ border: 'none', overflow: 'hidden' }}
></iframe>
)}
{/* ... other JSX ... */}
{/* -------- Translated Sinhala Unicode ------------------------- */}
<Typography variant="overline" sx={{ color: 'text.secondary', fontStyle: 'italic', marginBottom: 2 }}>
Sinhala Unicode
</Typography>
<TextField
sx={{
marginBottom: 2
}}
fullWidth
value={translatedTextSi}
onChange={handleChange}
InputProps={{
endAdornment: (
<InputAdornment position="end">
<IconButton onClick={() => onCopy(value)}>
<CopyOutlined />
</IconButton>
</InputAdornment>
)
}}
/>
{/* -------- Translated English Unicode ------------------------- */}
<Typography variant="overline" sx={{ color: 'text.secondary', fontStyle: 'italic' }}>
English Unicode
</Typography>
<TextField
fullWidth
value={translatedTextEn}
onChange={handleChange}
InputProps={{
endAdornment: (
<InputAdornment position="end">
<IconButton onClick={() => onCopy(value)}>
<CopyOutlined />
</IconButton>
</InputAdornment>
)
}}
/>
{/* ----------------------------- */}
</Grid>
</Grid>
{loading ? (
......@@ -264,20 +342,8 @@ const VideoTranslate = () => {
) : (
<div>
{/* -------- Translated Avatar ------------------------- */}
<Typography variant="overline" sx={{ color: 'text.secondary', marginBottom: 2 }}>
Translated Avatar
</Typography>
<Paper elevation={3} sx={{ p: 2, maxWidth: 600, margin: '0 auto', marginBottom: 3 }}>
<video controls width="100%" height="auto">
{/* <source src="your-video-url.mp4" type="video/mp4" /> */}
Your browser does not support the video tag.
</video>
</Paper>
{/* -------- Translated Sinhala Unicode ------------------------- */}
<Typography variant="overline" sx={{ color: 'text.secondary', fontStyle: 'italic', marginBottom: 2 }}>
{/* <Typography variant="overline" sx={{ color: 'text.secondary', fontStyle: 'italic', marginBottom: 2 }}>
Sinhala Unicode
</Typography>
......@@ -297,10 +363,10 @@ const VideoTranslate = () => {
</InputAdornment>
)
}}
/>
/> */}
{/* -------- Translated English Unicode ------------------------- */}
<Typography variant="overline" sx={{ color: 'text.secondary', fontStyle: 'italic' }}>
{/* <Typography variant="overline" sx={{ color: 'text.secondary', fontStyle: 'italic' }}>
English Unicode
</Typography>
......@@ -317,7 +383,7 @@ const VideoTranslate = () => {
</InputAdornment>
)
}}
/>
/> */}
</div>
)}
</Stack>
......@@ -334,55 +400,3 @@ const VideoTranslate = () => {
};
export default VideoTranslate;
\ No newline at end of file
// // project import
// import { useState } from 'react';
// import MainCard from 'components/MainCard';
// import ScrollX from 'components/ScrollX';
// // assets
// //types
// // ==============================|| List ||============================== //
// const VideoTranslate = () => {
// const [sinhalaTranslation, setSinhalaTranslation] = useState('');
// const [singlishTranslation, setSinglishTranslation] = useState('');
// const handleConvertClick = () => {
// // Perform the video translation logic here
// // You can use the values from `sinhalaTranslation` and `singlishTranslation`
// };
// return (
// <MainCard content={false}>
// <ScrollX>
// <h3> Video Translation here </h3>
// <div>
// <h4>Sinhala Unicode Translation</h4>
// <textarea
// value={sinhalaTranslation}
// onChange={(e) => setSinhalaTranslation(e.target.value)}
// />
// </div>
// <div>
// <h4>Singlish Translation</h4>
// <textarea
// value={singlishTranslation}
// onChange={(e) => setSinglishTranslation(e.target.value)}
// />
// </div>
// <div>
// <button onClick={handleConvertClick}>Convert Video</button>
// </div>
// </ScrollX>
// </MainCard>
// );
// };
// export default VideoTranslate;
Project/Frontend/SignConnectPlus/src/pages/video-to-sign-language/VideoTranslate/VideoTranslate.tsx.bkp 0 → 100644
View file @ b8e51d59
// project import
import {
Box,
Button,
ButtonGroup,
Card,
CardContent,
CardHeader,
Container,
Grid,
IconButton,
InputAdornment,
LinearProgress,
Paper,
// Slider,
Stack,
TextField,
Typography
} from '@mui/material';
import MainCard from 'components/MainCard';
import ScrollX from 'components/ScrollX';
import { CloudUploadOutlined, CopyOutlined, HighlightOutlined, TranslationOutlined } from '@ant-design/icons';
import axios from 'axios';
import { MuiFileInput } from 'mui-file-input';
import { useSnackbar } from 'notistack';
import { useState } from 'react';
// ==============================|| List ||============================== //
const VideoTranslate = () => {
const [file, setFile] = useState<File | string | null>(null);
const [videoUrl, setVideoUrl] = useState('');
const [loading, setLoading] = useState(false);
const [value, setValue] = useState('');
const [translatedTextSi, setTranslatedTextSi] = useState('');
const [translatedTextEn, setTranslatedTextEn] = useState('');
const handleDropSingleFile = (files: any) => {
if (files) {
setFile(
Object.assign(files, {
preview: URL.createObjectURL(files)
})
);
setVideoUrl(URL.createObjectURL(files));
}
};
const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {
setValue(event.target.value);
};
// ----------------- Video Upload ------------------------------------------------
// const TranslateVideoToSignLanguage = async () => {
// if (file) {
// setLoading(true);
// const formData = new FormData();
// //@ts-ignore
// formData.append('video', file, file.name);
// try {
// const response = await VideoToSignLanguageService.videoTranslation(formData);
// const { translated_text_si, translated_text_en } = response.data;
// setTranslatedTextSi(translated_text_si);
// setTranslatedTextEn(translated_text_en);
// if (response.status == 200) {
// console.log(response.data);
// // setValue(response.data.predictions);
// } else {
// enqueueSnackbar('Something went Wrong!', { variant: 'error' });
// }
// // setLoading(false);
// } catch (error) {
// console.log(error);
// setLoading(false);
// enqueueSnackbar('Something went Wrong!', { variant: 'error' });
// }
// } else {
// enqueueSnackbar('Please select a file.', { variant: 'warning' });
// }
// };
async function uploadVideo() {
setLoading(true)
if (file) {
const formData = new FormData();
formData.append('file', file);
try {
const response = await axios.post('http://127.0.0.1:8000/rest_pyton/uploaded_video', formData, {
headers: {
'Content-Type': 'multipart/form-data',
},
});
setTranslatedTextEn(response.data.translated_text_en)
setTranslatedTextSi(response.data.translated_text_si)
setLoading(false)
} catch (error) {
console.error('Error:', error);
setLoading(false)
}
} else {
console.error('No file selected.');
setLoading(false)
}
}
const { enqueueSnackbar } = useSnackbar();
const onCopy = (text: string) => {
if (text) {
navigator.clipboard.writeText(text);
enqueueSnackbar('Copied!', { variant: 'success' });
}
};
return (
<MainCard content={false}>
<ScrollX>
{/* Content Here */}
<Container
sx={{
padding: 3,
bgcolor: '#625D5D',
color: '#fafafb',
borderRadius: 6,
// boxShadow: '0px 4px 6px rgba(0, 0, 0, 0.1)' // Subtle box shadow
}}
>
{/* Double Button Here */}
<ButtonGroup
disableElevation
variant="contained"
aria-label="Customized buttons"
sx={{
marginBottom: '20px',
backgroundColor: '#ff3c3c', // Change background color
'& .MuiButton-root': { // Apply styles to individual buttons
color: 'white', // Text color
'&:hover': {
backgroundColor: '#000000' // Change color on hover
}
}
}}
>
<Button
sx={{
bgcolor: '#ff3c3c',
padding: '10px 50px',
fontSize: '1.05rem', // Larger font size
'& .anticon': {
fontSize: '1.2rem', // Larger icon size
},
}}
// variant={checkTranalationTypeForUpload()}
startIcon={<CloudUploadOutlined />}
// onClick={() => {
// setIsUploadFile(true);
// }}
>
Upload
</Button>
<Button
sx={{
bgcolor: '#ff3c3c',
padding: '10px 50px',
fontSize: '1.05rem', // Larger font size
'& .anticon': {
fontSize: '1.2rem', // Larger icon size
},
}}
// variant={checkTranalationTypeForRecord()}
startIcon={<HighlightOutlined />}
// onClick={() => {
// setIsUploadFile(false);
// }}
>
Text
</Button>
</ButtonGroup>
{/* Video uploading */}
<Box sx={{ flexGrow: 1 }}>
<Card>
<CardHeader title="Upload a video | Drag & Drop or Select File" />
<Grid container spacing={2}>
<Grid item xs={12} md={6}>
<Card sx={{ marginBottom: '20px', marginLeft: '10px', padding: '35px 10px' }}>
<CardContent>
{/* ! Important */}
{/* @ts-ignore */}
<MuiFileInput value={file} onChange={handleDropSingleFile} inputProps={{ accept: 'video/*' }} />
<Paper style={{ padding: '20px', marginTop: '15px' }}>
<Typography variant="h5" align="center" gutterBottom>
Preview
</Typography>
<div style={{ marginTop: '20px', textAlign: 'center' }}>
{file ? <video src={videoUrl} width="400" controls /> : <p>No Video Selected ...</p>}
</div>
</Paper>
</CardContent>
</Card>
</Grid>
<Grid item xs={12} md={6}>
<Card sx={{ p: 5, minHeight: 300, marginBottom: '10px', marginRight: '10px' }}>
<Box display="grid" gap={5}>
<Stack spacing={2}>
<Grid container spacing={1}>
{/* <Grid item xs={12} md={6}> */}
{/* <h3>Set Sign Speed </h3> */}
{/* <Slider
defaultValue={30}
getAriaValueText={valuetext}
valueLabelDisplay="auto"
step={10}
marks
min={10}
max={110}
/> */}
{/* <h4>Speed - {speed}</h4> */}
{/* </Grid> */}
<Grid item xs={12} md={6} container direction="row" justifyContent="flex-start" alignItems="center">
<Button
variant="contained"
style={{ width: '200px', height: '60px', fontSize: '20px' }}
sx={{
mb: 3
}}
disabled={loading}
onClick={uploadVideo}
endIcon={<TranslationOutlined />}
>
Translate
</Button>
</Grid>
</Grid>
{loading ? (
<Card>
<CardContent>
<LinearProgress />
<center>
<Typography variant="h5" component="div" sx={{ marginTop: 2 }}>
Loading...
</Typography>
</center>
</CardContent>
</Card>
) : (
<div>
{/* -------- Translated Avatar ------------------------- */}
<Typography variant="overline" sx={{ color: 'text.secondary', marginBottom: 2 }}>
Translated Avatar
</Typography>
<Paper elevation={3} sx={{ p: 2, maxWidth: 600, margin: '0 auto', marginBottom: 3 }}>
<video controls width="100%" height="auto">
{/* <source src="your-video-url.mp4" type="video/mp4" /> */}
Your browser does not support the video tag.
</video>
</Paper>
{/* -------- Translated Sinhala Unicode ------------------------- */}
<Typography variant="overline" sx={{ color: 'text.secondary', fontStyle: 'italic', marginBottom: 2 }}>
Sinhala Unicode
</Typography>
<TextField
sx={{
marginBottom: 2
}}
fullWidth
value={translatedTextSi}
onChange={handleChange}
InputProps={{
endAdornment: (
<InputAdornment position="end">
<IconButton onClick={() => onCopy(value)}>
<CopyOutlined />
</IconButton>
</InputAdornment>
)
}}
/>
{/* -------- Translated English Unicode ------------------------- */}
<Typography variant="overline" sx={{ color: 'text.secondary', fontStyle: 'italic' }}>
English Unicode
</Typography>
<TextField
fullWidth
value={translatedTextEn}
onChange={handleChange}
InputProps={{
endAdornment: (
<InputAdornment position="end">
<IconButton onClick={() => onCopy(value)}>
<CopyOutlined />
</IconButton>
</InputAdornment>
)
}}
/>
</div>
)}
</Stack>
</Box>
</Card>
</Grid>
</Grid>
</Card>
</Box>
</Container>
</ScrollX>
</MainCard>
);
};
export default VideoTranslate;
\ No newline at end of file
Project/Frontend/SignConnectPlus/yarn.lock
View file @ b8e51d59
......@@ -11116,6 +11116,11 @@ react-transition-group@^4.4.0, react-transition-group@^4.4.5:
loose-envify "^1.4.0"
prop-types "^15.6.2"
react-unity-webgl@^9.4.3:
version "9.4.3"
resolved "https://registry.yarnpkg.com/react-unity-webgl/-/react-unity-webgl-9.4.3.tgz#c13cadb8fd447d817a128e6e05975c4f4c9b8f74"
integrity sha512-P/NhKil8EZRtT3q87DC0EgxdNd3c5wa34DMWr5128r2bZojgVIJJu+b20RtGaJpW4lxg6SB2PNN4+R2QujKlDw==
react-webcam@^7.1.1:
version "7.1.1"
resolved "https://registry.yarnpkg.com/react-webcam/-/react-webcam-7.1.1.tgz#e6290b192cde0d2a1039051a019a18e998d7fb39"
......
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