refactor: ♻️ play remote media stream

client/src/gui.rs

@@ -5,18 +5,17 @@ use leptos::{
     prelude::{OnAttribute, Read, Show, ShowProps, ToChildren},
     server::LocalResource,
 };
-use wasm_bindgen_futures::{JsFuture, spawn_local};
+use wasm_bindgen_futures::spawn_local;
-use web_sys::{HtmlAudioElement, MediaStreamTrack};
 
 use crate::{
-    media,
+    media::{self, get_remote_audio_stream_and_play},
     signal::{send_auth, wait_until_communication_is_ready},
     sleep,
     webrtc::WebRTC,
 };
 
 pub fn app() -> impl IntoView {
-    let audio_stream = LocalResource::new(|| media::audio());
+    let audio_stream = LocalResource::new(|| media::get_audio_stream());
     let wait_until_communication_is_ready =
         LocalResource::new(|| wait_until_communication_is_ready());
 
@@ -74,32 +73,8 @@ pub fn app() -> impl IntoView {
             let webrtc_audio = webrtc.clone();
             let play_remote_audio_button = button()
                 .on(leptos::ev::click, move |_| {
-                    let audio_element = HtmlAudioElement::new().unwrap();
+                    let webrtc_audio = webrtc_audio.clone();
-
+                    spawn_local(get_remote_audio_stream_and_play(webrtc_audio));
-                    let audio_streams = webrtc_audio.get_remote_streams().unwrap();
-                    log!("Streams = {:#?}", audio_streams);
-                    let audio_stream = audio_streams.get(0);
-                    match audio_stream {
-                        Some(audio_stream) => {
-                            audio_element.set_src_object(Some(audio_stream));
-                            let audio_tracks = audio_stream
-                                .get_audio_tracks()
-                                .iter()
-                                .map(|audio_track| MediaStreamTrack::from(audio_track))
-                                .collect::<Vec<_>>();
-                            log!("How many tracks = {}", audio_tracks.len());
-                            log!(
-                                "Constraints = {:#?}",
-                                audio_tracks.first().unwrap().get_constraints()
-                            );
-
-                            let audio_element_play_promise = audio_element.play().unwrap();
-                            spawn_local(async move {
-                                JsFuture::from(audio_element_play_promise).await.ok();
-                            });
-                        }
-                        None => todo!(),
-                    }
                 })
                 .child("Play");
 

client/src/media.rs

@@ -1,13 +1,17 @@
+use std::sync::Arc;
+
 use leptos::logging::log;
 use protocol::Error;
 use wasm_bindgen_futures::JsFuture;
 use web_sys::{
-    MediaStream, MediaStreamConstraints, MediaStreamTrack, MediaTrackConstraints,
+    HtmlAudioElement, MediaStream, MediaStreamConstraints, MediaStreamTrack, MediaTrackConstraints,
     wasm_bindgen::{JsCast, JsValue},
     window,
 };
 
-pub async fn audio() -> Result<MediaStream, Error> {
+use crate::webrtc::WebRTC;
+
+pub async fn get_audio_stream() -> Result<MediaStream, Error> {
     let media_devices = window()
         .ok_or(Error::MediaStream("Accessing Window".to_owned()))?
         .navigator()
@@ -57,3 +61,19 @@ pub async fn audio() -> Result<MediaStream, Error> {
 
     Ok(audio_stream)
 }
+
+pub async fn get_remote_audio_stream_and_play(webrtc: Arc<WebRTC>) {
+    let audio_element = HtmlAudioElement::new().unwrap();
+
+    let audio_streams = webrtc.get_remote_streams().unwrap();
+    let audio_stream = audio_streams.get(0);
+    match audio_stream {
+        Some(audio_stream) => {
+            audio_element.set_src_object(Some(audio_stream));
+
+            let audio_element_play_promise = audio_element.play().unwrap();
+            JsFuture::from(audio_element_play_promise).await.ok();
+        }
+        None => todo!(),
+    }
+}