opentok-react - npm Package Compare versions

Comparing version 0.7.0 to 0.8.0

dist/OTPublisher.js

@@ -23,2 +23,4 @@ 'use strict';
 
+var _fp = require('lodash/fp');
+
 var _uuid = require('uuid');
@@ -39,3 +41,3 @@
 
-  function OTPublisher(props) {
+  function OTPublisher(props, context) {
     _classCallCheck(this, OTPublisher);
@@ -55,3 +57,4 @@
       publisher: null,
-      lastStreamId: ''
+      lastStreamId: '',
+      session: props.session || context.session || null
     };
@@ -68,3 +71,3 @@ return _this;
     key: 'componentDidUpdate',
-    value: function componentDidUpdate(prevProps) {
+    value: function componentDidUpdate(prevProps, prevState) {
       var _this2 = this;
@@ -98,4 +101,4 @@
 
-      if (this.props.session !== prevProps.session) {
-        this.destroyPublisher(prevProps.session);
+      if (this.state.session !== prevState.session) {
+        this.destroyPublisher(prevState.session);
         this.createPublisher();
@@ -107,4 +110,4 @@ }
     value: function componentWillUnmount() {
-      if (this.props.session) {
-        this.props.session.off('sessionConnected', this.sessionConnectedHandler);
+      if (this.state.session) {
+        this.state.session.off('sessionConnected', this.sessionConnectedHandler);
       }
@@ -124,3 +127,3 @@
 
-      var session = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props.session;
+      var session = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.state.session;
 
@@ -152,3 +155,3 @@ delete this.publisherId;
 
-      this.props.session.publish(publisher, function (err) {
+      this.state.session.publish(publisher, function (err) {
         if (publisherId !== _this4.publisherId) {
@@ -171,3 +174,3 @@ // Either this publisher has been recreated or the
 
-      if (!this.props.session) {
+      if (!this.state.session) {
         this.setState({ publisher: null, lastStreamId: '' });
@@ -216,9 +219,10 @@ return;
       if (this.props.eventHandlers && _typeof(this.props.eventHandlers) === 'object') {
-        publisher.on(this.props.eventHandlers);
+        var handles = (0, _fp.omitBy)(_fp.isNil)(this.props.eventHandlers);
+        publisher.on(handles);
       }
 
-      if (this.props.session.connection) {
+      if (this.state.session.connection) {
         this.publishToSession(publisher);
       } else {
-        this.props.session.once('sessionConnected', this.sessionConnectedHandler);
+        this.state.session.once('sessionConnected', this.sessionConnectedHandler);
       }
@@ -234,3 +238,3 @@
       return _react2.default.createElement('div', { ref: function ref(node) {
-          return _this6.node = node;
+          _this6.node = node;
         } });
@@ -270,2 +274,14 @@ }
   onError: null
+};
+
+OTPublisher.contextTypes = {
+  session: _propTypes2.default.shape({
+    connection: _propTypes2.default.shape({
+      connectionId: _propTypes2.default.string
+    }),
+    once: _propTypes2.default.func,
+    off: _propTypes2.default.func,
+    publish: _propTypes2.default.func,
+    unpublish: _propTypes2.default.func
+  })
 };

dist/OTSession.js

@@ -46,2 +46,7 @@ 'use strict';
   _createClass(OTSession, [{
+    key: 'getChildContext',
+    value: function getChildContext() {
+      return { session: this.sessionHelper.session, streams: this.state.streams };
+    }
+  }, {
     key: 'componentWillMount',
@@ -102,15 +107,6 @@ value: function componentWillMount() {
     value: function render() {
-      var _this3 = this;
-
-      var childrenWithProps = _react.Children.map(this.props.children, function (child) {
-        return child ? (0, _react.cloneElement)(child, {
-          session: _this3.sessionHelper.session,
-          streams: _this3.state.streams
-        }) : child;
-      });
-
       return _react2.default.createElement(
         'div',
         null,
-        childrenWithProps
+        this.props.children
       );
@@ -140,2 +136,10 @@ }
   onError: null
+};
+
+OTSession.childContextTypes = {
+  streams: _propTypes2.default.arrayOf(_propTypes2.default.object),
+  session: _propTypes2.default.shape({
+    subscribe: _propTypes2.default.func,
+    unsubscribe: _propTypes2.default.func
+  })
 };

dist/OTStreams.js

@@ -16,6 +16,13 @@ 'use strict';
 
+var _OTSubscriberContext = require('./OTSubscriberContext');
+
+var _OTSubscriberContext2 = _interopRequireDefault(_OTSubscriberContext);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function OTStreams(props) {
-  if (!props.session) {
+function OTStreams(props, context) {
+  var session = props.session || context.session || null;
+  var streams = props.streams || context.streams || null;
+
+  if (!session) {
     return _react2.default.createElement('div', null);
@@ -26,8 +33,8 @@ }
 
-  var childrenWithProps = Array.isArray(props.streams) ? props.streams.map(function (stream) {
-    return child ? (0, _react.cloneElement)(child, {
-      session: props.session,
-      stream: stream,
-      key: stream.id
-    }) : child;
+  var childrenWithContextWrapper = Array.isArray(streams) ? streams.map(function (stream) {
+    return child ? _react2.default.createElement(
+      _OTSubscriberContext2.default,
+      { stream: stream, key: stream.id },
+      (0, _react.cloneElement)(child)
+    ) : child;
   }) : null;
@@ -38,3 +45,3 @@
     null,
-    childrenWithProps
+    childrenWithContextWrapper
   );
@@ -45,6 +52,3 @@ }
   children: _propTypes2.default.element.isRequired,
-  session: _propTypes2.default.shape({
-    publish: _propTypes2.default.func,
-    subscribe: _propTypes2.default.func
-  }),
+  session: _propTypes2.default.shape({ publish: _propTypes2.default.func, subscribe: _propTypes2.default.func }),
   streams: _propTypes2.default.arrayOf(_propTypes2.default.object)
@@ -55,3 +59,8 @@ };
   session: null,
-  streams: []
+  streams: null
+};
+
+OTStreams.contextTypes = {
+  session: _propTypes2.default.shape({ publish: _propTypes2.default.func, subscribe: _propTypes2.default.func }),
+  streams: _propTypes2.default.arrayOf(_propTypes2.default.object)
 };

dist/OTSubscriber.js

@@ -34,3 +34,3 @@ 'use strict';
 
-  function OTSubscriber(props) {
+  function OTSubscriber(props, context) {
     _classCallCheck(this, OTSubscriber);
@@ -41,3 +41,5 @@
     _this.state = {
-      subscriber: null
+      subscriber: null,
+      stream: props.stream || context.stream || null,
+      session: props.session || context.session || null
     };
@@ -54,3 +56,3 @@ return _this;
     key: 'componentDidUpdate',
-    value: function componentDidUpdate(prevProps) {
+    value: function componentDidUpdate(prevProps, prevState) {
       var _this2 = this;
@@ -73,4 +75,4 @@
 
-      if (this.props.session !== prevProps.session || this.props.stream !== prevProps.stream) {
-        this.destroySubscriber(prevProps.session);
+      if (prevState.session !== this.state.session || prevState.stream !== this.state.stream) {
+        this.destroySubscriber(prevState.session);
         this.createSubscriber();
@@ -94,3 +96,3 @@ }
 
-      if (!this.props.session || !this.props.stream) {
+      if (!this.state.session || !this.state.stream) {
         this.setState({ subscriber: null });
@@ -108,3 +110,3 @@ return;
 
-      var subscriber = this.props.session.subscribe(this.props.stream, container, this.props.properties, function (err) {
+      var subscriber = this.state.session.subscribe(this.state.stream, container, this.props.properties, function (err) {
         if (subscriberId !== _this3.subscriberId) {
@@ -155,3 +157,3 @@ // Either this subscriber has been recreated or the
       return _react2.default.createElement('div', { ref: function ref(node) {
-          return _this5.node = node;
+          _this5.node = node;
         } });
@@ -188,2 +190,12 @@ }
   onError: null
+};
+
+OTSubscriber.contextTypes = {
+  stream: _propTypes2.default.shape({
+    streamId: _propTypes2.default.string
+  }),
+  session: _propTypes2.default.shape({
+    subscribe: _propTypes2.default.func,
+    unsubscribe: _propTypes2.default.func
+  })
 };

package.json

 {
   "name": "opentok-react",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "description": "React components for OpenTok.js",
@@ -24,5 +24,10 @@ "main": "dist/index.js",
     "type": "git",
-    "url": "https://github.com/aiham/opentok-react.git"
+    "url": "https://github.com/opentok/opentok-react.git"
   },
-  "author": "Aiham Hammami <[e-mail]>",
+  "contributors": [
+    {
+      "name": "Aiham Hammami",
+      "email": "[e-mail]"
+    }
+  ],
   "license": "MIT",
@@ -29,0 +34,0 @@ "peerDependencies": {

README.md

 # opentok-react
 
-[![npm version](https://badge.fury.io/js/opentok-react.svg)](https://badge.fury.io/js/opentok-react) [![Build Status](https://travis-ci.org/aiham/opentok-react.svg?branch=master)](https://travis-ci.org/aiham/opentok-react)
+[![npm version](https://badge.fury.io/js/opentok-react.svg)](https://badge.fury.io/js/opentok-react) [![Build Status](https://travis-ci.org/opentok/opentok-react.svg?branch=master)](https://travis-ci.org/opentok/opentok-react)
 
@@ -58,3 +58,3 @@ React components for OpenTok.js
 
-1. `git clone https://github.com/aiham/opentok-react.git`
+1. `git clone https://github.com/opentok/opentok-react.git`
 1. `cd opentok-react/example/`
@@ -65,2 +65,3 @@ 1. `cp config.template.js config.js`
   1. Add your Chrome Extension ID (https://tokbox.com/developer/guides/screen-sharing/js/)
+1. `cd ..`
 1. `yarn` (or `npm install`)
@@ -407,3 +408,3 @@ 1. `npm run example`
 
-1. `git clone https://github.com/aiham/opentok-react.git`
+1. `git clone https://github.com/opentok/opentok-react.git`
 1. `cd opentok-react/`
@@ -439,2 +440,7 @@ 1. `yarn` (or `npm install`)
 
-The unit tests are automatically run on [Travis](https://travis-ci.org/aiham/opentok-react) on both Chrome and Firefox and the current build status is shown at the top of this document.
+The unit tests are automatically run on [Travis](https://travis-ci.org/opentok/opentok-react) on both Chrome and Firefox and the current build status is shown at the top of this document.
+
+## About
+
+Originally authored by [Aiham Hammami](https://github.com/aiham).
+Currently maintained by [TokBox Inc.](https://tokbox.com/).

New alerts

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

211973

increased by2.4%

Number of package files

14

increased by7.69%

Lines of code

779

increased by12.9%

Number of lines in readme file

443

increased by1.37%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes