diff --git a/release/app/package.json b/release/app/package.json index 7f2aa9e..e8e4e8d 100644 --- a/release/app/package.json +++ b/release/app/package.json @@ -1,6 +1,6 @@ { "name": "viseme-labeler", - "version": "1.2.5", + "version": "1.2.6", "description": "Viseme labeling tool", "license": "MIT", "author": { diff --git a/src/renderer/AppNotice.tsx b/src/renderer/AppNotice.tsx index fdf7e67..6882566 100644 --- a/src/renderer/AppNotice.tsx +++ b/src/renderer/AppNotice.tsx @@ -5,6 +5,9 @@ const AppNotice = () => { return ( VisLab version {version}. + + Known issue : keyboard shortcut is not working for now. + ); }; diff --git a/src/renderer/Editor.tsx b/src/renderer/Editor.tsx index 1c49ea7..0c7df71 100644 --- a/src/renderer/Editor.tsx +++ b/src/renderer/Editor.tsx @@ -10,10 +10,10 @@ import { } from '@mui/material'; import Selecto from 'react-selecto'; import EditorContext from '../context/editor'; -import EditorVideoInfo from './EditorVideoInfo'; -import EditorVideoProgress from './EditorVideoProgress'; -import EditorVideoPlayer from './EditorVideoPlayer'; -import EditorVideoControl from './EditorVideoControl'; +import EditorPlayerInfo from './EditorPlayerInfo'; +import EditorPlayerProgress from './EditorPlayerProgress'; +import EditorPlayer from './EditorPlayer'; +import EditorPlayerControl from './EditorPlayerControl'; import EditorLabelControl from './EditorLabelControl'; import EditorLabelVisualizer from './EditorLabelVisualizer'; import EditorBanner from './EditorBanner'; @@ -23,8 +23,9 @@ const Editor = () => { const ed = useContext(EditorContext); const selecto = useRef(null); - const player = useRef(null); - const [progress, setProgress] = useState({ + const videoPlayer = useRef(null); + const audioPlayer = useRef(null); + const [progress, setProgress] = useState({ currentTime: 0, currentFrame: 0, }); @@ -32,8 +33,9 @@ const Editor = () => { return ( <> - { }} /> - + - - + ; - setProgress: React.Dispatch>; +type EditorPlayerProps = { + videoPlayerRef: React.RefObject; + audioPlayerRef: React.RefObject; + setProgress: React.Dispatch>; style: React.CSSProperties; }; -const EditorVideoPlayerProgressEventInterval = 10; +const EditorPlayerProgressEventInterval = 10; -const EditorVideoPlayer = (props: EditorVideoPlayerProps) => { - const { playerRef, setProgress, style } = props; +const EditorPlayer = (props: EditorPlayerProps) => { + const { videoPlayerRef, audioPlayerRef, setProgress, style } = props; const ctx = useContext(GlobalContext); const ed = useContext(EditorContext); const [beforeItemIndex, setBeforeItemIndex] = useState(-1); - const [playerElement, setPlayerElement] = useState(null); + const [videoPlayerElement, setVideoPlayerElement] = + useState(null); + const [audioPlayerElement, setAudioPlayerElement] = + useState(null); const videoProgressUpdateInterval = useRef(); const fpsRef = useRef(1); const updateProgress = (currentTime = -1) => { setProgress({ currentTime: - currentTime === -1 ? playerRef.current?.currentTime || 0 : currentTime, + currentTime === -1 + ? videoPlayerRef.current?.currentTime || 0 + : currentTime, currentFrame: Math.round( - (playerRef.current?.currentTime || 0) * fpsRef.current + (videoPlayerRef.current?.currentTime || 0) * fpsRef.current ), }); }; @@ -40,9 +46,17 @@ const EditorVideoPlayer = (props: EditorVideoPlayerProps) => { currentFrame: 0, }); setBeforeItemIndex(ctx.currentItemIndex); - setPlayerElement( + setAudioPlayerElement( + + ); + setVideoPlayerElement(