Fixed Album art getting functionality for front end

dmp-core/src/music_storage/library.rs

@@ -476,14 +476,10 @@ impl Song {
     }
 
     pub fn album_art(&self, i: usize) -> Result<Vec<u8>, Box<dyn Error>> {
-        match self.album_art[i] {
+        match self.album_art.get(i).unwrap() {
             AlbumArt::Embedded(j) => {
                 let file = lofty::read_from_path(self.primary_uri()?.0.path())?;
-                if file.contains_tag_type(TagType::Id3v2) {
+                Ok(file.tag(file.primary_tag_type()).unwrap().pictures()[*j].data().to_vec())
-                    Ok(file.tag(TagType::Id3v2).unwrap().pictures()[j].data().to_vec())
-                } else {
-                    unimplemented!()
-                }
             },
             AlbumArt::External(ref path) => {
                 let mut buf = vec![];

src-tauri/src/lib.rs

@@ -182,7 +182,7 @@ async fn create_library(
 #[tauri::command]
     async fn lib_already_created(app: tauri::AppHandle<Wry>, lib_rx: State<'_, LibRx>, handle_tx: State<'_, HandleTx>) -> Result<(), String> {
     println!("lib already created");
-    lib_rx.inner().0.send(None);
+    lib_rx.inner().0.send(None).unwrap();
     app.manage(handle_tx.inner().0.recv().unwrap());
     Ok(())
 }

src-tauri/src/wrappers.rs

@@ -51,6 +51,7 @@ pub async fn next(app: AppHandle<Wry>, ctrl_handle: State<'_, ControllerHandle>,
     };
     let _song = _Song::from(&song);
     art_rx.0.send(song.album_art(0).unwrap()).unwrap();
+    println!("next");
     app.emit("now_playing_change", _song).unwrap();
     Ok(())
 }

src/App.tsx

@@ -4,26 +4,43 @@ import "./App.css";
 import { Config } from "./types";
 import { EventEmitter } from "@tauri-apps/plugin-shell";
 import { listen } from "@tauri-apps/api/event";
+// import { fetch } from "@tauri-apps/plugin-http";
+import { getCurrentWebviewWindow } from "@tauri-apps/api/webviewWindow";
+
+const appWindow = getCurrentWebviewWindow();
 
 function App() {
   const library = useState<JSX.Element[]>();
-  const [artwork, setArtwork] = useState<JSX.Element>(<></>);
-  const [nowPlaying, setNowPlaying] = useState<JSX.Element>(<NowPlaying title="blank" album="blank" artist="blank" artwork={ artwork }/>);
 
-  listen<any>("now_playing_change", (event) => {
+  const [nowPlaying, setNowPlaying] = useState<JSX.Element>(
-    console.log(event.payload);
+    <NowPlaying
+      title="Title"
+      album="Album"
+      artist="Artist"
+      artwork={<></>}
+    />
+  );
 
-    setNowPlaying( <NowPlaying
+  useEffect(() => {
-      title={ event.payload.tags.TrackTitle }
+    const unlisten = appWindow.listen<any>("now_playing_change", ({ event, payload }) => {
-      album={ event.payload.tags.AlbumTitle }
+        // console.log(event);
-      artist={ event.payload.tags["DISPLAY ARTIST"]}
+
-      artwork={ artwork } />)
+        setNowPlaying(
-      setArtwork( <img src="asset://localhost" id="nowPlayingArtwork" /> )
+          <NowPlaying
-  })
+            title={ payload.tags.TrackTitle }
+            album={ payload.tags.AlbumTitle }
+            artist={ payload.tags["DISPLAY ARTIST"] }
+            artwork={ <img src={convertFileSrc("abc") + "?" + payload.uuid } id="nowPlayingArtwork" alt="Now Playing Artwork" key={payload.uuid} /> }
+          />
+        )
+
+    })
+
+    return () => { unlisten.then((f) => f()) }
+  }, []);
 
   useEffect(() => {
     getConfig();
-    invoke('set_volume', { volume: "1" }).then( () => {} )
   }, [])
 
   return (
@@ -50,7 +67,7 @@ function getConfig(): any {
     if (config.libraries.libraries.length == 0) {
       newWindow()
     } else {
-      console.log("else");
+      // console.log("else");
       invoke('lib_already_created').then(() => {})
     }
   })
@@ -80,23 +97,6 @@ interface MainViewProps {
 
 function MainView({ lib_ref }: MainViewProps) {
   const [library, setLibrary] = lib_ref;
-  // useEffect(() => {
-  //   console.log(lib_ref);
-  //   console.log(typeof lib_ref);
-  //   if (typeof lib_ref.current !== "undefined") {
-
-  //     setLibrary(lib_ref.current.map((song) => {
-  //         <Song
-  //         location={ song.location }
-  //         uuid={ song.uuid }
-  //         plays={ song.plays }
-  //         duration={ song.duration }
-  //         tags={ song.tags }
-  //         />
-  //     }))
-  //   }
-
-  // }, [lib_ref])
 
   return (
     <div className="mainView">
@@ -187,11 +187,9 @@ interface NowPlayingProps {
 }
 
 function NowPlaying({ title, artist, album, artwork }: NowPlayingProps) {
-  console.log(convertFileSrc("abc"));
-
   return (
     <section className="nowPlaying">
-      { artwork }
+        { artwork }
       <h2>{ title }</h2>
       <p>{ artist }</p>
       <p>{ album }</p>
@@ -206,3 +204,10 @@ function Queue() {
     </section>
   )
 }
+
+interface CurrentArtProps {
+  uuid: number,
+}
+function CurrentArt({uuid}: CurrentArtProps) {
+  return <img src={convertFileSrc("abc") + "?" + uuid } id="nowPlayingArtwork" alt="Now Playing Artwork" key={uuid} />
+}