@micromag/screen-video-360 0.3.230 → 0.3.235
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 +14 -12
- package/lib/index.js +14 -12
- package/package.json +11 -11
package/assets/css/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.micromag-screen-video-360-container .micromag-screen-video-360-canvasButton{display:inline-block;position:relative;padding:0;border:0;background:rgba(0,0,0,0);color:inherit;font-family:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.micromag-screen-video-360-container .micromag-screen-video-360-canvas,.micromag-screen-video-360-container .micromag-screen-video-360-canvasButton,.micromag-screen-video-360-container .micromag-screen-video-360-
|
|
1
|
+
.micromag-screen-video-360-container .micromag-screen-video-360-canvasButton{display:inline-block;position:relative;padding:0;border:0;background:rgba(0,0,0,0);color:inherit;font-family:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.micromag-screen-video-360-container .micromag-screen-video-360-background,.micromag-screen-video-360-container .micromag-screen-video-360-canvas,.micromag-screen-video-360-container .micromag-screen-video-360-canvasButton,.micromag-screen-video-360-container .micromag-screen-video-360-inner,.micromag-screen-video-360-container .micromag-screen-video-360-placeholder,.micromag-screen-video-360-container .micromag-screen-video-360-video{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-video-360-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-video-360-disabled.micromag-screen-video-360-container{overflow:hidden;pointer-events:none}.micromag-screen-video-360-hidden.micromag-screen-video-360-container{display:none;visibility:hidden}.micromag-screen-video-360-placeholder.micromag-screen-video-360-container .micromag-screen-video-360-content{position:relative;padding:6px}.micromag-screen-video-360-container .micromag-screen-video-360-empty{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-video-360-container .micromag-screen-video-360-background{z-index:0}.micromag-screen-video-360-container .micromag-screen-video-360-content{z-index:1}.micromag-screen-video-360-container .micromag-screen-video-360-empty{height:100%;margin:0}.micromag-screen-video-360-container .micromag-screen-video-360-canvasButton{-ms-touch-action:none;touch-action:none}.micromag-screen-video-360-container .micromag-screen-video-360-videoContainer{position:absolute}.micromag-screen-video-360-container .micromag-screen-video-360-video{visibility:hidden}.micromag-screen-video-360-container .micromag-screen-video-360-video video{height:100%}.micromag-screen-video-360-container .micromag-screen-video-360-mediaControls{padding:10px 20px 20px}.micromag-screen-video-360-container .micromag-screen-video-360-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;height:100%}.micromag-screen-video-360-container .micromag-screen-video-360-bottom{position:absolute;bottom:0;left:0;width:100%;-webkit-transition:padding .2s ease-out,-webkit-transform .2s ease-out;transition:padding .2s ease-out,-webkit-transform .2s ease-out;-o-transition:transform .2s ease-out,padding .2s ease-out;transition:transform .2s ease-out,padding .2s ease-out;transition:transform .2s ease-out,padding .2s ease-out,-webkit-transform .2s ease-out}.micromag-screen-video-360-container .micromag-screen-video-360-bottom>*{margin-bottom:10px}.micromag-screen-video-360-container .micromag-screen-video-360-bottom>:last-child{margin-bottom:0}.micromag-screen-video-360-container.micromag-screen-video-360-showVideo .micromag-screen-video-360-video{visibility:visible}
|
package/es/index.js
CHANGED
|
@@ -77,7 +77,7 @@ var useThree = function useThree() {
|
|
|
77
77
|
return loadedPackage;
|
|
78
78
|
};
|
|
79
79
|
|
|
80
|
-
var styles = {"container":"micromag-screen-video-360-container","canvasButton":"micromag-screen-video-360-canvasButton","canvas":"micromag-screen-video-360-canvas","
|
|
80
|
+
var styles = {"container":"micromag-screen-video-360-container","canvasButton":"micromag-screen-video-360-canvasButton","background":"micromag-screen-video-360-background","canvas":"micromag-screen-video-360-canvas","inner":"micromag-screen-video-360-inner","placeholder":"micromag-screen-video-360-placeholder","video":"micromag-screen-video-360-video","disabled":"micromag-screen-video-360-disabled","hidden":"micromag-screen-video-360-hidden","content":"micromag-screen-video-360-content","empty":"micromag-screen-video-360-empty","videoContainer":"micromag-screen-video-360-videoContainer","mediaControls":"micromag-screen-video-360-mediaControls","bottom":"micromag-screen-video-360-bottom","showVideo":"micromag-screen-video-360-showVideo"};
|
|
81
81
|
|
|
82
82
|
var propTypes = {
|
|
83
83
|
layout: PropTypes.oneOf(['full']),
|
|
@@ -607,17 +607,10 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
607
607
|
return /*#__PURE__*/React.createElement("div", {
|
|
608
608
|
className: classNames([styles.container, (_ref11 = {}, _defineProperty(_ref11, className, className !== null), _defineProperty(_ref11, styles.showVideo, isPreview || isStatic || isCapture), _ref11)]),
|
|
609
609
|
"data-screen-ready": (isStatic || isCapture) && posterReady || ready
|
|
610
|
-
},
|
|
611
|
-
background: background,
|
|
610
|
+
}, /*#__PURE__*/React.createElement(Container, {
|
|
612
611
|
width: width,
|
|
613
612
|
height: height,
|
|
614
|
-
|
|
615
|
-
playing: backgroundPlaying,
|
|
616
|
-
shouldLoad: mediaShouldLoad,
|
|
617
|
-
withoutVideo: isPreview
|
|
618
|
-
}) : null, /*#__PURE__*/React.createElement(Container, {
|
|
619
|
-
width: width,
|
|
620
|
-
height: height
|
|
613
|
+
className: styles.content
|
|
621
614
|
}, withVideoSphere ? /*#__PURE__*/React.createElement("div", {
|
|
622
615
|
ref: videoContainerRef,
|
|
623
616
|
className: styles.videoContainer,
|
|
@@ -645,8 +638,17 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
645
638
|
focusable: current && isView,
|
|
646
639
|
shouldLoad: mediaShouldLoad
|
|
647
640
|
}))) : null, /*#__PURE__*/React.createElement("div", {
|
|
648
|
-
className: styles.
|
|
649
|
-
}, items))
|
|
641
|
+
className: styles.inner
|
|
642
|
+
}, items)), !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
|
|
643
|
+
background: background,
|
|
644
|
+
width: width,
|
|
645
|
+
height: height,
|
|
646
|
+
resolution: resolution,
|
|
647
|
+
playing: backgroundPlaying,
|
|
648
|
+
shouldLoad: mediaShouldLoad,
|
|
649
|
+
withoutVideo: isPreview,
|
|
650
|
+
className: styles.background
|
|
651
|
+
}) : null);
|
|
650
652
|
};
|
|
651
653
|
|
|
652
654
|
Video360Screen.propTypes = propTypes;
|
package/lib/index.js
CHANGED
|
@@ -115,7 +115,7 @@ var useThree = function useThree() {
|
|
|
115
115
|
return loadedPackage;
|
|
116
116
|
};
|
|
117
117
|
|
|
118
|
-
var styles = {"container":"micromag-screen-video-360-container","canvasButton":"micromag-screen-video-360-canvasButton","canvas":"micromag-screen-video-360-canvas","
|
|
118
|
+
var styles = {"container":"micromag-screen-video-360-container","canvasButton":"micromag-screen-video-360-canvasButton","background":"micromag-screen-video-360-background","canvas":"micromag-screen-video-360-canvas","inner":"micromag-screen-video-360-inner","placeholder":"micromag-screen-video-360-placeholder","video":"micromag-screen-video-360-video","disabled":"micromag-screen-video-360-disabled","hidden":"micromag-screen-video-360-hidden","content":"micromag-screen-video-360-content","empty":"micromag-screen-video-360-empty","videoContainer":"micromag-screen-video-360-videoContainer","mediaControls":"micromag-screen-video-360-mediaControls","bottom":"micromag-screen-video-360-bottom","showVideo":"micromag-screen-video-360-showVideo"};
|
|
119
119
|
|
|
120
120
|
var propTypes = {
|
|
121
121
|
layout: PropTypes__default["default"].oneOf(['full']),
|
|
@@ -645,17 +645,10 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
645
645
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
646
646
|
className: classNames__default["default"]([styles.container, (_ref11 = {}, _defineProperty__default["default"](_ref11, className, className !== null), _defineProperty__default["default"](_ref11, styles.showVideo, isPreview || isStatic || isCapture), _ref11)]),
|
|
647
647
|
"data-screen-ready": (isStatic || isCapture) && posterReady || ready
|
|
648
|
-
},
|
|
649
|
-
background: background,
|
|
648
|
+
}, /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
|
|
650
649
|
width: width,
|
|
651
650
|
height: height,
|
|
652
|
-
|
|
653
|
-
playing: backgroundPlaying,
|
|
654
|
-
shouldLoad: mediaShouldLoad,
|
|
655
|
-
withoutVideo: isPreview
|
|
656
|
-
}) : null, /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
|
|
657
|
-
width: width,
|
|
658
|
-
height: height
|
|
651
|
+
className: styles.content
|
|
659
652
|
}, withVideoSphere ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
660
653
|
ref: videoContainerRef,
|
|
661
654
|
className: styles.videoContainer,
|
|
@@ -683,8 +676,17 @@ var Video360Screen = function Video360Screen(_ref) {
|
|
|
683
676
|
focusable: current && isView,
|
|
684
677
|
shouldLoad: mediaShouldLoad
|
|
685
678
|
}))) : null, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
686
|
-
className: styles.
|
|
687
|
-
}, items))
|
|
679
|
+
className: styles.inner
|
|
680
|
+
}, items)), !isPlaceholder ? /*#__PURE__*/React__default["default"].createElement(Background__default["default"], {
|
|
681
|
+
background: background,
|
|
682
|
+
width: width,
|
|
683
|
+
height: height,
|
|
684
|
+
resolution: resolution,
|
|
685
|
+
playing: backgroundPlaying,
|
|
686
|
+
shouldLoad: mediaShouldLoad,
|
|
687
|
+
withoutVideo: isPreview,
|
|
688
|
+
className: styles.background
|
|
689
|
+
}) : null);
|
|
688
690
|
};
|
|
689
691
|
|
|
690
692
|
Video360Screen.propTypes = propTypes;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@micromag/screen-video-360",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.235",
|
|
4
4
|
"description": "",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"javascript"
|
|
@@ -50,15 +50,15 @@
|
|
|
50
50
|
"dependencies": {
|
|
51
51
|
"@babel/runtime": "^7.13.10",
|
|
52
52
|
"@folklore/size": "^0.1.20",
|
|
53
|
-
"@micromag/core": "^0.3.
|
|
54
|
-
"@micromag/element-background": "^0.3.
|
|
55
|
-
"@micromag/element-call-to-action": "^0.3.
|
|
56
|
-
"@micromag/element-closed-captions": "^0.3.
|
|
57
|
-
"@micromag/element-container": "^0.3.
|
|
58
|
-
"@micromag/element-image": "^0.3.
|
|
59
|
-
"@micromag/element-media-controls": "^0.3.
|
|
60
|
-
"@micromag/element-video": "^0.3.
|
|
61
|
-
"@micromag/transforms": "^0.3.
|
|
53
|
+
"@micromag/core": "^0.3.235",
|
|
54
|
+
"@micromag/element-background": "^0.3.235",
|
|
55
|
+
"@micromag/element-call-to-action": "^0.3.235",
|
|
56
|
+
"@micromag/element-closed-captions": "^0.3.235",
|
|
57
|
+
"@micromag/element-container": "^0.3.235",
|
|
58
|
+
"@micromag/element-image": "^0.3.235",
|
|
59
|
+
"@micromag/element-media-controls": "^0.3.235",
|
|
60
|
+
"@micromag/element-video": "^0.3.235",
|
|
61
|
+
"@micromag/transforms": "^0.3.235",
|
|
62
62
|
"classnames": "^2.2.6",
|
|
63
63
|
"lodash": "^4.17.21",
|
|
64
64
|
"prop-types": "^15.7.2",
|
|
@@ -70,5 +70,5 @@
|
|
|
70
70
|
"publishConfig": {
|
|
71
71
|
"access": "public"
|
|
72
72
|
},
|
|
73
|
-
"gitHead": "
|
|
73
|
+
"gitHead": "e1f899344bb55abf06daa6247d9adbd7401a765b"
|
|
74
74
|
}
|