Merge pull request #936 from AI4Bharat/waveSurfer

AI4Bharat · Feb 23, 2024 · 3c70c09 · 3c70c09
2 parents 3f97429 + 38c46a4
commit 3c70c09
Show file tree

Hide file tree

Showing 10 changed files with 25 additions and 24 deletions.
diff --git a/src/ui/pages/container/CL-Transcription/AllAudioTranscriptionLandingPage.jsx b/src/ui/pages/container/CL-Transcription/AllAudioTranscriptionLandingPage.jsx
@@ -335,7 +335,7 @@ const AllAudioTranscriptionLandingPage = () => {
   }, [wave, waveColor, backgroundColor, paddingColor, cursor, cursorColor, progress, progressColor, grid, gridColor, ruler, rulerColor, scrollbar, scrollbarColor, rulerAtTop, scrollable, duration, padding, pixelRatio, waveScale, waveSize, wavWorker]);
 
   const [waveSurfer, setWaveSurfer] = useState(true);
-  const [waveSurferHeight, setWaveSurferHeigth] = useState(128);
+  const [waveSurferHeight, setWaveSurferHeigth] = useState(140);
   const [waveSurferMinPxPerSec, setWaveSurferMinPxPerSec] = useState(100);
   const [waveSurferWaveColor, setWaveSurferWaveColor] = useState('#ff4e00');
   const [waveSurferProgressColor, setWaveSurferProgressColor] = useState("#dd5e98");
