Skip to content

2
2023-029
Commit 1ab89cbd authored by Paranagama R.P.S.D.'s avatar Paranagama R.P.S.D.
Browse files
Options

feat : Cosmetic changes

parent 9f60708f
Hide whitespace changes
Inline Side-by-side
Showing with 21 additions and 65 deletions
Project/Frontend/SignConnectPlus/src/pages/ssl-translate/process/WebcamStreamCapture.tsx
View file @ 1ab89cbd
import { useRef, useState } from 'react'; import { useRef, useState } from 'react';
import { Button, Grid } from '@mui/material'; import { Button, Grid } from '@mui/material';
import Webcam from 'react-webcam'; import Webcam from 'react-webcam';
import { PauseCircleOutlined, PlayCircleOutlined } from '@ant-design/icons';
//@ts-ignore //@ts-ignore
const WebcamStreamCapture = ({ onVideoRecorded }) => { const WebcamStreamCapture = ({ onVideoRecorded }) => {
const webcamRef = useRef(null); const webcamRef = useRef(null);
...@@ -54,20 +55,11 @@ const WebcamStreamCapture = ({ onVideoRecorded }) => { ...@@ -54,20 +55,11 @@ const WebcamStreamCapture = ({ onVideoRecorded }) => {
<Grid item xs={12}> <Grid item xs={12}>
<center> <center>
{capturing ? ( {capturing ? (
// ! Add Icon <Button onClick={handleStopCaptureClick} startIcon={<PauseCircleOutlined />} color="error" variant="contained">
// <Button onClick={handleStopCaptureClick} startIcon={<StopIcon />} color="error" variant="contained">
// Stop Capture
// </Button>
<Button onClick={handleStopCaptureClick} color="error" variant="contained">
Stop Capture Stop Capture
</Button> </Button>
) : ( ) : (
// ! Add Icon <Button onClick={handleStartCaptureClick} startIcon={<PlayCircleOutlined />} color="error" variant="contained">
// <Button onClick={handleStartCaptureClick} startIcon={<RadioButtonCheckedIcon />} color="error" variant="contained">
// Start Capture
// </Button>
<Button onClick={handleStartCaptureClick} color="error" variant="contained">
Start Capture Start Capture
</Button> </Button>
)} )}
......
Project/Frontend/SignConnectPlus/src/pages/ssl-translate/process/process.tsx
View file @ 1ab89cbd
...@@ -11,6 +11,7 @@ import { ...@@ -11,6 +11,7 @@ import {
CardHeader, CardHeader,
Container, Container,
Grid, Grid,
IconButton,
InputAdornment, InputAdornment,
LinearProgress, LinearProgress,
Paper, Paper,
...@@ -26,6 +27,7 @@ import { useState } from 'react'; ...@@ -26,6 +27,7 @@ import { useState } from 'react';
import { useSnackbar } from 'notistack'; import { useSnackbar } from 'notistack';
import { CloudUploadOutlined, CopyOutlined, TranslationOutlined, VideoCameraOutlined } from '@ant-design/icons';
import { MuiFileInput } from 'mui-file-input'; import { MuiFileInput } from 'mui-file-input';
import SignLanguageToTextService from '../../../services/SignLanguageToText.js'; import SignLanguageToTextService from '../../../services/SignLanguageToText.js';
import WebcamStreamCapture from './WebcamStreamCapture'; import WebcamStreamCapture from './WebcamStreamCapture';
...@@ -45,19 +47,6 @@ const Process = () => { ...@@ -45,19 +47,6 @@ const Process = () => {
const [speed, setSpeed] = useState(0); const [speed, setSpeed] = useState(0);
const [recordedVideoUrl, setRecordedVideoUrl] = useState(null); const [recordedVideoUrl, setRecordedVideoUrl] = useState(null);
// const handleDropSingleFile = useCallback(async (acceptedFiles: File[]) => {
// const file = acceptedFiles[0];
// if (file) {
// setFile(
// Object.assign(file, {
// preview: URL.createObjectURL(file)
// })
// );
// setVideoUrl(URL.createObjectURL(file));
// }
// }, []);
const handleDropSingleFile = (files: any) => { const handleDropSingleFile = (files: any) => {
if (files) { if (files) {
setFile( setFile(
...@@ -87,14 +76,12 @@ const Process = () => { ...@@ -87,14 +76,12 @@ const Process = () => {
const { enqueueSnackbar } = useSnackbar(); const { enqueueSnackbar } = useSnackbar();
// const { copy } = useCopyToClipboard(); const onCopy = (text: string) => {
if (text) {
// const onCopy = (text: string) => { navigator.clipboard.writeText(text);
// if (text) { enqueueSnackbar('Copied!', { variant: 'success' });
// enqueueSnackbar('Copied!'); }
// copy(text); };
// }
// };
const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => { const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {
setValue(event.target.value); setValue(event.target.value);
...@@ -177,45 +164,25 @@ const Process = () => { ...@@ -177,45 +164,25 @@ const Process = () => {
}} }}
> >
<ButtonGroup disableElevation variant="contained" aria-label="Disabled elevation buttons"> <ButtonGroup disableElevation variant="contained" aria-label="Disabled elevation buttons">
{/* ! Important - Add Icon */}
<Button <Button
variant={checkTranalationTypeForUpload()} variant={checkTranalationTypeForUpload()}
startIcon={<CloudUploadOutlined />}
onClick={() => { onClick={() => {
setIsUploadFile(true); setIsUploadFile(true);
}} }}
> >
Upload Upload
</Button> </Button>
{/* <Button
variant={checkTranalationTypeForUpload()}
startIcon={<UploadIcon />}
onClick={() => {
setIsUploadFile(true);
}}
>
Upload
</Button> */}
{/* ! Important - Add Icon */}
<Button <Button
variant={checkTranalationTypeForRecord()} variant={checkTranalationTypeForRecord()}
startIcon={<VideoCameraOutlined />}
onClick={() => { onClick={() => {
setIsUploadFile(false); setIsUploadFile(false);
}} }}
> >
Record Record
</Button> </Button>
{/*
<Button
variant={checkTranalationTypeForRecord()}
startIcon={<EmergencyRecordingIcon />}
onClick={() => {
setIsUploadFile(false);
}}
>
Record
</Button> */}
</ButtonGroup> </ButtonGroup>
{isUploadFile ? ( {isUploadFile ? (
<Box sx={{ flexGrow: 1 }}> <Box sx={{ flexGrow: 1 }}>
...@@ -273,6 +240,7 @@ const Process = () => { ...@@ -273,6 +240,7 @@ const Process = () => {
onClick={() => { onClick={() => {
translateSignLanguageToText(); translateSignLanguageToText();
}} }}
endIcon={<TranslationOutlined />}
> >
Translate Translate
</Button> </Button>
...@@ -302,12 +270,9 @@ const Process = () => { ...@@ -302,12 +270,9 @@ const Process = () => {
InputProps={{ InputProps={{
endAdornment: ( endAdornment: (
<InputAdornment position="end"> <InputAdornment position="end">
{/* <Tooltip title="Copy"> */} <IconButton onClick={() => onCopy(value)}>
{/* Important */} <CopyOutlined />
{/* <IconButton onClick={() => onCopy(value)}> </IconButton>
<Iconify icon="eva:copy-fill" width={24} />
</IconButton> */}
{/* </Tooltip> */}
</InputAdornment> </InputAdornment>
) )
}} }}
...@@ -373,6 +338,7 @@ const Process = () => { ...@@ -373,6 +338,7 @@ const Process = () => {
onClick={() => { onClick={() => {
translateSignLanguageToTextRecord(); translateSignLanguageToTextRecord();
}} }}
endIcon={<TranslationOutlined />}
> >
Translate Translate
</Button> </Button>
...@@ -402,11 +368,9 @@ const Process = () => { ...@@ -402,11 +368,9 @@ const Process = () => {
InputProps={{ InputProps={{
endAdornment: ( endAdornment: (
<InputAdornment position="end"> <InputAdornment position="end">
{/* <Tooltip title="Copy"> */} <IconButton onClick={() => onCopy(value)}>
{/* <IconButton onClick={() => onCopy(value)}> <CopyOutlined />
<Iconify icon="eva:copy-fill" width={24} /> </IconButton>
</IconButton> */}
{/* </Tooltip> */}
</InputAdornment> </InputAdornment>
) )
}} }}
......
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