Skip to content

S
SpeakEzy_Frontend
Commit 3a4dd072 authored by Shehan Liyanage's avatar Shehan Liyanage
Browse files
Options

Merge branch 'revert-abd1d45a' into 'develop' 

Revert "Merge branch 'NewPages' into 'develop'"

See merge request !7
parents abd1d45a 4b716d96
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 8512 additions and 43641 deletions
.DS_Store deleted 100644 → 0
View file @ abd1d45a
File deleted
.husky/pre-commit
View file @ 3a4dd072
# #!/usr/bin/env sh #!/usr/bin/env sh
# . "$(dirname -- "$0")/_/husky.sh" . "$(dirname -- "$0")/_/husky.sh"
# echo "\n Checking format, lint and types in your project before committing" echo "\n Checking format, lint and types in your project before committing"
# # Check Prettier standards # Check Prettier standards
# npm run format || npm run format ||
# ( (
# echo "\n Prettier Check Failed.\n Run npm run format, add changes and try commit again.\n"; echo "\n Prettier Check Failed.\n Run npm run format, add changes and try commit again.\n";
# false; false;
# ) )
# # Check ESLint Standards # Check ESLint Standards
# npm run lint-staged || npm run lint-staged ||
# ( (
# echo "\n ESLint Check Failed. \n Make the required changes listed above, add changes and try to commit again.\n" echo "\n ESLint Check Failed. \n Make the required changes listed above, add changes and try to commit again.\n"
# false; false;
# ) )
# # If everything passes... Now we can commit # If everything passes... Now we can commit
# echo "Build is completed... I am committing this now. \n" echo "Build is completed... I am committing this now. \n"
package-lock.json deleted 100644 → 0
View file @ abd1d45a
This diff is collapsed.
src/App.tsx
View file @ 3a4dd072
...@@ -2,9 +2,7 @@ import './App.css' ...@@ -2,9 +2,7 @@ import './App.css'
import { ThemeProvider } from '@mui/material/styles' import { ThemeProvider } from '@mui/material/styles'
import { Routes, Route } from 'react-router-dom' import { Routes, Route } from 'react-router-dom'
import HomePage from './Pages/Home/Homepage'
import VideoCall from './Pages/VideoCall/VideoCall' import VideoCall from './Pages/VideoCall/VideoCall'
import SignInSide from './Pages/SignIn/SignInSide'
import { theme } from './Services/Utils/theme' import { theme } from './Services/Utils/theme'
import { Box } from '@mui/material' import { Box } from '@mui/material'
...@@ -14,9 +12,7 @@ function App() { ...@@ -14,9 +12,7 @@ function App() {
<ThemeProvider theme={theme}> <ThemeProvider theme={theme}>
<Box className='App'> <Box className='App'>
<Routes> <Routes>
<Route path='/' element={<SignInSide />} /> <Route path='/' element={<VideoCall />} />
<Route path='/home' element={<HomePage />} />
<Route path='/videocall' element={<VideoCall />} />
<Route path='/:channel' element={<VideoCall />} /> <Route path='/:channel' element={<VideoCall />} />
</Routes> </Routes>
</Box> </Box>
......
src/Pages/Home/Homepage.tsx deleted 100644 → 0
View file @ abd1d45a
import * as React from 'react'
import {
AppBar,
Toolbar,
Typography,
CssBaseline,
Container,
Box,
Grid,
Card,
CardContent,
CardMedia,
Button,
Grow,
IconButton,
} from '@mui/material'
import { createTheme, ThemeProvider } from '@mui/material/styles'
import { useNavigate } from 'react-router-dom'
import VideoCallIcon from '@mui/icons-material/VideoCall'
import SchoolIcon from '@mui/icons-material/School'
import FacebookIcon from '@mui/icons-material/Facebook'
import YouTubeIcon from '@mui/icons-material/YouTube'
import BackgroundImage from '../../Assests/Images/Background.jpeg'
const defaultTheme = createTheme({
palette: {
primary: {
main: '#1976d2',
},
secondary: {
main: '#dc004e',
},
},
typography: {
fontFamily: 'Roboto, sans-serif',
},
})
// function Header() {
// return (
// <AppBar position='static' sx={{ backgroundColor: 'primary.main' }}>
// <Toolbar>
// <Typography
// variant='h4'
// component='div'
// sx={{ flexGrow: 1, fontFamily: 'Roboto', fontWeight: 'bold' }}
// >
// SPEAKEZY
// </Typography>
// <IconButton color='inherit' href='#'>
// <VideoCallIcon />
// </IconButton>
// <IconButton color='inherit' href='#'>
// <SchoolIcon />
// </IconButton>
// </Toolbar>
// </AppBar>
// )
// }
function Footer() {
return (
<Box
sx={{
bgcolor: 'transparent',
background: 'rgba(25, 118, 210, 0.8)',
p: 6,
color: 'white',
}}
component='footer'
>
<Container maxWidth='lg'>
<Grid container spacing={4} justifyContent='space-between'>
<Grid item xs={12} sm={4}>
<Typography
variant='h6'
gutterBottom
sx={{
transition: 'color 0.3s ease, transform 0.3s ease',
'&:hover': {
color: '#ffeb3b',
transform: 'scale(1.05)',
},
}}
>
About Us
</Typography>
<Typography
variant='subtitle1'
sx={{
transition: 'color 0.3s ease, transform 0.3s ease',
'&:hover': {
color: '#ffeb3b',
transform: 'scale(1.05)',
},
}}
>
Learn more about our mission to enhance digital accessibility and inclusivity.
</Typography>
</Grid>
<Grid item xs={12} sm={4}>
<Typography
variant='h6'
gutterBottom
sx={{
transition: 'color 0.3s ease, transform 0.3s ease',
'&:hover': {
color: '#ffeb3b',
transform: 'scale(1.05)',
},
}}
>
Contact
</Typography>
<Typography
variant='subtitle1'
sx={{
transition: 'color 0.3s ease, transform 0.3s ease',
'&:hover': {
color: '#ffeb3b',
transform: 'scale(1.05)',
},
}}
>
Email: contact@speakezy.com
</Typography>
</Grid>
<Grid item xs={12} sm={4}>
<Typography
variant='h6'
gutterBottom
sx={{
transition: 'color 0.3s ease, transform 0.3s ease',
'&:hover': {
color: '#ffeb3b',
transform: 'scale(1.05)',
},
}}
>
Follow Us
</Typography>
<Box sx={{ display: 'flex', justifyContent: 'center' }}>
<IconButton
color='inherit'
href='https://www.facebook.com'
sx={{
transition: 'transform 0.3s ease',
'&:hover': {
color: '#3b5998',
transform: 'scale(1.2)',
},
}}
>
<FacebookIcon fontSize='large' />
</IconButton>
<IconButton
color='inherit'
href='https://www.youtube.com'
sx={{
transition: 'transform 0.3s ease',
'&:hover': {
color: '#FF0000',
transform: 'scale(1.2)',
},
}}
>
<YouTubeIcon fontSize='large' />
</IconButton>
</Box>
</Grid>
</Grid>
<Typography
variant='body2'
align='center'
sx={{
mt: 4,
transition: 'color 0.3s ease, transform 0.3s ease',
'&:hover': { color: '#ffeb3b', transform: 'scale(1.05)' },
}}
>
{'© '}
{new Date().getFullYear()} {'SPEAKEZY. All rights reserved.'}
</Typography>
</Container>
</Box>
)
}
export default function HomePage() {
const navigate = useNavigate()
const handleVideoCallClick = () => {
navigate('/videocall')
}
const handleTrainingClick = () => {
navigate('/training')
}
return (
<ThemeProvider theme={defaultTheme}>
<CssBaseline />
<Box
sx={{
backgroundImage: `url(${BackgroundImage})`,
backgroundRepeat: 'no-repeat',
backgroundSize: 'cover',
backgroundPosition: 'center',
minHeight: '100vh',
display: 'flex',
flexDirection: 'column',
justifyContent: 'center',
alignItems: 'center',
padding: 2,
mb: 0, // Remove margin at the bottom to eliminate gap
}}
>
<Container component='main' maxWidth='lg' sx={{ textAlign: 'center' }}>
<Typography
variant='h2'
component='h1'
sx={{
color: 'white',
fontWeight: 'bold',
mb: 4,
textShadow: '2px 2px 4px rgba(0, 0, 0, 0.5)',
}}
>
Welcome to SPEAKEZY
</Typography>
<Grid container spacing={4} justifyContent='center'>
<Grow in={true} timeout={1000}>
<Grid item xs={12} sm={6} md={4}>
<Card
elevation={8}
sx={{
transition: 'transform 0.3s ease',
'&:hover': { transform: 'scale(1.05)' },
}}
>
<CardMedia>
<Box
sx={{
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
height: 200,
backgroundColor: 'primary.light',
}}
>
<VideoCallIcon sx={{ fontSize: 100, color: 'white' }} />
</Box>
</CardMedia>
<CardContent sx={{ textAlign: 'center' }}>
<Typography variant='h5' component='h2' sx={{ fontWeight: 'bold' }}>
Colloborate with Community
</Typography>
<Button
variant='contained'
color='primary'
sx={{ mt: 2 }}
onClick={handleVideoCallClick}
>
Start Video Call
</Button>
</CardContent>
</Card>
</Grid>
</Grow>
<Grow in={true} timeout={1500}>
<Grid item xs={12} sm={6} md={4}>
<Card
elevation={8}
sx={{
transition: 'transform 0.3s ease',
'&:hover': { transform: 'scale(1.05)' },
}}
>
<CardMedia>
<Box
sx={{
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
height: 200,
backgroundColor: 'secondary.light',
}}
>
<SchoolIcon sx={{ fontSize: 100, color: 'white' }} />
</Box>
</CardMedia>
<CardContent sx={{ textAlign: 'center' }}>
<Typography variant='h5' component='h2' sx={{ fontWeight: 'bold' }}>
Train Sign Language
</Typography>
<Button
variant='contained'
color='secondary'
sx={{ mt: 2 }}
onClick={handleTrainingClick}
>
Start Training
</Button>
</CardContent>
</Card>
</Grid>
</Grow>
</Grid>
</Container>
</Box>
<Footer />
</ThemeProvider>
)
}
src/Pages/SignIn/SignInSide.tsx deleted 100644 → 0
View file @ abd1d45a
import * as React from 'react'
import Avatar from '@mui/material/Avatar'
import Button from '@mui/material/Button'
import CssBaseline from '@mui/material/CssBaseline'
import TextField from '@mui/material/TextField'
import FormControlLabel from '@mui/material/FormControlLabel'
import Checkbox from '@mui/material/Checkbox'
import Link from '@mui/material/Link'
import Paper from '@mui/material/Paper'
import Box from '@mui/material/Box'
import Grid from '@mui/material/Grid'
import LockOutlinedIcon from '@mui/icons-material/LockOutlined'
import Typography from '@mui/material/Typography'
import { createTheme, ThemeProvider } from '@mui/material/styles'
import { useNavigate } from 'react-router-dom'
import SignInSideImage from '../../Assests/Images/SignInSide.jpeg'
function Copyright(props: any) {
return (
<Typography variant='body2' color='text.secondary' align='center' {...props}>
{'Copyright © '}
<Link color='inherit' href='https://mui.com/'>
Your Website
</Link>{' '}
{new Date().getFullYear()}
{'.'}
</Typography>
)
}
const defaultTheme = createTheme()
export default function SignInSide() {
const navigate = useNavigate()
const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {
event.preventDefault()
const data = new FormData(event.currentTarget)
console.log({
email: data.get('email'),
password: data.get('password'),
})
// Simulate authentication logic here
// If authentication is successful, navigate to VideoCall page
navigate('/home')
}
return (
<ThemeProvider theme={defaultTheme}>
<Grid container component='main' sx={{ height: '100vh' }}>
<CssBaseline />
<Grid
item
xs={false}
sm={4}
md={7}
sx={{
backgroundImage: `url(${SignInSideImage})`,
backgroundRepeat: 'no-repeat',
backgroundColor: (t) =>
t.palette.mode === 'light' ? t.palette.grey[50] : t.palette.grey[900],
backgroundSize: 'cover',
backgroundPosition: 'center',
}}
/>
<Grid item xs={12} sm={8} md={5} component={Paper} elevation={6} square>
<Box
sx={{
my: 8,
mx: 4,
display: 'flex',
flexDirection: 'column',
alignItems: 'center',
}}
>
<Avatar sx={{ m: 1, bgcolor: 'secondary.main' }}>
<LockOutlinedIcon />
</Avatar>
<Typography component='h1' variant='h5'>
Sign in
</Typography>
<Box component='form' noValidate onSubmit={handleSubmit} sx={{ mt: 1 }}>
<TextField
margin='normal'
required
fullWidth
id='email'
label='Email Address'
name='email'
autoComplete='email'
autoFocus
/>
<TextField
margin='normal'
required
fullWidth
name='password'
label='Password'
type='password'
id='password'
autoComplete='current-password'
/>
<FormControlLabel
control={<Checkbox value='remember' color='primary' />}
label='Remember me'
/>
<Button type='submit' fullWidth variant='contained' sx={{ mt: 3, mb: 2 }}>
Sign In
</Button>
<Grid container>
<Grid item xs>
<Link href='#' variant='body2'>
Forgot password?
</Link>
</Grid>
<Grid item>
<Link href='#' variant='body2'>
{"Don't have an account? Sign Up"}
</Link>
</Grid>
</Grid>
<Copyright sx={{ mt: 5 }} />
</Box>
</Box>
</Grid>
</Grid>
</ThemeProvider>
)
}
yarn.lock
View file @ 3a4dd072
This diff is collapsed.
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