@desynova-digital/player 4.0.8 → 4.0.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/components/PointersBar.js +14 -2
  2. package/components/Video.js +16 -7
  3. package/package.json +1 -1
package/components/PointersBar.js CHANGED
@@ -53,7 +53,7 @@ var PointersContainer = _styledComponents["default"].div(_templateObject || (_te
53
53
  });
54
54
  var PointerBlock = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n width: 100%;\n height: 20px;\n position: relative;\n border-top: 1px solid #333333;\n border-bottom: 1px solid #333333;\n .empty-pointers-msg {\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n p {\n font-family: SFUIText-Medium;\n font-size: 11px;\n color: #aaaaaa;\n }\n ", " {\n margin: 0 5px;\n }\n }\n"])), _components.Icon.Element);
55
55
  var MarkerTagsBlock = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n min-width: 100px;\n max-width: 100px;\n position: relative;\n height: 100%;\n .tags-block {\n height: 20px;\n font-family: SFUIText-Medium;\n font-size: 10px;\n color: #ffffff;\n text-transform: uppercase;\n border-top: 1px solid #333333;\n border-bottom: 1px solid #333333;\n p {\n line-height: 18px;\n padding: 0 10px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n"])));
56
- var ToolTipStyles = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n position: absolute;\n z-index: 2;\n height: 18px;\n transition: left 0.1s ease-in-out;\n\n .tooltip-container {\n border-radius: 0.25rem;\n padding: 5px;\n width: fit-content;\n background: #ffffff;\n color: #666666;\n\n h4 {\n white-space: nowrap;\n font-size: 12px;\n }\n\n &:after {\n content: '';\n position: absolute;\n border-left: 5px solid transparent;\n border-right: 5px solid transparent;\n border-top: 5px solid white;\n ", "\n left: ", ";\n transform: translateX(-50%);\n }\n }\n"])), function (props) {
56
+ var ToolTipStyles = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n position: absolute;\n z-index: 2;\n height: 18px;\n transition: left 0.1s ease-in-out;\n\n .tooltip-container {\n border-radius: 0.25rem;\n padding: 5px;\n width: fit-content;\n background: #ffffff;\n color: #666666;\n\n i,em{\n font-style: italic; \n }\n\n strong{\n font-weight: bold; \n }\n\n h4 {\n white-space: nowrap;\n font-size: 12px;\n }\n\n &:after {\n content: '';\n position: absolute;\n border-left: 5px solid transparent;\n border-right: 5px solid transparent;\n border-top: 5px solid white;\n ", "\n left: ", ";\n transform: translateX(-50%);\n }\n }\n"])), function (props) {
57
57
  return props.multiline ? 'bottom: -21px;' : 'bottom: -9px;';
58
58
  }, function (props) {
59
59
  return props.tooltipPointer ? props.tooltipPointer + 'px' : '50%';
@@ -270,7 +270,19 @@ var PointersBar = exports["default"] = /*#__PURE__*/function (_Component) {
270
270
  }
271
271
  }, /*#__PURE__*/_react["default"].createElement("div", {
272
272
  className: "tooltip-container"
273
- }, text.line1 && /*#__PURE__*/_react["default"].createElement("h4", null, text.line1), text.line2 && /*#__PURE__*/_react["default"].createElement("h4", null, text.line2), !text.line1 && /*#__PURE__*/_react["default"].createElement("h4", null, text))));
273
+ }, text.line1 && /*#__PURE__*/_react["default"].createElement("h4", {
274
+ dangerouslySetInnerHTML: {
275
+ __html: text.line1
276
+ }
277
+ }), text.line2 && /*#__PURE__*/_react["default"].createElement("h4", {
278
+ dangerouslySetInnerHTML: {
279
+ __html: text.line2
280
+ }
281
+ }), !text.line1 && /*#__PURE__*/_react["default"].createElement("h4", {
282
+ dangerouslySetInnerHTML: {
283
+ __html: text
284
+ }
285
+ }))));
274
286
  }
275
287
  }]);
276
288
  return PointersBar;
package/components/Video.js CHANGED
@@ -97,7 +97,7 @@ var defaultProps = {
97
97
  crossOrigin: 'anonymous',
98
98
  theme: 'dark'
99
99
  };
