1import { B as Block } from './Button-05bf7cea.js'; 2import { u as uploadToHuggingFace } from './utils-8f25e669.js'; 3import { B as BlockLabel } from './BlockLabel-09bb0248.js'; 4import { I as IconButton } from './IconButton-fb69b8dd.js'; 5import { E as Empty } from './Empty-2eeff83e.js'; 6import { S as ShareButton } from './ShareButton-b044e1b5.js'; 7import { D as Download } from './Download-ea83bae3.js'; 8import { S as Static } from './Index-2cec2c56.js'; 9import { a as Play, P as Pause, T as Trim, S as SelectSource } from './SelectSource-a1604b96.js'; 10import { U as Undo } from './Undo-6c110254.js'; 11import { r as resolve_wasm_src } from './file-url-1a9970c0.js'; 12import { _ as __vitePreload, p as prepare_files, u as upload, n as normalise_file } from './index-5550136d.js'; 13import { U as Upload } from './Upload-02e4db12.js'; 14import { M as ModifyUpload } from './ModifyUpload-772201f4.js'; 15import { U as UploadText } from './UploadText-7206a31c.js'; 16export { default as BaseExample } from './Example-01f23d62.js'; 17import './Upload-8f4bfd80.js'; 18import './svelte/svelte.js'; 19/* empty css */import './Clear-9760deed.js'; 20 21/* home/runner/work/gradio/gradio/js/icons/src/Backward.svelte generated by Svelte v4.2.2 */ 22const { 23 SvelteComponent: SvelteComponent$f, 24 append: append$b, 25 attr: attr$c, 26 detach: detach$f, 27 init: init$f, 28 insert: insert$f, 29 noop: noop$a, 30 safe_not_equal: safe_not_equal$f, 31 svg_element: svg_element$5 32} = window.__gradio__svelte__internal; 33function create_fragment$f(ctx) { 34 let svg; 35 let path; 36 37 return { 38 c() { 39 svg = svg_element$5("svg"); 40 path = svg_element$5("path"); 41 attr$c(path, "stroke", "currentColor"); 42 attr$c(path, "stroke-width", "1.5"); 43 attr$c(path, "stroke-linecap", "round"); 44 attr$c(path, "stroke-linejoin", "round"); 45 attr$c(path, "d", "M21.044 5.704a.6.6 0 0 1 .956.483v11.626a.6.6 0 0 1-.956.483l-7.889-5.813a.6.6 0 0 1 0-.966l7.89-5.813ZM10.044 5.704a.6.6 0 0 1 .956.483v11.626a.6.6 0 0 1-.956.483l-7.888-5.813a.6.6 0 0 1 0-.966l7.888-5.813Z"); 46 attr$c(svg, "xmlns", "http://www.w3.org/2000/svg"); 47 attr$c(svg, "width", "24px"); 48 attr$c(svg, "height", "24px"); 49 attr$c(svg, "fill", "currentColor"); 50 attr$c(svg, "stroke-width", "1.5"); 51 attr$c(svg, "viewBox", "0 0 24 24"); 52 attr$c(svg, "color", "currentColor"); 53 }, 54 m(target, anchor) { 55 insert$f(target, svg, anchor); 56 append$b(svg, path); 57 }, 58 p: noop$a, 59 i: noop$a, 60 o: noop$a, 61 d(detaching) { 62 if (detaching) { 63 detach$f(svg); 64 } 65 } 66 }; 67} 68 69class Backward extends SvelteComponent$f { 70 constructor(options) { 71 super(); 72 init$f(this, options, null, create_fragment$f, safe_not_equal$f, {}); 73 } 74} 75 76/* home/runner/work/gradio/gradio/js/icons/src/Forward.svelte generated by Svelte v4.2.2 */ 77const { 78 SvelteComponent: SvelteComponent$e, 79 append: append$a, 80 attr: attr$b, 81 detach: detach$e, 82 init: init$e, 83 insert: insert$e, 84 noop: noop$9, 85 safe_not_equal: safe_not_equal$e, 86 svg_element: svg_element$4 87} = window.__gradio__svelte__internal; 88function create_fragment$e(ctx) { 89 let svg; 90 let path; 91 92 return { 93 c() { 94 svg = svg_element$4("svg"); 95 path = svg_element$4("path"); 96 attr$b(path, "stroke", "currentColor"); 97 attr$b(path, "stroke-width", "1.5"); 98 attr$b(path, "stroke-linecap", "round"); 99 attr$b(path, "stroke-linejoin", "round"); 100 attr$b(path, "d", "M2.956 5.704A.6.6 0 0 0 2 6.187v11.626a.6.6 0 0 0 .956.483l7.889-5.813a.6.6 0 0 0 0-.966l-7.89-5.813ZM13.956 5.704a.6.6 0 0 0-.956.483v11.626a.6.6 0 0 0 .956.483l7.889-5.813a.6.6 0 0 0 0-.966l-7.89-5.813Z"); 101 attr$b(svg, "xmlns", "http://www.w3.org/2000/svg"); 102 attr$b(svg, "width", "24px"); 103 attr$b(svg, "height", "24px"); 104 attr$b(svg, "fill", "currentColor"); 105 attr$b(svg, "stroke-width", "1.5"); 106 attr$b(svg, "viewBox", "0 0 24 24"); 107 attr$b(svg, "color", "currentColor"); 108 }, 109 m(target, anchor) { 110 insert$e(target, svg, anchor); 111 append$a(svg, path); 112 }, 113 p: noop$9, 114 i: noop$9, 115 o: noop$9, 116 d(detaching) { 117 if (detaching) { 118 detach$e(svg); 119 } 120 } 121 }; 122} 123 124class Forward extends SvelteComponent$e { 125 constructor(options) { 126 super(); 127 init$e(this, options, null, create_fragment$e, safe_not_equal$e, {}); 128 } 129} 130 131/* home/runner/work/gradio/gradio/js/icons/src/Music.svelte generated by Svelte v4.2.2 */ 132const { 133 SvelteComponent: SvelteComponent$d, 134 append: append$9, 135 attr: attr$a, 136 detach: detach$d, 137 init: init$d, 138 insert: insert$d, 139 noop: noop$8, 140 safe_not_equal: safe_not_equal$d, 141 svg_element: svg_element$3 142} = window.__gradio__svelte__internal; 143function create_fragment$d(ctx) { 144 let svg; 145 let path; 146 let circle0; 147 let circle1; 148 149 return { 150 c() { 151 svg = svg_element$3("svg"); 152 path = svg_element$3("path"); 153 circle0 = svg_element$3("circle"); 154 circle1 = svg_element$3("circle"); 155 attr$a(path, "d", "M9 18V5l12-2v13"); 156 attr$a(circle0, "cx", "6"); 157 attr$a(circle0, "cy", "18"); 158 attr$a(circle0, "r", "3"); 159 attr$a(circle1, "cx", "18"); 160 attr$a(circle1, "cy", "16"); 161 attr$a(circle1, "r", "3"); 162 attr$a(svg, "xmlns", "http://www.w3.org/2000/svg"); 163 attr$a(svg, "width", "100%"); 164 attr$a(svg, "height", "100%"); 165 attr$a(svg, "viewBox", "0 0 24 24"); 166 attr$a(svg, "fill", "none"); 167 attr$a(svg, "stroke", "currentColor"); 168 attr$a(svg, "stroke-width", "1.5"); 169 attr$a(svg, "stroke-linecap", "round"); 170 attr$a(svg, "stroke-linejoin", "round"); 171 attr$a(svg, "class", "feather feather-music"); 172 }, 173 m(target, anchor) { 174 insert$d(target, svg, anchor); 175 append$9(svg, path); 176 append$9(svg, circle0); 177 append$9(svg, circle1); 178 }, 179 p: noop$8, 180 i: noop$8, 181 o: noop$8, 182 d(detaching) { 183 if (detaching) { 184 detach$d(svg); 185 } 186 } 187 }; 188} 189 190class Music extends SvelteComponent$d { 191 constructor(options) { 192 super(); 193 init$d(this, options, null, create_fragment$d, safe_not_equal$d, {}); 194 } 195} 196 197/* home/runner/work/gradio/gradio/js/icons/src/VolumeLow.svelte generated by Svelte v4.2.2 */ 198const { 199 SvelteComponent: SvelteComponent$c, 200 append: append$8, 201 attr: attr$9, 202 detach: detach$c, 203 init: init$c, 204 insert: insert$c, 205 noop: noop$7, 206 safe_not_equal: safe_not_equal$c, 207 svg_element: svg_element$2, 208 text: text$7 209} = window.__gradio__svelte__internal; 210function create_fragment$c(ctx) { 211 let svg; 212 let title; 213 let t; 214 let path0; 215 let path1; 216 217 return { 218 c() { 219 svg = svg_element$2("svg"); 220 title = svg_element$2("title"); 221 t = text$7("Low volume"); 222 path0 = svg_element$2("path"); 223 path1 = svg_element$2("path"); 224 attr$9(path0, "d", "M19.5 7.5C19.5 7.5 21 9 21 11.5C21 14 19.5 15.5 19.5 15.5"); 225 attr$9(path0, "stroke-width", "1.5"); 226 attr$9(path0, "stroke-linecap", "round"); 227 attr$9(path0, "stroke-linejoin", "round"); 228 attr$9(path1, "d", "M2 13.8571V10.1429C2 9.03829 2.89543 8.14286 4 8.14286H6.9C7.09569 8.14286 7.28708 8.08544 7.45046 7.97772L13.4495 4.02228C14.1144 3.5839 15 4.06075 15 4.85714V19.1429C15 19.9392 14.1144 20.4161 13.4495 19.9777L7.45046 16.0223C7.28708 15.9146 7.09569 15.8571 6.9 15.8571H4C2.89543 15.8571 2 14.9617 2 13.8571Z"); 229 attr$9(path1, "stroke-width", "1.5"); 230 attr$9(svg, "width", "24"); 231 attr$9(svg, "height", "24"); 232 attr$9(svg, "viewBox", "0 0 24 24"); 233 attr$9(svg, "stroke-width", "1.5"); 234 attr$9(svg, "fill", "none"); 235 attr$9(svg, "xmlns", "http://www.w3.org/2000/svg"); 236 attr$9(svg, "stroke", "currentColor"); 237 attr$9(svg, "color", "currentColor"); 238 }, 239 m(target, anchor) { 240 insert$c(target, svg, anchor); 241 append$8(svg, title); 242 append$8(title, t); 243 append$8(svg, path0); 244 append$8(svg, path1); 245 }, 246 p: noop$7, 247 i: noop$7, 248 o: noop$7, 249 d(detaching) { 250 if (detaching) { 251 detach$c(svg); 252 } 253 } 254 }; 255} 256 257class VolumeLow extends SvelteComponent$c { 258 constructor(options) { 259 super(); 260 init$c(this, options, null, create_fragment$c, safe_not_equal$c, {}); 261 } 262} 263 264/* home/runner/work/gradio/gradio/js/icons/src/VolumeHigh.svelte generated by Svelte v4.2.2 */ 265const { 266 SvelteComponent: SvelteComponent$b, 267 append: append$7, 268 attr: attr$8, 269 detach: detach$b, 270 init: init$b, 271 insert: insert$b,
272 noop: noop$6, 273 safe_not_equal: safe_not_equal$b, 274 svg_element: svg_element$1, 275 text: text$6 276} = window.__gradio__svelte__internal; 277function create_fragment$b(ctx) { 278 let svg; 279 let title; 280 let t; 281 let path0; 282 let path1; 283 let path2; 284 285 return { 286 c() { 287 svg = svg_element$1("svg"); 288 title = svg_element$1("title"); 289 t = text$6("High volume"); 290 path0 = svg_element$1("path"); 291 path1 = svg_element$1("path"); 292 path2 = svg_element$1("path"); 293 attr$8(path0, "d", "M1 13.8571V10.1429C1 9.03829 1.89543 8.14286 3 8.14286H5.9C6.09569 8.14286 6.28708 8.08544 6.45046 7.97772L12.4495 4.02228C13.1144 3.5839 14 4.06075 14 4.85714V19.1429C14 19.9392 13.1144 20.4161 12.4495 19.9777L6.45046 16.0223C6.28708 15.9146 6.09569 15.8571 5.9 15.8571H3C1.89543 15.8571 1 14.9617 1 13.8571Z"); 294 attr$8(path0, "stroke-width", "1.5"); 295 attr$8(path1, "d", "M17.5 7.5C17.5 7.5 19 9 19 11.5C19 14 17.5 15.5 17.5 15.5"); 296 attr$8(path1, "stroke-width", "1.5"); 297 attr$8(path1, "stroke-linecap", "round"); 298 attr$8(path1, "stroke-linejoin", "round"); 299 attr$8(path2, "d", "M20.5 4.5C20.5 4.5 23 7 23 11.5C23 16 20.5 18.5 20.5 18.5"); 300 attr$8(path2, "stroke-width", "1.5"); 301 attr$8(path2, "stroke-linecap", "round"); 302 attr$8(path2, "stroke-linejoin", "round"); 303 attr$8(svg, "width", "24"); 304 attr$8(svg, "height", "24"); 305 attr$8(svg, "viewBox", "0 0 24 24"); 306 attr$8(svg, "stroke-width", "1.5"); 307 attr$8(svg, "fill", "none"); 308 attr$8(svg, "stroke", "currentColor"); 309 attr$8(svg, "xmlns", "http://www.w3.org/2000/svg"); 310 attr$8(svg, "color", "currentColor"); 311 }, 312 m(target, anchor) { 313 insert$b(target, svg, anchor); 314 append$7(svg, title); 315 append$7(title, t); 316 append$7(svg, path0); 317 append$7(svg, path1); 318 append$7(svg, path2); 319 }, 320 p: noop$6, 321 i: noop$6, 322 o: noop$6, 323 d(detaching) { 324 if (detaching) { 325 detach$b(svg); 326 } 327 } 328 }; 329} 330 331class VolumeHigh extends SvelteComponent$b { 332 constructor(options) { 333 super(); 334 init$b(this, options, null, create_fragment$b, safe_not_equal$b, {}); 335 } 336} 337 338/* home/runner/work/gradio/gradio/js/icons/src/VolumeMuted.svelte generated by Svelte v4.2.2 */ 339const { 340 SvelteComponent: SvelteComponent$a, 341 append: append$6, 342 attr: attr$7, 343 detach: detach$a, 344 init: init$a, 345 insert: insert$a, 346 noop: noop$5, 347 safe_not_equal: safe_not_equal$a, 348 svg_element, 349 text: text$5 350} = window.__gradio__svelte__internal; 351function create_fragment$a(ctx) { 352 let svg; 353 let title; 354 let t; 355 let g; 356 let path0; 357 let path1; 358 let defs; 359 let clipPath; 360 let rect; 361 362 return { 363 c() { 364 svg = svg_element("svg"); 365 title = svg_element("title"); 366 t = text$5("Muted volume"); 367 g = svg_element("g"); 368 path0 = svg_element("path"); 369 path1 = svg_element("path"); 370 defs = svg_element("defs"); 371 clipPath = svg_element("clipPath"); 372 rect = svg_element("rect"); 373 attr$7(path0, "d", "M18 14L20.0005 12M22 10L20.0005 12M20.0005 12L18 10M20.0005 12L22 14"); 374 attr$7(path0, "stroke-width", "1.5"); 375 attr$7(path0, "stroke-linecap", "round"); 376 attr$7(path0, "stroke-linejoin", "round"); 377 attr$7(path1, "d", "M2 13.8571V10.1429C2 9.03829 2.89543 8.14286 4 8.14286H6.9C7.09569 8.14286 7.28708 8.08544 7.45046 7.97772L13.4495 4.02228C14.1144 3.5839 15 4.06075 15 4.85714V19.1429C15 19.9392 14.1144 20.4161 13.4495 19.9777L7.45046 16.0223C7.28708 15.9146 7.09569 15.8571 6.9 15.8571H4C2.89543 15.8571 2 14.9617 2 13.8571Z"); 378 attr$7(path1, "stroke-width", "1.5"); 379 attr$7(g, "clip-path", "url(#clip0_3173_16686)"); 380 attr$7(rect, "width", "24"); 381 attr$7(rect, "height", "24"); 382 attr$7(rect, "fill", "white"); 383 attr$7(clipPath, "id", "clip0_3173_16686"); 384 attr$7(svg, "width", "24"); 385 attr$7(svg, "height", "24"); 386 attr$7(svg, "viewBox", "0 0 24 24"); 387 attr$7(svg, "stroke-width", "1.5"); 388 attr$7(svg, "fill", "none"); 389 attr$7(svg, "xmlns", "http://www.w3.org/2000/svg"); 390 attr$7(svg, "stroke", "currentColor"); 391 attr$7(svg, "color", "currentColor"); 392 }, 393 m(target, anchor) { 394 insert$a(target, svg, anchor); 395 append$6(svg, title); 396 append$6(title, t); 397 append$6(svg, g); 398 append$6(g, path0); 399 append$6(g, path1); 400 append$6(svg, defs); 401 append$6(defs, clipPath); 402 append$6(clipPath, rect); 403 }, 404 p: noop$5, 405 i: noop$5, 406 o: noop$5, 407 d(detaching) { 408 if (detaching) { 409 detach$a(svg); 410 } 411 } 412 }; 413} 414 415class VolumeMuted extends SvelteComponent$a { 416 constructor(options) { 417 super(); 418 init$a(this, options, null, create_fragment$a, safe_not_equal$a, {}); 419 } 420} 421 422var __awaiter$3 = (globalThis && globalThis.__awaiter) || function (thisArg, _arguments, P, generator) { 423 function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } 424 return new (P || (P = Promise))(function (resolve, reject) { 425 function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } 426 function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } 427 function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } 428 step((generator = generator.apply(thisArg, _arguments || [])).next()); 429 }); 430}; 431/** Decode an array buffer into an audio buffer */ 432function decode(audioData, sampleRate) { 433 return __awaiter$3(this, void 0, void 0, function* () { 434 const audioCtx = new AudioContext({ sampleRate }); 435 const decode = audioCtx.decodeAudioData(audioData); 436 return decode.finally(() => audioCtx.close()); 437 }); 438} 439/** Normalize peaks to -1..1 */ 440function normalize(channelData) { 441 const firstChannel = channelData[0]; 442 if (firstChannel.some((n) => n > 1 || n < -1)) { 443 const length = firstChannel.length; 444 let max = 0; 445 for (let i = 0; i < length; i++) { 446 const absN = Math.abs(firstChannel[i]); 447 if (absN > max) 448 max = absN; 449 } 450 for (const channel of channelData) { 451 for (let i = 0; i < length; i++) { 452 channel[i] /= max; 453 } 454 } 455 } 456 return channelData; 457} 458/** Create an audio buffer from pre-decoded audio data */ 459function createBuffer(channelData, duration) { 460 // If a single array of numbers is passed, make it an array of arrays 461 if (typeof channelData[0] === 'number') 462 channelData = [channelData]; 463 // Normalize to -1..1 464 normalize(channelData); 465 return { 466 duration, 467 length: channelData[0].length, 468 sampleRate: channelData[0].length / duration, 469 numberOfChannels: channelData.length, 470 getChannelData: (i) => channelData === null || channelData === void 0 ? void 0 : channelData[i], 471 copyFromChannel: AudioBuffer.prototype.copyFromChannel, 472 copyToChannel: AudioBuffer.prototype.copyToChannel, 473 }; 474} 475const Decoder = { 476 decode, 477 createBuffer, 478}; 479 480var __awaiter$2 = (globalThis && globalThis.__awaiter) || function (thisArg, _arguments, P, generator) { 481 function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } 482 return new (P || (P = Promise))(function (resolve, reject) { 483 function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } 484 function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } 485 function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } 486 step((generator = generator.apply(thisArg, _arguments || [])).next()); 487 }); 488}; 489function fetchBlob(url, progressCallback, requestInit) { 490 var _a, _b; 491 return __awaiter$2(this, void 0, void 0, function* () { 492 // Fetch the resource 493 const response = yield fetch(url, requestInit); 494 // Read the data to track progress 495 { 496 const reader = (_a = response.clone().body) === null || _a === void 0 ? void 0 : _a.getReader(); 497 const contentLength = Number((_b = response.headers) === null || _b === void 0 ? void 0 : _b.get('Content-Length')); 498 let receivedLength = 0; 499 // Process the data 500 const processChunk = (done, value) => __awaiter$2(this, void 0, void 0, function* () { 501 if (done) 502 return; 503 // Add to the received length 504 receivedLength += (value === null || value === void 0 ? void 0 : value.length) || 0; 505 const percentage = Math.round((receivedLength / contentLength) * 100); 506 progressCallback(percentage); 507 // Continue reading data 508 return reader === null || reader === void 0 ? void 0 : reader.read().then(({ done, value }) => processChunk(done, value)); 509 }); 510 reader === null || reader === void 0 ? void 0 : reader.read().then(({ done, value }) => processChunk(done, value)); 511 } 512 return response.blob(); 513 }); 514} 515const Fetcher = { 516 fetchBlob, 517}; 518 519/** A simple event emitter that can be used to listen to and emit events. */ 520class EventEmitter { 521 constructor() { 522 this.listeners = {}; 523 /** Subscribe to an event. Returns an unsubscribe function. */ 524 this.on = this.addEventListener; 525 /** Unsubscribe from an event */ 526 this.un = this.removeEventListener; 527 } 528 /** Add an event listener */ 529 addEventListener(event, listener, options) { 530 if (!this.listeners[event]) { 531 this.listeners[event] = new Set(); 532 } 533 this.listeners[event].add(listener); 534 if (options === null || options === void 0 ? void 0 : options.once) { 535 const unsubscribeOnce = () => { 536 this.removeEventListener(event, unsubscribeOnce); 537 this.removeEventListener(event, listener); 538 }; 539 this.addEventListener(event, unsubscribeOnce); 540 return unsubscribeOnce; 541 } 542 return () => this.removeEventListener(event, listener); 543 } 544 removeEventListener(event, listener) { 545 var _a; 546 (_a = this.listeners[event]) === null || _a === void 0 ? void 0 : _a.delete(listener); 547 } 548 /** Subscribe to an event only once */ 549 once(event, listener) { 550 return this.on(event, listener, { once: true }); 551 } 552 /** Clear all events */ 553 unAll() { 554 this.listeners = {}; 555 } 556 /** Emit an event */ 557 emit(eventName, ...args) { 558 if (this.listeners[eventName]) { 559 this.listeners[eventName].forEach((listener) => listener(...args)); 560 } 561 } 562} 563
564class Player extends EventEmitter { 565 constructor(options) { 566 super(); 567 this.isExternalMedia = false; 568 if (options.media) { 569 this.media = options.media; 570 this.isExternalMedia = true; 571 } 572 else { 573 this.media = document.createElement('audio'); 574 } 575 // Controls 576 if (options.mediaControls) { 577 this.media.controls = true; 578 } 579 // Autoplay 580 if (options.autoplay) { 581 this.media.autoplay = true; 582 } 583 // Speed 584 if (options.playbackRate != null) { 585 this.onceMediaEvent('canplay', () => { 586 if (options.playbackRate != null) { 587 this.media.playbackRate = options.playbackRate; 588 } 589 }); 590 } 591 } 592 onMediaEvent(event, callback, options) { 593 this.media.addEventListener(event, callback, options); 594 return () => this.media.removeEventListener(event, callback); 595 } 596 onceMediaEvent(event, callback) { 597 return this.onMediaEvent(event, callback, { once: true }); 598 } 599 getSrc() { 600 return this.media.currentSrc || this.media.src || ''; 601 } 602 revokeSrc() { 603 const src = this.getSrc(); 604 if (src.startsWith('blob:')) { 605 URL.revokeObjectURL(src); 606 } 607 } 608 setSrc(url, blob) { 609 const src = this.getSrc(); 610 if (src === url) 611 return; 612 this.revokeSrc(); 613 const newSrc = blob instanceof Blob ? URL.createObjectURL(blob) : url; 614 this.media.src = newSrc; 615 this.media.load(); 616 } 617 destroy() { 618 this.media.pause(); 619 if (this.isExternalMedia) 620 return; 621 this.media.remove(); 622 this.revokeSrc(); 623 this.media.src = ''; 624 // Load resets the media element to its initial state 625 this.media.load(); 626 } 627 setMediaElement(element) { 628 this.media = element; 629 } 630 /** Start playing the audio */ 631 play() { 632 return this.media.play(); 633 } 634 /** Pause the audio */ 635 pause() { 636 this.media.pause(); 637 } 638 /** Check if the audio is playing */ 639 isPlaying() { 640 return !this.media.paused && !this.media.ended; 641 } 642 /** Jumpt to a specific time in the audio (in seconds) */ 643 setTime(time) { 644 this.media.currentTime = time; 645 } 646 /** Get the duration of the audio in seconds */ 647 getDuration() { 648 return this.media.duration; 649 } 650 /** Get the current audio position in seconds */ 651 getCurrentTime() { 652 return this.media.currentTime; 653 } 654 /** Get the audio volume */ 655 getVolume() { 656 return this.media.volume; 657 } 658 /** Set the audio volume */ 659 setVolume(volume) { 660 this.media.volume = volume; 661 } 662 /** Get the audio muted state */ 663 getMuted() { 664 return this.media.muted; 665 } 666 /** Mute or unmute the audio */ 667 setMuted(muted) { 668 this.media.muted = muted; 669 } 670 /** Get the playback speed */ 671 getPlaybackRate() { 672 return this.media.playbackRate; 673 } 674 /** Set the playback speed, pass an optional false to NOT preserve the pitch */ 675 setPlaybackRate(rate, preservePitch) { 676 // preservePitch is true by default in most browsers 677 if (preservePitch != null) { 678 this.media.preservesPitch = preservePitch; 679 } 680 this.media.playbackRate = rate; 681 } 682 /** Get the HTML media element */ 683 getMediaElement() { 684 return this.media; 685 } 686 /** Set a sink id to change the audio output device */ 687 setSinkId(sinkId) { 688 // See https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/setSinkId 689 const media = this.media; 690 return media.setSinkId(sinkId); 691 } 692} 693 694function makeDraggable(element, onDrag, onStart, onEnd, threshold = 5) { 695 let unsub = () => { 696 return; 697 }; 698 if (!element) 699 return unsub; 700 const down = (e) => { 701 // Ignore the right mouse button 702 if (e.button === 2) 703 return; 704 e.preventDefault(); 705 e.stopPropagation();
706 element.style.touchAction = 'none'; 707 let startX = e.clientX; 708 let startY = e.clientY; 709 let isDragging = false; 710 const move = (e) => { 711 e.preventDefault(); 712 e.stopPropagation(); 713 const x = e.clientX; 714 const y = e.clientY; 715 if (isDragging || Math.abs(x - startX) >= threshold || Math.abs(y - startY) >= threshold) { 716 const { left, top } = element.getBoundingClientRect(); 717 if (!isDragging) { 718 isDragging = true; 719 onStart === null || onStart === void 0 ? void 0 : onStart(startX - left, startY - top); 720 } 721 onDrag(x - startX, y - startY, x - left, y - top); 722 startX = x; 723 startY = y; 724 } 725 }; 726 const click = (e) => { 727 if (isDragging) { 728 e.preventDefault(); 729 e.stopPropagation(); 730 } 731 }; 732 const up = () => { 733 element.style.touchAction = ''; 734 if (isDragging) { 735 onEnd === null || onEnd === void 0 ? void 0 : onEnd(); 736 } 737 unsub(); 738 }; 739 document.addEventListener('pointermove', move); 740 document.addEventListener('pointerup', up); 741 document.addEventListener('pointerleave', up); 742 document.addEventListener('click', click, true); 743 unsub = () => { 744 document.removeEventListener('pointermove', move); 745 document.removeEventListener('pointerup', up); 746 document.removeEventListener('pointerleave', up); 747 setTimeout(() => { 748 document.removeEventListener('click', click, true); 749 }, 10); 750 }; 751 }; 752 element.addEventListener('pointerdown', down); 753 return () => { 754 unsub(); 755 element.removeEventListener('pointerdown', down); 756 }; 757} 758 759class Renderer extends EventEmitter { 760 constructor(options, audioElement) { 761 super(); 762 this.timeouts = []; 763 this.isScrolling = false; 764 this.audioData = null; 765 this.resizeObserver = null; 766 this.isDragging = false; 767 this.options = options; 768 const parent = this.parentFromOptionsContainer(options.container); 769 this.parent = parent; 770 const [div, shadow] = this.initHtml(); 771 parent.appendChild(div); 772 this.container = div; 773 this.scrollContainer = shadow.querySelector('.scroll'); 774 this.wrapper = shadow.querySelector('.wrapper'); 775 this.canvasWrapper = shadow.querySelector('.canvases'); 776 this.progressWrapper = shadow.querySelector('.progress'); 777 this.cursor = shadow.querySelector('.cursor'); 778 if (audioElement) { 779 shadow.appendChild(audioElement); 780 } 781 this.initEvents(); 782 } 783 parentFromOptionsContainer(container) { 784 let parent; 785 if (typeof container === 'string') { 786 parent = document.querySelector(container); 787 } 788 else if (container instanceof HTMLElement) { 789 parent = container; 790 } 791 if (!parent) { 792 throw new Error('Container not found'); 793 } 794 return parent; 795 } 796 initEvents() { 797 const getClickPosition = (e) => { 798 const rect = this.wrapper.getBoundingClientRect(); 799 const x = e.clientX - rect.left; 800 const y = e.clientX - rect.left; 801 const relativeX = x / rect.width; 802 const relativeY = y / rect.height; 803 return [relativeX, relativeY]; 804 }; 805 // Add a click listener 806 this.wrapper.addEventListener('click', (e) => { 807 const [x, y] = getClickPosition(e); 808 this.emit('click', x, y); 809 }); 810 // Add a double click listener 811 this.wrapper.addEventListener('dblclick', (e) => { 812 const [x, y] = getClickPosition(e); 813 this.emit('dblclick', x, y); 814 }); 815 // Drag 816 if (this.options.dragToSeek) { 817 this.initDrag(); 818 } 819 // Add a scroll listener 820 this.scrollContainer.addEventListener('scroll', () => { 821 const { scrollLeft, scrollWidth, clientWidth } = this.scrollContainer; 822 const startX = scrollLeft / scrollWidth; 823 const endX = (scrollLeft + clientWidth) / scrollWidth;
824 this.emit('scroll', startX, endX); 825 }); 826 // Re-render the waveform on container resize 827 const delay = this.createDelay(100); 828 this.resizeObserver = new ResizeObserver(() => { 829 delay(() => this.reRender()); 830 }); 831 this.resizeObserver.observe(this.scrollContainer); 832 } 833 initDrag() { 834 makeDraggable(this.wrapper, 835 // On drag 836 (_, __, x) => { 837 this.emit('drag', Math.max(0, Math.min(1, x / this.wrapper.getBoundingClientRect().width))); 838 }, 839 // On start drag 840 () => (this.isDragging = true), 841 // On end drag 842 () => (this.isDragging = false)); 843 } 844 getHeight() { 845 const defaultHeight = 128; 846 if (this.options.height == null) 847 return defaultHeight; 848 if (!isNaN(Number(this.options.height))) 849 return Number(this.options.height); 850 if (this.options.height === 'auto') 851 return this.parent.clientHeight || defaultHeight; 852 return defaultHeight; 853 } 854 initHtml() { 855 const div = document.createElement('div'); 856 const shadow = div.attachShadow({ mode: 'open' }); 857 shadow.innerHTML = ` 858 <style> 859 :host { 860 user-select: none; 861 min-width: 1px; 862 } 863 :host audio { 864 display: block; 865 width: 100%; 866 } 867 :host .scroll { 868 overflow-x: auto; 869 overflow-y: hidden; 870 width: 100%; 871 position: relative; 872 } 873 :host .noScrollbar {
874 scrollbar-color: transparent; 875 scrollbar-width: none; 876 } 877 :host .noScrollbar::-webkit-scrollbar { 878 display: none; 879 -webkit-appearance: none; 880 } 881 :host .wrapper { 882 position: relative; 883 overflow: visible; 884 z-index: 2; 885 } 886 :host .canvases { 887 min-height: ${this.getHeight()}px; 888 } 889 :host .canvases > div { 890 position: relative; 891 } 892 :host canvas { 893 display: block; 894 position: absolute; 895 top: 0; 896 image-rendering: pixelated; 897 } 898 :host .progress { 899 pointer-events: none; 900 position: absolute; 901 z-index: 2; 902 top: 0; 903 left: 0; 904 width: 0; 905 height: 100%; 906 overflow: hidden; 907 } 908 :host .progress > div { 909 position: relative; 910 } 911 :host .cursor { 912 pointer-events: none; 913 position: absolute; 914 z-index: 5; 915 top: 0; 916 left: 0; 917 height: 100%; 918 border-radius: 2px; 919 } 920 </style> 921 922 <div class="scroll" part="scroll"> 923 <div class="wrapper" part="wrapper"> 924 <div class="canvases"></div> 925 <div class="progress" part="progress"></div> 926 <div class="cursor" part="cursor"></div> 927 </div> 928 </div> 929 `; 930 return [div, shadow]; 931 } 932 /** Wavesurfer itself calls this method. Do not call it manually. */ 933 setOptions(options) { 934 if (this.options.container !== options.container) { 935 const newParent = this.parentFromOptionsContainer(options.container); 936 newParent.appendChild(this.container); 937 this.parent = newParent; 938 } 939 if (options.dragToSeek && !this.options.dragToSeek) { 940 this.initDrag(); 941 } 942 this.options = options; 943 // Re-render the waveform 944 this.reRender(); 945 } 946 getWrapper() { 947 return this.wrapper; 948 } 949 getScroll() { 950 return this.scrollContainer.scrollLeft; 951 } 952 destroy() { 953 var _a; 954 this.container.remove(); 955 (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect(); 956 } 957 createDelay(delayMs = 10) { 958 const context = {}; 959 this.timeouts.push(context); 960 return (callback) => { 961 context.timeout && clearTimeout(context.timeout); 962 context.timeout = setTimeout(callback, delayMs); 963 }; 964 } 965 // Convert array of color values to linear gradient 966 convertColorValues(color) { 967 if (!Array.isArray(color)) 968 return color || ''; 969 if (color.length < 2) 970 return color[0] || ''; 971 const canvasElement = document.createElement('canvas'); 972 const ctx = canvasElement.getContext('2d'); 973 const gradient = ctx.createLinearGradient(0, 0, 0, canvasElement.height); 974 const colorStopPercentage = 1 / (color.length - 1); 975 color.forEach((color, index) => { 976 const offset = index * colorStopPercentage; 977 gradient.addColorStop(offset, color); 978 }); 979 return gradient; 980 } 981 renderBarWaveform(channelData, options, ctx, vScale) { 982 const topChannel = channelData[0]; 983 const bottomChannel = channelData[1] || channelData[0]; 984 const length = topChannel.length; 985 const { width, height } = ctx.canvas; 986 const halfHeight = height / 2; 987 const pixelRatio = window.devicePixelRatio || 1; 988 const barWidth = options.barWidth ? options.barWidth * pixelRatio : 1; 989 const barGap = options.barGap ? options.barGap * pixelRatio : options.barWidth ? barWidth / 2 : 0; 990 const barRadius = options.barRadius || 0; 991 const barIndexScale = width / (barWidth + barGap) / length; 992 const rectFn = barRadius && 'roundRect' in ctx ? 'roundRect' : 'rect'; 993 ctx.beginPath(); 994 let prevX = 0; 995 let maxTop = 0; 996 let maxBottom = 0; 997 for (let i = 0; i <= length; i++) { 998 const x = Math.round(i * barIndexScale); 999 if (x >
999 prevX) { 1000 const topBarHeight = Math.round(maxTop * halfHeight * vScale); 1001 const bottomBarHeight = Math.round(maxBottom * halfHeight * vScale); 1002 const barHeight = topBarHeight + bottomBarHeight || 1; 1003 // Vertical alignment 1004 let y = halfHeight - topBarHeight; 1005 if (options.barAlign === 'top') { 1006 y = 0; 1007 } 1008 else if (options.barAlign === 'bottom') { 1009 y = height - barHeight; 1010 } 1011 ctx[rectFn](prevX * (barWidth + barGap), y, barWidth, barHeight, barRadius); 1012 prevX = x; 1013 maxTop = 0; 1014 maxBottom = 0; 1015 } 1016 const magnitudeTop = Math.abs(topChannel[i] || 0); 1017 const magnitudeBottom = Math.abs(bottomChannel[i] || 0); 1018 if (magnitudeTop > maxTop) 1019 maxTop = magnitudeTop; 1020 if (magnitudeBottom > maxBottom) 1021 maxBottom = magnitudeBottom; 1022 } 1023 ctx.fill(); 1024 ctx.closePath(); 1025 } 1026 renderLineWaveform(channelData, _options, ctx, vScale) { 1027 const drawChannel = (index) => { 1028 const channel = channelData[index] || channelData[0]; 1029 const length = channel.length; 1030 const { height } = ctx.canvas; 1031 const halfHeight = height / 2; 1032 const hScale = ctx.canvas.width / length; 1033 ctx.moveTo(0, halfHeight); 1034 let prevX = 0; 1035 let max = 0; 1036 for (let i = 0; i <= length; i++) { 1037 const x = Math.round(i * hScale); 1038 if (x > prevX) { 1039 const h = Math.round(max * halfHeight * vScale) || 1; 1040 const y = halfHeight + h * (index === 0 ? -1 : 1); 1041 ctx.lineTo(prevX, y); 1042 prevX = x; 1043 max = 0; 1044 } 1045 const value = Math.abs(channel[i] || 0); 1046 if (value > max) 1047 max = value; 1048 } 1049 ctx.lineTo(prevX, halfHeight); 1050 }; 1051 ctx.beginPath(); 1052 drawChannel(0); 1053 drawChannel(1); 1054 ctx.fill(); 1055 ctx.closePath(); 1056 } 1057 renderWaveform(channelData, options, ctx) { 1058 ctx.fillStyle = this.convertColorValues(options.waveColor); 1059 // Custom rendering function 1060 if (options.renderFunction) { 1061 options.renderFunction(channelData, ctx); 1062 return; 1063 } 1064 // Vertical scaling 1065 let vScale = options.barHeight || 1; 1066 if (options.normalize) { 1067 const max = Array.from(channelData[0]).reduce((max, value) => Math.max(max, Math.abs(value)), 0); 1068 vScale = max ? 1 / max : 1; 1069 } 1070 // Render waveform as bars 1071 if (options.barWidth || options.barGap || options.barAlign) { 1072 this.renderBarWaveform(channelData, options, ctx, vScale); 1073 return; 1074 } 1075 // Render waveform as a polyline 1076 this.renderLineWaveform(channelData, options, ctx, vScale); 1077 } 1078 renderSingleCanvas(channelData, options, width, height, start, end, canvasContainer, progressContainer) { 1079 const pixelRatio = window.devicePixelRatio || 1; 1080 const canvas = document.createElement('canvas'); 1081 const length = channelData[0].length; 1082 canvas.width = Math.round((width * (end - start)) / length); 1083 canvas.height = height * pixelRatio; 1084 canvas.style.width = `${Math.floor(canvas.width / pixelRatio)}px`; 1085 canvas.style.height = `${height}px`; 1086 canvas.style.left = `${Math.floor((start * width) / pixelRatio / length)}px`; 1087 canvasContainer.appendChild(canvas); 1088 const ctx = canvas.getContext('2d'); 1089 this.renderWaveform(channelData.map((channel) => channel.slice(start, end)), options, ctx); 1090 // Draw a progress canvas 1091 if (canvas.width > 0 && canvas.height > 0) { 1092 const progressCanvas = canvas.cloneNode(); 1093 const progressCtx = progressCanvas.getContext('2d'); 1094 progressCtx.drawImage(canvas, 0, 0); 1095 // Set the composition method to draw only where the waveform is drawn 1096 progressCtx.globalCompositeOperation = 'source-in'; 1097 progressCtx.fillStyle = this.convertColorValues(options.progressColor); 1098 // This rectangle acts as a mask thanks to the composition method 1099 progressCtx.fillRect(0, 0, canvas.width, canvas.height); 1100 progressContainer.appendChild(progressCanvas); 1101 } 1102 } 1103 renderChannel(channelData, options, width) {
1104 // A container for canvases 1105 const canvasContainer = document.createElement('div'); 1106 const height = this.getHeight(); 1107 canvasContainer.style.height = `${height}px`; 1108 this.canvasWrapper.style.minHeight = `${height}px`; 1109 this.canvasWrapper.appendChild(canvasContainer); 1110 // A container for progress canvases 1111 const progressContainer = canvasContainer.cloneNode(); 1112 this.progressWrapper.appendChild(progressContainer); 1113 // Determine the currently visible part of the waveform 1114 const { scrollLeft, scrollWidth, clientWidth } = this.scrollContainer; 1115 const len = channelData[0].length; 1116 const scale = len / scrollWidth; 1117 let viewportWidth = Math.min(Renderer.MAX_CANVAS_WIDTH, clientWidth); 1118 // Adjust width to avoid gaps between canvases when using bars 1119 if (options.barWidth || options.barGap) { 1120 const barWidth = options.barWidth || 0.5; 1121 const barGap = options.barGap || barWidth / 2; 1122 const totalBarWidth = barWidth + barGap; 1123 if (viewportWidth % totalBarWidth !== 0) { 1124 viewportWidth = Math.floor(viewportWidth / totalBarWidth) * totalBarWidth; 1125 } 1126 } 1127 const start = Math.floor(Math.abs(scrollLeft) * scale); 1128 const end = Math.floor(start + viewportWidth * scale); 1129 const viewportLen = end - start; 1130 // Draw a portion of the waveform from start peak to end peak 1131 const draw = (start, end) => { 1132 this.renderSingleCanvas(channelData, options, width, height, Math.max(0, start), Math.min(end, len), canvasContainer, progressContainer); 1133 }; 1134 // Draw the waveform in viewport chunks, each with a delay 1135 const headDelay = this.createDelay(); 1136 const tailDelay = this.createDelay(); 1137 const renderHead = (fromIndex, toIndex) => { 1138 draw(fromIndex, toIndex); 1139 if (fromIndex > 0) { 1140 headDelay(() => { 1141 renderHead(fromIndex - viewportLen, toIndex - viewportLen); 1142 }); 1143 } 1144 }; 1145 const renderTail = (fromIndex, toIndex) => { 1146 draw(fromIndex, toIndex); 1147 if (toIndex < len) { 1148 tailDelay(() => { 1149 renderTail(fromIndex + viewportLen, toIndex + viewportLen); 1150 }); 1151 } 1152 }; 1153 renderHead(start, end); 1154 if (end < len) { 1155 renderTail(end, end + viewportLen); 1156 } 1157 } 1158 render(audioData) { 1159 // Clear previous timeouts 1160 this.timeouts.forEach((context) => context.timeout && clearTimeout(context.timeout)); 1161 this.timeouts = []; 1162 // Clear the canvases 1163 this.canvasWrapper.innerHTML = ''; 1164 this.progressWrapper.innerHTML = ''; 1165 this.wrapper.style.width = ''; 1166 // Width 1167 if (this.options.width != null) { 1168 this.scrollContainer.style.width = 1169 typeof this.options.width === 'number' ? `${this.options.width}px` : this.options.width; 1170 } 1171 // Determine the width of the waveform 1172 const pixelRatio = window.devicePixelRatio || 1; 1173 const parentWidth = this.scrollContainer.clientWidth; 1174 const scrollWidth = Math.ceil(audioData.duration * (this.options.minPxPerSec || 0)); 1175 // Whether the container should scroll 1176 this.isScrolling = scrollWidth > parentWidth; 1177 const useParentWidth = this.options.fillParent && !this.isScrolling; 1178 // Width of the waveform in pixels 1179 const width = (useParentWidth ? parentWidth : scrollWidth) * pixelRatio; 1180 // Set the width of the wrapper 1181 this.wrapper.style.width = useParentWidth ? '100%' : `${scrollWidth}px`; 1182 // Set additional styles 1183 this.scrollContainer.style.overflowX = this.isScrolling ? 'auto' : 'hidden'; 1184 this.scrollContainer.classList.toggle('noScrollbar', !!this.options.hideScrollbar); 1185 this.cursor.style.backgroundColor = `${this.options.cursorColor || this.options.progressColor}`; 1186 this.cursor.style.width = `${this.options.cursorWidth}px`; 1187 // Render the waveform 1188 if (this.options.splitChannels) { 1189 // Render a waveform for each channel 1190 for (let i = 0; i < audioData.numberOfChannels; i++) { 1191 const options = Object.assign(Object.assign({}, this.options), this.options.splitChannels[i]); 1192 this.renderChannel([audioData.getChannelData(i)], options, width); 1193 } 1194 } 1195 else { 1196 // Render a single waveform for the first two channels (left and right) 1197 const channels = [audioData.getChannelData(0)]; 1198 if (audioData.numberOfChannels > 1) 1199 channels.push(audioData.getChannelData(1)); 1200 this.renderChannel(channels, this.options, width); 1201 } 1202 this.audioData = audioData;
1203 this.emit('render'); 1204 } 1205 reRender() { 1206 // Return if the waveform has not been rendered yet 1207 if (!this.audioData) 1208 return; 1209 // Remember the current cursor position 1210 const oldCursorPosition = this.progressWrapper.clientWidth; 1211 // Set the new zoom level and re-render the waveform 1212 this.render(this.audioData); 1213 // Adjust the scroll position so that the cursor stays in the same place 1214 const newCursortPosition = this.progressWrapper.clientWidth; 1215 this.scrollContainer.scrollLeft += newCursortPosition - oldCursorPosition; 1216 } 1217 zoom(minPxPerSec) { 1218 this.options.minPxPerSec = minPxPerSec; 1219 this.reRender(); 1220 } 1221 scrollIntoView(progress, isPlaying = false) { 1222 const { clientWidth, scrollLeft, scrollWidth } = this.scrollContainer; 1223 const progressWidth = scrollWidth * progress; 1224 const center = clientWidth / 2; 1225 const minScroll = isPlaying && this.options.autoCenter && !this.isDragging ? center : clientWidth; 1226 if (progressWidth > scrollLeft + minScroll || progressWidth < scrollLeft) { 1227 // Scroll to the center 1228 if (this.options.autoCenter && !this.isDragging) { 1229 // If the cursor is in viewport but not centered, scroll to the center slowly 1230 const minDiff = center / 20; 1231 if (progressWidth - (scrollLeft + center) >= minDiff && progressWidth < scrollLeft + clientWidth) { 1232 this.scrollContainer.scrollLeft += minDiff; 1233 } 1234 else { 1235 // Otherwise, scroll to the center immediately 1236 this.scrollContainer.scrollLeft = progressWidth - center; 1237 } 1238 } 1239 else if (this.isDragging) { 1240 // Scroll just a little bit to allow for some space between the cursor and the edge 1241 const gap = 10; 1242 this.scrollContainer.scrollLeft = 1243 progressWidth < scrollLeft ? progressWidth - gap : progressWidth - clientWidth + gap; 1244 } 1245 else { 1246 // Scroll to the beginning 1247 this.scrollContainer.scrollLeft = progressWidth; 1248 } 1249 } 1250 // Emit the scroll event 1251 { 1252 const { scrollLeft } = this.scrollContainer; 1253 const startX = scrollLeft / scrollWidth; 1254 const endX = (scrollLeft + clientWidth) / scrollWidth; 1255 this.emit('scroll', startX, endX); 1256 } 1257 } 1258 renderProgress(progress, isPlaying) { 1259 if (isNaN(progress)) 1260 return; 1261 const percents = progress * 100; 1262 this.canvasWrapper.style.clipPath = `polygon(${percents}% 0, 100% 0, 100% 100%, ${percents}% 100%)`; 1263 this.progressWrapper.style.width = `${percents}%`; 1264 this.cursor.style.left = `${percents}%`; 1265 this.cursor.style.marginLeft = Math.round(percents) === 100 ? `-${this.options.cursorWidth}px` : ''; 1266 if (this.isScrolling && this.options.autoScroll) { 1267 this.scrollIntoView(progress, isPlaying); 1268 } 1269 } 1270} 1271Renderer.MAX_CANVAS_WIDTH = 4000; 1272 1273class Timer extends EventEmitter { 1274 constructor() { 1275 super(...arguments); 1276 this.unsubscribe = () => undefined; 1277 } 1278 start() { 1279 this.unsubscribe = this.on('tick', () => { 1280 requestAnimationFrame(() => { 1281 this.emit('tick'); 1282 }); 1283 }); 1284 this.emit('tick'); 1285 } 1286 stop() { 1287 this.unsubscribe(); 1288 } 1289 destroy() { 1290 this.unsubscribe(); 1291 } 1292} 1293 1294var __awaiter$1 = (globalThis && globalThis.__awaiter) || function (thisArg, _arguments, P, generator) { 1295 function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } 1296 return new (P || (P = Promise))(function (resolve, reject) { 1297 function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } 1298 function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } 1299 function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } 1300 step((generator = generator.apply(thisArg, _arguments || [])).next()); 1301 }); 1302}; 1303/** 1304 * A Web Audio buffer player emulating the behavior of an HTML5 Audio element. 1305 */
1306class WebAudioPlayer extends EventEmitter { 1307 constructor(audioContext = new AudioContext()) { 1308 super(); 1309 this.bufferNode = null; 1310 this.autoplay = false; 1311 this.playStartTime = 0; 1312 this.playedDuration = 0; 1313 this._muted = false; 1314 this.buffer = null; 1315 this.currentSrc = ''; 1316 this.paused = true; 1317 this.crossOrigin = null; 1318 this.audioContext = audioContext; 1319 this.gainNode = this.audioContext.createGain(); 1320 this.gainNode.connect(this.audioContext.destination); 1321 } 1322 load() { 1323 return __awaiter$1(this, void 0, void 0, function* () { 1324 return; 1325 }); 1326 } 1327 get src() { 1328 return this.currentSrc; 1329 } 1330 set src(value) { 1331 this.currentSrc = value; 1332 fetch(value) 1333 .then((response) => response.arrayBuffer()) 1334 .then((arrayBuffer) => this.audioContext.decodeAudioData(arrayBuffer)) 1335 .then((audioBuffer) => { 1336 this.buffer = audioBuffer; 1337 this.emit('loadedmetadata'); 1338 this.emit('canplay'); 1339 if (this.autoplay) 1340 this.play(); 1341 }); 1342 } 1343 _play() { 1344 var _a; 1345 if (!this.paused) 1346 return; 1347 this.paused = false; 1348 (_a = this.bufferNode) === null || _a === void 0 ? void 0 : _a.disconnect(); 1349 this.bufferNode = this.audioContext.createBufferSource(); 1350 this.bufferNode.buffer = this.buffer; 1351 this.bufferNode.connect(this.gainNode); 1352 if (this.playedDuration >= this.duration) { 1353 this.playedDuration = 0; 1354 } 1355 this.bufferNode.start(this.audioContext.currentTime, this.playedDuration); 1356 this.playStartTime = this.audioContext.currentTime; 1357 this.bufferNode.onended = () => { 1358 if (this.currentTime >= this.duration) { 1359 this.pause(); 1360 this.emit('ended'); 1361 } 1362 }; 1363 } 1364 _pause() { 1365 var _a; 1366 if (this.paused) 1367 return; 1368 this.paused = true; 1369 (_a = this.bufferNode) === null || _a === void 0 ? void 0 : _a.stop(); 1370 this.playedDuration += this.audioContext.currentTime - this.playStartTime; 1371 } 1372 play() { 1373 return __awaiter$1(this, void 0, void 0, function* () { 1374 this._play(); 1375 this.emit('play'); 1376 }); 1377 } 1378 pause() { 1379 this._pause(); 1380 this.emit('pause'); 1381 } 1382 setSinkId(deviceId) { 1383 return __awaiter$1(this, void 0, void 0, function* () { 1384 const ac = this.audioContext; 1385 return ac.setSinkId(deviceId); 1386 }); 1387 } 1388 get playbackRate() { 1389 var _a, _b; 1390 return (_b = (_a = this.bufferNode) === null || _a === void 0 ? void 0 : _a.playbackRate.value) !== null && _b !== void 0 ? _b : 1; 1391 } 1392 set playbackRate(value) { 1393 if (this.bufferNode) { 1394 this.bufferNode.playbackRate.value = value; 1395 } 1396 } 1397 get currentTime() { 1398 return this.paused ? this.playedDuration : this.playedDuration + this.audioContext.currentTime - this.playStartTime; 1399 } 1400 set currentTime(value) { 1401 this.emit('seeking'); 1402 if (this.paused) { 1403 this.playedDuration = value; 1404 } 1405 else { 1406 this._pause(); 1407 this.playedDuration = value; 1408 this._play(); 1409 } 1410 this.emit('timeupdate'); 1411 } 1412 get duration() { 1413 var _a; 1414 return ((_a = this.buffer) === null || _a === void 0 ? void 0 : _a.duration) || 0; 1415 } 1416 get volume() { 1417 return this.gainNode.gain.value; 1418 } 1419 set volume(value) { 1420 this.gainNode.gain.value = value; 1421 this.emit('volumechange'); 1422 } 1423 get muted() { 1424 return this._muted; 1425 } 1426 set muted(value) { 1427 if (this._muted === value) 1428 return; 1429 this._muted = value; 1430 if (this._muted) { 1431 this.gainNode.disconnect(); 1432 } 1433 else { 1434 this.gainNode.connect(this.audioContext.destination); 1435 } 1436 } 1437 /** Get the GainNode used to play the audio. Can be used to attach filters. */ 1438 getGainNode() { 1439 return this.gainNode; 1440 } 1441} 1442 1443var __awaiter = (globalThis && globalThis.__awaiter) || function (thisArg, _arguments, P, generator) { 1444 function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } 1445 return new (P || (P = Promise))(function (resolve, reject) { 1446 function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } 1447 function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } 1448 function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } 1449 step((generator = generator.apply(thisArg, _arguments || [])).next()); 1450 }); 1451}; 1452const defaultOptions = { 1453 waveColor: '#999', 1454 progressColor: '#555', 1455 cursorWidth: 1, 1456 minPxPerSec: 0, 1457 fillParent: true, 1458 interact: true, 1459 dragToSeek: false, 1460 autoScroll: true, 1461 autoCenter: true, 1462 sampleRate: 8000, 1463}; 1464class WaveSurfer extends Player { 1465 /** Create a new WaveSurfer instance */ 1466 static create(options) { 1467 return new WaveSurfer(options); 1468 } 1469 /** Create a new WaveSurfer instance */ 1470 constructor(options) { 1471 const media = options.media || 1472 (options.backend === 'WebAudio' ? new WebAudioPlayer() : undefined); 1473 super({ 1474 media,
1475 mediaControls: options.mediaControls, 1476 autoplay: options.autoplay, 1477 playbackRate: options.audioRate, 1478 }); 1479 this.plugins = []; 1480 this.decodedData = null; 1481 this.subscriptions = []; 1482 this.mediaSubscriptions = []; 1483 this.options = Object.assign({}, defaultOptions, options); 1484 this.timer = new Timer(); 1485 const audioElement = media ? undefined : this.getMediaElement(); 1486 this.renderer = new Renderer(this.options, audioElement); 1487 this.initPlayerEvents(); 1488 this.initRendererEvents(); 1489 this.initTimerEvents(); 1490 this.initPlugins(); 1491 // Load audio if URL is passed or an external media with an src 1492 const url = this.options.url || this.getSrc(); 1493 if (url) { 1494 this.load(url, this.options.peaks, this.options.duration); 1495 } 1496 else if (this.options.peaks && this.options.duration) { 1497 // If pre-decoded peaks and duration are provided, render a waveform w/o loading audio 1498 this.loadPredecoded(); 1499 } 1500 } 1501 initTimerEvents() { 1502 // The timer fires every 16ms for a smooth progress animation 1503 this.subscriptions.push(this.timer.on('tick', () => { 1504 const currentTime = this.getCurrentTime(); 1505 this.renderer.renderProgress(currentTime / this.getDuration(), true); 1506 this.emit('timeupdate', currentTime); 1507 this.emit('audioprocess', currentTime); 1508 })); 1509 } 1510 initPlayerEvents() { 1511 this.mediaSubscriptions.push(this.onMediaEvent('timeupdate', () => { 1512 const currentTime = this.getCurrentTime(); 1513 this.renderer.renderProgress(currentTime / this.getDuration(), this.isPlaying()); 1514 this.emit('timeupdate', currentTime); 1515 }), this.onMediaEvent('play', () => { 1516 this.emit('play'); 1517 this.timer.start(); 1518 }), this.onMediaEvent('pause', () => { 1519 this.emit('pause'); 1520 this.timer.stop(); 1521 }), this.onMediaEvent('emptied', () => { 1522 this.timer.stop(); 1523 }), this.onMediaEvent('ended', () => { 1524 this.emit('finish'); 1525 }), this.onMediaEvent('seeking', () => { 1526 this.emit('seeking', this.getCurrentTime()); 1527 })); 1528 } 1529 initRendererEvents() { 1530 this.subscriptions.push( 1531 // Seek on click 1532 this.renderer.on('click', (relativeX, relativeY) => { 1533 if (this.options.interact) { 1534 this.seekTo(relativeX); 1535 this.emit('interaction', relativeX * this.getDuration()); 1536 this.emit('click', relativeX, relativeY); 1537 } 1538 }), 1539 // Double click 1540 this.renderer.on('dblclick', (relativeX, relativeY) => { 1541 this.emit('dblclick', relativeX, relativeY); 1542 }), 1543 // Scroll 1544 this.renderer.on('scroll', (startX, endX) => { 1545 const duration = this.getDuration(); 1546 this.emit('scroll', startX * duration, endX * duration); 1547 }), 1548 // Redraw 1549 this.renderer.on('render', () => { 1550 this.emit('redraw'); 1551 })); 1552 // Drag 1553 { 1554 let debounce; 1555 this.subscriptions.push(this.renderer.on('drag', (relativeX) => { 1556 if (!this.options.interact) 1557 return; 1558 // Update the visual position 1559 this.renderer.renderProgress(relativeX); 1560 // Set the audio position with a debounce 1561 clearTimeout(debounce); 1562 debounce = setTimeout(() => { 1563 this.seekTo(relativeX); 1564 }, this.isPlaying() ? 0 : 200); 1565 this.emit('interaction', relativeX * this.getDuration()); 1566 this.emit('drag', relativeX); 1567 })); 1568 } 1569 } 1570 initPlugins() { 1571 var _a; 1572 if (!((_a = this.options.plugins) === null || _a === void 0 ? void 0 : _a.length)) 1573 return; 1574 this.options.plugins.forEach((plugin) => { 1575 this.registerPlugin(plugin); 1576 }); 1577 } 1578 unsubscribePlayerEvents() { 1579 this.mediaSubscriptions.forEach((unsubscribe) => unsubscribe()); 1580 this.mediaSubscriptions = []; 1581 } 1582 /** Set new wavesurfer options and re-render it */ 1583 setOptions(options) { 1584 this.options = Object.assign({}, this.options, options); 1585 this.renderer.setOptions(this.options); 1586 if (options.audioRate) { 1587 this.setPlaybackRate(options.audioRate); 1588 }
1589 if (options.mediaControls != null) { 1590 this.getMediaElement().controls = options.mediaControls; 1591 } 1592 } 1593 /** Register a wavesurfer.js plugin */ 1594 registerPlugin(plugin) { 1595 plugin.init(this); 1596 this.plugins.push(plugin); 1597 // Unregister plugin on destroy 1598 this.subscriptions.push(plugin.once('destroy', () => { 1599 this.plugins = this.plugins.filter((p) => p !== plugin); 1600 })); 1601 return plugin; 1602 } 1603 /** For plugins only: get the waveform wrapper div */ 1604 getWrapper() { 1605 return this.renderer.getWrapper(); 1606 } 1607 /** Get the current scroll position in pixels */ 1608 getScroll() { 1609 return this.renderer.getScroll(); 1610 } 1611 /** Get all registered plugins */ 1612 getActivePlugins() { 1613 return this.plugins; 1614 } 1615 loadPredecoded() { 1616 return __awaiter(this, void 0, void 0, function* () { 1617 if (this.options.peaks && this.options.duration) { 1618 this.decodedData = Decoder.createBuffer(this.options.peaks, this.options.duration); 1619 yield Promise.resolve(); // wait for event listeners to subscribe 1620 this.renderDecoded(); 1621 } 1622 }); 1623 } 1624 renderDecoded() { 1625 return __awaiter(this, void 0, void 0, function* () { 1626 if (this.decodedData) { 1627 this.emit('decode', this.getDuration()); 1628 this.renderer.render(this.decodedData); 1629 } 1630 }); 1631 } 1632 loadAudio(url, blob, channelData, duration) { 1633 return __awaiter(this, void 0, void 0, function* () { 1634 this.emit('load', url); 1635 if (!this.options.media && this.isPlaying()) 1636 this.pause(); 1637 this.decodedData = null; 1638 // Fetch the entire audio as a blob if pre-decoded data is not provided 1639 if (!blob && !channelData) { 1640 const onProgress = (percentage) => this.emit('loading', percentage); 1641 blob = yield Fetcher.fetchBlob(url, onProgress, this.options.fetchParams); 1642 } 1643 // Set the mediaelement source 1644 this.setSrc(url, blob); 1645 // Wait for the audio duration 1646 // It should be a promise to allow event listeners to subscribe to the ready and decode events 1647 duration = 1648 (yield Promise.resolve(duration || this.getDuration())) || 1649 (yield new Promise((resolve) => { 1650 this.onceMediaEvent('loadedmetadata', () => resolve(this.getDuration())); 1651 })) || 1652 (yield Promise.resolve(0));
1653 // Decode the audio data or use user-provided peaks 1654 if (channelData) { 1655 this.decodedData = Decoder.createBuffer(channelData, duration); 1656 } 1657 else if (blob) { 1658 const arrayBuffer = yield blob.arrayBuffer(); 1659 this.decodedData = yield Decoder.decode(arrayBuffer, this.options.sampleRate); 1660 } 1661 this.renderDecoded(); 1662 this.emit('ready', this.getDuration()); 1663 }); 1664 } 1665 /** Load an audio file by URL, with optional pre-decoded audio data */ 1666 load(url, channelData, duration) { 1667 return __awaiter(this, void 0, void 0, function* () { 1668 yield this.loadAudio(url, undefined, channelData, duration); 1669 }); 1670 } 1671 /** Load an audio blob */ 1672 loadBlob(blob, channelData, duration) { 1673 return __awaiter(this, void 0, void 0, function* () { 1674 yield this.loadAudio('blob', blob, channelData, duration); 1675 }); 1676 } 1677 /** Zoom the waveform by a given pixels-per-second factor */ 1678 zoom(minPxPerSec) { 1679 if (!this.decodedData) { 1680 throw new Error('No audio loaded'); 1681 } 1682 this.renderer.zoom(minPxPerSec); 1683 this.emit('zoom', minPxPerSec); 1684 } 1685 /** Get the decoded audio data */ 1686 getDecodedData() { 1687 return this.decodedData; 1688 } 1689 /** Get decoded peaks */ 1690 exportPeaks({ channels = 2, maxLength = 8000, precision = 10000 } = {}) { 1691 if (!this.decodedData) { 1692 throw new Error('The audio has not been decoded yet'); 1693 } 1694 const maxChannels = Math.min(channels, this.decodedData.numberOfChannels); 1695 const peaks = []; 1696 for (let i = 0; i < maxChannels; i++) { 1697 const channel = this.decodedData.getChannelData(i); 1698 const data = []; 1699 const sampleSize = Math.round(channel.length / maxLength); 1700 for (let i = 0; i < maxLength; i++) { 1701 const sample = channel.slice(i * sampleSize, (i + 1) * sampleSize); 1702 const max = Math.max(...sample); 1703 data.push(Math.round(max * precision) / precision); 1704 } 1705 peaks.push(data); 1706 } 1707 return peaks; 1708 } 1709 /** Get the duration of the audio in seconds */ 1710 getDuration() { 1711 let duration = super.getDuration() || 0; 1712 // Fall back to the decoded data duration if the media duration is incorrect 1713 if ((duration === 0 || duration === Infinity) && this.decodedData) { 1714 duration = this.decodedData.duration; 1715 } 1716 return duration; 1717 } 1718 /** Toggle if the waveform should react to clicks */ 1719 toggleInteraction(isInteractive) { 1720 this.options.interact = isInteractive; 1721 } 1722 /** Seek to a percentage of audio as [0..1] (0 = beginning, 1 = end) */ 1723 seekTo(progress) { 1724 const time = this.getDuration() * progress; 1725 this.setTime(time); 1726 } 1727 /** Play or pause the audio */ 1728 playPause() { 1729 return __awaiter(this, void 0, void 0, function* () { 1730 return this.isPlaying() ? this.pause() : this.play(); 1731 }); 1732 } 1733 /** Stop the audio and go to the beginning */ 1734 stop() { 1735 this.pause(); 1736 this.setTime(0); 1737 } 1738 /** Skip N or -N seconds from the current position */ 1739 skip(seconds) { 1740 this.setTime(this.getCurrentTime() + seconds); 1741 } 1742 /** Empty the waveform by loading a tiny silent audio */ 1743 empty() { 1744 this.load('', [[0]], 0.001); 1745 } 1746 /** Set HTML media element */ 1747 setMediaElement(element) { 1748 this.unsubscribePlayerEvents(); 1749 super.setMediaElement(element); 1750 this.initPlayerEvents(); 1751 } 1752 /** Unmount wavesurfer */ 1753 destroy() { 1754 this.emit('destroy'); 1755 this.plugins.forEach((plugin) => plugin.destroy()); 1756 this.subscriptions.forEach((unsubscribe) => unsubscribe()); 1757 this.unsubscribePlayerEvents(); 1758 this.timer.destroy(); 1759 this.renderer.destroy(); 1760 super.destroy(); 1761 } 1762} 1763 1764function audioBufferToWav(audioBuffer) { 1765 const numOfChan = audioBuffer.numberOfChannels; 1766 const length = audioBuffer.length * numOfChan * 2 + 44; 1767 const buffer = new ArrayBuffer(length); 1768 const view = new DataView(buffer); 1769 let offset = 0; 1770 const writeString = function(view2, offset2, string) { 1771 for (let i = 0; i < string.length; i++) { 1772 view2.setUint8(offset2 + i, string.charCodeAt(i)); 1773 } 1774 }; 1775 writeString(view, offset, "RIFF"); 1776 offset += 4; 1777 view.setUint32(offset, length - 8, true); 1778 offset += 4; 1779 writeString(view, offset, "WAVE"); 1780 offset += 4; 1781 writeString(view, offset, "fmt "); 1782 offset += 4; 1783 view.setUint32(offset, 16, true); 1784 offset += 4; 1785 view.setUint16(offset, 1, true); 1786 offset += 2; 1787 view.setUint16(offset, numOfChan, true); 1788 offset += 2; 1789 view.setUint32(offset, audioBuffer.sampleRate, true); 1790 offset += 4; 1791 view.setUint32(offset, audioBuffer.sampleRate * 2 * numOfChan, true); 1792 offset += 4; 1793 view.setUint16(offset, numOfChan * 2, true); 1794 offset += 2; 1795 view.setUint16(offset, 16, true); 1796 offset += 2; 1797 writeString(view, offset, "data"); 1798 offset += 4; 1799 view.setUint32(offset, audioBuffer.length * numOfChan * 2, true); 1800 offset += 4; 1801 for (let i = 0; i < audioBuffer.numberOfChannels; i++) { 1802 const channel = audioBuffer.getChannelData(i); 1803 for (let j = 0; j < channel.length; j++) { 1804 view.setInt16(offset, channel[j] * 65535, true); 1805 offset += 2; 1806 } 1807 } 1808 return new Uint8Array(buffer); 1809} 1810 1811const process_audio = async (audioBuffer, start, end) => { 1812 const audioContext = new AudioContext(); 1813 const numberOfChannels = audioBuffer.numberOfChannels; 1814 const sampleRate = audioBuffer.sampleRate; 1815 let trimmedLength = audioBuffer.length; 1816 let startOffset = 0; 1817 if (start && end) { 1818 startOffset = Math.round(start * sampleRate); 1819 const endOffset = Math.round(end * sampleRate); 1820 trimmedLength = endOffset - startOffset; 1821 } 1822 const trimmedAudioBuffer = audioContext.createBuffer( 1823 numberOfChannels, 1824 trimmedLength, 1825 sampleRate 1826 ); 1827 for (let channel = 0; channel < numberOfChannels; channel++) {
1828 const channelData = audioBuffer.getChannelData(channel); 1829 const trimmedData = trimmedAudioBuffer.getChannelData(channel); 1830 for (let i = 0; i < trimmedLength; i++) { 1831 trimmedData[i] = channelData[startOffset + i]; 1832 } 1833 } 1834 return audioBufferToWav(trimmedAudioBuffer); 1835}; 1836const skipAudio = (waveform, amount) => { 1837 if (!waveform) 1838 return; 1839 waveform.skip(amount); 1840}; 1841const getSkipRewindAmount = (audioDuration, skip_length) => { 1842 if (!skip_length) { 1843 skip_length = 5; 1844 } 1845 return audioDuration / 100 * skip_length || 5; 1846}; 1847 1848let t$1 = class t{constructor(){this.listeners={},this.on=this.addEventListener,this.un=this.removeEventListener;}addEventListener(t,e,i){if(this.listeners[t]||(this.listeners[t]=new Set),this.listeners[t].add(e),null==i?void 0:i.once){const i=()=>{this.removeEventListener(t,i),this.removeEventListener(t,e);};return this.addEventListener(t,i),i}return ()=>this.removeEventListener(t,e)}removeEventListener(t,e){var i;null===(i=this.listeners[t])||void 0===i||i.delete(e);}once(t,e){return this.on(t,e,{once:!0})}unAll(){this.listeners={};}emit(t,...e){this.listeners[t]&&this.listeners[t].forEach((t=>t(...e)));}};let e$1 = class e extends t$1{constructor(t){super(),this.subscriptions=[],this.options=t;}onInit(){}init(t){this.wavesurfer=t,this.onInit();}destroy(){this.emit("destroy"),this.subscriptions.forEach((t=>t()));}};function i$1(t,e,i,n,s=5){let r=()=>{};if(!t)return r;const o=o=>{if(2===o.button)return;o.preventDefault(),o.stopPropagation(),t.style.touchAction="none";let a=o.clientX,h=o.clientY,l=!1;const d=n=>{n.preventDefault(),n.stopPropagation();const r=n.clientX,o=n.clientY;if(l||Math.abs(r-a)>=s||Math.abs(o-h)>=s){const{left:n,top:s}=t.getBoundingClientRect();l||(l=!0,null==i||i(a-n,h-s)),e(r-a,o-h,r-n,o-s),a=r,h=o;}},u=t=>{l&&(t.preventDefault(),t.stopPropagation());},c=()=>{t.style.touchAction="",l&&(null==n||n()),r();};document.addEventListener("pointermove",d),document.addEventListener("pointerup",c),document.addEventListener("pointerleave",c),document.addEventListener("click",u,!0),r=()=>{document.removeEventListener("pointermove",d),document.removeEventListener("pointerup",c),document.removeEventListener("pointerleave",c),setTimeout((()=>{document.removeEventListener("click",u,!0);}),10);};};return t.addEventListener("pointerdown",o),()=>{r(),t.removeEventListener("pointerdown",o);}}class n extends t$1{constructor(t,e,i=0){var n,s,r,o,a,h,l;super(),this.totalDuration=e,this.numberOfChannels=i,this.minLength=0,this.maxLength=1/0,this.id=t.id||`region-${Math.random().toString(32).slice(2)}`,this.start=this.clampPosition(t.start),this.end=this.clampPosition(null!==(n=t.end)&&void 0!==n?n:t.start),this.drag=null===(s=t.drag)||void 0===s||s,this.resize=null===(r=t.resize)||void 0===r||r,this.color=null!==(o=t.color)&&void 0!==o?o:"rgba(0, 0, 0, 0.1)",this.minLength=null!==(a=t.minLength)&&void 0!==a?a:this.minLength,this.maxLength=null!==(h=t.maxLength)&&void 0!==h?h:this.maxLength,this.channelIdx=null!==(l=t.channelIdx)&&void 0!==l?l:-1,this.element=this.initElement(),this.setContent(t.content),this.setPart(),this.renderPosition(),this.initMouseEvents();}clampPosition(t){return Math.max(0,Math.min(this.totalDuration,t))}setPart(){const t=this.start===this.end;this.element.setAttribute("part",`${t?"marker":"region"} ${this.id}`);}addResizeHandles(t){const e=document.createElement("div");e.setAttribute("data-resize","left"),e.setAttribute("style","\n position: absolute;\n z-index: 2;\n width: 6px;\n height: 100%;\n top: 0;\n left: 0;\n border-left: 2px solid rgba(0, 0, 0, 0.5);\n border-radius: 2px 0 0 2px;\n cursor: ew-resize;\n word-break: keep-all;\n "),e.setAttribute("part","region-handle region-handle-left");const n=e.cloneNode();n.setAttribute("data-resize","right"),n.style.left="",n.style.right="0",n.style.borderRight=n.style.borderLeft,n.style.borderLeft="",n.style.borderRadius="0 2px 2px 0",n.setAttribute("part","region-handle region-handle-right"),t.appendChild(e),t.appendChild(n);i$1(e,(t=>this.onResize(t,"start")),(()=>null),(()=>this.onEndResizing()),1),i$1(n,(t=>this.onResize(t,"end")),(()=>null),(()=>this.onEndResizing()),1);}removeResizeHandles(t){const e=t.querySelector('[data-resize="left"]'),i=t.querySelector('[data-resize="right"]');e&&t.removeChild(e),i&&t.removeChild(i);}initElement(){const t=document.createElement("div"),e=this.start===this.end;let i=0,n=100;return this.channelIdx>=0&&this.channelIdx<this.numberOfChannels&&(n=100/this.numberOfChannels,i=n*this.channelIdx),t.setAttribute("style",`\n position: absolute;\n top: ${i}%;\n height: ${n}%;
1848\n background-color: ${e?"none":this.color};\n border-left: ${e?"2px solid "+this.color:"none"};\n border-radius: 2px;\n box-sizing: border-box;\n transition: background-color 0.2s ease;\n cursor: ${this.drag?"grab":"default"};\n pointer-events: all;\n `),!e&&this.resize&&this.addResizeHandles(t),t}renderPosition(){const t=this.start/this.totalDuration,e=(this.totalDuration-this.end)/this.totalDuration;this.element.style.left=100*t+"%",this.element.style.right=100*e+"%";}initMouseEvents(){const{element:t}=this;t&&(t.addEventListener("click",(t=>this.emit("click",t))),t.addEventListener("mouseenter",(t=>this.emit("over",t))),t.addEventListener("mouseleave",(t=>this.emit("leave",t))),t.addEventListener("dblclick",(t=>this.emit("dblclick",t))),i$1(t,(t=>this.onMove(t)),(()=>this.onStartMoving()),(()=>this.onEndMoving())));}onStartMoving(){this.drag&&(this.element.style.cursor="grabbing");}onEndMoving(){this.drag&&(this.element.style.cursor="grab",this.emit("update-end"));}_onUpdate(t,e){if(!this.element.parentElement)return;const i=t/this.element.parentElement.clientWidth*this.totalDuration,n=e&&"start"!==e?this.start:this.start+i,s=e&&"end"!==e?this.end:this.end+i,r=s-n;n>=0&&s<=this.totalDuration&&n<=s&&r>=this.minLength&&r<=this.maxLength&&(this.start=n,this.end=s,this.renderPosition(),this.emit("update"));}onMove(t){this.drag&&this._onUpdate(t);}onResize(t,e){this.resize&&this._onUpdate(t,e);}onEndResizing(){this.resize&&this.emit("update-end");}_setTotalDuration(t){this.totalDuration=t,this.renderPosition();}play(){this.emit("play");}setContent(t){var e;if(null===(e=this.content)||void 0===e||e.remove(),t){if("string"==typeof t){this.content=document.createElement("div");const e=this.start===this.end;this.content.style.padding=`0.2em ${e?.2:.4}em`,this.content.textContent=t;}else this.content=t;this.content.setAttribute("part","region-content"),this.element.appendChild(this.content);}else this.content=void 0;}setOptions(t){var e,i;if(t.color&&(this.color=t.color,this.element.style.backgroundColor=this.color),void 0!==t.drag&&(this.drag=t.drag,this.element.style.cursor=this.drag?"grab":"default"),void 0!==t.start||void 0!==t.end){const n=this.start===this.end;this.start=this.clampPosition(null!==(e=t.start)&&void 0!==e?e:this.start),this.end=this.clampPosition(null!==(i=t.end)&&void 0!==i?i:n?this.start:this.end),this.renderPosition(),this.setPart();}if(t.content&&this.setContent(t.content),t.id&&(this.id=t.id,this.setPart()),void 0!==t.resize&&t.resize!==this.resize){const e=this.start===this.end;this.resize=t.resize,this.resize&&!e?this.addResizeHandles(this.element):this.removeResizeHandles(this.element);}}remove(){this.emit("remove"),this.element.remove(),this.element=null;}}let s$1 = class s extends e$1{constructor(t){super(t),this.regions=[],this.regionsContainer=this.initRegionsContainer();}static create(t){return new s(t)}onInit(){if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");this.wavesurfer.getWrapper().appendChild(this.regionsContainer);let t=[];this.subscriptions.push(this.wavesurfer.on("timeupdate",(e=>{const i=this.regions.filter((t=>t.start<=e&&t.end>=e));i.forEach((e=>{t.includes(e)||this.emit("region-in",e);})),t.forEach((t=>{i.includes(t)||this.emit("region-out",t);})),t=i;})));}initRegionsContainer(){const t=document.createElement("div");return t.setAttribute("style","\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 3;\n pointer-events: none;\n "),t}getRegions(){return this.regions}avoidOverlapping(t){if(!t.content)return;const e=t.content,i=e.getBoundingClientRect().left,n=t.element.scrollWidth,s=this.regions.filter((e=>{if(e===t||!e.content)return !1;const s=e.content.getBoundingClientRect().left,r=e.element.scrollWidth;return i<s+r&&s<i+n})).map((t=>{var e;return (null===(e=t.content)||void 0===e?void 0:e.getBoundingClientRect().height)||0})).reduce(((t,e)=>t+e),0);e.style.marginTop=`${s}px`;}saveRegion(t){this.regionsContainer.appendChild(t.element),this.avoidOverlapping(t),this.regions.push(t);const e=[t.on("update-end",(()=>
1848{this.avoidOverlapping(t),this.emit("region-updated",t);})),t.on("play",(()=>{var e,i;null===(e=this.wavesurfer)||void 0===e||e.play(),null===(i=this.wavesurfer)||void 0===i||i.setTime(t.start);})),t.on("click",(e=>{this.emit("region-clicked",t,e);})),t.on("dblclick",(e=>{this.emit("region-double-clicked",t,e);})),t.once("remove",(()=>{e.forEach((t=>t())),this.regions=this.regions.filter((e=>e!==t));}))];this.subscriptions.push(...e),this.emit("region-created",t);}addRegion(t){var e,i;if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const s=this.wavesurfer.getDuration(),r=null===(i=null===(e=this.wavesurfer)||void 0===e?void 0:e.getDecodedData())||void 0===i?void 0:i.numberOfChannels,o=new n(t,s,r);return s?this.saveRegion(o):this.subscriptions.push(this.wavesurfer.once("ready",(t=>{o._setTotalDuration(t),this.saveRegion(o);}))),o}enableDragSelection(t){var e,s;const r=null===(s=null===(e=this.wavesurfer)||void 0===e?void 0:e.getWrapper())||void 0===s?void 0:s.querySelector("div");if(!r)return ()=>{};let o=null,a=0;return i$1(r,((t,e,i)=>{o&&o._onUpdate(t,i>a?"end":"start");}),(e=>{var i,s;if(a=e,!this.wavesurfer)return;const r=this.wavesurfer.getDuration(),h=null===(s=null===(i=this.wavesurfer)||void 0===i?void 0:i.getDecodedData())||void 0===s?void 0:s.numberOfChannels,l=this.wavesurfer.getWrapper().clientWidth,d=e/l*r,u=(e+5)/l*r;o=new n(Object.assign(Object.assign({},t),{start:d,end:u}),r,h),this.regionsContainer.appendChild(o.element);}),(()=>{o&&(this.saveRegion(o),o=null);}))}clearRegions(){this.regions.forEach((t=>t.remove()));}destroy(){this.clearRegions(),super.destroy();}}; 1849 1850/* home/runner/work/gradio/gradio/js/audio/shared/VolumeLevels.svelte generated by Svelte v4.2.2 */ 1851const { 1852 SvelteComponent: SvelteComponent$9, 1853 check_outros: check_outros$6, 1854 create_component: create_component$7, 1855 destroy_component: destroy_component$7, 1856 detach: detach$9, 1857 empty: empty$6, 1858 group_outros: group_outros$6, 1859 init: init$9, 1860 insert: insert$9, 1861 mount_component: mount_component$7, 1862 safe_not_equal: safe_not_equal$9, 1863 transition_in: transition_in$7, 1864 transition_out: transition_out$7 1865} = window.__gradio__svelte__internal; 1866function create_if_block_2$5(ctx) { 1867 let volumehigh; 1868 let current; 1869 volumehigh = new VolumeHigh({}); 1870 1871 return { 1872 c() { 1873 create_component$7(volumehigh.$$.fragment); 1874 }, 1875 m(target, anchor) { 1876 mount_component$7(volumehigh, target, anchor); 1877 current = true; 1878 }, 1879 i(local) { 1880 if (current) return; 1881 transition_in$7(volumehigh.$$.fragment, local); 1882 current = true; 1883 }, 1884 o(local) { 1885 transition_out$7(volumehigh.$$.fragment, local); 1886 current = false; 1887 }, 1888 d(detaching) { 1889 destroy_component$7(volumehigh, detaching); 1890 } 1891 }; 1892} 1893 1894// (7:30) 1895function create_if_block_1$5(ctx) { 1896 let volumelow; 1897 let current; 1898 volumelow = new VolumeLow({}); 1899 1900 return { 1901 c() { 1902 create_component$7(volumelow.$$.fragment); 1903 }, 1904 m(target, anchor) { 1905 mount_component$7(volumelow, target, anchor); 1906 current = true; 1907 }, 1908 i(local) { 1909 if (current) return; 1910 transition_in$7(volumelow.$$.fragment, local); 1911 current = true; 1912 }, 1913 o(local) { 1914 transition_out$7(volumelow.$$.fragment, local); 1915 current = false; 1916 }, 1917 d(detaching) { 1918 destroy_component$7(volumelow, detaching); 1919 } 1920 }; 1921} 1922 1923// (5:0) {#if currentVolume == 0} 1924function create_if_block$8(ctx) { 1925 let volumemuted; 1926 let current; 1927 volumemuted = new VolumeMuted({}); 1928 1929 return { 1930 c() { 1931 create_component$7(volumemuted.$$.fragment); 1932 }, 1933 m(target, anchor) { 1934 mount_component$7(volumemuted, target, anchor); 1935 current = true; 1936 }, 1937 i(local) { 1938 if (current) return; 1939 transition_in$7(volumemuted.$$.fragment, local); 1940 current = true; 1941 }, 1942 o(local) { 1943 transition_out$7(volumemuted.$$.fragment, local); 1944 current = false; 1945 }, 1946 d(detaching) { 1947 destroy_component$7(volumemuted, detaching); 1948 } 1949 }; 1950} 1951 1952function create_fragment$9(ctx) { 1953 let current_block_type_index; 1954 let if_block; 1955 let if_block_anchor; 1956 let current; 1957 const if_block_creators = [create_if_block$8, create_if_block_1$5, create_if_block_2$5]; 1958 const if_blocks = []; 1959 1960 function select_block_type(ctx, dirty) { 1961 if (/*currentVolume*/ ctx[0] == 0) return 0; 1962 if (/*currentVolume*/ ctx[0] < 0.5) return 1; 1963 if (/*currentVolume*/ ctx[0] >= 0.5) return 2; 1964 return -1; 1965 } 1966 1967 if (~(current_block_type_index = select_block_type(ctx))) { 1968 if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 1969 } 1970 1971 return { 1972 c() { 1973 if (if_block) if_block.c(); 1974 if_block_anchor = empty$6(); 1975 }, 1976 m(target, anchor) { 1977 if (~current_block_type_index) { 1978 if_blocks[current_block_type_index].m(target, anchor); 1979 } 1980 1981 insert$9(target, if_block_anchor, anchor); 1982 current = true; 1983 }, 1984 p(ctx, [dirty]) { 1985 let previous_block_index = current_block_type_index; 1986 current_block_type_index = select_block_type(ctx); 1987 1988 if (current_block_type_index !== previous_block_index) { 1989 if (if_block) { 1990 group_outros$6(); 1991 1992 transition_out$7(if_blocks[previous_block_index], 1, 1, () => { 1993 if_blocks[previous_block_index] = null; 1994 }); 1995 1996 check_outros$6(); 1997 } 1998 1999 if (~current_block_type_index) { 2000 if_block = if_blocks[current_block_type_index]; 2001 2002 if (!if_block) { 2003 if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 2004 if_block.c(); 2005 } 2006 2007 transition_in$7(if_block, 1); 2008 if_block.m(if_block_anchor.parentNode, if_block_anchor); 2009 } else { 2010 if_block = null; 2011 } 2012 } 2013 }, 2014 i(local) { 2015 if (current) return; 2016 transition_in$7(if_block); 2017 current = true; 2018 }, 2019 o(local) { 2020 transition_out$7(if_block); 2021 current = false;
2022 }, 2023 d(detaching) { 2024 if (detaching) { 2025 detach$9(if_block_anchor); 2026 } 2027 2028 if (~current_block_type_index) { 2029 if_blocks[current_block_type_index].d(detaching); 2030 } 2031 } 2032 }; 2033} 2034 2035function instance$9($$self, $$props, $$invalidate) { 2036 let { currentVolume } = $$props; 2037 2038 $$self.$$set = $$props => { 2039 if ('currentVolume' in $$props) $$invalidate(0, currentVolume = $$props.currentVolume); 2040 }; 2041 2042 return [currentVolume]; 2043} 2044 2045class VolumeLevels extends SvelteComponent$9 { 2046 constructor(options) { 2047 super(); 2048 init$9(this, options, instance$9, create_fragment$9, safe_not_equal$9, { currentVolume: 0 }); 2049 } 2050} 2051 2052const VolumeControl_svelte_svelte_type_style_lang = ''; 2053 2054/* home/runner/work/gradio/gradio/js/audio/shared/VolumeControl.svelte generated by Svelte v4.2.2 */ 2055const { 2056 SvelteComponent: SvelteComponent$8, 2057 attr: attr$6, 2058 binding_callbacks: binding_callbacks$6, 2059 detach: detach$8, 2060 element: element$6, 2061 init: init$8, 2062 insert: insert$8, 2063 listen: listen$3, 2064 noop: noop$4, 2065 run_all: run_all$2, 2066 safe_not_equal: safe_not_equal$8 2067} = window.__gradio__svelte__internal; 2068const { onMount: onMount$3 } = window.__gradio__svelte__internal; 2069function create_fragment$8(ctx) { 2070 let input; 2071 let mounted; 2072 let dispose; 2073 2074 return { 2075 c() { 2076 input = element$6("input"); 2077 attr$6(input, "id", "volume"); 2078 attr$6(input, "class", "volume-slider svelte-wuo8j5"); 2079 attr$6(input, "type", "range"); 2080 attr$6(input, "min", "0"); 2081 attr$6(input, "max", "1"); 2082 attr$6(input, "step", "0.01"); 2083 input.value = /*currentVolume*/ ctx[0]; 2084 }, 2085 m(target, anchor) { 2086 insert$8(target, input, anchor); 2087 /*input_binding*/ ctx[4](input); 2088 2089 if (!mounted) { 2090 dispose = [ 2091 listen$3(input, "focusout", /*focusout_handler*/ ctx[5]), 2092 listen$3(input, "input", /*input_handler*/ ctx[6]) 2093 ]; 2094 2095 mounted = true; 2096 } 2097 }, 2098 p(ctx, [dirty]) { 2099 if (dirty & /*currentVolume*/ 1) { 2100 input.value = /*currentVolume*/ ctx[0]; 2101 } 2102 }, 2103 i: noop$4, 2104 o: noop$4, 2105 d(detaching) { 2106 if (detaching) { 2107 detach$8(input); 2108 } 2109 2110 /*input_binding*/ ctx[4](null); 2111 mounted = false; 2112 run_all$2(dispose); 2113 } 2114 }; 2115} 2116 2117function instance$8($$self, $$props, $$invalidate) { 2118 let { currentVolume = 1 } = $$props; 2119 let { show_volume_slider = false } = $$props; 2120 let { waveform } = $$props; 2121 let volumeElement; 2122 2123 onMount$3(() => { 2124 adjustSlider(); 2125 }); 2126 2127 const adjustSlider = () => { 2128 let slider = volumeElement; 2129 if (!slider) return; 2130 slider.style.background = `linear-gradient(to right, var(--color-accent) ${currentVolume * 100}%, var(--neutral-400) ${currentVolume * 100}%)`; 2131 }; 2132 2133 function input_binding($$value) { 2134 binding_callbacks$6[$$value ? 'unshift' : 'push'](() => { 2135 volumeElement = $$value; 2136 $$invalidate(3, volumeElement); 2137 }); 2138 } 2139 2140 const focusout_handler = () =>
2140 $$invalidate(1, show_volume_slider = false); 2141 2142 const input_handler = e => { 2143 if (e.target instanceof HTMLInputElement) { 2144 $$invalidate(0, currentVolume = parseFloat(e.target.value)); 2145 waveform.setVolume(currentVolume); 2146 } 2147 }; 2148 2149 $$self.$$set = $$props => { 2150 if ('currentVolume' in $$props) $$invalidate(0, currentVolume = $$props.currentVolume); 2151 if ('show_volume_slider' in $$props) $$invalidate(1, show_volume_slider = $$props.show_volume_slider); 2152 if ('waveform' in $$props) $$invalidate(2, waveform = $$props.waveform); 2153 }; 2154 2155 $$self.$$.update = () => { 2156 if ($$self.$$.dirty & /*currentVolume*/ 1) { 2157 (adjustSlider()); 2158 } 2159 }; 2160 2161 return [ 2162 currentVolume, 2163 show_volume_slider, 2164 waveform, 2165 volumeElement, 2166 input_binding, 2167 focusout_handler, 2168 input_handler 2169 ]; 2170} 2171 2172class VolumeControl extends SvelteComponent$8 { 2173 constructor(options) { 2174 super(); 2175 2176 init$8(this, options, instance$8, create_fragment$8, safe_not_equal$8, { 2177 currentVolume: 0, 2178 show_volume_slider: 1, 2179 waveform: 2 2180 }); 2181 } 2182} 2183 2184const WaveformControls_svelte_svelte_type_style_lang = ''; 2185 2186/* home/runner/work/gradio/gradio/js/audio/shared/WaveformControls.svelte generated by Svelte v4.2.2 */ 2187const { 2188 SvelteComponent: SvelteComponent$7, 2189 add_flush_callback: add_flush_callback$4, 2190 append: append$5, 2191 attr: attr$5, 2192 bind: bind$4, 2193 binding_callbacks: binding_callbacks$5, 2194 check_outros: check_outros$5, 2195 create_component: create_component$6, 2196 destroy_component: destroy_component$6, 2197 detach: detach$7, 2198 element: element$5, 2199 empty: empty$5, 2200 group_outros: group_outros$5, 2201 init: init$7, 2202 insert: insert$7, 2203 listen: listen$2, 2204 mount_component: mount_component$6, 2205 noop: noop$3, 2206 run_all: run_all$1, 2207 safe_not_equal: safe_not_equal$7, 2208 set_data: set_data$4, 2209 set_style: set_style$1, 2210 space: space$7, 2211 text: text$4, 2212 toggle_class, 2213 transition_in: transition_in$6, 2214 transition_out: transition_out$6 2215} = window.__gradio__svelte__internal; 2216function create_if_block_4$1(ctx) { 2217 let volumecontrol; 2218 let updating_currentVolume; 2219 let updating_show_volume_slider; 2220 let current; 2221 2222 function volumecontrol_currentVolume_binding(value) { 2223 /*volumecontrol_currentVolume_binding*/ ctx[26](value); 2224 } 2225 2226 function volumecontrol_show_volume_slider_binding(value) { 2227 /*volumecontrol_show_volume_slider_binding*/ ctx[27](value); 2228 } 2229 2230 let volumecontrol_props = { waveform: /*waveform*/ ctx[2] }; 2231 2232 if (/*currentVolume*/ ctx[11] !== void 0) { 2233 volumecontrol_props.currentVolume = /*currentVolume*/ ctx[11]; 2234 } 2235 2236 if (/*show_volume_slider*/ ctx[1] !== void 0) { 2237 volumecontrol_props.show_volume_slider = /*show_volume_slider*/ ctx[1]; 2238 } 2239 2240 volumecontrol = new VolumeControl({ props: volumecontrol_props }); 2241 binding_callbacks$5.push(() => bind$4(volumecontrol, 'currentVolume', volumecontrol_currentVolume_binding)); 2242 binding_callbacks$5.push(() => bind$4(volumecontrol, 'show_volume_slider', volumecontrol_show_volume_slider_binding)); 2243 2244 return { 2245 c() { 2246 create_component$6(volumecontrol.$$.fragment); 2247 }, 2248 m(target, anchor) { 2249 mount_component$6(volumecontrol, target, anchor); 2250 current = true; 2251 }, 2252 p(ctx, dirty) { 2253 const volumecontrol_changes = {}; 2254 if (dirty[0] & /*waveform*/ 4) volumecontrol_changes.waveform = /*waveform*/ ctx[2]; 2255 2256 if (!updating_currentVolume && dirty[0] & /*currentVolume*/ 2048) { 2257 updating_currentVolume = true; 2258 volumecontrol_changes.currentVolume = /*currentVolume*/ ctx[11]; 2259 add_flush_callback$4(() => updating_currentVolume = false); 2260 } 2261 2262 if (!updating_show_volume_slider && dirty[0] & /*show_volume_slider*/ 2) { 2263 updating_show_volume_slider = true; 2264 volumecontrol_changes.show_volume_slider = /*show_volume_slider*/ ctx[1]; 2265 add_flush_callback$4(() => updating_show_volume_slider = false); 2266 } 2267 2268 volumecontrol.$set(volumecontrol_changes); 2269 }, 2270 i(local) { 2271 if (current) return; 2272 transition_in$6(volumecontrol.$$.fragment, local); 2273 current = true; 2274 }, 2275 o(local) { 2276 transition_out$6(volumecontrol.$$.fragment, local); 2277 current = false; 2278 }, 2279 d(detaching) { 2280 destroy_component$6(volumecontrol, detaching); 2281 } 2282 }; 2283} 2284 2285// (198:3) {:else} 2286function create_else_block_1$1(ctx) { 2287 let play; 2288 let current; 2289 play = new Play({}); 2290 2291 return { 2292 c() { 2293 create_component$6(play.$$.fragment); 2294 }, 2295 m(target, anchor) { 2296 mount_component$6(play, target, anchor); 2297 current = true; 2298 }, 2299 i(local) { 2300 if (current) return; 2301 transition_in$6(play.$$.fragment, local); 2302 current = true; 2303 }, 2304 o(local) { 2305 transition_out$6(play.$$.fragment, local); 2306 current = false;
2307 }, 2308 d(detaching) { 2309 destroy_component$6(play, detaching); 2310 } 2311 }; 2312} 2313 2314// (196:3) {#if playing} 2315function create_if_block_3$3(ctx) { 2316 let pause; 2317 let current; 2318 pause = new Pause({}); 2319 2320 return { 2321 c() { 2322 create_component$6(pause.$$.fragment); 2323 }, 2324 m(target, anchor) { 2325 mount_component$6(pause, target, anchor); 2326 current = true; 2327 }, 2328 i(local) { 2329 if (current) return; 2330 transition_in$6(pause.$$.fragment, local); 2331 current = true; 2332 }, 2333 o(local) { 2334 transition_out$6(pause.$$.fragment, local); 2335 current = false; 2336 }, 2337 d(detaching) { 2338 destroy_component$6(pause, detaching); 2339 } 2340 }; 2341} 2342 2343// (218:2) {#if showRedo && mode === ""} 2344function create_if_block_2$4(ctx) { 2345 let button; 2346 let undo; 2347 let current; 2348 let mounted; 2349 let dispose; 2350 undo = new Undo({}); 2351 2352 return { 2353 c() { 2354 button = element$5("button"); 2355 create_component$6(undo.$$.fragment); 2356 attr$5(button, "class", "action icon svelte-t8ovdf"); 2357 attr$5(button, "aria-label", "Reset audio"); 2358 }, 2359 m(target, anchor) { 2360 insert$7(target, button, anchor); 2361 mount_component$6(undo, button, null); 2362 current = true; 2363 2364 if (!mounted) { 2365 dispose = listen$2(button, "click", /*click_handler_5*/ ctx[32]); 2366 mounted = true; 2367 } 2368 }, 2369 p: noop$3, 2370 i(local) { 2371 if (current) return; 2372 transition_in$6(undo.$$.fragment, local); 2373 current = true; 2374 }, 2375 o(local) { 2376 transition_out$6(undo.$$.fragment, local); 2377 current = false; 2378 }, 2379 d(detaching) { 2380 if (detaching) { 2381 detach$7(button); 2382 } 2383 2384 destroy_component$6(undo); 2385 mounted = false; 2386 dispose(); 2387 } 2388 }; 2389} 2390 2391// (232:2) {#if interactive} 2392function create_if_block$7(ctx) { 2393 let current_block_type_index; 2394 let if_block; 2395 let if_block_anchor; 2396 let current; 2397 const if_block_creators = [create_if_block_1$4, create_else_block$7]; 2398 const if_blocks = []; 2399 2400 function select_block_type_1(ctx, dirty) { 2401 if (/*mode*/ ctx[0] === "") return 0; 2402 return 1; 2403 } 2404 2405 current_block_type_index = select_block_type_1(ctx); 2406 if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 2407 2408 return { 2409 c() { 2410 if_block.c(); 2411 if_block_anchor = empty$5(); 2412 }, 2413 m(target, anchor) { 2414 if_blocks[current_block_type_index].m(target, anchor); 2415 insert$7(target, if_block_anchor, anchor); 2416 current = true; 2417 }, 2418 p(ctx, dirty) { 2419 let previous_block_index = current_block_type_index; 2420 current_block_type_index = select_block_type_1(ctx); 2421 2422 if (current_block_type_index === previous_block_index) { 2423 if_blocks[current_block_type_index].p(ctx, dirty); 2424 } else { 2425 group_outros$5(); 2426 2427 transition_out$6(if_blocks[previous_block_index], 1, 1, () => { 2428 if_blocks[previous_block_index] = null; 2429 }); 2430 2431 check_outros$5(); 2432 if_block = if_blocks[current_block_type_index]; 2433 2434 if (!if_block) { 2435 if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 2436 if_block.c(); 2437 } else { 2438 if_block.p(ctx, dirty); 2439 } 2440 2441 transition_in$6(if_block, 1); 2442 if_block.m(if_block_anchor.parentNode, if_block_anchor); 2443 } 2444 }, 2445 i(local) { 2446 if (current) return; 2447 transition_in$6(if_block); 2448 current = true; 2449 }, 2450 o(local) { 2451 transition_out$6(if_block); 2452 current = false; 2453 }, 2454 d(detaching) { 2455 if (detaching) { 2456 detach$7(if_block_anchor); 2457 } 2458 2459 if_blocks[current_block_type_index].d(detaching); 2460 } 2461 }; 2462} 2463 2464// (241:3) {:else} 2465function create_else_block$7(ctx) { 2466 let button0; 2467 let t1; 2468 let button1; 2469 let mounted; 2470 let dispose; 2471 2472 return { 2473 c() { 2474 button0 = element$5("button"); 2475 button0.textContent = "Trim"; 2476 t1 = space$7(); 2477 button1 = element$5("button"); 2478 button1.textContent = "Cancel"; 2479 attr$5(button0, "class", "text-button svelte-t8ovdf"); 2480 attr$5(button1, "class", "text-button svelte-t8ovdf"); 2481 }, 2482 m(target, anchor) { 2483 insert$7(target, button0, anchor); 2484 insert$7(target, t1, anchor); 2485 insert$7(target, button1, anchor); 2486 2487 if (!mounted) { 2488 dispose = [ 2489 listen$2(button0, "click", /*trimAudio*/ ctx[13]), 2490 listen$2(button1, "click", /*toggleTrimmingMode*/ ctx[15]) 2491 ]; 2492 2493 mounted = true; 2494 } 2495 }, 2496 p: noop$3, 2497 i: noop$3, 2498 o: noop$3, 2499 d(detaching) { 2500 if (detaching) { 2501 detach$7(button0); 2502 detach$7(t1); 2503 detach$7(button1); 2504 } 2505 2506 mounted = false;
2507 run_all$1(dispose); 2508 } 2509 }; 2510} 2511 2512// (233:3) {#if mode === ""} 2513function create_if_block_1$4(ctx) { 2514 let button; 2515 let trim; 2516 let current; 2517 let mounted; 2518 let dispose; 2519 trim = new Trim({}); 2520 2521 return { 2522 c() { 2523 button = element$5("button"); 2524 create_component$6(trim.$$.fragment); 2525 attr$5(button, "class", "action icon svelte-t8ovdf"); 2526 attr$5(button, "aria-label", "Trim audio to selection"); 2527 }, 2528 m(target, anchor) { 2529 insert$7(target, button, anchor); 2530 mount_component$6(trim, button, null); 2531 current = true; 2532 2533 if (!mounted) { 2534 dispose = listen$2(button, "click", /*toggleTrimmingMode*/ ctx[15]); 2535 mounted = true; 2536 } 2537 }, 2538 p: noop$3, 2539 i(local) { 2540 if (current) return; 2541 transition_in$6(trim.$$.fragment, local); 2542 current = true; 2543 }, 2544 o(local) { 2545 transition_out$6(trim.$$.fragment, local); 2546 current = false; 2547 }, 2548 d(detaching) { 2549 if (detaching) { 2550 detach$7(button); 2551 } 2552 2553 destroy_component$6(trim); 2554 mounted = false; 2555 dispose(); 2556 } 2557 }; 2558} 2559 2560function create_fragment$7(ctx) { 2561 let div3; 2562 let div0; 2563 let button0; 2564 let volumelevels; 2565 let t0; 2566 let t1; 2567 let button1; 2568 let span; 2569 let t2; 2570 let t3; 2571 let button1_aria_label_value; 2572 let t4; 2573 let div1; 2574 let button2; 2575 let backward; 2576 let button2_aria_label_value; 2577 let t5; 2578 let button3; 2579 let current_block_type_index; 2580 let if_block1; 2581 let button3_aria_label_value; 2582 let t6; 2583 let button4; 2584 let forward; 2585 let button4_aria_label_value; 2586 let t7; 2587 let div2; 2588 let t8; 2589 let current; 2590 let mounted; 2591 let dispose; 2592 2593 volumelevels = new VolumeLevels({ 2594 props: { currentVolume: /*currentVolume*/ ctx[11] } 2595 }); 2596 2597 let if_block0 = /*show_volume_slider*/ ctx[1] && create_if_block_4$1(ctx); 2598 backward = new Backward({}); 2599 const if_block_creators = [create_if_block_3$3, create_else_block_1$1]; 2600 const if_blocks = []; 2601 2602 function select_block_type(ctx, dirty) { 2603 if (/*playing*/ ctx[5]) return 0; 2604 return 1; 2605 } 2606 2607 current_block_type_index = select_block_type(ctx); 2608 if_block1 = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 2609 forward = new Forward({}); 2610 let if_block2 = /*showRedo*/ ctx[6] && /*mode*/ ctx[0] === "" && create_if_block_2$4(ctx); 2611 let if_block3 = /*interactive*/ ctx[7] && create_if_block$7(ctx); 2612 2613 return { 2614 c() { 2615 div3 = element$5("div"); 2616 div0 = element$5("div"); 2617 button0 = element$5("button"); 2618 create_component$6(volumelevels.$$.fragment); 2619 t0 = space$7(); 2620 if (if_block0) if_block0.c(); 2621 t1 = space$7(); 2622 button1 = element$5("button"); 2623 span = element$5("span"); 2624 t2 = text$4(/*playbackSpeed*/ ctx[10]); 2625 t3 = text$4("x"); 2626 t4 = space$7(); 2627 div1 = element$5("div"); 2628 button2 = element$5("button"); 2629 create_component$6(backward.$$.fragment); 2630 t5 = space$7(); 2631 button3 = element$5("button"); 2632 if_block1.c(); 2633 t6 = space$7(); 2634 button4 = element$5("button"); 2635 create_component$6(forward.$$.fragment); 2636 t7 = space$7(); 2637 div2 = element$5("div"); 2638 if (if_block2) if_block2.c(); 2639 t8 = space$7(); 2640 if (if_block3) if_block3.c(); 2641 attr$5(button0, "class", "action icon volume svelte-t8ovdf"); 2642 attr$5(button0, "aria-label", "Adjust volume"); 2643 2644 set_style$1(button0, "color", /*show_volume_slider*/ ctx[1] 2645 ? "var(--color-accent)" 2646 : "var(--neutral-400)"); 2647 2648 attr$5(span, "class", "svelte-t8ovdf"); 2649 attr$5(button1, "class", "playback icon svelte-t8ovdf"); 2650 attr$5(button1, "aria-label", button1_aria_label_value = `Adjust playback speed to ${/*playbackSpeeds*/ ctx[12][(/*playbackSpeeds*/ ctx[12].indexOf(/*playbackSpeed*/ ctx[10]) + 1) % /*playbackSpeeds*/ ctx[12].length]}x`); 2651 toggle_class(button1, "hidden", /*show_volume_slider*/ ctx[1]); 2652 attr$5(div0, "class", "control-wrapper svelte-t8ovdf"); 2653 attr$5(button2, "class", "rewind icon svelte-t8ovdf"); 2654 attr$5(button2, "aria-label", button2_aria_label_value = `Skip backwards by ${getSkipRewindAmount(/*audioDuration*/ ctx[3], /*waveform_options*/ ctx[9].skip_length)} seconds`); 2655 attr$5(button3, "class", "play-pause-button icon svelte-t8ovdf"); 2656 2657 attr$5(button3, "aria-label", button3_aria_label_value = /*playing*/ ctx[5] 2658 ? /*i18n*/ ctx[4]("audio.pause") 2659 : /*i18n*/ ctx[4]("audio.play")); 2660 2661 attr$5(button4, "class", "skip icon svelte-t8ovdf"); 2662 attr$5(button4, "aria-label", button4_aria_label_value = "Skip forward by " + getSkipRewindAmount(/*audioDuration*/ ctx[3], /*waveform_options*/ ctx[9].skip_length) + " seconds"); 2663 attr$5(div1, "class", "play-pause-wrapper svelte-t8ovdf"); 2664 attr$5(div2, "class", "settings-wrapper svelte-t8ovdf"); 2665 attr$5(div3, "class", "controls svelte-t8ovdf");
2666 attr$5(div3, "data-testid", "waveform-controls"); 2667 }, 2668 m(target, anchor) { 2669 insert$7(target, div3, anchor); 2670 append$5(div3, div0); 2671 append$5(div0, button0); 2672 mount_component$6(volumelevels, button0, null); 2673 append$5(div0, t0); 2674 if (if_block0) if_block0.m(div0, null); 2675 append$5(div0, t1); 2676 append$5(div0, button1); 2677 append$5(button1, span); 2678 append$5(span, t2); 2679 append$5(span, t3); 2680 append$5(div3, t4); 2681 append$5(div3, div1); 2682 append$5(div1, button2); 2683 mount_component$6(backward, button2, null); 2684 append$5(div1, t5); 2685 append$5(div1, button3); 2686 if_blocks[current_block_type_index].m(button3, null); 2687 append$5(div1, t6); 2688 append$5(div1, button4); 2689 mount_component$6(forward, button4, null); 2690 append$5(div3, t7); 2691 append$5(div3, div2); 2692 if (if_block2) if_block2.m(div2, null); 2693 append$5(div2, t8); 2694 if (if_block3) if_block3.m(div2, null); 2695 current = true; 2696 2697 if (!mounted) { 2698 dispose = [ 2699 listen$2(button0, "click", /*click_handler*/ ctx[25]), 2700 listen$2(button1, "click", /*click_handler_1*/ ctx[28]), 2701 listen$2(button2, "click", /*click_handler_2*/ ctx[29]), 2702 listen$2(button3, "click", /*click_handler_3*/ ctx[30]), 2703 listen$2(button4, "click", /*click_handler_4*/ ctx[31]) 2704 ]; 2705 2706 mounted = true; 2707 } 2708 }, 2709 p(ctx, dirty) { 2710 const volumelevels_changes = {}; 2711 if (dirty[0] & /*currentVolume*/ 2048) volumelevels_changes.currentVolume = /*currentVolume*/ ctx[11]; 2712 volumelevels.$set(volumelevels_changes); 2713 2714 if (dirty[0] & /*show_volume_slider*/ 2) { 2715 set_style$1(button0, "color", /*show_volume_slider*/ ctx[1] 2716 ? "var(--color-accent)" 2717 : "var(--neutral-400)"); 2718 } 2719 2720 if (/*show_volume_slider*/ ctx[1]) { 2721 if (if_block0) { 2722 if_block0.p(ctx, dirty); 2723 2724 if (dirty[0] & /*show_volume_slider*/ 2) { 2725 transition_in$6(if_block0, 1); 2726 } 2727 } else { 2728 if_block0 = create_if_block_4$1(ctx); 2729 if_block0.c(); 2730 transition_in$6(if_block0, 1); 2731 if_block0.m(div0, t1); 2732 } 2733 } else if (if_block0) { 2734 group_outros$5(); 2735 2736 transition_out$6(if_block0, 1, 1, () => { 2737 if_block0 = null; 2738 }); 2739 2740 check_outros$5(); 2741 } 2742 2743 if (!current || dirty[0] & /*playbackSpeed*/ 1024) set_data$4(t2, /*playbackSpeed*/ ctx[10]); 2744 2745 if (!current || dirty[0] & /*playbackSpeed*/ 1024 && button1_aria_label_value !== (button1_aria_label_value = `Adjust playback speed to ${/*playbackSpeeds*/ ctx[12][(/*playbackSpeeds*/ ctx[12].indexOf(/*playbackSpeed*/ ctx[10]) + 1) % /*playbackSpeeds*/ ctx[12].length]}x`)) { 2746 attr$5(button1, "aria-label", button1_aria_label_value); 2747 } 2748 2749 if (!current || dirty[0] & /*show_volume_slider*/ 2) { 2750 toggle_class(button1, "hidden", /*show_volume_slider*/ ctx[1]); 2751 } 2752 2753 if (!current || dirty[0] & /*audioDuration, waveform_options*/ 520 && button2_aria_label_value !== (button2_aria_label_value = `Skip backwards by ${getSkipRewindAmount(/*audioDuration*/ ctx[3], /*waveform_options*/ ctx[9].skip_length)} seconds`)) { 2754 attr$5(button2, "aria-label", button2_aria_label_value); 2755 } 2756 2757 let previous_block_index = current_block_type_index; 2758 current_block_type_index = select_block_type(ctx); 2759 2760 if (current_block_type_index !== previous_block_index) { 2761 group_outros$5(); 2762 2763 transition_out$6(if_blocks[previous_block_index], 1, 1, () => { 2764 if_blocks[previous_block_index] = null; 2765 }); 2766 2767 check_outros$5(); 2768 if_block1 = if_blocks[current_block_type_index]; 2769 2770 if (!if_block1) { 2771 if_block1 = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 2772 if_block1.c(); 2773 } 2774 2775 transition_in$6(if_block1, 1); 2776 if_block1.m(button3, null); 2777 } 2778 2779 if (!current || dirty[0] & /*playing, i18n*/ 48 && button3_aria_label_value !== (button3_aria_label_value = /*playing*/ ctx[5] 2780 ? /*i18n*/ ctx[4]("audio.pause") 2781 : /*i18n*/ ctx[4]("audio.play"))) { 2782 attr$5(button3, "aria-label", button3_aria_label_value); 2783 } 2784 2785 if (!current || dirty[0] & /*audioDuration, waveform_options*/ 520 && button4_aria_label_value !== (button4_aria_label_value = "Skip forward by " + getSkipRewindAmount(/*audioDuration*/ ctx[3], /*waveform_options*/ ctx[9].skip_length) + " seconds")) { 2786 attr$5(button4, "aria-label", button4_aria_label_value); 2787 } 2788 2789 if (/*showRedo*/ ctx[6] && /*mode*/ ctx[0] === "") { 2790 if (if_block2) { 2791 if_block2.p(ctx, dirty); 2792
2793 if (dirty[0] & /*showRedo, mode*/ 65) { 2794 transition_in$6(if_block2, 1); 2795 } 2796 } else { 2797 if_block2 = create_if_block_2$4(ctx); 2798 if_block2.c(); 2799 transition_in$6(if_block2, 1); 2800 if_block2.m(div2, t8); 2801 } 2802 } else if (if_block2) { 2803 group_outros$5(); 2804 2805 transition_out$6(if_block2, 1, 1, () => { 2806 if_block2 = null; 2807 }); 2808 2809 check_outros$5(); 2810 } 2811 2812 if (/*interactive*/ ctx[7]) { 2813 if (if_block3) { 2814 if_block3.p(ctx, dirty); 2815 2816 if (dirty[0] & /*interactive*/ 128) { 2817 transition_in$6(if_block3, 1); 2818 } 2819 } else { 2820 if_block3 = create_if_block$7(ctx); 2821 if_block3.c(); 2822 transition_in$6(if_block3, 1); 2823 if_block3.m(div2, null); 2824 } 2825 } else if (if_block3) { 2826 group_outros$5(); 2827 2828 transition_out$6(if_block3, 1, 1, () => { 2829 if_block3 = null; 2830 }); 2831 2832 check_outros$5(); 2833 } 2834 }, 2835 i(local) { 2836 if (current) return; 2837 transition_in$6(volumelevels.$$.fragment, local); 2838 transition_in$6(if_block0); 2839 transition_in$6(backward.$$.fragment, local); 2840 transition_in$6(if_block1); 2841 transition_in$6(forward.$$.fragment, local); 2842 transition_in$6(if_block2); 2843 transition_in$6(if_block3); 2844 current = true; 2845 }, 2846 o(local) { 2847 transition_out$6(volumelevels.$$.fragment, local); 2848 transition_out$6(if_block0); 2849 transition_out$6(backward.$$.fragment, local); 2850 transition_out$6(if_block1); 2851 transition_out$6(forward.$$.fragment, local); 2852 transition_out$6(if_block2); 2853 transition_out$6(if_block3); 2854 current = false; 2855 }, 2856 d(detaching) { 2857 if (detaching) { 2858 detach$7(div3); 2859 } 2860 2861 destroy_component$6(volumelevels); 2862 if (if_block0) if_block0.d(); 2863 destroy_component$6(backward); 2864 if_blocks[current_block_type_index].d(); 2865 destroy_component$6(forward); 2866 if (if_block2) if_block2.d(); 2867 if (if_block3) if_block3.d(); 2868 mounted = false; 2869 run_all$1(dispose); 2870 } 2871 }; 2872} 2873 2874function instance$7($$self, $$props, $$invalidate) { 2875 let { waveform } = $$props; 2876 let { audioDuration } = $$props; 2877 let { i18n } = $$props; 2878 let { playing } = $$props; 2879 let { showRedo = false } = $$props; 2880 let { interactive = false } = $$props; 2881 let { handle_trim_audio } = $$props; 2882 let { mode = "" } = $$props; 2883 let { container } = $$props; 2884 let { handle_reset_value } = $$props; 2885 let { waveform_options = {} } = $$props; 2886 let { trim_region_settings = {} } = $$props; 2887 let { show_volume_slider = false } = $$props; 2888 let { trimDuration = 0 } = $$props; 2889 let playbackSpeeds = [0.5, 1, 1.5, 2]; 2890 let playbackSpeed = playbackSpeeds[1]; 2891 let trimRegion; 2892 let activeRegion = null; 2893 let leftRegionHandle; 2894 let rightRegionHandle; 2895 let activeHandle = ""; 2896 let currentVolume = 1; 2897 2898 const addTrimRegion = () => { 2899 $$invalidate(21, activeRegion = trimRegion.addRegion({ 2900 start: audioDuration / 4, 2901 end: audioDuration / 2, 2902 ...trim_region_settings 2903 })); 2904 2905 $$invalidate(16, trimDuration = activeRegion.end - activeRegion.start); 2906 }; 2907 2908 const trimAudio = () => { 2909 if (waveform && trimRegion) { 2910 if (activeRegion) { 2911 const start = activeRegion.start; 2912 const end = activeRegion.end; 2913 handle_trim_audio(start, end); 2914 $$invalidate(0, mode = ""); 2915 $$invalidate(21, activeRegion = null); 2916 } 2917 } 2918 }; 2919 2920 const clearRegions = () => { 2921 trimRegion?.getRegions().forEach(region => { 2922 region.remove(); 2923 }); 2924 2925 trimRegion?.clearRegions(); 2926 }; 2927 2928 const toggleTrimmingMode = () => { 2929 clearRegions(); 2930 2931 if (mode === "edit") { 2932 $$invalidate(0, mode = ""); 2933 } else { 2934 $$invalidate(0, mode = "edit"); 2935 addTrimRegion(); 2936 } 2937 }; 2938 2939 const adjustRegionHandles = (handle, key) => { 2940 let newStart; 2941 let newEnd; 2942 if (!activeRegion) return; 2943 2944 if (handle === "left") { 2945 if (key === "ArrowLeft") { 2946 newStart = activeRegion.start - 0.05; 2947 newEnd = activeRegion.end; 2948 } else { 2949 newStart = activeRegion.start + 0.05; 2950 newEnd = activeRegion.end; 2951 } 2952 } else { 2953 if (key === "ArrowLeft") { 2954 newStart = activeRegion.start; 2955 newEnd = activeRegion.end - 0.05; 2956 } else { 2957 newStart = activeRegion.start; 2958 newEnd = activeRegion.end + 0.05; 2959 } 2960 } 2961 2962 activeRegion.setOptions({ start: newStart, end: newEnd });
2963 $$invalidate(16, trimDuration = activeRegion.end - activeRegion.start); 2964 }; 2965 2966 const click_handler = () => $$invalidate(1, show_volume_slider = !show_volume_slider); 2967 2968 function volumecontrol_currentVolume_binding(value) { 2969 currentVolume = value; 2970 $$invalidate(11, currentVolume); 2971 } 2972 2973 function volumecontrol_show_volume_slider_binding(value) { 2974 show_volume_slider = value; 2975 $$invalidate(1, show_volume_slider); 2976 } 2977 2978 const click_handler_1 = () => { 2979 $$invalidate(10, playbackSpeed = playbackSpeeds[(playbackSpeeds.indexOf(playbackSpeed) + 1) % playbackSpeeds.length]); 2980 waveform.setPlaybackRate(playbackSpeed); 2981 }; 2982 2983 const click_handler_2 = () => waveform.skip(getSkipRewindAmount(audioDuration, waveform_options.skip_length) * -1); 2984 const click_handler_3 = () => waveform.playPause(); 2985 const click_handler_4 = () => waveform.skip(getSkipRewindAmount(audioDuration, waveform_options.skip_length)); 2986 2987 const click_handler_5 = () => { 2988 handle_reset_value(); 2989 clearRegions(); 2990 $$invalidate(0, mode = ""); 2991 }; 2992 2993 $$self.$$set = $$props => {
2994 if ('waveform' in $$props) $$invalidate(2, waveform = $$props.waveform); 2995 if ('audioDuration' in $$props) $$invalidate(3, audioDuration = $$props.audioDuration); 2996 if ('i18n' in $$props) $$invalidate(4, i18n = $$props.i18n); 2997 if ('playing' in $$props) $$invalidate(5, playing = $$props.playing); 2998 if ('showRedo' in $$props) $$invalidate(6, showRedo = $$props.showRedo); 2999 if ('interactive' in $$props) $$invalidate(7, interactive = $$props.interactive); 3000 if ('handle_trim_audio' in $$props) $$invalidate(17, handle_trim_audio = $$props.handle_trim_audio); 3001 if ('mode' in $$props) $$invalidate(0, mode = $$props.mode); 3002 if ('container' in $$props) $$invalidate(18, container = $$props.container); 3003 if ('handle_reset_value' in $$props) $$invalidate(8, handle_reset_value = $$props.handle_reset_value); 3004 if ('waveform_options' in $$props) $$invalidate(9, waveform_options = $$props.waveform_options); 3005 if ('trim_region_settings' in $$props) $$invalidate(19, trim_region_settings = $$props.trim_region_settings); 3006 if ('show_volume_slider' in $$props) $$invali
3006date(1, show_volume_slider = $$props.show_volume_slider); 3007 if ('trimDuration' in $$props) $$invalidate(16, trimDuration = $$props.trimDuration); 3008 }; 3009 3010 $$self.$$.update = () => { 3011 if ($$self.$$.dirty[0] & /*waveform*/ 4) { 3012 $$invalidate(20, trimRegion = waveform.registerPlugin(s$1.create())); 3013 } 3014 3015 if ($$self.$$.dirty[0] & /*trimRegion*/ 1048576) { 3016 trimRegion?.on("region-out", region => { 3017 region.play(); 3018 }); 3019 } 3020 3021 if ($$self.$$.dirty[0] & /*trimRegion*/ 1048576) { 3022 trimRegion?.on("region-updated", region => { 3023 $$invalidate(16, trimDuration = region.end - region.start); 3024 }); 3025 } 3026 3027 if ($$self.$$.dirty[0] & /*trimRegion*/ 1048576) { 3028 trimRegion?.on("region-clicked", (region, e) => { 3029 e.stopPropagation(); // prevent triggering a click on the waveform 3030 $$invalidate(21, activeRegion = region); 3031 region.play(); 3032 }); 3033 } 3034 3035 if ($$self.$$.dirty[0] & /*activeRegion, container, leftRegionHandle, rightRegionHandle, trimRegion*/ 15990784) { 3036 if (activeRegion) { 3037 const shadowRoot = container.children[0].shadowRoot; 3038 $$invalidate(23, rightRegionHandle = shadowRoot.querySelector('[data-resize="right"]')); 3039 $$invalidate(22, leftRegionHandle = shadowRoot.querySelector('[data-resize="left"]')); 3040 3041 if (leftRegionHandle && rightRegionHandle) { 3042 leftRegionHandle.setAttribute("role", "button"); 3043 rightRegionHandle.setAttribute("role", "button"); 3044 leftRegionHandle?.setAttribute("aria-label", "Drag to adjust start time"); 3045 rightRegionHandle?.setAttribute("aria-label", "Drag to adjust end time"); 3046 leftRegionHandle?.setAttribute("tabindex", "0"); 3047 rightRegionHandle?.setAttribute("tabindex", "0"); 3048 3049 leftRegionHandle.addEventListener("focus", () => {
3050 if (trimRegion) $$invalidate(24, activeHandle = "left"); 3051 }); 3052 3053 rightRegionHandle.addEventListener("focus", () => { 3054 if (trimRegion) $$invalidate(24, activeHandle = "right"); 3055 }); 3056 } 3057 } 3058 } 3059 3060 if ($$self.$$.dirty[0] & /*trimRegion, activeHandle*/ 17825792) { 3061 trimRegion && window.addEventListener("keydown", e => { 3062 if (e.key === "ArrowLeft") { 3063 adjustRegionHandles(activeHandle, "ArrowLeft"); 3064 } else if (e.key === "ArrowRight") { 3065 adjustRegionHandles(activeHandle, "ArrowRight"); 3066 } 3067 }); 3068 } 3069 }; 3070 3071 return [ 3072 mode, 3073 show_volume_slider, 3074 waveform, 3075 audioDuration, 3076 i18n, 3077 playing, 3078 showRedo, 3079 interactive, 3080 handle_reset_value, 3081 waveform_options, 3082 playbackSpeed, 3083 currentVolume, 3084 playbackSpeeds, 3085 trimAudio, 3086 clearRegions, 3087 toggleTrimmingMode, 3088 trimDuration, 3089 handle_trim_audio, 3090 container, 3091 trim_region_settings, 3092 trimRegion, 3093 activeRegion, 3094 leftRegionHandle, 3095 rightRegionHandle, 3096 activeHandle, 3097 click_handler, 3098 volumecontrol_currentVolume_binding, 3099 volumecontrol_show_volume_slider_binding, 3100 click_handler_1, 3101 click_handler_2, 3102 click_handler_3, 3103 click_handler_4, 3104 click_handler_5 3105 ]; 3106} 3107 3108class WaveformControls extends SvelteComponent$7 { 3109 constructor(options) { 3110 super(); 3111 3112 init$7( 3113 this, 3114 options, 3115 instance$7, 3116 create_fragment$7, 3117 safe_not_equal$7, 3118 { 3119 waveform: 2, 3120 audioDuration: 3, 3121 i18n: 4, 3122 playing: 5, 3123 showRedo: 6, 3124 interactive: 7, 3125 handle_trim_audio: 17, 3126 mode: 0, 3127 container: 18, 3128 handle_reset_value: 8, 3129 waveform_options: 9, 3130 trim_region_settings: 19, 3131 show_volume_slider: 1, 3132 trimDuration: 16 3133 }, 3134 null, 3135 [-1, -1] 3136 ); 3137 } 3138} 3139 3140const AudioPlayer_svelte_svelte_type_style_lang = ''; 3141 3142/* home/runner/work/gradio/gradio/js/audio/player/AudioPlayer.svelte generated by Svelte v4.2.2 */ 3143const { 3144 SvelteComponent: SvelteComponent$6, 3145 add_flush_callback: add_flush_callback$3, 3146 append: append$4, 3147 attr: attr$4, 3148 bind: bind$3, 3149 binding_callbacks: binding_callbacks$4, 3150 check_outros: check_outros$4, 3151 create_component: create_component$5, 3152 destroy_component: destroy_component$5, 3153 detach: detach$6, 3154 element: element$4, 3155 empty: empty$4, 3156 group_outros: group_outros$4, 3157 init: init$6, 3158 insert: insert$6, 3159 mount_component: mount_component$5, 3160 noop: noop$2, 3161 safe_not_equal: safe_not_equal$6, 3162 set_data: set_data$3, 3163 space: space$6, 3164 src_url_equal, 3165 text: text$3, 3166 transition_in: transition_in$5, 3167 transition_out: transition_out$5 3168} = window.__gradio__svelte__internal; 3169const { onMount: onMount$2 } = window.__gradio__svelte__internal;const { createEventDispatcher: createEventDispatcher$4 } = window.__gradio__svelte__internal; 3170function create_else_block$6(ctx) { 3171 let div4; 3172 let div1; 3173 let div0; 3174 let t0; 3175 let div3; 3176 let time0; 3177 let t2; 3178 let div2; 3179 let t3; 3180 let time1; 3181 let t5; 3182 let div4_data_testid_value; 3183 let current; 3184 let if_block0 = /*mode*/ ctx[0] === "edit" && /*trimDuration*/ ctx[15] > 0 && create_if_block_3$2(ctx); 3185 let if_block1 = /*waveform*/ ctx[10] && create_if_block_2$3(ctx); 3186 3187 return { 3188 c() { 3189 div4 = element$4("div"); 3190 div1 = element$4("div"); 3191 div0 = element$4("div"); 3192 t0 = space$6(); 3193 div3 = element$4("div"); 3194 time0 = element$4("time"); 3195 time0.textContent = "0:00"; 3196 t2 = space$6(); 3197 div2 = element$4("div"); 3198 if (if_block0) if_block0.c(); 3199 t3 = space$6(); 3200 time1 = element$4("time"); 3201 time1.textContent = "0:00"; 3202 t5 = space$6(); 3203 if (if_block1) if_block1.c(); 3204 attr$4(div0, "id", "waveform"); 3205 attr$4(div0, "class", "svelte-q2r1hx"); 3206 attr$4(div1, "class", "waveform-container svelte-q2r1hx"); 3207 attr$4(time0, "id", "time"); 3208 attr$4(time0, "class", "svelte-q2r1hx"); 3209 attr$4(time1, "id", "duration"); 3210 attr$4(time1, "class", "svelte-q2r1hx"); 3211 attr$4(div3, "class", "timestamps svelte-q2r1hx"); 3212 attr$4(div4, "class", "component-wrapper svelte-q2r1hx"); 3213 3214 attr$4(div4, "data-testid", div4_data_testid_value = /*label*/ ctx[2] 3215 ? "waveform-" + /*label*/ ctx[2] 3216 : "unlabelled-audio"); 3217 }, 3218 m(target, anchor) { 3219 insert$6(target, div4, anchor); 3220 append$4(div4, div1); 3221 append$4(div1, div0); 3222 /*div0_binding*/ ctx[21](div0); 3223 append$4(div4, t0); 3224 append$4(div4, div3);
3225 append$4(div3, time0); 3226 /*time0_binding*/ ctx[22](time0); 3227 append$4(div3, t2); 3228 append$4(div3, div2); 3229 if (if_block0) if_block0.m(div2, null); 3230 append$4(div2, t3); 3231 append$4(div2, time1); 3232 /*time1_binding*/ ctx[23](time1); 3233 append$4(div4, t5); 3234 if (if_block1) if_block1.m(div4, null); 3235 current = true; 3236 }, 3237 p(ctx, dirty) { 3238 if (/*mode*/ ctx[0] === "edit" && /*trimDuration*/ ctx[15] > 0) { 3239 if (if_block0) { 3240 if_block0.p(ctx, dirty); 3241 } else { 3242 if_block0 = create_if_block_3$2(ctx); 3243 if_block0.c(); 3244 if_block0.m(div2, t3); 3245 } 3246 } else if (if_block0) { 3247 if_block0.d(1); 3248 if_block0 = null; 3249 } 3250 3251 if (/*waveform*/ ctx[10]) { 3252 if (if_block1) { 3253 if_block1.p(ctx, dirty); 3254 3255 if (dirty & /*waveform*/ 1024) { 3256 transition_in$5(if_block1, 1); 3257 } 3258 } else { 3259 if_block1 = create_if_block_2$3(ctx); 3260 if_block1.c(); 3261 transition_in$5(if_block1, 1); 3262 if_block1.m(div4, null); 3263 } 3264 } else if (if_block1) { 3265 group_outros$4(); 3266 3267 transition_out$5(if_block1, 1, 1, () => { 3268 if_block1 = null; 3269 }); 3270 3271 check_outros$4(); 3272 } 3273 3274 if (!current || dirty & /*label*/ 4 && div4_data_testid_value !== (div4_data_testid_value = /*label*/ ctx[2] 3275 ? "waveform-" + /*label*/ ctx[2] 3276 : "unlabelled-audio")) { 3277 attr$4(div4, "data-testid", div4_data_testid_value); 3278 } 3279 }, 3280 i(local) { 3281 if (current) return; 3282 transition_in$5(if_block1); 3283 current = true; 3284 }, 3285 o(local) { 3286 transition_out$5(if_block1); 3287 current = false; 3288 }, 3289 d(detaching) { 3290 if (detaching) { 3291 detach$6(div4); 3292 } 3293 3294 /*div0_binding*/ ctx[21](null); 3295 /*time0_binding*/ ctx[22](null); 3296 if (if_block0) if_block0.d(); 3297 /*time1_binding*/ ctx[23](null); 3298 if (if_block1) if_block1.d(); 3299 } 3300 }; 3301} 3302 3303// (111:26) 3304function create_if_block_1$3(ctx) { 3305 let audio; 3306 let audio_src_value; 3307 let audio_autoplay_value; 3308 3309 return { 3310 c() { 3311 audio = element$4("audio"); 3312 attr$4(audio, "class", "standard-player svelte-q2r1hx"); 3313 if (!src_url_equal(audio.src, audio_src_value = /*value*/ ctx[1].url)) attr$4(audio, "src", audio_src_value); 3314 audio.controls = true; 3315 audio.autoplay = audio_autoplay_value = /*waveform_settings*/ ctx[6].autoplay; 3316 }, 3317 m(target, anchor) { 3318 insert$6(target, audio, anchor); 3319 }, 3320 p(ctx, dirty) { 3321 if (dirty & /*value*/ 2 && !src_url_equal(audio.src, audio_src_value = /*value*/ ctx[1].url)) { 3322 attr$4(audio, "src", audio_src_value); 3323 } 3324 3325 if (dirty & /*waveform_settings*/ 64 && audio_autoplay_value !== (audio_autoplay_value = /*waveform_settings*/ ctx[6].autoplay)) { 3326 audio.autoplay = audio_autoplay_value; 3327 } 3328 }, 3329 i: noop$2, 3330 o: noop$2, 3331 d(detaching) { 3332 if (detaching) { 3333 detach$6(audio); 3334 } 3335 } 3336 }; 3337} 3338 3339// (107:0) {#if value === null} 3340function create_if_block$6(ctx) { 3341 let empty_1; 3342 let current; 3343 3344 empty_1 = new Empty({ 3345 props: { 3346 size: "small", 3347 $$slots: { default: [create_default_slot$3] }, 3348 $$scope: { ctx } 3349 } 3350 }); 3351 3352 return { 3353 c() { 3354 create_component$5(empty_1.$$.fragment); 3355 }, 3356 m(target, anchor) { 3357 mount_component$5(empty_1, target, anchor); 3358 current = true; 3359 }, 3360 p(ctx, dirty) { 3361 const empty_1_changes = {}; 3362 3363 if (dirty & /*$$scope*/ 1073741824) { 3364 empty_1_changes.$$scope = { dirty, ctx }; 3365 } 3366 3367 empty_1.$set(empty_1_changes); 3368 }, 3369 i(local) { 3370 if (current) return; 3371 transition_in$5(empty_1.$$.fragment, local); 3372 current = true; 3373 }, 3374 o(local) { 3375 transition_out$5(empty_1.$$.fragment, local); 3376 current = false; 3377 }, 3378 d(detaching) { 3379 destroy_component$5(empty_1, detaching); 3380 } 3381 }; 3382} 3383 3384// (130:4) {#if mode === "edit" && trimDuration > 0} 3385function create_if_block_3$2(ctx) { 3386 let time; 3387 let t_value = /*formatTime*/ ctx[17](/*trimDuration*/ ctx[15]) + ""; 3388 let t; 3389 3390 return { 3391 c() { 3392 time = element$4("time"); 3393 t = text$3(t_value); 3394 attr$4(time, "id", "trim-duration"); 3395 attr$4(time, "class", "svelte-q2r1hx"); 3396 }, 3397 m(target, anchor) { 3398 insert$6(target, time, anchor); 3399 append$4(time, t); 3400 }, 3401 p(ctx, dirty) { 3402 if (dirty & /*trimDuration*/ 32768 && t_value !== (t_value = /*formatTime*/ ctx[17](/*trimDuration*/ ctx[15]) + "")) set_data$3(t, t_value); 3403 }, 3404 d(detaching) { 3405 if (detaching) { 3406 detach$6(time); 3407 } 3408 } 3409 }; 3410} 3411 3412// (137:2) {#if waveform} 3413function create_if_block_2$3(ctx) { 3414 let waveformcontrols; 3415 let updating_mode; 3416 let updating_trimDuration; 3417 let updating_show_volume_slider; 3418 let current; 3419 3420 function waveformcontrols_mode_binding(value) { 3421 /*waveformcontrols_mode_binding*/ ctx[24](value); 3422 } 3423 3424 function waveformcontrols_trimDuration_binding(value) { 3425 /*waveformcontrols_trimDuration_binding*/ ctx[25](value); 3426 } 3427 3428 function waveformcontrols_show_volume_slider_binding(value) { 3429 /*waveformcontrols_show_volume_slider_binding*/ ctx[26](value); 3430 } 3431 3432 let waveformcontrols_props = { 3433 container: /*container*/ ctx[9], 3434 waveform: /*waveform*/ ctx[10], 3435 playing: /*playing*/ ctx[13], 3436 audioDuration: /*audioDuration*/ ctx[14], 3437 i18n: /*i18n*/ ctx[3], 3438 interactive: /*interactive*/ ctx[4], 3439 handle_trim_audio: /*handle_trim_audio*/ ctx[18], 3440 showRedo: /*interactive*/ ctx[4], 3441 handle_reset_value: /*handle_reset_value*/ ctx[8], 3442 waveform_options: /*waveform_options*/ ctx[7], 3443 trim_region_settings: /*trim_region_settings*/ ctx[5] 3444 }; 3445 3446 if (/*mode*/ ctx[0] !== void 0) { 3447 waveformcontrols_props.mode = /*mode*/ ctx[0]; 3448 } 3449 3450 if (/*trimDuration*/ ctx[15] !== void 0) { 3451 waveformcontrols_props.trimDuration = /*trimDuration*/ ctx[15]; 3452 } 3453 3454 if (/*show_volume_slider*/ ctx[16] !== void 0) { 3455 waveformcontrols_props.show_volume_slider = /*show_volume_slider*/ ctx[16]; 3456 } 3457 3458 waveformcontrols = new WaveformControls({ props: waveformcontrols_props }); 3459 binding_callbacks$4.push(() => bind$3(waveformcontrols, 'mode', waveformcontrols_mode_binding)); 3460 binding_callbacks$4.push(() => bind$3(waveformcontrols, 'trimDuration', waveformcontrols_trimDuration_binding)); 3461 binding_callbacks$4.push(() => bind$3(waveformcontrols, 'show_volume_slider', waveformcontrols_show_volume_slider_binding)); 3462 3463 return { 3464 c() { 3465 create_component$5(waveformcontrols.$$.fragment); 3466 }, 3467 m(target, anchor) { 3468 mount_component$5(waveformcontrols, target, anchor); 3469 current = true; 3470 }, 3471 p(ctx, dirty) { 3472 const waveformcontrols_changes = {};
3473 if (dirty & /*container*/ 512) waveformcontrols_changes.container = /*container*/ ctx[9]; 3474 if (dirty & /*waveform*/ 1024) waveformcontrols_changes.waveform = /*waveform*/ ctx[10]; 3475 if (dirty & /*playing*/ 8192) waveformcontrols_changes.playing = /*playing*/ ctx[13]; 3476 if (dirty & /*audioDuration*/ 16384) waveformcontrols_changes.audioDuration = /*audioDuration*/ ctx[14]; 3477 if (dirty & /*i18n*/ 8) waveformcontrols_changes.i18n = /*i18n*/ ctx[3]; 3478 if (dirty & /*interactive*/ 16) waveformcontrols_changes.interactive = /*interactive*/ ctx[4]; 3479 if (dirty & /*interactive*/ 16) waveformcontrols_changes.showRedo = /*interactive*/ ctx[4]; 3480 if (dirty & /*handle_reset_value*/ 256) waveformcontrols_changes.handle_reset_value = /*handle_reset_value*/ ctx[8]; 3481 if (dirty & /*waveform_options*/ 128) waveformcontrols_changes.waveform_options = /*waveform_options*/ ctx[7]; 3482 if (dirty & /*trim_region_settings*/ 32) waveformcontrols_changes.trim_region_settings = /*trim_region_settings*/ ctx[5]; 3483 3484 if (!updating_mode && dirty & /*mode*/ 1) { 3485 updating_mode = true; 3486 waveformcontrols_changes.mode = /*mode*/ ctx[0]; 3487 add_flush_callback$3(() => updating_mode = false); 3488 } 3489 3490 if (!updating_trimDuration && dirty & /*trimDuration*/ 32768) { 3491 updating_trimDuration = true; 3492 waveformcontrols_changes.trimDuration = /*trimDuration*/ ctx[15]; 3493 add_flush_callback$3(() => updating_trimDuration = false); 3494 } 3495 3496 if (!updating_show_volume_slider && dirty & /*show_volume_slider*/ 65536) { 3497 updating_show_volume_slider = true; 3498 waveformcontrols_changes.show_volume_slider = /*show_volume_slider*/ ctx[16]; 3499 add_flush_callback$3(() => updating_show_volume_slider = false); 3500 } 3501 3502 waveformcontrols.$set(waveformcontrols_changes); 3503 }, 3504 i(local) { 3505 if (current) return; 3506 transition_in$5(waveformcontrols.$$.fragment, local); 3507 current = true; 3508 }, 3509 o(local) { 3510 transition_out$5(waveformcontrols.$$.fragment, local); 3511 current = false; 3512 }, 3513 d(detaching) { 3514 destroy_component$5(waveformcontrols, detaching); 3515 } 3516 }; 3517} 3518 3519// (108:1) <Empty size="small"> 3520function create_default_slot$3(ctx) { 3521 let music; 3522 let current; 3523 music = new Music({}); 3524 3525 return { 3526 c() { 3527 create_component$5(music.$$.fragment); 3528 }, 3529 m(target, anchor) { 3530 mount_component$5(music, target, anchor); 3531 current = true; 3532 }, 3533 i(local) { 3534 if (current) return; 3535 transition_in$5(music.$$.fragment, local); 3536 current = true; 3537 }, 3538 o(local) { 3539 transition_out$5(music.$$.fragment, local); 3540 current = false; 3541 }, 3542 d(detaching) { 3543 destroy_component$5(music, detaching); 3544 } 3545 }; 3546} 3547 3548function create_fragment$6(ctx) { 3549 let current_block_type_index; 3550 let if_block; 3551 let if_block_anchor; 3552 let current; 3553 const if_block_creators = [create_if_block$6, create_if_block_1$3, create_else_block$6]; 3554 const if_blocks = []; 3555 3556 function select_block_type(ctx, dirty) { 3557 if (/*value*/ ctx[1] === null) return 0; 3558 if (/*value*/ ctx[1].is_stream) return 1; 3559 return 2; 3560 } 3561 3562 current_block_type_index = select_block_type(ctx); 3563 if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 3564 3565 return { 3566 c() { 3567 if_block.c(); 3568 if_block_anchor = empty$4(); 3569 }, 3570 m(target, anchor) { 3571 if_blocks[current_block_type_index].m(target, anchor); 3572 insert$6(target, if_block_anchor, anchor); 3573 current = true; 3574 }, 3575 p(ctx, [dirty]) { 3576 let previous_block_index = current_block_type_index; 3577 current_block_type_index = select_block_type(ctx); 3578 3579 if (current_block_type_index === previous_block_index) { 3580 if_blocks[current_block_type_index].p(ctx, dirty); 3581 } else { 3582 group_outros$4(); 3583 3584 transition_out$5(if_blocks[previous_block_index], 1, 1, () => { 3585 if_blocks[previous_block_index] = null; 3586 }); 3587 3588 check_outros$4(); 3589 if_block = if_blocks[current_block_type_index]; 3590 3591 if (!if_block) { 3592 if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 3593 if_block.c(); 3594 } else { 3595 if_block.p(ctx, dirty); 3596 } 3597 3598 transition_in$5(if_block, 1); 3599 if_block.m(if_block_anchor.parentNode, if_block_anchor); 3600 } 3601 }, 3602 i(local) { 3603 if (current) return; 3604 transition_in$5(if_block); 3605 current = true; 3606 }, 3607 o(local) { 3608 transition_out$5(if_block); 3609 current = false;
3610 }, 3611 d(detaching) { 3612 if (detaching) { 3613 detach$6(if_block_anchor); 3614 } 3615 3616 if_blocks[current_block_type_index].d(detaching); 3617 } 3618 }; 3619} 3620 3621function instance$6($$self, $$props, $$invalidate) { 3622 let url; 3623 let { value = null } = $$props; 3624 let { label } = $$props; 3625 let { i18n } = $$props; 3626 let { dispatch_blob = () => Promise.resolve() } = $$props; 3627 let { interactive = false } = $$props; 3628 let { trim_region_settings = {} } = $$props; 3629 let { waveform_settings } = $$props; 3630 let { waveform_options } = $$props; 3631 let { mode = "" } = $$props; 3632 3633 let { handle_reset_value = () => { 3634 3635 } } = $$props; 3636 3637 let container; 3638 let waveform; 3639 let playing = false; 3640 let timeRef; 3641 let durationRef; 3642 let audioDuration; 3643 let trimDuration = 0; 3644 let show_volume_slider = false; 3645 const dispatch = createEventDispatcher$4(); 3646 3647 const formatTime = seconds => { 3648 const minutes = Math.floor(seconds / 60); 3649 const secondsRemainder = Math.round(seconds) % 60; 3650 const paddedSeconds = `0${secondsRemainder}`.slice(-2); 3651 return `${minutes}:${paddedSeconds}`; 3652 }; 3653 3654 const create_waveform = () => { 3655 $$invalidate(10, waveform = WaveSurfer.create({ 3656 container, 3657 url: value?.url, 3658 ...waveform_settings 3659 })); 3660 }; 3661 3662 const handle_trim_audio = async (start, end) => { 3663 $$invalidate(0, mode = ""); 3664 const decodedData = waveform?.getDecodedData(); 3665 3666 if (decodedData) await process_audio(decodedData, start, end).then(async trimmedBlob => { 3667 await dispatch_blob([trimmedBlob], "change"); 3668 waveform?.destroy(); 3669 create_waveform(); 3670 }); 3671 3672 dispatch("edit"); 3673 }; 3674 3675 async function load_audio(data) { 3676 await resolve_wasm_src(data).then(resolved_src => { 3677 if (!resolved_src || value?.is_stream) return; 3678 return waveform?.load(resolved_src); 3679 }); 3680 } 3681 3682 onMount$2(() => { 3683 window.addEventListener("keydown", e => { 3684 if (!waveform || show_volume_slider) return; 3685 3686 if (e.key === "ArrowRight" && mode !== "edit") { 3687 skipAudio(waveform, 0.1); 3688 } else if (e.key === "ArrowLeft" && mode !== "edit") { 3689 skipAudio(waveform, -0.1); 3690 } 3691 }); 3692 }); 3693 3694 function div0_binding($$value) { 3695 binding_callbacks$4[$$value ? 'unshift' : 'push'](() => { 3696 container = $$value; 3697 ($$invalidate(9, container), $$invalidate(10, waveform)); 3698 }); 3699 } 3700 3701 function time0_binding($$value) { 3702 binding_callbacks$4[$$value ? 'unshift' : 'push'](() => { 3703 timeRef = $$value; 3704 ($$invalidate(11, timeRef), $$invalidate(10, waveform)); 3705 }); 3706 } 3707 3708 function time1_binding($$value) { 3709 binding_callbacks$4[$$value ? 'unshift' : 'push'](() => { 3710 durationRef = $$value; 3711 ($$invalidate(12, durationRef), $$invalidate(10, waveform)); 3712 }); 3713 } 3714 3715 function waveformcontrols_mode_binding(value) { 3716 mode = value; 3717 $$invalidate(0, mode); 3718 } 3719 3720 function waveformcontrols_trimDuration_binding(value) { 3721 trimDuration = value; 3722 $$invalidate(15, trimDuration); 3723 } 3724 3725 function waveformcontrols_show_volume_slider_binding(value) { 3726 show_volume_slider = value; 3727 $$invalidate(16, show_volume_slider); 3728 } 3729 3730 $$self.$$set = $$props => {
3731 if ('value' in $$props) $$invalidate(1, value = $$props.value); 3732 if ('label' in $$props) $$invalidate(2, label = $$props.label); 3733 if ('i18n' in $$props) $$invalidate(3, i18n = $$props.i18n); 3734 if ('dispatch_blob' in $$props) $$invalidate(19, dispatch_blob = $$props.dispatch_blob); 3735 if ('interactive' in $$props) $$invalidate(4, interactive = $$props.interactive); 3736 if ('trim_region_settings' in $$props) $$invalidate(5, trim_region_settings = $$props.trim_region_settings); 3737 if ('waveform_settings' in $$props) $$invalidate(6, waveform_settings = $$props.waveform_settings); 3738 if ('waveform_options' in $$props) $$invalidate(7, waveform_options = $$props.waveform_options); 3739 if ('mode' in $$props) $$invalidate(0, mode = $$props.mode); 3740 if ('handle_reset_value' in $$props) $$invalidate(8, handle_reset_value = $$props.handle_reset_value); 3741 }; 3742 3743 $$self.$$.update = () => { 3744 if ($$self.$$.dirty & /*value*/ 2) { 3745 $$invalidate(20, url = value?.url); 3746 } 3747 3748 if ($$self.$$.dirty & /*container, waveform*/ 1536) { 3749 if (container !== undefined) { 3750 if (waveform !== undefined) waveform.destroy(); 3751 $$invalidate(9, container.innerHTML = "", container); 3752 create_waveform(); 3753 $$invalidate(13, playing = false); 3754 } 3755 } 3756 3757 if ($$self.$$.dirty & /*waveform, durationRef*/ 5120) { 3758 waveform?.on("decode", duration => { 3759 $$invalidate(14, audioDuration = duration); 3760 durationRef && $$invalidate(12, durationRef.textContent = formatTime(duration), durationRef); 3761 }); 3762 } 3763 3764 if ($$self.$$.dirty & /*waveform, timeRef*/ 3072) { 3765 waveform?.on("timeupdate", currentTime => timeRef && $$invalidate(11, timeRef.textContent = formatTime(currentTime), timeRef)); 3766 } 3767 3768 if ($$self.$$.dirty & /*waveform, waveform_settings*/ 1088) { 3769 waveform?.on("ready", () => { 3770 if (!waveform_settings.autoplay) { 3771 waveform?.stop(); 3772 } else { 3773 waveform?.play(); 3774 } 3775 }); 3776 } 3777 3778 if ($$self.$$.dirty & /*waveform*/ 1024) { 3779 waveform?.on("finish", () => { 3780 $$invalidate(13, playing = false); 3781 dispatch("stop"); 3782 }); 3783 } 3784 3785 if ($$self.$$.dirty & /*waveform*/ 1024) { 3786 waveform?.on("pause", () => { 3787 $$invalidate(13, playing = false); 3788 dispatch("pause"); 3789 }); 3790 } 3791 3792 if ($$self.$$.dirty & /*waveform*/ 1024) { 3793 waveform?.on("play", () => { 3794 $$invalidate(13, playing = true); 3795 dispatch("play"); 3796 }); 3797 } 3798 3799 if ($$self.$$.dirty & /*url*/ 1048576) { 3800 url && load_audio(url); 3801 } 3802 }; 3803 3804 return [ 3805 mode, 3806 value, 3807 label, 3808 i18n, 3809 interactive, 3810 trim_region_settings, 3811 waveform_settings, 3812 waveform_options, 3813 handle_reset_value, 3814 container, 3815 waveform, 3816 timeRef, 3817 durationRef, 3818 playing, 3819 audioDuration, 3820 trimDuration, 3821 show_volume_slider, 3822 formatTime, 3823 handle_trim_audio, 3824 dispatch_blob, 3825 url, 3826 div0_binding, 3827 time0_binding, 3828 time1_binding, 3829 waveformcontrols_mode_binding, 3830 waveformcontrols_trimDuration_binding, 3831 waveformcontrols_show_volume_slider_binding 3832 ]; 3833} 3834 3835class AudioPlayer extends SvelteComponent$6 { 3836 constructor(options) { 3837 super(); 3838 3839 init$6(this, options, instance$6, create_fragment$6, safe_not_equal$6, { 3840 value: 1, 3841 label: 2, 3842 i18n: 3, 3843 dispatch_blob: 19, 3844 interactive: 4, 3845 trim_region_settings: 5, 3846 waveform_settings: 6, 3847 waveform_options: 7, 3848 mode: 0, 3849 handle_reset_value: 8 3850 }); 3851 } 3852} 3853 3854const AudioPlayer$1 = AudioPlayer; 3855 3856const StaticAudio_svelte_svelte_type_style_lang = ''; 3857 3858/* home/runner/work/gradio/gradio/js/audio/static/StaticAudio.svelte generated by Svelte v4.2.2 */ 3859const { 3860 SvelteComponent: SvelteComponent$5, 3861 append: append$3, 3862 attr: attr$3, 3863 bubble: bubble$1, 3864 check_outros: check_outros$3, 3865 create_component: create_component$4, 3866 destroy_component: destroy_component$4, 3867 detach: detach$5, 3868 element: element$3, 3869 empty: empty$3, 3870 group_outros: group_outros$3, 3871 init: init$5, 3872 insert: insert$5, 3873 mount_component: mount_component$4, 3874 safe_not_equal: safe_not_equal$5, 3875 space: space$5, 3876 transition_in: transition_in$4, 3877 transition_out: transition_out$4 3878} = window.__gradio__svelte__internal;const { createEventDispatcher: createEventDispatcher$3 } = window.__gradio__svelte__internal; 3879function create_else_block$5(ctx) { 3880 let empty_1; 3881 let current; 3882 3883 empty_1 = new Empty({ 3884 props: { 3885 size: "small", 3886 $$slots: { default: [create_default_slot$2] }, 3887 $$scope: { ctx } 3888 } 3889 }); 3890 3891 return { 3892 c() { 3893 create_component$4(empty_1.$$.fragment); 3894 }, 3895 m(target, anchor) { 3896 mount_component$4(empty_1, target, anchor); 3897 current = true; 3898 }, 3899 p(ctx, dirty) { 3900 const empty_1_changes = {}; 3901
3902 if (dirty & /*$$scope*/ 32768) { 3903 empty_1_changes.$$scope = { dirty, ctx }; 3904 } 3905 3906 empty_1.$set(empty_1_changes); 3907 }, 3908 i(local) { 3909 if (current) return; 3910 transition_in$4(empty_1.$$.fragment, local); 3911 current = true; 3912 }, 3913 o(local) { 3914 transition_out$4(empty_1.$$.fragment, local); 3915 current = false; 3916 }, 3917 d(detaching) { 3918 destroy_component$4(empty_1, detaching); 3919 } 3920 }; 3921} 3922 3923// (26:0) {#if value !== null} 3924function create_if_block$5(ctx) { 3925 let div; 3926 let t0; 3927 let t1; 3928 let audioplayer; 3929 let current; 3930 let if_block0 = /*show_download_button*/ ctx[3] && create_if_block_2$2(ctx); 3931 let if_block1 = /*show_share_button*/ ctx[4] && create_if_block_1$2(ctx); 3932 3933 audioplayer = new AudioPlayer$1({ 3934 props: { 3935 value: /*value*/ ctx[0], 3936 label: /*label*/ ctx[1], 3937 i18n: /*i18n*/ ctx[5], 3938 waveform_settings: /*waveform_settings*/ ctx[6], 3939 waveform_options: /*waveform_options*/ ctx[7] 3940 } 3941 }); 3942 3943 audioplayer.$on("pause", /*pause_handler*/ ctx[11]); 3944 audioplayer.$on("play", /*play_handler*/ ctx[12]); 3945 audioplayer.$on("stop", /*stop_handler*/ ctx[13]); 3946 3947 return { 3948 c() { 3949 div = element$3("div"); 3950 if (if_block0) if_block0.c(); 3951 t0 = space$5(); 3952 if (if_block1) if_block1.c(); 3953 t1 = space$5(); 3954 create_component$4(audioplayer.$$.fragment); 3955 attr$3(div, "class", "icon-buttons svelte-rvdo70"); 3956 }, 3957 m(target, anchor) { 3958 insert$5(target, div, anchor); 3959 if (if_block0) if_block0.m(div, null); 3960 append$3(div, t0); 3961 if (if_block1) if_block1.m(div, null); 3962 insert$5(target, t1, anchor); 3963 mount_component$4(audioplayer, target, anchor); 3964 current = true; 3965 }, 3966 p(ctx, dirty) { 3967 if (/*show_download_button*/ ctx[3]) { 3968 if (if_block0) { 3969 if_block0.p(ctx, dirty); 3970 3971 if (dirty & /*show_download_button*/ 8) { 3972 transition_in$4(if_block0, 1); 3973 } 3974 } else { 3975 if_block0 = create_if_block_2$2(ctx); 3976 if_block0.c(); 3977 transition_in$4(if_block0, 1); 3978 if_block0.m(div, t0); 3979 } 3980 } else if (if_block0) { 3981 group_outros$3(); 3982 3983 transition_out$4(if_block0, 1, 1, () => { 3984 if_block0 = null; 3985 }); 3986 3987 check_outros$3(); 3988 } 3989 3990 if (/*show_share_button*/ ctx[4]) { 3991 if (if_block1) { 3992 if_block1.p(ctx, dirty); 3993 3994 if (dirty & /*show_share_button*/ 16) { 3995 transition_in$4(if_block1, 1); 3996 } 3997 } else { 3998 if_block1 = create_if_block_1$2(ctx); 3999 if_block1.c(); 4000 transition_in$4(if_block1, 1); 4001 if_block1.m(div, null); 4002 } 4003 } else if (if_block1) { 4004 group_outros$3(); 4005 4006 transition_out$4(if_block1, 1, 1, () => { 4007 if_block1 = null; 4008 }); 4009 4010 check_outros$3(); 4011 } 4012 4013 const audioplayer_changes = {}; 4014 if (dirty & /*value*/ 1) audioplayer_changes.value = /*value*/ ctx[0]; 4015 if (dirty & /*label*/ 2) audioplayer_changes.label = /*label*/ ctx[1]; 4016 if (dirty & /*i18n*/ 32) audioplayer_changes.i18n = /*i18n*/ ctx[5]; 4017 if (dirty & /*waveform_settings*/ 64) audioplayer_changes.waveform_settings = /*waveform_settings*/ ctx[6]; 4018 if (dirty & /*waveform_options*/ 128) audioplayer_changes.waveform_options = /*waveform_options*/ ctx[7]; 4019 audioplayer.$set(audioplayer_changes); 4020 }, 4021 i(local) { 4022 if (current) return; 4023 transition_in$4(if_block0); 4024 transition_in$4(if_block1); 4025 transition_in$4(audioplayer.$$.fragment, local); 4026 current = true; 4027 }, 4028 o(local) { 4029 transition_out$4(if_block0); 4030 transition_out$4(if_block1); 4031 transition_out$4(audioplayer.$$.fragment, local); 4032 current = false; 4033 }, 4034 d(detaching) { 4035 if (detaching) { 4036 detach$5(div); 4037 detach$5(t1); 4038 } 4039 4040 if (if_block0) if_block0.d(); 4041 if (if_block1) if_block1.d(); 4042 destroy_component$4(audioplayer, detaching); 4043 } 4044 }; 4045} 4046 4047// (63:1) <Empty size="small"> 4048function create_default_slot$2(ctx) { 4049 let music; 4050 let current; 4051 music = new Music({}); 4052 4053 return { 4054 c() { 4055 create_component$4(music.$$.fragment); 4056 }, 4057 m(target, anchor) { 4058 mount_component$4(music, target, anchor); 4059 current = true; 4060 }, 4061 i(local) { 4062 if (current) return; 4063 transition_in$4(music.$$.fragment, local); 4064 current = true; 4065 }, 4066 o(local) { 4067 transition_out$4(music.$$.fragment, local); 4068 current = false;
4069 }, 4070 d(detaching) { 4071 destroy_component$4(music, detaching); 4072 } 4073 }; 4074} 4075 4076// (28:2) {#if show_download_button} 4077function create_if_block_2$2(ctx) { 4078 let a; 4079 let iconbutton; 4080 let a_href_value; 4081 let a_download_value; 4082 let current; 4083 4084 iconbutton = new IconButton({ 4085 props: { 4086 Icon: Download, 4087 label: /*i18n*/ ctx[5]("common.download") 4088 } 4089 }); 4090 4091 return { 4092 c() { 4093 a = element$3("a"); 4094 create_component$4(iconbutton.$$.fragment); 4095 attr$3(a, "href", a_href_value = /*value*/ ctx[0].url); 4096 attr$3(a, "target", window.__is_colab__ ? "_blank" : null); 4097 attr$3(a, "download", a_download_value = /*value*/ ctx[0].orig_name || /*value*/ ctx[0].path); 4098 }, 4099 m(target, anchor) { 4100 insert$5(target, a, anchor); 4101 mount_component$4(iconbutton, a, null); 4102 current = true; 4103 }, 4104 p(ctx, dirty) { 4105 const iconbutton_changes = {}; 4106 if (dirty & /*i18n*/ 32) iconbutton_changes.label = /*i18n*/ ctx[5]("common.download"); 4107 iconbutton.$set(iconbutton_changes); 4108 4109 if (!current || dirty & /*value*/ 1 && a_href_value !== (a_href_value = /*value*/ ctx[0].url)) { 4110 attr$3(a, "href", a_href_value); 4111 } 4112 4113 if (!current || dirty & /*value*/ 1 && a_download_value !== (a_download_value = /*value*/ ctx[0].orig_name || /*value*/ ctx[0].path)) { 4114 attr$3(a, "download", a_download_value); 4115 } 4116 }, 4117 i(local) { 4118 if (current) return; 4119 transition_in$4(iconbutton.$$.fragment, local); 4120 current = true; 4121 }, 4122 o(local) { 4123 transition_out$4(iconbutton.$$.fragment, local); 4124 current = false; 4125 }, 4126 d(detaching) { 4127 if (detaching) { 4128 detach$5(a); 4129 } 4130 4131 destroy_component$4(iconbutton); 4132 } 4133 }; 4134} 4135 4136// (37:2) {#if show_share_button} 4137function create_if_block_1$2(ctx) { 4138 let sharebutton; 4139 let current; 4140 4141 sharebutton = new ShareButton({ 4142 props: { 4143 i18n: /*i18n*/ ctx[5], 4144 formatter: /*func*/ ctx[8], 4145 value: /*value*/ ctx[0] 4146 } 4147 }); 4148 4149 sharebutton.$on("error", /*error_handler*/ ctx[9]); 4150 sharebutton.$on("share", /*share_handler*/ ctx[10]); 4151 4152 return { 4153 c() { 4154 create_component$4(sharebutton.$$.fragment); 4155 }, 4156 m(target, anchor) { 4157 mount_component$4(sharebutton, target, anchor); 4158 current = true; 4159 }, 4160 p(ctx, dirty) { 4161 const sharebutton_changes = {}; 4162 if (dirty & /*i18n*/ 32) sharebutton_changes.i18n = /*i18n*/ ctx[5]; 4163 if (dirty & /*value*/ 1) sharebutton_changes.value = /*value*/ ctx[0]; 4164 sharebutton.$set(sharebutton_changes); 4165 }, 4166 i(local) { 4167 if (current) return; 4168 transition_in$4(sharebutton.$$.fragment, local); 4169 current = true; 4170 }, 4171 o(local) { 4172 transition_out$4(sharebutton.$$.fragment, local); 4173 current = false; 4174 }, 4175 d(detaching) { 4176 destroy_component$4(sharebutton, detaching); 4177 } 4178 }; 4179} 4180 4181function create_fragment$5(ctx) { 4182 let blocklabel; 4183 let t; 4184 let current_block_type_index; 4185 let if_block; 4186 let if_block_anchor; 4187 let current; 4188 4189 blocklabel = new BlockLabel({ 4190 props: { 4191 show_label: /*show_label*/ ctx[2], 4192 Icon: Music, 4193 float: false, 4194 label: /*label*/ ctx[1] || /*i18n*/ ctx[5]("audio.audio") 4195 } 4196 }); 4197 4198 const if_block_creators = [create_if_block$5, create_else_block$5]; 4199 const if_blocks = []; 4200 4201 function select_block_type(ctx, dirty) { 4202 if (/*value*/ ctx[0] !== null) return 0; 4203 return 1; 4204 } 4205 4206 current_block_type_index = select_block_type(ctx); 4207 if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 4208 4209 return { 4210 c() { 4211 create_component$4(blocklabel.$$.fragment); 4212 t = space$5(); 4213 if_block.c(); 4214 if_block_anchor = empty$3(); 4215 }, 4216 m(target, anchor) { 4217 mount_component$4(blocklabel, target, anchor); 4218 insert$5(target, t, anchor); 4219 if_blocks[current_block_type_index].m(target, anchor); 4220 insert$5(target, if_block_anchor, anchor); 4221 current = true; 4222 }, 4223 p(ctx, [dirty]) { 4224 const blocklabel_changes = {}; 4225 if (dirty & /*show_label*/ 4) blocklabel_changes.show_label = /*show_label*/ ctx[2]; 4226 if (dirty & /*label, i18n*/ 34) blocklabel_changes.label = /*label*/ ctx[1] || /*i18n*/ ctx[5]("audio.audio"); 4227 blocklabel.$set(blocklabel_changes); 4228 let previous_block_index = current_block_type_index; 4229 current_block_type_index = select_block_type(ctx); 4230 4231 if (current_block_type_index === previous_block_index) { 4232 if_blocks[current_block_type_index].p(ctx, dirty); 4233 } else { 4234 group_outros$3(); 4235 4236 transition_out$4(if_blocks[previous_block_index], 1, 1, () => { 4237 if_blocks[previous_block_index] = null; 4238 }); 4239 4240 check_outros$3(); 4241 if_block = if_blocks[current_block_type_index]; 4242 4243 if (!if_block) { 4244 if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 4245 if_block.c(); 4246 } else { 4247 if_block.p(ctx, dirty); 4248 } 4249 4250 transition_in$4(if_block, 1); 4251 if_block.m(if_block_anchor.parentNode, if_block_anchor); 4252 } 4253 }, 4254 i(local) { 4255 if (current) return; 4256 transition_in$4(blocklabel.$$.fragment, local); 4257 transition_in$4(if_block); 4258 current = true; 4259 }, 4260 o(local) { 4261 transition_out$4(blocklabel.$$.fragment, local); 4262 transition_out$4(if_block); 4263 current = false;
4264 }, 4265 d(detaching) { 4266 if (detaching) { 4267 detach$5(t); 4268 detach$5(if_block_anchor); 4269 } 4270 4271 destroy_component$4(blocklabel, detaching); 4272 if_blocks[current_block_type_index].d(detaching); 4273 } 4274 }; 4275} 4276 4277function instance$5($$self, $$props, $$invalidate) { 4278 let { value = null } = $$props; 4279 let { label } = $$props; 4280 let { show_label = true } = $$props; 4281 let { show_download_button = true } = $$props; 4282 let { show_share_button = false } = $$props; 4283 let { i18n } = $$props; 4284 let { waveform_settings } = $$props; 4285 let { waveform_options } = $$props; 4286 const dispatch = createEventDispatcher$3(); 4287 4288 const func = async value => { 4289 if (!value) return ""; 4290 let url = await uploadToHuggingFace(value.url, "url"); 4291 return `<audio controls src="${url}"></audio>`; 4292 }; 4293 4294 function error_handler(event) { 4295 bubble$1.call(this, $$self, event); 4296 } 4297 4298 function share_handler(event) { 4299 bubble$1.call(this, $$self, event); 4300 } 4301 4302 function pause_handler(event) { 4303 bubble$1.call(this, $$self, event); 4304 } 4305 4306 function play_handler(event) { 4307 bubble$1.call(this, $$self, event); 4308 } 4309 4310 function stop_handler(event) { 4311 bubble$1.call(this, $$self, event); 4312 } 4313 4314 $$self.$$set = $$props => {
4315 if ('value' in $$props) $$invalidate(0, value = $$props.value); 4316 if ('label' in $$props) $$invalidate(1, label = $$props.label); 4317 if ('show_label' in $$props) $$invalidate(2, show_label = $$props.show_label); 4318 if ('show_download_button' in $$props) $$invalidate(3, show_download_button = $$props.show_download_button); 4319 if ('show_share_button' in $$props) $$invalidate(4, show_share_button = $$props.show_share_button); 4320 if ('i18n' in $$props) $$invalidate(5, i18n = $$props.i18n); 4321 if ('waveform_settings' in $$props) $$invalidate(6, waveform_settings = $$props.waveform_settings); 4322 if ('waveform_options' in $$props) $$invalidate(7, waveform_options = $$props.waveform_options); 4323 }; 4324 4325 $$self.$$.update = () => { 4326 if ($$self.$$.dirty & /*value*/ 1) { 4327 value && dispatch("change", value); 4328 } 4329 }; 4330 4331 return [ 4332 value, 4333 label, 4334 show_label, 4335 show_download_button, 4336 show_share_button, 4337 i18n, 4338 waveform_settings, 4339 waveform_options, 4340 func, 4341 error_handler, 4342 share_handler, 4343 pause_handler, 4344 play_handler, 4345 stop_handler 4346 ]; 4347} 4348 4349class StaticAudio extends SvelteComponent$5 { 4350 constructor(options) { 4351 super(); 4352 4353 init$5(this, options, instance$5, create_fragment$5, safe_not_equal$5, { 4354 value: 0, 4355 label: 1, 4356 show_label: 2, 4357 show_download_button: 3, 4358 show_share_button: 4, 4359 i18n: 5, 4360 waveform_settings: 6, 4361 waveform_options: 7 4362 }); 4363 } 4364} 4365 4366const StaticAudio$1 = StaticAudio; 4367 4368function e(e,t,i,s){return new(i||(i=Promise))((function(r,n){function o(e){try{d(s.next(e));}catch(e){n(e);}}function a(e){try{d(s.throw(e));}catch(e){n(e);}}function d(e){var t;e.done?r(e.value):(t=e.value,t instanceof i?t:new i((function(e){e(t);}))).then(o,a);}d((s=s.apply(e,t||[])).next());}))}"function"==typeof SuppressedError&&SuppressedError;class t{constructor(){this.listeners={},this.on=this.addEventListener,this.un=this.removeEventListener;}addEventListener(e,t,i){if(this.listeners[e]||(this.listeners[e]=new Set),this.listeners[e].add(t),null==i?void 0:i.once){const i=()=>{this.removeEventListener(e,i),this.removeEventListener(e,t);};return this.addEventListener(e,i),i}return ()=>this.removeEventListener(e,t)}removeEventListener(e,t){var i;null===(i=this.listeners[e])||void 0===i||i.delete(t);}once(e,t){return this.on(e,t,{once:!0})}unAll(){this.listeners={};}emit(e,...t){this.listeners[e]&&this.listeners[e].forEach((e=>e(...t)));}}class i extends t{constructor(e){super(),this.subscriptions=[],this.options=e;}onInit(){}init(e){this.wavesurfer=e,this.onInit();}destroy(){this.emit("destroy"),this.subscriptions.forEach((e=>e()));}}const s=["audio/webm","audio/wav","audio/mpeg","audio/mp4","audio/mp3"];class r extends i{constructor(e){var t;super(Object.assign(Object.assign({},e),{audioBitsPerSecond:null!==(t=e.audioBitsPerSecond)&&void 0!==t?t:128e3})),this.stream=null,this.mediaRecorder=null;}static create(e){return new r(e||{})}renderMicStream(e){const t=new AudioContext,i=t.createMediaStreamSource(e),s=t.createAnalyser();i.connect(s);const r=s.frequencyBinCount,n=new Float32Array(r),o=r/t.sampleRate;let a;const d=()=>{s.getFloatTimeDomainData(n),this.wavesurfer&&(this.wavesurfer.options.cursorWidth=0,this.wavesurfer.options.interact=!1,this.wavesurfer.load("",[n],o)),a=requestAnimationFrame(d);};return d(),()=>{cancelAnimationFrame(a),null==i||i.disconnect(),null==t||t.close();}}startMic(t){return e(this,void 0,void 0,(function*(){let e;try{e=yield navigator.mediaDevices.getUserMedia({audio:!(null==t?void 0:t.deviceId)||{deviceId:t.deviceId}});}catch(e){throw new Error("Error accessing the microphone: "+e.message)}const i=this.renderMicStream(e);return this.subscriptions.push(this.once("destroy",i)),this.stream=e,e}))}stopMic(){this.stream&&(this.stream.getTracks().forEach((e=>e.stop())),this.stream=null,this.mediaRecorder=null);}startRecording(t){return e(this,void 0,void 0,(function*(){const e=this.stream||(yield this.startMic(t)),i=this.mediaRecorder||new MediaRecorder(e,{mimeType:this.options.mimeType||s.find((e=>MediaRecorder.isTypeSupported(e))),audioBitsPerSecond:this.options.audioBitsPerSecond});this.mediaRecorder=i,this.stopRecording();const r=[];i.ondataavailable=e=>{e.data.size>0&&r.push(e.data);},i.onstop=()=>{var e;const t=new Blob(r,{type:i.mimeType});
4368this.emit("record-end",t),!1!==this.options.renderRecordedAudio&&(null===(e=this.wavesurfer)||void 0===e||e.load(URL.createObjectURL(t)));},i.start(),this.emit("record-start");}))}isRecording(){var e;return "recording"===(null===(e=this.mediaRecorder)||void 0===e?void 0:e.state)}isPaused(){var e;return "paused"===(null===(e=this.mediaRecorder)||void 0===e?void 0:e.state)}stopRecording(){var e;this.isRecording()&&(null===(e=this.mediaRecorder)||void 0===e||e.stop());}pauseRecording(){var e;this.isRecording()&&(null===(e=this.mediaRecorder)||void 0===e||e.pause(),this.emit("record-pause"));}resumeRecording(){var e;this.isPaused()&&(null===(e=this.mediaRecorder)||void 0===e||e.resume(),this.emit("record-resume"));}static getAvailableAudioDevices(){return e(this,void 0,void 0,(function*(){return navigator.mediaDevices.enumerateDevices().then((e=>e.filter((e=>"audioinput"===e.kind))))}))}destroy(){super.destroy(),this.stopRecording(),this.stopMic();}} 4369 4370const WaveformRecordControls_svelte_svelte_type_style_lang = ''; 4371 4372/* home/runner/work/gradio/gradio/js/audio/shared/WaveformRecordControls.svelte generated by Svelte v4.2.2 */ 4373const { 4374 SvelteComponent: SvelteComponent$4, 4375 append: append$2, 4376 attr: attr$2, 4377 binding_callbacks: binding_callbacks$3, 4378 create_component: create_component$3, 4379 destroy_component: destroy_component$3, 4380 destroy_each, 4381 detach: detach$4, 4382 element: element$2, 4383 empty: empty$2, 4384 ensure_array_like, 4385 init: init$4, 4386 insert: insert$4, 4387 listen: listen$1, 4388 mount_component: mount_component$3, 4389 run_all, 4390 safe_not_equal: safe_not_equal$4, 4391 set_data: set_data$2, 4392 set_input_value, 4393 space: space$4, 4394 text: text$2, 4395 transition_in: transition_in$3, 4396 transition_out: transition_out$3 4397} = window.__gradio__svelte__internal;const { createEventDispatcher: createEventDispatcher$2 } = window.__gradio__svelte__internal; 4398function get_each_context(ctx, list, i) { 4399 const child_ctx = ctx.slice(); 4400 child_ctx[19] = list[i]; 4401 return child_ctx; 4402} 4403 4404// (117:2) {:else} 4405function create_else_block$4(ctx) { 4406 let each_1_anchor; 4407 let each_value = ensure_array_like(/*micDevices*/ ctx[2]); 4408 let each_blocks = []; 4409 4410 for (let i = 0; i < each_value.length; i += 1) { 4411 each_blocks[i] = create_each_block(get_each_context(ctx, each_value, i)); 4412 } 4413 4414 return { 4415 c() { 4416 for (let i = 0; i < each_blocks.length; i += 1) { 4417 each_blocks[i].c(); 4418 } 4419 4420 each_1_anchor = empty$2(); 4421 }, 4422 m(target, anchor) { 4423 for (let i = 0; i < each_blocks.length; i += 1) { 4424 if (each_blocks[i]) { 4425 each_blocks[i].m(target, anchor); 4426 } 4427 } 4428 4429 insert$4(target, each_1_anchor, anchor); 4430 }, 4431 p(ctx, dirty) { 4432 if (dirty & /*micDevices*/ 4) { 4433 each_value = ensure_array_like(/*micDevices*/ ctx[2]); 4434 let i; 4435 4436 for (i = 0; i < each_value.length; i += 1) { 4437 const child_ctx = get_each_context(ctx, each_value, i); 4438 4439 if (each_blocks[i]) { 4440 each_blocks[i].p(child_ctx, dirty); 4441 } else { 4442 each_blocks[i] = create_each_block(child_ctx); 4443 each_blocks[i].c(); 4444 each_blocks[i].m(each_1_anchor.parentNode, each_1_anchor); 4445 } 4446 } 4447 4448 for (; i < each_blocks.length; i += 1) { 4449 each_blocks[i].d(1); 4450 } 4451 4452 each_blocks.length = each_value.length; 4453 } 4454 }, 4455 d(detaching) { 4456 if (detaching) { 4457 detach$4(each_1_anchor); 4458 } 4459 4460 destroy_each(each_blocks, detaching); 4461 } 4462 }; 4463} 4464 4465// (115:2) {#if micDevices.length === 0} 4466function create_if_block$4(ctx) { 4467 let option; 4468 let t_value = /*i18n*/ ctx[1]("audio.no_microphone") + ""; 4469 let t; 4470 4471 return { 4472 c() { 4473 option = element$2("option"); 4474 t = text$2(t_value); 4475 option.__value = ""; 4476 set_input_value(option, option.__value); 4477 }, 4478 m(target, anchor) { 4479 insert$4(target, option, anchor); 4480 append$2(option, t); 4481 }, 4482 p(ctx, dirty) { 4483 if (dirty & /*i18n*/ 2 && t_value !== (t_value = /*i18n*/ ctx[1]("audio.no_microphone") + "")) set_data$2(t, t_value); 4484 }, 4485 d(detaching) { 4486 if (detaching) { 4487 detach$4(option); 4488 } 4489 } 4490 }; 4491} 4492 4493// (118:3) {#each micDevices as micDevice} 4494function create_each_block(ctx) { 4495 let option; 4496 let t_value = /*micDevice*/ ctx[19].label + ""; 4497 let t; 4498 let option_value_value; 4499 4500 return { 4501 c() { 4502 option = element$2("option"); 4503 t = text$2(t_value); 4504 option.__value = option_value_value = /*micDevice*/ ctx[19].deviceId; 4505 set_input_value(option, option.__value); 4506 }, 4507 m(target, anchor) { 4508 insert$4(target, option, anchor); 4509 append$2(option, t); 4510 }, 4511 p(ctx, dirty) {
4512 if (dirty & /*micDevices*/ 4 && t_value !== (t_value = /*micDevice*/ ctx[19].label + "")) set_data$2(t, t_value); 4513 4514 if (dirty & /*micDevices*/ 4 && option_value_value !== (option_value_value = /*micDevice*/ ctx[19].deviceId)) { 4515 option.__value = option_value_value; 4516 set_input_value(option, option.__value); 4517 } 4518 }, 4519 d(detaching) { 4520 if (detaching) { 4521 detach$4(option); 4522 } 4523 } 4524 }; 4525} 4526 4527function create_fragment$4(ctx) { 4528 let div1; 4529 let div0; 4530 let button0; 4531 let t0_value = /*i18n*/ ctx[1]("audio.record") + ""; 4532 let t0; 4533 let t1; 4534 let button1; 4535 let t2_value = /*i18n*/ ctx[1]("audio.stop") + ""; 4536 let t2; 4537 let button1_class_value; 4538 let t3; 4539 let button2; 4540 let t4_value = /*i18n*/ ctx[1]("audio.stop") + ""; 4541 let t4; 4542 let t5; 4543 let button3; 4544 let pause; 4545 let t6; 4546 let button4; 4547 let t7_value = /*i18n*/ ctx[1]("audio.resume") + ""; 4548 let t7; 4549 let t8; 4550 let select; 4551 let select_disabled_value; 4552 let current; 4553 let mounted; 4554 let dispose; 4555 pause = new Pause({}); 4556 4557 function select_block_type(ctx, dirty) { 4558 if (/*micDevices*/ ctx[2].length === 0) return create_if_block$4; 4559 return create_else_block$4; 4560 } 4561 4562 let current_block_type = select_block_type(ctx); 4563 let if_block = current_block_type(ctx); 4564 4565 return { 4566 c() { 4567 div1 = element$2("div"); 4568 div0 = element$2("div"); 4569 button0 = element$2("button"); 4570 t0 = text$2(t0_value); 4571 t1 = space$4(); 4572 button1 = element$2("button"); 4573 t2 = text$2(t2_value); 4574 t3 = space$4(); 4575 button2 = element$2("button"); 4576 t4 = text$2(t4_value); 4577 t5 = space$4(); 4578 button3 = element$2("button"); 4579 create_component$3(pause.$$.fragment); 4580 t6 = space$4(); 4581 button4 = element$2("button"); 4582 t7 = text$2(t7_value); 4583 t8 = space$4(); 4584 select = element$2("select"); 4585 if_block.c(); 4586 attr$2(button0, "class", "record record-button svelte-9uoz5m"); 4587 attr$2(button1, "class", button1_class_value = "stop-button " + (/*record*/ ctx[0].isPaused() ? 'stop-button-paused' : '') + " svelte-9uoz5m"); 4588 attr$2(button2, "id", "stop-paused"); 4589 attr$2(button2, "class", "stop-button-paused svelte-9uoz5m"); 4590 attr$2(button3, "class", "pause-button svelte-9uoz5m"); 4591 attr$2(button4, "class", "resume-button svelte-9uoz5m"); 4592 attr$2(div0, "class", "wrapper svelte-9uoz5m"); 4593 attr$2(select, "class", "mic-select svelte-9uoz5m"); 4594 attr$2(select, "aria-label", "Select input device"); 4595 select.disabled = select_disabled_value = /*micDevices*/ ctx[2].length === 0; 4596 attr$2(div1, "class", "controls svelte-9uoz5m"); 4597 }, 4598 m(target, anchor) { 4599 insert$4(target, div1, anchor); 4600 append$2(div1, div0); 4601 append$2(div0, button0); 4602 append$2(button0, t0); 4603 /*button0_binding*/ ctx[8](button0); 4604 append$2(div0, t1); 4605 append$2(div0, button1); 4606 append$2(button1, t2); 4607 /*button1_binding*/ ctx[10](button1); 4608 append$2(div0, t3); 4609 append$2(div0, button2); 4610 append$2(button2, t4); 4611 /*button2_binding*/ ctx[12](button2); 4612 append$2(div0, t5); 4613 append$2(div0, button3); 4614 mount_component$3(pause, button3, null); 4615 /*button3_binding*/ ctx[14](button3); 4616 append$2(div0, t6); 4617 append$2(div0, button4); 4618 append$2(button4, t7); 4619 /*button4_binding*/ ctx[16](button4); 4620 append$2(div1, t8); 4621 append$2(div1, select); 4622 if_block.m(select, null); 4623 current = true; 4624 4625 if (!mounted) { 4626 dispose = [ 4627 listen$1(button0, "click", /*click_handler*/ ctx[9]), 4628 listen$1(button1, "click", /*click_handler_1*/ ctx[11]), 4629 listen$1(button2, "click", /*click_handler_2*/ ctx[13]), 4630 listen$1(button3, "click", /*click_handler_3*/ ctx[15]), 4631 listen$1(button4, "click", /*click_handler_4*/ ctx[17]) 4632 ]; 4633 4634 mounted = true; 4635 } 4636 }, 4637 p(ctx, [dirty]) { 4638 if ((!current || dirty & /*i18n*/ 2) && t0_value !== (t0_value = /*i18n*/ ctx[1]("audio.record") + "")) set_data$2(t0, t0_value); 4639 if ((!current || dirty & /*i18n*/ 2) && t2_value !== (t2_value = /*i18n*/ ctx[1]("audio.stop") + "")) set_data$2(t2, t2_value); 4640 4641 if (!current || dirty & /*record*/ 1 && button1_class_value !== (button1_class_value = "stop-button " + (/*record*/ ctx[0].isPaused() ? 'stop-button-paused' : '') + " svelte-9uoz5m")) { 4642 attr$2(button1, "class", button1_class_value); 4643 } 4644 4645 if ((!current || dirty & /*i18n*/ 2) && t4_value !== (t4_value = /*i18n*/ ctx[1]("audio.stop") + "")) set_data$2(t4, t4_value); 4646 if ((!current || dirty & /*i18n*/ 2) && t7_value !== (t7_value = /*i18n*/ ctx[1]("audio.resume") + "")) set_data$2(t7, t7_value); 4647 4648 if (current_block_type === (current_block_type = select_block_type(ctx)) && if_block) { 4649 if_block.p(ctx, dirty); 4650 } else { 4651 if_block.d(1); 4652 if_block = current_block_type(ctx); 4653 4654 if (if_block) { 4655 if_block.c(); 4656 if_block.m(select, null); 4657 } 4658 } 4659 4660 if (!current || dirty & /*micDevices*/ 4 && select_disabled_value !== (select_disabled_value = /*micDevices*/ ctx[2].length === 0)) { 4661 select.disabled = select_disabled_value; 4662 } 4663 }, 4664 i(local) { 4665 if (current) return; 4666 transition_in$3(pause.$$.fragment, local); 4667 current = true; 4668 }, 4669 o(local) { 4670 transition_out$3(pause.$$.fragment, local); 4671 current = false;
4672 }, 4673 d(detaching) { 4674 if (detaching) { 4675 detach$4(div1); 4676 } 4677 4678 /*button0_binding*/ ctx[8](null); 4679 /*button1_binding*/ ctx[10](null); 4680 /*button2_binding*/ ctx[12](null); 4681 destroy_component$3(pause); 4682 /*button3_binding*/ ctx[14](null); 4683 /*button4_binding*/ ctx[16](null); 4684 if_block.d(); 4685 mounted = false; 4686 run_all(dispose); 4687 } 4688 }; 4689} 4690 4691function instance$4($$self, $$props, $$invalidate) { 4692 let { record } = $$props; 4693 let { i18n } = $$props; 4694 let micDevices = []; 4695 let recordButton; 4696 let pauseButton; 4697 let resumeButton; 4698 let stopButton; 4699 let stopButtonPaused; 4700 const dispatch = createEventDispatcher$2(); 4701 4702 function button0_binding($$value) { 4703 binding_callbacks$3[$$value ? 'unshift' : 'push'](() => { 4704 recordButton = $$value; 4705 ($$invalidate(3, recordButton), $$invalidate(0, record)); 4706 }); 4707 } 4708 4709 const click_handler = () => record.startRecording(); 4710 4711 function button1_binding($$value) { 4712 binding_callbacks$3[$$value ? 'unshift' : 'push'](() => { 4713 stopButton = $$value; 4714 ($$invalidate(6, stopButton), $$invalidate(0, record)); 4715 }); 4716 } 4717 4718 const click_handler_1 = () => { 4719 if (record.isPaused()) { 4720 record.resumeRecording(); 4721 record.stopRecording(); 4722 } 4723 4724 record.stopRecording(); 4725 }; 4726 4727 function button2_binding($$value) { 4728 binding_callbacks$3[$$value ? 'unshift' : 'push'](() => { 4729 stopButtonPaused = $$value; 4730 ($$invalidate(7, stopButtonPaused), $$invalidate(0, record)); 4731 }); 4732 } 4733 4734 const click_handler_2 = () => { 4735 if (record.isPaused()) { 4736 record.resumeRecording(); 4737 record.stopRecording(); 4738 } 4739 4740 record.stopRecording(); 4741 }; 4742 4743 function button3_binding($$value) { 4744 binding_callbacks$3[$$value ? 'unshift' : 'push'](() => { 4745 pauseButton = $$value; 4746 ($$invalidate(4, pauseButton), $$invalidate(0, record)); 4747 }); 4748 } 4749 4750 const click_handler_3 = () => record.pauseRecording(); 4751 4752 function button4_binding($$value) { 4753 binding_callbacks$3[$$value ? 'unshift' : 'push'](() => { 4754 resumeButton = $$value; 4755 ($$invalidate(5, resumeButton), $$invalidate(0, record)); 4756 }); 4757 } 4758 4759 const click_handler_4 = () => record.resumeRecording(); 4760 4761 $$self.$$set = $$props => {
4762 if ('record' in $$props) $$invalidate(0, record = $$props.record); 4763 if ('i18n' in $$props) $$invalidate(1, i18n = $$props.i18n); 4764 }; 4765 4766 $$self.$$.update = () => { 4767 if ($$self.$$.dirty & /*i18n*/ 2) { 4768 try { 4769 let tempDevices = []; 4770 4771 r.getAvailableAudioDevices().then(devices => { 4772 $$invalidate(2, micDevices = devices); 4773 4774 devices.forEach(device => { 4775 if (device.deviceId) { 4776 tempDevices.push(device); 4777 } 4778 }); 4779 4780 $$invalidate(2, micDevices = tempDevices); 4781 }); 4782 } catch(err) { 4783 if (err instanceof DOMException && err.name == "NotAllowedError") { 4784 dispatch("error", i18n("audio.allow_recording_access")); 4785 } 4786 4787 throw err; 4788 } 4789 } 4790 4791 if ($$self.$$.dirty & /*record*/ 1) { 4792 record.on("record-start", () => { 4793 record.startMic(); 4794 $$invalidate(3, recordButton.style.display = "none", recordButton); 4795 $$invalidate(6, stopButton.style.display = "flex", stopButton); 4796 $$invalidate(4, pauseButton.style.display = "block", pauseButton); 4797 }); 4798 } 4799 4800 if ($$self.$$.dirty & /*record*/ 1) { 4801 record.on("record-end", () => { 4802 if (record.isPaused()) { 4803 record.resumeRecording(); 4804 record.stopRecording(); 4805 } 4806 4807 record.stopMic(); 4808 $$invalidate(3, recordButton.style.display = "flex", recordButton); 4809 $$invalidate(6, stopButton.style.display = "none", stopButton); 4810 $$invalidate(4, pauseButton.style.display = "none", pauseButton); 4811 $$invalidate(3, recordButton.disabled = false, recordButton); 4812 }); 4813 } 4814 4815 if ($$self.$$.dirty & /*record*/ 1) { 4816 record.on("record-pause", () => { 4817 $$invalidate(4, pauseButton.style.display = "none", pauseButton); 4818 $$invalidate(5, resumeButton.style.display = "block", resumeButton); 4819 $$invalidate(6, stopButton.style.display = "none", stopButton); 4820 $$invalidate(7, stopButtonPaused.style.display = "flex", stopButtonPaused); 4821 }); 4822 } 4823 4824 if ($$self.$$.dirty & /*record*/ 1) { 4825 record.on("record-resume", () => { 4826 $$invalidate(4, pauseButton.style.display = "block", pauseButton); 4827 $$invalidate(5, resumeButton.style.display = "none", resumeButton); 4828 $$invalidate(3, recordButton.style.display = "none", recordButton); 4829 $$invalidate(6, stopButton.style.display = "flex", stopButton); 4830 $$invalidate(7, stopButtonPaused.style.display = "none", stopButtonPaused); 4831 }); 4832 } 4833 }; 4834 4835 return [ 4836 record, 4837 i18n, 4838 micDevices, 4839 recordButton, 4840 pauseButton, 4841 resumeButton, 4842 stopButton, 4843 stopButtonPaused, 4844 button0_binding, 4845 click_handler, 4846 button1_binding, 4847 click_handler_1, 4848 button2_binding, 4849 click_handler_2, 4850 button3_binding, 4851 click_handler_3, 4852 button4_binding, 4853 click_handler_4 4854 ]; 4855} 4856 4857class WaveformRecordControls extends SvelteComponent$4 { 4858 constructor(options) { 4859 super(); 4860 init$4(this, options, instance$4, create_fragment$4, safe_not_equal$4, { record: 0, i18n: 1 }); 4861 } 4862} 4863 4864const AudioRecorder_svelte_svelte_type_style_lang = ''; 4865 4866/* home/runner/work/gradio/gradio/js/audio/recorder/AudioRecorder.svelte generated by Svelte v4.2.2 */ 4867const { 4868 SvelteComponent: SvelteComponent$3, 4869 add_flush_callback: add_flush_callback$2, 4870 append: append$1, 4871 attr: attr$1, 4872 bind: bind$2, 4873 binding_callbacks: binding_callbacks$2, 4874 check_outros: check_outros$2, 4875 create_component: create_component$2, 4876 destroy_component: destroy_component$2, 4877 detach: detach$3, 4878 element: element$1, 4879 group_outros: group_outros$2, 4880 init: init$3, 4881 insert: insert$3, 4882 mount_component: mount_component$2, 4883 noop: noop$1, 4884 safe_not_equal: safe_not_equal$3, 4885 set_data: set_data$1, 4886 space: space$3, 4887 text: text$1, 4888 transition_in: transition_in$2, 4889 transition_out: transition_out$2 4890} = window.__gradio__svelte__internal; 4891const { onMount: onMount$1 } = window.__gradio__svelte__internal;const { createEventDispatcher: createEventDispatcher$1 } = window.__gradio__svelte__internal; 4892function create_if_block_2$1(ctx) { 4893 let div1; 4894 let time; 4895 let t1; 4896 let div0; 4897 let t2; 4898 let if_block0 = /*mode*/ ctx[0] === "edit" && /*trimDuration*/ ctx[16] > 0 && create_if_block_4(ctx); 4899 4900 function select_block_type(ctx, dirty) { 4901 if (/*timing*/ ctx[15]) return create_if_block_3$1; 4902 return create_else_block$3; 4903 } 4904 4905 let current_block_type = select_block_type(ctx); 4906 let if_block1 = current_block_type(ctx); 4907 4908 return { 4909 c() { 4910 div1 = element$1("div"); 4911 time = element$1("time"); 4912 time.textContent = "0:00"; 4913 t1 = space$3(); 4914 div0 = element$1("div"); 4915 if (if_block0) if_block0.c(); 4916 t2 = space$3(); 4917 if_block1.c(); 4918 attr$1(time, "class", "time svelte-7hmw24"); 4919 attr$1(div1, "class", "timestamps svelte-7hmw24"); 4920 }, 4921 m(target, anchor) { 4922 insert$3(target, div1, anchor); 4923 append$1(div1, time); 4924 /*time_binding*/ ctx[24](time); 4925 append$1(div1, t1); 4926 append$1(div1, div0); 4927 if (if_block0) if_block0.m(div0, null); 4928 append$1(div0, t2); 4929 if_block1.m(div0, null); 4930 }, 4931 p(ctx, dirty) { 4932 if (/*mode*/ ctx[0] === "edit" && /*trimDuration*/ ctx[16] > 0) { 4933 if (if_block0) { 4934 if_block0.p(ctx, dirty); 4935 } else { 4936 if_block0 = create_if_block_4(ctx); 4937 if_block0.c(); 4938 if_block0.m(div0, t2); 4939 } 4940 } else if (if_block0) { 4941 if_block0.d(1); 4942 if_block0 = null; 4943 } 4944 4945 if (current_block_type === (current_block_type = select_block_type(ctx)) && if_block1) { 4946 if_block1.p(ctx, dirty); 4947 } else { 4948 if_block1.d(1); 4949 if_block1 = current_block_type(ctx); 4950 4951 if (if_block1) { 4952 if_block1.c(); 4953 if_block1.m(div0, null); 4954 } 4955 } 4956 }, 4957 d(detaching) { 4958 if (detaching) { 4959 detach$3(div1); 4960 } 4961 4962 /*time_binding*/ ctx[24](null); 4963 if (if_block0) if_block0.d(); 4964 if_block1.d(); 4965 } 4966 }; 4967} 4968 4969// (163:4) {#if mode === "edit" && trimDuration > 0} 4970function create_if_block_4(ctx) { 4971 let time; 4972 let t_value = /*format_time*/ ctx[17](/*trimDuration*/ ctx[16]) + ""; 4973 let t; 4974 4975 return { 4976 c() { 4977 time = element$1("time"); 4978 t = text$1(t_value); 4979 attr$1(time, "class", "trim-duration svelte-7hmw24"); 4980 }, 4981 m(target, anchor) {
4982 insert$3(target, time, anchor); 4983 append$1(time, t); 4984 }, 4985 p(ctx, dirty) { 4986 if (dirty[0] & /*trimDuration*/ 65536 && t_value !== (t_value = /*format_time*/ ctx[17](/*trimDuration*/ ctx[16]) + "")) set_data$1(t, t_value); 4987 }, 4988 d(detaching) { 4989 if (detaching) { 4990 detach$3(time); 4991 } 4992 } 4993 }; 4994} 4995 4996// (168:4) {:else} 4997function create_else_block$3(ctx) { 4998 let time; 4999 5000 return { 5001 c() { 5002 time = element$1("time"); 5003 time.textContent = "0:00"; 5004 attr$1(time, "class", "duration svelte-7hmw24"); 5005 }, 5006 m(target, anchor) { 5007 insert$3(target, time, anchor); 5008 /*time_binding_1*/ ctx[25](time); 5009 }, 5010 p: noop$1, 5011 d(detaching) { 5012 if (detaching) { 5013 detach$3(time); 5014 } 5015 5016 /*time_binding_1*/ ctx[25](null); 5017 } 5018 }; 5019} 5020 5021// (166:4) {#if timing} 5022function create_if_block_3$1(ctx) { 5023 let time; 5024 let t_value = /*format_time*/ ctx[17](/*seconds*/ ctx[14]) + ""; 5025 let t; 5026 5027 return { 5028 c() { 5029 time = element$1("time"); 5030 t = text$1(t_value); 5031 attr$1(time, "class", "duration svelte-7hmw24"); 5032 }, 5033 m(target, anchor) { 5034 insert$3(target, time, anchor); 5035 append$1(time, t); 5036 }, 5037 p(ctx, dirty) { 5038 if (dirty[0] & /*seconds*/ 16384 && t_value !== (t_value = /*format_time*/ ctx[17](/*seconds*/ ctx[14]) + "")) set_data$1(t, t_value); 5039 }, 5040 d(detaching) { 5041 if (detaching) { 5042 detach$3(time); 5043 } 5044 } 5045 }; 5046} 5047 5048// (175:1) {#if micWaveform && !recordedAudio} 5049function create_if_block_1$1(ctx) { 5050 let waveformrecordcontrols; 5051 let updating_record; 5052 let current; 5053 5054 function waveformrecordcontrols_record_binding(value) { 5055 /*waveformrecordcontrols_record_binding*/ ctx[26](value); 5056 } 5057 5058 let waveformrecordcontrols_props = { i18n: /*i18n*/ ctx[1] }; 5059 5060 if (/*record*/ ctx[7] !== void 0) { 5061 waveformrecordcontrols_props.record = /*record*/ ctx[7]; 5062 } 5063 5064 waveformrecordcontrols = new WaveformRecordControls({ props: waveformrecordcontrols_props }); 5065 binding_callbacks$2.push(() => bind$2(waveformrecordcontrols, 'record', waveformrecordcontrols_record_binding)); 5066 5067 return { 5068 c() { 5069 create_component$2(waveformrecordcontrols.$$.fragment); 5070 }, 5071 m(target, anchor) { 5072 mount_component$2(waveformrecordcontrols, target, anchor); 5073 current = true; 5074 }, 5075 p(ctx, dirty) { 5076 const waveformrecordcontrols_changes = {}; 5077 if (dirty[0] & /*i18n*/ 2) waveformrecordcontrols_changes.i18n = /*i18n*/ ctx[1]; 5078 5079 if (!updating_record && dirty[0] & /*record*/ 128) { 5080 updating_record = true; 5081 waveformrecordcontrols_changes.record = /*record*/ ctx[7]; 5082 add_flush_callback$2(() => updating_record = false); 5083 } 5084 5085 waveformrecordcontrols.$set(waveformrecordcontrols_changes); 5086 }, 5087 i(local) { 5088 if (current) return; 5089 transition_in$2(waveformrecordcontrols.$$.fragment, local); 5090 current = true; 5091 }, 5092 o(local) { 5093 transition_out$2(waveformrecordcontrols.$$.fragment, local); 5094 current = false; 5095 }, 5096 d(detaching) { 5097 destroy_component$2(waveformrecordcontrols, detaching); 5098 } 5099 }; 5100} 5101 5102// (179:1) {#if recordingWaveform && recordedAudio} 5103function create_if_block$3(ctx) { 5104 let waveformcontrols; 5105 let updating_waveform; 5106 let updating_trimDuration; 5107 let updating_mode; 5108 let current; 5109 5110 function waveformcontrols_waveform_binding(value) { 5111 /*waveformcontrols_waveform_binding*/ ctx[27](value); 5112 } 5113 5114 function waveformcontrols_trimDuration_binding(value) { 5115 /*waveformcontrols_trimDuration_binding*/ ctx[28](value); 5116 } 5117 5118 function waveformcontrols_mode_binding(value) { 5119 /*waveformcontrols_mode_binding*/ ctx[29](value); 5120 } 5121 5122 let waveformcontrols_props = { 5123 container: /*recordingContainer*/ ctx[5], 5124 playing: /*playing*/ ctx[12], 5125 audioDuration: /*audioDuration*/ ctx[13], 5126 i18n: /*i18n*/ ctx[1], 5127 interactive: true, 5128 handle_trim_audio: /*handle_trim_audio*/ ctx[18], 5129 showRedo: true, 5130 handle_reset_value: /*handle_reset_value*/ ctx[3], 5131 waveform_options: /*waveform_options*/ ctx[2] 5132 }; 5133 5134 if (/*recordingWaveform*/ ctx[4] !== void 0) { 5135 waveformcontrols_props.waveform = /*recordingWaveform*/ ctx[4]; 5136 } 5137 5138 if (/*trimDuration*/ ctx[16] !== void 0) { 5139 waveformcontrols_props.trimDuration = /*trimDuration*/ ctx[16]; 5140 } 5141 5142 if (/*mode*/ ctx[0] !== void 0) { 5143 waveformcontrols_props.mode = /*mode*/ ctx[0]; 5144 } 5145 5146 waveformcontrols = new WaveformControls({ props: waveformcontrols_props }); 5147 binding_callbacks$2.push(() => bind$2(waveformcontrols, 'waveform', waveformcontrols_waveform_binding)); 5148 binding_callbacks$2.push(() => bind$2(waveformcontrols, 'trimDuration', waveformcontrols_trimDuration_binding)); 5149 binding_callbacks$2.push(() => bind$2(waveformcontrols, 'mode', waveformcontrols_mode_binding)); 5150 5151 return { 5152 c() { 5153 create_component$2(waveformcontrols.$$.fragment); 5154 }, 5155 m(target, anchor) { 5156 mount_component$2(waveformcontrols, target, anchor); 5157 current = true; 5158 }, 5159 p(ctx, dirty) { 5160 const waveformcontrols_changes = {};
5161 if (dirty[0] & /*recordingContainer*/ 32) waveformcontrols_changes.container = /*recordingContainer*/ ctx[5]; 5162 if (dirty[0] & /*playing*/ 4096) waveformcontrols_changes.playing = /*playing*/ ctx[12]; 5163 if (dirty[0] & /*audioDuration*/ 8192) waveformcontrols_changes.audioDuration = /*audioDuration*/ ctx[13]; 5164 if (dirty[0] & /*i18n*/ 2) waveformcontrols_changes.i18n = /*i18n*/ ctx[1]; 5165 if (dirty[0] & /*handle_reset_value*/ 8) waveformcontrols_changes.handle_reset_value = /*handle_reset_value*/ ctx[3]; 5166 if (dirty[0] & /*waveform_options*/ 4) waveformcontrols_changes.waveform_options = /*waveform_options*/ ctx[2]; 5167 5168 if (!updating_waveform && dirty[0] & /*recordingWaveform*/ 16) { 5169 updating_waveform = true; 5170 waveformcontrols_changes.waveform = /*recordingWaveform*/ ctx[4]; 5171 add_flush_callback$2(() => updating_waveform = false); 5172 } 5173 5174 if (!updating_trimDuration && dirty[0] & /*trimDuration*/ 65536) { 5175 updating_trimDuration = true; 5176 waveformcontrols_changes.trimDuration = /*trimDuration*/ ctx[16]; 5177 add_flush_callback$2(() => updating_trimDuration = false); 5178 } 5179 5180 if (!updating_mode && dirty[0] & /*mode*/ 1) { 5181 updating_mode = true; 5182 waveformcontrols_changes.mode = /*mode*/ ctx[0]; 5183 add_flush_callback$2(() => updating_mode = false); 5184 } 5185 5186 waveformcontrols.$set(waveformcontrols_changes); 5187 }, 5188 i(local) { 5189 if (current) return; 5190 transition_in$2(waveformcontrols.$$.fragment, local); 5191 current = true; 5192 }, 5193 o(local) { 5194 transition_out$2(waveformcontrols.$$.fragment, local); 5195 current = false; 5196 }, 5197 d(detaching) { 5198 destroy_component$2(waveformcontrols, detaching); 5199 } 5200 }; 5201} 5202 5203function create_fragment$3(ctx) { 5204 let div2; 5205 let div0; 5206 let t0; 5207 let div1; 5208 let t1; 5209 let t2; 5210 let t3; 5211 let current; 5212 let if_block0 = (/*timing*/ ctx[15] || /*recordedAudio*/ ctx[8]) && create_if_block_2$1(ctx); 5213 let if_block1 = /*micWaveform*/ ctx[11] && !/*recordedAudio*/ ctx[8] && create_if_block_1$1(ctx); 5214 let if_block2 = /*recordingWaveform*/ ctx[4] && /*recordedAudio*/ ctx[8] && create_if_block$3(ctx); 5215 5216 return { 5217 c() { 5218 div2 = element$1("div"); 5219 div0 = element$1("div"); 5220 t0 = space$3(); 5221 div1 = element$1("div"); 5222 t1 = space$3(); 5223 if (if_block0) if_block0.c(); 5224 t2 = space$3(); 5225 if (if_block1) if_block1.c(); 5226 t3 = space$3(); 5227 if (if_block2) if_block2.c(); 5228 attr$1(div0, "class", "microphone svelte-7hmw24"); 5229 attr$1(div0, "data-testid", "microphone-waveform"); 5230 attr$1(div1, "data-testid", "recording-waveform"); 5231 attr$1(div2, "class", "component-wrapper svelte-7hmw24"); 5232 }, 5233 m(target, anchor) { 5234 insert$3(target, div2, anchor); 5235 append$1(div2, div0); 5236 /*div0_binding*/ ctx[22](div0); 5237 append$1(div2, t0); 5238 append$1(div2, div1); 5239 /*div1_binding*/ ctx[23](div1); 5240 append$1(div2, t1); 5241 if (if_block0) if_block0.m(div2, null); 5242 append$1(div2, t2); 5243 if (if_block1) if_block1.m(div2, null); 5244 append$1(div2, t3); 5245 if (if_block2) if_block2.m(div2, null); 5246 current = true; 5247 }, 5248 p(ctx, dirty) { 5249 if (/*timing*/ ctx[15] || /*recordedAudio*/ ctx[8]) { 5250 if (if_block0) { 5251 if_block0.p(ctx, dirty); 5252 } else { 5253 if_block0 = create_if_block_2$1(ctx); 5254 if_block0.c(); 5255 if_block0.m(div2, t2); 5256 } 5257 } else if (if_block0) { 5258 if_block0.d(1); 5259 if_block0 = null; 5260 } 5261 5262 if (/*micWaveform*/ ctx[11] && !/*recordedAudio*/ ctx[8]) { 5263 if (if_block1) { 5264 if_block1.p(ctx, dirty); 5265 5266 if (dirty[0] & /*micWaveform, recordedAudio*/ 2304) { 5267 transition_in$2(if_block1, 1); 5268 } 5269 } else { 5270 if_block1 = create_if_block_1$1(ctx); 5271 if_block1.c(); 5272 transition_in$2(if_block1, 1); 5273 if_block1.m(div2, t3); 5274 } 5275 } else if (if_block1) { 5276 group_outros$2(); 5277 5278 transition_out$2(if_block1, 1, 1, () => { 5279 if_block1 = null; 5280 }); 5281 5282 check_outros$2(); 5283 } 5284 5285 if (/*recordingWaveform*/ ctx[4] && /*recordedAudio*/ ctx[8]) { 5286 if (if_block2) { 5287 if_block2.p(ctx, dirty); 5288 5289 if (dirty[0] & /*recordingWaveform, recordedAudio*/ 272) { 5290 transition_in$2(if_block2, 1); 5291 } 5292 } else { 5293 if_block2 = create_if_block$3(ctx); 5294 if_block2.c(); 5295 transition_in$2(if_block2, 1); 5296 if_block2.m(div2, null); 5297 } 5298 } else if (if_block2) { 5299 group_outros$2(); 5300 5301 transition_out$2(if_block2, 1, 1, () => { 5302 if_block2 = null; 5303 }); 5304 5305 check_outros$2(); 5306 } 5307 }, 5308 i(local) { 5309 if (current) return; 5310 transition_in$2(if_block1); 5311 transition_in$2(if_block2); 5312 current = true; 5313 }, 5314 o(local) { 5315 transition_out$2(if_block1); 5316 transition_out$2(if_block2); 5317 current = false;
5318 }, 5319 d(detaching) { 5320 if (detaching) { 5321 detach$3(div2); 5322 } 5323 5324 /*div0_binding*/ ctx[22](null); 5325 /*div1_binding*/ ctx[23](null); 5326 if (if_block0) if_block0.d(); 5327 if (if_block1) if_block1.d(); 5328 if (if_block2) if_block2.d(); 5329 } 5330 }; 5331} 5332 5333function instance$3($$self, $$props, $$invalidate) { 5334 let { mode } = $$props; 5335 let { i18n } = $$props; 5336 let { dispatch_blob } = $$props; 5337 let { waveform_settings } = $$props; 5338 let { waveform_options } = $$props; 5339 let { handle_reset_value } = $$props; 5340 let micWaveform; 5341 let recordingWaveform; 5342 let playing = false; 5343 let recordingContainer; 5344 let microphoneContainer; 5345 let record; 5346 let recordedAudio = null; 5347 5348 // timestamps 5349 let timeRef; 5350 5351 let durationRef; 5352 let audioDuration; 5353 let seconds = 0; 5354 let interval; 5355 let timing = false; 5356 5357 // trimming 5358 let trimDuration = 0; 5359 5360 const start_interval = () => { 5361 clearInterval(interval); 5362 5363 $$invalidate(21, interval = setInterval( 5364 () => { 5365 $$invalidate(14, seconds++, seconds); 5366 }, 5367 1000 5368 )); 5369 }; 5370 5371 const dispatch = createEventDispatcher$1(); 5372 5373 const format_time = seconds => { 5374 const minutes = Math.floor(seconds / 60); 5375 const secondsRemainder = Math.round(seconds) % 60; 5376 const paddedSeconds = `0${secondsRemainder}`.slice(-2); 5377 return `${minutes}:${paddedSeconds}`; 5378 }; 5379 5380 const create_mic_waveform = () => { 5381 const recorder = microphoneContainer; 5382 if (recorder) recorder.innerHTML = ""; 5383 if (micWaveform !== undefined) micWaveform.destroy(); 5384 if (!recorder) return; 5385 5386 $$invalidate(11, micWaveform = WaveSurfer.create({ 5387 ...waveform_settings, 5388 normalize: false, 5389 container: recorder 5390 })); 5391 5392 $$invalidate(7, record = micWaveform.registerPlugin(r.create())); 5393 record.startMic(); 5394 }; 5395 5396 const create_recording_waveform = () => { 5397 let recording = recordingContainer; 5398 if (!recordedAudio || !recording) return; 5399 5400 $$invalidate(4, recordingWaveform = WaveSurfer.create({ 5401 container: recording, 5402 url: recordedAudio, 5403 ...waveform_settings 5404 })); 5405 }; 5406 5407 const handle_trim_audio = async (start, end) => { 5408 $$invalidate(0, mode = "edit"); 5409 const decodedData = recordingWaveform.getDecodedData(); 5410 5411 if (decodedData) await process_audio(decodedData, start, end).then(async trimmedAudio => { 5412 await dispatch_blob([trimmedAudio], "change"); 5413 await dispatch_blob([trimmedAudio], "stop_recording"); 5414 recordingWaveform.destroy(); 5415 create_recording_waveform(); 5416 }); 5417 5418 dispatch("edit"); 5419 }; 5420 5421 onMount$1(() => { 5422 create_mic_waveform(); 5423 5424 window.addEventListener("keydown", e => { 5425 if (e.key === "ArrowRight") { 5426 skipAudio(recordingWaveform, 0.1); 5427 } else if (e.key === "ArrowLeft") { 5428 skipAudio(recordingWaveform, -0.1); 5429 } 5430 }); 5431 }); 5432 5433 function div0_binding($$value) { 5434 binding_callbacks$2[$$value ? 'unshift' : 'push'](() => { 5435 microphoneContainer = $$value; 5436 $$invalidate(6, microphoneContainer); 5437 }); 5438 } 5439 5440 function div1_binding($$value) { 5441 binding_callbacks$2[$$value ? 'unshift' : 'push'](() => { 5442 recordingContainer = $$value; 5443 $$invalidate(5, recordingContainer); 5444 }); 5445 } 5446 5447 function time_binding($$value) { 5448 binding_callbacks$2[$$value ? 'unshift' : 'push'](() => { 5449 timeRef = $$value; 5450 ($$invalidate(9, timeRef), $$invalidate(4, recordingWaveform)); 5451 }); 5452 } 5453 5454 function time_binding_1($$value) { 5455 binding_callbacks$2[$$value ? 'unshift' : 'push'](() => { 5456 durationRef = $$value; 5457 ($$invalidate(10, durationRef), $$invalidate(4, recordingWaveform)); 5458 }); 5459 } 5460 5461 function waveformrecordcontrols_record_binding(value) { 5462 record = value; 5463 $$invalidate(7, record); 5464 } 5465 5466 function waveformcontrols_waveform_binding(value) { 5467 recordingWaveform = value; 5468 $$invalidate(4, recordingWaveform); 5469 } 5470 5471 function waveformcontrols_trimDuration_binding(value) { 5472 trimDuration = value; 5473 $$invalidate(16, trimDuration); 5474 } 5475 5476 function waveformcontrols_mode_binding(value) { 5477 mode = value; 5478 $$invalidate(0, mode); 5479 } 5480 5481 $$self.$$set = $$props => {
5482 if ('mode' in $$props) $$invalidate(0, mode = $$props.mode); 5483 if ('i18n' in $$props) $$invalidate(1, i18n = $$props.i18n); 5484 if ('dispatch_blob' in $$props) $$invalidate(19, dispatch_blob = $$props.dispatch_blob); 5485 if ('waveform_settings' in $$props) $$invalidate(20, waveform_settings = $$props.waveform_settings); 5486 if ('waveform_options' in $$props) $$invalidate(2, waveform_options = $$props.waveform_options); 5487 if ('handle_reset_value' in $$props) $$invalidate(3, handle_reset_value = $$props.handle_reset_value); 5488 }; 5489 5490 $$self.$$.update = () => { 5491 if ($$self.$$.dirty[0] & /*record, microphoneContainer*/ 192) { 5492 record?.on("record-start", () => { 5493 start_interval(); 5494 $$invalidate(15, timing = true); 5495 dispatch("start_recording"); 5496 let waveformCanvas = microphoneContainer; 5497 if (waveformCanvas) waveformCanvas.style.display = "block"; 5498 }); 5499 } 5500 5501 if ($$self.$$.dirty[0] & /*record, interval, dispatch_blob*/ 2621568) { 5502 record?.on("record-end", async blob => { 5503 $$invalidate(14, seconds = 0); 5504 $$invalidate(15, timing = false); 5505 clearInterval(interval); 5506 const array_buffer = await blob.arrayBuffer(); 5507 const context = new AudioContext(); 5508 const audio_buffer = await context.decodeAudioData(array_buffer); 5509 5510 if (audio_buffer) await process_audio(audio_buffer).then(async audio => { 5511 await dispatch_blob([audio], "change"); 5512 await dispatch_blob([audio], "stop_recording"); 5513 }); 5514 }); 5515 } 5516 5517 if ($$self.$$.dirty[0] & /*record, interval*/ 2097280) { 5518 record?.on("record-pause", () => { 5519 dispatch("pause_recording"); 5520 clearInterval(interval); 5521 }); 5522 } 5523 5524 if ($$self.$$.dirty[0] & /*record*/ 128) { 5525 record?.on("record-resume", () => { 5526 start_interval(); 5527 }); 5528 } 5529 5530 if ($$self.$$.dirty[0] & /*recordingWaveform, durationRef*/ 1040) { 5531 recordingWaveform?.on("decode", duration => { 5532 $$invalidate(13, audioDuration = duration); 5533 durationRef && $$invalidate(10, durationRef.textContent = format_time(duration), durationRef); 5534 }); 5535 } 5536 5537 if ($$self.$$.dirty[0] & /*recordingWaveform, timeRef*/ 528) { 5538 recordingWaveform?.on("timeupdate", currentTime => timeRef && $$invalidate(9, timeRef.textContent = format_time(currentTime), timeRef)); 5539 } 5540 5541 if ($$self.$$.dirty[0] & /*recordingWaveform*/ 16) { 5542 recordingWaveform?.on("pause", () => { 5543 dispatch("pause"); 5544 $$invalidate(12, playing = false); 5545 }); 5546 } 5547 5548 if ($$self.$$.dirty[0] & /*recordingWaveform*/ 16) { 5549 recordingWaveform?.on("play", () => { 5550 dispatch("play"); 5551 $$invalidate(12, playing = true); 5552 }); 5553 } 5554 5555 if ($$self.$$.dirty[0] & /*recordingWaveform*/ 16) { 5556 recordingWaveform?.on("finish", () => { 5557 dispatch("stop"); 5558 $$invalidate(12, playing = false); 5559 }); 5560 } 5561 5562 if ($$self.$$.dirty[0] & /*record, microphoneContainer, recordingContainer, recordedAudio*/ 480) { 5563 record?.on("record-end", blob => { 5564 $$invalidate(8, recordedAudio = URL.createObjectURL(blob)); 5565 const microphone = microphoneContainer; 5566 const recording = recordingContainer; 5567 if (microphone) microphone.style.display = "none"; 5568 5569 if (recording && recordedAudio) { 5570 recording.innerHTML = ""; 5571 create_recording_waveform(); 5572 } 5573 }); 5574 } 5575 }; 5576 5577 return [ 5578 mode, 5579 i18n, 5580 waveform_options, 5581 handle_reset_value, 5582 recordingWaveform, 5583 recordingContainer, 5584 microphoneContainer, 5585 record, 5586 recordedAudio, 5587 timeRef, 5588 durationRef, 5589 micWaveform, 5590 playing, 5591 audioDuration, 5592 seconds, 5593 timing, 5594 trimDuration, 5595 format_time, 5596 handle_trim_audio, 5597 dispatch_blob, 5598 waveform_settings, 5599 interval, 5600 div0_binding, 5601 div1_binding, 5602 time_binding, 5603 time_binding_1, 5604 waveformrecordcontrols_record_binding, 5605 waveformcontrols_waveform_binding, 5606 waveformcontrols_trimDuration_binding, 5607 waveformcontrols_mode_binding 5608 ]; 5609} 5610 5611class AudioRecorder extends SvelteComponent$3 { 5612 constructor(options) { 5613 super(); 5614 5615 init$3( 5616 this, 5617 options, 5618 instance$3, 5619 create_fragment$3, 5620 safe_not_equal$3, 5621 { 5622 mode: 0, 5623 i18n: 1, 5624 dispatch_blob: 19, 5625 waveform_settings: 20, 5626 waveform_options: 2, 5627 handle_reset_value: 3 5628 }, 5629 null,
5630 [-1, -1] 5631 ); 5632 } 5633} 5634 5635const StreamAudio_svelte_svelte_type_style_lang = ''; 5636 5637/* home/runner/work/gradio/gradio/js/audio/streaming/StreamAudio.svelte generated by Svelte v4.2.2 */ 5638const { 5639 SvelteComponent: SvelteComponent$2, 5640 append, 5641 attr, 5642 detach: detach$2, 5643 element, 5644 init: init$2, 5645 insert: insert$2, 5646 listen, 5647 noop, 5648 null_to_empty, 5649 safe_not_equal: safe_not_equal$2, 5650 set_data, 5651 set_style, 5652 space: space$2, 5653 text 5654} = window.__gradio__svelte__internal; 5655const { onMount } = window.__gradio__svelte__internal; 5656function create_else_block$2(ctx) { 5657 let button; 5658 let span1; 5659 let t0; 5660 let t1_value = /*i18n*/ ctx[4]("audio.record") + ""; 5661 let t1; 5662 let mounted; 5663 let dispose; 5664 5665 return { 5666 c() { 5667 button = element("button"); 5668 span1 = element("span"); 5669 span1.innerHTML = `<span class="dot"></span>`; 5670 t0 = space$2(); 5671 t1 = text(t1_value); 5672 attr(span1, "class", "record-icon"); 5673 attr(button, "class", "record-button svelte-16e5vwh"); 5674 }, 5675 m(target, anchor) { 5676 insert$2(target, button, anchor); 5677 append(button, span1); 5678 append(button, t0); 5679 append(button, t1); 5680 5681 if (!mounted) { 5682 dispose = listen(button, "click", /*click_handler_1*/ ctx[8]); 5683 mounted = true; 5684 } 5685 }, 5686 p(ctx, dirty) { 5687 if (dirty & /*i18n*/ 16 && t1_value !== (t1_value = /*i18n*/ ctx[4]("audio.record") + "")) set_data(t1, t1_value); 5688 }, 5689 d(detaching) { 5690 if (detaching) { 5691 detach$2(button); 5692 } 5693 5694 mounted = false; 5695 dispose(); 5696 } 5697 }; 5698} 5699 5700// (29:1) {#if recording} 5701function create_if_block$2(ctx) { 5702 let button; 5703 let span2; 5704 let t1; 5705 5706 let t2_value = (/*paused_recording*/ ctx[1] 5707 ? /*i18n*/ ctx[4]("audio.pause") 5708 : /*i18n*/ ctx[4]("audio.stop")) + ""; 5709 5710 let t2; 5711 let button_class_value; 5712 let mounted; 5713 let dispose; 5714 5715 return { 5716 c() { 5717 button = element("button"); 5718 span2 = element("span"); 5719 span2.innerHTML = `<span class="pinger"></span> <span class="dot"></span>`; 5720 t1 = space$2(); 5721 t2 = text(t2_value); 5722 attr(span2, "class", "record-icon"); 5723 5724 attr(button, "class", button_class_value = "" + (null_to_empty(/*paused_recording*/ ctx[1] 5725 ? "stop-button-paused" 5726 : "stop-button") + " svelte-16e5vwh")); 5727 }, 5728 m(target, anchor) { 5729 insert$2(target, button, anchor); 5730 append(button, span2); 5731 append(button, t1); 5732 append(button, t2); 5733 5734 if (!mounted) { 5735 dispose = listen(button, "click", /*click_handler*/ ctx[7]); 5736 mounted = true; 5737 } 5738 }, 5739 p(ctx, dirty) { 5740 if (dirty & /*paused_recording, i18n*/ 18 && t2_value !== (t2_value = (/*paused_recording*/ ctx[1] 5741 ? /*i18n*/ ctx[4]("audio.pause") 5742 : /*i18n*/ ctx[4]("audio.stop")) + "")) set_data(t2, t2_value); 5743 5744 if (dirty & /*paused_recording*/ 2 && button_class_value !== (button_class_value = "" + (null_to_empty(/*paused_recording*/ ctx[1] 5745 ? "stop-button-paused" 5746 : "stop-button") + " svelte-16e5vwh"))) { 5747 attr(button, "class", button_class_value); 5748 } 5749 }, 5750 d(detaching) { 5751 if (detaching) { 5752 detach$2(button); 5753 } 5754 5755 mounted = false; 5756 dispose(); 5757 } 5758 }; 5759} 5760 5761function create_fragment$2(ctx) { 5762 let div1; 5763 let div0; 5764 let t; 5765 5766 function select_block_type(ctx, dirty) { 5767 if (/*recording*/ ctx[0]) return create_if_block$2; 5768 return create_else_block$2; 5769 } 5770 5771 let current_block_type = select_block_type(ctx); 5772 let if_block = current_block_type(ctx); 5773 5774 return { 5775 c() { 5776 div1 = element("div"); 5777 div0 = element("div"); 5778 t = space$2(); 5779 if_block.c(); 5780 attr(div0, "id", "microphone"); 5781 set_style(div0, "display", /*recording*/ ctx[0] ? "block" : "none"); 5782 attr(div1, "class", "mic-wrap svelte-16e5vwh"); 5783 }, 5784 m(target, anchor) { 5785 insert$2(target, div1, anchor); 5786 append(div1, div0); 5787 append(div1, t); 5788 if_block.m(div1, null); 5789 }, 5790 p(ctx, [dirty]) { 5791 if (dirty & /*recording*/ 1) { 5792 set_style(div0, "display", /*recording*/ ctx[0] ? "block" : "none"); 5793 } 5794 5795 if (current_block_type === (current_block_type = select_block_type(ctx)) && if_block) { 5796 if_block.p(ctx, dirty); 5797 } else { 5798 if_block.d(1); 5799 if_block = current_block_type(ctx); 5800 5801 if (if_block) { 5802 if_block.c(); 5803 if_block.m(div1, null); 5804 } 5805 } 5806 }, 5807 i: noop, 5808 o: noop, 5809 d(detaching) { 5810 if (detaching) { 5811 detach$2(div1); 5812 } 5813 5814 if_block.d(); 5815 } 5816 }; 5817} 5818
5819function instance$2($$self, $$props, $$invalidate) { 5820 let { recording = false } = $$props; 5821 let { paused_recording = false } = $$props; 5822 let { stop } = $$props; 5823 let { record } = $$props; 5824 let { i18n } = $$props; 5825 let { waveform_settings } = $$props; 5826 let micWaveform; 5827 let waveformRecord; 5828 5829 onMount(() => { 5830 create_mic_waveform(); 5831 }); 5832 5833 const create_mic_waveform = () => { 5834 if (micWaveform !== undefined) micWaveform.destroy(); 5835 5836 micWaveform = WaveSurfer.create({ 5837 ...waveform_settings, 5838 height: 100, 5839 container: "#microphone" 5840 }); 5841 5842 $$invalidate(5, waveformRecord = micWaveform.registerPlugin(r.create())); 5843 }; 5844 5845 const click_handler = () => { 5846 waveformRecord.stopMic(); 5847 stop(); 5848 }; 5849 5850 const click_handler_1 = () => { 5851 waveformRecord.startMic(); 5852 record(); 5853 }; 5854 5855 $$self.$$set = $$props => { 5856 if ('recording' in $$props) $$invalidate(0, recording = $$props.recording); 5857 if ('paused_recording' in $$props) $$invalidate(1, paused_recording = $$props.paused_recording); 5858 if ('stop' in $$props) $$invalidate(2, stop = $$props.stop
5858); 5859 if ('record' in $$props) $$invalidate(3, record = $$props.record); 5860 if ('i18n' in $$props) $$invalidate(4, i18n = $$props.i18n); 5861 if ('waveform_settings' in $$props) $$invalidate(6, waveform_settings = $$props.waveform_settings); 5862 }; 5863 5864 return [ 5865 recording, 5866 paused_recording, 5867 stop, 5868 record, 5869 i18n, 5870 waveformRecord, 5871 waveform_settings, 5872 click_handler, 5873 click_handler_1 5874 ]; 5875} 5876 5877class StreamAudio extends SvelteComponent$2 { 5878 constructor(options) { 5879 super(); 5880 5881 init$2(this, options, instance$2, create_fragment$2, safe_not_equal$2, { 5882 recording: 0, 5883 paused_recording: 1, 5884 stop: 2, 5885 record: 3, 5886 i18n: 4, 5887 waveform_settings: 6 5888 }); 5889 } 5890} 5891 5892const { 5893 SvelteComponent: SvelteComponent$1, 5894 add_flush_callback: add_flush_callback$1, 5895 bind: bind$1, 5896 binding_callbacks: binding_callbacks$1, 5897 bubble, 5898 check_outros: check_outros$1, 5899 create_component: create_component$1, 5900 create_slot, 5901 destroy_component: destroy_component$1, 5902 detach: detach$1, 5903 empty: empty$1, 5904 get_all_dirty_from_scope, 5905 get_slot_changes, 5906 group_outros: group_outros$1, 5907 init: init$1, 5908 insert: insert$1, 5909 mount_component: mount_component$1, 5910 safe_not_equal: safe_not_equal$1, 5911 space: space$1, 5912 transition_in: transition_in$1, 5913 transition_out: transition_out$1, 5914 update_slot_base 5915} = window.__gradio__svelte__internal; 5916const { onDestroy, createEventDispatcher } = window.__gradio__svelte__internal; 5917function create_else_block_1(ctx) { 5918 let modifyupload; 5919 let t; 5920 let audioplayer; 5921 let updating_mode; 5922 let current; 5923 5924 modifyupload = new ModifyUpload({ 5925 props: { i18n: /*i18n*/ ctx[8], absolute: true } 5926 }); 5927 5928 modifyupload.$on("clear", /*clear*/ ctx[18]); 5929 modifyupload.$on("edit", /*edit_handler_1*/ ctx[29]); 5930 5931 function audioplayer_mode_binding(value) { 5932 /*audioplayer_mode_binding*/ ctx[30](value); 5933 } 5934 5935 let audioplayer_props = { 5936 value: /*value*/ ctx[1], 5937 label: /*label*/ ctx[3], 5938 i18n: /*i18n*/ ctx[8], 5939 dispatch_blob: /*dispatch_blob*/ ctx[16], 5940 waveform_settings: /*waveform_settings*/ ctx[9], 5941 waveform_options: /*waveform_options*/ ctx[11], 5942 trim_region_settings: /*trim_region_settings*/ ctx[10], 5943 handle_reset_value: /*handle_reset_value*/ ctx[12], 5944 interactive: true 5945 }; 5946 5947 if (/*mode*/ ctx[14] !== void 0) { 5948 audioplayer_props.mode = /*mode*/ ctx[14]; 5949 } 5950 5951 audioplayer = new AudioPlayer$1({ props: audioplayer_props }); 5952 binding_callbacks$1.push(() => bind$1(audioplayer, 'mode', audioplayer_mode_binding)); 5953 audioplayer.$on("stop", /*stop_handler*/ ctx[31]); 5954 audioplayer.$on("play", /*play_handler*/ ctx[32]); 5955 audioplayer.$on("pause", /*pause_handler*/ ctx[33]); 5956 audioplayer.$on("edit", /*edit_handler*/ ctx[34]); 5957 5958 return { 5959 c() { 5960 create_component$1(modifyupload.$$.fragment); 5961 t = space$1(); 5962 create_component$1(audioplayer.$$.fragment); 5963 }, 5964 m(target, anchor) { 5965 mount_component$1(modifyupload, target, anchor); 5966 insert$1(target, t, anchor); 5967 mount_component$1(audioplayer, target, anchor); 5968 current = true; 5969 }, 5970 p(ctx, dirty) { 5971 const modifyupload_changes = {}; 5972 if (dirty[0] & /*i18n*/ 256) modifyupload_changes.i18n = /*i18n*/ ctx[8]; 5973 modifyupload.$set(modifyupload_changes); 5974 const audioplayer_changes = {}; 5975 if (dirty[0] & /*value*/ 2) audioplayer_changes.value = /*value*/ ctx[1]; 5976 if (dirty[0] & /*label*/ 8) audioplayer_changes.label = /*label*/ ctx[3]; 5977 if (dirty[0] & /*i18n*/ 256) audioplayer_changes.i18n = /*i18n*/ ctx[8]; 5978 if (dirty[0] & /*waveform_settings*/ 512) audioplayer_changes.waveform_settings = /*waveform_settings*/ ctx[9]; 5979 if (dirty[0] & /*waveform_options*/ 2048) audioplayer_changes.waveform_options = /*waveform_options*/ ctx[11]; 5980 if (dirty[0] & /*trim_region_settings*/ 1024) audioplayer_changes.trim_region_settings = /*trim_region_settings*/ ctx[10]; 5981 if (dirty[0] & /*handle_reset_value*/ 4096) audioplayer_changes.handle_reset_value = /*handle_reset_value*/ ctx[12]; 5982 5983 if (!updating_mode && dirty[0] & /*mode*/ 16384) { 5984 updating_mode = true; 5985 audioplayer_changes.mode = /*mode*/ ctx[14]; 5986 add_flush_callback$1(() => updating_mode = false); 5987 } 5988 5989 audioplayer.$set(audioplayer_changes); 5990 }, 5991 i(local) { 5992 if (current) return; 5993 transition_in$1(modifyupload.$$.fragment, local); 5994 transition_in$1(audioplayer.$$.fragment, local); 5995 current = true; 5996 }, 5997 o(local) { 5998 transition_out$1(modifyupload.$$.fragment, local); 5999 transition_out$1(audioplayer.$$.fragment, local); 6000 current = false;
6001 }, 6002 d(detaching) { 6003 if (detaching) { 6004 detach$1(t); 6005 } 6006 6007 destroy_component$1(modifyupload, detaching); 6008 destroy_component$1(audioplayer, detaching); 6009 } 6010 }; 6011} 6012 6013// (163:0) {#if value === null || streaming} 6014function create_if_block$1(ctx) { 6015 let current_block_type_index; 6016 let if_block; 6017 let if_block_anchor; 6018 let current; 6019 const if_block_creators = [create_if_block_1, create_if_block_3]; 6020 const if_blocks = []; 6021 6022 function select_block_type_1(ctx, dirty) { 6023 if (/*active_source*/ ctx[2] === "microphone") return 0; 6024 if (/*active_source*/ ctx[2] === "upload") return 1; 6025 return -1; 6026 } 6027 6028 if (~(current_block_type_index = select_block_type_1(ctx))) { 6029 if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 6030 } 6031 6032 return { 6033 c() { 6034 if (if_block) if_block.c(); 6035 if_block_anchor = empty$1(); 6036 }, 6037 m(target, anchor) { 6038 if (~current_block_type_index) { 6039 if_blocks[current_block_type_index].m(target, anchor); 6040 } 6041 6042 insert$1(target, if_block_anchor, anchor); 6043 current = true; 6044 }, 6045 p(ctx, dirty) { 6046 let previous_block_index = current_block_type_index; 6047 current_block_type_index = select_block_type_1(ctx); 6048 6049 if (current_block_type_index === previous_block_index) { 6050 if (~current_block_type_index) { 6051 if_blocks[current_block_type_index].p(ctx, dirty); 6052 } 6053 } else { 6054 if (if_block) { 6055 group_outros$1(); 6056 6057 transition_out$1(if_blocks[previous_block_index], 1, 1, () => { 6058 if_blocks[previous_block_index] = null; 6059 }); 6060 6061 check_outros$1(); 6062 } 6063 6064 if (~current_block_type_index) { 6065 if_block = if_blocks[current_block_type_index]; 6066 6067 if (!if_block) { 6068 if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 6069 if_block.c(); 6070 } else { 6071 if_block.p(ctx, dirty); 6072 } 6073 6074 transition_in$1(if_block, 1); 6075 if_block.m(if_block_anchor.parentNode, if_block_anchor); 6076 } else { 6077 if_block = null; 6078 } 6079 } 6080 }, 6081 i(local) { 6082 if (current) return; 6083 transition_in$1(if_block); 6084 current = true; 6085 }, 6086 o(local) { 6087 transition_out$1(if_block); 6088 current = false; 6089 }, 6090 d(detaching) { 6091 if (detaching) { 6092 detach$1(if_block_anchor); 6093 } 6094 6095 if (~current_block_type_index) { 6096 if_blocks[current_block_type_index].d(detaching); 6097 } 6098 } 6099 }; 6100} 6101 6102// (178:38) 6103function create_if_block_3(ctx) { 6104 let upload_1; 6105 let updating_dragging; 6106 let current; 6107 6108 function upload_1_dragging_binding(value) { 6109 /*upload_1_dragging_binding*/ ctx[27](value); 6110 } 6111 6112 let upload_1_props = { 6113 filetype: "audio/aac,audio/midi,audio/mpeg,audio/ogg,audio/wav,audio/x-wav,audio/opus,audio/webm,audio/flac,audio/vnd.rn-realaudio,audio/x-ms-wma,audio/x-aiff,audio/amr,audio/*", 6114 root: /*root*/ ctx[4], 6115 include_sources: /*sources*/ ctx[6].length > 1, 6116 $$slots: { default: [create_default_slot$1] }, 6117 $$scope: { ctx } 6118 }; 6119 6120 if (/*dragging*/ ctx[0] !== void 0) { 6121 upload_1_props.dragging = /*dragging*/ ctx[0]; 6122 } 6123 6124 upload_1 = new Upload({ props: upload_1_props }); 6125 binding_callbacks$1.push(() => bind$1(upload_1, 'dragging', upload_1_dragging_binding)); 6126 upload_1.$on("load", /*handle_load*/ ctx[19]); 6127 upload_1.$on("error", /*error_handler*/ ctx[28]); 6128 6129 return { 6130 c() { 6131 create_component$1(upload_1.$$.fragment); 6132 }, 6133 m(target, anchor) { 6134 mount_component$1(upload_1, target, anchor); 6135 current = true; 6136 }, 6137 p(ctx, dirty) { 6138 const upload_1_changes = {}; 6139 if (dirty[0] & /*root*/ 16) upload_1_changes.root = /*root*/ ctx[4]; 6140 if (dirty[0] & /*sources*/ 64) upload_1_changes.include_sources = /*sources*/ ctx[6].length > 1; 6141 6142 if (dirty[1] & /*$$scope*/ 32) { 6143 upload_1_changes.$$scope = { dirty, ctx }; 6144 } 6145 6146 if (!updating_dragging && dirty[0] & /*dragging*/ 1) { 6147 updating_dragging = true; 6148 upload_1_changes.dragging = /*dragging*/ ctx[0]; 6149 add_flush_callback$1(() => updating_dragging = false); 6150 } 6151 6152 upload_1.$set(upload_1_changes); 6153 }, 6154 i(local) { 6155 if (current) return; 6156 transition_in$1(upload_1.$$.fragment, local); 6157 current = true; 6158 }, 6159 o(local) { 6160 transition_out$1(upload_1.$$.fragment, local); 6161 current = false;
6162 }, 6163 d(detaching) { 6164 destroy_component$1(upload_1, detaching); 6165 } 6166 }; 6167} 6168 6169// (164:1) {#if active_source === "microphone"} 6170function create_if_block_1(ctx) { 6171 let modifyupload; 6172 let t; 6173 let current_block_type_index; 6174 let if_block; 6175 let if_block_anchor; 6176 let current; 6177 6178 modifyupload = new ModifyUpload({ 6179 props: { i18n: /*i18n*/ ctx[8], absolute: true } 6180 }); 6181 6182 modifyupload.$on("clear", /*clear*/ ctx[18]); 6183 const if_block_creators = [create_if_block_2, create_else_block$1]; 6184 const if_blocks = []; 6185 6186 function select_block_type_2(ctx, dirty) { 6187 if (/*streaming*/ ctx[7]) return 0; 6188 return 1; 6189 } 6190 6191 current_block_type_index = select_block_type_2(ctx); 6192 if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 6193 6194 return { 6195 c() { 6196 create_component$1(modifyupload.$$.fragment); 6197 t = space$1(); 6198 if_block.c(); 6199 if_block_anchor = empty$1(); 6200 }, 6201 m(target, anchor) { 6202 mount_component$1(modifyupload, target, anchor); 6203 insert$1(target, t, anchor); 6204 if_blocks[current_block_type_index].m(target, anchor); 6205 insert$1(target, if_block_anchor, anchor); 6206 current = true; 6207 }, 6208 p(ctx, dirty) { 6209 const modifyupload_changes = {}; 6210 if (dirty[0] & /*i18n*/ 256) modifyupload_changes.i18n = /*i18n*/ ctx[8]; 6211 modifyupload.$set(modifyupload_changes); 6212 let previous_block_index = current_block_type_index; 6213 current_block_type_index = select_block_type_2(ctx); 6214 6215 if (current_block_type_index === previous_block_index) { 6216 if_blocks[current_block_type_index].p(ctx, dirty); 6217 } else { 6218 group_outros$1(); 6219 6220 transition_out$1(if_blocks[previous_block_index], 1, 1, () => { 6221 if_blocks[previous_block_index] = null; 6222 }); 6223 6224 check_outros$1(); 6225 if_block = if_blocks[current_block_type_index]; 6226 6227 if (!if_block) { 6228 if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 6229 if_block.c(); 6230 } else { 6231 if_block.p(ctx, dirty); 6232 } 6233 6234 transition_in$1(if_block, 1); 6235 if_block.m(if_block_anchor.parentNode, if_block_anchor); 6236 } 6237 }, 6238 i(local) { 6239 if (current) return; 6240 transition_in$1(modifyupload.$$.fragment, local); 6241 transition_in$1(if_block); 6242 current = true; 6243 }, 6244 o(local) { 6245 transition_out$1(modifyupload.$$.fragment, local); 6246 transition_out$1(if_block); 6247 current = false; 6248 }, 6249 d(detaching) { 6250 if (detaching) { 6251 detach$1(t); 6252 detach$1(if_block_anchor); 6253 } 6254 6255 destroy_component$1(modifyupload, detaching); 6256 if_blocks[current_block_type_index].d(detaching); 6257 } 6258 }; 6259} 6260 6261// (180:2) <Upload filetype="audio/aac,audio/midi,audio/mpeg,audio/ogg,audio/wav,audio/x-wav,audio/opus,audio/webm,audio/flac,audio/vnd.rn-realaudio,audio/x-ms-wma,audio/x-aiff,audio/amr,audio/*" on:load={handle_load} bind:dragging on:error={({ detail }) => dispatch("error", detail)} {root} include_sources={sources.length > 1} > 6262function create_default_slot$1(ctx) { 6263 let current; 6264 const default_slot_template = /*#slots*/ ctx[25].default; 6265 const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[36], null); 6266 6267 return { 6268 c() { 6269 if (default_slot) default_slot.c(); 6270 }, 6271 m(target, anchor) { 6272 if (default_slot) { 6273 default_slot.m(target, anchor); 6274 } 6275 6276 current = true; 6277 }, 6278 p(ctx, dirty) { 6279 if (default_slot) { 6280 if (default_slot.p && (!current || dirty[1] & /*$$scope*/ 32)) { 6281 update_slot_base( 6282 default_slot, 6283 default_slot_template, 6284 ctx, 6285 /*$$scope*/ ctx[36], 6286 !current 6287 ? get_all_dirty_from_scope(/*$$scope*/ ctx[36]) 6288 : get_slot_changes(default_slot_template, /*$$scope*/ ctx[36], dirty, null), 6289 null 6290 ); 6291 } 6292 } 6293 }, 6294 i(local) { 6295 if (current) return; 6296 transition_in$1(default_slot, local); 6297 current = true; 6298 }, 6299 o(local) { 6300 transition_out$1(default_slot, local); 6301 current = false; 6302 }, 6303 d(detaching) { 6304 if (default_slot) default_slot.d(detaching); 6305 } 6306 }; 6307} 6308 6309// (168:2) {:else} 6310function create_else_block$1(ctx) { 6311 let audiorecorder; 6312 let updating_mode; 6313 let current; 6314 6315 function audiorecorder_mode_binding(value) { 6316 /*audiorecorder_mode_binding*/ ctx[26](value); 6317 } 6318 6319 let audiorecorder_props = { 6320 i18n: /*i18n*/ ctx[8], 6321 dispatch_blob: /*dispatch_blob*/ ctx[16], 6322 waveform_settings: /*waveform_settings*/ ctx[9], 6323 waveform_options: /*waveform_options*/ ctx[11], 6324 handle_reset_value: /*handle_reset_value*/ ctx[12] 6325 }; 6326 6327 if (/*mode*/ ctx[14] !== void 0) { 6328 audiorecorder_props.mode = /*mode*/ ctx[14]; 6329 } 6330 6331 audiorecorder = new AudioRecorder({ props: audiorecorder_props }); 6332 binding_callbacks$1.push(() => bind$1(audiorecorder, 'mode', audiorecorder_mode_binding)); 6333 6334 return { 6335 c() { 6336 create_component$1(audiorecorder.$$.fragment); 6337 }, 6338 m(target, anchor) { 6339 mount_component$1(audiorecorder, target, anchor); 6340 current = true; 6341 }, 6342 p(ctx, dirty) { 6343 const audiorecorder_changes = {};
6344 if (dirty[0] & /*i18n*/ 256) audiorecorder_changes.i18n = /*i18n*/ ctx[8]; 6345 if (dirty[0] & /*waveform_settings*/ 512) audiorecorder_changes.waveform_settings = /*waveform_settings*/ ctx[9]; 6346 if (dirty[0] & /*waveform_options*/ 2048) audiorecorder_changes.waveform_options = /*waveform_options*/ ctx[11]; 6347 if (dirty[0] & /*handle_reset_value*/ 4096) audiorecorder_changes.handle_reset_value = /*handle_reset_value*/ ctx[12]; 6348 6349 if (!updating_mode && dirty[0] & /*mode*/ 16384) { 6350 updating_mode = true; 6351 audiorecorder_changes.mode = /*mode*/ ctx[14]; 6352 add_flush_callback$1(() => updating_mode = false); 6353 } 6354 6355 audiorecorder.$set(audiorecorder_changes); 6356 }, 6357 i(local) { 6358 if (current) return; 6359 transition_in$1(audiorecorder.$$.fragment, local); 6360 current = true; 6361 }, 6362 o(local) { 6363 transition_out$1(audiorecorder.$$.fragment, local); 6364 current = false; 6365 }, 6366 d(detaching) { 6367 destroy_component$1(audiorecorder, detaching); 6368 } 6369 }; 6370} 6371 6372// (166:2) {#if streaming} 6373function create_if_block_2(ctx) { 6374 let streamaudio; 6375 let current; 6376 6377 streamaudio = new StreamAudio({ 6378 props: { 6379 record: /*record*/ ctx[17], 6380 recording: /*recording*/ ctx[13], 6381 stop: /*stop*/ ctx[20], 6382 i18n: /*i18n*/ ctx[8], 6383 waveform_settings: /*waveform_settings*/ ctx[9] 6384 } 6385 }); 6386 6387 return { 6388 c() { 6389 create_component$1(streamaudio.$$.fragment); 6390 }, 6391 m(target, anchor) { 6392 mount_component$1(streamaudio, target, anchor); 6393 current = true; 6394 }, 6395 p(ctx, dirty) { 6396 const streamaudio_changes = {}; 6397 if (dirty[0] & /*recording*/ 8192) streamaudio_changes.recording = /*recording*/ ctx[13]; 6398 if (dirty[0] & /*i18n*/ 256) streamaudio_changes.i18n = /*i18n*/ ctx[8]; 6399 if (dirty[0] & /*waveform_settings*/ 512) streamaudio_changes.waveform_settings = /*waveform_settings*/ ctx[9]; 6400 streamaudio.$set(streamaudio_changes); 6401 }, 6402 i(local) { 6403 if (current) return; 6404 transition_in$1(streamaudio.$$.fragment, local); 6405 current = true; 6406 }, 6407 o(local) { 6408 transition_out$1(streamaudio.$$.fragment, local); 6409 current = false; 6410 }, 6411 d(detaching) { 6412 destroy_component$1(streamaudio, detaching); 6413 } 6414 }; 6415} 6416 6417function create_fragment$1(ctx) { 6418 let blocklabel; 6419 let t0; 6420 let current_block_type_index; 6421 let if_block; 6422 let t1; 6423 let selectsource; 6424 let updating_active_source; 6425 let current; 6426 6427 blocklabel = new BlockLabel({ 6428 props: { 6429 show_label: /*show_label*/ ctx[5], 6430 Icon: Music, 6431 float: /*active_source*/ ctx[2] === "upload" && /*value*/ ctx[1] === null, 6432 label: /*label*/ ctx[3] || /*i18n*/ ctx[8]("audio.audio") 6433 } 6434 }); 6435 6436 const if_block_creators = [create_if_block$1, create_else_block_1]; 6437 const if_blocks = []; 6438 6439 function select_block_type(ctx, dirty) { 6440 if (/*value*/ ctx[1] === null || /*streaming*/ ctx[7]) return 0; 6441 return 1; 6442 } 6443 6444 current_block_type_index = select_block_type(ctx); 6445 if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 6446 6447 function selectsource_active_source_binding(value) { 6448 /*selectsource_active_source_binding*/ ctx[35](value); 6449 } 6450 6451 let selectsource_props = { 6452 sources: /*sources*/ ctx[6], 6453 handle_clear: /*clear*/ ctx[18] 6454 }; 6455 6456 if (/*active_source*/ ctx[2] !== void 0) { 6457 selectsource_props.active_source = /*active_source*/ ctx[2]; 6458 } 6459 6460 selectsource = new SelectSource({ props: selectsource_props }); 6461 binding_callbacks$1.push(() => bind$1(selectsource, 'active_source', selectsource_active_source_binding)); 6462 6463 return { 6464 c() { 6465 create_component$1(blocklabel.$$.fragment); 6466 t0 = space$1(); 6467 if_block.c(); 6468 t1 = space$1(); 6469 create_component$1(selectsource.$$.fragment); 6470 }, 6471 m(target, anchor) { 6472 mount_component$1(blocklabel, target, anchor); 6473 insert$1(target, t0, anchor); 6474 if_blocks[current_block_type_index].m(target, anchor); 6475 insert$1(target, t1, anchor); 6476 mount_component$1(selectsource, target, anchor); 6477 current = true; 6478 }, 6479 p(ctx, dirty) { 6480 const blocklabel_changes = {}; 6481 if (dirty[0] & /*show_label*/ 32) blocklabel_changes.show_label = /*show_label*/ ctx[5]; 6482 if (dirty[0] & /*active_source, value*/ 6) blocklabel_changes.float = /*active_source*/ ctx[2] === "upload" && /*value*/ ctx[1] === null;
6483 if (dirty[0] & /*label, i18n*/ 264) blocklabel_changes.label = /*label*/ ctx[3] || /*i18n*/ ctx[8]("audio.audio"); 6484 blocklabel.$set(blocklabel_changes); 6485 let previous_block_index = current_block_type_index; 6486 current_block_type_index = select_block_type(ctx); 6487 6488 if (current_block_type_index === previous_block_index) { 6489 if_blocks[current_block_type_index].p(ctx, dirty); 6490 } else { 6491 group_outros$1(); 6492 6493 transition_out$1(if_blocks[previous_block_index], 1, 1, () => { 6494 if_blocks[previous_block_index] = null; 6495 }); 6496 6497 check_outros$1(); 6498 if_block = if_blocks[current_block_type_index]; 6499 6500 if (!if_block) { 6501 if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 6502 if_block.c(); 6503 } else { 6504 if_block.p(ctx, dirty); 6505 } 6506 6507 transition_in$1(if_block, 1); 6508 if_block.m(t1.parentNode, t1); 6509 } 6510 6511 const selectsource_changes = {}; 6512 if (dirty[0] & /*sources*/ 64) selectsource_changes.sources = /*sources*/ ctx[6]; 6513 6514 if (!updating_active_source && dirty[0] & /*active_source*/ 4) { 6515 updating_active_source = true; 6516 selectsource_changes.active_source = /*active_source*/ ctx[2]; 6517 add_flush_callback$1(() => updating_active_source = false); 6518 } 6519 6520 selectsource.$set(selectsource_changes); 6521 }, 6522 i(local) { 6523 if (current) return; 6524 transition_in$1(blocklabel.$$.fragment, local); 6525 transition_in$1(if_block); 6526 transition_in$1(selectsource.$$.fragment, local); 6527 current = true; 6528 }, 6529 o(local) { 6530 transition_out$1(blocklabel.$$.fragment, local); 6531 transition_out$1(if_block); 6532 transition_out$1(selectsource.$$.fragment, local); 6533 current = false; 6534 }, 6535 d(detaching) { 6536 if (detaching) { 6537 detach$1(t0); 6538 detach$1(t1); 6539 } 6540 6541 destroy_component$1(blocklabel, detaching); 6542 if_blocks[current_block_type_index].d(detaching); 6543 destroy_component$1(selectsource, detaching); 6544 } 6545 }; 6546} 6547 6548const STREAM_TIMESLICE = 500; 6549const NUM_HEADER_BYTES = 44; 6550 6551function instance$1($$self, $$props, $$invalidate) { 6552 let { $$slots: slots = {}, $$scope } = $$props; 6553 let { value = null } = $$props; 6554 let { label } = $$props; 6555 let { root } = $$props; 6556 let { show_label = true } = $$props; 6557 let { sources = ["microphone", "upload"] } = $$props; 6558 let { pending = false } = $$props; 6559 let { streaming = false } = $$props; 6560 let { i18n } = $$props; 6561 let { waveform_settings } = $$props; 6562 let { trim_region_settings = {} } = $$props; 6563 let { waveform_options = {} } = $$props; 6564 let { dragging } = $$props; 6565 let { active_source } = $$props; 6566 6567 let { handle_reset_value = () => { 6568 6569 } } = $$props; 6570 6571 // TODO: make use of this 6572 // export let type: "normal" | "numpy" = "normal"; 6573 let recording = false; 6574 6575 let recorder; 6576 let mode = ""; 6577 let header = undefined; 6578 let pending_stream = []; 6579 let submit_pending_stream_on_pending_end = false; 6580 let inited = false; 6581 let audio_chunks = []; 6582 let module_promises; 6583 6584 function get_modules() { 6585 module_promises = [ 6586 __vitePreload(() => import('./module-8d330bac.js'),true?["./module-8d330bac.js","./module-a4efca6e.js","./Index-2cec2c56.js","./index-5550136d.js","./index-449ec8c6.css","./Index-0d30506b.css"]:void 0,import.meta.url), 6587 __vitePreload(() => import('./module-698c739c.js'),true?["./module-698c739c.js","./module-a4efca6e.js"]:void 0,import.meta.url) 6588 ]; 6589 } 6590 6591 if (streaming) { 6592 get_modules(); 6593 } 6594 6595 const dispatch = createEventDispatcher(); 6596 6597 const dispatch_blob = async (blobs, event) => { 6598 let _audio_blob = new File(blobs, "audio.wav"); 6599 const val = await prepare_files([_audio_blob], event === "stream"); 6600 $$invalidate(1, value = (await upload(val, root))?.filter(Boolean)[0]); 6601 dispatch(event, value); 6602 }; 6603 6604 onDestroy(() => { 6605 if (streaming && recorder && recorder.state !== "inactive") { 6606 recorder.stop(); 6607 } 6608 }); 6609 6610 async function prepare_audio() { 6611 let stream; 6612 6613 try { 6614 stream = await navigator.mediaDevices.getUserMedia({ audio: true }); 6615 } catch(err) { 6616 if (!navigator.mediaDevices) { 6617 dispatch("error", i18n("audio.no_device_support")); 6618 return; 6619 } 6620 6621 if (err instanceof DOMException && err.name == "NotAllowedError") { 6622 dispatch("error", i18n("audio.allow_recording_access")); 6623 return; 6624 } 6625 6626 throw err; 6627 } 6628 6629 if (stream == null) return; 6630 6631 if (streaming) { 6632 const [{ MediaRecorder, register }, { connect }] = await Promise.all(module_promises); 6633 await register(await connect()); 6634 recorder = new MediaRecorder(stream, { mimeType: "audio/wav" }); 6635 recorder.addEventListener("dataavailable", handle_chunk); 6636 } else { 6637 recorder = new MediaRecorder(stream); 6638 6639 recorder.addEventListener("dataavailable", event => { 6640 audio_chunks.push(event.data); 6641 }); 6642 6643 recorder.addEventListener("stop", async () => {
6644 $$invalidate(13, recording = false); 6645 await dispatch_blob(audio_chunks, "change"); 6646 await dispatch_blob(audio_chunks, "stop_recording"); 6647 audio_chunks = []; 6648 }); 6649 } 6650 6651 inited = true; 6652 } 6653 6654 async function handle_chunk(event) { 6655 let buffer = await event.data.arrayBuffer(); 6656 let payload = new Uint8Array(buffer); 6657 6658 if (!header) { 6659 $$invalidate(22, header = new Uint8Array(buffer.slice(0, NUM_HEADER_BYTES))); 6660 payload = new Uint8Array(buffer.slice(NUM_HEADER_BYTES)); 6661 } 6662 6663 if (pending) { 6664 pending_stream.push(payload); 6665 } else { 6666 let blobParts = [header].concat(pending_stream, [payload]); 6667 dispatch_blob(blobParts, "stream"); 6668 $$invalidate(23, pending_stream = []); 6669 } 6670 } 6671 6672 async function record() { 6673 $$invalidate(13, recording = true); 6674 dispatch("start_recording"); 6675 if (!inited) await prepare_audio(); 6676 $$invalidate(22, header = undefined); 6677 6678 if (streaming) { 6679 recorder.start(STREAM_TIMESLICE); 6680 } 6681 } 6682 6683 function clear() { 6684 dispatch("change", null); 6685 dispatch("clear"); 6686 $$invalidate(14, mode = ""); 6687 $$invalidate(1, value = null); 6688 } 6689 6690 function handle_load({ detail }) { 6691 $$invalidate(1, value = detail); 6692 dispatch("change", detail); 6693 dispatch("upload", detail); 6694 } 6695 6696 function stop() { 6697 $$invalidate(13, recording = false); 6698 6699 if (streaming) { 6700 dispatch("stop_recording"); 6701 recorder.stop(); 6702 6703 if (pending) { 6704 $$invalidate(24, submit_pending_stream_on_pending_end = true); 6705 } 6706 6707 dispatch_blob(audio_chunks, "stop_recording"); 6708 dispatch("clear"); 6709 $$invalidate(14, mode = ""); 6710 } 6711 } 6712 6713 function audiorecorder_mode_binding(value) { 6714 mode = value; 6715 $$invalidate(14, mode); 6716 } 6717 6718 function upload_1_dragging_binding(value) { 6719 dragging = value; 6720 $$invalidate(0, dragging); 6721 } 6722 6723 const error_handler = ({ detail }) => dispatch("error", detail); 6724 const edit_handler_1 = () =>
6724 $$invalidate(14, mode = "edit"); 6725 6726 function audioplayer_mode_binding(value) { 6727 mode = value; 6728 $$invalidate(14, mode); 6729 } 6730 6731 function stop_handler(event) { 6732 bubble.call(this, $$self, event); 6733 } 6734 6735 function play_handler(event) { 6736 bubble.call(this, $$self, event); 6737 } 6738 6739 function pause_handler(event) { 6740 bubble.call(this, $$self, event); 6741 } 6742 6743 function edit_handler(event) { 6744 bubble.call(this, $$self, event); 6745 } 6746 6747 function selectsource_active_source_binding(value) { 6748 active_source = value; 6749 $$invalidate(2, active_source); 6750 } 6751 6752 $$self.$$set = $$props => { 6753 if ('value' in $$props) $$invalidate(1, value = $$props.value); 6754 if ('label' in $$props) $$invalidate(3, label = $$props.label); 6755 if ('root' in $$props) $$invalidate(4, root = $$props.root); 6756 if ('show_label' in $$props) $$invalidate(5, show_label = $$props.show_label); 6757 if ('sources' in $$props) $$invalidate(6, sources = $$props.sources); 6758 if ('pending' in $$props) $$invalidate(21, pending = $$props.pending); 6759 if ('streaming' in $$props) $$invalidate(7, streaming = $$props.streaming);
6760 if ('i18n' in $$props) $$invalidate(8, i18n = $$props.i18n); 6761 if ('waveform_settings' in $$props) $$invalidate(9, waveform_settings = $$props.waveform_settings); 6762 if ('trim_region_settings' in $$props) $$invalidate(10, trim_region_settings = $$props.trim_region_settings); 6763 if ('waveform_options' in $$props) $$invalidate(11, waveform_options = $$props.waveform_options); 6764 if ('dragging' in $$props) $$invalidate(0, dragging = $$props.dragging); 6765 if ('active_source' in $$props) $$invalidate(2, active_source = $$props.active_source); 6766 if ('handle_reset_value' in $$props) $$invalidate(12, handle_reset_value = $$props.handle_reset_value); 6767 if ('$$scope' in $$props) $$invalidate(36, $$scope = $$props.$$scope); 6768 }; 6769 6770 $$self.$$.update = () => { 6771 if ($$self.$$.dirty[0] & /*dragging*/ 1) { 6772 dispatch("drag", dragging); 6773 } 6774 6775 if ($$self.$$.dirty[0] & /*submit_pending_stream_on_pending_end, pending, header, pending_stream*/ 31457280) { 6776 if (submit_pending_stream_on_pending_end && pending === false) { 6777 $$invalidate(24, submit_pending_stream_on_pending_end = false); 6778 6779 if (header && pending_stream) { 6780 let blobParts = [header].concat(pending_stream); 6781 $$invalidate(23, pending_stream = []); 6782 dispatch_blob(blobParts, "stream"); 6783 } 6784 } 6785 } 6786 }; 6787 6788 return [ 6789 dragging, 6790 value, 6791 active_source, 6792 label, 6793 root, 6794 show_label, 6795 sources, 6796 streaming, 6797 i18n, 6798 waveform_settings, 6799 trim_region_settings, 6800 waveform_options, 6801 handle_reset_value, 6802 recording, 6803 mode, 6804 dispatch, 6805 dispatch_blob, 6806 record, 6807 clear, 6808 handle_load, 6809 stop, 6810 pending, 6811 header, 6812 pending_stream, 6813 submit_pending_stream_on_pending_end, 6814 slots, 6815 audiorecorder_mode_binding, 6816 upload_1_dragging_binding, 6817 error_handler, 6818 edit_handler_1, 6819 audioplayer_mode_binding, 6820 stop_handler, 6821 play_handler, 6822 pause_handler, 6823 edit_handler, 6824 selectsource_active_source_binding, 6825 $$scope 6826 ]; 6827} 6828 6829class InteractiveAudio extends SvelteComponent$1 { 6830 constructor(options) { 6831 super(); 6832 6833 init$1( 6834 this, 6835 options, 6836 instance$1, 6837 create_fragment$1, 6838 safe_not_equal$1, 6839 { 6840 value: 1, 6841 label: 3, 6842 root: 4, 6843 show_label: 5, 6844 sources: 6, 6845 pending: 21, 6846 streaming: 7, 6847 i18n: 8, 6848 waveform_settings: 9, 6849 trim_region_settings: 10, 6850 waveform_options: 11, 6851 dragging: 0, 6852 active_source: 2, 6853 handle_reset_value: 12 6854 }, 6855 null, 6856 [-1, -1] 6857 ); 6858 } 6859} 6860 6861const InteractiveAudio$1 = InteractiveAudio; 6862 6863/* home/runner/work/gradio/gradio/js/audio/Index.svelte generated by Svelte v4.2.2 */ 6864const { 6865 SvelteComponent, 6866 add_flush_callback, 6867 assign, 6868 bind, 6869 binding_callbacks, 6870 check_outros, 6871 create_component, 6872 destroy_component, 6873 detach, 6874 empty, 6875 flush, 6876 get_spread_object, 6877 get_spread_update, 6878 group_outros, 6879 init, 6880 insert, 6881 mount_component, 6882 safe_not_equal, 6883 space, 6884 transition_in, 6885 transition_out 6886} = window.__gradio__svelte__internal; 6887function create_else_block(ctx) { 6888 let block; 6889 let current; 6890 6891 block = new Block({ 6892 props: { 6893 variant: /*value*/ ctx[0] === null && /*active_source*/ ctx[20] === "upload" 6894 ? "dashed" 6895 : "solid", 6896 border_mode: /*dragging*/ ctx[21] ? "focus" : "base", 6897 padding: false, 6898 elem_id: /*elem_id*/ ctx[2], 6899 elem_classes: /*elem_classes*/ ctx[3], 6900 visible: /*visible*/ ctx[4], 6901 container: /*container*/ ctx[10], 6902 scale: /*scale*/ ctx[11], 6903 min_width: /*min_width*/ ctx[12], 6904 $$slots: { default: [create_default_slot_1] }, 6905 $$scope: { ctx } 6906 } 6907 }); 6908 6909 return { 6910 c() { 6911 create_component(block.$$.fragment); 6912 }, 6913 m(target, anchor) { 6914 mount_component(block, target, anchor); 6915 current = true; 6916 }, 6917 p(ctx, dirty) { 6918 const block_changes = {}; 6919 6920 if (dirty[0] & /*value, active_source*/ 1048577) block_changes.variant = /*value*/ ctx[0] === null && /*active_source*/ ctx[20] === "upload" 6921 ? "dashed" 6922 : "solid"; 6923 6924 if (dirty[0] & /*dragging*/ 2097152) block_changes.border_mode = /*dragging*/ ctx[21] ? "focus" : "base"; 6925 if (dirty[0] & /*elem_id*/ 4) block_changes.elem_id = /*elem_id*/ ctx[2]; 6926 if (dirty[0] & /*elem_classes*/ 8) block_changes.elem_classes = /*elem_classes*/ ctx[3];
6927 if (dirty[0] & /*visible*/ 16) block_changes.visible = /*visible*/ ctx[4]; 6928 if (dirty[0] & /*container*/ 1024) block_changes.container = /*container*/ ctx[10]; 6929 if (dirty[0] & /*scale*/ 2048) block_changes.scale = /*scale*/ ctx[11]; 6930 if (dirty[0] & /*min_width*/ 4096) block_changes.min_width = /*min_width*/ ctx[12]; 6931 6932 if (dirty[0] & /*label, show_label, _value, root, sources, active_source, pending, streaming, gradio, waveform_settings, waveform_options, dragging, value, loading_status*/ 8356803 | dirty[1] & /*$$scope*/ 131072) { 6933 block_changes.$$scope = { dirty, ctx }; 6934 } 6935 6936 block.$set(block_changes); 6937 }, 6938 i(local) { 6939 if (current) return; 6940 transition_in(block.$$.fragment, local); 6941 current = true; 6942 }, 6943 o(local) { 6944 transition_out(block.$$.fragment, local); 6945 current = false; 6946 }, 6947 d(detaching) { 6948 destroy_component(block, detaching); 6949 } 6950 }; 6951} 6952 6953// (85:0) {#if !interactive} 6954function create_if_block(ctx) { 6955 let block; 6956 let current; 6957 6958 block = new Block({ 6959 props: { 6960 variant: "solid", 6961 border_mode: /*dragging*/ ctx[21] ? "focus" : "base", 6962 padding: false, 6963 elem_id: /*elem_id*/ ctx[2], 6964 elem_classes: /*elem_classes*/ ctx[3], 6965 visible: /*visible*/ ctx[4], 6966 container: /*container*/ ctx[10], 6967 scale: /*scale*/ ctx[11], 6968 min_width: /*min_width*/ ctx[12], 6969 $$slots: { default: [create_default_slot] }, 6970 $$scope: { ctx } 6971 } 6972 }); 6973 6974 return { 6975 c() { 6976 create_component(block.$$.fragment); 6977 }, 6978 m(target, anchor) { 6979 mount_component(block, target, anchor); 6980 current = true; 6981 }, 6982 p(ctx, dirty) { 6983 const block_changes = {}; 6984 if (dirty[0] & /*dragging*/ 2097152) block_changes.border_mode = /*dragging*/ ctx[21] ? "focus" : "base"; 6985 if (dirty[0] & /*elem_id*/ 4) block_changes.elem_id = /*elem_id*/ ctx[2]; 6986 if (dirty[0] & /*elem_classes*/ 8) block_changes.elem_classes = /*elem_classes*/ ctx[3]; 6987 if (dirty[0] & /*visible*/ 16) block_changes.visible = /*visible*/ ctx[4]; 6988 if (dirty[0] & /*container*/ 1024) block_changes.container = /*container*/ ctx[10]; 6989 if (dirty[0] & /*scale*/ 2048) block_changes.scale = /*scale*/ ctx[11]; 6990 if (dirty[0] & /*min_width*/ 4096) block_changes.min_width = /*min_width*/ ctx[12]; 6991 6992 if (dirty[0] & /*gradio, show_label, show_download_button, show_share_button, _value, label, waveform_settings, waveform_options, loading_status*/ 5038722 | dirty[1] & /*$$scope*/ 131072) { 6993 block_changes.$$scope = { dirty, ctx }; 6994 } 6995 6996 block.$set(block_changes); 6997 }, 6998 i(local) { 6999 if (current) return; 7000 transition_in(block.$$.fragment, local); 7001 current = true; 7002 }, 7003 o(local) { 7004 transition_out(block.$$.fragment, local); 7005 current = false; 7006 }, 7007 d(detaching) { 7008 destroy_component(block, detaching); 7009 } 7010 }; 7011} 7012 7013// (136:2) <InteractiveAudio {label} {show_label} value={_value} on:change={({ detail }) => (value = detail)} on:stream={({ detail }) => { value = detail; gradio.dispatch("stream", value); }} on:drag={({ detail }) => (dragging = detail)} {root} {sources} {active_source} {pending} {streaming} {handle_reset_value} bind:dragging on:edit={() => gradio.dispatch("edit")} on:play={() => gradio.dispatch("play")} on:pause={() => gradio.dispatch("pause")} on:stop={() => gradio.dispatch("stop")} on:start_recording={() => gradio.dispatch("start_recording")} on:pause_recording={() => gradio.dispatch("pause_recording")} on:stop_recording={(e) => gradio.dispatch("stop_recording", e.detail)} on:upload={() => gradio.dispatch("upload")} on:clear={() => gradio.dispatch("clear")} on:error={handle_error} i18n={gradio.i18n} {waveform_settings} {waveform_options} {trim_region_settings} > 7014function create_default_slot_2(ctx) { 7015 let uploadtext; 7016 let current; 7017 7018 uploadtext = new UploadText({ 7019 props: { 7020 i18n: /*gradio*/ ctx[18].i18n, 7021 type: "audio" 7022 } 7023 }); 7024 7025 return { 7026 c() { 7027 create_component(uploadtext.$$.fragment); 7028 }, 7029 m(target, anchor) { 7030 mount_component(uploadtext, target, anchor); 7031 current = true; 7032 }, 7033 p(ctx, dirty) { 7034 const uploadtext_changes = {};
7035 if (dirty[0] & /*gradio*/ 262144) uploadtext_changes.i18n = /*gradio*/ ctx[18].i18n; 7036 uploadtext.$set(uploadtext_changes); 7037 }, 7038 i(local) { 7039 if (current) return; 7040 transition_in(uploadtext.$$.fragment, local); 7041 current = true; 7042 }, 7043 o(local) { 7044 transition_out(uploadtext.$$.fragment, local); 7045 current = false; 7046 }, 7047 d(detaching) { 7048 destroy_component(uploadtext, detaching); 7049 } 7050 }; 7051} 7052 7053// (120:1) <Block variant={value === null && active_source === "upload" ? "dashed" : "solid"} border_mode={dragging ? "focus" : "base"} padding={false} {elem_id} {elem_classes} {visible} {container} {scale} {min_width} > 7054function create_default_slot_1(ctx) { 7055 let statustracker; 7056 let t; 7057 let interactiveaudio; 7058 let updating_dragging; 7059 let current; 7060 7061 const statustracker_spread_levels = [ 7062 { 7063 autoscroll: /*gradio*/ ctx[18].autoscroll 7064 }, 7065 { i18n: /*gradio*/ ctx[18].i18n }, 7066 /*loading_status*/ ctx[1] 7067 ]; 7068 7069 let statustracker_props = {}; 7070 7071 for (let i = 0; i < statustracker_spread_levels.length; i += 1) { 7072 statustracker_props = assign(statustracker_props, statustracker_spread_levels[i]); 7073 } 7074 7075 statustracker = new Static({ props: statustracker_props }); 7076 7077 function interactiveaudio_dragging_binding(value) { 7078 /*interactiveaudio_dragging_binding*/ ctx[35](value); 7079 } 7080 7081 let interactiveaudio_props = { 7082 label: /*label*/ ctx[7], 7083 show_label: /*show_label*/ ctx[9], 7084 value: /*_value*/ ctx[19], 7085 root: /*root*/ ctx[8], 7086 sources: /*sources*/ ctx[6], 7087 active_source: /*active_source*/ ctx[20], 7088 pending: /*pending*/ ctx[16], 7089 streaming: /*streaming*/ ctx[17], 7090 handle_reset_value: /*handle_reset_value*/ ctx[23], 7091 i18n: /*gradio*/ ctx[18].i18n, 7092 waveform_settings: /*waveform_settings*/ ctx[22], 7093 waveform_options: /*waveform_options*/ ctx[15], 7094 trim_region_settings: /*trim_region_settings*/ ctx[24], 7095 $$slots: { default: [create_default_slot_2] }, 7096 $$scope: { ctx } 7097 }; 7098 7099 if (/*dragging*/ ctx[21] !== void 0) { 7100 interactiveaudio_props.dragging = /*dragging*/ ctx[21]; 7101 } 7102 7103 interactiveaudio = new InteractiveAudio$1({ props: interactiveaudio_props }); 7104 binding_callbacks.push(() => bind(interactiveaudio, 'dragging', interactiveaudio_dragging_binding)); 7105 interactiveaudio.$on("change", /*change_handler*/ ctx[36]); 7106 interactiveaudio.$on("stream", /*stream_handler*/ ctx[37]); 7107 interactiveaudio.$on("drag", /*drag_handler*/ ctx[38]); 7108 interactiveaudio.$on("edit", /*edit_handler*/ ctx[39]); 7109 interactiveaudio.$on("play", /*play_handler_1*/ ctx[40]); 7110 interactiveaudio.$on("pause", /*pause_handler_1*/ ctx[41]); 7111 interactiveaudio.$on("stop", /*stop_handler_1*/ ctx[42]); 7112 interactiveaudio.$on("start_recording", /*start_recording_handler*/ ctx[43]); 7113 interactiveaudio.$on("pause_recording", /*pause_recording_handler*/ ctx[44]); 7114 interactiveaudio.$on("stop_recording", /*stop_recording_handler*/ ctx[45]); 7115 interactiveaudio.$on("upload", /*upload_handler*/ ctx[46]); 7116 interactiveaudio.$on("clear", /*clear_handler*/ ctx[47]); 7117 interactiveaudio.$on("error", /*handle_error*/ ctx[25]); 7118 7119 return { 7120 c() { 7121 create_component(statustracker.$$.fragment); 7122 t = space(); 7123 create_component(interactiveaudio.$$.fragment); 7124 }, 7125 m(target, anchor) { 7126 mount_component(statustracker, target, anchor); 7127 insert(target, t, anchor); 7128 mount_component(interactiveaudio, target, anchor); 7129 current = true; 7130 }, 7131 p(ctx, dirty) { 7132 const statustracker_changes = (dirty[0] & /*gradio, loading_status*/ 262146) 7133 ? get_spread_update(statustracker_spread_levels, [ 7134 dirty[0] & /*gradio*/ 262144 && { 7135 autoscroll: /*gradio*/ ctx[18].autoscroll 7136 }, 7137 dirty[0] & /*gradio*/ 262144 && { i18n: /*gradio*/ ctx[18].i18n }, 7138 dirty[0] & /*loading_status*/ 2 && get_spread_object(/*loading_status*/ ctx[1]) 7139 ]) 7140 : {}; 7141 7142 statustracker.$set(statustracker_changes); 7143 const interactiveaudio_changes = {}; 7144 if (dirty[0] & /*label*/ 128) interactiveaudio_changes.label = /*label*/ ctx[7]; 7145 if (dirty[0] & /*show_label*/ 512) interactiveaudio_changes.show_label = /*show_label*/ ctx[9]; 7146 if (dirty[0] & /*_value*/ 524288) interactiveaudio_changes.value = /*_value*/ ctx[19];
7147 if (dirty[0] & /*root*/ 256) interactiveaudio_changes.root = /*root*/ ctx[8]; 7148 if (dirty[0] & /*sources*/ 64) interactiveaudio_changes.sources = /*sources*/ ctx[6]; 7149 if (dirty[0] & /*active_source*/ 1048576) interactiveaudio_changes.active_source = /*active_source*/ ctx[20]; 7150 if (dirty[0] & /*pending*/ 65536) interactiveaudio_changes.pending = /*pending*/ ctx[16]; 7151 if (dirty[0] & /*streaming*/ 131072) interactiveaudio_changes.streaming = /*streaming*/ ctx[17]; 7152 if (dirty[0] & /*gradio*/ 262144) interactiveaudio_changes.i18n = /*gradio*/ ctx[18].i18n; 7153 if (dirty[0] & /*waveform_settings*/ 4194304) interactiveaudio_changes.waveform_settings = /*waveform_settings*/ ctx[22]; 7154 if (dirty[0] & /*waveform_options*/ 32768) interactiveaudio_changes.waveform_options = /*waveform_options*/ ctx[15]; 7155 7156 if (dirty[0] & /*gradio*/ 262144 | dirty[1] & /*$$scope*/ 131072) { 7157 interactiveaudio_changes.$$scope = { dirty, ctx }; 7158 } 7159 7160 if (!updating_dragging && dirty[0] & /*dragging*/ 2097152) { 7161 updating_dragging = true; 7162 interactiveaudio_changes.dragging = /*dragging*/ ctx[21]; 7163 add_flush_callback(() => updating_dragging = false); 7164 } 7165 7166 interactiveaudio.$set(interactiveaudio_changes); 7167 }, 7168 i(local) { 7169 if (current) return; 7170 transition_in(statustracker.$$.fragment, local); 7171 transition_in(interactiveaudio.$$.fragment, local); 7172 current = true; 7173 }, 7174 o(local) { 7175 transition_out(statustracker.$$.fragment, local); 7176 transition_out(interactiveaudio.$$.fragment, local); 7177 current = false; 7178 }, 7179 d(detaching) { 7180 if (detaching) { 7181 detach(t); 7182 } 7183 7184 destroy_component(statustracker, detaching); 7185 destroy_component(interactiveaudio, detaching); 7186 } 7187 }; 7188} 7189 7190// (86:1) <Block variant={"solid"} border_mode={dragging ? "focus" : "base"} padding={false} {elem_id} {elem_classes} {visible} {container} {scale} {min_width} > 7191function create_default_slot(ctx) { 7192 let statustracker; 7193 let t; 7194 let staticaudio; 7195 let current; 7196 7197 const statustracker_spread_levels = [ 7198 { 7199 autoscroll: /*gradio*/ ctx[18].autoscroll 7200 }, 7201 { i18n: /*gradio*/ ctx[18].i18n }, 7202 /*loading_status*/ ctx[1] 7203 ]; 7204 7205 let statustracker_props = {}; 7206 7207 for (let i = 0; i < statustracker_spread_levels.length; i += 1) { 7208 statustracker_props = assign(statustracker_props, statustracker_spread_levels[i]); 7209 } 7210 7211 statustracker = new Static({ props: statustracker_props }); 7212 7213 staticaudio = new StaticAudio$1({ 7214 props: { 7215 i18n: /*gradio*/ ctx[18].i18n, 7216 show_label: /*show_label*/ ctx[9], 7217 show_download_button: /*show_download_button*/ ctx[13], 7218 show_share_button: /*show_share_button*/ ctx[14], 7219 value: /*_value*/ ctx[19], 7220 label: /*label*/ ctx[7], 7221 waveform_settings: /*waveform_settings*/ ctx[22], 7222 waveform_options: /*waveform_options*/ ctx[15] 7223 } 7224 }); 7225 7226 staticaudio.$on("share", /*share_handler*/ ctx[30]); 7227 staticaudio.$on("error", /*error_handler*/ ctx[31]); 7228 staticaudio.$on("play", /*play_handler*/ ctx[32]); 7229 staticaudio.$on("pause", /*pause_handler*/ ctx[33]); 7230 staticaudio.$on("stop", /*stop_handler*/ ctx[34]); 7231 7232 return { 7233 c() { 7234 create_component(statustracker.$$.fragment); 7235 t = space(); 7236 create_component(staticaudio.$$.fragment); 7237 }, 7238 m(target, anchor) { 7239 mount_component(statustracker, target, anchor); 7240 insert(target, t, anchor); 7241 mount_component(staticaudio, target, anchor); 7242 current = true; 7243 }, 7244 p(ctx, dirty) { 7245 const statustracker_changes = (dirty[0] & /*gradio, loading_status*/ 262146) 7246 ? get_spread_update(statustracker_spread_levels, [ 7247 dirty[0] & /*gradio*/ 262144 && { 7248 autoscroll: /*gradio*/ ctx[18].autoscroll 7249 }, 7250 dirty[0] & /*gradio*/ 262144 && { i18n: /*gradio*/ ctx[18].i18n }, 7251 dirty[0] & /*loading_status*/ 2 && get_spread_object(/*loading_status*/ ctx[1]) 7252 ]) 7253 : {}; 7254 7255 statustracker.$set(statustracker_changes); 7256 const staticaudio_changes = {}; 7257 if (dirty[0] & /*gradio*/ 262144) staticaudio_changes.i18n = /*gradio*/ ctx[18].i18n; 7258 if (dirty[0] & /*show_label*/ 512) staticaudio_changes.show_label = /*show_label*/ ctx[9]; 7259 if (dirty[0] & /*show_download_button*/ 8192) staticaudio_changes.show_download_button = /*show_download_button*/ ctx[13];
7260 if (dirty[0] & /*show_share_button*/ 16384) staticaudio_changes.show_share_button = /*show_share_button*/ ctx[14]; 7261 if (dirty[0] & /*_value*/ 524288) staticaudio_changes.value = /*_value*/ ctx[19]; 7262 if (dirty[0] & /*label*/ 128) staticaudio_changes.label = /*label*/ ctx[7]; 7263 if (dirty[0] & /*waveform_settings*/ 4194304) staticaudio_changes.waveform_settings = /*waveform_settings*/ ctx[22]; 7264 if (dirty[0] & /*waveform_options*/ 32768) staticaudio_changes.waveform_options = /*waveform_options*/ ctx[15]; 7265 staticaudio.$set(staticaudio_changes); 7266 }, 7267 i(local) { 7268 if (current) return; 7269 transition_in(statustracker.$$.fragment, local); 7270 transition_in(staticaudio.$$.fragment, local); 7271 current = true; 7272 }, 7273 o(local) { 7274 transition_out(statustracker.$$.fragment, local); 7275 transition_out(staticaudio.$$.fragment, local); 7276 current = false; 7277 }, 7278 d(detaching) { 7279 if (detaching) { 7280 detach(t); 7281 } 7282 7283 destroy_component(statustracker, detaching); 7284 destroy_component(staticaudio, detaching); 7285 } 7286 }; 7287} 7288 7289function create_fragment(ctx) { 7290 let current_block_type_index; 7291 let if_block; 7292 let if_block_anchor; 7293 let current; 7294 const if_block_creators = [create_if_block, create_else_block]; 7295 const if_blocks = []; 7296 7297 function select_block_type(ctx, dirty) { 7298 if (!/*interactive*/ ctx[5]) return 0; 7299 return 1; 7300 } 7301 7302 current_block_type_index = select_block_type(ctx); 7303 if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 7304 7305 return { 7306 c() { 7307 if_block.c(); 7308 if_block_anchor = empty(); 7309 }, 7310 m(target, anchor) { 7311 if_blocks[current_block_type_index].m(target, anchor); 7312 insert(target, if_block_anchor, anchor); 7313 current = true; 7314 }, 7315 p(ctx, dirty) { 7316 let previous_block_index = current_block_type_index; 7317 current_block_type_index = select_block_type(ctx); 7318 7319 if (current_block_type_index === previous_block_index) { 7320 if_blocks[current_block_type_index].p(ctx, dirty); 7321 } else { 7322 group_outros(); 7323 7324 transition_out(if_blocks[previous_block_index], 1, 1, () => { 7325 if_blocks[previous_block_index] = null; 7326 }); 7327 7328 check_outros(); 7329 if_block = if_blocks[current_block_type_index]; 7330 7331 if (!if_block) { 7332 if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx); 7333 if_block.c(); 7334 } else { 7335 if_block.p(ctx, dirty); 7336 } 7337 7338 transition_in(if_block, 1); 7339 if_block.m(if_block_anchor.parentNode, if_block_anchor); 7340 } 7341 }, 7342 i(local) { 7343 if (current) return; 7344 transition_in(if_block); 7345 current = true; 7346 }, 7347 o(local) { 7348 transition_out(if_block); 7349 current = false; 7350 }, 7351 d(detaching) { 7352 if (detaching) { 7353 detach(if_block_anchor); 7354 } 7355 7356 if_blocks[current_block_type_index].d(detaching); 7357 } 7358 }; 7359} 7360 7361function instance($$self, $$props, $$invalidate) { 7362 let { elem_id = "" } = $$props; 7363 let { elem_classes = [] } = $$props; 7364 let { visible = true } = $$props; 7365 let { interactive } = $$props; 7366 let { value = null } = $$props; 7367 let { sources } = $$props; 7368 let { label } = $$props; 7369 let { root } = $$props; 7370 let { show_label } = $$props; 7371 let { proxy_url } = $$props; 7372 let { container = true } = $$props; 7373 let { scale = null } = $$props; 7374 let { min_width = undefined } = $$props; 7375 let { loading_status } = $$props; 7376 let { autoplay = false } = $$props; 7377 let { show_download_button = true } = $$props; 7378 let { show_share_button = false } = $$props; 7379 let { waveform_options = {} } = $$props; 7380 let { pending } = $$props; 7381 let { streaming } = $$props; 7382 let { gradio } = $$props; 7383 let old_value = null; 7384 let _value; 7385 let active_source; 7386 let initial_value = value; 7387 7388 const handle_reset_value = () => { 7389 if (initial_value === null || value === initial_value) { 7390 return; 7391 } 7392 7393 $$invalidate(0, value = initial_value); 7394 }; 7395 7396 let dragging; 7397 let waveform_settings; 7398 7399 const trim_region_settings = { 7400 color: waveform_options.trim_region_color || "hsla(15, 85%, 40%, 0.4)", 7401 drag: true, 7402 resize: true 7403 }; 7404 7405 function handle_error({ detail }) { 7406 const [level, status] = detail.includes("Invalid file type") 7407 ? ["warning", "complete"] 7408 : ["error", "error"]; 7409
7410 $$invalidate(1, loading_status = loading_status || {}); 7411 $$invalidate(1, loading_status.status = status, loading_status); 7412 $$invalidate(1, loading_status.message = detail, loading_status); 7413 gradio.dispatch(level, detail); 7414 } 7415 7416 const share_handler = e => gradio.dispatch("share", e.detail); 7417 const error_handler = e => gradio.dispatch("error", e.detail); 7418 const play_handler = () => gradio.dispatch("play"); 7419 const pause_handler = () => gradio.dispatch("pause"); 7420 const stop_handler = () => gradio.dispatch("stop"); 7421 7422 function interactiveaudio_dragging_binding(value) { 7423 dragging = value; 7424 $$invalidate(21, dragging); 7425 } 7426 7427 const change_handler = ({ detail }) => $$invalidate(0, value = detail); 7428 7429 const stream_handler = ({ detail }) => { 7430 $$invalidate(0, value = detail); 7431 gradio.dispatch("stream", value); 7432 }; 7433 7434 const drag_handler = ({ detail }) => $$invalidate(21, dragging = detail); 7435 const edit_handler = () => gradio.dispatch("edit"); 7436 const play_handler_1 = () => gradio.dispatch("play"); 7437 const pause_handler_1 = () => gradio.dispatch("pause"); 7438 const stop_handler_1 = () => gradio.dispatch("stop"); 7439 const start_recording_handler = () => gradio.dispatch("start_recording"); 7440 const pause_recording_handler = () => gradio.dispatch("pause_recording"); 7441 const stop_recording_handler = e => gradio.dispatch("stop_recording", e.detail); 7442 const upload_handler = () => gradio.dispatch("upload"); 7443 const clear_handler = () => gradio.dispatch("clear"); 7444 7445 $$self.$$set = $$props => {
7446 if ('elem_id' in $$props) $$invalidate(2, elem_id = $$props.elem_id); 7447 if ('elem_classes' in $$props) $$invalidate(3, elem_classes = $$props.elem_classes); 7448 if ('visible' in $$props) $$invalidate(4, visible = $$props.visible); 7449 if ('interactive' in $$props) $$invalidate(5, interactive = $$props.interactive); 7450 if ('value' in $$props) $$invalidate(0, value = $$props.value); 7451 if ('sources' in $$props) $$invalidate(6, sources = $$props.sources); 7452 if ('label' in $$props) $$invalidate(7, label = $$props.label); 7453 if ('root' in $$props) $$invalidate(8, root = $$props.root); 7454 if ('show_label' in $$props) $$invalidate(9, show_label = $$props.show_label); 7455 if ('proxy_url' in $$props) $$invalidate(26, proxy_url = $$props.proxy_url); 7456 if ('container' in $$props) $$invalidate(10, container = $$props.container); 7457 if ('scale' in $$props) $$invalidate(11, scale = $$props.scale); 7458 if ('min_width' in $$props) $$invalidate(12, min_width = $$props.min_width); 7459 if ('loading_status' in $$props) $$invalidate(1, loading_status = $$props.loading_status);
7460 if ('autoplay' in $$props) $$invalidate(27, autoplay = $$props.autoplay); 7461 if ('show_download_button' in $$props) $$invalidate(13, show_download_button = $$props.show_download_button); 7462 if ('show_share_button' in $$props) $$invalidate(14, show_share_button = $$props.show_share_button); 7463 if ('waveform_options' in $$props) $$invalidate(15, waveform_options = $$props.waveform_options); 7464 if ('pending' in $$props) $$invalidate(16, pending = $$props.pending); 7465 if ('streaming' in $$props) $$invalidate(17, streaming = $$props.streaming); 7466 if ('gradio' in $$props) $$invalidate(18, gradio = $$props.gradio); 7467 }; 7468 7469 $$self.$$.update = () => { 7470 if ($$self.$$.dirty[0] & /*value, root, proxy_url*/ 67109121) { 7471 $$invalidate(19, _value = normalise_file(value, root, proxy_url)); 7472 } 7473 7474 if ($$self.$$.dirty[0] & /*value, initial_value*/ 536870913) { 7475 if (value && initial_value === null) { 7476 $$invalidate(29, initial_value = value); 7477 } 7478 } 7479 7480 if ($$self.$$.dirty[0] & /*value, old_value, gradio*/ 268697601) { 7481 { 7482 if (JSON.stringify(value) !== JSON.stringify(old_value)) { 7483 $$invalidate(28, old_value = value); 7484 gradio.dispatch("change"); 7485 } 7486 } 7487 } 7488 7489 if ($$self.$$.dirty[0] & /*sources*/ 64) { 7490 if (sources) { 7491 $$invalidate(20, active_source = sources[0]); 7492 } 7493 } 7494 7495 if ($$self.$$.dirty[0] & /*waveform_options, autoplay*/ 134250496) { 7496 $$invalidate(22, waveform_settings = { 7497 height: 50, 7498 waveColor: waveform_options.waveform_color || "#9ca3af", 7499 progressColor: waveform_options.waveform_progress_color || "#f97316", 7500 barWidth: 2, 7501 barGap: 3, 7502 cursorWidth: 2, 7503 cursorColor: "#ddd5e9", 7504 autoplay, 7505 barRadius: 10, 7506 dragToSeek: true, 7507 normalize: true, 7508 minPxPerSec: 20, 7509 mediaControls: waveform_options.show_controls 7510 }); 7511 } 7512 }; 7513 7514 return [ 7515 value, 7516 loading_status, 7517 elem_id, 7518 elem_classes, 7519 visible, 7520 interactive, 7521 sources, 7522 label, 7523 root, 7524 show_label, 7525 container, 7526 scale, 7527 min_width, 7528 show_download_button, 7529 show_share_button, 7530 waveform_options, 7531 pending, 7532 streaming, 7533 gradio, 7534 _value, 7535 active_source, 7536 dragging, 7537 waveform_settings, 7538 handle_reset_value, 7539 trim_region_settings, 7540 handle_error, 7541 proxy_url, 7542 autoplay, 7543 old_value, 7544 initial_value, 7545 share_handler, 7546 error_handler, 7547 play_handler, 7548 pause_handler, 7549 stop_handler, 7550 interactiveaudio_dragging_binding, 7551 change_handler, 7552 stream_handler, 7553 drag_handler, 7554 edit_handler, 7555 play_handler_1, 7556 pause_handler_1, 7557 stop_handler_1, 7558 start_recording_handler, 7559 pause_recording_handler, 7560 stop_recording_handler, 7561 upload_handler, 7562 clear_handler 7563 ]; 7564} 7565 7566class Index extends SvelteComponent { 7567 constructor(options) { 7568 super(); 7569 7570 init( 7571 this, 7572 options, 7573 instance, 7574 create_fragment, 7575 safe_not_equal, 7576 { 7577 elem_id: 2, 7578 elem_classes: 3, 7579 visible: 4, 7580 interactive: 5, 7581 value: 0, 7582 sources: 6, 7583 label: 7, 7584 root: 8, 7585 show_label: 9, 7586 proxy_url: 26, 7587 container: 10, 7588 scale: 11, 7589 min_width: 12, 7590 loading_status: 1, 7591 autoplay: 27, 7592 show_download_button: 13, 7593 show_share_button: 14, 7594 waveform_options: 15, 7595 pending: 16, 7596 streaming: 17, 7597 gradio: 18 7598 }, 7599 null, 7600 [-1, -1] 7601 ); 7602 } 7603 7604 get elem_id() { 7605 return this.$$.ctx[2]; 7606 } 7607 7608 set elem_id(elem_id) { 7609 this.$$set({ elem_id }); 7610 flush(); 7611 } 7612 7613 get elem_classes() { 7614 return this.$$.ctx[3]; 7615 } 7616 7617 set elem_classes(elem_classes) { 7618 this.$$set({ elem_classes }); 7619 flush(); 7620 } 7621 7622 get visible() { 7623 return this.$$.ctx[4]; 7624 } 7625 7626 set visible(visible) { 7627 this.$$set({ visible }); 7628 flush(); 7629 } 7630 7631 get interactive() { 7632 return this.$$.ctx[5]; 7633 } 7634 7635 set interactive(interactive) { 7636 this.$$set({ interactive }); 7637 flush(); 7638 } 7639 7640 get value() { 7641 return this.$$.ctx[0]; 7642 } 7643 7644 set value(value) { 7645 this.$$set({ value }); 7646 flush(); 7647 } 7648 7649 get sources() { 7650 return this.$$.ctx[6]; 7651 } 7652 7653 set sources(sources) { 7654 this.$$set({ sources }); 7655 flush(); 7656 } 7657 7658 get label() { 7659 return this.$$.ctx[7]; 7660 } 7661 7662 set label(label) { 7663 this.$$set({ label }); 7664 flush(); 7665 } 7666 7667 get root() { 7668 return this.$$.ctx[8]; 7669 } 7670 7671 set root(root) { 7672 this.$$set({ root }); 7673 flush(); 7674 } 7675 7676 get show_label() { 7677 return this.$$.ctx[9]; 7678 } 7679 7680 set show_label(show_label) { 7681 this.$$set({ show_label }); 7682 flush(); 7683 } 7684 7685 get proxy_url() { 7686 return this.$$.ctx[26]; 7687 } 7688 7689 set proxy_url(proxy_url) { 7690 this.$$set({ proxy_url }); 7691 flush(); 7692 } 7693 7694 get container() { 7695 return this.$$.ctx[10]; 7696 } 7697 7698 set container(container) { 7699 this.$$set({ container }); 7700 flush(); 7701 } 7702 7703 get scale() { 7704 return this.$$.ctx[11]; 7705 } 7706 7707 set scale(scale) { 7708 this.$$set({ scale }); 7709 flush(); 7710 } 7711 7712 get min_width() { 7713 return this.$$.ctx[12]; 7714 } 7715 7716 set min_width(min_width) { 7717 this.$$set({ min_width }); 7718 flush(); 7719 } 7720 7721 get loading_status() { 7722 return this.$$.ctx[1]; 7723 } 7724 7725 set loading_status(loading_status) { 7726 this.$$set({ loading_status }); 7727 flush(); 7728 } 7729 7730 get autoplay() { 7731 return this.$$.ctx[27]; 7732 } 7733 7734 set autoplay(autoplay) { 7735 this.$$set({ autoplay }); 7736 flush(); 7737 } 7738 7739 get show_download_button() { 7740 return this.$$.ctx[13]; 7741 } 7742 7743 set show_download_button(show_download_button) { 7744 this.$$set({ show_download_button }); 7745 flush(); 7746 } 7747 7748 get show_share_button() { 7749 return this.$$.ctx[14]; 7750 } 7751 7752 set show_share_button(show_share_button) { 7753 this.$$set({ show_share_button }); 7754 flush(); 7755 } 7756 7757 get waveform_options() { 7758 return this.$$.ctx[15]; 7759 } 7760 7761 set waveform_options(waveform_options) { 7762 this.$$set({ waveform_options }); 7763 flush(); 7764 } 7765 7766 get pending() { 7767 return this.$$.ctx[16]; 7768 } 7769 7770 set pending(pending) { 7771 this.$$set({ pending }); 7772 flush(); 7773 } 7774 7775 get streaming() { 7776 return this.$$.ctx[17]; 7777 } 7778 7779 set streaming(streaming) { 7780 this.$$set({ streaming }); 7781 flush(); 7782 } 7783 7784 get gradio() { 7785 return this.$$.ctx[18]; 7786 } 7787 7788 set gradio(gradio) { 7789 this.$$set({ gradio }); 7790 flush(); 7791 } 7792} 7793 7794const Index$1 = Index; 7795 7796export { InteractiveAudio$1 as BaseInteractiveAudio, AudioPlayer$1 as BasePlayer, StaticAudio$1 as BaseStaticAudio, Index$1 as default }; 7797//# sourceMappingURL=index-457eb9c1.js.map
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.