@@ -304,19 +304,37 @@ return /******/ (function(modules) { // webpackBootstrap
304
304
/**
305
305
* Seeks the video timeline.
306
306
* @param {number } time The value in seconds to seek to
307
+ * @param {bool } forceUpdate Forces a state update without waiting for
308
+ * throttled event.
307
309
* @return {undefined }
308
310
*/
309
- seek : function seek ( time ) {
311
+ seek : function seek ( time , forceUpdate ) {
310
312
this . videoEl . currentTime = time ;
313
+ // In some use cases, we wish not to wait for `onSeeked` or `onSeeking`
314
+ // throttled event to update state so we force it. This is because
315
+ // this method is often triggered when dragging a bar and can feel janky.
316
+ // See https://github.com/mderrick/react-html5video/issues/43
317
+ if ( forceUpdate ) {
318
+ this . updateStateFromVideo ( ) ;
319
+ }
311
320
} ,
312
321
313
322
/**
314
323
* Sets the video volume.
315
324
* @param {number } volume The volume level between 0 and 1.
325
+ * @param {bool } forceUpdate Forces a state update without waiting for
326
+ * throttled event.
316
327
* @return {undefined }
317
328
*/
318
- setVolume : function setVolume ( volume ) {
329
+ setVolume : function setVolume ( volume , forceUpdate ) {
319
330
this . videoEl . volume = volume ;
331
+ // In some use cases, we wish not to wait for `onVolumeChange`
332
+ // throttled event to update state so we force it. This is because
333
+ // this method is often triggered when dragging a bar and can feel janky.
334
+ // See https://github.com/mderrick/react-html5video/issues/43
335
+ if ( forceUpdate ) {
336
+ this . updateStateFromVideo ( ) ;
337
+ }
320
338
} ,
321
339
322
340
/**
@@ -1422,7 +1440,7 @@ return /******/ (function(modules) { // webpackBootstrap
1422
1440
* @return {undefined }
1423
1441
*/
1424
1442
seek : function seek ( e ) {
1425
- this . props . seek ( e . target . value * this . props . duration / 100 ) ;
1443
+ this . props . seek ( e . target . value * this . props . duration / 100 , true ) ;
1426
1444
} ,
1427
1445
1428
1446
onFocus : function onFocus ( ) {
@@ -1655,7 +1673,7 @@ return /******/ (function(modules) { // webpackBootstrap
1655
1673
* @return {undefined }
1656
1674
*/
1657
1675
changeVolume : function changeVolume ( e ) {
1658
- this . props . setVolume ( e . target . value / 100 ) ;
1676
+ this . props . setVolume ( e . target . value / 100 , true ) ;
1659
1677
this . props . unmute ( ) ;
1660
1678
} ,
1661
1679
0 commit comments