tried fixing NaN bug

- also updated the playback reporting overlay text

src/aggregate.js

@@ -29,7 +29,7 @@ export function generateTopTrackInfo(itemInfo, playbackReportJSON) {
         blurhash: item.ImageBlurHashes?.Primary?.[item.ImageTags?.Primary],
       }),
       year: item.PremiereDate ? new Date(item.PremiereDate).getFullYear() : null,
-      duration: Math.round(item.RunTimeTicks / 10000000),
+      duration: !isNaN(Math.round(item.RunTimeTicks / 10000000)) ? Math.round(item.RunTimeTicks / 10000000) : 0,
       playCount: {
         jellyfin: item.UserData?.PlayCount || 0,
         // playbackReport: Number(playbackReportItem?.TotalPlayCount) || 0,
@@ -40,9 +40,9 @@ export function generateTopTrackInfo(itemInfo, playbackReportJSON) {
       mostSuccessivePlays: playbackReportItem?.MostSuccessivePlays || null,
       lastPlayed: item.UserData?.LastPlayedDate ? new Date(item.UserData.LastPlayedDate) : new Date(0),
       totalPlayDuration: {
-        jellyfin: Number(item.UserData?.PlayCount) * (Number(item.RunTimeTicks) / (10000000 * 60)), // convert jellyfin's runtime ticks to minutes (https://learn.microsoft.com/en-us/dotnet/api/system.datetime.ticks?view=net-7.0)
-        playbackReport: Number(playbackReportItem?.TotalDuration) / 60 || 0, // convert to minutes
-        average: Math.ceil(((Number(item.UserData?.PlayCount) * (Number(item.RunTimeTicks) / (10000000 * 60))) + (Number(playbackReportItem?.TotalDuration) / 60 || 0))/2),
+        jellyfin: !isNaN(Number(item.UserData?.PlayCount) * (Number(item.RunTimeTicks) / (10000000 * 60))) ? Number(item.UserData?.PlayCount) * (Number(item.RunTimeTicks) / (10000000 * 60)) : 0, // convert jellyfin's runtime ticks to minutes (https://learn.microsoft.com/en-us/dotnet/api/system.datetime.ticks?view=net-7.0)
+        playbackReport: !isNaN(Number(playbackReportItem?.TotalDuration) / 60 || 0) ? (Number(playbackReportItem?.TotalDuration) / 60 || 0) : 0, // convert to minutes
+        average: !isNaN(Math.ceil(((Number(item.UserData?.PlayCount) * (Number(item.RunTimeTicks) / (10000000 * 60))) + (Number(playbackReportItem?.TotalDuration) / 60 || 0))/2)) ? Math.ceil(((Number(item.UserData?.PlayCount) * (Number(item.RunTimeTicks) / (10000000 * 60))) + (Number(playbackReportItem?.TotalDuration) / 60 || 0))/2) : 0,
       },
       isFavorite: item.UserData?.IsFavorite,
     })

src/features.js

