Report playback stopped when media finishes

This consolidates the logic for reporting stopped playback to the server.
The MEDIA_FINISHED event is fired when:
* End of stream is reached
* Error encountered
* Playback has been stopped
* Playback was interrupted because a new item was loaded

https://developers.google.com/cast/docs/reference/web_receiver/cast.framework.events#.EndedReason

The current position reported to the server will be the current time
reported by the Cast player which will be the most accurate representation.
If this is not available, it will fall back to the existing logic of
checking the current playback position from the receiver's playback state.

src/components/maincontroller.ts

@@ -12,7 +12,8 @@ import {
     getInstantMixItems,
     translateRequestedItems,
     broadcastToMessageBus,
-    ticksToSeconds
+    ticksToSeconds,
+    TicksPerSecond
 } from '../helpers';
 import {
     reportPlaybackStart,
@@ -153,11 +154,7 @@ export function disableTimeUpdateListener(): void {
 enableTimeUpdateListener();
 
 window.addEventListener('beforeunload', () => {
-    // Try to cleanup after ourselves before the page closes
-    const playbackState = PlaybackManager.playbackState;
-
     disableTimeUpdateListener();
-    reportPlaybackStopped(playbackState, getReportingParams(playbackState));
 });
 
 window.playerManager.addEventListener(
@@ -194,8 +191,20 @@ function defaultOnStop(): void {
 
 window.playerManager.addEventListener(
     cast.framework.events.EventType.MEDIA_FINISHED,
-    defaultOnStop
+    (mediaFinishedEvent): void => {
+        const playbackState = PlaybackManager.playbackState;
+
+        reportPlaybackStopped(playbackState, {
+            ...getReportingParams(playbackState),
+            PositionTicks:
+                (mediaFinishedEvent.currentMediaTime ??
+                    getCurrentPositionTicks(playbackState)) * TicksPerSecond
+        });
+
+        defaultOnStop();
+    }
 );
+
 window.playerManager.addEventListener(
     cast.framework.events.EventType.ABORT,
     defaultOnStop
@@ -211,7 +220,6 @@ window.playerManager.addEventListener(
             return;
         }
 
-        reportPlaybackStopped(playbackState, getReportingParams(playbackState));
         PlaybackManager.resetPlaybackScope();
 
         if (!PlaybackManager.playNextItem()) {
@@ -231,16 +239,6 @@ window.playerManager.addEventListener(
         );
     }
 );
-// Notify of playback end just before stopping it, to get a good tick position
-window.playerManager.addEventListener(
-    cast.framework.events.EventType.REQUEST_STOP,
-    (): void => {
-        reportPlaybackStopped(
-            PlaybackManager.playbackState,
-            getReportingParams(PlaybackManager.playbackState)
-        );
-    }
-);
 
 // Set the active subtitle track once the player has loaded
 window.playerManager.addEventListener(