@micromag/screen-urbania-trivia 0.3.81 → 0.3.84
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.
- package/assets/css/styles.css +1 -1
- package/es/index.js +18 -19
- package/lib/index.js +18 -19
- package/package.json +2 -2
package/assets/css/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-content,.micromag-screen-urbania-trivia-container
|
|
1
|
+
.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-content,.micromag-screen-urbania-trivia-container.micromag-screen-urbania-trivia-fullscreen .micromag-screen-urbania-trivia-image,.micromag-screen-urbania-trivia-container.micromag-screen-urbania-trivia-fullscreen .micromag-screen-urbania-trivia-placeholder{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-urbania-trivia-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-urbania-trivia-disabled.micromag-screen-urbania-trivia-container{overflow:hidden;pointer-events:none}.micromag-screen-urbania-trivia-hidden.micromag-screen-urbania-trivia-container{display:none;visibility:hidden}.micromag-screen-urbania-trivia-placeholder.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-content{position:relative;padding:6px}.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-empty{margin:5px auto;border:2px dashed #343434;color:#343434;width:100%;height:50px;margin:10px auto}.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-itemsContainer{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;min-width:80%}.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-content{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;overflow:hidden}.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-videoContainer{position:relative;overflow:hidden}.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-video{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-isCustomBackground{-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center}.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-isAnimated{-webkit-transform:scale(3);-ms-transform:scale(3);transform:scale(3);-webkit-animation:micromag-screen-urbania-trivia-spin 9s linear 0ms infinite;animation:micromag-screen-urbania-trivia-spin 9s linear 0ms infinite}@-webkit-keyframes micromag-screen-urbania-trivia-spin{0%{-webkit-transform:scale(3) rotate(0deg);transform:scale(3) rotate(0deg)}to{-webkit-transform:scale(3) rotate(1turn);transform:scale(3) rotate(1turn)}}@keyframes micromag-screen-urbania-trivia-spin{0%{-webkit-transform:scale(3) rotate(0deg);transform:scale(3) rotate(0deg)}to{-webkit-transform:scale(3) rotate(1turn);transform:scale(3) rotate(1turn)}}.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-heading{width:320px;padding:16px 5px 10px;border-top:1px solid #000;border-bottom:1px solid #000;background-color:#fff800;color:#000;font-family:Agrandir Wide,sans-serif;font-size:26px;font-weight:800;text-align:center;text-shadow:-2px -2px 0 #fff;text-transform:uppercase}.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-heading.micromag-screen-urbania-trivia-hideHeading{display:none}.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-callToAction{padding-bottom:5px}.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-bottom{-webkit-transition:opacity .15s linear;-o-transition:opacity .15s linear;transition:opacity .15s linear;opacity:0}.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-bottom.micromag-screen-urbania-trivia-visible{opacity:1}.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-bottom.micromag-screen-urbania-trivia-withGradient{background:-webkit-gradient(linear,left top, left bottom,from(rgba(0,0,0,0)),to(rgba(0,0,0,.4)));background:-o-linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.4));background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.4))}.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-mediaControls{padding:10px 20px 20px}.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-placeholder{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;mix-blend-mode:normal}.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-videoPlaceholder{mix-blend-mode:normal;background-color:#adadad}.micromag-screen-urbania-trivia-container .micromag-screen-urbania-trivia-bottomContent{position:absolute;bottom:0;width:100%}.micromag-screen-urbania-trivia-container.micromag-screen-urbania-trivia-fullscreen .micromag-screen-urbania-trivia-emptyContainer{top:0;height:100%;padding-bottom:0;-webkit-transform:none;-ms-transform:none;transform:none}
|
package/es/index.js
CHANGED
|
@@ -11,6 +11,7 @@ import { PropTypes as PropTypes$1 } from '@micromag/core';
|
|
|
11
11
|
import { ScreenElement, PlaceholderTitle, Empty, PlaceholderVideo, Transitions } from '@micromag/core/components';
|
|
12
12
|
import { useScreenSize, useScreenRenderContext, useViewerNavigation } from '@micromag/core/contexts';
|
|
13
13
|
import { useTrackScreenMedia, useLongPress, useResizeObserver } from '@micromag/core/hooks';
|
|
14
|
+
import { isTextFilled } from '@micromag/core/utils';
|
|
14
15
|
import Background from '@micromag/element-background';
|
|
15
16
|
import CallToAction from '@micromag/element-call-to-action';
|
|
16
17
|
import ClosedCaptions from '@micromag/element-closed-captions';
|
|
@@ -24,7 +25,7 @@ var AnimeLinesGrey = "data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encod
|
|
|
24
25
|
|
|
25
26
|
var AnimeLines = "data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201083.95%201920%22%3E%20%20%20%20%3Cg%20id%3D%22a%22%2F%3E%20%20%20%20%3Cg%20id%3D%22b%22%3E%20%20%20%20%20%20%20%20%3Cg%20id%3D%22c%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M1083.95%2C0h-103.4l-438.55%2C959.95L1083.95%2C109.31V0Zm0%2C295L542.02%2C959.96l541.93-498.87v-166.08Zm0%2C274.99l-541.92%2C389.98%2C541.92-279.64v-110.34Zm0%2C190.53l-541.92%2C199.46%2C541.92-110.89v-88.57Zm0%2C158.17l-541.92%2C41.31%2C541.92%2C41.31v-82.61Zm0%2C152.21l-541.92-110.89%2C541.92%2C199.46v-88.58Zm0%2C168.77l-541.92-279.64%2C541.92%2C389.98v-110.34Zm0%2C219.25l-541.93-498.87%2C541.93%2C664.95v-166.08Zm0%2C351.77L542%2C960.05l438.55%2C959.95h103.4v-109.31ZM854.8%2C0h-138.91l-173.9%2C959.94L854.8%2C0Zm0%2C1920l-312.81-959.94%2C173.9%2C959.94h138.91ZM606.75%2C0h-129.56l64.78%2C959.94L606.75%2C0Zm0%2C1920l-64.78-959.94-64.78%2C959.94h129.56Zm-64.79-960.06L368.06%2C0H229.15l312.81%2C959.94Zm0%2C.12L229.15%2C1920h138.91l173.9-959.94Zm-.01-.11L103.4%2C0H0V109.31L541.94%2C959.95Zm0%2C.11L0%2C1810.69v109.31H103.4l438.55-959.95Zm-.01-.1L0%2C295.01v166.08l541.93%2C498.87Zm0%2C.09L0%2C1458.91v166.08L541.93%2C960.04Zm-.01-.07L0%2C570v110.34l541.92%2C279.63Zm0%2C.02L0%2C760.52v88.57l541.92%2C110.89Zm0%2C.02L0%2C918.69v82.61l541.92-41.31Zm0%2C.02L0%2C1070.9v88.57l541.92-199.46Zm0%2C.02L0%2C1239.66v110.34l541.92-389.97Z%22%20fill%3D%22%2312bbd7%22%2F%3E%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%3C%2Fg%3E%3C%2Fsvg%3E";
|
|
26
27
|
|
|
27
|
-
var styles = {"container":"micromag-screen-urbania-trivia-container","content":"micromag-screen-urbania-trivia-content","
|
|
28
|
+
var styles = {"container":"micromag-screen-urbania-trivia-container","content":"micromag-screen-urbania-trivia-content","fullscreen":"micromag-screen-urbania-trivia-fullscreen","image":"micromag-screen-urbania-trivia-image","placeholder":"micromag-screen-urbania-trivia-placeholder","disabled":"micromag-screen-urbania-trivia-disabled","hidden":"micromag-screen-urbania-trivia-hidden","empty":"micromag-screen-urbania-trivia-empty","itemsContainer":"micromag-screen-urbania-trivia-itemsContainer","videoContainer":"micromag-screen-urbania-trivia-videoContainer","video":"micromag-screen-urbania-trivia-video","isCustomBackground":"micromag-screen-urbania-trivia-isCustomBackground","isAnimated":"micromag-screen-urbania-trivia-isAnimated","spin":"micromag-screen-urbania-trivia-spin","heading":"micromag-screen-urbania-trivia-heading","hideHeading":"micromag-screen-urbania-trivia-hideHeading","callToAction":"micromag-screen-urbania-trivia-callToAction","bottom":"micromag-screen-urbania-trivia-bottom","visible":"micromag-screen-urbania-trivia-visible","withGradient":"micromag-screen-urbania-trivia-withGradient","mediaControls":"micromag-screen-urbania-trivia-mediaControls","videoPlaceholder":"micromag-screen-urbania-trivia-videoPlaceholder","bottomContent":"micromag-screen-urbania-trivia-bottomContent","emptyContainer":"micromag-screen-urbania-trivia-emptyContainer"};
|
|
28
29
|
|
|
29
30
|
var defaultBackground = {
|
|
30
31
|
image: {
|
|
@@ -76,7 +77,7 @@ var defaultProps = {
|
|
|
76
77
|
};
|
|
77
78
|
|
|
78
79
|
var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
|
|
79
|
-
var _ref12,
|
|
80
|
+
var _ref12, _ref14, _ref15;
|
|
80
81
|
|
|
81
82
|
var layout = _ref.layout,
|
|
82
83
|
title = _ref.title,
|
|
@@ -109,14 +110,15 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
|
|
|
109
110
|
var _useViewerNavigation = useViewerNavigation(),
|
|
110
111
|
gotoNextScreen = _useViewerNavigation.gotoNextScreen;
|
|
111
112
|
|
|
113
|
+
var hasTitle = isTextFilled(title);
|
|
112
114
|
var backgroundPlaying = current && (isView || isEdit);
|
|
113
115
|
var backgroundShouldLoad = current || active || !isView;
|
|
114
116
|
var videoShouldLoad = current || active || !isView;
|
|
115
117
|
var shouldGotoNextScreenOnEnd = gotoNextScreenOnEnd && isView && current;
|
|
116
118
|
|
|
117
|
-
var _ref2 = title || {}
|
|
118
|
-
_ref2
|
|
119
|
-
|
|
119
|
+
var _ref2 = title || {};
|
|
120
|
+
_ref2.body;
|
|
121
|
+
// get resized video style props
|
|
120
122
|
|
|
121
123
|
|
|
122
124
|
var _ref3 = video || {},
|
|
@@ -262,6 +264,7 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
|
|
|
262
264
|
backgroundVideo = _ref7$video === void 0 ? null : _ref7$video;
|
|
263
265
|
|
|
264
266
|
var isCustomBackground = background === null || backgroundImage === null && backgroundVideo === null;
|
|
267
|
+
var isAnimatedBackground = !isStatic && !isPreview && isCustomBackground;
|
|
265
268
|
var hasVideo = video !== null;
|
|
266
269
|
|
|
267
270
|
var _useState11 = useState(hasVideo),
|
|
@@ -365,18 +368,17 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
|
|
|
365
368
|
"value": "Heading"
|
|
366
369
|
}]
|
|
367
370
|
}))),
|
|
368
|
-
isEmpty:
|
|
369
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
371
|
+
isEmpty: !hasTitle
|
|
372
|
+
}, hasTitle ? /*#__PURE__*/React.createElement("div", {
|
|
370
373
|
ref: titleRef
|
|
371
374
|
}, /*#__PURE__*/React.createElement(Heading, Object.assign({
|
|
372
|
-
className:
|
|
373
|
-
|
|
374
|
-
}, title)))), /*#__PURE__*/React.createElement(ScreenElement, {
|
|
375
|
+
className: styles.heading // body={body}
|
|
376
|
+
|
|
377
|
+
}, title))) : null), /*#__PURE__*/React.createElement(ScreenElement, {
|
|
375
378
|
key: "video",
|
|
376
379
|
className: styles.videoScreenElement,
|
|
377
380
|
placeholder: /*#__PURE__*/React.createElement(PlaceholderVideo, Object.assign({
|
|
378
|
-
className: styles.videoPlaceholder
|
|
379
|
-
height: "300px"
|
|
381
|
+
className: styles.videoPlaceholder
|
|
380
382
|
}, placeholderProps)),
|
|
381
383
|
empty: /*#__PURE__*/React.createElement("div", {
|
|
382
384
|
className: styles.emptyContainer
|
|
@@ -438,7 +440,7 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
|
|
|
438
440
|
media: closedCaptions,
|
|
439
441
|
currentTime: currentTime
|
|
440
442
|
}) : null, /*#__PURE__*/React.createElement("div", {
|
|
441
|
-
className: classNames([styles.bottom, (
|
|
443
|
+
className: classNames([styles.bottom, (_ref12 = {}, _defineProperty(_ref12, styles.visible, visibleControls), _defineProperty(_ref12, styles.withGradient, withSeekBar || withPlayPause || muted), _ref12)])
|
|
442
444
|
}, hasVideoUrl ? /*#__PURE__*/React.createElement(MediaControls, {
|
|
443
445
|
className: classNames([styles.mediaControls, _defineProperty({}, styles.visible, visibleControls)]),
|
|
444
446
|
withSeekBar: withSeekBar,
|
|
@@ -467,13 +469,13 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
|
|
|
467
469
|
}
|
|
468
470
|
})) : null))) : null) : null))];
|
|
469
471
|
return /*#__PURE__*/React.createElement("div", Object.assign({
|
|
470
|
-
className: classNames([styles.container, (
|
|
472
|
+
className: classNames([styles.container, (_ref14 = {}, _defineProperty(_ref14, className, className !== null), _defineProperty(_ref14, styles.fullscreen, fullscreen), _ref14)]),
|
|
471
473
|
"data-screen-ready": isStatic || isCapture || ready
|
|
472
474
|
}, longPressBind, {
|
|
473
475
|
onMouseMove: onMouseMove
|
|
474
476
|
}), !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
|
|
475
477
|
background: finalBackground,
|
|
476
|
-
className: classNames([styles.background, (
|
|
478
|
+
className: classNames([styles.background, (_ref15 = {}, _defineProperty(_ref15, className, className !== null), _defineProperty(_ref15, styles.isCustomBackground, isCustomBackground), _defineProperty(_ref15, styles.isAnimated, isAnimatedBackground), _ref15)]),
|
|
477
479
|
width: width,
|
|
478
480
|
height: height,
|
|
479
481
|
resolution: resolution,
|
|
@@ -484,10 +486,7 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
|
|
|
484
486
|
className: styles.background,
|
|
485
487
|
width: width,
|
|
486
488
|
height: height,
|
|
487
|
-
resolution: resolution
|
|
488
|
-
styles: {
|
|
489
|
-
backgroundColor: 'red'
|
|
490
|
-
}
|
|
489
|
+
resolution: resolution
|
|
491
490
|
}), /*#__PURE__*/React.createElement(Container, {
|
|
492
491
|
width: width,
|
|
493
492
|
height: height
|
package/lib/index.js
CHANGED
|
@@ -15,6 +15,7 @@ var core = require('@micromag/core');
|
|
|
15
15
|
var components = require('@micromag/core/components');
|
|
16
16
|
var contexts = require('@micromag/core/contexts');
|
|
17
17
|
var hooks = require('@micromag/core/hooks');
|
|
18
|
+
var utils = require('@micromag/core/utils');
|
|
18
19
|
var Background = require('@micromag/element-background');
|
|
19
20
|
var CallToAction = require('@micromag/element-call-to-action');
|
|
20
21
|
var ClosedCaptions = require('@micromag/element-closed-captions');
|
|
@@ -46,7 +47,7 @@ var AnimeLinesGrey = "data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encod
|
|
|
46
47
|
|
|
47
48
|
var AnimeLines = "data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201083.95%201920%22%3E%20%20%20%20%3Cg%20id%3D%22a%22%2F%3E%20%20%20%20%3Cg%20id%3D%22b%22%3E%20%20%20%20%20%20%20%20%3Cg%20id%3D%22c%22%3E%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M1083.95%2C0h-103.4l-438.55%2C959.95L1083.95%2C109.31V0Zm0%2C295L542.02%2C959.96l541.93-498.87v-166.08Zm0%2C274.99l-541.92%2C389.98%2C541.92-279.64v-110.34Zm0%2C190.53l-541.92%2C199.46%2C541.92-110.89v-88.57Zm0%2C158.17l-541.92%2C41.31%2C541.92%2C41.31v-82.61Zm0%2C152.21l-541.92-110.89%2C541.92%2C199.46v-88.58Zm0%2C168.77l-541.92-279.64%2C541.92%2C389.98v-110.34Zm0%2C219.25l-541.93-498.87%2C541.93%2C664.95v-166.08Zm0%2C351.77L542%2C960.05l438.55%2C959.95h103.4v-109.31ZM854.8%2C0h-138.91l-173.9%2C959.94L854.8%2C0Zm0%2C1920l-312.81-959.94%2C173.9%2C959.94h138.91ZM606.75%2C0h-129.56l64.78%2C959.94L606.75%2C0Zm0%2C1920l-64.78-959.94-64.78%2C959.94h129.56Zm-64.79-960.06L368.06%2C0H229.15l312.81%2C959.94Zm0%2C.12L229.15%2C1920h138.91l173.9-959.94Zm-.01-.11L103.4%2C0H0V109.31L541.94%2C959.95Zm0%2C.11L0%2C1810.69v109.31H103.4l438.55-959.95Zm-.01-.1L0%2C295.01v166.08l541.93%2C498.87Zm0%2C.09L0%2C1458.91v166.08L541.93%2C960.04Zm-.01-.07L0%2C570v110.34l541.92%2C279.63Zm0%2C.02L0%2C760.52v88.57l541.92%2C110.89Zm0%2C.02L0%2C918.69v82.61l541.92-41.31Zm0%2C.02L0%2C1070.9v88.57l541.92-199.46Zm0%2C.02L0%2C1239.66v110.34l541.92-389.97Z%22%20fill%3D%22%2312bbd7%22%2F%3E%20%20%20%20%20%20%20%20%3C%2Fg%3E%20%20%20%20%3C%2Fg%3E%3C%2Fsvg%3E";
|
|
48
49
|
|
|
49
|
-
var styles = {"container":"micromag-screen-urbania-trivia-container","content":"micromag-screen-urbania-trivia-content","
|
|
50
|
+
var styles = {"container":"micromag-screen-urbania-trivia-container","content":"micromag-screen-urbania-trivia-content","fullscreen":"micromag-screen-urbania-trivia-fullscreen","image":"micromag-screen-urbania-trivia-image","placeholder":"micromag-screen-urbania-trivia-placeholder","disabled":"micromag-screen-urbania-trivia-disabled","hidden":"micromag-screen-urbania-trivia-hidden","empty":"micromag-screen-urbania-trivia-empty","itemsContainer":"micromag-screen-urbania-trivia-itemsContainer","videoContainer":"micromag-screen-urbania-trivia-videoContainer","video":"micromag-screen-urbania-trivia-video","isCustomBackground":"micromag-screen-urbania-trivia-isCustomBackground","isAnimated":"micromag-screen-urbania-trivia-isAnimated","spin":"micromag-screen-urbania-trivia-spin","heading":"micromag-screen-urbania-trivia-heading","hideHeading":"micromag-screen-urbania-trivia-hideHeading","callToAction":"micromag-screen-urbania-trivia-callToAction","bottom":"micromag-screen-urbania-trivia-bottom","visible":"micromag-screen-urbania-trivia-visible","withGradient":"micromag-screen-urbania-trivia-withGradient","mediaControls":"micromag-screen-urbania-trivia-mediaControls","videoPlaceholder":"micromag-screen-urbania-trivia-videoPlaceholder","bottomContent":"micromag-screen-urbania-trivia-bottomContent","emptyContainer":"micromag-screen-urbania-trivia-emptyContainer"};
|
|
50
51
|
|
|
51
52
|
var defaultBackground = {
|
|
52
53
|
image: {
|
|
@@ -98,7 +99,7 @@ var defaultProps = {
|
|
|
98
99
|
};
|
|
99
100
|
|
|
100
101
|
var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
|
|
101
|
-
var _ref12,
|
|
102
|
+
var _ref12, _ref14, _ref15;
|
|
102
103
|
|
|
103
104
|
var layout = _ref.layout,
|
|
104
105
|
title = _ref.title,
|
|
@@ -131,14 +132,15 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
|
|
|
131
132
|
var _useViewerNavigation = contexts.useViewerNavigation(),
|
|
132
133
|
gotoNextScreen = _useViewerNavigation.gotoNextScreen;
|
|
133
134
|
|
|
135
|
+
var hasTitle = utils.isTextFilled(title);
|
|
134
136
|
var backgroundPlaying = current && (isView || isEdit);
|
|
135
137
|
var backgroundShouldLoad = current || active || !isView;
|
|
136
138
|
var videoShouldLoad = current || active || !isView;
|
|
137
139
|
var shouldGotoNextScreenOnEnd = gotoNextScreenOnEnd && isView && current;
|
|
138
140
|
|
|
139
|
-
var _ref2 = title || {}
|
|
140
|
-
_ref2
|
|
141
|
-
|
|
141
|
+
var _ref2 = title || {};
|
|
142
|
+
_ref2.body;
|
|
143
|
+
// get resized video style props
|
|
142
144
|
|
|
143
145
|
|
|
144
146
|
var _ref3 = video || {},
|
|
@@ -284,6 +286,7 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
|
|
|
284
286
|
backgroundVideo = _ref7$video === void 0 ? null : _ref7$video;
|
|
285
287
|
|
|
286
288
|
var isCustomBackground = background === null || backgroundImage === null && backgroundVideo === null;
|
|
289
|
+
var isAnimatedBackground = !isStatic && !isPreview && isCustomBackground;
|
|
287
290
|
var hasVideo = video !== null;
|
|
288
291
|
|
|
289
292
|
var _useState11 = React.useState(hasVideo),
|
|
@@ -387,18 +390,17 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
|
|
|
387
390
|
"value": "Heading"
|
|
388
391
|
}]
|
|
389
392
|
}))),
|
|
390
|
-
isEmpty:
|
|
391
|
-
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
393
|
+
isEmpty: !hasTitle
|
|
394
|
+
}, hasTitle ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
392
395
|
ref: titleRef
|
|
393
396
|
}, /*#__PURE__*/React__default["default"].createElement(Heading__default["default"], Object.assign({
|
|
394
|
-
className:
|
|
395
|
-
|
|
396
|
-
}, title)))), /*#__PURE__*/React__default["default"].createElement(components.ScreenElement, {
|
|
397
|
+
className: styles.heading // body={body}
|
|
398
|
+
|
|
399
|
+
}, title))) : null), /*#__PURE__*/React__default["default"].createElement(components.ScreenElement, {
|
|
397
400
|
key: "video",
|
|
398
401
|
className: styles.videoScreenElement,
|
|
399
402
|
placeholder: /*#__PURE__*/React__default["default"].createElement(components.PlaceholderVideo, Object.assign({
|
|
400
|
-
className: styles.videoPlaceholder
|
|
401
|
-
height: "300px"
|
|
403
|
+
className: styles.videoPlaceholder
|
|
402
404
|
}, placeholderProps)),
|
|
403
405
|
empty: /*#__PURE__*/React__default["default"].createElement("div", {
|
|
404
406
|
className: styles.emptyContainer
|
|
@@ -460,7 +462,7 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
|
|
|
460
462
|
media: closedCaptions,
|
|
461
463
|
currentTime: currentTime
|
|
462
464
|
}) : null, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
463
|
-
className: classNames__default["default"]([styles.bottom, (
|
|
465
|
+
className: classNames__default["default"]([styles.bottom, (_ref12 = {}, _defineProperty__default["default"](_ref12, styles.visible, visibleControls), _defineProperty__default["default"](_ref12, styles.withGradient, withSeekBar || withPlayPause || muted), _ref12)])
|
|
464
466
|
}, hasVideoUrl ? /*#__PURE__*/React__default["default"].createElement(MediaControls__default["default"], {
|
|
465
467
|
className: classNames__default["default"]([styles.mediaControls, _defineProperty__default["default"]({}, styles.visible, visibleControls)]),
|
|
466
468
|
withSeekBar: withSeekBar,
|
|
@@ -489,13 +491,13 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
|
|
|
489
491
|
}
|
|
490
492
|
})) : null))) : null) : null))];
|
|
491
493
|
return /*#__PURE__*/React__default["default"].createElement("div", Object.assign({
|
|
492
|
-
className: classNames__default["default"]([styles.container, (
|
|
494
|
+
className: classNames__default["default"]([styles.container, (_ref14 = {}, _defineProperty__default["default"](_ref14, className, className !== null), _defineProperty__default["default"](_ref14, styles.fullscreen, fullscreen), _ref14)]),
|
|
493
495
|
"data-screen-ready": isStatic || isCapture || ready
|
|
494
496
|
}, longPressBind, {
|
|
495
497
|
onMouseMove: onMouseMove
|
|
496
498
|
}), !isPlaceholder ? /*#__PURE__*/React__default["default"].createElement(Background__default["default"], {
|
|
497
499
|
background: finalBackground,
|
|
498
|
-
className: classNames__default["default"]([styles.background, (
|
|
500
|
+
className: classNames__default["default"]([styles.background, (_ref15 = {}, _defineProperty__default["default"](_ref15, className, className !== null), _defineProperty__default["default"](_ref15, styles.isCustomBackground, isCustomBackground), _defineProperty__default["default"](_ref15, styles.isAnimated, isAnimatedBackground), _ref15)]),
|
|
499
501
|
width: width,
|
|
500
502
|
height: height,
|
|
501
503
|
resolution: resolution,
|
|
@@ -506,10 +508,7 @@ var UrbaniaTrivia = function UrbaniaTrivia(_ref) {
|
|
|
506
508
|
className: styles.background,
|
|
507
509
|
width: width,
|
|
508
510
|
height: height,
|
|
509
|
-
resolution: resolution
|
|
510
|
-
styles: {
|
|
511
|
-
backgroundColor: 'red'
|
|
512
|
-
}
|
|
511
|
+
resolution: resolution
|
|
513
512
|
}), /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
|
|
514
513
|
width: width,
|
|
515
514
|
height: height
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@micromag/screen-urbania-trivia",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.84",
|
|
4
4
|
"description": "",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"javascript"
|
|
@@ -69,5 +69,5 @@
|
|
|
69
69
|
"publishConfig": {
|
|
70
70
|
"access": "public"
|
|
71
71
|
},
|
|
72
|
-
"gitHead": "
|
|
72
|
+
"gitHead": "0368383e7699c0223de5344ec861cc6ff6318393"
|
|
73
73
|
}
|