@micromag/screen-image-360 0.3.251 → 0.3.262

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/assets/css/styles.css +1 -1
  2. package/es/index.js +16 -13
  3. package/lib/index.js +16 -13
  4. 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-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}
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-background,.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-inner,.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}.micromag-screen-image-360-container .micromag-screen-image-360-background{z-index:0}.micromag-screen-image-360-container .micromag-screen-image-360-content{z-index:1}.micromag-screen-image-360-container .micromag-screen-image-360-empty{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","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"};
80
+ var styles = {"container":"micromag-screen-image-360-container","canvasButton":"micromag-screen-image-360-canvasButton","background":"micromag-screen-image-360-background","canvas":"micromag-screen-image-360-canvas","inner":"micromag-screen-image-360-inner","placeholder":"micromag-screen-image-360-placeholder","video":"micromag-screen-image-360-video","disabled":"micromag-screen-image-360-disabled","hidden":"micromag-screen-image-360-hidden","content":"micromag-screen-image-360-content","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,18 +457,10 @@ 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
- }, !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
461
- background: background,
460
+ }, /*#__PURE__*/React.createElement(Container, {
462
461
  width: width,
463
462
  height: height,
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
463
+ className: styles.content
472
464
  }, /*#__PURE__*/React.createElement("div", {
473
465
  ref: canvasContainerRef,
474
466
  className: styles.videoContainer,
@@ -479,8 +471,19 @@ var Image360Screen = function Image360Screen(_ref) {
479
471
  top: resizedImageTop
480
472
  }
481
473
  }), /*#__PURE__*/React.createElement("div", {
482
- className: styles.content
483
- }, items)));
474
+ className: styles.inner
475
+ }, items)), !isPlaceholder ? /*#__PURE__*/React.createElement(Background, {
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);
484
487
  };
485
488
 
486
489
  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","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"};
116
+ var styles = {"container":"micromag-screen-image-360-container","canvasButton":"micromag-screen-image-360-canvasButton","background":"micromag-screen-image-360-background","canvas":"micromag-screen-image-360-canvas","inner":"micromag-screen-image-360-inner","placeholder":"micromag-screen-image-360-placeholder","video":"micromag-screen-image-360-video","disabled":"micromag-screen-image-360-disabled","hidden":"micromag-screen-image-360-hidden","content":"micromag-screen-image-360-content","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,18 +493,10 @@ 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
- }, !isPlaceholder ? /*#__PURE__*/React__default["default"].createElement(Background__default["default"], {
497
- background: background,
496
+ }, /*#__PURE__*/React__default["default"].createElement(Container__default["default"], {
498
497
  width: width,
499
498
  height: height,
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
499
+ className: styles.content
508
500
  }, /*#__PURE__*/React__default["default"].createElement("div", {
509
501
  ref: canvasContainerRef,
510
502
  className: styles.videoContainer,
@@ -515,8 +507,19 @@ var Image360Screen = function Image360Screen(_ref) {
515
507
  top: resizedImageTop
516
508
  }
517
509
  }), /*#__PURE__*/React__default["default"].createElement("div", {
518
- className: styles.content
519
- }, items)));
510
+ className: styles.inner
511
+ }, items)), !isPlaceholder ? /*#__PURE__*/React__default["default"].createElement(Background__default["default"], {
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);
520
523
  };
521
524
 
522
525
  Image360Screen.propTypes = propTypes;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/screen-image-360",
3
- "version": "0.3.251",
3
+ "version": "0.3.262",
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.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",
53
+ "@micromag/core": "^0.3.262",
54
+ "@micromag/element-background": "^0.3.262",
55
+ "@micromag/element-call-to-action": "^0.3.262",
56
+ "@micromag/element-closed-captions": "^0.3.262",
57
+ "@micromag/element-container": "^0.3.262",
58
+ "@micromag/element-image": "^0.3.262",
59
+ "@micromag/element-media-controls": "^0.3.262",
60
+ "@micromag/element-video": "^0.3.262",
61
+ "@micromag/transforms": "^0.3.262",
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": "3b6fb00baaa7f3ab90684a88cbe4c30929b6b27d"
73
+ "gitHead": "2299eaeb150cfdd14b4da321bf9089ab1e6383c2"
74
74
  }