@desynova-digital/player 4.0.21 → 4.0.23

package/components/BigPlayButton.js

@@ -36,7 +36,7 @@ var defaultProps = {
   actions: {},
   player: {}
 };
-var PlayButton = (0, _styledComponents["default"])(_components.Button)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  background: ", ";\n  width: 100px;\n  height: 100px;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  border: none;\n  z-index:1;\n  &:hover,\n  &:focus {\n    background: ", ";\n  }\n"])), function (props) {
+var PlayButton = (0, _styledComponents["default"])(_components.Button)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  background: ", ";\n  width: 100px;\n  height: 100px;\n  position: absolute;\n  opacity: 0.5;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  border: none;\n  z-index:1;\n  &:hover,\n  &:focus {\n    background: ", ";\n  }\n"])), function (props) {
   return _colors["default"].common.video[props.assetType].buttonGradient;
 }, function (props) {
   return _colors["default"].common.video[props.assetType].buttonGradient;

package/components/Player.js

@@ -106,7 +106,8 @@ var propTypes = {
   playlistClick: _propTypes.PropTypes.func,
   transcriptArr: _propTypes.PropTypes.instanceOf(Array),
   tagsMarker: _propTypes.PropTypes.instanceOf(Array),
-  theme: _propTypes.PropTypes.string
+  theme: _propTypes.PropTypes.string,
+  activeSDBorder: _propTypes.PropTypes.bool
 };
 var defaultProps = {
   fluid: true,
@@ -224,8 +225,13 @@ var Player = exports["default"] = /*#__PURE__*/function (_Component) {
   }, {
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps, prevState) {
-      var playerType = this.props.playerType;
+      var _this$props = this.props,
+        playerType = _this$props.playerType,
+        activeSDBorder = _this$props.activeSDBorder;
       this.handleResize();
+      if (activeSDBorder !== prevProps.activeSDBorder) {
+        this.actions.handleSDBorderChange(activeSDBorder || false);
+      }
       if (playerType !== prevProps.playerType) {
         this.actions.handleZoomChange(0);
       }
@@ -284,11 +290,13 @@ var Player = exports["default"] = /*#__PURE__*/function (_Component) {
           _this2._controlBar = c;
         },
         key: "control-bar",
+        pauseOnOutMarkerSelect: fullProps.pauseOnOutMarkerSelect,
         order: 4
       }, this.props)), /*#__PURE__*/_react["default"].createElement(_Shortcut["default"], _extends({
         key: "shortcut",
         order: 99.0
       }, props, {
+        pauseOnOutMarkerSelect: fullProps.pauseOnOutMarkerSelect,
         frameRate: fullProps.frameRate
       }))];
     }
@@ -348,12 +356,14 @@ var Player = exports["default"] = /*#__PURE__*/function (_Component) {
           _this4._controlBar = c;
         },
         key: "control-bar",
