Merge pull request #10 from BrightcovePS/on-landscape-rotate

Implemented the setFullscreen on rotation
pankaj-pp · Jul 1, 2019 · 349dc12 · 349dc12
2 parents 2b21158 + 364b13b
commit 349dc12
Show file tree

Hide file tree

Showing 8 changed files with 113 additions and 9 deletions.
diff --git a/android/src/main/java/jp/manse/BrightcovePlayerManager.java b/android/src/main/java/jp/manse/BrightcovePlayerManager.java
@@ -17,6 +17,7 @@
 public class BrightcovePlayerManager extends SimpleViewManager<BrightcovePlayerView> {
     public static final String REACT_CLASS = "BrightcovePlayer";
     public static final int COMMAND_SEEK_TO = 1;
+    public static final int COMMAND_SET_FULLSCREEN = 2;
     public static final String EVENT_READY = "ready";
     public static final String EVENT_PLAY = "play";
     public static final String EVENT_PAUSE = "pause";
@@ -111,8 +112,8 @@ public void setFullscreen(BrightcovePlayerView view, boolean fullscreen) {
     @Override
     public Map<String, Integer> getCommandsMap() {
         return MapBuilder.of(
-                "seekTo",
-                COMMAND_SEEK_TO
+                "seekTo", COMMAND_SEEK_TO,
+                "setFullscreen", COMMAND_SET_FULLSCREEN
         );
     }
 
@@ -125,6 +126,14 @@ public void receiveCommand(BrightcovePlayerView view, int commandType, @Nullable
                 view.seekTo((int)(args.getDouble(0) * 1000));
                 return;
             }
+            case COMMAND_SET_FULLSCREEN: {
+                if (args.getBoolean(0)) {
+                    view.dispatchEnterFullScreenClickEvent();
+                } else {
+                    view.dispatchExitFullScreenClickEvent();
+                }
+                return;
+            }
         }
     }
 

diff --git a/android/src/main/java/jp/manse/BrightcovePlayerView.java b/android/src/main/java/jp/manse/BrightcovePlayerView.java
@@ -169,12 +169,25 @@ public void processEvent(Event e) {
         });
     }
 
+    public void dispatchEnterFullScreenClickEvent() {
+        this.playerVideoView.getEventEmitter().emit(EventType.ENTER_FULL_SCREEN);
+    }
+
+    public void dispatchExitFullScreenClickEvent() {
+        this.playerVideoView.getEventEmitter().emit(EventType.EXIT_FULL_SCREEN);
+    }
+
     @Override
     public void onConfigurationChanged(Configuration newConfig) {
         super.onConfigurationChanged(newConfig);
+        adjustMediaControllerDimensions();
+    }
+
+    private void adjustMediaControllerDimensions() {
         mediaController.show();
         mediaController.getBrightcoveControlBar().setVisibility(VISIBLE);
         mediaController.getBrightcoveControlBar().setMinimumWidth(getWidth());
+        mediaController.getBrightcoveControlBar().setAlign(true);
     }
 
     public void setPolicyKey(String policyKey) {

diff --git a/example/android/app/src/main/java/com/example/MainActivity.java b/example/android/app/src/main/java/com/example/MainActivity.java
@@ -1,5 +1,8 @@
 package com.example;
 
+import android.content.Intent;
+import android.content.res.Configuration;
+
 import com.facebook.react.ReactActivity;
 import com.facebook.react.ReactActivityDelegate;
 import com.facebook.react.ReactRootView;
@@ -25,4 +28,12 @@ protected ReactRootView createRootView() {
       }
     };
   }
+
+    @Override
+    public void onConfigurationChanged(Configuration newConfig) {
+        super.onConfigurationChanged(newConfig);
+        Intent intent = new Intent("onConfigurationChanged");
+        intent.putExtra("newConfig", newConfig);
+        this.sendBroadcast(intent);
+    }
 }
