Fixing video player reloading state randomly

ios/Runner.xcodeproj/project.pbxproj

@@ -357,7 +357,7 @@
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CLANG_ENABLE_MODULES = YES;
 				CODE_SIGN_ENTITLEMENTS = Runner/Runner.entitlements;
-				CURRENT_PROJECT_VERSION = 23;
+				CURRENT_PROJECT_VERSION = 26;
 				DEVELOPMENT_TEAM = 3TCN256Z4Z;
 				ENABLE_BITCODE = NO;
 				INFOPLIST_FILE = Runner/Info.plist;
@@ -488,7 +488,7 @@
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CLANG_ENABLE_MODULES = YES;
 				CODE_SIGN_ENTITLEMENTS = Runner/Runner.entitlements;
-				CURRENT_PROJECT_VERSION = 23;
+				CURRENT_PROJECT_VERSION = 26;
 				DEVELOPMENT_TEAM = 3TCN256Z4Z;
 				ENABLE_BITCODE = NO;
 				"EXCLUDED_ARCHS[sdk=iphonesimulator*]" = "i386 arm64";
@@ -514,7 +514,7 @@
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CLANG_ENABLE_MODULES = YES;
 				CODE_SIGN_ENTITLEMENTS = Runner/Runner.entitlements;
-				CURRENT_PROJECT_VERSION = 23;
+				CURRENT_PROJECT_VERSION = 26;
 				DEVELOPMENT_TEAM = 3TCN256Z4Z;
 				ENABLE_BITCODE = NO;
 				INFOPLIST_FILE = Runner/Info.plist;

ios/Runner/Info.plist

@@ -34,7 +34,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>23</string>
+	<string>26</string>
 	<key>FlutterDeepLinkingEnabled</key>
 	<true/>
 	<key>LSRequiresIPhoneOS</key>

lib/components/FTLPlayer.dart

@@ -76,10 +76,13 @@ class _FTLPlayerState extends State<FTLPlayer> {
       print(error);
       await Sentry.captureMessage(
           "Failed to attach session / plugin in FTLPlayer");
-      setState(() {
-        _errored = true;
-        _loading = false;
-      });
+
+      if (mounted) {
+        setState(() {
+          _errored = true;
+          _loading = false;
+        });
+      }
       return;
     }
     await this.watchChannel(widget.channel.id);
@@ -104,12 +107,16 @@ class _FTLPlayerState extends State<FTLPlayer> {
             _loading = false;
           });
         } catch (error) {
+          // We can likely retry loading this stream with initJanusClient();
           print(error);
           await Sentry.captureMessage("Failed to handle plugin answer");
-          setState(() {
-            _errored = true;
-            _loading = false;
-          });
+
+          if (mounted) {
+            setState(() {
+              _errored = true;
+              _loading = false;
+            });
+          }
           return;
         }
       }
@@ -122,11 +129,11 @@ class _FTLPlayerState extends State<FTLPlayer> {
         await Sentry.captureMessage(
             "Polling has failed without telling us, resetting the widget");
         timer.cancel();
-        setState(() {
-          _errored = true;
-          _loading = false;
-        });
-        initJanusClient();
+
+        if (mounted) {
+          // If we're not mounted, we can just forget about it
+          initJanusClient();
+        }
       }
     });
   }
@@ -165,6 +172,11 @@ class _FTLPlayerState extends State<FTLPlayer> {
   Widget build(BuildContext context) {
     return Stack(
       children: [
+        // Background layers that the video will take over when properly loaded
+        Image.network(widget.channel.thumbnail),
+        Container(
+          decoration: BoxDecoration(color: Colors.black45),
+        ),
         _errored
             ? Center(
                 child: Text("Error loading video, please try again."),

lib/screens/ChannelScreen.dart

@@ -16,6 +16,7 @@ class ChannelScreen extends StatelessWidget {
   Widget build(BuildContext context) {
     return BlocBuilder<ChannelBloc, ChannelState>(
         builder: (BuildContext context, ChannelState state) {
+      print("BlocBuilder $state");
       if (state is ChannelLoading) {
         return Scaffold(
           body: SafeArea(
@@ -41,26 +42,41 @@ class ChannelScreen extends StatelessWidget {
         final JanusEdgeRoute edgeRoute = state.edgeRoute;
 
         Widget chatWidget = Chat(channel: channel);
+        Widget videoWidget = Stack(
+          children: [
+            AspectRatio(
+              aspectRatio: 16 / 9,
+              child: FTLPlayer(channel: channel, edgeUrl: edgeRoute.url),
+            ),
+            InkWell(
+              child: Padding(
+                padding: EdgeInsets.all(5),
+                child: Icon(
+                  Icons.chevron_left,
+                  color: Colors.white70,
+                ),
+              ),
+              onTap: () => Navigator.pop(context),
+            )
+          ],
+        );
 
         return Scaffold(
           body: SafeArea(
-            child: OrientationBuilder(
-              builder: (context, orientation) {
-                if (orientation == Orientation.portrait) {
-                  return _buildStacked(
-                    _videoPlayer(context, edgeRoute.url),
-                    chatWidget,
-                  );
+            child: LayoutBuilder(
+              builder: (BuildContext context, BoxConstraints constraints) {
+                print("rebuild orientation");
+
+                if (constraints.maxWidth < 992) {
+                  print("showing stacked");
+                  return _buildStacked(videoWidget, chatWidget);
+                } else if (constraints.maxWidth < constraints.maxHeight) {
+                  print("showing video only");
+                  // Mobile phone but landscape?
+                  return videoWidget;
                 } else {
-                  double width = MediaQuery.of(context).size.width;
-                  // 1000 is arbitrary...
-                  if (width < 1000) {
-                    return _videoPlayer(context, edgeRoute.url,
-                        forceAspectRatio: false);
-                  } else {
-                    return _buildSidebar(
-                        _videoPlayer(context, edgeRoute.url), chatWidget);
-                  }
+                  print("showing sidebar");
+                  return _buildSidebar(videoWidget, chatWidget);
                 }
               },
             ),
@@ -90,33 +106,6 @@ class ChannelScreen extends StatelessWidget {
     );
   }
 
-  Widget _videoPlayer(context, url, {forceAspectRatio = true}) {
-    Widget ftlPlayer = FTLPlayer(channel: channel, edgeUrl: url);
-    Widget videoChild = forceAspectRatio
-        ? AspectRatio(
-            aspectRatio: 16 / 9,
-            child: ftlPlayer,
-          )
-        : Center(child: ftlPlayer);
-    final Widget subtree = Stack(
-      children: [
-        videoChild,
-        InkWell(
-          child: Padding(
-            padding: EdgeInsets.all(5),
-            child: Icon(
-              Icons.chevron_left,
-              color: Colors.white70,
-            ),
-          ),
-          onTap: () => Navigator.pop(context),
-        )
-      ],
-    );
-
-    return subtree;
-  }
-
   Widget _buildStacked(
     Widget videoPlayer,
     Widget chatWidget,

pubspec.yaml

@@ -15,7 +15,7 @@ publish_to: 'none' # Remove this line if you wish to publish to pub.dev
 # In iOS, build-name is used as CFBundleShortVersionString while build-number used as CFBundleVersion.
 # Read more about iOS versioning at
 # https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html
-version: 1.0.0+23
+version: 1.0.0+26
 
 environment:
   sdk: '>=2.12.0 <3.0.0'