100
- var SubTitleSection = _styledComponents["default"].div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n position: absolute;\n font-family: SFUIText-Regular;\n font-size: 16px;\n bottom: 20px;\n width: 100%;\n display: flex;\n justify-content: center;\n text-align: center;\n color: #ffffff;\n height: 90%;\n align-items: center;\n\n .subtitleContainer {\n border-radius: 4px;\n width: fit-content;\n background: #000000;\n opacity: 0.9;\n padding: ", ";\n line-height: 20px;\n position: absolute;\n \n }\n .longSubtitleStyles {\n overflow-y: auto;\n height: fit-content;\n max-height: 70px;\n max-width: 75%;\n width: fit-content;\n }\n"])), function (props) {
100
+ var SubTitleSection = _styledComponents["default"].div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n position: absolute;\n font-family: SFUIText-Regular;\n font-size: 16px;\n bottom: 20px;\n width: 100%;\n display: flex;\n justify-content: center;\n text-align: center;\n color: #ffffff;\n height: 90%;\n align-items: center;\n\n .subtitleContainer {\n border-radius: 4px;\n width: fit-content;\n background: #000000;\n opacity: 0.9;\n padding: ", ";\n line-height: 20px;\n position: absolute;\n\n i,em {\n font-style: italic; /* Override the font style for <em> tags inside elements with the class .someClass */\n }\n\n strong{\n font-weight: bold; \n }\n \n }\n .longSubtitleStyles {\n overflow-y: auto;\n height: fit-content;\n max-height: 70px;\n max-width: 75%;\n width: fit-content;\n }\n"])), function (props) {
101
101
  return props.currentSubtitleObj && props.currentSubtitleObj.line1 ? '8px 10px' : '0px';
102
102
  });
103
103
  var VideoBlock = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n position: relative;\n &.video-react-player-block {\n position: relative;\n transition: all 0.1s ease-in-out;\n -moz-transition: all 0.1s ease-in-out;\n -webkit-transition: all 0.1s ease-in-out;\n -ms-transition: all 0.1s ease-in-out;\n -o-transition: all 0.1s ease-in-out;\n video {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n right: 0;\n bottom: 0;\n }\n .audio-tracks {\n position: relative;\n display: flex;\n background: rgba(0, 0, 0, 0.5);\n color: #fff;\n z-index: 10;\n position: absolute;\n width: 100%;\n bottom: 0;\n p {\n cursor: pointer;\n padding: 10px;\n }\n }\n .loader-container {\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n position: absolute;\n z-index: 10;\n background: rgba(0, 0, 0, 0.5);\n }\n }\n &.ratio-border {\n border: 1px solid rgba(255, 255, 255, 0.5);\n &:after {\n content: '16:9 Safe Area';\n position: absolute;\n color: #fff;\n font-family: SFUIText-Regular;\n font-size: 12px;\n transform: rotate(-90deg);\n top: 20%;\n left: -50px;\n }\n }\n"])));
@@ -1256,12 +1256,21 @@ var Video = exports["default"] = /*#__PURE__*/function (_Component) {
1256
1256
  className: "subtitleContainer longSubtitleStyles",
1257
1257
  style: _objectSpread({}, currentSubtitleObj.style)
1258
1258
  }, currentSubtitleObj.charactername && /*#__PURE__*/_react["default"].createElement("p", {
1259
- id: "charactername"
1260
- }, " ", currentSubtitleObj.charactername, " ") || null, currentSubtitleObj.line1 && /*#__PURE__*/_react["default"].createElement("p", {
1261
- id: "subtitleLineOne"
1262
- }, " ", currentSubtitleObj.line1, " ") || null, currentSubtitleObj.line2 && /*#__PURE__*/_react["default"].createElement("p", {
1263
- id: "subtitleLineTwo"
1264
- }, " ", currentSubtitleObj.line2, " ") || null)));
1259
+ id: "charactername",
1260
+ dangerouslySetInnerHTML: {
1261
+ __html: currentSubtitleObj.charactername
1262
+ }
1263
+ }) || null, currentSubtitleObj.line1 && /*#__PURE__*/_react["default"].createElement("p", {
1264
+ id: "subtitleLineOne",
1265
+ dangerouslySetInnerHTML: {
1266
+ __html: currentSubtitleObj.line1
1267
+ }
1268
+ }) || null, currentSubtitleObj.line2 && /*#__PURE__*/_react["default"].createElement("p", {
1269
+ id: "subtitleLineTwo",
1270
+ dangerouslySetInnerHTML: {
1271
+ __html: currentSubtitleObj.line2
1272
+ }
1273
+ }) || null)));
1265
1274
  }
1266
1275
  }]);
1267
1276
  return Video;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@desynova-digital/player",
3
- "version": "4.0.8",
3
+ "version": "4.0.9",
4
4
  "description": "Video Player Package for Contido Application",
5
5
  "main": "index.js",
6
6
  "scripts": {