From 0b6a92018db64045aca5b4f476deb8b6cf60329a Mon Sep 17 00:00:00 2001 From: Luke Hagar Date: Thu, 4 Aug 2022 14:51:11 -0500 Subject: [PATCH 1/5] Update README.md --- README.md | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/README.md b/README.md index 4ca0c9b..5f865f1 100644 --- a/README.md +++ b/README.md @@ -16,10 +16,7 @@ Examples Assume React Syntax The LoadPlexSession Function returns an object that contains the plexClientInformation and plexTVAuthToken keys/values according to how they were created ``` JavaScript const loadedSession = LoadPlexSession(); -if ( - loadedSession.plexClientInformation === null || - loadedSession.plexClientInformation === undefined -){ +if (loadedSession.plexClientInformation == null){ loadedSession.plexClientInformation = CreatePlexClientInformation(); } From c818db32954438a789dbb385be11f2e2fb768a98 Mon Sep 17 00:00:00 2001 From: Luke Hagar Date: Thu, 4 Aug 2022 14:55:55 -0500 Subject: [PATCH 2/5] Update README.md --- README.md | 16 +++++++++++++++- 1 file changed, 15 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 5f865f1..5fdf469 100644 --- a/README.md +++ b/README.md @@ -15,7 +15,7 @@ Examples Assume React Syntax The LoadPlexSession Function returns an object that contains the plexClientInformation and plexTVAuthToken keys/values according to how they were created ``` JavaScript - const loadedSession = LoadPlexSession(); +const loadedSession = LoadPlexSession(); if (loadedSession.plexClientInformation == null){ loadedSession.plexClientInformation = CreatePlexClientInformation(); } @@ -48,3 +48,17 @@ const [plexTVAuthToken, setPlexTVAuthToken] = useState( SavePlexSession(plexClientInformation, tempPlexTVAuthToken); } ``` + +### Get Plex Music Hub data +``` JavaScript + async function UpdateHubs(plexClientInformation, plexServers, plexLibraries) { + const tempMusicHubs = await GetMusicHub( + plexClientInformation, + plexServers, // No Auth Token is needed since the server entries have their own access tokens + plexLibraries + ); + setMusicHubs(tempMusicHubs); + } +``` + + From 8a09a27be75629f4b386cd611ca75f84f56683c7 Mon Sep 17 00:00:00 2001 From: Luke Hagar Date: Thu, 4 Aug 2022 15:01:17 -0500 Subject: [PATCH 3/5] Update README.md --- README.md | 85 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 85 insertions(+) diff --git a/README.md b/README.md index 5fdf469..6da36d3 100644 --- a/README.md +++ b/README.md @@ -49,6 +49,91 @@ const [plexTVAuthToken, setPlexTVAuthToken] = useState( } ``` +### Refresh Data with Saved Session +``` JavaScript + async function Refresh() { + const tempPlexTVUserData = await GetPlexUserData( + plexClientInformation, + plexTVAuthToken + ); + const tempPlexServers = await GetPlexServers( + plexClientInformation, + plexTVAuthToken + ); + const tempPlexDevices = await GetPlexDevices( + plexClientInformation, + plexTVAuthToken + ); + const tempPlexLibraries = await GetPlexLibraries(tempPlexServers); + UpdateHubs(tempPlexServers, tempPlexLibraries); + setPlexServers(tempPlexServers); + setPlexDevices(tempPlexDevices); + setPlexTVUserData(tempPlexTVUserData); + setPlexLibraries(tempPlexLibraries); + setIsRefreshing(false); + } +``` + +### Update Library list when the topic is changed (artists. albums, songs) +``` JavaScript + async function UpdateLibrary() { + setIsLoading(true); + const returnObject = await GetLibraryPages( + plexServers, + plexLibraries, + topic, + pageNumber, + 250 + ); + console.log(returnObject); + const tempItemArray = Array.from([ + ...new Set([...libraryItems, ...returnObject.items]), + ]); + + setLibraryItems(tempItemArray); + setLibraryHasMore(returnObject.hasMore); + setIsLoading(false); + } +``` + +### Intersection observer to load more library items when the callbackref object comes into view +``` JavaScript + const observer = useRef(); + const lastLibraryItem = useCallback( + (node) => { + if (isLoading) return; + if (observer.current) observer.current.disconnect(); + observer.current = new IntersectionObserver((entries) => { + if (entries[0].isIntersecting && libraryHasMore) { + setPageNumber(pageNumber + 1); + } + }); + if (node) observer.current.observe(node); + console.log(node); + }, + [isLoading, libraryHasMore] + ); +``` + +### Intersection observer to load more library items when the callbackref object comes into view +``` JavaScript + const observer = useRef(); + const lastLibraryItem = useCallback( + (node) => { + if (isLoading) return; + if (observer.current) observer.current.disconnect(); + observer.current = new IntersectionObserver((entries) => { + if (entries[0].isIntersecting && libraryHasMore) { + setPageNumber(pageNumber + 1); + } + }); + if (node) observer.current.observe(node); + console.log(node); + }, + [isLoading, libraryHasMore] + ); +``` + ### Get Plex Music Hub data ``` JavaScript async function UpdateHubs(plexClientInformation, plexServers, plexLibraries) { From 3159dfb1ac41940c22414a31e4389663f2e7e4e1 Mon Sep 17 00:00:00 2001 From: Luke Hagar Date: Thu, 4 Aug 2022 15:05:15 -0500 Subject: [PATCH 4/5] Update README.md --- README.md | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/README.md b/README.md index 6da36d3..3096aff 100644 --- a/README.md +++ b/README.md @@ -115,6 +115,25 @@ const [plexTVAuthToken, setPlexTVAuthToken] = useState( ); ``` +### Intersection observer Callback usage +``` JavaScript + if (libraryItems?.length === index + 100) { + return ( + + + + + + + {Obj.title} - {Obj.grandparentTitle} -{' '} + {Obj.parentTitle} + + + + ); + } +``` + ### Intersection observer to load more library items when the callbackref object comes into view ``` JavaScript const observer = useRef(); From 26d59e7dffe560752f9d8ebf955b7cf21e4d01ba Mon Sep 17 00:00:00 2001 From: Luke Hagar Date: Thu, 4 Aug 2022 15:05:53 -0500 Subject: [PATCH 5/5] Update README.md --- README.md | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 3096aff..08dd754 100644 --- a/README.md +++ b/README.md @@ -13,7 +13,8 @@ Examples Assume React Syntax ### Loading a Saved Session -The LoadPlexSession Function returns an object that contains the plexClientInformation and plexTVAuthToken keys/values according to how they were created +LoadPlexSession: +Function returns an object that contains the plexClientInformation and plexTVAuthToken keys/values according to how they were created ``` JavaScript const loadedSession = LoadPlexSession(); if (loadedSession.plexClientInformation == null){