add THEOlive doc

doc/theolive.md

@@ -0,0 +1,161 @@
+# THEOlive support
+
+High-quality real-time video streaming at scale for providers of sports betting, iGaming and interactive entertainment
+
+For more info, visit [THEOlive website](https://www.theoplayer.com/product/theolive).
+
+## Limitations
+
+* Only Flutter Web is supported.
+* Android and iOS will follow later. (You can check out our dedicated [THEOlive Flutter SDK](https://github.com/THEOplayer/flutter-theolive-sdk))
+
+## THEOlive playback
+THEOlive playback is becoming crucial part of THEOplayer's playback engine instead of being available as a separate SDK.
+
+The WEB support is already added, Android and iOS support as part of the THEOplayer SDK will come later. (Right now you can use the [dedicated THEOlive Flutter SDK](https://github.com/THEOplayer/flutter-theolive-sdk) for Android and iOS support) 
+
+### Setting a THEOlive source
+
+```js
+player.source = SourceDescription(sources: [
+    TheoLiveSource(src: "2vqqekesftg9zuvxu9tdme6kl"),
+]);
+```
+
+Instead of using a remote HTTPS url, you can just specify your `channelID` from the [THEOlive Console](https://console.theo.live/) and you can start the playback.
+
+**NOTE:** your THEOplayer license has to contain the `HESP` feature to make it work. (HESP is the underlying technology of THEOlive).
+
+Once the playback starts, you can listen to playback-specify events on THEOplayer.
+
+#### Additional configuration options on `THEOPlayerConfig` 
+By setting a `THEOliveConfiguration` object on `THEOplayerConfig` you are able to specify extra configuration for THEOlive (e.g. a custom sessionId to follow the requests on the backend)
+```js
+    player = THEOplayer(
+        theoPlayerConfig: THEOplayerConfig(
+          license: PLAYER_LICENSE,
+          theolive: TheoLiveConfiguration(externalSessionId: "mySessionID"),
+        ),
+        onCreate: () {
+          print("player is created, ready to use");
+
+        });
+```
+### Listening for THEOlive-specific events
+
+```js
+    player.theoLive?.addEventListener(THEOliveApiEventTypes.PUBLICATIONLOADSTART, (e) {
+        print("PUBLICATIONLOADSTART");
+    });
+    player.theoLive?.addEventListener(THEOliveApiEventTypes.PUBLICATIONOFFLINE, (e) {
+        print("PUBLICATIONOFFLINE");
+    });
+    player.theoLive?.addEventListener(THEOliveApiEventTypes.PUBLICATIONLOADED, (e) {
+        print("PUBLICATIONLOADED");
+    });
+    player.theoLive?.addEventListener(THEOliveApiEventTypes.INTENTTOFALLBACK, (e) {
+        print("INTENTTOFALLBACK");
+    });
+    player.theoLive?.addEventListener(THEOliveApiEventTypes.ENTERBADNETWORKMODE, (e) {
+        print("ENTERBADNETWORKMODE");
+    });
+    player.theoLive?.addEventListener(THEOliveApiEventTypes.EXITBADNETWORKMODE, (e) {
+        print("EXITBADNETWORKMODE");
+    });
+```
+
+## Migration from THEOlive Flutter SDK to THEOplayer Flutter SDK
+
+### setStateListener
+From 
+```js
+theoLive.setStateListener(...)
+```
+
+to
+```js
+player.theoLive.setStateListener(...)
+```
+
+### loadChannel
+From
+```js
+theoLive.loadChannel("2vqqekesftg9zuvxu9tdme6kl")
+```
+
+to
+```js
+player.source = SourceDescription(sources: [
+    TheoLiveSource(src: "2vqqekesftg9zuvxu9tdme6kl"),
+]);
+```
+
+### addEventListener
+From
+```js
+theoLive.addEventListener(this)
+```
+
+to THEOlive-related events
+```js
+    player.theoLive?.addEventListener(THEOliveApiEventTypes.PUBLICATIONLOADSTART, (e) {
+        print("PUBLICATIONLOADSTART event");
+    });
+    player.theoLive?.addEventListener(THEOliveApiEventTypes.PUBLICATIONOFFLINE, (e) {
+        print("PUBLICATIONOFFLINE event");
+    });
+    player.theoLive?.addEventListener(THEOliveApiEventTypes.PUBLICATIONLOADED, (e) {
+        print("PUBLICATIONLOADED event");
+    });
+    player.theoLive?.addEventListener(THEOliveApiEventTypes.INTENTTOFALLBACK, (e) {
+        print("INTENTTOFALLBACK event");
+    });
+    player.theoLive?.addEventListener(THEOliveApiEventTypes.ENTERBADNETWORKMODE, (e) {
+        print("ENTERBADNETWORKMODE event");
+    });
+    player.theoLive?.addEventListener(THEOliveApiEventTypes.EXITBADNETWORKMODE, (e) {
+        print("EXITBADNETWORKMODE event");
+    });
+```
+
+and to playback-related events
+```js
+    player.addEventListener(PlayerEventTypes.PLAY, (e) {
+        print("PLAY event");
+    });
+    player.addEventListener(PlayerEventTypes.PLAYING, (e) {
+        print("PLAYING event");
+    });
+    player.addEventListener(PlayerEventTypes.PAUSE, (e) {
+        print("PAUSE event");
+    }););
+```
+
+### Playback-related actions
+From
+```js
+theoLive.play()
+```
+
+to
+```js
+player.play()
+```
+
+### Channel events
+The channel related events:
+```js
+ChannelLoadStart,
+ChannelLoaded,
+ChannelOffline
+```
+
+are renamed to `Publication` events
+```js
+PublicationLoadStart,
+PublicationLoaded,
+PublicationOffline
+```
+
+### Anything missing?
+Please reach out to us!

flutter_theoplayer_sdk/flutter_theoplayer_sdk/CHANGELOG.md

@@ -1,5 +1,6 @@
 [Unreleased]
 
+* Added [THEOlive support](https://github.com/THEOplayer/flutter-theoplayer-sdk/blob/main/doc/theolive.md) for Flutter WEB.
 * Deprecated getX and setX methods on THEOplayer API in favor of properties.
 * Added new properties on THEOplayer API. (`muted`, `played`, `buffered`, `videoTracks`, etc... for the full list check the API.)
 * Changed `THEOplayer.allowBackgroundPlayback()` to `THEOplayer.allowBackgroundPlayback`. **(Breaking change)**.

flutter_theoplayer_sdk/flutter_theoplayer_sdk/README.md

@@ -83,7 +83,9 @@ please reach out to us for support.
 </tr>
 <tr>
 <td><strong>Subtitles &amp; Closed Captions</strong></td>
-<td colspan="3">In-stream subtitles supported by the platform</td>
+<td colspan="3">In-stream subtitles supported by the platform.</br>
+Note: If you use Texture-based rendering (SURFACE_TEXTURE and SURFACE_PRODUCER) on Android, you need to implement the subtitle rendering based on track events.
+</td>
 </tr>
 <tr>
 <td><strong>Metadata</strong></td>
@@ -111,6 +113,12 @@ please reach out to us for support.
 <td><strong>Cast Integration</strong></td>
 <td colspan="3">Coming soon… (Can not wait? <a href="https://github.com/THEOplayer/flutter-theoplayer-sdk/blob/main/doc/custom-branches.md">Check our in-app integration branches</a>)</td>
 </tr>
+<tr>
+<td><strong><a href="https://github.com/THEOplayer/flutter-theoplayer-sdk/blob/main/doc/theolive.md">THEOlive</a></strong></td>
+<td>Coming soon… (Can not wait? <a href="https://github.com/THEOplayer/flutter-theolive-sdk">You can still use our THEOlive SDK</a>)</td>
+<td>Supported through <code>THEOliveSource</code> and <code>player.theolive</code> API</td>
+<td>Coming soon… (Can not wait? <a href="https://github.com/THEOplayer/flutter-theolive-sdk">You can still use our THEOlive SDK</a>)</td>
+</tr>
 </tbody>
 </table>
 

flutter_theoplayer_sdk/flutter_theoplayer_sdk/example/lib/main.dart

@@ -54,6 +54,8 @@ class _MyAppState extends State<MyApp> {
         },
         theoPlayerConfig: THEOplayerConfig(
           license: PLAYER_LICENSE,
+          // Extra THEOlive configuration:
+          //theolive: TheoLiveConfiguration(externalSessionId: "mySessionID"),
         ),
         onCreate: () {
           print("main - THEOplayer - onCreate");
@@ -82,6 +84,7 @@ class _MyAppState extends State<MyApp> {
             var pmd = pmEvent as PresentationModeChangeEvent;
             print("New presentation mode: ${pmd.presentationMode}");
           });
+
         });
   }
 
@@ -186,6 +189,35 @@ class _MyAppState extends State<MyApp> {
                                 onPressed: () {
                                   _licenseConfigCheckDialog(context);
 
+                                  /**
+                                   * register for theolive events, if interested
+                                   *
+                                   *
+                                  player.theoLive?.addEventListener(THEOliveApiEventTypes.PUBLICATIONLOADSTART, (e) {
+                                    print("PUBLICATIONLOADSTART");
+                                  });
+                                  player.theoLive?.addEventListener(THEOliveApiEventTypes.PUBLICATIONOFFLINE, (e) {
+                                    print("PUBLICATIONOFFLINE");
+                                  });
+                                  player.theoLive?.addEventListener(THEOliveApiEventTypes.PUBLICATIONLOADED, (e) {
+                                    print("PUBLICATIONLOADED");
+                                  });
+                                  player.theoLive?.addEventListener(THEOliveApiEventTypes.INTENTTOFALLBACK, (e) {
+                                    print("INTENTTOFALLBACK");
+                                  });
+                                  player.theoLive?.addEventListener(THEOliveApiEventTypes.ENTERBADNETWORKMODE, (e) {
+                                    print("ENTERBADNETWORKMODE");
+                                  });
+                                  player.theoLive?.addEventListener(THEOliveApiEventTypes.EXITBADNETWORKMODE, (e) {
+                                    print("EXITBADNETWORKMODE");
+                                  });
+                                   */
+
+                                  /**
+                                   * preload channels for faster startup
+                                   *
+                                   player.theoLive?.preloadChannels(["2vqqekesftg9zuvxu9tdme6kl"]);
+                                   */
                                   player.source = SourceDescription(sources: [
                                     TheoLiveSource(src: "2vqqekesftg9zuvxu9tdme6kl"),
                                   ]);
@@ -282,7 +314,14 @@ class _MyAppState extends State<MyApp> {
     print("error: ${player.error}");
     print("audio target quality: ${player.audioTracks.first.targetQuality?.uid}");
     print("audio active quality: ${player.audioTracks.first.activeQuality?.uid}");
+    print("video target quality: ${player.videoTracks.first.targetQuality?.uid}");
+    print("video active quality: ${player.videoTracks.first.activeQuality?.uid}");
     print("allowBackgroundPlayback: ${player.allowBackgroundPlayback}");
+
+    if (kIsWeb) {
+      print("theolive publicaitionState: ${player.theoLive?.publicationState}");
+      print("theolive badnetwork: ${player.theoLive?.badNetworkMode}");
+    }
   }
 
   Future<void> _licenseConfigCheckDialog(BuildContext context) async {