Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

react-jplayer

Package Overview
Dependencies
Maintainers
1
Versions
42
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-jplayer - npm Package Compare versions

Comparing version 3.2.0 to 3.3.0

lib/components/bars/bar.js

2

lib/components/jPlayer/jPlayer.js

@@ -13,3 +13,3 @@ 'use strict';

var _keyControlContainer = require('../../keyControl/keyControlContainer');
var _keyControlContainer = require('../keyControl/keyControlContainer');

@@ -16,0 +16,0 @@ var _keyControlContainer2 = _interopRequireDefault(_keyControlContainer);

@@ -31,45 +31,8 @@ 'use strict';

var mapStateToProps = function mapStateToProps(_ref) {
var jPlayers = _ref.jPlayers;
return _extends({}, jPlayers);
};
var mapStateToProps = function mapStateToProps(_ref2, _ref) {
var jPlayers = _ref2.jPlayers;
var getActions = function getActions(dispatch, id) {
return {
setOption: function setOption(key, value) {
return dispatch((0, _actions.setOption)(id, key, value));
},
setMedia: function setMedia(media) {
return dispatch((0, _actions.setMedia)(id, media));
},
clearMedia: function clearMedia() {
return dispatch((0, _actions.clearMedia)(id));
},
play: function play(time) {
return dispatch((0, _actions.play)(id, time));
},
pause: function pause(time) {
return dispatch((0, _actions.pause)(id, time));
},
setPlayHead: function setPlayHead(percent) {
return dispatch((0, _actions.setPlayHead)(id, percent));
},
setVolume: function setVolume(volume) {
return dispatch((0, _actions.setVolume)(id, volume));
},
setMute: function setMute(mute) {
return dispatch((0, _actions.setMute)(id, mute));
},
focus: function focus() {
return dispatch((0, _actions.focus)(id));
}
};
};
var id = _ref.id,
props = _objectWithoutProperties(_ref, ['id']);
var mergeProps = function mergeProps(jPlayers, _ref3, _ref2) {
var dispatch = _ref3.dispatch;
var id = _ref2.id,
props = _objectWithoutProperties(_ref2, ['id']);
var newJPlayers = {};

@@ -94,15 +57,19 @@

newJPlayers[jPlayerKey] = _extends({}, getActions(dispatch, jPlayerKey), {
newJPlayers[jPlayerKey] = {
options: options,
status: status
});
};
});
var jPlayer = newJPlayers[id],
otherPlayers = _objectWithoutProperties(newJPlayers, [id]);
otherJPlayers = _objectWithoutProperties(newJPlayers, [id]);
var returnedJPlayers = _extends({}, props, jPlayer);
var returnedJPlayers = _extends({}, props, jPlayer, {
id: id
});
if (Object.keys(otherPlayers).length) {
returnedJPlayers.jPlayers = otherPlayers;
if (Object.keys(otherJPlayers).some(function (otherJPlayer) {
return otherJPlayer;
})) {
returnedJPlayers.jPlayers = otherJPlayers;
}

@@ -113,4 +80,16 @@

var mapDispatchToProps = {
setOption: _actions.setOption,
setMedia: _actions.setMedia,
clearMedia: _actions.clearMedia,
play: _actions.play,
pause: _actions.pause,
setPlayHead: _actions.setPlayHead,
setVolume: _actions.setVolume,
setMute: _actions.setMute,
focus: _actions.focus
};
var Connect = function Connect(jPlayer) {
var ConnectedPlayer = (0, _reactRedux.connect)(mapStateToProps, null, mergeProps)(jPlayer);
var ConnectedPlayer = (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps)(jPlayer);

@@ -124,3 +103,3 @@ // IE9 doesn't support fn.name

function ConnectedJPlayer() {
var _ref4;
var _ref3;

@@ -135,3 +114,3 @@ var _temp, _this, _ret;

return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref4 = ConnectedJPlayer.__proto__ || Object.getPrototypeOf(ConnectedJPlayer)).call.apply(_ref4, [this].concat(args))), _this), _this.getChildContext = function () {
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref3 = ConnectedJPlayer.__proto__ || Object.getPrototypeOf(ConnectedJPlayer)).call.apply(_ref3, [this].concat(args))), _this), _this.getChildContext = function () {
return {

@@ -138,0 +117,0 @@ id: playerName

@@ -40,6 +40,2 @@ 'use strict';

var _seekBarContainer = require('./components/seekBar/seekBarContainer');
var _seekBarContainer2 = _interopRequireDefault(_seekBarContainer);
var _playBarContainer = require('./components/playBar/playBarContainer');

@@ -77,15 +73,19 @@

var _playbackRateBarContainer = require('./components/playbackRateBar/playbackRateBarContainer');
var _seekBarContainer = require('./components/bars/seekBar/seekBarContainer');
var _seekBarContainer2 = _interopRequireDefault(_seekBarContainer);
var _playbackRateBarContainer = require('./components/bars/playbackRateBar/playbackRateBarContainer');
var _playbackRateBarContainer2 = _interopRequireDefault(_playbackRateBarContainer);
var _playbackRateBarValueContainer = require('./components/playbackRateBarValue/playbackRateBarValueContainer');
var _playbackRateBarValueContainer = require('./components/bars/playbackRateBarValue/playbackRateBarValueContainer');
var _playbackRateBarValueContainer2 = _interopRequireDefault(_playbackRateBarValueContainer);
var _volumeBarContainer = require('./components/volumeBar/volumeBarContainer');
var _volumeBarContainer = require('./components/bars/volumeBar/volumeBarContainer');
var _volumeBarContainer2 = _interopRequireDefault(_volumeBarContainer);
var _volumeBarValueContainer = require('./components/volumeBarValue/volumeBarValueContainer');
var _volumeBarValueContainer = require('./components/bars/volumeBarValue/volumeBarValueContainer');

@@ -92,0 +92,0 @@ var _volumeBarValueContainer2 = _interopRequireDefault(_volumeBarValueContainer);

{
"name": "react-jplayer",
"version": "3.2.0",
"version": "3.3.0",
"description": "Html5 audio and video player library for React",

@@ -5,0 +5,0 @@ "author": "Martin Dawson <u1356770@unimail.hud.ac.uk>",

@@ -95,3 +95,3 @@ [![Build Status](https://travis-ci.org/MartinDawson/react-jPlayer.svg?branch=master)](https://travis-ci.org/MartinDawson/react-jPlayer)

/* All jPlayer options must be defined statically on the jPlayer component.
/* All jPlayer options must be defined statically on the jPlayer component on an object called 'options'.
These options will be deep merged with the default jPlayer options so you actually don't

@@ -98,0 +98,0 @@ even need to specify any apart from the media.sources if you just want the default options. */

import React from 'react';
import KeyControl from '../../keyControl/keyControlContainer';
import KeyControl from '../keyControl/keyControlContainer';

@@ -5,0 +5,0 @@ const JPlayer = ({ keyEnabled, setJPlayer, children, ...attributes }) => (

@@ -6,3 +6,3 @@ import React from 'react';

import JPlayer from './jPlayer';
import KeyControl from '../../keyControl/keyControlContainer';
import KeyControl from '../keyControl/keyControlContainer';

@@ -9,0 +9,0 @@ const setup = () => {

@@ -8,19 +8,3 @@ import React from 'react';

const mapStateToProps = ({ jPlayers }) => ({
...jPlayers,
});
const getActions = (dispatch, id) => ({
setOption: (key, value) => dispatch(setOption(id, key, value)),
setMedia: media => dispatch(setMedia(id, media)),
clearMedia: () => dispatch(clearMedia(id)),
play: time => dispatch(play(id, time)),
pause: time => dispatch(pause(id, time)),
setPlayHead: percent => dispatch(setPlayHead(id, percent)),
setVolume: volume => dispatch(setVolume(id, volume)),
setMute: mute => dispatch(setMute(id, mute)),
focus: () => dispatch(focus(id)),
});
const mergeProps = (jPlayers, { dispatch }, { id, ...props }) => {
const mapStateToProps = ({ jPlayers }, { id, ...props }) => {
const newJPlayers = {};

@@ -46,3 +30,2 @@

newJPlayers[jPlayerKey] = {
...getActions(dispatch, jPlayerKey),
options,

@@ -53,3 +36,3 @@ status,

const { [id]: jPlayer, ...otherPlayers } = newJPlayers;
const { [id]: jPlayer, ...otherJPlayers } = newJPlayers;

@@ -59,6 +42,7 @@ const returnedJPlayers = {

...jPlayer,
id,
};
if (Object.keys(otherPlayers).length) {
returnedJPlayers.jPlayers = otherPlayers;
if (Object.keys(otherJPlayers).some(otherJPlayer => otherJPlayer)) {
returnedJPlayers.jPlayers = otherJPlayers;
}

@@ -69,4 +53,16 @@

const mapDispatchToProps = {
setOption,
setMedia,
clearMedia,
play,
pause,
setPlayHead,
setVolume,
setMute,
focus,
};
const Connect = (jPlayer) => {
const ConnectedPlayer = connect(mapStateToProps, null, mergeProps)(jPlayer);
const ConnectedPlayer = connect(mapStateToProps, mapDispatchToProps)(jPlayer);

@@ -73,0 +69,0 @@ // IE9 doesn't support fn.name

@@ -11,4 +11,3 @@ import React from 'react';

const mapStateToProps = __get__('mapStateToProps');
const mergeProps = __get__('mergeProps');
const getActions = __get__('getActions');
const mapDispatchToProps = __get__('mapDispatchToProps');
const id = 'jPlayer-1';

@@ -23,13 +22,2 @@ const jPlayerTwoId = 'jPlayer-2';

delete jPlayerActions.default;
const getMappedActionsData = (jPlayer = getDefaultJPlayers(1, true).jPlayers[id]) => [
{ action: 'setOption', args: ['muted', jPlayer.muted] },
{ action: 'setMedia', args: [jPlayer.media] },
{ action: 'clearMedia', args: [] },
{ action: 'play', args: [33] },
{ action: 'pause', args: [77] },
{ action: 'setPlayHead', args: [jPlayer.playHeadPercent] },
{ action: 'setVolume', args: [jPlayer.volume] },
{ action: 'setMute', args: [jPlayer.muted] },
{ action: 'focus', args: [] },
];

@@ -44,13 +32,6 @@ describe('JPlayerConnect', () => {

it('maps state', () => {
const state = getDefaultJPlayers(2, true);
const expected = mapStateToProps(state);
expect(expected).toEqual(state.jPlayers);
});
it('merges props with custom props', () => {
it('maps props with custom props', () => {
const customProp = 'test';
const jPlayers = getDefaultJPlayers().jPlayers;
const expected = mergeProps(jPlayers, { dispatch }, { id, customProp });
const expected = mapStateToProps({ jPlayers }, { id, customProp });

@@ -65,3 +46,3 @@ expect(expected).toContain({

const jPlayers = getDefaultJPlayers().jPlayers;
const expected = mergeProps(jPlayers, { dispatch }, { id, options });
const expected = mapStateToProps({ jPlayers }, { id, options });

@@ -73,6 +54,5 @@ expect(expected).toNotContain({

it('merges current player', () => {
it('maps current player', () => {
const jPlayers = getDefaultJPlayers(1, true).jPlayers;
const expected = mergeProps(jPlayers, { dispatch }, { id });
const mergedActions = getActions();
const expected = mapStateToProps({ jPlayers }, { id });
const status = {};

@@ -98,12 +78,11 @@ const options = {};

expect(expected).toEqual({
...mergedActions,
options,
status,
id,
});
});
it('merges other players', () => {
it('maps other players', () => {
const jPlayers = getDefaultJPlayers(3, true).jPlayers;
const expected = mergeProps(jPlayers, { dispatch }, { id: jPlayerTwoId });
const mergedActions = getActions();
const expected = mapStateToProps({ jPlayers }, { id: jPlayerTwoId });
const otherJPlayers = {};

@@ -131,3 +110,2 @@

otherJPlayers[jPlayerKey] = {
...mergedActions,
options,

@@ -141,34 +119,6 @@ status,

it('all actions are mapped', () => {
const jPlayers = getDefaultJPlayers().jPlayers;
const mergedProps = mergeProps(jPlayers, { dispatch }, { id });
expect(mergedProps).toIncludeKeys(Object.keys(jPlayerActions));
});
getMappedActionsData().forEach(({ action, args }) => {
const mergedProps = mergeProps(getDefaultJPlayers(3, true).jPlayers, { dispatch }, { id });
let expectedArgs;
it(`dispatches current jPlayer mapped ${action} action when called`, () => {
expectedArgs = [...args];
mergedProps[action](...args);
expectedArgs.unshift(id);
expect(dispatch).toHaveBeenCalledWith(actions[action](...expectedArgs));
it('mapDispatchToProps handles all actions', () => {
expect(mapDispatchToProps).toEqual({
...jPlayerActions,
});
it(`dispatches other jPlayers mapped ${action} action when called`, () => {
Object.keys(mergedProps.jPlayers).forEach((key) => {
const jPlayer = mergedProps.jPlayers[key];
expectedArgs = [...args];
jPlayer[action](...args);
expectedArgs.unshift(key);
expect(dispatch).toHaveBeenCalledWith(actions[action](...expectedArgs));
});
});
});

@@ -175,0 +125,0 @@

@@ -11,3 +11,2 @@ /* eslint-disable max-len */

import JPlayer from './components/jPlayer/jPlayerContainer';
import SeekBar from './components/seekBar/seekBarContainer';
import PlayBar from './components/playBar/playBarContainer';

@@ -21,6 +20,7 @@ import BufferBar from './components/bufferBar/bufferBarContainer';

import Repeat from './components/repeat/repeatContainer';
import PlaybackRateBar from './components/playbackRateBar/playbackRateBarContainer';
import PlaybackRateBarValue from './components/playbackRateBarValue/playbackRateBarValueContainer';
import VolumeBar from './components/volumeBar/volumeBarContainer';
import VolumeBarValue from './components/volumeBarValue/volumeBarValueContainer';
import SeekBar from './components/bars/seekBar/seekBarContainer';
import PlaybackRateBar from './components/bars/playbackRateBar/playbackRateBarContainer';
import PlaybackRateBarValue from './components/bars/playbackRateBarValue/playbackRateBarValueContainer';
import VolumeBar from './components/bars/volumeBar/volumeBarContainer';
import VolumeBarValue from './components/bars/volumeBarValue/volumeBarValueContainer';
import Download from './components/download/downloadContainer';

@@ -27,0 +27,0 @@ import Duration from './components/duration/durationContainer';

Sorry, the diff of this file is too big to display

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc