react-jw-player - npm Package Compare versions

Comparing version 1.7.0 to 1.8.0-alpha.1

dist/create-event-handlers/index.js

@@ -11,2 +11,6 @@ 'use strict';
 
+var _onAdTime = require('./on-ad-time');
+
+var _onAdTime2 = _interopRequireDefault(_onAdTime);
+
 var _onBeforePlay = require('./on-before-play');
@@ -41,2 +45,3 @@
     onAdPlay: _onAdPlay2.default.bind(component),
+    onAdTime: _onAdTime2.default.bind(component),
     onBeforePlay: _onBeforePlay2.default.bind(component),
@@ -43,0 +48,0 @@ onFullScreen: _onFullScreen2.default.bind(component),

dist/create-event-handlers/on-time.js

@@ -7,41 +7,60 @@ "use strict";
 function onTime(event) {
-  var hasFired = this.state.hasFired;
-  var position = event.position,
-      duration = event.duration;
+  var _state = this.state,
+      hasFired = _state.hasFired,
+      _state$previousPositi = _state.previousPositionInteger,
+      previousPositionInteger = _state$previousPositi === undefined ? 0 : _state$previousPositi;
+  var duration = event.duration,
+      position = event.position;
 
-  var hasChanged = false;
+  var currentPositionInteger = Math.floor(position);
 
-  if (!hasFired.threeSeconds && position > 3) {
+  if (previousPositionInteger === currentPositionInteger) {
+    return;
+  }
+
+  var shouldUpdateState = false;
+
+  if (currentPositionInteger === 0) {
+    shouldUpdateState = true;
+  }
+
+  if (currentPositionInteger > previousPositionInteger) {
+    this.props.onEverySecond(currentPositionInteger);
+    shouldUpdateState = true;
+  }
+
+  if (!hasFired.threeSeconds && currentPositionInteger >= 3) {
     this.props.onThreeSeconds();
     hasFired.threeSeconds = true;
-    hasChanged = true;
+    shouldUpdateState = true;
   }
 
-  if (!hasFired.tenSeconds && position > 10) {
+  if (!hasFired.tenSeconds && currentPositionInteger >= 10) {
     this.props.onTenSeconds();
     hasFired.tenSeconds = true;
-    hasChanged = true;
+    shouldUpdateState = true;
   }
 
-  if (!hasFired.thirtySeconds && position > 30) {
+  if (!hasFired.thirtySeconds && currentPositionInteger >= 30) {
     this.props.onThirtySeconds();
     hasFired.thirtySeconds = true;
-    hasChanged = true;
+    shouldUpdateState = true;
   }
 
-  if (!hasFired.fiftyPercent && position / duration * 100 > 50) {
+  if (!hasFired.fiftyPercent && position / duration * 100 >= 50) {
     this.props.onFiftyPercent();
     hasFired.fiftyPercent = true;
-    hasChanged = true;
+    shouldUpdateState = true;
   }
 
-  if (!hasFired.ninetyFivePercent && position / duration * 100 > 95) {
+  if (!hasFired.ninetyFivePercent && position / duration * 100 >= 95) {
     this.props.onNinetyFivePercent();
     hasFired.ninetyFivePercent = true;
-    hasChanged = true;
+    shouldUpdateState = true;
   }
 
-  if (hasChanged) {
+  if (shouldUpdateState) {
     this.setState({
-      hasFired: hasFired
+      hasFired: hasFired,
+      previousPositionInteger: currentPositionInteger
     });
@@ -48,0 +67,0 @@ }

dist/helpers/initialize.js

@@ -23,2 +23,4 @@ 'use strict';
   player.on('adPause', component.props.onAdPause);
+  player.on('adComplete', component.props.onAdComplete);
+  player.on('adTime', component.eventHandlers.onAdTime);
   player.on('fullscreen', component.eventHandlers.onFullScreen);
@@ -25,0 +27,0 @@ player.on('pause', component.props.onPause);

package.json

 {
   "name": "react-jw-player",
-  "version": "1.7.0",
+  "version": "1.8.0-alpha.1",
   "description": "A React component for launching JW Player instances on the client.",
@@ -5,0 +5,0 @@ "main": "dist/react-jw-player.js",

README.md

@@ -129,2 +129,8 @@ # react-jw-player :movie_camera: [![Build Status](https://travis-ci.com/micnews/react-jw-player.svg?token=oCXvx519mb3xud77T3xi&branch=master)](https://travis-ci.com/micnews/react-jw-player)
       * This is the event object passed back from JW Player itself.
+* `onAdComplete(event)`
+  * A function that is run when the user completes the preroll advertisement.
+  * Type: `function`
+  * Arguments:
+    * `event`
+      * This is the event object passed back from JW Player itself.
 
@@ -200,2 +206,10 @@ ## Optional Player Event Hook Props
 ## Optional Time Event Hook Props
+* `onEverySecond(event)`
+  * A function that is run when one second elapses in playhead, including ads.
+  * Type: `function`
+  * Arguments:
+    * `event`
+      * This is the event object passed back from JW Player itself.
+  * Return Value:
+    * `position`: integer
 * `onThreeSeconds(event)`
@@ -202,0 +216,0 @@ * A function that is run when the playhead reaches passed the 3 second mark.

src/create-event-handlers/index.js

 import onAdPlay from './on-ad-play';
+import onAdTime from './on-ad-time';
 import onBeforePlay from './on-before-play';
@@ -12,2 +13,3 @@ import onFullScreen from './on-full-screen';
     onAdPlay: onAdPlay.bind(component),
+    onAdTime: onAdTime.bind(component),
     onBeforePlay: onBeforePlay.bind(component),
@@ -14,0 +16,0 @@ onFullScreen: onFullScreen.bind(component),

src/create-event-handlers/on-time.js

 function onTime(event) {
-  const { hasFired } = this.state;
-  const { position, duration } = event;
-  let hasChanged = false;
+  const { hasFired, previousPositionInteger = 0 } = this.state;
+  const { duration, position } = event;
+  const currentPositionInteger = Math.floor(position);
 
-  if (!hasFired.threeSeconds && position > 3) {
+  if (previousPositionInteger === currentPositionInteger) {
+    return;
+  }
+
+  let shouldUpdateState = false;
+
+  if (currentPositionInteger === 0) {
+    shouldUpdateState = true;
+  }
+
+  if (currentPositionInteger > previousPositionInteger) {
+    this.props.onEverySecond(currentPositionInteger);
+    shouldUpdateState = true;
+  }
+
+  if (!hasFired.threeSeconds && currentPositionInteger >= 3) {
     this.props.onThreeSeconds();
     hasFired.threeSeconds = true;
-    hasChanged = true;
+    shouldUpdateState = true;
   }
 
-  if (!hasFired.tenSeconds && position > 10) {
+  if (!hasFired.tenSeconds && currentPositionInteger >= 10) {
     this.props.onTenSeconds();
     hasFired.tenSeconds = true;
-    hasChanged = true;
+    shouldUpdateState = true;
   }
 
-  if (!hasFired.thirtySeconds && position > 30) {
+  if (!hasFired.thirtySeconds && currentPositionInteger >= 30) {
     this.props.onThirtySeconds();
     hasFired.thirtySeconds = true;
-    hasChanged = true;
+    shouldUpdateState = true;
   }
 
-  if (!hasFired.fiftyPercent && ((position / duration) * 100) > 50) {
+  if (!hasFired.fiftyPercent && ((position / duration) * 100) >= 50) {
     this.props.onFiftyPercent();
     hasFired.fiftyPercent = true;
-    hasChanged = true;
+    shouldUpdateState = true;
   }
 
-  if (!hasFired.ninetyFivePercent && ((position / duration) * 100) > 95) {
+  if (!hasFired.ninetyFivePercent && ((position / duration) * 100) >= 95) {
     this.props.onNinetyFivePercent();
     hasFired.ninetyFivePercent = true;
-    hasChanged = true;
+    shouldUpdateState = true;
   }
 
-  if (hasChanged) {
+  if (shouldUpdateState) {
     this.setState({
       hasFired,
+      previousPositionInteger: currentPositionInteger,
     });
@@ -40,0 +56,0 @@ }

src/helpers/initialize.js

@@ -14,2 +14,4 @@ function initialize({ component, player, playerOpts }) {
   player.on('adPause', component.props.onAdPause);
+  player.on('adComplete', component.props.onAdComplete);
+  player.on('adTime', component.eventHandlers.onAdTime);
   player.on('fullscreen', component.eventHandlers.onFullScreen);
@@ -16,0 +18,0 @@ player.on('pause', component.props.onPause);

test/initialize.test.js

@@ -76,7 +76,2 @@ import test from 'tape';
   t.equal(
-    playerFunctions.adPause, mockComponent.props.onAdPause,
-    'it sets the adPause event with the onAdPause() prop',
-  );
-
-  t.equal(
     playerFunctions.pause, mockComponent.props.onPause,
@@ -87,7 +82,2 @@ 'it sets the pause event with the onPause() prop',
   t.equal(
-    playerFunctions.beforeComplete, mockComponent.props.onOneHundredPercent,
-    'it sets the beforeComplete event with the onOneHundredPercent() prop',
-  );
-
-  t.equal(
     playerFunctions.setupError, mockComponent.eventHandlers.onError,
@@ -108,2 +98,17 @@ 'it sets the setupError event with the onError() eventHandler',
   t.equal(
+    playerFunctions.adPause, mockComponent.props.onAdPause,
+    'it sets the adPause event with the onAdPause() prop',
+  );
+
+  t.equal(
+    playerFunctions.adComplete, mockComponent.props.onAdComplete,
+    'it sets the adComplete event with the onAdComplete() prop',
+  );
+
+  t.equal(
+    playerFunctions.adTime, mockComponent.eventHandlers.onAdTime,
+    'it sets the adTime event with the onAdTime() eventHandler',
+  );
+
+  t.equal(
     playerFunctions.fullscreen, mockComponent.eventHandlers.onFullScreen,
@@ -133,3 +138,8 @@ 'it sets the fullscreen event with the onFullScreen() eventHandler',
 
+  t.equal(
+    playerFunctions.beforeComplete, mockComponent.props.onOneHundredPercent,
+    'it sets the beforeComplete event with the onOneHundredPercent() prop',
+  );
+
   t.end();
 });

test/on-time.test.js

@@ -6,3 +6,5 @@ import test from 'tape';
 function createMockComponent() {
-  const results = {};
+  const results = {
+    onEverySecondCallCount: 0,
+  };
 
@@ -32,2 +34,6 @@ return {
       },
+      onEverySecond(event) {
+        results.onEverySecondCallCount += 1;
+        results.onEverySecondArgs = event;
+      },
     }),
@@ -43,3 +49,3 @@ results,
     duration: 100,
-    position: 3,
+    position: 2,
   };
@@ -91,3 +97,3 @@ const onTime = createEventHandlers(mockComponent).onTime;
   t.doesNotThrow(onTime.bind(null, mockEvent), 'it runs without error one second later');
-  t.equal(mockComponent.state, currentState, 'it does not change component state a second time');
+  t.equal(mockComponent.state.hasFired, currentState.hasFired, 'hasFired in state is not modified one second later');
   t.notOk(
@@ -147,3 +153,3 @@ results.onThreeSecondsCalled,
   t.doesNotThrow(onTime.bind(null, mockEvent), 'it runs without error one second later');
-  t.equal(mockComponent.state, currentState, 'it does not change component state a second time');
+  t.equal(mockComponent.state.hasFired, currentState.hasFired, 'hasFired in state is not modified one second later');
   t.notOk(
@@ -205,3 +211,3 @@ results.onThreeSecondsCalled,
   t.doesNotThrow(onTime.bind(null, mockEvent), 'it runs without error one second later');
-  t.equal(mockComponent.state, currentState, 'it does not change component state a second time');
+  t.equal(mockComponent.state.hasFired, currentState.hasFired, 'hasFired in state is not modified one second later');
   t.notOk(
@@ -265,3 +271,3 @@ results.onThreeSecondsCalled,
   t.doesNotThrow(onTime.bind(null, mockEvent), 'it runs without error one second later');
-  t.equal(mockComponent.state, currentState, 'it does not change component state a second time');
+  t.equal(mockComponent.state.hasFired, currentState.hasFired, 'hasFired in state is not modified one second later');
   t.notOk(
@@ -327,3 +333,3 @@ results.onThreeSecondsCalled,
   t.doesNotThrow(onTime.bind(null, mockEvent), 'it runs without error one second later');
-  t.equal(mockComponent.state, currentState, 'it does not change component state a second time');
+  t.equal(mockComponent.state.hasFired, currentState.hasFired, 'hasFired in state is not modified one second later');
   t.notOk(
@@ -352,1 +358,28 @@ results.onThreeSecondsCalled,
 });
+
+test('eventHandlers.onEverySecond() when video position is from 0 to 2', (t) => {
+  const { mockComponent, results } = createMockComponent();
+
+  const mockEvent = {
+    duration: 100,
+    position: 0,
+  };
+  const onTime = createEventHandlers(mockComponent).onTime;
+
+  t.doesNotThrow(onTime.bind(null, mockEvent), 'it runs without error');
+  t.deepEqual(results.onEverySecondCallCount, 0, 'it does not invoke onEverySecond() prop on initial call');
+
+  mockEvent.position = 1;
+
+  t.doesNotThrow(onTime.bind(null, mockEvent), 'it runs without error one second later');
+  t.deepEqual(results.onEverySecondCallCount, 1, 'it invoke onEverySecond() prop at one second');
+  t.deepEqual(mockComponent.state.previousPositionInteger, 1, 'stores 1 as previous position');
+
+  mockEvent.position = 2;
+
+  t.doesNotThrow(onTime.bind(null, mockEvent), 'it runs without error one second later');
+  t.deepEqual(results.onEverySecondCallCount, 2, 'it invoke onEverySecond() prop at two seconds');
+  t.deepEqual(mockComponent.state.previousPositionInteger, 2, 'stores 2 as previous position');
+
+  t.end();
+});

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

80190

increased by9.33%

Number of package files

52

increased by6.12%

Lines of code

1929

increased by8.68%

Number of lines in readme file

312

increased by4.7%

Worsened metrics

Number of low quality alerts

1

increased byInfinity%

No dependency changes