Fix rotate button behavior on iOS (#138)

This commit is contained in:
Tommy Chow 2022-06-05 17:24:51 -04:00
parent 88dd5676da
commit b18f22ea06
3 changed files with 69 additions and 10 deletions

View file

@ -1,5 +1,6 @@
import 'dart:async';
import 'package:device_info_plus/device_info_plus.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/services.dart';
import 'package:frosty/api/twitch_api.dart';
@ -37,6 +38,9 @@ abstract class VideoStoreBase with Store {
@readonly
var _overlayVisible = true;
@readonly
var _isIPad = false;
@readonly
StreamTwitch? _streamInfo;
@ -152,13 +156,25 @@ abstract class VideoStoreBase with Store {
return NavigationDecision.prevent;
}
void initVideo() {
@action
Future<void> initVideo() async {
try {
controller?.runJavascript('document.getElementsByTagName("video")[0].addEventListener("pause", () => Pause.postMessage("video paused"));');
controller?.runJavascript('document.getElementsByTagName("video")[0].addEventListener("play", () => Play.postMessage("video playing"));');
} catch (e) {
debugPrint(e.toString());
}
// Determine whether the device is an iPad or not.
// Used to show or hide the rotate button on the overlay.
// Flutter doesn't allow programmatic rotation on iPad unless multitasking is disabled.
final deviceInfo = DeviceInfoPlugin();
final info = await deviceInfo.iosInfo;
if (info.model?.toLowerCase().contains('ipad') == true) {
_isIPad = true;
} else {
_isIPad = false;
}
}
void requestPictureInPicture() {

View file

@ -101,6 +101,24 @@ mixin _$VideoStore on VideoStoreBase, Store {
});
}
late final _$_isIPadAtom =
Atom(name: 'VideoStoreBase._isIPad', context: context);
bool get isIPad {
_$_isIPadAtom.reportRead();
return super._isIPad;
}
@override
bool get _isIPad => isIPad;
@override
set _isIPad(bool value) {
_$_isIPadAtom.reportWrite(value, super._isIPad, () {
super._isIPad = value;
});
}
late final _$_streamInfoAtom =
Atom(name: 'VideoStoreBase._streamInfo', context: context);
@ -136,6 +154,14 @@ mixin _$VideoStore on VideoStoreBase, Store {
.run(() => super.handleToggleOverlay());
}
late final _$initVideoAsyncAction =
AsyncAction('VideoStoreBase.initVideo', context: context);
@override
Future<void> initVideo() {
return _$initVideoAsyncAction.run(() => super.initVideo());
}
late final _$VideoStoreBaseActionController =
ActionController(name: 'VideoStoreBase', context: context);

View file

@ -433,18 +433,35 @@ class _VideoOverlay extends StatelessWidget {
);
final rotateButton = IconButton(
tooltip: orientation == Orientation.portrait ? 'Enter Landscape Mode (Lock)' : 'Exit Landscape Mode',
tooltip: orientation == Orientation.portrait ? 'Enter Landscape Mode' : 'Exit Landscape Mode',
icon: const Icon(
Icons.screen_rotation,
color: Colors.white,
),
onPressed: () {
if (orientation == Orientation.portrait) {
SystemChrome.setPreferredOrientations([
DeviceOrientation.landscapeRight,
DeviceOrientation.landscapeLeft,
]);
if (Platform.isIOS) {
if (orientation == Orientation.portrait) {
SystemChrome.setPreferredOrientations([
DeviceOrientation.landscapeRight,
]);
SystemChrome.setPreferredOrientations([]);
} else {
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
]);
SystemChrome.setPreferredOrientations([]);
}
} else {
SystemChrome.setPreferredOrientations([]);
if (orientation == Orientation.portrait) {
SystemChrome.setPreferredOrientations([
DeviceOrientation.landscapeRight,
DeviceOrientation.landscapeLeft,
]);
} else {
SystemChrome.setPreferredOrientations([]);
}
}
},
icon: orientation == Orientation.portrait ? const Icon(Icons.screen_lock_rotation) : const Icon(Icons.screen_rotation),
);
final streamInfo = videoStore.streamInfo;
@ -600,7 +617,7 @@ class _VideoOverlay extends StatelessWidget {
),
if (videoStore.settingsStore.fullScreen && orientation == Orientation.landscape) chatOverlayButton,
refreshButton,
rotateButton,
if (!videoStore.isIPad) rotateButton,
if (orientation == Orientation.landscape) fullScreenButton,
],
),