selfhostyourtech/reflector
2
0
Fork 0
mirror of https://github.com/Monadical-SAS/reflector.git synced 2025-12-21 04:39:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix markers not rendering

Browse Source
This commit is contained in:
Jose B
2023-08-14 22:02:52 -05:00
parent 6d7c323203
commit d471cdd0a5
1 changed files with 39 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
www/app/components/record.js
View File

@@ -106,16 +106,13 @@ export default function Recorder(props) {
useEffect(() => { useEffect(() => {
topicsRef.current = props.topics; topicsRef.current = props.topics;
if (!isRecording) renderMarkers();
}, [props.topics]); }, [props.topics]);
useEffect(() => { const renderMarkers = () => {
if (record) { if (!waveRegions) return;
return record.on("stopRecording", () => {
const link = document.getElementById("download-recording");
link.href = record.getRecordedUrl();
link.download = "reflector-recording.webm";
link.style.visibility = "visible";
waveRegions.clearRegions();
for (let topic of topicsRef.current) { for (let topic of topicsRef.current) {
const content = document.createElement("div"); const content = document.createElement("div");
content.style = ` content.style = `
@@ -128,8 +125,7 @@ export default function Recorder(props) {
background-color: white; background-color: white;
border-radius: 0 3px 3px 0; border-radius: 0 3px 3px 0;
`; `;
content.onmouseover = () => content.onmouseover = () => (content.style.backgroundColor = "orange");
(content.style.backgroundColor = "orange");
content.onmouseout = () => (content.style.backgroundColor = "white"); content.onmouseout = () => (content.style.backgroundColor = "white");
content.textContent = content.textContent =
topic.title.length >= 20 topic.title.length >= 20
@@ -148,6 +144,16 @@ export default function Recorder(props) {
wavesurfer.setTime(region.start); wavesurfer.setTime(region.start);
}); });
} }
};
useEffect(() => {
if (record) {
return record.on("stopRecording", () => {
const link = document.getElementById("download-recording");
link.href = record.getRecordedUrl();
link.download = "reflector-recording.webm";
link.style.visibility = "visible";
renderMarkers();
}); });
} }
}, [record]); }, [record]);