diff --git a/.changeset/solid-grapes-reply.md b/.changeset/solid-grapes-reply.md new file mode 100644 index 0000000000..56f8312496 --- /dev/null +++ b/.changeset/solid-grapes-reply.md @@ -0,0 +1,6 @@ +--- +"@gradio/audio": patch +"gradio": patch +--- + +fix:Prevent audio speeding up when trimming diff --git a/gradio/components/audio.py b/gradio/components/audio.py index 7f4e07022d..cb15917d92 100644 --- a/gradio/components/audio.py +++ b/gradio/components/audio.py @@ -24,7 +24,8 @@ class WaveformOptions: A dataclass for specifying options for the waveform display in the Audio component. An instance of this class can be passed into the `waveform_options` parameter of `gr.Audio`. Parameters: waveform_color: The color (as a hex string or valid CSS color) of the full waveform representing the amplitude of the audio. Defaults to a light gray color. - waveform_progress_color: The color (as a hex string or valid CSS color) that the waveform fills with to as the audio plays. Defaults to an orange color. + waveform_progress_color: The color (as a hex string or valid CSS color) that the waveform fills with to as the audio plays. Defaults to the accent color. + trim_region_color: The color (as a hex string or valid CSS color) of the trim region. Defaults to the accent color. show_recording_waveform: Whether to show the waveform when recording audio. Defaults to True. show_controls: Whether to show the standard HTML audio player below the waveform when recording audio or playing recorded audio. Defaults to False. skip_length: The percentage (between 0 and 100) of the audio to skip when clicking on the skip forward / skip backward buttons. Defaults to 5. @@ -33,6 +34,7 @@ class WaveformOptions: waveform_color: str | None = None waveform_progress_color: str | None = None + trim_region_color: str | None = None show_recording_waveform: bool = True show_controls: bool = False skip_length: int | float = 5 @@ -118,7 +120,7 @@ class Audio( editable: If True, allows users to manipulate the audio file if the component is interactive. Defaults to True. min_length: The minimum length of audio (in seconds) that the user can pass into the prediction function. If None, there is no minimum length. max_length: The maximum length of audio (in seconds) that the user can pass into the prediction function. If None, there is no maximum length. - waveform_options: A dictionary of options for the waveform display. Options include: waveform_color (str), waveform_progress_color (str), show_controls (bool), skip_length (int). Default is None, which uses the default values for these options. + waveform_options: A dictionary of options for the waveform display. Options include: waveform_color (str), waveform_progress_color (str), show_controls (bool), skip_length (int), trim_region_color (str). Default is None, which uses the default values for these options. """ valid_sources: list[Literal["upload", "microphone"]] = ["upload", "microphone"] if sources is None: diff --git a/js/audio/Index.svelte b/js/audio/Index.svelte index 910d02cc96..b34e4457c0 100644 --- a/js/audio/Index.svelte +++ b/js/audio/Index.svelte @@ -114,6 +114,15 @@ resize: true }; + function set_trim_region_colour(): void { + document.documentElement.style.setProperty( + "--trim-region-color", + trim_region_settings.color || color_accent + ); + } + + set_trim_region_colour(); + function handle_error({ detail }: CustomEvent): void { const [level, status] = detail.includes("Invalid file type") ? ["warning", "complete"] diff --git a/js/audio/player/AudioPlayer.svelte b/js/audio/player/AudioPlayer.svelte index bb3a4bb990..ea5e0f6e4f 100644 --- a/js/audio/player/AudioPlayer.svelte +++ b/js/audio/player/AudioPlayer.svelte @@ -181,7 +181,7 @@ bind:mode bind:trimDuration bind:show_volume_slider - showRedo={interactive} + show_redo={interactive} {handle_reset_value} {waveform_options} {trim_region_settings} diff --git a/js/audio/recorder/AudioRecorder.svelte b/js/audio/recorder/AudioRecorder.svelte index 82eef08b9c..ac261c124a 100644 --- a/js/audio/recorder/AudioRecorder.svelte +++ b/js/audio/recorder/AudioRecorder.svelte @@ -242,7 +242,7 @@ {handle_trim_audio} bind:trimDuration bind:mode - showRedo + show_redo {handle_reset_value} {waveform_options} /> diff --git a/js/audio/shared/WaveformControls.svelte b/js/audio/shared/WaveformControls.svelte index ce4abcfa42..11b30c24b3 100644 --- a/js/audio/shared/WaveformControls.svelte +++ b/js/audio/shared/WaveformControls.svelte @@ -14,7 +14,7 @@ export let audio_duration: number; export let i18n: I18nFormatter; export let playing: boolean; - export let showRedo = false; + export let show_redo = false; export let interactive = false; export let handle_trim_audio: (start: number, end: number) => void; export let mode = ""; @@ -240,7 +240,7 @@
{#if editable && interactive} - {#if showRedo && mode === ""} + {#if show_redo && mode === ""}