@@ -344,7 +344,7 @@ const AllAudioTranscriptionLandingPage = () => {
   const [waveSurferBarWidth, setWaveSurferBarWidth] = useState(2);
   const [waveSurferBarGap, setWaveSurferBarGap] = useState(0);
   const [waveSurferBarRadius, setWaveSurferBarRadius] = useState(0);
-  const [waveSurferBarHeight, setWaveSurferBarHeight] = useState(1);
+  const [waveSurferBarHeight, setWaveSurferBarHeight] = useState(2.2);
 
   const [waveSurferWaveformSettings, setWaveSurferWaveformSettings] = useState({
     "height": waveSurferHeight,

diff --git a/src/ui/pages/container/CL-Transcription/AudioTranscriptionLandingPage.jsx b/src/ui/pages/container/CL-Transcription/AudioTranscriptionLandingPage.jsx
@@ -794,7 +794,7 @@ useEffect(() => {
 }, [wave, waveColor, backgroundColor, paddingColor, cursor, cursorColor, progress, progressColor, grid, gridColor, ruler, rulerColor, scrollbar, scrollbarColor, rulerAtTop, scrollable, duration, padding, pixelRatio, waveScale, waveSize, wavWorker]);
 
 const [waveSurfer, setWaveSurfer] = useState(true);
-const [waveSurferHeight, setWaveSurferHeigth] = useState(128);
+const [waveSurferHeight, setWaveSurferHeigth] = useState(140);
 const [waveSurferMinPxPerSec, setWaveSurferMinPxPerSec] = useState(100);
 const [waveSurferWaveColor, setWaveSurferWaveColor] = useState('#ff4e00');
 const [waveSurferProgressColor, setWaveSurferProgressColor] = useState("#dd5e98");
@@ -803,7 +803,7 @@ const [waveSurferCursorWidth, setWaveSurferCursorWidth] = useState(1);
 const [waveSurferBarWidth, setWaveSurferBarWidth] = useState(2);
 const [waveSurferBarGap, setWaveSurferBarGap] = useState(0);
 const [waveSurferBarRadius, setWaveSurferBarRadius] = useState(0);
-const [waveSurferBarHeight, setWaveSurferBarHeight] = useState(1);
+const [waveSurferBarHeight, setWaveSurferBarHeight] = useState(2.2);
 
 const [waveSurferWaveformSettings, setWaveSurferWaveformSettings] = useState({
   "height": waveSurferHeight,

diff --git a/src/ui/pages/container/CL-Transcription/ReviewAudioTranscriptionLandingPage.jsx b/src/ui/pages/container/CL-Transcription/ReviewAudioTranscriptionLandingPage.jsx
@@ -991,7 +991,7 @@ useEffect(() => {
 }, [wave, waveColor, backgroundColor, paddingColor, cursor, cursorColor, progress, progressColor, grid, gridColor, ruler, rulerColor, scrollbar, scrollbarColor, rulerAtTop, scrollable, duration, padding, pixelRatio, waveScale, waveSize, wavWorker]);
 
 const [waveSurfer, setWaveSurfer] = useState(true);
-const [waveSurferHeight, setWaveSurferHeigth] = useState(128);
+const [waveSurferHeight, setWaveSurferHeigth] = useState(140);
 const [waveSurferMinPxPerSec, setWaveSurferMinPxPerSec] = useState(100);
 const [waveSurferWaveColor, setWaveSurferWaveColor] = useState('#ff4e00');
 const [waveSurferProgressColor, setWaveSurferProgressColor] = useState("#dd5e98");
@@ -1000,7 +1000,7 @@ const [waveSurferCursorWidth, setWaveSurferCursorWidth] = useState(1);
 const [waveSurferBarWidth, setWaveSurferBarWidth] = useState(2);
 const [waveSurferBarGap, setWaveSurferBarGap] = useState(0);
 const [waveSurferBarRadius, setWaveSurferBarRadius] = useState(0);
-const [waveSurferBarHeight, setWaveSurferBarHeight] = useState(1);
+const [waveSurferBarHeight, setWaveSurferBarHeight] = useState(2.2);
 
 const [waveSurferWaveformSettings, setWaveSurferWaveformSettings] = useState({
   "height": waveSurferHeight,

diff --git a/src/ui/pages/container/CL-Transcription/SuperCheckerAudioTranscriptionLandingPage.jsx b/src/ui/pages/container/CL-Transcription/SuperCheckerAudioTranscriptionLandingPage.jsx
@@ -839,7 +839,7 @@ useEffect(() => {
 }, [wave, waveColor, backgroundColor, paddingColor, cursor, cursorColor, progress, progressColor, grid, gridColor, ruler, rulerColor, scrollbar, scrollbarColor, rulerAtTop, scrollable, duration, padding, pixelRatio, waveScale, waveSize, wavWorker]);
 
 const [waveSurfer, setWaveSurfer] = useState(true);
-const [waveSurferHeight, setWaveSurferHeigth] = useState(128);
+const [waveSurferHeight, setWaveSurferHeigth] = useState(140);
 const [waveSurferMinPxPerSec, setWaveSurferMinPxPerSec] = useState(100);
 const [waveSurferWaveColor, setWaveSurferWaveColor] = useState('#ff4e00');
 const [waveSurferProgressColor, setWaveSurferProgressColor] = useState("#dd5e98");
@@ -848,7 +848,7 @@ const [waveSurferCursorWidth, setWaveSurferCursorWidth] = useState(1);
 const [waveSurferBarWidth, setWaveSurferBarWidth] = useState(2);
 const [waveSurferBarGap, setWaveSurferBarGap] = useState(0);
 const [waveSurferBarRadius, setWaveSurferBarRadius] = useState(0);
-const [waveSurferBarHeight, setWaveSurferBarHeight] = useState(1);
+const [waveSurferBarHeight, setWaveSurferBarHeight] = useState(2.2);
 
 const [waveSurferWaveformSettings, setWaveSurferWaveformSettings] = useState({
   "height": waveSurferHeight,

diff --git a/src/ui/pages/container/CL-Transcription/TranscriptionRightPanel.jsx b/src/ui/pages/container/CL-Transcription/TranscriptionRightPanel.jsx
@@ -592,7 +592,7 @@ const TranscriptionRightPanel = ({
           </Box>
 
           <Box id={"subTitleContainer"} className={classes.subTitleContainer} sx={{
-            height: showAcousticText ? "calc(100vh - 380px)" : "calc(100vh - 385px)",
+            height: showAcousticText ? "calc(102vh - 380px)" : "calc(102vh - 385px)",
             alignItems: "center",
           }}>
           {currentPageData?.map((item, index) => {

diff --git a/src/ui/pages/container/CL-Transcription/wavesurfer.jsx b/src/ui/pages/container/CL-Transcription/wavesurfer.jsx
@@ -1,7 +1,6 @@
 import { useEffect, useRef, memo, useState, useCallback } from "react";
 import WaveSurfer from "wavesurfer.js";
 import RegionsPlugin from "../../../../../node_modules/wavesurfer.js/dist/plugins/regions.esm.js";
-import Minimap from "../../../../../node_modules/wavesurfer.js/dist/plugins/minimap.esm.js";
 import TimelinePlugin from '../../../../../node_modules/wavesurfer.js/dist/plugins/timeline.esm.js';
 import { useSelector, useDispatch } from "react-redux";
 import { setSubtitles } from "../../../../redux/actions/Common";
@@ -260,16 +259,20 @@ const Timeline2 = ({ details, waveformSettings }) => {
           }
         }
         updateSub(currentSubsCopy);
-        player.play();
+        if (region.start.toFixed(3) === parseFloat(DT.t2d(currentSubsCopy[region.id -1].start_time))){
+          player.currentTime = region.end;
+        }else{
+          player.currentTime = region.start;
+        }
         updateRegions(currentSubsCopy);
       }
     })
   }
 
   return (
     <>
-      <div style={{ paddingLeft: "20px", paddingRight: "20px" }} id="minimap"></div>
-      <div style={{ paddingLeft: "20px", paddingRight: "20px" }} id="waveform"></div>
+      <div style={{ paddingLeft: "20px", paddingRight: "20px", backgroundColor: "#ffffff" }} id="minimap"></div>
+      <div style={{ paddingLeft: "20px", paddingRight: "20px", backgroundColor: "#ffffff" }} id="waveform"></div>
     </>
   );
 };

diff --git a/src/ui/pages/container/Label-Studio/AllTaskLSF.jsx b/src/ui/pages/container/Label-Studio/AllTaskLSF.jsx
@@ -60,8 +60,9 @@ const LabelStudioWrapper = ({annotationNotesRef, loader, showLoader, hideLoader,
   // debugger
 
   useEffect(() => {
-    localStorage.setItem("labelStudio:settings", JSON.stringify({
-      bottomSidePanel: ProjectDetails?.project_type?.includes("Audio") ? false : true ,
+    let sidePanel = ProjectDetails?.project_type?.includes("OCRSegmentCategorization");
+    localStorage.setItem("labelStudio:settings", JSON.stringify({    
+      bottomSidePanel: !sidePanel,
       continuousLabeling: false,
       enableAutoSave: false,
       enableHotkeys: true,

diff --git a/src/ui/pages/container/Label-Studio/LSF.jsx b/src/ui/pages/container/Label-Studio/LSF.jsx
@@ -217,12 +217,11 @@ const LabelStudioWrapper = ({
   }, [userData]); */
 
   useEffect(() => {
+    let sidePanel = ProjectDetails?.project_type?.includes("OCRSegmentCategorization");
     localStorage.setItem(
       "labelStudio:settings",
       JSON.stringify({
-        bottomSidePanel:
-          !(ProjectDetails?.project_type?.includes("Audio")
-          || ProjectDetails?.project_type?.includes("Acoustic")),
+        bottomSidePanel: !sidePanel,
         continuousLabeling: false,
         enableAutoSave: true,
         enableHotkeys: true,

diff --git a/src/ui/pages/container/Label-Studio/ReviewLSF.jsx b/src/ui/pages/container/Label-Studio/ReviewLSF.jsx
@@ -269,12 +269,11 @@ const LabelStudioWrapper = ({
   }, [userData]); */
 
   useEffect(() => {
+    let sidePanel = ProjectDetails?.project_type?.includes("OCRSegmentCategorization");
     localStorage.setItem(
       "labelStudio:settings",
       JSON.stringify({
-        bottomSidePanel:
-          !(ProjectDetails?.project_type?.includes("Audio")
-          || ProjectDetails?.project_type?.includes("Acoustic")),
+        bottomSidePanel: !sidePanel,
         continuousLabeling: false,
         enableAutoSave: false,
         enableHotkeys: true,

diff --git a/src/ui/pages/container/Label-Studio/SuperCheckerLSF.jsx b/src/ui/pages/container/Label-Studio/SuperCheckerLSF.jsx
@@ -189,12 +189,11 @@ const LabelStudioWrapper = ({
   }, [userData]); */
 
   useEffect(() => {
+    let sidePanel = ProjectDetails?.project_type?.includes("OCRSegmentCategorization");
     localStorage.setItem(
       "labelStudio:settings",
       JSON.stringify({
-        bottomSidePanel: ProjectDetails?.project_type?.includes("Audio")
-          ? false
-          : true,
+        bottomSidePanel: !sidePanel,
         continuousLabeling: false,
         enableAutoSave: false,
         enableHotkeys: true,