Pi JddlZGddejZedkrej5Zejdegdgddd Zej d Z ej d ee dddn #1swxYwYe dSdS)Nc peZdZddddddeededzdeedzdededzf fd Zd ZxZS) AudioGalleryN)valuelabelscolumnslabel audio_urlsrrrr c ||_d}d}d} tjd|p |r|dnd||| ||||dd |dS)Nu
${label ? `` : ''}
${audio_urls.map((url, i) => `
${labels && labels[i] ? labels[i] : 'Audio ' + (i + 1)}
0:00
`).join('')}
aw .audio-gallery-container { padding: var(--spacing-lg); } .container-label { display: block; margin-bottom: var(--spacing-md); font-weight: 600; } .audio-gallery-grid { display: grid; gap: var(--spacing-lg); } .audio-item { border: 2px solid var(--border-color-primary); border-radius: var(--radius-md); padding: var(--spacing-md); cursor: pointer; transition: all 0.2s; } .audio-item:hover { border-color: var(--color-accent); box-shadow: 0 2px 8px rgba(0,0,0,0.1); } .audio-item[data-selected="true"] { border-color: var(--color-accent); background-color: var(--background-fill-secondary); } .audio-label { margin-bottom: 8px; text-align: center; } .waveform-canvas { width: 100%; height: 80px; background: var(--background-fill-secondary); margin-bottom: 8px; } .audio-controls { display: flex; align-items: center; gap: 8px; } .play-btn { width: 32px; height: 32px; border-radius: 50%; border: none; background: var(--color-accent); color: white; cursor: pointer; } .play-btn:hover { opacity: 0.8; } .time-display { font-size: 12px; } u/ const audioItems = element.querySelectorAll('.audio-item'); audioItems.forEach((item, index) => { const canvas = item.querySelector('.waveform-canvas'); const audio = item.querySelector('audio'); const playBtn = item.querySelector('.play-btn'); const timeDisplay = item.querySelector('.time-display'); const ctx = canvas.getContext('2d'); drawWaveform(canvas, ctx); item.addEventListener('click', (e) => { if (e.target === playBtn) return; audioItems.forEach(i => i.removeAttribute('data-selected')); item.setAttribute('data-selected', 'true'); props.value = audio.src; }); playBtn.addEventListener('click', (e) => { e.stopPropagation(); if (audio.paused) { document.querySelectorAll('.audio-item audio').forEach(a => a.pause()); document.querySelectorAll('.play-btn').forEach(b => b.textContent = '▶'); audio.play(); playBtn.textContent = '⏸'; } else { audio.pause(); playBtn.textContent = '▶'; } }); audio.addEventListener('timeupdate', () => { const currentTime = Math.floor(audio.currentTime); const minutes = Math.floor(currentTime / 60); const seconds = currentTime % 60; timeDisplay.textContent = `${minutes}:${seconds.toString().padStart(2, '0')}`; const progress = audio.currentTime / audio.duration; drawWaveform(canvas, ctx, progress); }); audio.addEventListener('ended', () => { playBtn.textContent = '▶'; drawWaveform(canvas, ctx, 0); }); }); function drawWaveform(canvas, ctx, progress = 0) { const width = canvas.width; const height = canvas.height; const bars = 50; const barWidth = width / bars; ctx.clearRect(0, 0, width, height); for (let i = 0; i < bars; i++) { const barHeight = (Math.sin(i * 0.5) * 0.3 + Math.random() * 0.7) * height * 0.8; const x = i * barWidth; const y = (height - barHeight) / 2; ctx.fillStyle = i / bars < progress ? '#FF7C00' : '#ccc'; ctx.fillRect(x, y, barWidth - 2, barHeight); } } rF) r html_template css_template js_on_loadr rrr apply_default_css)r super__init__) selfr rrrr kwargsr r r __class__s /home/jaya/work/projects/VOICE-AGENT/VIET/agent-env/lib/python3.11/site-packages/gradio/components/custom_html_components/audio_gallery.pyrzAudioGallery.__init__s% &  A F  BZAJqMMT'%!!#  c dddS)Nstringz Audio URL)typetitler)rs rapi_infozAudioGallery.api_infos    r) __name__ __module__ __qualname__liststrintrr __classcell__)rs@rrrs !#' | | | I| Tz | S D |  | Tz| | | | | | |       rr__main__z# Audio Gallery Demo)zNhttps://github.com/gradio-app/gradio/raw/main/test/test_files/audio_sample.wavzRhttps://github.com/gradio-app/gradio/raw/main/test/test_files/audio_sample-1-4.wavzShttps://github.com/gradio-app/gradio/raw/main/gradio/media_assets/audio/cantina.wavzVhttps://github.com/gradio-app/gradio/raw/main/gradio/media_assets/audio/recording1.wavzXhttps://github.com/gradio-app/gradio/raw/main/gradio/media_assets/audio/heath_ledger.mp3zWhttps://github.com/gradio-app/gradio/raw/main/gradio/media_assets/audio/cate_blanch.mp3)zSample 1zSample 2Cantina Recordingz Heath LedgerzCate BlanchettrzSelect an audio file)r rrr zSelected Audio URL)r c|S)Nr)xs rr)sr)fninputsoutputs) gradiogrHTMLrrBlocksdemoMarkdowngalleryTextboxoutput Interfacelaunchrrrr8s\C C C C C 27C C C L z   *+++,(%   *"6777 {    5               @ KKMMMMMCsA BB B