@micromag/screen-urbania-article 0.3.251 → 0.3.252
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 +73 -39
- package/lib/index.js +70 -36
- package/package.json +15 -15
package/assets/css/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.micromag-screen-urbania-article-container .micromag-screen-urbania-article-empty,.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-video,.micromag-screen-urbania-article-container .micromag-screen-urbania-article-video{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-urbania-article-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-urbania-article-disabled.micromag-screen-urbania-article-container{overflow:hidden;pointer-events:none}.micromag-screen-urbania-article-hidden.micromag-screen-urbania-article-container{display:none;visibility:hidden}.micromag-screen-urbania-article-placeholder.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content{position:relative;padding:6px}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-empty{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-placeholder{background-color:#6c6c6c}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-emptyContainer{width:100%;height:0;margin-bottom:10px;padding-bottom:20%;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-emptyContainer.micromag-screen-urbania-article-small{padding-bottom:15%}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-empty{margin:0}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-inner{height:100%}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content,.micromag-screen-urbania-article-container .micromag-screen-urbania-article-inner{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;width:100%}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content{z-index:1;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;color:#222;text-align:center}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-authors,.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-description,.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-overTitle,.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-title{padding:3px 20px}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-overTitle{margin-bottom:10px;padding:30px 0 2px;border-bottom:1px solid;font-family:Agrandir Tight;font-size:10px;font-weight:700;text-transform:uppercase}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-title{font-family:GarageGothic-Bold;line-height:.88;text-transform:uppercase}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-description{padding:6px 20px 12px}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-lede{font-family:Agrandir;line-height:1.1}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-lede p{margin:0}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-authors{margin-bottom:6px}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-authors.micromag-screen-urbania-article-isAboveDescription{margin-bottom:0}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-sponsors{display:inline-block;width:100%;margin-top:auto;padding:2px 10px 4px;background-color:#ff0;color:#222;letter-spacing:.04em;line-height:.7}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-sponsors p,.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-sponsors span{line-height:.7}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content .micromag-screen-urbania-article-sponsor{display:inline;font-family:Agrandir;font-size:9px;font-weight:400;line-height:.7;text-transform:uppercase}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-quatre95{background-color:#fff}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-quatre95 .micromag-screen-urbania-article-author{color:#5e79ff}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-quatre95 .micromag-screen-urbania-article-sponsors,.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-urbania{background-color:#ff0;color:#222}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-urbania .micromag-screen-urbania-article-author{color:#222}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-urbania .micromag-screen-urbania-article-sponsors{background-color:#222;color:#ff0}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-dehors{background-color:#00c693;color:#ffeada}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-dehors .micromag-screen-urbania-article-author{color:#ffeada}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-universities{background-color:#fff;color:#f33}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content.micromag-screen-urbania-article-universities .micromag-screen-urbania-article-overTitle{color:#222}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-callToAction{position:absolute;z-index:10;right:0;bottom:0;left:0;padding-bottom:5px;-webkit-transform:translateZ(0);transform:translateZ(0);vertical-align:middle}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-callToAction .micromag-screen-urbania-article-arrow{margin-bottom:5px;opacity:.95}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-callToAction .micromag-screen-urbania-article-icon{display:inline-block;margin-top:-3px;margin-right:3px;padding:1px}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-mediaControls{padding:10px 20px 20px}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-placeholder{display:block}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-videoContainer{position:absolute}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-bottom{-webkit-transition:opacity .15s linear;-o-transition:opacity .15s linear;transition:opacity .15s linear;opacity:0}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-bottom.micromag-screen-urbania-article-visible{opacity:1}.micromag-screen-urbania-article-container .micromag-screen-urbania-article-bottom.micromag-screen-urbania-article-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-article-container.micromag-screen-urbania-article-isPlaceholder .micromag-screen-urbania-article-content{width:80%;height:35%;margin:5px auto;background-color:rgba(0,0,0,0);background-color:#2b2b2b}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isPlaceholder .micromag-screen-urbania-article-visual{position:relative;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;width:80%;height:50%;margin:5px auto}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-visual{height:auto}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-content{-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end;margin-bottom:50px;background-color:rgba(0,0,0,0)}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-content .micromag-screen-urbania-article-description,.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-content .micromag-screen-urbania-article-title{color:#fff;text-shadow:0 0 6px #222}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-content .micromag-screen-urbania-article-sponsors{margin-top:0}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-emptyContainer{top:0;height:100%;padding-bottom:0;-webkit-transform:none;-ms-transform:none;transform:none}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-callToAction{position:absolute}.micromag-screen-urbania-article-visual{height:100%}.micromag-screen-urbania-article-image{position:relative!important;width:100%!important;height:100%!important}.micromag-screen-urbania-article-isCurrent .micromag-screen-urbania-article-image{-webkit-animation:micromag-screen-urbania-article-slowZoom 15s ease-out 1 forwards;animation:micromag-screen-urbania-article-slowZoom 15s ease-out 1 forwards}.micromag-screen-urbania-article-img{position:relative!important;top:auto!important;left:auto!important;width:100%!important;height:100%!important;-o-object-fit:cover;object-fit:cover}@-webkit-keyframes micromag-screen-urbania-article-slowZoom{0%{-webkit-transform:scale(1);transform:scale(1)}to{-webkit-transform:scale(1.2);transform:scale(1.2)}}@keyframes micromag-screen-urbania-article-slowZoom{0%{-webkit-transform:scale(1);transform:scale(1)}to{-webkit-transform:scale(1.2);transform:scale(1.2)}}
|
|
1
|
+
.micromag-screen-urbania-article-callToActionContainer,.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-visual,.micromag-screen-urbania-article-content,.micromag-screen-urbania-article-empty,.micromag-screen-urbania-article-video{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-urbania-article-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-urbania-article-disabled.micromag-screen-urbania-article-container{overflow:hidden;pointer-events:none}.micromag-screen-urbania-article-hidden.micromag-screen-urbania-article-container{display:none;visibility:hidden}.micromag-screen-urbania-article-placeholder.micromag-screen-urbania-article-container .micromag-screen-urbania-article-content{position:relative;padding:6px}.micromag-screen-urbania-article-empty{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isPlaceholder .micromag-screen-urbania-article-articleContent{width:80%;height:35%;margin:5px auto;background-color:rgba(0,0,0,0);background-color:#2b2b2b}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isPlaceholder .micromag-screen-urbania-article-visual{position:relative;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;width:80%;height:50%;margin:5px auto}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-articleContent{position:relative;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end;margin-bottom:70px;background-color:rgba(0,0,0,0)}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-articleContent .micromag-screen-urbania-article-description,.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-articleContent .micromag-screen-urbania-article-title{color:#fff;text-shadow:0 0 6px #222}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-articleContent .micromag-screen-urbania-article-sponsors{margin-top:0}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-emptyContainer{top:0;height:100%;padding-bottom:0;-webkit-transform:none;-ms-transform:none;transform:none}.micromag-screen-urbania-article-container.micromag-screen-urbania-article-isVideo .micromag-screen-urbania-article-callToAction{position:absolute}.micromag-screen-urbania-article-placeholder{background-color:#6c6c6c}.micromag-screen-urbania-article-emptyContainer{width:100%;height:0;margin-bottom:10px;padding-bottom:20%;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}.micromag-screen-urbania-article-emptyContainer.micromag-screen-urbania-article-small{padding-bottom:15%}.micromag-screen-urbania-article-empty{margin:0}.micromag-screen-urbania-article-background{z-index:1}.micromag-screen-urbania-article-content{z-index:2;height:100%;-webkit-transform:translateZ(0);transform:translateZ(0)}.micromag-screen-urbania-article-articleContent,.micromag-screen-urbania-article-content{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;width:100%}.micromag-screen-urbania-article-articleContent{z-index:3;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;color:#222;text-align:center}.micromag-screen-urbania-article-articleContent .micromag-screen-urbania-article-authors,.micromag-screen-urbania-article-articleContent .micromag-screen-urbania-article-description,.micromag-screen-urbania-article-articleContent .micromag-screen-urbania-article-overTitle,.micromag-screen-urbania-article-articleContent .micromag-screen-urbania-article-title{padding:3px 20px}.micromag-screen-urbania-article-articleContent .micromag-screen-urbania-article-overTitle{margin-bottom:10px;padding:30px 0 2px;border-bottom:1px solid;font-family:Agrandir Tight;font-size:10px;font-weight:700;text-transform:uppercase}.micromag-screen-urbania-article-articleContent .micromag-screen-urbania-article-title{font-family:GarageGothic-Bold;line-height:.88;text-transform:uppercase}.micromag-screen-urbania-article-articleContent .micromag-screen-urbania-article-description{padding:6px 20px 12px}.micromag-screen-urbania-article-articleContent .micromag-screen-urbania-article-lede{font-family:Agrandir;line-height:1.1}.micromag-screen-urbania-article-articleContent .micromag-screen-urbania-article-lede p{margin:0}.micromag-screen-urbania-article-articleContent .micromag-screen-urbania-article-authors{margin-bottom:6px}.micromag-screen-urbania-article-articleContent .micromag-screen-urbania-article-authors.micromag-screen-urbania-article-isAboveDescription{margin-bottom:0}.micromag-screen-urbania-article-articleContent .micromag-screen-urbania-article-sponsors{display:inline-block;width:100%;margin-top:auto;padding:2px 10px 4px;background-color:#ff0;color:#222;letter-spacing:.04em;line-height:.7}.micromag-screen-urbania-article-articleContent .micromag-screen-urbania-article-sponsors p,.micromag-screen-urbania-article-articleContent .micromag-screen-urbania-article-sponsors span{line-height:.7}.micromag-screen-urbania-article-articleContent .micromag-screen-urbania-article-sponsor{display:inline;font-family:Agrandir;font-size:9px;font-weight:400;line-height:.7;text-transform:uppercase}.micromag-screen-urbania-article-articleContent.micromag-screen-urbania-article-quatre95{background-color:#fff}.micromag-screen-urbania-article-articleContent.micromag-screen-urbania-article-quatre95 .micromag-screen-urbania-article-author{color:#5e79ff}.micromag-screen-urbania-article-articleContent.micromag-screen-urbania-article-quatre95 .micromag-screen-urbania-article-sponsors,.micromag-screen-urbania-article-articleContent.micromag-screen-urbania-article-urbania{background-color:#ff0;color:#222}.micromag-screen-urbania-article-articleContent.micromag-screen-urbania-article-urbania .micromag-screen-urbania-article-author{color:#222}.micromag-screen-urbania-article-articleContent.micromag-screen-urbania-article-urbania .micromag-screen-urbania-article-sponsors{background-color:#222;color:#ff0}.micromag-screen-urbania-article-articleContent.micromag-screen-urbania-article-dehors{background-color:#00c693;color:#ffeada}.micromag-screen-urbania-article-articleContent.micromag-screen-urbania-article-dehors .micromag-screen-urbania-article-author{color:#ffeada}.micromag-screen-urbania-article-articleContent.micromag-screen-urbania-article-universities{background-color:#fff;color:#f33}.micromag-screen-urbania-article-articleContent.micromag-screen-urbania-article-universities .micromag-screen-urbania-article-overTitle{color:#222}.micromag-screen-urbania-article-visual{z-index:2;height:100%}.micromag-screen-urbania-article-callToActionContainer{z-index:3}.micromag-screen-urbania-article-callToAction{position:absolute;z-index:10;right:0;bottom:0;left:0;padding-bottom:5px;-webkit-transform:translateZ(0);transform:translateZ(0);vertical-align:middle}.micromag-screen-urbania-article-callToAction .micromag-screen-urbania-article-arrow{margin-bottom:5px;opacity:.95}.micromag-screen-urbania-article-callToAction .micromag-screen-urbania-article-icon{display:inline-block;margin-top:-3px;margin-right:3px;padding:1px}.micromag-screen-urbania-article-mediaControls{padding:10px 20px 20px}.micromag-screen-urbania-article-placeholder{display:block}.micromag-screen-urbania-article-bottom{-webkit-transition:opacity .15s linear;-o-transition:opacity .15s linear;transition:opacity .15s linear;opacity:0}.micromag-screen-urbania-article-bottom.micromag-screen-urbania-article-visible{opacity:1}.micromag-screen-urbania-article-bottom.micromag-screen-urbania-article-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-article-image{position:relative!important;width:100%!important;height:100%!important}.micromag-screen-urbania-article-isCurrent .micromag-screen-urbania-article-image{-webkit-animation:micromag-screen-urbania-article-slowZoom 15s ease-out 1 forwards;animation:micromag-screen-urbania-article-slowZoom 15s ease-out 1 forwards}.micromag-screen-urbania-article-img{position:relative!important;top:auto!important;left:auto!important;width:100%!important;height:100%!important;-o-object-fit:cover;object-fit:cover}@-webkit-keyframes micromag-screen-urbania-article-slowZoom{0%{-webkit-transform:scale(1);transform:scale(1)}to{-webkit-transform:scale(1.2);transform:scale(1.2)}}@keyframes micromag-screen-urbania-article-slowZoom{0%{-webkit-transform:scale(1);transform:scale(1)}to{-webkit-transform:scale(1.2);transform:scale(1.2)}}
|
package/es/index.js
CHANGED
|
@@ -4,14 +4,14 @@ import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
|
|
|
4
4
|
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
|
|
5
5
|
import { getJSON } from '@folklore/fetch';
|
|
6
6
|
import PropTypes from 'prop-types';
|
|
7
|
-
import React, { useMemo, useState, useEffect } from 'react';
|
|
7
|
+
import React, { useMemo, useState, useCallback, useEffect } from 'react';
|
|
8
8
|
import { isTextFilled, getStyleFromColor } from '@micromag/core/utils';
|
|
9
9
|
import _defineProperty from '@babel/runtime/helpers/defineProperty';
|
|
10
10
|
import classNames from 'classnames';
|
|
11
11
|
import { PropTypes as PropTypes$1 } from '@micromag/core';
|
|
12
|
-
import { ScreenElement, PlaceholderSubtitle, Empty, PlaceholderTitle,
|
|
12
|
+
import { ScreenElement, PlaceholderSubtitle, Empty, PlaceholderTitle, PlaceholderImage } from '@micromag/core/components';
|
|
13
13
|
import { useScreenSize, useScreenRenderContext, useViewerWebView, useViewerContext, usePlaybackContext, usePlaybackMediaRef } from '@micromag/core/contexts';
|
|
14
|
-
import { useDimensionObserver } from '@micromag/core/hooks';
|
|
14
|
+
import { useDimensionObserver, useDebounce } from '@micromag/core/hooks';
|
|
15
15
|
import Background from '@micromag/element-background';
|
|
16
16
|
import CallToAction from '@micromag/element-call-to-action';
|
|
17
17
|
import Container from '@micromag/element-container';
|
|
@@ -96,7 +96,7 @@ var WatchIcon = function WatchIcon(_ref) {
|
|
|
96
96
|
WatchIcon.propTypes = propTypes$2;
|
|
97
97
|
WatchIcon.defaultProps = defaultProps$2;
|
|
98
98
|
|
|
99
|
-
var styles = {"
|
|
99
|
+
var styles = {"callToActionContainer":"micromag-screen-urbania-article-callToActionContainer","container":"micromag-screen-urbania-article-container","isVideo":"micromag-screen-urbania-article-isVideo","visual":"micromag-screen-urbania-article-visual","content":"micromag-screen-urbania-article-content","empty":"micromag-screen-urbania-article-empty","video":"micromag-screen-urbania-article-video","disabled":"micromag-screen-urbania-article-disabled","hidden":"micromag-screen-urbania-article-hidden","placeholder":"micromag-screen-urbania-article-placeholder","isPlaceholder":"micromag-screen-urbania-article-isPlaceholder","articleContent":"micromag-screen-urbania-article-articleContent","description":"micromag-screen-urbania-article-description","title":"micromag-screen-urbania-article-title","sponsors":"micromag-screen-urbania-article-sponsors","emptyContainer":"micromag-screen-urbania-article-emptyContainer","callToAction":"micromag-screen-urbania-article-callToAction","small":"micromag-screen-urbania-article-small","background":"micromag-screen-urbania-article-background","authors":"micromag-screen-urbania-article-authors","overTitle":"micromag-screen-urbania-article-overTitle","lede":"micromag-screen-urbania-article-lede","isAboveDescription":"micromag-screen-urbania-article-isAboveDescription","sponsor":"micromag-screen-urbania-article-sponsor","quatre95":"micromag-screen-urbania-article-quatre95","author":"micromag-screen-urbania-article-author","urbania":"micromag-screen-urbania-article-urbania","dehors":"micromag-screen-urbania-article-dehors","universities":"micromag-screen-urbania-article-universities","arrow":"micromag-screen-urbania-article-arrow","icon":"micromag-screen-urbania-article-icon","mediaControls":"micromag-screen-urbania-article-mediaControls","bottom":"micromag-screen-urbania-article-bottom","visible":"micromag-screen-urbania-article-visible","withGradient":"micromag-screen-urbania-article-withGradient","image":"micromag-screen-urbania-article-image","isCurrent":"micromag-screen-urbania-article-isCurrent","slowZoom":"micromag-screen-urbania-article-slowZoom","img":"micromag-screen-urbania-article-img"};
|
|
100
100
|
|
|
101
101
|
var propTypes$1 = {
|
|
102
102
|
hasArticle: PropTypes.bool,
|
|
@@ -106,7 +106,7 @@ var propTypes$1 = {
|
|
|
106
106
|
description: PropTypes$1.textElement,
|
|
107
107
|
overTitle: PropTypes$1.headingElement,
|
|
108
108
|
author: PropTypes$1.authorElement,
|
|
109
|
-
|
|
109
|
+
sponsors: PropTypes.arrayOf(PropTypes.shape({})),
|
|
110
110
|
sponsorPrefix: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
|
|
111
111
|
sponsorColor: PropTypes$1.color,
|
|
112
112
|
site: PropTypes.string,
|
|
@@ -126,7 +126,7 @@ var defaultProps$1 = {
|
|
|
126
126
|
description: null,
|
|
127
127
|
overTitle: null,
|
|
128
128
|
author: null,
|
|
129
|
-
|
|
129
|
+
sponsors: null,
|
|
130
130
|
sponsorPrefix: null,
|
|
131
131
|
sponsorColor: null,
|
|
132
132
|
site: null,
|
|
@@ -140,7 +140,7 @@ var defaultProps$1 = {
|
|
|
140
140
|
};
|
|
141
141
|
|
|
142
142
|
var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
143
|
-
var
|
|
143
|
+
var _ref8;
|
|
144
144
|
|
|
145
145
|
var hasArticle = _ref.hasArticle,
|
|
146
146
|
type = _ref.type,
|
|
@@ -149,7 +149,7 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
149
149
|
description = _ref.description,
|
|
150
150
|
overTitle = _ref.overTitle,
|
|
151
151
|
author = _ref.author,
|
|
152
|
-
|
|
152
|
+
sponsors = _ref.sponsors,
|
|
153
153
|
sponsorPrefix = _ref.sponsorPrefix,
|
|
154
154
|
sponsorColor = _ref.sponsorColor,
|
|
155
155
|
site = _ref.site,
|
|
@@ -157,7 +157,6 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
157
157
|
callToAction = _ref.callToAction,
|
|
158
158
|
current = _ref.current,
|
|
159
159
|
active = _ref.active,
|
|
160
|
-
transitions = _ref.transitions,
|
|
161
160
|
spacing = _ref.spacing,
|
|
162
161
|
className = _ref.className;
|
|
163
162
|
|
|
@@ -179,15 +178,16 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
179
178
|
backgroundColor = _ref2$color === void 0 ? null : _ref2$color;
|
|
180
179
|
|
|
181
180
|
var _useViewerWebView = useViewerWebView(),
|
|
182
|
-
|
|
183
|
-
|
|
181
|
+
openedWebView = _useViewerWebView.opened,
|
|
182
|
+
openWebView = _useViewerWebView.open;
|
|
184
183
|
|
|
185
184
|
var _useViewerContext = useViewerContext(),
|
|
186
185
|
viewerBottomSidesWidth = _useViewerContext.bottomSidesWidth;
|
|
187
186
|
|
|
188
187
|
var _usePlaybackContext = usePlaybackContext(),
|
|
189
188
|
muted = _usePlaybackContext.muted,
|
|
190
|
-
playing = _usePlaybackContext.playing
|
|
189
|
+
playing = _usePlaybackContext.playing,
|
|
190
|
+
setPlaying = _usePlaybackContext.setPlaying;
|
|
191
191
|
|
|
192
192
|
var mediaRef = usePlaybackMediaRef(current);
|
|
193
193
|
|
|
@@ -211,8 +211,7 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
211
211
|
|
|
212
212
|
return {
|
|
213
213
|
imageHeight: difference
|
|
214
|
-
};
|
|
215
|
-
// return { imageHeight: defaultImageHeight, maxContentHeight: finalMaxContentHeight };
|
|
214
|
+
};
|
|
216
215
|
}, [contentTop, contentHeight, width, height]),
|
|
217
216
|
_useMemo$minContentHe = _useMemo.minContentHeight,
|
|
218
217
|
minContentHeight = _useMemo$minContentHe === void 0 ? null : _useMemo$minContentHe;
|
|
@@ -220,12 +219,12 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
220
219
|
var isVideo = type === 'video';
|
|
221
220
|
var hasOverTitle = isTextFilled(overTitle);
|
|
222
221
|
var hasTitle = isTextFilled(title);
|
|
223
|
-
var
|
|
222
|
+
var hasDescription = isTextFilled(description);
|
|
223
|
+
var hasSponsor = (sponsors || []).length > 0 && isTextFilled(sponsors[0]);
|
|
224
224
|
|
|
225
225
|
var _ref4 = author || {},
|
|
226
226
|
authorFullName = _ref4.name;
|
|
227
227
|
|
|
228
|
-
var hasDescription = isTextFilled(description);
|
|
229
228
|
var hasAuthor = isTextFilled(authorFullName);
|
|
230
229
|
|
|
231
230
|
var _ref5 = image || {},
|
|
@@ -233,11 +232,36 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
233
232
|
url = _ref5$url === void 0 ? null : _ref5$url;
|
|
234
233
|
|
|
235
234
|
var hasImage = url !== null;
|
|
236
|
-
var backgroundPlaying = current && !openedWebView && (isView || isEdit);
|
|
237
235
|
var mediaShouldLoad = current || active;
|
|
238
|
-
var
|
|
239
|
-
|
|
240
|
-
var
|
|
236
|
+
var hasCallToAction = callToAction !== null && callToAction.active === true; // const backgroundPlaying = current && (isView || isEdit);
|
|
237
|
+
|
|
238
|
+
var _useState = useState(false),
|
|
239
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
240
|
+
backgroundPlaying = _useState2[0],
|
|
241
|
+
setBackgroundPlaying = _useState2[1];
|
|
242
|
+
|
|
243
|
+
var playIfCurrent = useCallback(function () {
|
|
244
|
+
if (current && !openedWebView && !playing) {
|
|
245
|
+
setPlaying(true);
|
|
246
|
+
} else {
|
|
247
|
+
setPlaying(false);
|
|
248
|
+
}
|
|
249
|
+
}, [current, openedWebView, playing, setPlaying]); // TODO: link playIfCurrent and backgroundPlaying
|
|
250
|
+
|
|
251
|
+
useEffect(function () {
|
|
252
|
+
if (!current) {
|
|
253
|
+
setBackgroundPlaying(false);
|
|
254
|
+
} else if (current && (isView || isEdit)) {
|
|
255
|
+
setBackgroundPlaying(!openedWebView);
|
|
256
|
+
}
|
|
257
|
+
}, [current, isView, isEdit, openedWebView, setBackgroundPlaying]);
|
|
258
|
+
useDebounce(playIfCurrent, current, 500);
|
|
259
|
+
|
|
260
|
+
var _ref6 = background || {},
|
|
261
|
+
_ref6$video = _ref6.video,
|
|
262
|
+
backgroundVideo = _ref6$video === void 0 ? null : _ref6$video;
|
|
263
|
+
|
|
264
|
+
var hasVideoBackground = backgroundVideo !== null;
|
|
241
265
|
var items = [/*#__PURE__*/React.createElement(ScreenElement, {
|
|
242
266
|
key: "overTitle",
|
|
243
267
|
placeholder: /*#__PURE__*/React.createElement(PlaceholderSubtitle, {
|
|
@@ -330,18 +354,26 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
330
354
|
}, hasSponsor ? /*#__PURE__*/React.createElement("div", {
|
|
331
355
|
className: styles.sponsors,
|
|
332
356
|
style: _objectSpread({}, getStyleFromColor(sponsorColor))
|
|
333
|
-
},
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
357
|
+
}, sponsors.map(function () {
|
|
358
|
+
var sponsor = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
|
|
359
|
+
var _sponsor$body = sponsor.body,
|
|
360
|
+
body = _sponsor$body === void 0 ? '' : _sponsor$body;
|
|
361
|
+
return /*#__PURE__*/React.createElement(React.Fragment, {
|
|
362
|
+
key: body
|
|
363
|
+
}, sponsorPrefix !== null ? /*#__PURE__*/React.createElement("span", {
|
|
364
|
+
className: styles.sponsor
|
|
365
|
+
}, sponsorPrefix) : null, /*#__PURE__*/React.createElement("span", null, "\xA0"), /*#__PURE__*/React.createElement(Heading, Object.assign({
|
|
366
|
+
className: styles.sponsor,
|
|
367
|
+
size: "6"
|
|
368
|
+
}, sponsor)));
|
|
369
|
+
})) : null)].filter(function (it) {
|
|
339
370
|
return it !== null;
|
|
340
371
|
});
|
|
341
372
|
return /*#__PURE__*/React.createElement("div", {
|
|
342
|
-
className: classNames([styles.container, (
|
|
373
|
+
className: classNames([styles.container, (_ref8 = {}, _defineProperty(_ref8, className, className !== null), _defineProperty(_ref8, styles.isCurrent, current), _defineProperty(_ref8, styles.isVideo, isVideo), _defineProperty(_ref8, styles.hasVideoBackground, hasVideoBackground), _defineProperty(_ref8, styles.isPlaceholder, isPlaceholder), _ref8)]),
|
|
343
374
|
"data-screen-ready": isStatic || isCapture
|
|
344
375
|
}, /*#__PURE__*/React.createElement(Background, {
|
|
376
|
+
className: styles.background,
|
|
345
377
|
background: background,
|
|
346
378
|
width: width,
|
|
347
379
|
height: height,
|
|
@@ -349,13 +381,14 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
349
381
|
playing: backgroundPlaying,
|
|
350
382
|
muted: muted,
|
|
351
383
|
shouldLoad: mediaShouldLoad,
|
|
352
|
-
mediaRef: mediaRef
|
|
384
|
+
mediaRef: mediaRef,
|
|
385
|
+
withoutVideo: isPreview
|
|
353
386
|
}), /*#__PURE__*/React.createElement(Container, {
|
|
354
|
-
className: styles.
|
|
387
|
+
className: styles.content,
|
|
355
388
|
width: width,
|
|
356
389
|
height: height
|
|
357
390
|
}, /*#__PURE__*/React.createElement("div", {
|
|
358
|
-
className: classNames([styles.
|
|
391
|
+
className: classNames([styles.articleContent, _defineProperty({}, styles["".concat(site)], site !== null)]),
|
|
359
392
|
style: _objectSpread({
|
|
360
393
|
paddingTop: spacing,
|
|
361
394
|
minHeight: minContentHeight
|
|
@@ -363,10 +396,6 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
363
396
|
ref: contentRef
|
|
364
397
|
}, items), /*#__PURE__*/React.createElement("div", {
|
|
365
398
|
className: styles.visual
|
|
366
|
-
}, /*#__PURE__*/React.createElement(Transitions, {
|
|
367
|
-
playing: transitionPlaying,
|
|
368
|
-
transitions: transitions,
|
|
369
|
-
disabled: transitionDisabled || true
|
|
370
399
|
}, /*#__PURE__*/React.createElement(ScreenElement, {
|
|
371
400
|
key: "image",
|
|
372
401
|
placeholder: /*#__PURE__*/React.createElement(PlaceholderImage, {
|
|
@@ -395,8 +424,9 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
395
424
|
fit: 'cover'
|
|
396
425
|
},
|
|
397
426
|
shouldLoad: mediaShouldLoad,
|
|
427
|
+
withoutVideo: isPreview,
|
|
398
428
|
playing: backgroundPlaying && playing
|
|
399
|
-
}) : null, hasImage && isVideo ? /*#__PURE__*/React.createElement(Visual, {
|
|
429
|
+
}) : null, hasImage && isVideo && !hasVideoBackground ? /*#__PURE__*/React.createElement(Visual, {
|
|
400
430
|
className: styles.video,
|
|
401
431
|
media: image,
|
|
402
432
|
width: width,
|
|
@@ -408,8 +438,12 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
408
438
|
shouldLoad: mediaShouldLoad,
|
|
409
439
|
playing: backgroundPlaying && playing,
|
|
410
440
|
muted: muted,
|
|
411
|
-
|
|
412
|
-
|
|
441
|
+
withoutVideo: isPreview,
|
|
442
|
+
mediaRef: mediaRef,
|
|
443
|
+
autoPlay: true
|
|
444
|
+
}) : null)), /*#__PURE__*/React.createElement("div", {
|
|
445
|
+
className: styles.callToActionContainer
|
|
446
|
+
}, !isPlaceholder && hasCallToAction ? /*#__PURE__*/React.createElement("div", {
|
|
413
447
|
style: {
|
|
414
448
|
paddingTop: spacing,
|
|
415
449
|
paddingLeft: Math.max(0, viewerBottomSidesWidth - spacing),
|
|
@@ -428,7 +462,7 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
428
462
|
className: styles.icon
|
|
429
463
|
}) : null,
|
|
430
464
|
openWebView: openWebView
|
|
431
|
-
}))) : null)))
|
|
465
|
+
}))) : null)));
|
|
432
466
|
};
|
|
433
467
|
|
|
434
468
|
UrbaniaArticle.propTypes = propTypes$1;
|
|
@@ -577,7 +611,7 @@ var UrbaniaLoader = function UrbaniaLoader(_ref) {
|
|
|
577
611
|
body: 'En vedette'
|
|
578
612
|
}),
|
|
579
613
|
author: _objectSpread(_objectSpread({}, finalArticleAuthor), author),
|
|
580
|
-
|
|
614
|
+
sponsors: defaultSponsor !== null && !hasSponsorProps ? [_objectSpread(_objectSpread({}, sponsor), {}, {
|
|
581
615
|
body: "<strong>".concat(defaultSponsor, "</strong>")
|
|
582
616
|
})] : [sponsor],
|
|
583
617
|
sponsorPrefix: sponsorPrefix,
|
package/lib/index.js
CHANGED
|
@@ -117,7 +117,7 @@ var WatchIcon = function WatchIcon(_ref) {
|
|
|
117
117
|
WatchIcon.propTypes = propTypes$2;
|
|
118
118
|
WatchIcon.defaultProps = defaultProps$2;
|
|
119
119
|
|
|
120
|
-
var styles = {"
|
|
120
|
+
var styles = {"callToActionContainer":"micromag-screen-urbania-article-callToActionContainer","container":"micromag-screen-urbania-article-container","isVideo":"micromag-screen-urbania-article-isVideo","visual":"micromag-screen-urbania-article-visual","content":"micromag-screen-urbania-article-content","empty":"micromag-screen-urbania-article-empty","video":"micromag-screen-urbania-article-video","disabled":"micromag-screen-urbania-article-disabled","hidden":"micromag-screen-urbania-article-hidden","placeholder":"micromag-screen-urbania-article-placeholder","isPlaceholder":"micromag-screen-urbania-article-isPlaceholder","articleContent":"micromag-screen-urbania-article-articleContent","description":"micromag-screen-urbania-article-description","title":"micromag-screen-urbania-article-title","sponsors":"micromag-screen-urbania-article-sponsors","emptyContainer":"micromag-screen-urbania-article-emptyContainer","callToAction":"micromag-screen-urbania-article-callToAction","small":"micromag-screen-urbania-article-small","background":"micromag-screen-urbania-article-background","authors":"micromag-screen-urbania-article-authors","overTitle":"micromag-screen-urbania-article-overTitle","lede":"micromag-screen-urbania-article-lede","isAboveDescription":"micromag-screen-urbania-article-isAboveDescription","sponsor":"micromag-screen-urbania-article-sponsor","quatre95":"micromag-screen-urbania-article-quatre95","author":"micromag-screen-urbania-article-author","urbania":"micromag-screen-urbania-article-urbania","dehors":"micromag-screen-urbania-article-dehors","universities":"micromag-screen-urbania-article-universities","arrow":"micromag-screen-urbania-article-arrow","icon":"micromag-screen-urbania-article-icon","mediaControls":"micromag-screen-urbania-article-mediaControls","bottom":"micromag-screen-urbania-article-bottom","visible":"micromag-screen-urbania-article-visible","withGradient":"micromag-screen-urbania-article-withGradient","image":"micromag-screen-urbania-article-image","isCurrent":"micromag-screen-urbania-article-isCurrent","slowZoom":"micromag-screen-urbania-article-slowZoom","img":"micromag-screen-urbania-article-img"};
|
|
121
121
|
|
|
122
122
|
var propTypes$1 = {
|
|
123
123
|
hasArticle: PropTypes__default["default"].bool,
|
|
@@ -127,7 +127,7 @@ var propTypes$1 = {
|
|
|
127
127
|
description: core.PropTypes.textElement,
|
|
128
128
|
overTitle: core.PropTypes.headingElement,
|
|
129
129
|
author: core.PropTypes.authorElement,
|
|
130
|
-
|
|
130
|
+
sponsors: PropTypes__default["default"].arrayOf(PropTypes__default["default"].shape({})),
|
|
131
131
|
sponsorPrefix: PropTypes__default["default"].oneOfType([PropTypes__default["default"].node, PropTypes__default["default"].func]),
|
|
132
132
|
sponsorColor: core.PropTypes.color,
|
|
133
133
|
site: PropTypes__default["default"].string,
|
|
@@ -147,7 +147,7 @@ var defaultProps$1 = {
|
|
|
147
147
|
description: null,
|
|
148
148
|
overTitle: null,
|
|
149
149
|
author: null,
|
|
150
|
-
|
|
150
|
+
sponsors: null,
|
|
151
151
|
sponsorPrefix: null,
|
|
152
152
|
sponsorColor: null,
|
|
153
153
|
site: null,
|
|
@@ -161,7 +161,7 @@ var defaultProps$1 = {
|
|
|
161
161
|
};
|
|
162
162
|
|
|
163
163
|
var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
164
|
-
var
|
|
164
|
+
var _ref8;
|
|
165
165
|
|
|
166
166
|
var hasArticle = _ref.hasArticle,
|
|
167
167
|
type = _ref.type,
|
|
@@ -170,7 +170,7 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
170
170
|
description = _ref.description,
|
|
171
171
|
overTitle = _ref.overTitle,
|
|
172
172
|
author = _ref.author,
|
|
173
|
-
|
|
173
|
+
sponsors = _ref.sponsors,
|
|
174
174
|
sponsorPrefix = _ref.sponsorPrefix,
|
|
175
175
|
sponsorColor = _ref.sponsorColor,
|
|
176
176
|
site = _ref.site,
|
|
@@ -178,7 +178,6 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
178
178
|
callToAction = _ref.callToAction,
|
|
179
179
|
current = _ref.current,
|
|
180
180
|
active = _ref.active,
|
|
181
|
-
transitions = _ref.transitions,
|
|
182
181
|
spacing = _ref.spacing,
|
|
183
182
|
className = _ref.className;
|
|
184
183
|
|
|
@@ -200,15 +199,16 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
200
199
|
backgroundColor = _ref2$color === void 0 ? null : _ref2$color;
|
|
201
200
|
|
|
202
201
|
var _useViewerWebView = contexts.useViewerWebView(),
|
|
203
|
-
|
|
204
|
-
|
|
202
|
+
openedWebView = _useViewerWebView.opened,
|
|
203
|
+
openWebView = _useViewerWebView.open;
|
|
205
204
|
|
|
206
205
|
var _useViewerContext = contexts.useViewerContext(),
|
|
207
206
|
viewerBottomSidesWidth = _useViewerContext.bottomSidesWidth;
|
|
208
207
|
|
|
209
208
|
var _usePlaybackContext = contexts.usePlaybackContext(),
|
|
210
209
|
muted = _usePlaybackContext.muted,
|
|
211
|
-
playing = _usePlaybackContext.playing
|
|
210
|
+
playing = _usePlaybackContext.playing,
|
|
211
|
+
setPlaying = _usePlaybackContext.setPlaying;
|
|
212
212
|
|
|
213
213
|
var mediaRef = contexts.usePlaybackMediaRef(current);
|
|
214
214
|
|
|
@@ -232,8 +232,7 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
232
232
|
|
|
233
233
|
return {
|
|
234
234
|
imageHeight: difference
|
|
235
|
-
};
|
|
236
|
-
// return { imageHeight: defaultImageHeight, maxContentHeight: finalMaxContentHeight };
|
|
235
|
+
};
|
|
237
236
|
}, [contentTop, contentHeight, width, height]),
|
|
238
237
|
_useMemo$minContentHe = _useMemo.minContentHeight,
|
|
239
238
|
minContentHeight = _useMemo$minContentHe === void 0 ? null : _useMemo$minContentHe;
|
|
@@ -241,12 +240,12 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
241
240
|
var isVideo = type === 'video';
|
|
242
241
|
var hasOverTitle = utils.isTextFilled(overTitle);
|
|
243
242
|
var hasTitle = utils.isTextFilled(title);
|
|
244
|
-
var
|
|
243
|
+
var hasDescription = utils.isTextFilled(description);
|
|
244
|
+
var hasSponsor = (sponsors || []).length > 0 && utils.isTextFilled(sponsors[0]);
|
|
245
245
|
|
|
246
246
|
var _ref4 = author || {},
|
|
247
247
|
authorFullName = _ref4.name;
|
|
248
248
|
|
|
249
|
-
var hasDescription = utils.isTextFilled(description);
|
|
250
249
|
var hasAuthor = utils.isTextFilled(authorFullName);
|
|
251
250
|
|
|
252
251
|
var _ref5 = image || {},
|
|
@@ -254,11 +253,36 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
254
253
|
url = _ref5$url === void 0 ? null : _ref5$url;
|
|
255
254
|
|
|
256
255
|
var hasImage = url !== null;
|
|
257
|
-
var backgroundPlaying = current && !openedWebView && (isView || isEdit);
|
|
258
256
|
var mediaShouldLoad = current || active;
|
|
259
|
-
var
|
|
260
|
-
|
|
261
|
-
var
|
|
257
|
+
var hasCallToAction = callToAction !== null && callToAction.active === true; // const backgroundPlaying = current && (isView || isEdit);
|
|
258
|
+
|
|
259
|
+
var _useState = React.useState(false),
|
|
260
|
+
_useState2 = _slicedToArray__default["default"](_useState, 2),
|
|
261
|
+
backgroundPlaying = _useState2[0],
|
|
262
|
+
setBackgroundPlaying = _useState2[1];
|
|
263
|
+
|
|
264
|
+
var playIfCurrent = React.useCallback(function () {
|
|
265
|
+
if (current && !openedWebView && !playing) {
|
|
266
|
+
setPlaying(true);
|
|
267
|
+
} else {
|
|
268
|
+
setPlaying(false);
|
|
269
|
+
}
|
|
270
|
+
}, [current, openedWebView, playing, setPlaying]); // TODO: link playIfCurrent and backgroundPlaying
|
|
271
|
+
|
|
272
|
+
React.useEffect(function () {
|
|
273
|
+
if (!current) {
|
|
274
|
+
setBackgroundPlaying(false);
|
|
275
|
+
} else if (current && (isView || isEdit)) {
|
|
276
|
+
setBackgroundPlaying(!openedWebView);
|
|
277
|
+
}
|
|
278
|
+
}, [current, isView, isEdit, openedWebView, setBackgroundPlaying]);
|
|
279
|
+
hooks.useDebounce(playIfCurrent, current, 500);
|
|
280
|
+
|
|
281
|
+
var _ref6 = background || {},
|
|
282
|
+
_ref6$video = _ref6.video,
|
|
283
|
+
backgroundVideo = _ref6$video === void 0 ? null : _ref6$video;
|
|
284
|
+
|
|
285
|
+
var hasVideoBackground = backgroundVideo !== null;
|
|
262
286
|
var items = [/*#__PURE__*/React__default["default"].createElement(components.ScreenElement, {
|
|
263
287
|
key: "overTitle",
|
|
264
288
|
placeholder: /*#__PURE__*/React__default["default"].createElement(components.PlaceholderSubtitle, {
|
|
@@ -351,18 +375,26 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
351
375
|
}, hasSponsor ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
352
376
|
className: styles.sponsors,
|
|
353
377
|
style: _objectSpread__default["default"]({}, utils.getStyleFromColor(sponsorColor))
|
|
354
|
-
},
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
378
|
+
}, sponsors.map(function () {
|
|
379
|
+
var sponsor = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
|
|
380
|
+
var _sponsor$body = sponsor.body,
|
|
381
|
+
body = _sponsor$body === void 0 ? '' : _sponsor$body;
|
|
382
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
|
|
383
|
+
key: body
|
|
384
|
+
}, sponsorPrefix !== null ? /*#__PURE__*/React__default["default"].createElement("span", {
|
|
385
|
+
className: styles.sponsor
|
|
386
|
+
}, sponsorPrefix) : null, /*#__PURE__*/React__default["default"].createElement("span", null, "\xA0"), /*#__PURE__*/React__default["default"].createElement(Heading__default["default"], Object.assign({
|
|
387
|
+
className: styles.sponsor,
|
|
388
|
+
size: "6"
|
|
389
|
+
}, sponsor)));
|
|
390
|
+
})) : null)].filter(function (it) {
|
|
360
391
|
return it !== null;
|
|
361
392
|
});
|
|
362
393
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
363
|
-
className: classNames__default["default"]([styles.container, (
|
|
394
|
+
className: classNames__default["default"]([styles.container, (_ref8 = {}, _defineProperty__default["default"](_ref8, className, className !== null), _defineProperty__default["default"](_ref8, styles.isCurrent, current), _defineProperty__default["default"](_ref8, styles.isVideo, isVideo), _defineProperty__default["default"](_ref8, styles.hasVideoBackground, hasVideoBackground), _defineProperty__default["default"](_ref8, styles.isPlaceholder, isPlaceholder), _ref8)]),
|
|
364
395
|
"data-screen-ready": isStatic || isCapture
|
|
365
396
|
}, /*#__PURE__*/React__default["default"].createElement(Background__default["default"], {
|
|
397
|
+
className: styles.background,
|
|
366
398
|
background: background,
|
|
367
399
|
width: width,
|
|
368
400
|
height: height,
|
|
@@ -370,13 +402,14 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
370
402
|
playing: backgroundPlaying,
|
|
371
403
|
muted: muted,
|
|
372
404
|
shouldLoad: mediaShouldLoad,
|
|
373
|
-
mediaRef: mediaRef
|
|
405
|
+
mediaRef: mediaRef,
|
|
406
|
+
withoutVideo: isPreview
|
|
374
407
|
}), /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
|
|
375
|
-
className: styles.
|
|
408
|
+
className: styles.content,
|
|
376
409
|
width: width,
|
|
377
410
|
height: height
|
|
378
411
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
379
|
-
className: classNames__default["default"]([styles.
|
|
412
|
+
className: classNames__default["default"]([styles.articleContent, _defineProperty__default["default"]({}, styles["".concat(site)], site !== null)]),
|
|
380
413
|
style: _objectSpread__default["default"]({
|
|
381
414
|
paddingTop: spacing,
|
|
382
415
|
minHeight: minContentHeight
|
|
@@ -384,10 +417,6 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
384
417
|
ref: contentRef
|
|
385
418
|
}, items), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
386
419
|
className: styles.visual
|
|
387
|
-
}, /*#__PURE__*/React__default["default"].createElement(components.Transitions, {
|
|
388
|
-
playing: transitionPlaying,
|
|
389
|
-
transitions: transitions,
|
|
390
|
-
disabled: transitionDisabled || true
|
|
391
420
|
}, /*#__PURE__*/React__default["default"].createElement(components.ScreenElement, {
|
|
392
421
|
key: "image",
|
|
393
422
|
placeholder: /*#__PURE__*/React__default["default"].createElement(components.PlaceholderImage, {
|
|
@@ -416,8 +445,9 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
416
445
|
fit: 'cover'
|
|
417
446
|
},
|
|
418
447
|
shouldLoad: mediaShouldLoad,
|
|
448
|
+
withoutVideo: isPreview,
|
|
419
449
|
playing: backgroundPlaying && playing
|
|
420
|
-
}) : null, hasImage && isVideo ? /*#__PURE__*/React__default["default"].createElement(Visual__default["default"], {
|
|
450
|
+
}) : null, hasImage && isVideo && !hasVideoBackground ? /*#__PURE__*/React__default["default"].createElement(Visual__default["default"], {
|
|
421
451
|
className: styles.video,
|
|
422
452
|
media: image,
|
|
423
453
|
width: width,
|
|
@@ -429,8 +459,12 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
429
459
|
shouldLoad: mediaShouldLoad,
|
|
430
460
|
playing: backgroundPlaying && playing,
|
|
431
461
|
muted: muted,
|
|
432
|
-
|
|
433
|
-
|
|
462
|
+
withoutVideo: isPreview,
|
|
463
|
+
mediaRef: mediaRef,
|
|
464
|
+
autoPlay: true
|
|
465
|
+
}) : null)), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
466
|
+
className: styles.callToActionContainer
|
|
467
|
+
}, !isPlaceholder && hasCallToAction ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
434
468
|
style: {
|
|
435
469
|
paddingTop: spacing,
|
|
436
470
|
paddingLeft: Math.max(0, viewerBottomSidesWidth - spacing),
|
|
@@ -449,7 +483,7 @@ var UrbaniaArticle = function UrbaniaArticle(_ref) {
|
|
|
449
483
|
className: styles.icon
|
|
450
484
|
}) : null,
|
|
451
485
|
openWebView: openWebView
|
|
452
|
-
}))) : null)))
|
|
486
|
+
}))) : null)));
|
|
453
487
|
};
|
|
454
488
|
|
|
455
489
|
UrbaniaArticle.propTypes = propTypes$1;
|
|
@@ -598,7 +632,7 @@ var UrbaniaLoader = function UrbaniaLoader(_ref) {
|
|
|
598
632
|
body: 'En vedette'
|
|
599
633
|
}),
|
|
600
634
|
author: _objectSpread__default["default"](_objectSpread__default["default"]({}, finalArticleAuthor), author),
|
|
601
|
-
|
|
635
|
+
sponsors: defaultSponsor !== null && !hasSponsorProps ? [_objectSpread__default["default"](_objectSpread__default["default"]({}, sponsor), {}, {
|
|
602
636
|
body: "<strong>".concat(defaultSponsor, "</strong>")
|
|
603
637
|
})] : [sponsor],
|
|
604
638
|
sponsorPrefix: sponsorPrefix,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@micromag/screen-urbania-article",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.252",
|
|
4
4
|
"description": "",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"javascript"
|
|
@@ -51,19 +51,19 @@
|
|
|
51
51
|
"@babel/runtime": "^7.13.10",
|
|
52
52
|
"@folklore/fetch": "^0.1.15",
|
|
53
53
|
"@folklore/size": "^0.1.20",
|
|
54
|
-
"@micromag/core": "^0.3.
|
|
55
|
-
"@micromag/element-background": "^0.3.
|
|
56
|
-
"@micromag/element-call-to-action": "^0.3.
|
|
57
|
-
"@micromag/element-closed-captions": "^0.3.
|
|
58
|
-
"@micromag/element-container": "^0.3.
|
|
59
|
-
"@micromag/element-heading": "^0.3.
|
|
60
|
-
"@micromag/element-image": "^0.3.
|
|
61
|
-
"@micromag/element-media-controls": "^0.3.
|
|
62
|
-
"@micromag/element-text": "^0.3.
|
|
63
|
-
"@micromag/element-urbania-author": "^0.3.
|
|
64
|
-
"@micromag/element-video": "^0.3.
|
|
65
|
-
"@micromag/element-visual": "^0.3.
|
|
66
|
-
"@micromag/transforms": "^0.3.
|
|
54
|
+
"@micromag/core": "^0.3.252",
|
|
55
|
+
"@micromag/element-background": "^0.3.252",
|
|
56
|
+
"@micromag/element-call-to-action": "^0.3.252",
|
|
57
|
+
"@micromag/element-closed-captions": "^0.3.252",
|
|
58
|
+
"@micromag/element-container": "^0.3.252",
|
|
59
|
+
"@micromag/element-heading": "^0.3.252",
|
|
60
|
+
"@micromag/element-image": "^0.3.252",
|
|
61
|
+
"@micromag/element-media-controls": "^0.3.252",
|
|
62
|
+
"@micromag/element-text": "^0.3.252",
|
|
63
|
+
"@micromag/element-urbania-author": "^0.3.252",
|
|
64
|
+
"@micromag/element-video": "^0.3.252",
|
|
65
|
+
"@micromag/element-visual": "^0.3.252",
|
|
66
|
+
"@micromag/transforms": "^0.3.252",
|
|
67
67
|
"classnames": "^2.2.6",
|
|
68
68
|
"lodash": "^4.17.21",
|
|
69
69
|
"prop-types": "^15.7.2",
|
|
@@ -73,5 +73,5 @@
|
|
|
73
73
|
"publishConfig": {
|
|
74
74
|
"access": "public"
|
|
75
75
|
},
|
|
76
|
-
"gitHead": "
|
|
76
|
+
"gitHead": "67a8b8144a40086a6dfd98c9eb8c4b6b8ebb05b0"
|
|
77
77
|
}
|