Function web_thread::web::yield_now_async

pub fn yield_now_async(time: YieldTime) -> YieldNowFuture 

Available on Web only.

Async version of yield_now(). This yields execution to the event loop.

Notes

This is no-op in worklets.

Example

use web_thread::web::{self, YieldTime};

while long_running_task() {
	web::yield_now_async(YieldTime::default()).await
}

Examples found in repository

examples/audio_worklet.rs (line 116)

	async fn start(
		document: Document,
		container: HtmlElement,
		start_stop_button: HtmlButtonElement,
	) {
		// Create audio context.
		let context = AudioContext::new().unwrap();

		// Some browsers don't support `TextDecoder`/`TextEncoder` in audio worklets:
		// <https://bugzilla.mozilla.org/show_bug.cgi?id=1826432>
		JsFuture::from(
			context
				.audio_worklet()
				.unwrap()
				.add_module(&url(&wasm_bindgen::link_to!(
					module = "/examples/polyfill.min.js"
				)))
				.unwrap(),
		)
		.await
		.unwrap();

		// Register thread.
		let (sender, receiver) = async_channel::bounded(1);
		context
			.clone()
			.register_thread(None, move || {
				console::log_1(&"Hello from audio worklet!".into());

				let global: AudioWorkletGlobalScope = js_sys::global().unchecked_into();
				// Register `ExampleProcessor`.
				global
					.register_processor_ext::<ExampleProcessor>("example")
					.unwrap();
				sender.try_send(()).unwrap();
			})
			.await
			.unwrap();

		// Wait until processor is registered.
		receiver.recv().await.unwrap();
		web::yield_now_async(YieldTime::UserBlocking).await;

		// Remove start button in preparation of adding new content.
		start_stop_button.remove();

		// Get output channel count.
		let channel_count = context.destination().channel_count();

		// Create table to present slider for each channel.
		let volume_table = VolumeControlTable::new(document.clone(), &container);

		// Create master volume control elements.
		let (master_builder, master_mute_callback) = volume_table.volume_control("Master");

		// Create volume control elements for every channel.
		let volumes: Rc<Vec<_>> = Rc::new(
			(0..channel_count)
				.map(|index| {
					// Create control elements.
					let (builder, mute_callback) =
						volume_table.volume_control(&format!("Channel {index}"));

					// Create callback for controlling volume.
					let slider_callback = Closure::<dyn Fn()>::new({
						let master_builder = master_builder.clone();
						let builder = builder.clone();
						move || {
							let value_string = builder.slider.value();
							builder.label.set_inner_text(&value_string);
							let value = value_string.parse().unwrap();
							builder.shared.volume.store(value, Ordering::Relaxed);

							// If the master volume is lower, we increase it, otherwise its weird
							// that master volume is lower then the highest volume.
							if master_builder.shared.volume.load(Ordering::Relaxed) < value {
								master_builder.shared.volume.store(value, Ordering::Relaxed);
								master_builder.slider.set_value(&value_string);
								master_builder.label.set_inner_text(&value_string);
							}
						}
					});
					builder
						.slider
						.set_oninput(Some(slider_callback.as_ref().unchecked_ref()));

					VolumeControl {
						slider: builder.slider,
						_slider_callback: slider_callback,
						label: builder.label,
						_mute_callback: mute_callback,
						shared: builder.shared,
					}
				})
				.collect(),
		);

		// Setup master slider callback.
		let master_slider_callback = Closure::<dyn FnMut()>::new({
			let builder = master_builder.clone();
			let volumes = Rc::clone(&volumes);
			move || {
				let value_string = builder.slider.value();
				builder.label.set_inner_text(&value_string);
				let value = value_string.parse().unwrap();
				builder.shared.volume.store(value, Ordering::Relaxed);

				for VolumeControl {
					slider,
					label,
					shared,
					..
				} in volumes.iter()
				{
					// Update values for all channels (even if we are muted).
					slider.set_value(&value_string);
					label.set_inner_text(&value_string);
					shared.volume.store(value, Ordering::Relaxed);
				}
			}
		});
		master_builder
			.slider
			.set_oninput(Some(master_slider_callback.as_ref().unchecked_ref()));

		// Setup space before frequency control.
		let br_1 = document.create_element("br").unwrap();
		container.append_child(&br_1).unwrap();

		// Frequency control elements.
		let piano = PianoControl::new(&document, &container);

		// Initialize `ExampleProcessor`.
		let data = Data {
			master: master_builder.shared,
			channels: volumes
				.iter()
				.map(|volume| Arc::clone(&volume.shared))
				.collect(),
			piano: Arc::clone(&piano.value),
		};
		let options = AudioWorkletNodeOptions::new();
		options.set_output_channel_count(&Array::of1(&channel_count.into()));
		let worklet = context
			.audio_worklet_node::<ExampleProcessor>("example", data, Some(&options))
			.unwrap();
		worklet
			.connect_with_audio_node(&context.destination())
			.unwrap();

		// Setup space before control buttons.
		let br_2 = document.create_element("br").unwrap();
		container.append_child(&br_2).unwrap();

		// Setup suspend/resume button.
		let suspend_resume_button: HtmlButtonElement =
			document.create_element("button").unwrap().unchecked_into();
		suspend_resume_button.set_inner_text("Suspend");
		let suspended = Rc::new(Cell::new(false));
		let suspend_resume_callback = Closure::<dyn Fn() -> Promise>::new({
			let button = suspend_resume_button.clone();
			let context = context.clone();
			move || {
				// Disable button during suspending or resuming.
				button.set_disabled(true);

				let button = button.clone();
				let context = context.clone();
				let suspended = Rc::clone(&suspended);
				wasm_bindgen_futures::future_to_promise(async move {
					// If context is suspended, resume.
					if suspended.get() {
						button.set_inner_text("Resuming ...");
						JsFuture::from(context.resume().unwrap()).await.unwrap();
						button.set_inner_text("Suspend");
						suspended.set(false);
					}
					// If context is running, suspend.
					else {
						button.set_inner_text("Suspending ...");
						JsFuture::from(context.suspend().unwrap()).await.unwrap();
						button.set_inner_text("Resume");
						suspended.set(true);
					}

					// Re-enable button after we finished suspending or resuming.
					button.set_disabled(false);

					Ok(JsValue::UNDEFINED)
				})
			}
		});
		suspend_resume_button.set_onclick(Some(suspend_resume_callback.as_ref().unchecked_ref()));
		container.append_child(&suspend_resume_button).unwrap();

		// Setup stop button.
		start_stop_button.set_inner_text("Stop");
		start_stop_button.set_onclick(Some(
			Closure::once_into_js({
				let container = container.clone();
				let start_stop_button = start_stop_button.clone();
				move || {
					// Disable button during stopping.
					start_stop_button.set_disabled(true);
					start_stop_button.set_inner_text("Stopping ...");
					// Disable resume button as well.
					suspend_resume_button.set_disabled(true);
					drop(suspend_resume_callback);

					wasm_bindgen_futures::future_to_promise(async move {
						// Closure audio context.
						JsFuture::from(context.close().unwrap()).await.unwrap();

						// Remove all control elements.
						volume_table.remove();
						br_1.remove();
						piano.table.remove();
						drop(piano);
						br_2.remove();
						suspend_resume_button.remove();
						drop(master_slider_callback);
						drop(master_mute_callback);
						drop(Rc::into_inner(volumes).unwrap());

						// Setup restart button.
						start_stop_button.set_onclick({
							let start_stop_button = start_stop_button.clone();
							Some(
								Closure::once_into_js(move || {
									// Disable button during restarting.
									start_stop_button.set_disabled(true);
									start_stop_button.set_inner_text("Starting ...");
									start_stop_button.set_onclick(None);

									wasm_bindgen_futures::future_to_promise(async {
										start(document, container, start_stop_button).await;
										Ok(JsValue::UNDEFINED)
									})
								})
								.as_ref()
								.unchecked_ref(),
							)
						});
						// Re-enable button after restarting.
						start_stop_button.set_disabled(false);
						start_stop_button.set_inner_text("Start");

						Ok(JsValue::UNDEFINED)
					})
				}
			})
			.as_ref()
			.unchecked_ref(),
		));
		start_stop_button.set_disabled(false);
		container.append_child(&start_stop_button).unwrap();
	}