From 9a5494e201b6e90e3c6f6b08b4f044aa2f1a06c3 Mon Sep 17 00:00:00 2001 From: C4 Patino Date: Fri, 18 Mar 2022 15:39:33 -0500 Subject: [PATCH 1/4] Created prototype Record Route --- client/package-lock.json | 80 +++++++++++++++++++++++++ client/package.json | 1 + client/src/App.jsx | 3 + client/src/components/RecordMp3.jsx | 92 +++++++++++++++++++++++++++++ 4 files changed, 176 insertions(+) create mode 100644 client/src/components/RecordMp3.jsx diff --git a/client/package-lock.json b/client/package-lock.json index 042a62b..0ede1bf 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -17,6 +17,7 @@ "@testing-library/react": "^12.1.3", "@testing-library/user-event": "^13.5.0", "axios": "^0.26.0", + "mic-recorder-to-mp3": "^2.2.2", "react": "^17.0.2", "react-dom": "^17.0.2", "react-router-dom": "^6.2.2", @@ -11151,6 +11152,14 @@ "node": ">= 8" } }, + "node_modules/lamejs": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/lamejs/-/lamejs-1.2.1.tgz", + "integrity": "sha512-s7bxvjvYthw6oPLCm5pFxvA84wUROODB8jEO2+CE1adhKgrIvVOlmMgY8zyugxGrvRaDHNJanOiS21/emty6dQ==", + "dependencies": { + "use-strict": "1.0.1" + } + }, "node_modules/language-subtag-registry": { "version": "0.3.21", "resolved": "https://registry.npmjs.org/language-subtag-registry/-/language-subtag-registry-0.3.21.tgz", @@ -11380,6 +11389,17 @@ "node": ">= 0.6" } }, + "node_modules/mic-recorder-to-mp3": { + "version": "2.2.2", + "resolved": "https://registry.npmjs.org/mic-recorder-to-mp3/-/mic-recorder-to-mp3-2.2.2.tgz", + "integrity": "sha512-xDkOaHbojW3bdKOGn9CI5dT+Mc0RrfczsX/Y1zGJp3FUB4zei5ZKFnNm7Nguc9v910wkd7T3csnCTq5EtCF3Zw==", + "dependencies": { + "lamejs": "^1.2.0" + }, + "peerDependencies": { + "webrtc-adapter": ">=4.1.1" + } + }, "node_modules/micromatch": { "version": "4.0.4", "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.4.tgz", @@ -14331,6 +14351,12 @@ "url": "https://opencollective.com/webpack" } }, + "node_modules/sdp": { + "version": "3.0.3", + "resolved": "https://registry.npmjs.org/sdp/-/sdp-3.0.3.tgz", + "integrity": "sha512-8EkfckS+XZQaPLyChu4ey7PghrdcraCVNpJe2Gfdi2ON1ylQ7OasuKX+b37R9slnRChwIAiQgt+oj8xXGD8x+A==", + "peer": true + }, "node_modules/select-hose": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz", @@ -15603,6 +15629,11 @@ "punycode": "^2.1.0" } }, + "node_modules/use-strict": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/use-strict/-/use-strict-1.0.1.tgz", + "integrity": "sha1-C7gNlPSaSgUZK4Sox9NOlfGn46A=" + }, "node_modules/util-deprecate": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz", @@ -16062,6 +16093,19 @@ "node": ">=4.0" } }, + "node_modules/webrtc-adapter": { + "version": "8.1.1", + "resolved": "https://registry.npmjs.org/webrtc-adapter/-/webrtc-adapter-8.1.1.tgz", + "integrity": "sha512-1yXevP7TeZGmklEXkvQVrZp3fOSJlLeXNGCA7NovQokxgP3/e2T3EVGL0eKU87S9vKppWjvRWqnJeSANEspOBg==", + "peer": true, + "dependencies": { + "sdp": "^3.0.2" + }, + "engines": { + "node": ">=6.0.0", + "npm": ">=3.10.0" + } + }, "node_modules/websocket-driver": { "version": "0.7.4", "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.4.tgz", @@ -24546,6 +24590,14 @@ "resolved": "https://registry.npmjs.org/klona/-/klona-2.0.5.tgz", "integrity": "sha512-pJiBpiXMbt7dkzXe8Ghj/u4FfXOOa98fPW+bihOJ4SjnoijweJrNThJfd3ifXpXhREjpoF2mZVH1GfS9LV3kHQ==" }, + "lamejs": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/lamejs/-/lamejs-1.2.1.tgz", + "integrity": "sha512-s7bxvjvYthw6oPLCm5pFxvA84wUROODB8jEO2+CE1adhKgrIvVOlmMgY8zyugxGrvRaDHNJanOiS21/emty6dQ==", + "requires": { + "use-strict": "1.0.1" + } + }, "language-subtag-registry": { "version": "0.3.21", "resolved": "https://registry.npmjs.org/language-subtag-registry/-/language-subtag-registry-0.3.21.tgz", @@ -24727,6 +24779,14 @@ "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz", "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4=" }, + "mic-recorder-to-mp3": { + "version": "2.2.2", + "resolved": "https://registry.npmjs.org/mic-recorder-to-mp3/-/mic-recorder-to-mp3-2.2.2.tgz", + "integrity": "sha512-xDkOaHbojW3bdKOGn9CI5dT+Mc0RrfczsX/Y1zGJp3FUB4zei5ZKFnNm7Nguc9v910wkd7T3csnCTq5EtCF3Zw==", + "requires": { + "lamejs": "^1.2.0" + } + }, "micromatch": { "version": "4.0.4", "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.4.tgz", @@ -26721,6 +26781,12 @@ "ajv-keywords": "^3.5.2" } }, + "sdp": { + "version": "3.0.3", + "resolved": "https://registry.npmjs.org/sdp/-/sdp-3.0.3.tgz", + "integrity": "sha512-8EkfckS+XZQaPLyChu4ey7PghrdcraCVNpJe2Gfdi2ON1ylQ7OasuKX+b37R9slnRChwIAiQgt+oj8xXGD8x+A==", + "peer": true + }, "select-hose": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz", @@ -27691,6 +27757,11 @@ "punycode": "^2.1.0" } }, + "use-strict": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/use-strict/-/use-strict-1.0.1.tgz", + "integrity": "sha1-C7gNlPSaSgUZK4Sox9NOlfGn46A=" + }, "util-deprecate": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz", @@ -28019,6 +28090,15 @@ "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.3.tgz", "integrity": "sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==" }, + "webrtc-adapter": { + "version": "8.1.1", + "resolved": "https://registry.npmjs.org/webrtc-adapter/-/webrtc-adapter-8.1.1.tgz", + "integrity": "sha512-1yXevP7TeZGmklEXkvQVrZp3fOSJlLeXNGCA7NovQokxgP3/e2T3EVGL0eKU87S9vKppWjvRWqnJeSANEspOBg==", + "peer": true, + "requires": { + "sdp": "^3.0.2" + } + }, "websocket-driver": { "version": "0.7.4", "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.4.tgz", diff --git a/client/package.json b/client/package.json index 6b71fca..5fbc941 100644 --- a/client/package.json +++ b/client/package.json @@ -12,6 +12,7 @@ "@testing-library/react": "^12.1.3", "@testing-library/user-event": "^13.5.0", "axios": "^0.26.0", + "mic-recorder-to-mp3": "^2.2.2", "react": "^17.0.2", "react-dom": "^17.0.2", "react-router-dom": "^6.2.2", diff --git a/client/src/App.jsx b/client/src/App.jsx index 03d49c9..2ba75d2 100644 --- a/client/src/App.jsx +++ b/client/src/App.jsx @@ -16,6 +16,8 @@ import MemberOrgs from './components/orgs/MemberOrgs'; import OrgDashboard from './components/orgs/OrgDashboard'; import UpdateOrganization from './components/forms/UpdateOrganization'; +import RecordMp3 from './components/RecordMp3'; + function App() { const [token, setToken] = useState(false); @@ -27,6 +29,7 @@ function App() { path='' element={} > + } /> } /> null); + } else { + const audioFile = new Audio(URL.createObjectURL(uploadedFile)); + setAudio(() => audioFile); + audioFile.play(); + } + } + + async function record() { + if (recording) { + console.log('Stopped Recording'); + recorder + .stop() + .getMp3() + .then(([buffer, blob]) => { + setRecording(() => false); + setUploadedFile(() => { + return new File(buffer, 'me-at-thevoice.mp3', { + type: blob.type, + lastModified: Date.now(), + }); + }); + }); + } else { + recorder + .start() + .then(() => { + setRecording(() => true); + }) + .catch((e) => { + console.error(e); + }); + } + } + + function uploadRecord() { + setUploadedFile(() => { + return document.getElementById('icon-button-file').files[0]; + }); + } + + return ( +
+ + + + + + + + + +
+ + ); +} + +export default RecordMp3; From c5b9cf843f2bee076034f145f87364be097890cd Mon Sep 17 00:00:00 2001 From: C4 Patino Date: Sat, 19 Mar 2022 13:21:17 -0500 Subject: [PATCH 2/4] Completed working mp3 files --- client/package.json | 2 +- client/src/App.jsx | 2 - client/src/components/MainPage.jsx | 8 +- client/src/components/Navbar.jsx | 2 +- client/src/components/RecordMp3.jsx | 92 ------------ client/src/components/forms/EditUser.jsx | 6 +- client/src/components/forms/Login.jsx | 4 +- client/src/components/forms/Recover.jsx | 2 +- client/src/components/forms/Register.jsx | 2 +- client/src/components/forms/Reset.jsx | 2 +- .../components/forms/UpdateOrganization.jsx | 2 +- client/src/components/orgs/MemberOrgs.jsx | 2 +- client/src/components/orgs/OrgDashboard.jsx | 28 +++- client/src/components/orgs/OwnedOrgs.jsx | 2 +- client/src/components/utils/Dashboard.jsx | 5 +- client/src/components/utils/RecordMp3.jsx | 134 ++++++++++++++++++ 16 files changed, 178 insertions(+), 117 deletions(-) delete mode 100644 client/src/components/RecordMp3.jsx create mode 100644 client/src/components/utils/RecordMp3.jsx diff --git a/client/package.json b/client/package.json index 5fbc941..a621dfc 100644 --- a/client/package.json +++ b/client/package.json @@ -21,7 +21,7 @@ }, "scripts": { "start": "react-scripts start", - "build": "cp ${ENV:-'../.env'} .env && react-scripts build", + "build": "cp ${ENV:-'../.env'} .env && rm -rf ../server/public/build && react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" }, diff --git a/client/src/App.jsx b/client/src/App.jsx index 2ba75d2..da4294e 100644 --- a/client/src/App.jsx +++ b/client/src/App.jsx @@ -16,8 +16,6 @@ import MemberOrgs from './components/orgs/MemberOrgs'; import OrgDashboard from './components/orgs/OrgDashboard'; import UpdateOrganization from './components/forms/UpdateOrganization'; -import RecordMp3 from './components/RecordMp3'; - function App() { const [token, setToken] = useState(false); diff --git a/client/src/components/MainPage.jsx b/client/src/components/MainPage.jsx index 3ed96db..554f8be 100644 --- a/client/src/components/MainPage.jsx +++ b/client/src/components/MainPage.jsx @@ -54,7 +54,7 @@ function MainPage() { async function getOwnedOrgs() { await axios .get( - `${process.env.REACT_APP_DOMAIN_ROOT}/auth?token=${Cookies.get( + `${process.env.REACT_APP_API_ROOT}/auth?token=${Cookies.get( 'token' )}` ) @@ -79,7 +79,7 @@ function MainPage() { await axios .get( `${ - process.env.REACT_APP_DOMAIN_ROOT + process.env.REACT_APP_API_ROOT }/auth/orgs?token=${Cookies.get('token')}` ) .then((response) => { @@ -101,7 +101,7 @@ function MainPage() { console.log('create'); await axios - .post(`${process.env.REACT_APP_DOMAIN_ROOT}/org/create`, { + .post(`${process.env.REACT_APP_API_ROOT}/org/create`, { token: Cookies.get('token'), orgName: form.name, }) @@ -115,7 +115,7 @@ function MainPage() { e.preventDefault(); await axios - .post(`${process.env.REACT_APP_DOMAIN_ROOT}/org/${form.id}/add`, { + .post(`${process.env.REACT_APP_API_ROOT}/org/${form.id}/add`, { token: Cookies.get('token'), }) .then(() => { diff --git a/client/src/components/Navbar.jsx b/client/src/components/Navbar.jsx index 9bae8a2..41833a3 100644 --- a/client/src/components/Navbar.jsx +++ b/client/src/components/Navbar.jsx @@ -56,7 +56,7 @@ function Navbar({ tokenState }) { async function handleLogout() { await axios - .post(`${process.env.REACT_APP_DOMAIN_ROOT}/auth/logout`, { + .post(`${process.env.REACT_APP_API_ROOT}/auth/logout`, { token: Cookies.get('token'), }) .catch((e) => { diff --git a/client/src/components/RecordMp3.jsx b/client/src/components/RecordMp3.jsx deleted file mode 100644 index 69b1153..0000000 --- a/client/src/components/RecordMp3.jsx +++ /dev/null @@ -1,92 +0,0 @@ -import React, { useState } from 'react'; - -import MicRecorder from 'mic-recorder-to-mp3'; - -import { IconButton } from '@mui/material'; -import PlayArrow from '@mui/icons-material/PlayArrow'; -import Mic from '@mui/icons-material/Mic'; -import Upload from '@mui/icons-material/Upload'; - -import Form from './utils/Form'; - -function RecordMp3() { - const [recorder] = useState( - new MicRecorder({ - bitRate: 128, - }) - ); - const [recording, setRecording] = useState(false); - const [uploadedFile, setUploadedFile] = useState(null); - const [audio, setAudio] = useState(null); - - function togglePlay() { - if (audio) { - audio.pause(); - audio.currentTime = 0; - setAudio(() => null); - } else { - const audioFile = new Audio(URL.createObjectURL(uploadedFile)); - setAudio(() => audioFile); - audioFile.play(); - } - } - - async function record() { - if (recording) { - console.log('Stopped Recording'); - recorder - .stop() - .getMp3() - .then(([buffer, blob]) => { - setRecording(() => false); - setUploadedFile(() => { - return new File(buffer, 'me-at-thevoice.mp3', { - type: blob.type, - lastModified: Date.now(), - }); - }); - }); - } else { - recorder - .start() - .then(() => { - setRecording(() => true); - }) - .catch((e) => { - console.error(e); - }); - } - } - - function uploadRecord() { - setUploadedFile(() => { - return document.getElementById('icon-button-file').files[0]; - }); - } - - return ( -
- - - - - - - - - -
- - ); -} - -export default RecordMp3; diff --git a/client/src/components/forms/EditUser.jsx b/client/src/components/forms/EditUser.jsx index 266165b..2ebbb3c 100644 --- a/client/src/components/forms/EditUser.jsx +++ b/client/src/components/forms/EditUser.jsx @@ -7,6 +7,7 @@ import Cookies from 'js-cookie'; import { Box, Typography, TextField, Button } from '@mui/material'; import Form from '../utils/Form'; +import RecordMp3 from '../utils/RecordMp3'; function EditUser() { const navigate = useNavigate(); @@ -25,7 +26,7 @@ function EditUser() { async function getInfo() { axios .get( - `${process.env.REACT_APP_DOMAIN_ROOT}/auth/${Cookies.get( + `${process.env.REACT_APP_API_ROOT}/auth/${Cookies.get( 'userID' )}?token=${Cookies.get('token')}` ) @@ -60,7 +61,7 @@ function EditUser() { const { confirmPassword, ...filteredForm } = form; await axios .post( - `${process.env.REACT_APP_DOMAIN_ROOT}/auth/register`, + `${process.env.REACT_APP_API_ROOT}/auth/register`, filteredForm ) .then(() => { @@ -141,6 +142,7 @@ function EditUser() { + ); } diff --git a/client/src/components/forms/Login.jsx b/client/src/components/forms/Login.jsx index dd69990..ac20bea 100644 --- a/client/src/components/forms/Login.jsx +++ b/client/src/components/forms/Login.jsx @@ -28,7 +28,7 @@ function Login({ setToken }) { useEffect(() => { async function logout() { await axios - .post(`${process.env.REACT_APP_DOMAIN_ROOT}/auth/logout`, { + .post(`${process.env.REACT_APP_API_ROOT}/auth/logout`, { token: Cookies.get('token'), }) .catch((e) => { @@ -64,7 +64,7 @@ function Login({ setToken }) { async function handleSubmit(e) { e.preventDefault(); await axios - .post(`${process.env.REACT_APP_DOMAIN_ROOT}/auth/login`, form) + .post(`${process.env.REACT_APP_API_ROOT}/auth/login`, form) .then((response) => { Cookies.set('token', response.data.token, { expires: form.remember ? 3650 : 1, diff --git a/client/src/components/forms/Recover.jsx b/client/src/components/forms/Recover.jsx index 5fed4c1..70ac74f 100644 --- a/client/src/components/forms/Recover.jsx +++ b/client/src/components/forms/Recover.jsx @@ -23,7 +23,7 @@ function Recover() { e.preventDefault(); await axios .get( - `${process.env.REACT_APP_DOMAIN_ROOT}/auth/reset-password?${form.email}` + `${process.env.REACT_APP_API_ROOT}/auth/reset-password?${form.email}` ) .then((response) => { setSuccess(() => response.data); diff --git a/client/src/components/forms/Register.jsx b/client/src/components/forms/Register.jsx index 196aeb0..1d2687d 100644 --- a/client/src/components/forms/Register.jsx +++ b/client/src/components/forms/Register.jsx @@ -35,7 +35,7 @@ function Register() { const { confirmPassword, ...filteredForm } = form; await axios .post( - `${process.env.REACT_APP_DOMAIN_ROOT}/auth/register`, + `${process.env.REACT_APP_API_ROOT}/auth/register`, filteredForm ) .then(() => { diff --git a/client/src/components/forms/Reset.jsx b/client/src/components/forms/Reset.jsx index 9aba42c..f605f1f 100644 --- a/client/src/components/forms/Reset.jsx +++ b/client/src/components/forms/Reset.jsx @@ -28,7 +28,7 @@ function Reset() { e.preventDefault(); await axios .patch( - `${process.env.REACT_APP_DOMAIN_ROOT}/auth/reset-password/${id}`, + `${process.env.REACT_APP_API_ROOT}/auth/reset-password/${id}`, { password: form.password, } diff --git a/client/src/components/forms/UpdateOrganization.jsx b/client/src/components/forms/UpdateOrganization.jsx index 068fe12..d9af585 100644 --- a/client/src/components/forms/UpdateOrganization.jsx +++ b/client/src/components/forms/UpdateOrganization.jsx @@ -23,7 +23,7 @@ function UpdateOrganization() { async function handleSubmit(e) { e.preventDefault(); await axios - .patch(`${process.env.REACT_APP_DOMAIN_ROOT}/org/update`, { + .patch(`${process.env.REACT_APP_API_ROOT}/org/update`, { token: Cookies.get('token'), orgName: name, orgID, diff --git a/client/src/components/orgs/MemberOrgs.jsx b/client/src/components/orgs/MemberOrgs.jsx index c84a23b..2567a3f 100644 --- a/client/src/components/orgs/MemberOrgs.jsx +++ b/client/src/components/orgs/MemberOrgs.jsx @@ -10,7 +10,7 @@ function JoinedOrgs() { axios .get( `${ - process.env.REACT_APP_DOMAIN_ROOT + process.env.REACT_APP_API_ROOT }/auth/orgs?token=${Cookies.get('token')}` ) .then((response) => { diff --git a/client/src/components/orgs/OrgDashboard.jsx b/client/src/components/orgs/OrgDashboard.jsx index 5115c46..4ee84e4 100644 --- a/client/src/components/orgs/OrgDashboard.jsx +++ b/client/src/components/orgs/OrgDashboard.jsx @@ -42,7 +42,7 @@ function OrgDashboard() { await axios .get( `${ - process.env.REACT_APP_DOMAIN_ROOT + process.env.REACT_APP_API_ROOT }/org/${orgID}?token=${Cookies.get('token')}` ) .then((response) => { @@ -86,7 +86,7 @@ function OrgDashboard() { async function handleDelete() { await axios - .delete(`${process.env.REACT_APP_DOMAIN_ROOT}/org/delete`, { + .delete(`${process.env.REACT_APP_API_ROOT}/org/delete`, { params: { token: Cookies.get('token'), orgID, @@ -103,7 +103,7 @@ function OrgDashboard() { const doomedUserIDs = selection.map((row) => row.id); await axios.post( - `${process.env.REACT_APP_DOMAIN_ROOT}/org/${orgID}/delete`, + `${process.env.REACT_APP_API_ROOT}/org/${orgID}/delete`, { token: Cookies.get('token'), orgID, @@ -114,7 +114,7 @@ function OrgDashboard() { async function leaveOrg() { await axios - .post(`${process.env.REACT_APP_DOMAIN_ROOT}/org/${orgID}/delete`, { + .post(`${process.env.REACT_APP_API_ROOT}/org/${orgID}/delete`, { token: Cookies.get('token'), orgID, }) @@ -125,8 +125,26 @@ function OrgDashboard() { }); } + async function play(id) { + axios + .get( + `${process.env.REACT_APP_DOMAIN_ROOT}/public/audio/${id}.mp3`, + { + responseType: 'blob', + } + ) + .then((res) => { + const uploadedFile = new File([res.data], 'userAudio.mp3', { + type: res.data.type, + lastModified: Date.now(), + }); + const audioFile = new Audio(URL.createObjectURL(uploadedFile)); + audioFile.play(); + }); + } + return ( - + Organizations/{org.orgName} diff --git a/client/src/components/orgs/OwnedOrgs.jsx b/client/src/components/orgs/OwnedOrgs.jsx index 7a192b1..62528b6 100644 --- a/client/src/components/orgs/OwnedOrgs.jsx +++ b/client/src/components/orgs/OwnedOrgs.jsx @@ -9,7 +9,7 @@ function JoinedOrgs() { async function getOrgs(setOrgs) { axios .get( - `${process.env.REACT_APP_DOMAIN_ROOT}/auth?token=${Cookies.get( + `${process.env.REACT_APP_API_ROOT}/auth?token=${Cookies.get( 'token' )}` ) diff --git a/client/src/components/utils/Dashboard.jsx b/client/src/components/utils/Dashboard.jsx index f22447c..1a8661a 100644 --- a/client/src/components/utils/Dashboard.jsx +++ b/client/src/components/utils/Dashboard.jsx @@ -6,7 +6,7 @@ import { useTheme } from '@mui/material/styles'; import { DataGrid } from '@mui/x-data-grid'; import PlayArrowIcon from '@mui/icons-material/PlayArrow'; -function Dashboard({ children, rows, setSelection }) { +function Dashboard({ children, rows, setSelection, onClick }) { const theme = useTheme(); const columns = [ @@ -19,13 +19,14 @@ function Dashboard({ children, rows, setSelection }) { headerName: 'Pronounciation', flex: 2, sortable: false, - renderCell: () => ( + renderCell: (params) => ( onClick(params.id)} > diff --git a/client/src/components/utils/RecordMp3.jsx b/client/src/components/utils/RecordMp3.jsx new file mode 100644 index 0000000..b9dd767 --- /dev/null +++ b/client/src/components/utils/RecordMp3.jsx @@ -0,0 +1,134 @@ +import React, { useState, useEffect } from 'react'; + +import MicRecorder from 'mic-recorder-to-mp3'; +import axios from 'axios'; +import Cookies from 'js-cookie'; + +import { IconButton } from '@mui/material'; +import PlayArrow from '@mui/icons-material/PlayArrow'; +import Mic from '@mui/icons-material/Mic'; +import Upload from '@mui/icons-material/Upload'; +import SaveAs from '@mui/icons-material/SaveAs'; + +function RecordMp3() { + const [recorder] = useState( + new MicRecorder({ + bitRate: 128, + }) + ); + const [recording, setRecording] = useState(false); + const [uploadedFile, setUploadedFile] = useState(null); + const [audio, setAudio] = useState(null); + + useEffect(() => { + axios + .get( + `${ + process.env.REACT_APP_DOMAIN_ROOT + }/public/audio/${Cookies.get('token')}.mp3`, + { + responseType: 'blob', + } + ) + .then((res) => { + setUploadedFile(() => { + return new File([res.data], 'userAudio.mp3', { + type: res.data.type, + lastModified: Date.now(), + }); + }); + }); + }, []); + + function togglePlay() { + console.log(uploadedFile); + if (audio && !audio.ended) { + audio.pause(); + audio.currentTime = 0; + setAudio(() => null); + } else { + const audioFile = new Audio(URL.createObjectURL(uploadedFile)); + setAudio(() => audioFile); + audioFile.play(); + } + } + + async function record() { + if (recording) { + console.log('Stopped Recording'); + recorder + .stop() + .getMp3() + .then(([buffer, blob]) => { + setRecording(() => false); + setUploadedFile(() => { + return new File(buffer, 'userAudio.mp3', { + type: blob.type, + lastModified: Date.now(), + }); + }); + }); + } else { + recorder + .start() + .then(() => { + setRecording(() => true); + }) + .catch((e) => { + console.error(e); + }); + } + } + + function uploadRecord() { + setUploadedFile(() => { + return document.getElementById('icon-button-file').files[0]; + }); + } + + async function handleSubmit(e) { + e.preventDefault(); + + var formData = new FormData(); + formData.append('audioFile', uploadedFile, 'userAudio.mp3'); + formData.append('token', Cookies.get('token')); + + await axios.post( + `${process.env.REACT_APP_API_ROOT}/auth/audio`, + formData, + { + headers: { + 'Content-Type': 'multipart/form-data', + }, + } + ); + } + + return ( +
+ + + + + + + + + + + +
+ ); +} + +export default RecordMp3; From 269266e11dcd3f0e9eccbd1a2728f60eb0316eb1 Mon Sep 17 00:00:00 2001 From: C4 Patino Date: Sat, 19 Mar 2022 13:21:30 -0500 Subject: [PATCH 3/4] Completed mp3 work --- server/app.js | 12 +- server/bin/www | 2 +- server/middleware/parseFormData.js | 14 + server/package-lock.json | 417 +++++++++++++++++++++++++--- server/package.json | 2 + server/routes/auth/GetMemberOrgs.js | 2 - server/routes/auth/SetAudio.js | 21 ++ server/routes/authRouter.js | 7 +- 8 files changed, 430 insertions(+), 47 deletions(-) create mode 100644 server/middleware/parseFormData.js create mode 100644 server/routes/auth/SetAudio.js diff --git a/server/app.js b/server/app.js index 45531ec..c4d2e37 100644 --- a/server/app.js +++ b/server/app.js @@ -3,10 +3,12 @@ var express = require('express'); var path = require('path'); var cookieParser = require('cookie-parser'); var logger = require('morgan'); +var bodyParser = require('body-parser'); var cors = require('cors'); var authRouter = require('./routes/authRouter'); var orgRouter = require('./routes/orgRouter'); +var audioRouter = require('./routes/audioRouter'); var app = express(); @@ -18,11 +20,19 @@ app.use(logger('dev')); app.use(express.json()); app.use(express.urlencoded({ extended: false })); app.use(cookieParser()); -app.use('/public', express.static(path.join(__dirname, 'public'))); app.use(cors()); +app.use( + bodyParser.urlencoded({ + extended: true, + }) +); +app.use(bodyParser.json()); + +app.use('/public', express.static(path.join(__dirname, 'public'))); app.use('/api/auth', authRouter); app.use('/api/org', orgRouter); +app.use('/api/audio', audioRouter); app.use(express.static(path.join(__dirname, 'public/build'))); app.get('*', (req, res) => { diff --git a/server/bin/www b/server/bin/www index 716f95f..b954d0b 100644 --- a/server/bin/www +++ b/server/bin/www @@ -27,7 +27,7 @@ async function connectDatabase() { try { await sequelize.authenticate(); console.log( - `[INFO]: Database connection to ${process.env.NODE_ENV} has been established successfully.` + `[INFO]: Database connection to '${process.env.NODE_ENV}' has been established successfully.` ); if (process.env.NODE_ENV == 'development') { await sequelize.sync({ force: 'true' }); diff --git a/server/middleware/parseFormData.js b/server/middleware/parseFormData.js new file mode 100644 index 0000000..4371852 --- /dev/null +++ b/server/middleware/parseFormData.js @@ -0,0 +1,14 @@ +const formidable = require('formidable'); + +function parseFormData(req, res, next) { + var form = formidable(); + form.uploadDir = `${__dirname}/../public/`; + + form.parse(req, (err, fields, files) => { + req.body = fields; + req.files = files; + return next(); + }); +} + +module.exports = parseFormData; diff --git a/server/package-lock.json b/server/package-lock.json index 142f5ff..dd52c02 100644 --- a/server/package-lock.json +++ b/server/package-lock.json @@ -9,10 +9,12 @@ "version": "0.0.0", "dependencies": { "@trycourier/courier": "^3.5.0", + "body-parser": "^1.19.2", "cookie-parser": "~1.4.4", "cors": "^2.8.5", "debug": "~2.6.9", "express": "~4.16.1", + "formidable": "^2.0.1", "http-errors": "~1.6.3", "jade": "^0.29.0", "morgan": "~1.9.1", @@ -209,6 +211,11 @@ "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz", "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI=" }, + "node_modules/asap": { + "version": "2.0.6", + "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz", + "integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY=" + }, "node_modules/asn1": { "version": "0.2.6", "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.6.tgz", @@ -315,25 +322,69 @@ "integrity": "sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg==" }, "node_modules/body-parser": { - "version": "1.18.3", - "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.18.3.tgz", - "integrity": "sha1-WykhmP/dVTs6DyDe0FkrlWlVyLQ=", + "version": "1.19.2", + "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.19.2.tgz", + "integrity": "sha512-SAAwOxgoCKMGs9uUAUFHygfLAyaniaoun6I8mFY9pRAJL9+Kec34aU+oIjDhTycub1jozEfEwx1W1IuOYxVSFw==", "dependencies": { - "bytes": "3.0.0", + "bytes": "3.1.2", "content-type": "~1.0.4", "debug": "2.6.9", "depd": "~1.1.2", - "http-errors": "~1.6.3", - "iconv-lite": "0.4.23", + "http-errors": "1.8.1", + "iconv-lite": "0.4.24", "on-finished": "~2.3.0", - "qs": "6.5.2", - "raw-body": "2.3.3", - "type-is": "~1.6.16" + "qs": "6.9.7", + "raw-body": "2.4.3", + "type-is": "~1.6.18" }, "engines": { "node": ">= 0.8" } }, + "node_modules/body-parser/node_modules/http-errors": { + "version": "1.8.1", + "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.8.1.tgz", + "integrity": "sha512-Kpk9Sm7NmI+RHhnj6OIWDI1d6fIoFAtFt9RLaTMRlg/8w49juAStsrBgp0Dp4OdxdVbRIeKhtCUvoi/RuAhO4g==", + "dependencies": { + "depd": "~1.1.2", + "inherits": "2.0.4", + "setprototypeof": "1.2.0", + "statuses": ">= 1.5.0 < 2", + "toidentifier": "1.0.1" + }, + "engines": { + "node": ">= 0.6" + } + }, + "node_modules/body-parser/node_modules/inherits": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz", + "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==" + }, + "node_modules/body-parser/node_modules/qs": { + "version": "6.9.7", + "resolved": "https://registry.npmjs.org/qs/-/qs-6.9.7.tgz", + "integrity": "sha512-IhMFgUmuNpyRfxA90umL7ByLlgRXu6tIfKPpF5TmcfRLlLCckfP/g3IQmju6jjpu+Hh8rA+2p6A27ZSPOOHdKw==", + "engines": { + "node": ">=0.6" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/body-parser/node_modules/setprototypeof": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz", + "integrity": "sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==" + }, + "node_modules/body-parser/node_modules/statuses": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz", + "integrity": "sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow=", + "engines": { + "node": ">= 0.6" + } + }, "node_modules/boxen": { "version": "5.1.2", "resolved": "https://registry.npmjs.org/boxen/-/boxen-5.1.2.tgz", @@ -416,9 +467,9 @@ } }, "node_modules/bytes": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz", - "integrity": "sha1-0ygVQE1olpn4Wk6k+odV3ROpYEg=", + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.2.tgz", + "integrity": "sha512-/Nf7TyzTx6S3yRJObOAV7956r8cr2+Oj8AC5dt8wSP3BQAoeX58NoHyCU8P8zGkNXStjTSi6fzO6F0pBdcYbEg==", "engines": { "node": ">= 0.8" } @@ -893,6 +944,15 @@ "node": ">=0.10" } }, + "node_modules/dezalgo": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/dezalgo/-/dezalgo-1.0.3.tgz", + "integrity": "sha1-f3Qt4Gb8dIvI24IFad3c5Jvw1FY=", + "dependencies": { + "asap": "^2.0.0", + "wrappy": "1" + } + }, "node_modules/dot-prop": { "version": "5.3.0", "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-5.3.0.tgz", @@ -1105,6 +1165,34 @@ "node": ">= 0.10.0" } }, + "node_modules/express/node_modules/body-parser": { + "version": "1.18.3", + "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.18.3.tgz", + "integrity": "sha1-WykhmP/dVTs6DyDe0FkrlWlVyLQ=", + "dependencies": { + "bytes": "3.0.0", + "content-type": "~1.0.4", + "debug": "2.6.9", + "depd": "~1.1.2", + "http-errors": "~1.6.3", + "iconv-lite": "0.4.23", + "on-finished": "~2.3.0", + "qs": "6.5.2", + "raw-body": "2.3.3", + "type-is": "~1.6.16" + }, + "engines": { + "node": ">= 0.8" + } + }, + "node_modules/express/node_modules/bytes": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz", + "integrity": "sha1-0ygVQE1olpn4Wk6k+odV3ROpYEg=", + "engines": { + "node": ">= 0.8" + } + }, "node_modules/express/node_modules/cookie": { "version": "0.3.1", "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz", @@ -1113,6 +1201,31 @@ "node": ">= 0.6" } }, + "node_modules/express/node_modules/iconv-lite": { + "version": "0.4.23", + "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.23.tgz", + "integrity": "sha512-neyTUVFtahjf0mB3dZT77u+8O0QB89jFdnBkd5P1JgYPbPaia3gXXOVL2fq8VyU2gMMD7SaN7QukTB/pmXYvDA==", + "dependencies": { + "safer-buffer": ">= 2.1.2 < 3" + }, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/express/node_modules/raw-body": { + "version": "2.3.3", + "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.3.3.tgz", + "integrity": "sha512-9esiElv1BrZoI3rCDuOuKCBRbuApGGaDPQfjSflGxdy4oyzqghxu6klEkkVIvBje+FF0BX9coEv8KqW6X/7njw==", + "dependencies": { + "bytes": "3.0.0", + "http-errors": "1.6.3", + "iconv-lite": "0.4.23", + "unpipe": "1.0.0" + }, + "engines": { + "node": ">= 0.8" + } + }, "node_modules/ext": { "version": "1.6.0", "resolved": "https://registry.npmjs.org/ext/-/ext-1.6.0.tgz", @@ -1223,6 +1336,31 @@ "node": ">= 0.12" } }, + "node_modules/formidable": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/formidable/-/formidable-2.0.1.tgz", + "integrity": "sha512-rjTMNbp2BpfQShhFbR3Ruk3qk2y9jKpvMW78nJgx8QKtxjDVrwbZG+wvDOmVbifHyOUOQJXxqEy6r0faRrPzTQ==", + "dependencies": { + "dezalgo": "1.0.3", + "hexoid": "1.0.0", + "once": "1.4.0", + "qs": "6.9.3" + }, + "funding": { + "url": "https://ko-fi.com/tunnckoCore/commissions" + } + }, + "node_modules/formidable/node_modules/qs": { + "version": "6.9.3", + "resolved": "https://registry.npmjs.org/qs/-/qs-6.9.3.tgz", + "integrity": "sha512-EbZYNarm6138UKKq46tdx08Yo/q9ZhFoAXAI1meAFd2GtbRDhbZY2WQSICskT0c5q99aFzLG1D4nvTk9tqfXIw==", + "engines": { + "node": ">=0.6" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/forwarded": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.2.0.tgz", @@ -1495,6 +1633,14 @@ "node": ">=8" } }, + "node_modules/hexoid": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/hexoid/-/hexoid-1.0.0.tgz", + "integrity": "sha512-QFLV0taWQOZtvIRIAdBChesmogZrtuXvVWsFHZTk2SU+anspqZ2vMnoLg7IE1+Uk16N19APic1BuF8bC8c2m5g==", + "engines": { + "node": ">=8" + } + }, "node_modules/http-cache-semantics": { "version": "4.1.0", "resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-4.1.0.tgz", @@ -1530,9 +1676,9 @@ } }, "node_modules/iconv-lite": { - "version": "0.4.23", - "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.23.tgz", - "integrity": "sha512-neyTUVFtahjf0mB3dZT77u+8O0QB89jFdnBkd5P1JgYPbPaia3gXXOVL2fq8VyU2gMMD7SaN7QukTB/pmXYvDA==", + "version": "0.4.24", + "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz", + "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==", "dependencies": { "safer-buffer": ">= 2.1.2 < 3" }, @@ -2702,19 +2848,52 @@ } }, "node_modules/raw-body": { - "version": "2.3.3", - "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.3.3.tgz", - "integrity": "sha512-9esiElv1BrZoI3rCDuOuKCBRbuApGGaDPQfjSflGxdy4oyzqghxu6klEkkVIvBje+FF0BX9coEv8KqW6X/7njw==", + "version": "2.4.3", + "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.4.3.tgz", + "integrity": "sha512-UlTNLIcu0uzb4D2f4WltY6cVjLi+/jEN4lgEUj3E04tpMDpUlkBo/eSn6zou9hum2VMNpCCUone0O0WeJim07g==", "dependencies": { - "bytes": "3.0.0", - "http-errors": "1.6.3", - "iconv-lite": "0.4.23", + "bytes": "3.1.2", + "http-errors": "1.8.1", + "iconv-lite": "0.4.24", "unpipe": "1.0.0" }, "engines": { "node": ">= 0.8" } }, + "node_modules/raw-body/node_modules/http-errors": { + "version": "1.8.1", + "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.8.1.tgz", + "integrity": "sha512-Kpk9Sm7NmI+RHhnj6OIWDI1d6fIoFAtFt9RLaTMRlg/8w49juAStsrBgp0Dp4OdxdVbRIeKhtCUvoi/RuAhO4g==", + "dependencies": { + "depd": "~1.1.2", + "inherits": "2.0.4", + "setprototypeof": "1.2.0", + "statuses": ">= 1.5.0 < 2", + "toidentifier": "1.0.1" + }, + "engines": { + "node": ">= 0.6" + } + }, + "node_modules/raw-body/node_modules/inherits": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz", + "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==" + }, + "node_modules/raw-body/node_modules/setprototypeof": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz", + "integrity": "sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==" + }, + "node_modules/raw-body/node_modules/statuses": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz", + "integrity": "sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow=", + "engines": { + "node": ">= 0.6" + } + }, "node_modules/rc": { "version": "1.2.8", "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.8.tgz", @@ -3256,6 +3435,14 @@ "node": ">=8.0" } }, + "node_modules/toidentifier": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.1.tgz", + "integrity": "sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA==", + "engines": { + "node": ">=0.6" + } + }, "node_modules/toposort-class": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/toposort-class/-/toposort-class-1.0.1.tgz", @@ -3911,6 +4098,11 @@ "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz", "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI=" }, + "asap": { + "version": "2.0.6", + "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz", + "integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY=" + }, "asn1": { "version": "0.2.6", "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.6.tgz", @@ -3999,20 +4191,54 @@ "integrity": "sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg==" }, "body-parser": { - "version": "1.18.3", - "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.18.3.tgz", - "integrity": "sha1-WykhmP/dVTs6DyDe0FkrlWlVyLQ=", + "version": "1.19.2", + "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.19.2.tgz", + "integrity": "sha512-SAAwOxgoCKMGs9uUAUFHygfLAyaniaoun6I8mFY9pRAJL9+Kec34aU+oIjDhTycub1jozEfEwx1W1IuOYxVSFw==", "requires": { - "bytes": "3.0.0", + "bytes": "3.1.2", "content-type": "~1.0.4", "debug": "2.6.9", "depd": "~1.1.2", - "http-errors": "~1.6.3", - "iconv-lite": "0.4.23", + "http-errors": "1.8.1", + "iconv-lite": "0.4.24", "on-finished": "~2.3.0", - "qs": "6.5.2", - "raw-body": "2.3.3", - "type-is": "~1.6.16" + "qs": "6.9.7", + "raw-body": "2.4.3", + "type-is": "~1.6.18" + }, + "dependencies": { + "http-errors": { + "version": "1.8.1", + "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.8.1.tgz", + "integrity": "sha512-Kpk9Sm7NmI+RHhnj6OIWDI1d6fIoFAtFt9RLaTMRlg/8w49juAStsrBgp0Dp4OdxdVbRIeKhtCUvoi/RuAhO4g==", + "requires": { + "depd": "~1.1.2", + "inherits": "2.0.4", + "setprototypeof": "1.2.0", + "statuses": ">= 1.5.0 < 2", + "toidentifier": "1.0.1" + } + }, + "inherits": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz", + "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==" + }, + "qs": { + "version": "6.9.7", + "resolved": "https://registry.npmjs.org/qs/-/qs-6.9.7.tgz", + "integrity": "sha512-IhMFgUmuNpyRfxA90umL7ByLlgRXu6tIfKPpF5TmcfRLlLCckfP/g3IQmju6jjpu+Hh8rA+2p6A27ZSPOOHdKw==" + }, + "setprototypeof": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz", + "integrity": "sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==" + }, + "statuses": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz", + "integrity": "sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow=" + } } }, "boxen": { @@ -4078,9 +4304,9 @@ } }, "bytes": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz", - "integrity": "sha1-0ygVQE1olpn4Wk6k+odV3ROpYEg=" + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.2.tgz", + "integrity": "sha512-/Nf7TyzTx6S3yRJObOAV7956r8cr2+Oj8AC5dt8wSP3BQAoeX58NoHyCU8P8zGkNXStjTSi6fzO6F0pBdcYbEg==" }, "cacheable-request": { "version": "6.1.0", @@ -4438,6 +4664,15 @@ "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz", "integrity": "sha1-+hN8S9aY7fVc1c0CrFWfkaTEups=" }, + "dezalgo": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/dezalgo/-/dezalgo-1.0.3.tgz", + "integrity": "sha1-f3Qt4Gb8dIvI24IFad3c5Jvw1FY=", + "requires": { + "asap": "^2.0.0", + "wrappy": "1" + } + }, "dot-prop": { "version": "5.3.0", "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-5.3.0.tgz", @@ -4627,10 +4862,51 @@ "vary": "~1.1.2" }, "dependencies": { + "body-parser": { + "version": "1.18.3", + "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.18.3.tgz", + "integrity": "sha1-WykhmP/dVTs6DyDe0FkrlWlVyLQ=", + "requires": { + "bytes": "3.0.0", + "content-type": "~1.0.4", + "debug": "2.6.9", + "depd": "~1.1.2", + "http-errors": "~1.6.3", + "iconv-lite": "0.4.23", + "on-finished": "~2.3.0", + "qs": "6.5.2", + "raw-body": "2.3.3", + "type-is": "~1.6.16" + } + }, + "bytes": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz", + "integrity": "sha1-0ygVQE1olpn4Wk6k+odV3ROpYEg=" + }, "cookie": { "version": "0.3.1", "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.3.1.tgz", "integrity": "sha1-5+Ch+e9DtMi6klxcWpboBtFoc7s=" + }, + "iconv-lite": { + "version": "0.4.23", + "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.23.tgz", + "integrity": "sha512-neyTUVFtahjf0mB3dZT77u+8O0QB89jFdnBkd5P1JgYPbPaia3gXXOVL2fq8VyU2gMMD7SaN7QukTB/pmXYvDA==", + "requires": { + "safer-buffer": ">= 2.1.2 < 3" + } + }, + "raw-body": { + "version": "2.3.3", + "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.3.3.tgz", + "integrity": "sha512-9esiElv1BrZoI3rCDuOuKCBRbuApGGaDPQfjSflGxdy4oyzqghxu6klEkkVIvBje+FF0BX9coEv8KqW6X/7njw==", + "requires": { + "bytes": "3.0.0", + "http-errors": "1.6.3", + "iconv-lite": "0.4.23", + "unpipe": "1.0.0" + } } } }, @@ -4717,6 +4993,24 @@ "mime-types": "^2.1.12" } }, + "formidable": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/formidable/-/formidable-2.0.1.tgz", + "integrity": "sha512-rjTMNbp2BpfQShhFbR3Ruk3qk2y9jKpvMW78nJgx8QKtxjDVrwbZG+wvDOmVbifHyOUOQJXxqEy6r0faRrPzTQ==", + "requires": { + "dezalgo": "1.0.3", + "hexoid": "1.0.0", + "once": "1.4.0", + "qs": "6.9.3" + }, + "dependencies": { + "qs": { + "version": "6.9.3", + "resolved": "https://registry.npmjs.org/qs/-/qs-6.9.3.tgz", + "integrity": "sha512-EbZYNarm6138UKKq46tdx08Yo/q9ZhFoAXAI1meAFd2GtbRDhbZY2WQSICskT0c5q99aFzLG1D4nvTk9tqfXIw==" + } + } + }, "forwarded": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.2.0.tgz", @@ -4928,6 +5222,11 @@ "resolved": "https://registry.npmjs.org/has-yarn/-/has-yarn-2.1.0.tgz", "integrity": "sha512-UqBRqi4ju7T+TqGNdqAO0PaSVGsDGJUBQvk9eUWNGRY1CFGDzYhLWoM7JQEemnlvVcv/YEmc2wNW8BC24EnUsw==" }, + "hexoid": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/hexoid/-/hexoid-1.0.0.tgz", + "integrity": "sha512-QFLV0taWQOZtvIRIAdBChesmogZrtuXvVWsFHZTk2SU+anspqZ2vMnoLg7IE1+Uk16N19APic1BuF8bC8c2m5g==" + }, "http-cache-semantics": { "version": "4.1.0", "resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-4.1.0.tgz", @@ -4956,9 +5255,9 @@ } }, "iconv-lite": { - "version": "0.4.23", - "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.23.tgz", - "integrity": "sha512-neyTUVFtahjf0mB3dZT77u+8O0QB89jFdnBkd5P1JgYPbPaia3gXXOVL2fq8VyU2gMMD7SaN7QukTB/pmXYvDA==", + "version": "0.4.24", + "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz", + "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==", "requires": { "safer-buffer": ">= 2.1.2 < 3" } @@ -5882,14 +6181,43 @@ "integrity": "sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==" }, "raw-body": { - "version": "2.3.3", - "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.3.3.tgz", - "integrity": "sha512-9esiElv1BrZoI3rCDuOuKCBRbuApGGaDPQfjSflGxdy4oyzqghxu6klEkkVIvBje+FF0BX9coEv8KqW6X/7njw==", + "version": "2.4.3", + "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.4.3.tgz", + "integrity": "sha512-UlTNLIcu0uzb4D2f4WltY6cVjLi+/jEN4lgEUj3E04tpMDpUlkBo/eSn6zou9hum2VMNpCCUone0O0WeJim07g==", "requires": { - "bytes": "3.0.0", - "http-errors": "1.6.3", - "iconv-lite": "0.4.23", + "bytes": "3.1.2", + "http-errors": "1.8.1", + "iconv-lite": "0.4.24", "unpipe": "1.0.0" + }, + "dependencies": { + "http-errors": { + "version": "1.8.1", + "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-1.8.1.tgz", + "integrity": "sha512-Kpk9Sm7NmI+RHhnj6OIWDI1d6fIoFAtFt9RLaTMRlg/8w49juAStsrBgp0Dp4OdxdVbRIeKhtCUvoi/RuAhO4g==", + "requires": { + "depd": "~1.1.2", + "inherits": "2.0.4", + "setprototypeof": "1.2.0", + "statuses": ">= 1.5.0 < 2", + "toidentifier": "1.0.1" + } + }, + "inherits": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz", + "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==" + }, + "setprototypeof": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz", + "integrity": "sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==" + }, + "statuses": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz", + "integrity": "sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow=" + } } }, "rc": { @@ -6283,6 +6611,11 @@ "is-number": "^7.0.0" } }, + "toidentifier": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.1.tgz", + "integrity": "sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA==" + }, "toposort-class": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/toposort-class/-/toposort-class-1.0.1.tgz", diff --git a/server/package.json b/server/package.json index 601a925..cfdcd73 100644 --- a/server/package.json +++ b/server/package.json @@ -7,10 +7,12 @@ }, "dependencies": { "@trycourier/courier": "^3.5.0", + "body-parser": "^1.19.2", "cookie-parser": "~1.4.4", "cors": "^2.8.5", "debug": "~2.6.9", "express": "~4.16.1", + "formidable": "^2.0.1", "http-errors": "~1.6.3", "jade": "^0.29.0", "morgan": "~1.9.1", diff --git a/server/routes/auth/GetMemberOrgs.js b/server/routes/auth/GetMemberOrgs.js index 2520323..025f558 100644 --- a/server/routes/auth/GetMemberOrgs.js +++ b/server/routes/auth/GetMemberOrgs.js @@ -1,5 +1,3 @@ -const { User } = require('../../models/index'); - async function GetMemberOrgs(req, res, next) { const user = req.user; diff --git a/server/routes/auth/SetAudio.js b/server/routes/auth/SetAudio.js new file mode 100644 index 0000000..de5b8fd --- /dev/null +++ b/server/routes/auth/SetAudio.js @@ -0,0 +1,21 @@ +const fs = require('fs'); + +function SetAudio(req, res, next) { + const user = req.user; + + const oldLocation = req.files.audioFile.filepath; + + const uploadDir = `${__dirname}/../../public/audio`; + const fileName = `${user.userID}.mp3`; + const newLocation = `${uploadDir}/${fileName}`; + + fs.rename(oldLocation, newLocation, function (err) { + if (err) { + console.log(err); + } + }); + + res.send('File saved'); +} + +module.exports = SetAudio; diff --git a/server/routes/authRouter.js b/server/routes/authRouter.js index 683a246..a196fc7 100644 --- a/server/routes/authRouter.js +++ b/server/routes/authRouter.js @@ -1,6 +1,7 @@ var express = require('express'); var router = express.Router(); +const parseFormData = require('../middleware/parseFormData'); const basicAuth = require('../middleware/basicAuth'); const tokenAuth = require('../middleware/tokenAuth'); const checkKnownUser = require('../middleware/checkKnownUser'); @@ -11,9 +12,10 @@ const Login = require('./auth/Login'); const Logout = require('./auth/Logout'); const RequestReset = require('./auth/RequestReset'); const ResetPassword = require('./auth/ResetPassword'); -const GetUserDetails = require('./auth/GetUserDetails'); +const SetAudio = require('./auth/SetAudio'); const GetOwnedOrgs = require('./auth/GetOwnedOrgs'); const GetMemberOrgs = require('./auth/GetMemberOrgs'); +const GetUserDetails = require('./auth/GetUserDetails'); router.post('/register', CreateUser); router.patch('/update', tokenAuth, UpdateUserDetails); @@ -22,8 +24,11 @@ router.post('/logout', tokenAuth, Logout); router.get('/reset-password', RequestReset); router.patch('/reset-password/:id', ResetPassword); +router.set('/audio', parseFormData, tokenAuth, SetAudio); + router.get('/', tokenAuth, GetOwnedOrgs); router.get('/orgs', tokenAuth, GetMemberOrgs); router.get('/:userID', tokenAuth, checkKnownUser, GetUserDetails); + module.exports = router; From eca4f47a05849c9778bf560c1550e4238c67b4b9 Mon Sep 17 00:00:00 2001 From: C4 Patino Date: Sat, 19 Mar 2022 13:29:08 -0500 Subject: [PATCH 4/4] Removed /record from route list --- client/src/App.jsx | 1 - 1 file changed, 1 deletion(-) diff --git a/client/src/App.jsx b/client/src/App.jsx index da4294e..03d49c9 100644 --- a/client/src/App.jsx +++ b/client/src/App.jsx @@ -27,7 +27,6 @@ function App() { path='' element={} > - } /> } />