@@ -117,11 +117,11 @@ state.features = [
           <div class="flex flex-col items-start gap-2">
             <p>Jellyfin doesn't save any information about played tracks other than the number of times they were played. This means that e.g. the total playtime is only an approximation. It also means that it is <span class="font-semibold">not possible to limit the data to ${() => state.rewindReport.year} only!<span></p>
             <p>However, if you have the "Playback Reporting" plugin installed, significantly more information can be collected, such as the date and durations of each playback. This will results in better stats, although it isn't perfect either. Playback reporting depends on applications properly reporting the current playback states, and currently most music players that are compatible with Jellyfin seem to struggle with this in one way or another. Especially offline playback is challenging, because the players have to "simulate" the playback after the device reconnects to the server.</p>
-            <p>Alternatively, an even better solution would be to install the Playback Reporting plugin into your Jellyfin server. It won't take longer than 5 minutes, so why not do it right now? Your Jellyfin Rewind isn't going anywhere!</p>
+            <p>Still, the best solution is to install the Playback Reporting plugin into your Jellyfin server if you haven't done so already. It won't take longer than 2 minutes, so why not do it right now? Your Jellyfin Rewind isn't going anywhere!</p>
             <a class="px-3 py-2 my-1 rounded-md text-white font-semibold bg-[#00A4DC]" href="${() => `${state.auth.config.baseUrl}/web/index.html#!/addplugin.html?name=Playback%20Reporting&guid=5c53438191a343cb907a35aa02eb9d2c`}" target="_blank">Open Plugins Page!</a> 
+            <p>For more information about the Playback Reporting plugin, you can visit <a class="text-[#00A4DC]" href="https://jellyfin.org/docs/general/server/plugins/#playback-reporting" target="_blank">its entry in the official Jellyfin Docs</a>.</p>
             <p>So, please treat all of this information with a grain of salt. You can take a look at the settings in order to choose which data will be used, but any information that needs to be interpolated will have a negative influence on the quality of these stats.</p>
             <p>I will try to offer a way to import this year's Rewind data into next year's Jellyfin Rewind, so that more information can be used and the used data can be properly limited to the current year only. Because of this, please <span class="font-semibold">make sure to download a copy of your Rewind data at the end and store it until next year!</span></p>
-            <p>For more information about the Playback Reporting plugin, you can visit <a class="text-[#00A4DC]" href="https://jellyfin.org/docs/general/server/plugins/#playback-reporting" target="_blank">its entry in the official Jellyfin Docs</a>.</p>
           </div>
         `,
       }))}">
@@ -149,7 +149,7 @@ state.features = [
         <canvas id="playtime-by-month-chart" class="${() => state.extraFeatures.totalPlaytimeGraph ? `` : `opacity-30`}"></canvas>
         ${() => state.extraFeatures.totalPlaytimeGraph ? html`<br>` : html`
           <div class="absolute top-0 left-0 w-full h-full flex flex-col items-center justify-center gap-12">
-            <span class="text-4xl rotate-12 text-sky-900 tracking-wider font-semibold">Unavailable</span>
+            <span class="text-4xl rotate-12 text-[#00A4DC] tracking-wider font-semibold">Unavailable</span>
             <button @click="${stopPropagation(() => showOverlayFeatureUnavailableMissingPlaybackReporting())}" class="w-32 rounded-md flex flex-row items-center justify-around px-2 py-1 bg-white text-gray-800">
               <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 icon icon-tabler icon-tabler-info-square-rounded" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                 <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>

src/rewind.js

@@ -76,7 +76,10 @@ function adjustPlaybackReportJSON(playbackReportJSON, indexedItemInfo) {
 
     // adjust playback duration if necessary
 
-    const playbackReportDuration = Number(item.PlayDuration)
+    let playbackReportDuration = Number(item.PlayDuration)
+    if (isNaN(playbackReportDuration)) {
+      playbackReportDuration = 0
+    }
     const jellyfinItemDuration = Math.ceil(itemInfo.RunTimeTicks / 10000000)
 
     if (playbackReportDuration > jellyfinItemDuration) {
@@ -116,21 +119,21 @@ function indexPlaybackReport(playbackReportJSON) {
     const isoDate = item.DateCreated.replace(` `, `T`) + `Z` // Safari doesn't seem to support parsing the raw dates from playback reporting (RFC 3339)
     const playInfo = {
       date: new Date(isoDate),
-      duration: Number(item.PlayDuration),
+      duration: !isNaN(Number(item.PlayDuration)) ? Number(item.PlayDuration) : 0,
       client: item.ClientName,
       device: item.DeviceName,
       method: convertPlaybackMethod(item.PlaybackMethod),
     }
     if (!items[item.ItemId]) {
       items[item.ItemId] = {
         ...item,
-        TotalDuration: Number(item.PlayDuration),
+        TotalDuration: !isNaN(Number(item.PlayDuration)) ? Number(item.PlayDuration) : 0,
         TotalPlayCount: 1,
         Plays: [playInfo],
       }
 
     } else {
-      items[item.ItemId].TotalDuration += Number(item.PlayDuration)
+      items[item.ItemId].TotalDuration += !isNaN(Number(item.PlayDuration)) ? Number(item.PlayDuration) : 0
       items[item.ItemId].TotalPlayCount += 1
       items[item.ItemId].Plays.push(playInfo)
     }
@@ -144,10 +147,10 @@ function indexPlaybackReport(playbackReportJSON) {
       }
       currentSuccessivePlays.itemId = item.ItemId
       currentSuccessivePlays.count = 1
-      currentSuccessivePlays.totalDuration = Number(item.PlayDuration)
+      currentSuccessivePlays.totalDuration = !isNaN(Number(item.PlayDuration)) ? Number(item.PlayDuration) : 0
     } else {
       currentSuccessivePlays.count += 1
-      currentSuccessivePlays.totalDuration += Number(item.PlayDuration)
+      currentSuccessivePlays.totalDuration += !isNaN(Number(item.PlayDuration)) ? Number(item.PlayDuration) : 0
     }
 
   }