|
@@ -152,7 +152,8 @@ class VideoTransform extends Component<Props, State> {
|
152
|
152
|
|
153
|
153
|
this.state = {
|
154
|
154
|
layout: null,
|
155
|
|
- transform: DEFAULT_TRANSFORM
|
|
155
|
+ transform:
|
|
156
|
+ this._getSavedTransform(props.streamId) || DEFAULT_TRANSFORM
|
156
|
157
|
};
|
157
|
158
|
|
158
|
159
|
this._didMove = this._didMove.bind(this);
|
|
@@ -166,14 +167,7 @@ class VideoTransform extends Component<Props, State> {
|
166
|
167
|
this._onPanResponderRelease = this._onPanResponderRelease.bind(this);
|
167
|
168
|
this._onStartShouldSetPanResponder
|
168
|
169
|
= this._onStartShouldSetPanResponder.bind(this);
|
169
|
|
- }
|
170
|
170
|
|
171
|
|
- /**
|
172
|
|
- * Implements React Component's componentWillMount.
|
173
|
|
- *
|
174
|
|
- * @inheritdoc
|
175
|
|
- */
|
176
|
|
- componentWillMount() {
|
177
|
171
|
// The move threshold should be adaptive to the pixel ratio of the
|
178
|
172
|
// screen to avoid making it too sensitive or difficult to handle on
|
179
|
173
|
// different pixel ratio screens.
|
|
@@ -189,21 +183,17 @@ class VideoTransform extends Component<Props, State> {
|
189
|
183
|
onShouldBlockNativeResponder: () => false,
|
190
|
184
|
onStartShouldSetPanResponder: this._onStartShouldSetPanResponder
|
191
|
185
|
});
|
192
|
|
-
|
193
|
|
- const { streamId } = this.props;
|
194
|
|
-
|
195
|
|
- this._restoreTransform(streamId);
|
196
|
186
|
}
|
197
|
187
|
|
198
|
188
|
/**
|
199
|
|
- * Implements React Component's componentWillReceiveProps.
|
|
189
|
+ * Implements React Component's componentDidUpdate.
|
200
|
190
|
*
|
201
|
191
|
* @inheritdoc
|
202
|
192
|
*/
|
203
|
|
- componentWillReceiveProps({ streamId: newStreamId }) {
|
204
|
|
- if (this.props.streamId !== newStreamId) {
|
205
|
|
- this._storeTransform();
|
206
|
|
- this._restoreTransform(newStreamId);
|
|
193
|
+ componentDidUpdate(prevProps, prevState) {
|
|
194
|
+ if (prevProps.streamId !== this.props.streamId) {
|
|
195
|
+ this._storeTransform(prevProps.streamId, prevState.transform);
|
|
196
|
+ this._restoreTransform(this.props.streamId);
|
207
|
197
|
}
|
208
|
198
|
}
|
209
|
199
|
|
|
@@ -213,7 +203,7 @@ class VideoTransform extends Component<Props, State> {
|
213
|
203
|
* @inheritdoc
|
214
|
204
|
*/
|
215
|
205
|
componentWillUnmount() {
|
216
|
|
- this._storeTransform();
|
|
206
|
+ this._storeTransform(this.props.streamId, this.state.transform);
|
217
|
207
|
}
|
218
|
208
|
|
219
|
209
|
/**
|
|
@@ -293,6 +283,20 @@ class VideoTransform extends Component<Props, State> {
|
293
|
283
|
|| Math.abs(dy) > this.moveThreshold;
|
294
|
284
|
}
|
295
|
285
|
|
|
286
|
+ /**
|
|
287
|
+ * Returns the stored transform a stream should display with initially.
|
|
288
|
+ *
|
|
289
|
+ * @param {string} streamId - The id of the stream to match with a stored
|
|
290
|
+ * transform.
|
|
291
|
+ * @private
|
|
292
|
+ * @returns {Object | null}
|
|
293
|
+ */
|
|
294
|
+ _getSavedTransform(streamId) {
|
|
295
|
+ const { enabled, _transforms } = this.props;
|
|
296
|
+
|
|
297
|
+ return (enabled && _transforms[streamId]) || null;
|
|
298
|
+ }
|
|
299
|
+
|
296
|
300
|
_getTouchDistance: Object => number;
|
297
|
301
|
|
298
|
302
|
/**
|
|
@@ -647,31 +651,29 @@ class VideoTransform extends Component<Props, State> {
|
647
|
651
|
* @returns {void}
|
648
|
652
|
*/
|
649
|
653
|
_restoreTransform(streamId) {
|
650
|
|
- const { enabled, _transforms } = this.props;
|
|
654
|
+ const savedTransform = this._getSavedTransform(streamId);
|
651
|
655
|
|
652
|
|
- if (enabled) {
|
653
|
|
- const initialTransform = _transforms[streamId];
|
654
|
|
-
|
655
|
|
- if (initialTransform) {
|
656
|
|
- this.setState({
|
657
|
|
- transform: initialTransform
|
658
|
|
- });
|
659
|
|
- }
|
|
656
|
+ if (savedTransform) {
|
|
657
|
+ this.setState({
|
|
658
|
+ transform: savedTransform
|
|
659
|
+ });
|
660
|
660
|
}
|
661
|
661
|
}
|
662
|
662
|
|
663
|
663
|
/**
|
664
|
|
- * Stores/saves the current transform when the component is destroyed, or a
|
|
664
|
+ * Stores/saves the a transform when the component is destroyed, or a
|
665
|
665
|
* new stream is about to be rendered.
|
666
|
666
|
*
|
|
667
|
+ * @param {string} streamId - The stream id associated with the transform.
|
|
668
|
+ * @param {Object} transform - The {@Transform} to save.
|
667
|
669
|
* @private
|
668
|
670
|
* @returns {void}
|
669
|
671
|
*/
|
670
|
|
- _storeTransform() {
|
671
|
|
- const { _onUnmount, enabled, streamId } = this.props;
|
|
672
|
+ _storeTransform(streamId, transform) {
|
|
673
|
+ const { _onUnmount, enabled } = this.props;
|
672
|
674
|
|
673
|
675
|
if (enabled) {
|
674
|
|
- _onUnmount(streamId, this.state.transform);
|
|
676
|
+ _onUnmount(streamId, transform);
|
675
|
677
|
}
|
676
|
678
|
}
|
677
|
679
|
}
|