From 122d2da700c276b3d74ccbe9fbffb175c6faabb4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Carlos=20P=C3=A9rez?= <carlos.g.perez.1992@outlook.com>
Date: Thu, 26 May 2022 20:10:50 -0300
Subject: [PATCH] Fixed a package.json error

---
 android/app/src/main/AndroidManifest.xml      |  10 +++
 .../java/tech/logica10/soniclair/Globals.java |  20 ++++--
 ...tObserver.java => IBroadcastObserver.java} |   2 +-
 .../logica10/soniclair/IMediaItemSource.java  |   9 +++
 .../tech/logica10/soniclair/MediaBrowser.java |  55 ++++++++++++++++
 .../soniclair/MediaBrowserPlugin.java         |  59 ++++++++++++++++++
 .../soniclair/MediaSessionPlugin.java         |  47 +-------------
 .../soniclair/SonicLairSessionCallbacks.java  |  48 ++++++++++++++
 .../res/drawable-hdpi/ic_stat_soniclair.png   | Bin 0 -> 675 bytes
 .../res/drawable-mdpi/ic_stat_soniclair.png   | Bin 0 -> 472 bytes
 .../res/drawable-xhdpi/ic_stat_soniclair.png  | Bin 0 -> 982 bytes
 .../res/drawable-xxhdpi/ic_stat_soniclair.png | Bin 0 -> 1392 bytes
 .../drawable-xxxhdpi/ic_stat_soniclair.png    | Bin 0 -> 2087 bytes
 build-pwa.ps1                                 |   2 +
 package-lock.json                             |  10 ---
 src/Components/Artist.tsx                     |   1 -
 src/Components/Home.tsx                       |  25 +++++---
 src/Plugins/MediaBrowser.ts                   |   8 +++
 18 files changed, 226 insertions(+), 70 deletions(-)
 rename android/app/src/main/java/tech/logica10/soniclair/{BroadcastObserver.java => IBroadcastObserver.java} (66%)
 create mode 100644 android/app/src/main/java/tech/logica10/soniclair/IMediaItemSource.java
 create mode 100644 android/app/src/main/java/tech/logica10/soniclair/MediaBrowser.java
 create mode 100644 android/app/src/main/java/tech/logica10/soniclair/MediaBrowserPlugin.java
 create mode 100644 android/app/src/main/java/tech/logica10/soniclair/SonicLairSessionCallbacks.java
 create mode 100644 android/app/src/main/res/drawable-hdpi/ic_stat_soniclair.png
 create mode 100644 android/app/src/main/res/drawable-mdpi/ic_stat_soniclair.png
 create mode 100644 android/app/src/main/res/drawable-xhdpi/ic_stat_soniclair.png
 create mode 100644 android/app/src/main/res/drawable-xxhdpi/ic_stat_soniclair.png
 create mode 100644 android/app/src/main/res/drawable-xxxhdpi/ic_stat_soniclair.png
 create mode 100644 build-pwa.ps1
 create mode 100644 src/Plugins/MediaBrowser.ts

diff --git a/android/app/src/main/AndroidManifest.xml b/android/app/src/main/AndroidManifest.xml
index 59f7ae3..2a4f7c0 100644
--- a/android/app/src/main/AndroidManifest.xml
+++ b/android/app/src/main/AndroidManifest.xml
@@ -11,6 +11,16 @@
         android:theme="@style/AppTheme"
         android:usesCleartextTraffic="true">
 
+        <!--Used by Android Auto-->
+        <meta-data android:name="com.google.android.gms.car.notification.SmallIcon"
+            android:resource="@drawable/ic_stat_soniclair" />
+
+        <service android:name=".MediaBrowser"
+            android:exported="true">
+            <intent-filter>
+                <action android:name="android.media.browse.MediaBrowserService"/>
+            </intent-filter>
+        </service>
         <activity
             android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|smallestScreenSize|screenLayout|uiMode"
             android:name="tech.logica10.soniclair.MainActivity"
diff --git a/android/app/src/main/java/tech/logica10/soniclair/Globals.java b/android/app/src/main/java/tech/logica10/soniclair/Globals.java
index 1790ecd..f65262a 100644
--- a/android/app/src/main/java/tech/logica10/soniclair/Globals.java
+++ b/android/app/src/main/java/tech/logica10/soniclair/Globals.java
@@ -1,5 +1,7 @@
 package tech.logica10.soniclair;
 
+import android.media.browse.MediaBrowser;
+
 import java.util.ArrayList;
 import java.util.List;
 
