@micromag/element-video 0.3.170 → 0.3.172

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/es/index.js +12 -3
  2. package/lib/index.js +12 -3
  3. package/package.json +2 -2
package/es/index.js CHANGED
@@ -38,6 +38,7 @@ var propTypes = {
38
38
  onDurationChange: PropTypes$1.func,
39
39
  onVolumeChange: PropTypes$1.func,
40
40
  onSuspend: PropTypes$1.func,
41
+ onSuspended: PropTypes$1.func,
41
42
  focusable: PropTypes$1.bool,
42
43
  supportedMimes: PropTypes$1.arrayOf(PropTypes$1.string),
43
44
  withPoster: PropTypes$1.bool // onPosterLoaded: PropTypes.func,
@@ -68,6 +69,7 @@ var defaultProps = {
68
69
  onDurationChange: null,
69
70
  onVolumeChange: null,
70
71
  onSuspend: null,
72
+ onSuspended: null,
71
73
  focusable: true,
72
74
  supportedMimes: ['video/mp4', 'video/webm', 'video/ogg'],
73
75
  withPoster: false
@@ -100,6 +102,7 @@ var Video = function Video(_ref) {
100
102
  customOnDurationChange = _ref.onDurationChange,
101
103
  customOnVolumeChange = _ref.onVolumeChange,
102
104
  customOnSuspend = _ref.onSuspend,
105
+ onSuspended = _ref.onSuspended,
103
106
  focusable = _ref.focusable,
104
107
  supportedMimes = _ref.supportedMimes,
105
108
  withPoster = _ref.withPoster;
@@ -204,7 +207,7 @@ var Video = function Video(_ref) {
204
207
  if (customOnVolumeChange !== null) {
205
208
  customOnVolumeChange(element.volume);
206
209
  }
207
- }, [customOnVolumeChange]);
210
+ }, [customOnVolumeChange]); // Manage suspend
208
211
 
209
212
  var _useState = useState(false),
210
213
  _useState2 = _slicedToArray(_useState, 2),
@@ -226,12 +229,18 @@ var Video = function Video(_ref) {
226
229
  }
227
230
  }, [isSuspended, setIsSuspended]);
228
231
  var onSuspend = useCallback(function (e) {
229
- setIsSuspended(true);
232
+ if (e.currentTarget.paused && !paused && !isSuspended) {
233
+ setIsSuspended(true);
234
+
235
+ if (onSuspended !== null) {
236
+ onSuspended();
237
+ }
238
+ }
230
239
 
231
240
  if (customOnSuspend !== null) {
232
241
  customOnSuspend(e);
233
242
  }
234
- }, [setIsSuspended, customOnSuspend]); // Ensure load if preload value change over time
243
+ }, [isSuspended, paused, setIsSuspended, customOnSuspend, onSuspended]); // Ensure load if preload value change over time
235
244
 
236
245
  var firstPreloadRef = useRef(preload);
237
246
  var firstShouldLoadRef = useRef(shouldLoad);
package/lib/index.js CHANGED
@@ -50,6 +50,7 @@ var propTypes = {
50
50
  onDurationChange: PropTypes__default["default"].func,
51
51
  onVolumeChange: PropTypes__default["default"].func,
52
52
  onSuspend: PropTypes__default["default"].func,
53
+ onSuspended: PropTypes__default["default"].func,
53
54
  focusable: PropTypes__default["default"].bool,
54
55
  supportedMimes: PropTypes__default["default"].arrayOf(PropTypes__default["default"].string),
55
56
  withPoster: PropTypes__default["default"].bool // onPosterLoaded: PropTypes.func,
@@ -80,6 +81,7 @@ var defaultProps = {
80
81
  onDurationChange: null,
81
82
  onVolumeChange: null,
82
83
  onSuspend: null,
84
+ onSuspended: null,
83
85
  focusable: true,
84
86
  supportedMimes: ['video/mp4', 'video/webm', 'video/ogg'],
85
87
  withPoster: false
@@ -112,6 +114,7 @@ var Video = function Video(_ref) {
112
114
  customOnDurationChange = _ref.onDurationChange,
113
115
  customOnVolumeChange = _ref.onVolumeChange,
114
116
  customOnSuspend = _ref.onSuspend,
117
+ onSuspended = _ref.onSuspended,
115
118
  focusable = _ref.focusable,
116
119
  supportedMimes = _ref.supportedMimes,
117
120
  withPoster = _ref.withPoster;
@@ -216,7 +219,7 @@ var Video = function Video(_ref) {
216
219
  if (customOnVolumeChange !== null) {
217
220
  customOnVolumeChange(element.volume);
218
221
  }
219
- }, [customOnVolumeChange]);
222
+ }, [customOnVolumeChange]); // Manage suspend
220
223
 
221
224
  var _useState = React.useState(false),
222
225
  _useState2 = _slicedToArray__default["default"](_useState, 2),
@@ -238,12 +241,18 @@ var Video = function Video(_ref) {
238
241
  }
239
242
  }, [isSuspended, setIsSuspended]);
240
243
  var onSuspend = React.useCallback(function (e) {
241
- setIsSuspended(true);
244
+ if (e.currentTarget.paused && !paused && !isSuspended) {
245
+ setIsSuspended(true);
246
+
247
+ if (onSuspended !== null) {
248
+ onSuspended();
249
+ }
250
+ }
242
251
 
243
252
  if (customOnSuspend !== null) {
244
253
  customOnSuspend(e);
245
254
  }
246
- }, [setIsSuspended, customOnSuspend]); // Ensure load if preload value change over time
255
+ }, [isSuspended, paused, setIsSuspended, customOnSuspend, onSuspended]); // Ensure load if preload value change over time
247
256
 
248
257
  var firstPreloadRef = React.useRef(preload);
249
258
  var firstShouldLoadRef = React.useRef(shouldLoad);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/element-video",
3
- "version": "0.3.170",
3
+ "version": "0.3.172",
4
4
  "description": "",
5
5
  "keywords": [
6
6
  "javascript"
@@ -64,5 +64,5 @@
64
64
  "publishConfig": {
65
65
  "access": "public"
66
66
  },
67
- "gitHead": "2aa04370d70f3bc7ee3992cad30b0877b23f5a20"
67
+ "gitHead": "2756b1548b925177e47e054ef31e0968b253b095"
68
68
  }