+        pauseOnOutMarkerSelect: fullProps.pauseOnOutMarkerSelect,
         order: 2
       }, this.props)), /*#__PURE__*/_react["default"].createElement(_Shortcut["default"], _extends({
         key: "shortcut",
         order: 99.0
       }, props, {
-        frameRate: fullProps.frameRate
+        frameRate: fullProps.frameRate,
+        pauseOnOutMarkerSelect: fullProps.pauseOnOutMarkerSelect
       }))];
     }
   }, {
@@ -523,10 +533,10 @@ var Player = exports["default"] = /*#__PURE__*/function (_Component) {
       var controlBar = (0, _reactDom.findDOMNode)(this._controlBar);
       var playlist = (0, _reactDom.findDOMNode)(this._playlist);
       var playerContainer = (0, _reactDom.findDOMNode)(this._playerContainer);
-      var _this$props = this.props,
-        controlType = _this$props.controlType,
-        playerType = _this$props.playerType,
-        fileType = _this$props.fileType;
+      var _this$props2 = this.props,
+        controlType = _this$props2.controlType,
+        playerType = _this$props2.playerType,
+        fileType = _this$props2.fileType;
       var height = 0;
       _toConsumableArray(leftSectionRef.children).forEach(function (child) {
         return height += child.offsetHeight;
@@ -639,9 +649,9 @@ var Player = exports["default"] = /*#__PURE__*/function (_Component) {
         video: this.video ? this.video.video : null
       });
       var childrensLeft = this.getChildren(props, 'left');
-      var _this$props2 = this.props,
-        rightSection = _this$props2.rightSection,
-        playerType = _this$props2.playerType;
+      var _this$props3 = this.props,
+        rightSection = _this$props3.rightSection,
+        playerType = _this$props3.playerType;
       return /*#__PURE__*/_react["default"].createElement(PlayerBlock, {
         ref: function ref(c) {
           _this5.manager.rootElement = c;

package/components/Shortcut.js

@@ -359,10 +359,18 @@ var Shortcut = exports["default"] = /*#__PURE__*/function (_Component) {
           playerReadOnlyMode = _this$props5.playerReadOnlyMode,
           disablePlayerActions = _this$props5.disablePlayerActions,
           playerSelectedMarker = _this$props5.playerSelectedMarker,
-          frameRate = _this$props5.frameRate;
+          frameRate = _this$props5.frameRate,
+          pauseOnOutMarkerSelect = _this$props5.pauseOnOutMarkerSelect;
         if (playerReadOnlyMode || disablePlayerActions.includes('marking_controls')) {
           return;
         }
+        if (pauseOnOutMarkerSelect && !player.paused) {
+          actions.pause({
+            action: 'pause',
+            source: 'shortcut'
+          });
+          actions.seek(player.currentTime);
+        }
         var currentAdjustedTime = (0, _utils.handleAdjustingVideoAsPerFrame)(player.currentTime, frameRate);
         for (var _len2 = arguments.length, args = new Array(_len2 > 2 ? _len2 - 2 : 0), _key2 = 2; _key2 < _len2; _key2++) {
           args[_key2 - 2] = arguments[_key2];

package/components/Video.js

@@ -115,7 +115,7 @@ var Video = exports["default"] = /*#__PURE__*/function (_Component) {
         'font-family': 'SFUIText-Regular',
         'text-shadow': '0 0 4px rgb(0 0 0 / 50%)',
         'font-size': '12px',
-        opacity: '0.6',
+        opacity: '0.4',
         display: 'block',
         top: '0px',
         left: '0px'
@@ -182,7 +182,7 @@ var Video = exports["default"] = /*#__PURE__*/function (_Component) {
         this.video.src = src;
       }
       this.forceUpdate(); // make sure the children can get the video property
-      var watermarkInterval = setInterval(this.checkWatermark, 20000);
+      var watermarkInterval = setInterval(this.checkWatermark, 40000);
       this.setState({
         watermarkInterval: watermarkInterval
       });
@@ -222,7 +222,7 @@ var Video = exports["default"] = /*#__PURE__*/function (_Component) {
         video_player = document.querySelector('.video-react-player-block').getBoundingClientRect();
         watermark_dimension = watermark_text.getBoundingClientRect();
         text_css = watermark_text.style;
-        bool_text = text_css.position !== 'absolute' || text_css.opacity !== '0.6' || text_css['font-family'] !== 'SFUIText-Regular' && text_css['font-family'] !== '"SFUIText-Regular"';
+        bool_text = text_css.position !== 'absolute' || text_css.opacity !== '0.4' || text_css['font-family'] !== 'SFUIText-Regular' && text_css['font-family'] !== '"SFUIText-Regular"';
         bool_text = bool_text || text_css.display !== 'block';
         bool_text = bool_text || text_css.top !== watermark.top;
         bool_text = bool_text || text_css.left !== watermark.left;

package/components/marking-controls/MarkOutControl.js

@@ -37,7 +37,8 @@ var propTypes = {
   controlType: _propTypes.PropTypes.string,
   onMarkerSelect: _propTypes.PropTypes.func,
   allowMarkerOverlap: _propTypes.PropTypes.bool,
-  theme: _propTypes.PropTypes.string
+  theme: _propTypes.PropTypes.string,
+  pauseOnOutMarkerSelect: _propTypes.PropTypes.bool
 };
 var defaultProps = {
   player: {},
@@ -96,7 +97,8 @@ var MarkOutControl = exports["default"] = /*#__PURE__*/function (_Component) {
         controlType = _this$props2.controlType,
         onMarkerSelect = _this$props2.onMarkerSelect,
         onAddMarker = _this$props2.onAddMarker,
-        frameRate = _this$props2.frameRate;
+        frameRate = _this$props2.frameRate,
+        pauseOnOutMarkerSelect = _this$props2.pauseOnOutMarkerSelect;
       if (leftMarker > -1 && player.currentTime > leftMarker) {
         // actions.handleMarkerPointChange('add', 'right', player.currentTime);
         //Commented for CN-632.
@@ -104,6 +106,13 @@ var MarkOutControl = exports["default"] = /*#__PURE__*/function (_Component) {
         //   onMarkerSelect(leftMarker, player.currentTime);
         // }
         // actions.handleMarkerPointChange('create');
+        if (pauseOnOutMarkerSelect && !player.paused) {
+          actions.pause({
+            action: 'pause',
+            source: 'shortcut'
+          });
+          actions.seek(player.currentTime);
+        }
         var currentAdjustedTime = (0, _utils.handleAdjustingVideoAsPerFrame)(player.currentTime, frameRate);
         var data = {
           markerType: player.markerType !== 'update' ? 'add' : 'update',

package/components/marking-controls/MarkingControl.js

@@ -28,7 +28,8 @@ var propTypes = {
   onDeleteMarker: _propTypes.PropTypes.func,
   initialTime: _propTypes.PropTypes.number,
   allowMarkerOverlap: _propTypes.PropTypes.bool,
-  theme: _propTypes.PropTypes.string
+  theme: _propTypes.PropTypes.string,
+  pauseOnOutMarkerSelect: _propTypes.PropTypes.bool
 };
 var defaultProps = {
   frameRate: 0,
@@ -52,7 +53,8 @@ function MarkingControl(_ref) {
     _ref$disablePlayerAct = _ref.disablePlayerActions,
     disablePlayerActions = _ref$disablePlayerAct === void 0 ? [] : _ref$disablePlayerAct,
     playerSelectedMarker = _ref.playerSelectedMarker,
-    theme = _ref.theme;
+    theme = _ref.theme,
+    pauseOnOutMarkerSelect = _ref.pauseOnOutMarkerSelect;
   return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, playerType !== 'panel' && playerType !== 'default' && playerType !== 'clipping_default' ? /*#__PURE__*/_react["default"].createElement(MarkingBlock, {
     theme: theme
   }, (!((playerSelectedMarker === null || playerSelectedMarker === void 0 ? void 0 : playerSelectedMarker.leftMarker) > -1) || !((playerSelectedMarker === null || playerSelectedMarker === void 0 ? void 0 : playerSelectedMarker.rightMarker) > -1)) && playerType !== 'panel' && playerType !== 'default' && playerType !== 'clipping_default' && !playerReadOnlyMode && !disablePlayerActions.includes("marking_controls") ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_MarkInControl["default"], {
@@ -73,7 +75,8 @@ function MarkingControl(_ref) {
     controlType: controlType,
     onMarkerSelect: onMarkerSelect,
     allowMarkerOverlap: allowMarkerOverlap,
-    onAddMarker: onAddMarker
+    onAddMarker: onAddMarker,
+    pauseOnOutMarkerSelect: pauseOnOutMarkerSelect
   })) : null, (playerSelectedMarker === null || playerSelectedMarker === void 0 ? void 0 : playerSelectedMarker.leftMarker) > -1 || (playerSelectedMarker === null || playerSelectedMarker === void 0 ? void 0 : playerSelectedMarker.rightMarker) > -1 ? /*#__PURE__*/_react["default"].createElement(_MarkingDuration["default"], {
     theme: theme,
     leftMarker: playerSelectedMarker === null || playerSelectedMarker === void 0 ? void 0 : playerSelectedMarker.leftMarker,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@desynova-digital/player",
-  "version": "4.0.21",
+  "version": "4.0.23",
   "description": "Video Player Package for Contido Application",
   "main": "index.js",
   "scripts": {

package/reducers/player.js

@@ -22,7 +22,7 @@ var initialState = {
   rightMarker: -1,
   selectedMarker: {},
   markerType: 'create',
-  SDBorderActive: true,
+  SDBorderActive: false,
   buffered: null,
   waiting: false,
   seeking: false,