@@ -9,14 +11,16 @@ public class Globals {
     private static Globals single_instance = null;
 
     // Declaring a variable of type String
-    private List<BroadcastObserver> observers;
+    private List<IBroadcastObserver> observers;
+    private ArrayList<MediaBrowser.MediaItem> mediaItems;
 
     // Constructor
     // Here we will be creating private constructor
     // restricted to this class itself
     private Globals()
     {
-        observers = new ArrayList<BroadcastObserver>();
+        mediaItems = new ArrayList<MediaBrowser.MediaItem>();
+        observers = new ArrayList<IBroadcastObserver>();
     }
 
     // Static method
@@ -29,13 +33,21 @@ public class Globals {
         return single_instance;
     }
 
-    public static void RegisterObserver(BroadcastObserver observer){
+    public static void RegisterObserver(IBroadcastObserver observer){
         getInstance().observers.add(observer);
     }
 
     public static void NotifyObservers(String action){
-        for (BroadcastObserver observer : getInstance().observers) {
+        for (IBroadcastObserver observer : getInstance().observers) {
             observer.update(action);
         }
     }
+
+    public static ArrayList<MediaBrowser.MediaItem> GetMediaItems(){
+        return getInstance().mediaItems;
+    }
+
+    public static void SetMediaItems(ArrayList<MediaBrowser.MediaItem> mediaItemArray) {
+        getInstance().mediaItems = mediaItemArray;
+    }
 }
diff --git a/android/app/src/main/java/tech/logica10/soniclair/BroadcastObserver.java b/android/app/src/main/java/tech/logica10/soniclair/IBroadcastObserver.java
similarity index 66%
rename from android/app/src/main/java/tech/logica10/soniclair/BroadcastObserver.java
rename to android/app/src/main/java/tech/logica10/soniclair/IBroadcastObserver.java
index b8d122b..6359680 100644
--- a/android/app/src/main/java/tech/logica10/soniclair/BroadcastObserver.java
+++ b/android/app/src/main/java/tech/logica10/soniclair/IBroadcastObserver.java
@@ -1,5 +1,5 @@
 package tech.logica10.soniclair;
 
-public interface BroadcastObserver {
+public interface IBroadcastObserver {
     public void update(String action);
 }
diff --git a/android/app/src/main/java/tech/logica10/soniclair/IMediaItemSource.java b/android/app/src/main/java/tech/logica10/soniclair/IMediaItemSource.java
new file mode 100644
index 0000000..2448910
--- /dev/null
+++ b/android/app/src/main/java/tech/logica10/soniclair/IMediaItemSource.java
@@ -0,0 +1,9 @@
+package tech.logica10.soniclair;
+
+import android.media.browse.MediaBrowser;
+
+import java.util.ArrayList;
+
+public interface IMediaItemSource {
+    public ArrayList<MediaBrowser.MediaItem> getItems();
+}
diff --git a/android/app/src/main/java/tech/logica10/soniclair/MediaBrowser.java b/android/app/src/main/java/tech/logica10/soniclair/MediaBrowser.java
new file mode 100644
index 0000000..20decf6
--- /dev/null
+++ b/android/app/src/main/java/tech/logica10/soniclair/MediaBrowser.java
@@ -0,0 +1,55 @@
+package tech.logica10.soniclair;
+
+import android.media.session.MediaSession;
+import android.media.session.PlaybackState;
+import android.os.Bundle;
+import android.service.media.MediaBrowserService;
+import android.text.TextUtils;
+
+import androidx.annotation.NonNull;
+import androidx.annotation.Nullable;
+
+import java.util.ArrayList;
+import java.util.List;
+
+public class MediaBrowser extends MediaBrowserService {
+    private static final String MY_MEDIA_ROOT_ID = "media_root_id";
+    private static final String MY_EMPTY_MEDIA_ROOT_ID = "empty_root_id";
+
+    private MediaSession mediaSession;
+    private PlaybackState.Builder stateBuilder;
+
+    @Override
+    public void onCreate() {
+        super.onCreate();
+
+        // Create a MediaSessionCompat
+        mediaSession = new MediaSession(MainActivity.context, "SONICLAIR");
+
+//        // Set an initial PlaybackState with ACTION_PLAY, so media buttons can start the player
+//        stateBuilder = new PlaybackState.Builder()
+//                .setActions(
+//                        PlaybackStateCompat.ACTION_PLAY |
+//                                PlaybackStateCompat.ACTION_PLAY_PAUSE);
+        mediaSession.setPlaybackState(stateBuilder.build());
+
+        // MySessionCallback() has methods that handle callbacks from a media controller
+        mediaSession.setCallback(new SonicLairSessionCallbacks());
+
+        // Set the session's token so that client activities can communicate with it.
+        setSessionToken(mediaSession.getSessionToken());
+    }
+
+    @Nullable
+    @Override
+    public BrowserRoot onGetRoot(@NonNull String clientPackageName, int clientUid, @Nullable Bundle rootHints) {
+        return new BrowserRoot("sonicLairRoot",null);
+    }
+
+    @Override
+    public void onLoadChildren(@NonNull String parentMediaId, @NonNull Result<List<android.media.browse.MediaBrowser.MediaItem>> result) {
+            // Assume for example that the music catalog is already loaded/cached.
+            List<android.media.browse.MediaBrowser.MediaItem> mediaItems = Globals.GetMediaItems();
+            result.sendResult(mediaItems);
+    }
+}
diff --git a/android/app/src/main/java/tech/logica10/soniclair/MediaBrowserPlugin.java b/android/app/src/main/java/tech/logica10/soniclair/MediaBrowserPlugin.java
new file mode 100644
index 0000000..9d2c1a1
--- /dev/null
+++ b/android/app/src/main/java/tech/logica10/soniclair/MediaBrowserPlugin.java
@@ -0,0 +1,59 @@
+package tech.logica10.soniclair;
+
+import android.graphics.Bitmap;
+import android.media.MediaDescription;
+import android.media.browse.MediaBrowser;
+import android.net.Uri;
+
+import com.bumptech.glide.Glide;
+import com.bumptech.glide.request.FutureTarget;
+import com.getcapacitor.JSArray;
+import com.getcapacitor.Plugin;
+import com.getcapacitor.PluginCall;
+import com.getcapacitor.PluginMethod;
+
+import org.json.JSONException;
+
+import java.util.ArrayList;
+import java.util.List;
+import java.util.concurrent.ExecutionException;
+
+public class MediaBrowserPlugin extends Plugin {
+    ArrayList<MediaBrowser.MediaItem> mediaItems;
+
+    @Override
+    public void load(){
+        mediaItems = new ArrayList<>();
+    }
+
+    @PluginMethod
+    public void loadItems(PluginCall call) throws JSONException, ExecutionException, InterruptedException {
+        JSArray array = call.getArray("items");
+        List<MediaItemJson> itemArray = array.toList();
+        ArrayList<MediaBrowser.MediaItem> mediaItemArray = new ArrayList<MediaBrowser.MediaItem>();
+        MediaDescription.Builder builder = new MediaDescription.Builder();
+        for(MediaItemJson item: itemArray){
+            builder.setTitle(item.song);
+            builder.setSubtitle(String.format("by %s", item.artist));
+            Uri albumArtUri = Uri.parse(item.albumArt);
+            FutureTarget<Bitmap> futureBitmap = Glide.with(MainActivity.context)
+                    .asBitmap()
+                    .load(albumArtUri)
+                    .submit();
+            Bitmap albumArtBitmap = futureBitmap.get();
+            builder.setIconBitmap(albumArtBitmap);
+            builder.setMediaId(item.id);
+            mediaItemArray.add(new MediaBrowser.MediaItem(builder.build(), MediaBrowser.MediaItem.FLAG_PLAYABLE));
+        }
+        Globals.SetMediaItems(mediaItemArray);
+    }
+}
+
+class MediaItemJson{
+    public String artist;
+    public String album;
+    public String albumArt;
+    public String song;
+    public float duration;
+    public String id;
+}
\ No newline at end of file
diff --git a/android/app/src/main/java/tech/logica10/soniclair/MediaSessionPlugin.java b/android/app/src/main/java/tech/logica10/soniclair/MediaSessionPlugin.java
index 9d5b738..6850c73 100644
--- a/android/app/src/main/java/tech/logica10/soniclair/MediaSessionPlugin.java
+++ b/android/app/src/main/java/tech/logica10/soniclair/MediaSessionPlugin.java
@@ -12,7 +12,6 @@ import android.media.MediaMetadata;
 import android.media.session.MediaSession;
 import android.media.session.PlaybackState;
 import android.net.Uri;
-import android.view.KeyEvent;
 
 import com.bumptech.glide.Glide;
 import com.bumptech.glide.request.FutureTarget;
@@ -26,7 +25,7 @@ import java.util.Locale;
 import java.util.concurrent.ExecutionException;
 
 @CapacitorPlugin(name = "MediaSession")
-public class MediaSessionPlugin extends Plugin implements BroadcastObserver {
+public class MediaSessionPlugin extends Plugin implements IBroadcastObserver {
 
     private MediaSession mediaSession;
     private Notification.Style mediaStyle;
@@ -105,6 +104,7 @@ public class MediaSessionPlugin extends Plugin implements BroadcastObserver {
         call.resolve();
     }
 
+    @PluginMethod()
     public void pause(PluginCall call) {
         stateBuilder.setState(PlaybackState.STATE_PAUSED, PlaybackState.PLAYBACK_POSITION_UNKNOWN, 1);
         mediaSession.setPlaybackState(stateBuilder.build());
@@ -127,7 +127,7 @@ public class MediaSessionPlugin extends Plugin implements BroadcastObserver {
         metadataBuilder.putString(MediaMetadata.METADATA_KEY_ARTIST, call.getString("artist"));
         metadataBuilder.putString(MediaMetadata.METADATA_KEY_TITLE, call.getString("song"));
         mediaSession.setMetadata(metadataBuilder.build());
-        notificationBuilder.setSmallIcon(R.mipmap.ic_launcher);
+        notificationBuilder.setSmallIcon(R.drawable.ic_stat_soniclair);
         notificationBuilder.setLargeIcon(albumArtBitmap);
         notificationBuilder.setContentTitle(call.getString("song"));
         notificationBuilder.setContentText(call.getString("album"));
@@ -146,48 +146,7 @@ public class MediaSessionPlugin extends Plugin implements BroadcastObserver {
     }
 
 
-    private class SonicLairSessionCallbacks extends MediaSession.Callback {
-        @Override
-        public void onPlay() {
-            super.onPlay();
-            Globals.NotifyObservers("SLPAUSE");
-        }
 
-        public void onPause() {
-            super.onPause();
-            Globals.NotifyObservers("SLPAUSE");
-        }
-
-        @Override
-        public void onSkipToNext() {
-            super.onSkipToNext();
-            Globals.NotifyObservers("SLNEXT");
-        }
-
-        @Override
-        public void onSkipToPrevious() {
-            super.onSkipToPrevious();
-            Globals.NotifyObservers("SLPREV");
-        }
-
-        @Override
-        public boolean onMediaButtonEvent(Intent mediaButtonIntent){
-            KeyEvent ke = mediaButtonIntent.getParcelableExtra(Intent.EXTRA_KEY_EVENT);
-            if (ke != null && ke.getAction() == KeyEvent.ACTION_DOWN) {
-                int keyCode = ke.getKeyCode();
-                if(keyCode == KeyEvent.KEYCODE_MEDIA_PLAY || keyCode == KeyEvent.KEYCODE_MEDIA_PAUSE || keyCode == KeyEvent.KEYCODE_MEDIA_PLAY_PAUSE){
-                    Globals.NotifyObservers("SLPAUSE");
-                }
-                else if(keyCode == KeyEvent.KEYCODE_MEDIA_NEXT){
-                    Globals.NotifyObservers("SLNEXT");
-                }
-                else if(keyCode == KeyEvent.KEYCODE_MEDIA_PREVIOUS){
-                    Globals.NotifyObservers("SLPREV");
-                }
-            }
-            return true;
-        }
-    }
 
 
 }
diff --git a/android/app/src/main/java/tech/logica10/soniclair/SonicLairSessionCallbacks.java b/android/app/src/main/java/tech/logica10/soniclair/SonicLairSessionCallbacks.java
new file mode 100644
index 0000000..15f25a2
--- /dev/null
+++ b/android/app/src/main/java/tech/logica10/soniclair/SonicLairSessionCallbacks.java
@@ -0,0 +1,48 @@
+package tech.logica10.soniclair;
+
+import android.content.Intent;
+import android.media.session.MediaSession;
+import android.view.KeyEvent;
+
+public class SonicLairSessionCallbacks extends MediaSession.Callback {
+    @Override
+    public void onPlay() {
+        super.onPlay();
+        Globals.NotifyObservers("SLPAUSE");
+    }
+
+    public void onPause() {
+        super.onPause();
+        Globals.NotifyObservers("SLPAUSE");
+    }
+
+    @Override
+    public void onSkipToNext() {
+        super.onSkipToNext();
+        Globals.NotifyObservers("SLNEXT");
+    }
+
+    @Override
+    public void onSkipToPrevious() {
+        super.onSkipToPrevious();
+        Globals.NotifyObservers("SLPREV");
+    }
+
+    @Override
+    public boolean onMediaButtonEvent(Intent mediaButtonIntent){
+        KeyEvent ke = mediaButtonIntent.getParcelableExtra(Intent.EXTRA_KEY_EVENT);
+        if (ke != null && ke.getAction() == KeyEvent.ACTION_DOWN) {
+            int keyCode = ke.getKeyCode();
+            if(keyCode == KeyEvent.KEYCODE_MEDIA_PLAY || keyCode == KeyEvent.KEYCODE_MEDIA_PAUSE || keyCode == KeyEvent.KEYCODE_MEDIA_PLAY_PAUSE){
+                Globals.NotifyObservers("SLPAUSE");
+            }
+            else if(keyCode == KeyEvent.KEYCODE_MEDIA_NEXT){
+                Globals.NotifyObservers("SLNEXT");
+            }
+            else if(keyCode == KeyEvent.KEYCODE_MEDIA_PREVIOUS){
+                Globals.NotifyObservers("SLPREV");
+            }
+        }
+        return true;
+    }
+}
\ No newline at end of file
diff --git a/android/app/src/main/res/drawable-hdpi/ic_stat_soniclair.png b/android/app/src/main/res/drawable-hdpi/ic_stat_soniclair.png
new file mode 100644
index 0000000000000000000000000000000000000000..a220c3a2f485eb20dec2f2b27ef282fc521a2e62
GIT binary patch
literal 675
zcmV;U0$lxxP)<h;3K|Lk000e1NJLTq001Na001Ni1^@s6;Q*MJ00001b5ch_0Itp)
z=>Px%T}ebiR9Hvtmd%S!VHn1Lm#-v}uP9Q&h=hgE6th7VQln%e3k!e4m=f8@lAWb2
zH6n>DEG%YfN<zwKrbr|tnUSwc_jIO?Gw=JJ^PcyNro7MYoclh{{X5rlJ@@m7Nj5ae
zcxVIVtw>v;|5G8`+kuyoUgs&07q7%awyy#2B^}8tm=|vu$o4+qD)0-~E$Mb%(MIu>
zfNakI9sp~SB9DQMlD?OPY8B`>a4J*$jHI6QJKM{FEkHNWBk5H=;L<?07Xr_LxtYno
z0h@t2Ko@WbSf9#SCF#XP0EKVDKiTm+@zeA=MXLj{eFC@y%mfC3sWpmz1&#sdQn6tm
zmZ<|+U5P@rX9FLAF!B$eo&o{X3!DYs0`q}+l7?-^PVA@(=xO|2f!z~81HjHy?x3Wt
zl>ylfQ$8#J6DhTTeggLrv$wWnNv|0Jrj!Kg2X+Bpk~vy4we6EYn7PRK3{1-`*(^yT
zwvPhmflZR`m)iEW7Xj~}(9N<_(tz#gKbKP;>XvjR0BnCuI(c)A(e^Un6L1UYEFjI0
zq!nX%w)=qn$#eMUCa?h52880Vga;+P$<95lQ`?T-au-+vEG_^ODY2b*Na|0HiAO-R
ziCQCa!;gKE4io`83|uG(l1_`=^#oX1<2b1|U6-Ug>EK@q*<K37iCypSN^my(WC&On
zrXS170$ofF!>S86ny**V>2W}|_W(EkB}q~%ZU-AAJ&Wg2g=~j`V=apu4HLn9UDDn(
zP&BMKi5rczP3*d+p(TxqQ~H9|bj5-nw1M)3YAe)MC{KaB_#baHx+P*Zeq;au002ov
JPDHLkV1kTFEx-T(

literal 0
HcmV?d00001

diff --git a/android/app/src/main/res/drawable-mdpi/ic_stat_soniclair.png b/android/app/src/main/res/drawable-mdpi/ic_stat_soniclair.png
new file mode 100644
index 0000000000000000000000000000000000000000..2fbd8e4b609a38b168d10e2bc7688f7bceb50af7
GIT binary patch
literal 472
zcmV;}0Vn>6P)<h;3K|Lk000e1NJLTq000;O000;W1^@s6;CDUv00001b5ch_0Itp)
z=>Px$l1W5CR7gwh)IX@sVH5}O&yh$`{%tOUMOd!Ipp>#%)RjTXDrFLxWFeC**pyjW
z3}n0}QYOhlE*Wiv!qLg|*6+UWeZ4<j?{-f;({s-Gp7TB5bHbD@rkvjjz(j_7Q<RzI
zdj_9yFCubccKXjCGk4+<e&R?(y!+n(mr<|mYD8Sh%+=V0U6_rCo5P^JD9X&;c!muv
z!53V?Va#A#{YAt`zP|!w<}6m>Iu3QJ`-T@d&?x(e?GaJFi)<`FW^TdrR`o^{9RsTl
zo)#@whts$d5o>z^G{s!NwbsFKTmigCQTHA9aXcc{^aWUt*Nxky#L@*gfrBOCUKBND
z+{MWyGM7Zp;U!8j)j_=~XdYXuqlox5h+Q;;%-n-hD0)T)hR-F-i1?A2Z&17O0SnlV
z2e=p!Z$|(!v#NN4eG?YwA->|+7{A9j8WA;{Kbzc!+FhhROFGV{PRQAaxZMTVi>hqL
zax!;fU$t|xFzDbG=7w%l>3;LS+^Y^i4f#eyobPoimebV=z(n?@PSJ0!@oO3FSbl^6
O0000<MNUMnLSTaAx!I2Z

literal 0
HcmV?d00001

diff --git a/android/app/src/main/res/drawable-xhdpi/ic_stat_soniclair.png b/android/app/src/main/res/drawable-xhdpi/ic_stat_soniclair.png
new file mode 100644
index 0000000000000000000000000000000000000000..5b797265891fa62431e37f11b87d00dbe2dd8951
GIT binary patch
literal 982
zcmV;{11bE8P)<h;3K|Lk000e1NJLTq001xm001xu1^@s6R|5Hm00001b5ch_0Itp)
z=>Px&kV!;ARA@u(m|3W9a~Q^dk1?lACq;zhn1_%XA;*x6H)IH%a>J2akc5kqxIpG1
z7bq7>k_$4sK!l<s;Uo^7lMI=M%shJZ-=}Y{{S9li&iX#P)?52#egF6WzRx>8|1B1|
zXp#F*4`9|A>@(13pk)O55^5R1*6Mu*MupJ!#=zCUYDtf_4)ur&I?I6VeSv3ypMjGk
zt?dFtCje~c-aCLxfPaANBwe$Z02~cG2`nj2{{);U>D3JlVuNSE_O`%Fz=0KK-vyRS
z`esbuYy@nTKS}HAfb9an1;AavW)%ni1g?~HYt=E^+X2S_M*s%{n@Bor>HutS4!j5K
zKEimSzZdWuumx}|umU(fP7mm;k+f{80BpyByMYTQ7=9f{HWKMAN1UArfaSn*LrQ1R
z$6tZ(fE_1*>>hyaMDKp!dEgP?0pRorj-`Z-1D*x8A2|C5@FDOya1^kv^AfUs1#m+t
zhc&<+l{y}VB>>I>(#V-o-<GL!GjKhy5AZ^ObPB+Bn)GR4&pM4Za3%n<ozE-ZJ^^+E
zGGb2vb^u<U27uekmd)I5B2@r$x_<+g1Fv)r!1m!K&DA+y2goP@KNRKsz6-FnlM=GM
z6nMNWoH`Cy&kO^Q#yvM%8dy~nx|u?@vve|fHf`vA2%UlND?N~F&IsMMoyGPhupjU-
zuuM{P#!77}QKJ9Gm@PZX(5JwS#rcrDl-^tuM`wRY+1}Vb6?h2v3fNmx#%p^3<#BQ!
zaQ>tVE5D~X50&)x+;`g#RsaOtsyJJS;A3S9oo#!Gq+iC_9Gd~#8Izv@hX7BMncW1#
z`;t-;>&5mxz(tiy67{#rZaA%EAmy4j#7apYjWRkCK;bqIm)ZP9jV(LOMrwYi!6@2(
z4Vc6<(=$H;+W@y^#7fGy1u_mmB9X|1Vg6NP%Z>_CXvUp|ft~|g)+B|%*I})a-l+}1
z_Rhcuh4MDEx8QgtN$NNe%nL1#{id=y>{Zh5RmBAvu$?K9_w351Rysa^X);+YrC|Wl
zupv}ickEEp>%&%$l=S7G;yeJh(=;yv2Q|HYO6TtdE|!#@{7=>cD6{_B^3SL#`P0};
z7TcMULT45LH~@GGNCW?$C2ZgnN!ix(GH?@ca!t?E=)1NUtu@UIJ(l<MRg!L*2cXT3
zv(&9k=4R>SINLpdS!brtK%aq@5$H>(WdK{NFZvAp3nHKfK$$UKHUIzs07*qoM6N<$
Ef>Rd45C8xG

literal 0
HcmV?d00001

diff --git a/android/app/src/main/res/drawable-xxhdpi/ic_stat_soniclair.png b/android/app/src/main/res/drawable-xxhdpi/ic_stat_soniclair.png
new file mode 100644
index 0000000000000000000000000000000000000000..45f9b45d9ca66fe87342b82c0b24d4c64d66a589
GIT binary patch
literal 1392
zcmV-$1&{iPP)<h;3K|Lk000e1NJLTq002k;002k`1^@s6RqeA!00001b5ch_0Itp)
z=>Px)DoI2^RCr$Pnro<KV;IMOf0vjVLgO~MPN<pDM2N(=3~I&)W*GT0QG{}-F_8u-
zg~%-uJ}Be^p_vaZ(_orR$u%Rn<r0I){n8|4{(4SppVsWN_TFo+wWhPqIq&o3)L!pp
zJ-_q3&+T0zNnZj=eEJhefCgAd0+ayNb0W!tk_9CTsz)GMP(6Oh2PF$i7F3TwvY>kW
zk`GE2G>I(8_T9i*No(q<)!gjX95LH-fVY6}fjN@?ZcfeWE42yG^T47^mHQ=KRb8#-
zX0`&5?X!T@Iko-*j+eBtIaRBzH12?G?*M!V9NMMAMoC9jQ>(dIZ2)vLaAOaZu9tLc
zbLtMi(zpV$y*Ka?uzQbJ|1ERa-wm%?Gc(2;&@;d}15{ZjX~8h++TIyB1UMC#De1al
z=I6(b8z9?91Fr!)mU#KalJZV`%oN*u0fz(U0!x7z*`T2Tw*}DGz<wp*#E_peOZcZV
z-u6z}{F8y@z}y~dO*}xhF9RMd38ypcDd2KoA0Qn2VxY_km{@?au>LDBeMmr6hfg>_
zj{+A|&~^*3U4?n=1!Q}Hq*ro&V-Mg5VEZ8z-3-hIHVrv1hPM-t?X!Vrfe$3jvmH=A
z1rDyDWB}R)cnnxJVE+5SJHUmljbgU<1U|_nfT7^Sz||Gt#FWjFrrQp<pY=Fu$7Or|
zp5<0gw;9l#z>116ilznN@LQ2scH{=&{4Dp0-)@o=(GA;?3$+uF?Rmf(KxDH`NdSr?
z(@{Fsjeb$&LLG@Q(MQ_Uc0l2jBgJo0iU1X@|A3?`S_{bbc|as|O-oro{{bt3XrbKF
zDj#Hf*Q_$1*)*MS(gjDXXq!KPc#piaBh1^rt45R>#B>m#@OcpwqCo8~YR4at?dS%+
z2TU8JX~pOL07c?CThcFC1X~N7p4+DtfYt%0R8+pqw0?kANQ&#C5wU#?@M<oKu9sB#
z-O5zMeHF01B+Hn~C|Y*RPrwUVD38AMVZcRQVZO6glr!-U8Wr1-lwOkk@TR0=%Wm8~
zt`;EMQ9OPD99Z=Q3g*R8oi8aIZpSL34vT(IJ`d_VUM}h0E<o`<QF26ivRYEKMk+~N
zK=%PxR@%9E(!angN#Aro?#gYtA0H&?s~pg%`{LNe-P$5aFJ{MYhNQ60(lQjFtl-=t
z$+p8GM_(tO&6eJ{$G{De<`+G)eJ1c+pAF6c-p)D&0jE>cj$9vQ7X%+m>UBX-xb(1q
zBAnhM=}Ft~0!P#((lx(l#IYU6=F5uvg`bT2a2Bvc(yFrSlm=uw$d80lAZ{5(`#fbg
zD>2T%{*t~eIASjWr<GWv&;WDo*=W2?lQi1j?zd(sK(^!N;m_Q0ij;oXrdL_r##oW<
zh)5Bcnvyk=7M5A8ETC(EJIXBB(3r5)h-UHkL?EtonwA43#m!1z83@RB)K+6me$c`b
z;Q5c)aqjz>O<zD+)QT@G;zDjR%Egi%sqBMn$F*?2i#Hh|?JFrh+A5Tu7Gygr<7l$)
zHW{hpbXp}T(tx1>Jp^1j$>DU=TiENn$U+OUeG;&KiogjqKL?JI6gMJU$rwPkqriJT
z8sJk1P^h|6(rsk`T?^bk#o%<*ohvCm2OO2HEXa1W6e6rg(|an)%USgwU4;?p2J|>^
zLQOJJmX!VOr{-4MWco5mPZR>$CfiN$MF*A|6I{RAub%)7K$rj}K=n>pvY=!^$%5(;
yNETF&U-Ci8f|3Q*Bakep9>3&+k_FYXp#K48V})3=3Ess30000<MNUMnLSTZ<nUl}}

literal 0
HcmV?d00001

diff --git a/android/app/src/main/res/drawable-xxxhdpi/ic_stat_soniclair.png b/android/app/src/main/res/drawable-xxxhdpi/ic_stat_soniclair.png
new file mode 100644
index 0000000000000000000000000000000000000000..97bb4f3188c68c61ff422fbe9689a2cf8203655a
GIT binary patch
literal 2087
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

literal 0
HcmV?d00001

diff --git a/build-pwa.ps1 b/build-pwa.ps1
new file mode 100644
index 0000000..42625d8
--- /dev/null
+++ b/build-pwa.ps1
@@ -0,0 +1,2 @@
+npm run build
+Copy-Item -Path "build/*" -Destination "../SonicLair-PWA/" -Recurse -Force
diff --git a/package-lock.json b/package-lock.json
index 69a44c8..2380b18 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1231,11 +1231,6 @@
       "resolved": "https://registry.npmjs.org/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz",
       "integrity": "sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw=="
     },
-    "@benestudioco/react-scrollfade": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@benestudioco/react-scrollfade/-/react-scrollfade-1.0.2.tgz",
-      "integrity": "sha512-mE/U+XV/IdoiSRaIfA6c+iTGxRV68FCy8w0cOKZgx3nJdYMdy7lUG7/W9ZL0gBPDyINTCUKzH0peBAwHTk3bpQ=="
-    },
     "@capacitor/android": {
       "version": "3.5.1",
       "resolved": "https://registry.npmjs.org/@capacitor/android/-/android-3.5.1.tgz",
@@ -6302,11 +6297,6 @@
       "resolved": "https://registry.npmjs.org/hoopy/-/hoopy-0.1.4.tgz",
       "integrity": "sha512-HRcs+2mr52W0K+x8RzcLzuPPmVIKMSv97RGHy0Ea9y/mpcaK+xTrjICA04KAHi4GRzxliNqNJEFYWHghy3rSfQ=="
     },
-    "howler": {
-      "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/howler/-/howler-2.2.3.tgz",
-      "integrity": "sha512-QM0FFkw0LRX1PR8pNzJVAY25JhIWvbKMBFM4gqk+QdV+kPXOhleWGCB6AiAF/goGjIHK2e/nIElplvjQwhr0jg=="
-    },
     "hpack.js": {
       "version": "2.1.6",
       "resolved": "https://registry.npmjs.org/hpack.js/-/hpack.js-2.1.6.tgz",
diff --git a/src/Components/Artist.tsx b/src/Components/Artist.tsx
index 6e4602f..d40f80f 100644
--- a/src/Components/Artist.tsx
+++ b/src/Components/Artist.tsx
@@ -19,7 +19,6 @@ import AlbumCard from "./AlbumCard";
 import "./Artist.scss";
 import Loading from "./Loading";
 import useAutoFill from "../Hooks/useAutoFill";
-import ScrollFade from '@benestudioco/react-scrollfade';
 
 
 export default function Artist() {
diff --git a/src/Components/Home.tsx b/src/Components/Home.tsx
index 6e4036e..4870a12 100644
--- a/src/Components/Home.tsx
+++ b/src/Components/Home.tsx
@@ -1,24 +1,20 @@
-import { Link, useNavigate } from 'react-router-dom';
-import logo from '../logo.svg';
-import PlayTest from './PlayTest';
-import classnames from 'classnames';
-import { motion } from "framer-motion";
+import { useNavigate } from 'react-router-dom';
 import { useContext, useEffect, useState } from 'react';
 import GetTopAlbums from '../Api/GetTopAlbums';
 import { AppContext } from '../AppContext';
-import { IAlbumArtistResponse, IAlbumSongResponse, IRandomSongsResponse } from '../Models/API/Responses/IArtistResponse';
+import { IAlbumArtistResponse, IAlbumSongResponse } from '../Models/API/Responses/IArtistResponse';
 import AlbumCard from './AlbumCard';
 import GetRandomSongs from '../Api/GetRandomSongs';
 import RandomSongCard from './RandomSongCard';
-import { AutoSizer } from 'react-virtualized';
+import MediaBrowser from '../Plugins/MediaBrowser';
 
 export default function Home() {
-  const navigate = useNavigate();
   const [albumsFetched, setAlbumsFetched] = useState<boolean>(false);
   const [albums, setAlbums] = useState<IAlbumArtistResponse[]>([]);
   const [songsFetched, setSongsFetched] = useState<boolean>(false);
   const [songs, setSongs] = useState<IAlbumSongResponse[]>([]);
   const { context } = useContext(AppContext);
+
   useEffect(() => {
     if (albumsFetched)
       return;
@@ -38,9 +34,18 @@ export default function Home() {
       const randomSongs = await GetRandomSongs(context);
       setSongs(randomSongs.randomSongs.song);
       setSongsFetched(true);
+      MediaBrowser.loadItems(randomSongs.randomSongs.song.map(s => {
+        return {
+          album: s.album,
+          artist: s.artist,
+          song: s.title,
+          duration: s.duration,
+          albumArt: "",
+          id: s.id
+        }
+      }));
     };
     fetch();
-
   }, [songsFetched, context]);
 
   return (
@@ -53,7 +58,7 @@ export default function Home() {
       <div className="col-12 overflow-scroll scrollable scrollable-hidden" style={{ height: "auto" }}>
         <div className="d-flex flex-row">
           {albums.map(s => <div style={{ margin: "10px" }}>
-            <AlbumCard item={s} forceWidth={true}/>
+            <AlbumCard item={s} forceWidth={true} />
           </div>
           )}
 
diff --git a/src/Plugins/MediaBrowser.ts b/src/Plugins/MediaBrowser.ts
new file mode 100644
index 0000000..6bc457a
--- /dev/null
+++ b/src/Plugins/MediaBrowser.ts
@@ -0,0 +1,8 @@
+import { registerPlugin } from '@capacitor/core';
+
+export interface MediaBrowserPlugin {
+    loadItems(items: {albumArt:string, album: string, artist: string, duration: number, song: string, id:string}[]): Promise<{ status: string }>
+}
+const MediaBrowser = registerPlugin<MediaBrowserPlugin>('MediaBrowser');
+
+export default MediaBrowser;
\ No newline at end of file