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