diff --git a/example/components/BCPlayer.js b/example/components/BCPlayer.js
@@ -6,8 +6,17 @@ import Orientation from 'react-native-orientation';
 
 export default class BCPlayer extends Component {
 
-	state = {
-		orientation: null
+	constructor(props) {
+		super(props);
+
+		this.state = {
+			orientation: null,
+			forcedOrientation: false
+		}
+
+		this.orientationDidChange = this.orientationDidChange.bind(this);
+		this.onBeforeEnterFullscreen = this.onBeforeEnterFullscreen.bind(this);
+		this.onBeforeExitFullscreen = this.onBeforeExitFullscreen.bind(this);
 	}
 
 	componentWillMount() {
@@ -18,27 +27,62 @@ export default class BCPlayer extends Component {
 
 		const initial = Orientation.getInitialOrientation();
 		this.setState({ orientation: initial });
+		// Remember to remove listener
+		Orientation.removeOrientationListener(this.orientationDidChange);
+	}
+
+	componentDidMount() {
+ 		Orientation.addOrientationListener(this.orientationDidChange);
 	}
 
 	onBeforeEnterFullscreen() {
-		Orientation.lockToLandscape();
+
+		if (this.state.orientation === 'PORTRAIT') {
+			this.setState({ forcedOrientation: true });
+			Orientation.lockToLandscape();
+		}
+
 		this.props.onBeforeEnterFullscreen  && this.props.onBeforeEnterFullscreen();
 	}
 
 	onBeforeExitFullscreen() {
+		this.setState({ forcedOrientation: false });
+
 		Orientation.lockToPortrait();
 		Orientation.unlockAllOrientations();
+
 		this.props.onBeforeExitFullscreen  && this.props.onBeforeExitFullscreen();
 	}
 
+	orientationDidChange(orientation) {
+		console.log("orientation did change");
+		// If the player hasn't been loaded yet, then don't do anything
+		if (!this.player) return;
+
+		switch (orientation) {
+			case 'LANDSCAPE':
+				// Only set the fullscreen in this case, if the forced orientation by the "lockTolandscape" hasn't been called
+				// otherwise, if you call the setfullscreen twice, it might be buggy
+				if (!this.state.forcedOrientation) {
+					this.player.setFullscreen(true);
+				}
+			break;
+			case 'PORTRAIT':
+				this.player.setFullscreen(false);
+			break;
+		}
+
+		this.setState({ orientation });
+	}
+
 	render() {
 		return (<BrightcovePlayer
+					ref={(player) => this.player = player}
 					{...this.props}
 					style={[styles.player, this.props.style]}
-					onBeforeEnterFullscreen={this.onBeforeEnterFullscreen.bind(this)}
-					onBeforeExitFullscreen={this.onBeforeExitFullscreen.bind(this)}
+					onBeforeEnterFullscreen={this.onBeforeEnterFullscreen}
+					onBeforeExitFullscreen={this.onBeforeExitFullscreen}
 				/>
-
 		);
 	}
 }

diff --git a/index.d.ts b/index.d.ts
@@ -35,6 +35,7 @@ export class BrightcovePlayer extends React.Component<
   {}
 > {
   seekTo(position: number): {};
+  setFullscreen(fullscreen: boolean): {};
 }
 
 export type BrightcovePlayerPosterProps = {

diff --git a/ios/BrightcovePlayer.h b/ios/BrightcovePlayer.h
@@ -44,6 +44,7 @@
 @property (nonatomic, copy) RCTDirectEventBlock onExitFullscreen;
 
 -(void) seekTo:(NSNumber *)time;
+-(void) setFullscreen:(BOOL *)fullscreen;
 -(void)dispose;
 
 @end
diff --git a/ios/BrightcovePlayerManager.m b/ios/BrightcovePlayerManager.m
@@ -49,6 +49,15 @@ - (dispatch_queue_t)methodQueue {
     }];
 }
 
+RCT_EXPORT_METHOD(setFullscreen:(nonnull NSNumber *)reactTag fullscreen:(BOOL)fullscreen) {
+    [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
+        BrightcovePlayer *player = (BrightcovePlayer*)viewRegistry[reactTag];
+        if ([player isKindOfClass:[BrightcovePlayer class]]) {
+            [player setFullscreen:fullscreen];
+        }
+    }];
+}
+
 RCT_EXPORT_METHOD(dispose:(nonnull NSNumber *)reactTag) {
     [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
         BrightcovePlayer *player = (BrightcovePlayer*)viewRegistry[reactTag];

diff --git a/src/BrightcovePlayer.js b/src/BrightcovePlayer.js
@@ -100,12 +100,28 @@ BrightcovePlayer.prototype.seekTo = Platform.select({
   android: function(seconds) {
     UIManager.dispatchViewManagerCommand(
       ReactNative.findNodeHandle(this._root),
-      UIManager.BrightcovePlayer.Commands.seekTo,
+      UIManager.getViewManagerConfig('BrightcovePlayer').Commands.seekTo,
       [seconds]
     );
   }
 });
 
+BrightcovePlayer.prototype.setFullscreen = Platform.select({
+  ios: function(fullscreen) {
+    NativeModules.BrightcovePlayerManager.setFullscreen(
+      ReactNative.findNodeHandle(this),
+      fullscreen
+    );
+  },
+  android: function(fullscreen) {
+    UIManager.dispatchViewManagerCommand(
+      ReactNative.findNodeHandle(this._root),
+      UIManager.getViewManagerConfig('BrightcovePlayer').Commands.setFullscreen,
+      [fullscreen]
+    );
+  }
+});
+
 BrightcovePlayer.propTypes = {
   ...(ViewPropTypes || View.propTypes),
   policyKey: PropTypes.string,