@fonixtree/magic-design 1.0.136 → 1.0.137
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/es/composite-comp/dito/components/SlideImage/pc/components/CardItem/index.js +1 -0
- package/es/composite-comp/dito/components/SlideImage/pc/components/CardItem/index.less +4 -0
- package/es/composite-comp/dito/components/SlideImage/pc/components/VideoItem/index.js +16 -6
- package/es/composite-comp/dito/components/SlideImage/pc/components/VideoItem/index.less +13 -9
- package/es/core/Renderer/index.js +1 -0
- package/es/decorator/compositeDecorator.js +1 -1
- package/lib/composite-comp/dito/components/SlideImage/pc/components/CardItem/index.js +1 -0
- package/lib/composite-comp/dito/components/SlideImage/pc/components/CardItem/index.less +4 -0
- package/lib/composite-comp/dito/components/SlideImage/pc/components/VideoItem/index.js +16 -6
- package/lib/composite-comp/dito/components/SlideImage/pc/components/VideoItem/index.less +13 -9
- package/lib/core/Renderer/index.js +1 -0
- package/lib/decorator/compositeDecorator.js +1 -1
- package/package.json +1 -1
|
@@ -85,6 +85,7 @@ function (_super) {
|
|
|
85
85
|
}, rest), /*#__PURE__*/_react["default"].createElement(_VideoItem["default"], {
|
|
86
86
|
data: data
|
|
87
87
|
}), data.groupName.open && /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
|
|
88
|
+
className: "img-text",
|
|
88
89
|
data: data.groupName
|
|
89
90
|
})));
|
|
90
91
|
};
|
|
@@ -7,7 +7,7 @@ exports["default"] = void 0;
|
|
|
7
7
|
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
|
|
10
|
-
var
|
|
10
|
+
var _classnames = _interopRequireDefault(require("classnames"));
|
|
11
11
|
|
|
12
12
|
require("./index.less");
|
|
13
13
|
|
|
@@ -53,6 +53,10 @@ function (_super) {
|
|
|
53
53
|
_this.videoRef = /*#__PURE__*/_react["default"].createRef();
|
|
54
54
|
|
|
55
55
|
_this.onMouseEnter = function () {
|
|
56
|
+
var _a;
|
|
57
|
+
|
|
58
|
+
if (!((_a = _this.props.data.video) === null || _a === void 0 ? void 0 : _a.sourceUrl)) return;
|
|
59
|
+
|
|
56
60
|
_this.videoRef.current.play();
|
|
57
61
|
|
|
58
62
|
_this.setState({
|
|
@@ -61,6 +65,10 @@ function (_super) {
|
|
|
61
65
|
};
|
|
62
66
|
|
|
63
67
|
_this.onMouseLeave = function () {
|
|
68
|
+
var _a;
|
|
69
|
+
|
|
70
|
+
if (!((_a = _this.props.data.video) === null || _a === void 0 ? void 0 : _a.sourceUrl)) return;
|
|
71
|
+
|
|
64
72
|
_this.videoRef.current.pause();
|
|
65
73
|
|
|
66
74
|
_this.setState({
|
|
@@ -72,7 +80,7 @@ function (_super) {
|
|
|
72
80
|
}
|
|
73
81
|
|
|
74
82
|
VideoItem.prototype.render = function () {
|
|
75
|
-
var _a, _b, _c, _d, _e;
|
|
83
|
+
var _a, _b, _c, _d, _e, _f;
|
|
76
84
|
|
|
77
85
|
var data = this.props.data;
|
|
78
86
|
var playing = this.state.playing;
|
|
@@ -88,10 +96,12 @@ function (_super) {
|
|
|
88
96
|
}, /*#__PURE__*/_react["default"].createElement("source", {
|
|
89
97
|
src: (_b = data.video) === null || _b === void 0 ? void 0 : _b.sourceUrl,
|
|
90
98
|
type: "video/mp4"
|
|
91
|
-
})), ((_c = data.overilay) === null || _c === void 0 ? void 0 : _c.open) && /*#__PURE__*/_react["default"].createElement(
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
99
|
+
})), ((_c = data.overilay) === null || _c === void 0 ? void 0 : _c.open) && /*#__PURE__*/_react["default"].createElement("img", {
|
|
100
|
+
alt: "",
|
|
101
|
+
className: (0, _classnames["default"])('video-img', {
|
|
102
|
+
cover: (_d = data.video) === null || _d === void 0 ? void 0 : _d.sourceUrl
|
|
103
|
+
}),
|
|
104
|
+
src: (_f = (_e = data.overilay) === null || _e === void 0 ? void 0 : _e.content) === null || _f === void 0 ? void 0 : _f.pcImgSrc,
|
|
95
105
|
style: {
|
|
96
106
|
visibility: playing ? 'hidden' : 'visible'
|
|
97
107
|
}
|
|
@@ -6,15 +6,19 @@
|
|
|
6
6
|
width: 100%;
|
|
7
7
|
}
|
|
8
8
|
|
|
9
|
-
.video-
|
|
10
|
-
position: absolute;
|
|
11
|
-
top: 0;
|
|
12
|
-
right: 0;
|
|
13
|
-
left: 0;
|
|
14
|
-
bottom: 0;
|
|
15
|
-
object-fit: cover;
|
|
9
|
+
.video-img {
|
|
16
10
|
width: 100%;
|
|
17
|
-
|
|
18
|
-
|
|
11
|
+
|
|
12
|
+
&.cover {
|
|
13
|
+
position: absolute;
|
|
14
|
+
top: 0;
|
|
15
|
+
right: 0;
|
|
16
|
+
left: 0;
|
|
17
|
+
bottom: 0;
|
|
18
|
+
object-fit: cover;
|
|
19
|
+
width: 100%;
|
|
20
|
+
height: 100%;
|
|
21
|
+
z-index: 0;
|
|
22
|
+
}
|
|
19
23
|
}
|
|
20
24
|
}
|
|
@@ -46,6 +46,7 @@ var setDesignConfig = function setDesignConfig(props) {
|
|
|
46
46
|
device = props.device,
|
|
47
47
|
isPreview = props.isPreview,
|
|
48
48
|
projectCode = props.projectCode;
|
|
49
|
+
console.log('window.magicDesign', props);
|
|
49
50
|
window.magicDesign = __assign(__assign({
|
|
50
51
|
pageBackground: '#f2f2f2',
|
|
51
52
|
mode: 'renderer',
|
|
@@ -144,7 +144,7 @@ function compositeDecorator(WrappedComponent) {
|
|
|
144
144
|
var zIndex = '0';
|
|
145
145
|
var position = 'relative';
|
|
146
146
|
|
|
147
|
-
if (nodeData.type === 'CAROUSEL' || nodeData.type === 'IMAGE_GALLERY') {
|
|
147
|
+
if (nodeData.type === 'CAROUSEL' || nodeData.type === 'IMAGE_GALLERY' || nodeData.type === 'SLIDE_IMAGE') {
|
|
148
148
|
zIndex = '1';
|
|
149
149
|
} // 解决pc导航hover上去,类目被下面组件遮罩的问题
|
|
150
150
|
|
|
@@ -85,6 +85,7 @@ function (_super) {
|
|
|
85
85
|
}, rest), /*#__PURE__*/_react["default"].createElement(_VideoItem["default"], {
|
|
86
86
|
data: data
|
|
87
87
|
}), data.groupName.open && /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
|
|
88
|
+
className: "img-text",
|
|
88
89
|
data: data.groupName
|
|
89
90
|
})));
|
|
90
91
|
};
|
|
@@ -7,7 +7,7 @@ exports["default"] = void 0;
|
|
|
7
7
|
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
|
|
10
|
-
var
|
|
10
|
+
var _classnames = _interopRequireDefault(require("classnames"));
|
|
11
11
|
|
|
12
12
|
require("./index.less");
|
|
13
13
|
|
|
@@ -53,6 +53,10 @@ function (_super) {
|
|
|
53
53
|
_this.videoRef = /*#__PURE__*/_react["default"].createRef();
|
|
54
54
|
|
|
55
55
|
_this.onMouseEnter = function () {
|
|
56
|
+
var _a;
|
|
57
|
+
|
|
58
|
+
if (!((_a = _this.props.data.video) === null || _a === void 0 ? void 0 : _a.sourceUrl)) return;
|
|
59
|
+
|
|
56
60
|
_this.videoRef.current.play();
|
|
57
61
|
|
|
58
62
|
_this.setState({
|
|
@@ -61,6 +65,10 @@ function (_super) {
|
|
|
61
65
|
};
|
|
62
66
|
|
|
63
67
|
_this.onMouseLeave = function () {
|
|
68
|
+
var _a;
|
|
69
|
+
|
|
70
|
+
if (!((_a = _this.props.data.video) === null || _a === void 0 ? void 0 : _a.sourceUrl)) return;
|
|
71
|
+
|
|
64
72
|
_this.videoRef.current.pause();
|
|
65
73
|
|
|
66
74
|
_this.setState({
|
|
@@ -72,7 +80,7 @@ function (_super) {
|
|
|
72
80
|
}
|
|
73
81
|
|
|
74
82
|
VideoItem.prototype.render = function () {
|
|
75
|
-
var _a, _b, _c, _d, _e;
|
|
83
|
+
var _a, _b, _c, _d, _e, _f;
|
|
76
84
|
|
|
77
85
|
var data = this.props.data;
|
|
78
86
|
var playing = this.state.playing;
|
|
@@ -88,10 +96,12 @@ function (_super) {
|
|
|
88
96
|
}, /*#__PURE__*/_react["default"].createElement("source", {
|
|
89
97
|
src: (_b = data.video) === null || _b === void 0 ? void 0 : _b.sourceUrl,
|
|
90
98
|
type: "video/mp4"
|
|
91
|
-
})), ((_c = data.overilay) === null || _c === void 0 ? void 0 : _c.open) && /*#__PURE__*/_react["default"].createElement(
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
99
|
+
})), ((_c = data.overilay) === null || _c === void 0 ? void 0 : _c.open) && /*#__PURE__*/_react["default"].createElement("img", {
|
|
100
|
+
alt: "",
|
|
101
|
+
className: (0, _classnames["default"])('video-img', {
|
|
102
|
+
cover: (_d = data.video) === null || _d === void 0 ? void 0 : _d.sourceUrl
|
|
103
|
+
}),
|
|
104
|
+
src: (_f = (_e = data.overilay) === null || _e === void 0 ? void 0 : _e.content) === null || _f === void 0 ? void 0 : _f.pcImgSrc,
|
|
95
105
|
style: {
|
|
96
106
|
visibility: playing ? 'hidden' : 'visible'
|
|
97
107
|
}
|
|
@@ -6,15 +6,19 @@
|
|
|
6
6
|
width: 100%;
|
|
7
7
|
}
|
|
8
8
|
|
|
9
|
-
.video-
|
|
10
|
-
position: absolute;
|
|
11
|
-
top: 0;
|
|
12
|
-
right: 0;
|
|
13
|
-
left: 0;
|
|
14
|
-
bottom: 0;
|
|
15
|
-
object-fit: cover;
|
|
9
|
+
.video-img {
|
|
16
10
|
width: 100%;
|
|
17
|
-
|
|
18
|
-
|
|
11
|
+
|
|
12
|
+
&.cover {
|
|
13
|
+
position: absolute;
|
|
14
|
+
top: 0;
|
|
15
|
+
right: 0;
|
|
16
|
+
left: 0;
|
|
17
|
+
bottom: 0;
|
|
18
|
+
object-fit: cover;
|
|
19
|
+
width: 100%;
|
|
20
|
+
height: 100%;
|
|
21
|
+
z-index: 0;
|
|
22
|
+
}
|
|
19
23
|
}
|
|
20
24
|
}
|
|
@@ -46,6 +46,7 @@ var setDesignConfig = function setDesignConfig(props) {
|
|
|
46
46
|
device = props.device,
|
|
47
47
|
isPreview = props.isPreview,
|
|
48
48
|
projectCode = props.projectCode;
|
|
49
|
+
console.log('window.magicDesign', props);
|
|
49
50
|
window.magicDesign = __assign(__assign({
|
|
50
51
|
pageBackground: '#f2f2f2',
|
|
51
52
|
mode: 'renderer',
|
|
@@ -144,7 +144,7 @@ function compositeDecorator(WrappedComponent) {
|
|
|
144
144
|
var zIndex = '0';
|
|
145
145
|
var position = 'relative';
|
|
146
146
|
|
|
147
|
-
if (nodeData.type === 'CAROUSEL' || nodeData.type === 'IMAGE_GALLERY') {
|
|
147
|
+
if (nodeData.type === 'CAROUSEL' || nodeData.type === 'IMAGE_GALLERY' || nodeData.type === 'SLIDE_IMAGE') {
|
|
148
148
|
zIndex = '1';
|
|
149
149
|
} // 解决pc导航hover上去,类目被下面组件遮罩的问题
|
|
150
150
|
|