@micromag/screen-image-360 0.3.250 → 0.3.251
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 +13 -16
- package/lib/index.js +13 -16
- package/package.json +11 -11
package/assets/css/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.micromag-screen-image-360-container .micromag-screen-image-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-image-360-container .micromag-screen-image-360-
|
|
1
|
+
.micromag-screen-image-360-container .micromag-screen-image-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-image-360-container .micromag-screen-image-360-canvas,.micromag-screen-image-360-container .micromag-screen-image-360-canvasButton,.micromag-screen-image-360-container .micromag-screen-image-360-content,.micromag-screen-image-360-container .micromag-screen-image-360-placeholder,.micromag-screen-image-360-container .micromag-screen-image-360-video{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-image-360-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-image-360-disabled.micromag-screen-image-360-container{overflow:hidden;pointer-events:none}.micromag-screen-image-360-hidden.micromag-screen-image-360-container{display:none;visibility:hidden}.micromag-screen-image-360-placeholder.micromag-screen-image-360-container .micromag-screen-image-360-content{position:relative;padding:6px}.micromag-screen-image-360-container .micromag-screen-image-360-empty{margin:5px auto;border:2px dashed #343434;color:#343434;height:100%;margin:0}.micromag-screen-image-360-container .micromag-screen-image-360-canvasButton{-ms-touch-action:none;touch-action:none}.micromag-screen-image-360-container .micromag-screen-image-360-videoContainer{position:absolute}.micromag-screen-image-360-container .micromag-screen-image-360-video{visibility:hidden}.micromag-screen-image-360-container .micromag-screen-image-360-video video{height:100%}.micromag-screen-image-360-container .micromag-screen-image-360-mediaControls{padding:10px 20px 20px}.micromag-screen-image-360-container .micromag-screen-image-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-image-360-container .micromag-screen-image-360-callToAction{position:absolute;bottom:0;left:0;width:100%}.micromag-screen-image-360-container.micromag-screen-image-360-showVideo .micromag-screen-image-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-image-360-container","canvasButton":"micromag-screen-image-360-canvasButton","
|
|
80
|
+
var styles = {"container":"micromag-screen-image-360-container","canvasButton":"micromag-screen-image-360-canvasButton","canvas":"micromag-screen-image-360-canvas","content":"micromag-screen-image-360-content","placeholder":"micromag-screen-image-360-placeholder","video":"micromag-screen-image-360-video","disabled":"micromag-screen-image-360-disabled","hidden":"micromag-screen-image-360-hidden","empty":"micromag-screen-image-360-empty","videoContainer":"micromag-screen-image-360-videoContainer","mediaControls":"micromag-screen-image-360-mediaControls","callToAction":"micromag-screen-image-360-callToAction","showVideo":"micromag-screen-image-360-showVideo"};
|
|
81
81
|
|
|
82
82
|
var propTypes = {
|
|
83
83
|
layout: PropTypes.oneOf(['full']),
|
|
@@ -457,10 +457,18 @@ var Image360Screen = function Image360Screen(_ref) {
|
|
|
457
457
|
return /*#__PURE__*/React.createElement("div", {
|
|
458
458
|
className: classNames([styles.container, (_ref7 = {}, _defineProperty(_ref7, className, className !== null), _defineProperty(_ref7, styles.showVideo, isPreview || isStatic || isCapture), _ref7)]),
|
|
459
459
|
"data-screen-ready": (isStatic || isCapture) && posterReady || ready
|
|
460
|
-
}, /*#__PURE__*/React.createElement(
|
|
460
|
+
}, !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
|
|
461
|
+
background: background,
|
|
461
462
|
width: width,
|
|
462
463
|
height: height,
|
|
463
|
-
|
|
464
|
+
resolution: resolution,
|
|
465
|
+
playing: backgroundPlaying,
|
|
466
|
+
muted: muted,
|
|
467
|
+
shouldLoad: mediaShouldLoad,
|
|
468
|
+
mediaRef: mediaRef
|
|
469
|
+
}) : null, /*#__PURE__*/React.createElement(Container, {
|
|
470
|
+
width: width,
|
|
471
|
+
height: height
|
|
464
472
|
}, /*#__PURE__*/React.createElement("div", {
|
|
465
473
|
ref: canvasContainerRef,
|
|
466
474
|
className: styles.videoContainer,
|
|
@@ -471,19 +479,8 @@ var Image360Screen = function Image360Screen(_ref) {
|
|
|
471
479
|
top: resizedImageTop
|
|
472
480
|
}
|
|
473
481
|
}), /*#__PURE__*/React.createElement("div", {
|
|
474
|
-
className: styles.
|
|
475
|
-
}, items))
|
|
476
|
-
background: background,
|
|
477
|
-
width: width,
|
|
478
|
-
height: height,
|
|
479
|
-
resolution: resolution,
|
|
480
|
-
playing: backgroundPlaying,
|
|
481
|
-
muted: muted,
|
|
482
|
-
shouldLoad: mediaShouldLoad,
|
|
483
|
-
mediaRef: mediaRef,
|
|
484
|
-
withoutVideo: isPreview,
|
|
485
|
-
className: styles.background
|
|
486
|
-
}) : null);
|
|
482
|
+
className: styles.content
|
|
483
|
+
}, items)));
|
|
487
484
|
};
|
|
488
485
|
|
|
489
486
|
Image360Screen.propTypes = propTypes;
|
package/lib/index.js
CHANGED
|
@@ -113,7 +113,7 @@ var useThree = function useThree() {
|
|
|
113
113
|
return loadedPackage;
|
|
114
114
|
};
|
|
115
115
|
|
|
116
|
-
var styles = {"container":"micromag-screen-image-360-container","canvasButton":"micromag-screen-image-360-canvasButton","
|
|
116
|
+
var styles = {"container":"micromag-screen-image-360-container","canvasButton":"micromag-screen-image-360-canvasButton","canvas":"micromag-screen-image-360-canvas","content":"micromag-screen-image-360-content","placeholder":"micromag-screen-image-360-placeholder","video":"micromag-screen-image-360-video","disabled":"micromag-screen-image-360-disabled","hidden":"micromag-screen-image-360-hidden","empty":"micromag-screen-image-360-empty","videoContainer":"micromag-screen-image-360-videoContainer","mediaControls":"micromag-screen-image-360-mediaControls","callToAction":"micromag-screen-image-360-callToAction","showVideo":"micromag-screen-image-360-showVideo"};
|
|
117
117
|
|
|
118
118
|
var propTypes = {
|
|
119
119
|
layout: PropTypes__default["default"].oneOf(['full']),
|
|
@@ -493,10 +493,18 @@ var Image360Screen = function Image360Screen(_ref) {
|
|
|
493
493
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
494
494
|
className: classNames__default["default"]([styles.container, (_ref7 = {}, _defineProperty__default["default"](_ref7, className, className !== null), _defineProperty__default["default"](_ref7, styles.showVideo, isPreview || isStatic || isCapture), _ref7)]),
|
|
495
495
|
"data-screen-ready": (isStatic || isCapture) && posterReady || ready
|
|
496
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
496
|
+
}, !isPlaceholder ? /*#__PURE__*/React__default["default"].createElement(Background__default["default"], {
|
|
497
|
+
background: background,
|
|
497
498
|
width: width,
|
|
498
499
|
height: height,
|
|
499
|
-
|
|
500
|
+
resolution: resolution,
|
|
501
|
+
playing: backgroundPlaying,
|
|
502
|
+
muted: muted,
|
|
503
|
+
shouldLoad: mediaShouldLoad,
|
|
504
|
+
mediaRef: mediaRef
|
|
505
|
+
}) : null, /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
|
|
506
|
+
width: width,
|
|
507
|
+
height: height
|
|
500
508
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
501
509
|
ref: canvasContainerRef,
|
|
502
510
|
className: styles.videoContainer,
|
|
@@ -507,19 +515,8 @@ var Image360Screen = function Image360Screen(_ref) {
|
|
|
507
515
|
top: resizedImageTop
|
|
508
516
|
}
|
|
509
517
|
}), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
510
|
-
className: styles.
|
|
511
|
-
}, items))
|
|
512
|
-
background: background,
|
|
513
|
-
width: width,
|
|
514
|
-
height: height,
|
|
515
|
-
resolution: resolution,
|
|
516
|
-
playing: backgroundPlaying,
|
|
517
|
-
muted: muted,
|
|
518
|
-
shouldLoad: mediaShouldLoad,
|
|
519
|
-
mediaRef: mediaRef,
|
|
520
|
-
withoutVideo: isPreview,
|
|
521
|
-
className: styles.background
|
|
522
|
-
}) : null);
|
|
518
|
+
className: styles.content
|
|
519
|
+
}, items)));
|
|
523
520
|
};
|
|
524
521
|
|
|
525
522
|
Image360Screen.propTypes = propTypes;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@micromag/screen-image-360",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.251",
|
|
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.251",
|
|
54
|
+
"@micromag/element-background": "^0.3.251",
|
|
55
|
+
"@micromag/element-call-to-action": "^0.3.251",
|
|
56
|
+
"@micromag/element-closed-captions": "^0.3.251",
|
|
57
|
+
"@micromag/element-container": "^0.3.251",
|
|
58
|
+
"@micromag/element-image": "^0.3.251",
|
|
59
|
+
"@micromag/element-media-controls": "^0.3.251",
|
|
60
|
+
"@micromag/element-video": "^0.3.251",
|
|
61
|
+
"@micromag/transforms": "^0.3.251",
|
|
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": "3b6fb00baaa7f3ab90684a88cbe4c30929b6b27d"
|
|
74
74
|
}
|