ext/hyperframes
2
0
Fork 0
mirror of https://github.com/heygen-com/hyperframes.git synced 2026-09-03 04:38:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(studio): add loop/muted/has-audio-track toggles to FlatMediaSection

Browse Source
This commit is contained in:
Vance Ingalls
2026-07-14 15:50:45 -07:00
parent ab263f25b4
commit 79fdff8701
2 changed files with 148 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/studio/src/components/editor/propertyPanelFlatMediaSection.tsx
+28
View File
@@ -56,6 +56,9 @@ export function FlatMediaSection({
(el as HTMLMediaElement).duration ||
0;
const mediaStartMax = Math.max(30, Math.ceil(sourceDuration || mediaStart + 10));
const hasLoop = el.hasAttribute("loop");
const hasMuted = el.hasAttribute("muted");
const hasAudio = element.dataAttributes["has-audio"] === "true";
const srcAttr = el.getAttribute("src") ?? "";
const [copied, setCopied] = useState(false);
@@ -218,6 +221,31 @@ export function FlatMediaSection({
displayValue={formatTimingValue(mediaStart)}
onCommit={(next) => void onSetAttribute("media-start", (next / 100).toFixed(2))}
/>
<FlatToggle
label="Loop"
checked={hasLoop}
onChange={(next) => void onSetHtmlAttribute("loop", next ? "true" : null)}
/>
<FlatToggle
label="Muted"
checked={hasMuted}
onChange={(next) => void onSetHtmlAttribute("muted", next ? "true" : null)}
/>
{isVideo && (
<FlatToggle
label="Has audio track"
checked={hasAudio}
onChange={(next) => {
if (next) {
void onSetAttribute("has-audio", "true");
void onSetHtmlAttribute("muted", null);
} else {
void onSetAttribute("has-audio", "");
void onSetHtmlAttribute("muted", "true");
}
}}
/>
)}
</>
)}
</div>