RageStudio/comty
1
0
Fork 0
mirror of https://github.com/ragestudio/comty.git synced 2025-06-09 10:34:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

Format VideoEditor component code and fix upload headers

Browse Source
This commit is contained in:
SrGooglo 2025-04-24 09:39:25 +00:00
parent 69c4497671
commit 480efdef63
1 changed files with 82 additions and 81 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

161
packages/app/src/components/MusicStudio/EnhancedLyricsEditor/components/VideoEditor/index.jsx
View File

@ -12,95 +12,96 @@ import "./index.less"
dayjs.extend(customParseFormat) dayjs.extend(customParseFormat)
const VideoEditor = (props) => { const VideoEditor = (props) => {
function handleChange(key, value) { function handleChange(key, value) {
if (typeof props.onChange !== "function") { if (typeof props.onChange !== "function") {
return false return false
} }
props.onChange(key, value) props.onChange(key, value)
} }
return <div className="video-editor"> return (
<h1> <div className="video-editor">
<Icons.MdVideocam /> <h1>
Video <Icons.MdVideocam />
</h1> Video
</h1>
{ {!props.videoSourceURL && (
(!props.videoSourceURL) && <antd.Empty <antd.Empty
image={<Icons.MdVideocam />} image={<Icons.MdVideocam />}
description="No video" description="No video"
/> />
} )}
{ {props.videoSourceURL && (
props.videoSourceURL && <div className="video-editor-preview"> <div className="video-editor-preview">
<VideoPlayer <VideoPlayer
controls={[ controls={[
"play", "play",
"current-time", "current-time",
"seek-time", "seek-time",
"duration", "duration",
"progress", "progress",
"settings", "settings",
]} ]}
src={props.videoSourceURL} src={props.videoSourceURL}
/> />
</div> </div>
} )}
<div className="flex-column align-start gap10"> <div className="flex-column align-start gap10">
<div className="flex-row align-center gap10"> <div className="flex-row align-center gap10">
<span> <span>
<Icons.MdAccessTime /> <Icons.MdAccessTime />
Start video sync at Start video sync at
</span> </span>
<code>{props.startSyncAt ?? "not set"}</code> <code>{props.startSyncAt ?? "not set"}</code>
</div> </div>
<div className="flex-row align-center gap10"> <div className="flex-row align-center gap10">
<span>Set to:</span> <span>Set to:</span>
<antd.TimePicker <antd.TimePicker
showNow={false} showNow={false}
defaultValue={props.startSyncAt && dayjs((props.startSyncAt), "mm:ss:SSS")} defaultValue={
format={"mm:ss:SSS"} props.startSyncAt &&
onChange={(time, str) => { dayjs(props.startSyncAt, "mm:ss:SSS")
handleChange("startSyncAt", str) }
}} format={"mm:ss:SSS"}
/> onChange={(time, str) => {
</div> handleChange("startSyncAt", str)
</div> }}
/>
</div>
</div>
<div className="video-editor-actions"> <div className="video-editor-actions">
<UploadButton <UploadButton
onSuccess={(id, response) => { onSuccess={(id, response) => {
handleChange("videoSourceURL", response.url) handleChange("videoSourceURL", response.url)
}} }}
accept={[ accept={["video/*"]}
"video/*", headers={{
]} transformations: "mq-hls",
headers={{ }}
"transmux": "mq-hls", disabled={props.loading}
}} >
disabled={props.loading} Upload video
> </UploadButton>
Upload video or
</UploadButton> <antd.Input
placeholder="Set a video HLS URL"
or onChange={(e) => {
handleChange("videoSourceURL", e.target.value)
<antd.Input }}
placeholder="Set a video HLS URL" value={props.videoSourceURL}
onChange={(e) => { disabled={props.loading}
handleChange("videoSourceURL", e.target.value) />
}} </div>
value={props.videoSourceURL} </div>
disabled={props.loading} )
/>
</div>
</div>
} }
export default VideoEditor export default VideoEditor