js-cloudimage-360-view 3.0.4 → 3.1.1
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/CHANGELOG.md +11 -0
- package/README.md +11 -0
- package/dist/ci360.service.js +65 -245
- package/dist/ci360.utils.js +2 -14
- package/dist/constants/index.js +0 -4
- package/dist/constants/props-require-reload.js +24 -12
- package/dist/index.js +0 -27
- package/dist/utils/auto-play/get-speed-factor.js +0 -2
- package/dist/utils/auto-play/is-completed-one-cycle.js +0 -5
- package/dist/utils/auto-play/loop.js +3 -14
- package/dist/utils/class-names/add-class.js +0 -3
- package/dist/utils/class-names/remove-class.js +0 -2
- package/dist/utils/container-elements/apply-styles-to-container.js +0 -2
- package/dist/utils/container-elements/create-360-view-circle-icon.js +0 -2
- package/dist/utils/container-elements/create-360-view-icon.js +0 -2
- package/dist/utils/container-elements/create-box-shadow.js +0 -2
- package/dist/utils/container-elements/create-canvas.js +0 -2
- package/dist/utils/container-elements/create-close-fullscreen-icon.js +0 -2
- package/dist/utils/container-elements/create-fullscreen-icon.js +0 -2
- package/dist/utils/container-elements/create-fullscreen-modal.js +0 -2
- package/dist/utils/container-elements/create-icons-container.js +0 -2
- package/dist/utils/container-elements/create-inner-box.js +0 -2
- package/dist/utils/container-elements/create-loader.js +0 -2
- package/dist/utils/container-elements/create-magnifier-icon.js +0 -2
- package/dist/utils/container-elements/index.js +0 -13
- package/dist/utils/container-elements/remove-child-from-parent.js +0 -2
- package/dist/utils/controls/get-item-skipped.js +0 -2
- package/dist/utils/controls/init-controls.js +7 -16
- package/dist/utils/hotspots/attach-events/hide-popup.js +0 -2
- package/dist/utils/hotspots/attach-events/show-popup.js +0 -2
- package/dist/utils/hotspots/configs-error-handler.js +6 -10
- package/dist/utils/hotspots/create-popper-instace.js +1 -4
- package/dist/utils/hotspots/elements/create-carousel-dot.js +0 -6
- package/dist/utils/hotspots/elements/create-carousel-image.js +0 -4
- package/dist/utils/hotspots/elements/create-hotspot-icon.js +3 -14
- package/dist/utils/hotspots/elements/create-hotspot-popup-link.js +2 -6
- package/dist/utils/hotspots/elements/create-hotspots.js +0 -5
- package/dist/utils/hotspots/elements/create-images-carousel.js +0 -4
- package/dist/utils/hotspots/elements/create-modal-description.js +0 -2
- package/dist/utils/hotspots/elements/create-modal-title.js +0 -2
- package/dist/utils/hotspots/elements/create-model-elements.js +8 -25
- package/dist/utils/hotspots/elements/create-popup-arrow.js +0 -2
- package/dist/utils/hotspots/elements/create-popup.js +6 -18
- package/dist/utils/hotspots/elements/create-read-more-btn.js +0 -2
- package/dist/utils/hotspots/fill-empty-coord-with-previous.js +1 -6
- package/dist/utils/hotspots/generate-hotspots-configs.js +11 -21
- package/dist/utils/hotspots/generate-popup-config.js +9 -11
- package/dist/utils/hotspots/get-hotspot-icon.js +0 -2
- package/dist/utils/hotspots/get-hotspot-orientation.js +0 -4
- package/dist/utils/hotspots/get-hotspot-popup-node.js +0 -2
- package/dist/utils/hotspots/get-popup-node.js +0 -2
- package/dist/utils/hotspots/hide-hotspot-icon.js +0 -2
- package/dist/utils/hotspots/hide-hotspots-icons.js +0 -3
- package/dist/utils/hotspots/is-mouse-on-hotspot.js +0 -2
- package/dist/utils/hotspots/prepare-hotspots-positions.js +0 -6
- package/dist/utils/hotspots/set-current-slide.js +0 -2
- package/dist/utils/hotspots/toggle-popup-events.js +0 -4
- package/dist/utils/hotspots/update-hotspot-icon-position.js +0 -2
- package/dist/utils/hotspots/update-hotspots.js +6 -14
- package/dist/utils/image-src/generate-images-path.js +8 -17
- package/dist/utils/image-src/is-props-change-require-reload.js +0 -5
- package/dist/utils/index.js +0 -26
- package/dist/utils/load-images/images-from-folder/prepare-images-from-folder.js +2 -11
- package/dist/utils/load-images/images-from-list/prepare-images-from-list.js +0 -8
- package/dist/utils/load-images/lazyload/init-lazyload.js +3 -11
- package/dist/utils/load-images/lazyload/prepare-first-image/prepare-first-image-from-folder.js +1 -5
- package/dist/utils/load-images/lazyload/prepare-first-image/prepare-first-image-from-list.js +0 -9
- package/dist/utils/load-images/load-image-as-promise.js +8 -46
- package/dist/utils/load-images/load-images-relative-to-container-size.js +10 -49
- package/dist/utils/load-images/load-original-images.js +23 -37
- package/dist/utils/load-images/pad.js +0 -2
- package/dist/utils/load-images/preload-images.js +2 -9
- package/dist/utils/load-images/preload-original-images.js +2 -9
- package/dist/utils/magnify/get-current-original-image.js +0 -6
- package/dist/utils/magnify/get-cursor-position.js +0 -2
- package/dist/utils/magnify/magnify.js +4 -11
- package/dist/utils/magnify/move-magnifier.js +6 -14
- package/dist/utils/responsive/contain.js +0 -2
- package/dist/utils/responsive/fit.js +0 -4
- package/dist/utils/responsive/get-image-aspect-ratio.js +0 -8
- package/dist/utils/responsive/get-responsive-width-of-container.js +0 -3
- package/dist/utils/responsive/get-size-according-to-pixel-ratio.js +0 -2
- package/dist/utils/responsive/get-size-limit.js +0 -2
- package/dist/utils/spin-y/get-moving-direction.js +0 -3
- package/dist/utils/zoom/generate-zoom-in-steps.js +0 -2
- package/dist/utils/zoom/generate-zoom-out-steps.js +0 -2
- package/package.json +7 -7
- package/yarn-error.log +27 -6779
|
@@ -4,25 +4,19 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.prepareHotspotsPositions = void 0;
|
|
7
|
-
|
|
8
7
|
var _fillEmptyCoordWithPrevious = require("./fill-empty-coord-with-previous");
|
|
9
|
-
|
|
10
8
|
var prepareHotspotsPositions = function prepareHotspotsPositions(positions) {
|
|
11
9
|
return positions.reduce(function (accumulate, current, currentIndex) {
|
|
12
10
|
var isIncludesXcoord = !!(current !== null && current !== void 0 && current.xCoord);
|
|
13
11
|
var isIncludesYcoord = !!(current !== null && current !== void 0 && current.yCoord);
|
|
14
|
-
|
|
15
12
|
if (!isIncludesXcoord) {
|
|
16
13
|
current.xCoord = (0, _fillEmptyCoordWithPrevious.fillEmptyCoordWithPrevious)(positions, currentIndex, 'xCoord');
|
|
17
14
|
}
|
|
18
|
-
|
|
19
15
|
if (!isIncludesYcoord) {
|
|
20
16
|
current.yCoord = (0, _fillEmptyCoordWithPrevious.fillEmptyCoordWithPrevious)(positions, currentIndex, 'yCoord');
|
|
21
17
|
}
|
|
22
|
-
|
|
23
18
|
accumulate.push(current);
|
|
24
19
|
return accumulate;
|
|
25
20
|
}, []);
|
|
26
21
|
};
|
|
27
|
-
|
|
28
22
|
exports.prepareHotspotsPositions = prepareHotspotsPositions;
|
|
@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.setCurrentSlide = void 0;
|
|
7
|
-
|
|
8
7
|
var setCurrentSlide = function setCurrentSlide(image, imageDot, popup) {
|
|
9
8
|
var activeDotSelector = '[data-active-dot]';
|
|
10
9
|
var activeImageSelector = '[data-active-image]';
|
|
@@ -19,5 +18,4 @@ var setCurrentSlide = function setCurrentSlide(image, imageDot, popup) {
|
|
|
19
18
|
imageDot.className += ' active-dot';
|
|
20
19
|
imageDot.setAttribute('data-active-dot', '');
|
|
21
20
|
};
|
|
22
|
-
|
|
23
21
|
exports.setCurrentSlide = setCurrentSlide;
|
|
@@ -4,11 +4,8 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.togglePopupEvents = void 0;
|
|
7
|
-
|
|
8
7
|
var _ci = require("../../ci360.utils");
|
|
9
|
-
|
|
10
8
|
var _getHotspotIcon = require("./get-hotspot-icon");
|
|
11
|
-
|
|
12
9
|
var togglePopupEvents = function togglePopupEvents(hotspotsProps, event, isMouseDown) {
|
|
13
10
|
var iClickOnHotspotIcon = event && (0, _ci.isTrue)(event.target, 'data-cloudimage-360-hotspot');
|
|
14
11
|
if (iClickOnHotspotIcon) return;
|
|
@@ -19,5 +16,4 @@ var togglePopupEvents = function togglePopupEvents(hotspotsProps, event, isMouse
|
|
|
19
16
|
hotspotIcon.style.pointerEvents = isMouseDown ? 'none' : 'all';
|
|
20
17
|
});
|
|
21
18
|
};
|
|
22
|
-
|
|
23
19
|
exports.togglePopupEvents = togglePopupEvents;
|
|
@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.updateHotspotIconPosition = void 0;
|
|
7
|
-
|
|
8
7
|
var updateHotspotIconPosition = function updateHotspotIconPosition(container, initialDimensions, icon, xCoord, yCoord) {
|
|
9
8
|
icon.style.visibility = 'visible';
|
|
10
9
|
icon.style.opacity = 1;
|
|
@@ -17,5 +16,4 @@ var updateHotspotIconPosition = function updateHotspotIconPosition(container, in
|
|
|
17
16
|
var translateY = "".concat(positionYRatio * yCoord, "px");
|
|
18
17
|
icon.style.transform = "translate3d(".concat(translateX, ", ").concat(translateY, ", 0)");
|
|
19
18
|
};
|
|
20
|
-
|
|
21
19
|
exports.updateHotspotIconPosition = updateHotspotIconPosition;
|
|
@@ -4,26 +4,20 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.updateHotspots = void 0;
|
|
7
|
-
|
|
8
7
|
var _prepareHotspotsPositions = require("./prepare-hotspots-positions");
|
|
9
|
-
|
|
10
8
|
var _getHotspotIcon = require("./get-hotspot-icon");
|
|
11
|
-
|
|
12
9
|
var _updateHotspotIconPosition = require("./update-hotspot-icon-position");
|
|
13
|
-
|
|
14
10
|
var _hideHotspotIcon = require("./hide-hotspot-icon");
|
|
15
|
-
|
|
16
11
|
var _getHotspotOrientation = require("./get-hotspot-orientation");
|
|
17
|
-
|
|
18
12
|
var updateHotspots = function updateHotspots(container, hotspotsProps) {
|
|
19
13
|
var activeImageX = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
|
|
20
14
|
var activeImageY = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
|
|
21
15
|
var movingDirection = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 'x-axis';
|
|
22
16
|
hotspotsProps.forEach(function (hotspotProps) {
|
|
23
17
|
var positions = hotspotProps.positions,
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
18
|
+
initialDimensions = hotspotProps.initialDimensions,
|
|
19
|
+
orientation = hotspotProps.orientation,
|
|
20
|
+
variant = hotspotProps.variant;
|
|
27
21
|
var anchorId = variant.anchorId;
|
|
28
22
|
var hotspotOriantaion = (0, _getHotspotOrientation.getHotspotOriantaion)(movingDirection);
|
|
29
23
|
var currentImageIndex = orientation === 'x' ? activeImageX : activeImageY;
|
|
@@ -32,17 +26,15 @@ var updateHotspots = function updateHotspots(container, hotspotsProps) {
|
|
|
32
26
|
return hotspotPosition.imageIndex === currentImageIndex;
|
|
33
27
|
});
|
|
34
28
|
var hotspotIcon = (0, _getHotspotIcon.getHotspotIcon)(anchorId);
|
|
35
|
-
|
|
36
29
|
if (currentPosition && hotspotOriantaion === orientation) {
|
|
37
30
|
var _currentPosition$xCoo = currentPosition.xCoord,
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
31
|
+
xCoord = _currentPosition$xCoo === void 0 ? 0 : _currentPosition$xCoo,
|
|
32
|
+
_currentPosition$yCoo = currentPosition.yCoord,
|
|
33
|
+
yCoord = _currentPosition$yCoo === void 0 ? 0 : _currentPosition$yCoo;
|
|
41
34
|
(0, _updateHotspotIconPosition.updateHotspotIconPosition)(container, initialDimensions, hotspotIcon, xCoord, yCoord);
|
|
42
35
|
} else {
|
|
43
36
|
(0, _hideHotspotIcon.hideHotspotIcon)(hotspotIcon);
|
|
44
37
|
}
|
|
45
38
|
});
|
|
46
39
|
};
|
|
47
|
-
|
|
48
40
|
exports.updateHotspots = updateHotspots;
|
|
@@ -4,28 +4,21 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.generateImagesPath = void 0;
|
|
7
|
-
|
|
8
7
|
var _falsyValues = require("../../constants/falsy-values");
|
|
9
|
-
|
|
10
8
|
var _getResponsiveWidthOfContainer = require("../responsive/get-responsive-width-of-container");
|
|
11
|
-
|
|
12
9
|
var _getSizeAccordingToPixelRatio = require("../responsive/get-size-according-to-pixel-ratio");
|
|
13
|
-
|
|
14
10
|
var generateImagesPath = function generateImagesPath(srcConfig, loadOriginalImages) {
|
|
15
11
|
var container = srcConfig.container,
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
12
|
+
folder = srcConfig.folder,
|
|
13
|
+
apiVersion = srcConfig.apiVersion,
|
|
14
|
+
_srcConfig$filename = srcConfig.filename,
|
|
15
|
+
filename = _srcConfig$filename === void 0 ? '' : _srcConfig$filename,
|
|
16
|
+
ciParams = srcConfig.ciParams;
|
|
22
17
|
var _ref = ciParams || {},
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
18
|
+
ciToken = _ref.ciToken,
|
|
19
|
+
ciFilters = _ref.ciFilters,
|
|
20
|
+
ciTransformation = _ref.ciTransformation;
|
|
27
21
|
var src = "".concat(folder).concat(filename);
|
|
28
|
-
|
|
29
22
|
if (ciToken) {
|
|
30
23
|
var imageOffsetWidth = container.offsetWidth;
|
|
31
24
|
var version = !(_falsyValues.FALSY_VALUES.indexOf(apiVersion) !== -1) ? apiVersion : null;
|
|
@@ -35,8 +28,6 @@ var generateImagesPath = function generateImagesPath(srcConfig, loadOriginalImag
|
|
|
35
28
|
var cdn = isCloudImageUrl ? src : "https://".concat(ciToken, ".cloudimg.io/").concat(finalApiVersion).concat(src);
|
|
36
29
|
src = "".concat(cdn, "?").concat(ciTransformation || "".concat(!loadOriginalImages ? "width=".concat(ciSizeNext) : '', " ")).concat(ciFilters ? "&f=".concat(ciFilters) : '');
|
|
37
30
|
}
|
|
38
|
-
|
|
39
31
|
return src;
|
|
40
32
|
};
|
|
41
|
-
|
|
42
33
|
exports.generateImagesPath = generateImagesPath;
|
|
@@ -4,20 +4,15 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.isPropsChangeRequireReload = void 0;
|
|
7
|
-
|
|
8
7
|
var _propsRequireReload = require("../../constants/props-require-reload");
|
|
9
|
-
|
|
10
8
|
var isPropsChangeRequireReload = function isPropsChangeRequireReload(currentProps, changedProps) {
|
|
11
9
|
return Object.keys(changedProps).reduce(function (acc, current) {
|
|
12
10
|
var isPropChanged = currentProps[current] !== changedProps[current];
|
|
13
11
|
var isSrcProp = _propsRequireReload.PROPS_REQUIRE_RELOAD.indexOf(current) !== -1;
|
|
14
|
-
|
|
15
12
|
if (isSrcProp && isPropChanged) {
|
|
16
13
|
acc = true;
|
|
17
14
|
}
|
|
18
|
-
|
|
19
15
|
return acc;
|
|
20
16
|
}, false);
|
|
21
17
|
};
|
|
22
|
-
|
|
23
18
|
exports.isPropsChangeRequireReload = isPropsChangeRequireReload;
|
package/dist/utils/index.js
CHANGED
|
@@ -173,47 +173,26 @@ Object.defineProperty(exports, "updateHotspots", {
|
|
|
173
173
|
return _updateHotspots.updateHotspots;
|
|
174
174
|
}
|
|
175
175
|
});
|
|
176
|
-
|
|
177
176
|
var _isPropsChangeRequireReload = require("./image-src/is-props-change-require-reload");
|
|
178
|
-
|
|
179
177
|
var _generateImagesPath = require("./image-src/generate-images-path");
|
|
180
|
-
|
|
181
178
|
var _preloadImages = require("./load-images/preload-images");
|
|
182
|
-
|
|
183
179
|
var _preloadOriginalImages = require("./load-images/preload-original-images");
|
|
184
|
-
|
|
185
180
|
var _initLazyload = require("./load-images/lazyload/init-lazyload");
|
|
186
|
-
|
|
187
181
|
var _contain = require("./responsive/contain");
|
|
188
|
-
|
|
189
182
|
var _getImageAspectRatio = require("./responsive/get-image-aspect-ratio");
|
|
190
|
-
|
|
191
183
|
var _getCurrentOriginalImage = require("./magnify/get-current-original-image");
|
|
192
|
-
|
|
193
184
|
var _magnify = require("./magnify/magnify");
|
|
194
|
-
|
|
195
185
|
var _generateZoomInSteps = require("./zoom/generate-zoom-in-steps");
|
|
196
|
-
|
|
197
186
|
var _generateZoomOutSteps = require("./zoom/generate-zoom-out-steps");
|
|
198
|
-
|
|
199
187
|
var _loop = require("./auto-play/loop");
|
|
200
|
-
|
|
201
188
|
var _getSpeedFactor = require("./auto-play/get-speed-factor");
|
|
202
|
-
|
|
203
189
|
var _isCompletedOneCycle = require("./auto-play/is-completed-one-cycle");
|
|
204
|
-
|
|
205
190
|
var _addClass = require("./class-names/add-class");
|
|
206
|
-
|
|
207
191
|
var _removeClass = require("./class-names/remove-class");
|
|
208
|
-
|
|
209
192
|
var _getMovingDirection = require("./spin-y/get-moving-direction");
|
|
210
|
-
|
|
211
193
|
var _getItemSkipped = require("./controls/get-item-skipped");
|
|
212
|
-
|
|
213
194
|
var _initControls = require("./controls/init-controls");
|
|
214
|
-
|
|
215
195
|
var _containerElements = require("./container-elements");
|
|
216
|
-
|
|
217
196
|
Object.keys(_containerElements).forEach(function (key) {
|
|
218
197
|
if (key === "default" || key === "__esModule") return;
|
|
219
198
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -225,13 +204,8 @@ Object.keys(_containerElements).forEach(function (key) {
|
|
|
225
204
|
}
|
|
226
205
|
});
|
|
227
206
|
});
|
|
228
|
-
|
|
229
207
|
var _updateHotspots = require("./hotspots/update-hotspots");
|
|
230
|
-
|
|
231
208
|
var _createHotspots = require("./hotspots/elements/create-hotspots");
|
|
232
|
-
|
|
233
209
|
var _generateHotspotsConfigs = require("./hotspots/generate-hotspots-configs");
|
|
234
|
-
|
|
235
210
|
var _isMouseOnHotspot = require("./hotspots/is-mouse-on-hotspot");
|
|
236
|
-
|
|
237
211
|
var _hideHotspotsIcons = require("./hotspots/hide-hotspots-icons");
|
|
@@ -1,34 +1,25 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.prepareImagesFromFolder = void 0;
|
|
9
|
-
|
|
10
8
|
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
11
|
-
|
|
12
9
|
var _regex = require("../../../constants/regex");
|
|
13
|
-
|
|
14
10
|
var _pad = require("../pad");
|
|
15
|
-
|
|
16
11
|
var prepareImagesFromFolder = function prepareImagesFromFolder(imagesSrc, srcConfig, loadOriginalImages) {
|
|
17
12
|
var _ref = srcConfig || {},
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
13
|
+
amount = _ref.amount,
|
|
14
|
+
indexZeroBase = _ref.indexZeroBase;
|
|
21
15
|
return (0, _toConsumableArray2.default)(new Array(amount)).map(function (_item, index) {
|
|
22
16
|
var nextZeroFilledIndex = (0, _pad.pad)(index + 1, indexZeroBase);
|
|
23
17
|
var imageSrc = imagesSrc.replace('{index}', nextZeroFilledIndex);
|
|
24
|
-
|
|
25
18
|
if (loadOriginalImages) {
|
|
26
19
|
var imageOriginalSrc = imageSrc.replace(_regex.ORGINAL_SIZE_REGEX, '').replace(_regex.AND_SYMBOL_REGEX, '?');
|
|
27
20
|
return imageOriginalSrc;
|
|
28
21
|
}
|
|
29
|
-
|
|
30
22
|
return imageSrc;
|
|
31
23
|
});
|
|
32
24
|
};
|
|
33
|
-
|
|
34
25
|
exports.prepareImagesFromFolder = prepareImagesFromFolder;
|
|
@@ -1,29 +1,21 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.prepareImagesFromList = void 0;
|
|
9
|
-
|
|
10
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
11
|
-
|
|
12
9
|
var _generateImagesPath = require("../../image-src/generate-images-path");
|
|
13
|
-
|
|
14
10
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
15
|
-
|
|
16
11
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
17
|
-
|
|
18
12
|
var prepareImagesFromList = function prepareImagesFromList(images, srcConfig, loadOriginalImages) {
|
|
19
13
|
var folder = srcConfig.folder;
|
|
20
14
|
return images.map(function (src) {
|
|
21
15
|
var nextSrcConfig = _objectSpread({}, srcConfig);
|
|
22
|
-
|
|
23
16
|
nextSrcConfig.folder = /(http(s?)):\/\//gi.test(src) ? '' : folder;
|
|
24
17
|
nextSrcConfig.filename = src;
|
|
25
18
|
return (0, _generateImagesPath.generateImagesPath)(nextSrcConfig, loadOriginalImages);
|
|
26
19
|
});
|
|
27
20
|
};
|
|
28
|
-
|
|
29
21
|
exports.prepareImagesFromList = prepareImagesFromList;
|
|
@@ -4,19 +4,14 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.initLazyload = void 0;
|
|
7
|
-
|
|
8
7
|
var _prepareFirstImageFromFolder = require("./prepare-first-image/prepare-first-image-from-folder");
|
|
9
|
-
|
|
10
8
|
var _prepareFirstImageFromList = require("./prepare-first-image/prepare-first-image-from-list");
|
|
11
|
-
|
|
12
9
|
var initLazyload = function initLazyload(imagesSrc, srcConfig, cb) {
|
|
13
10
|
var _ref = srcConfig || {},
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
11
|
+
imageList = _ref.imageList,
|
|
12
|
+
lazySelector = _ref.lazySelector,
|
|
13
|
+
innerBox = _ref.innerBox;
|
|
18
14
|
var firstImageSrc;
|
|
19
|
-
|
|
20
15
|
if (imageList) {
|
|
21
16
|
try {
|
|
22
17
|
var images = JSON.parse(imageList);
|
|
@@ -27,7 +22,6 @@ var initLazyload = function initLazyload(imagesSrc, srcConfig, cb) {
|
|
|
27
22
|
} else {
|
|
28
23
|
firstImageSrc = (0, _prepareFirstImageFromFolder.prepareFirstImageFromFolder)(imagesSrc, srcConfig);
|
|
29
24
|
}
|
|
30
|
-
|
|
31
25
|
var image = new Image();
|
|
32
26
|
image.setAttribute('data-src', firstImageSrc);
|
|
33
27
|
image.style.position = 'absolute';
|
|
@@ -38,12 +32,10 @@ var initLazyload = function initLazyload(imagesSrc, srcConfig, cb) {
|
|
|
38
32
|
image.style.maxHeight = '100%';
|
|
39
33
|
if (lazySelector) image.className = lazySelector;
|
|
40
34
|
innerBox.appendChild(image);
|
|
41
|
-
|
|
42
35
|
if (cb) {
|
|
43
36
|
image.onload = function () {
|
|
44
37
|
return cb(image);
|
|
45
38
|
};
|
|
46
39
|
}
|
|
47
40
|
};
|
|
48
|
-
|
|
49
41
|
exports.initLazyload = initLazyload;
|
package/dist/utils/load-images/lazyload/prepare-first-image/prepare-first-image-from-folder.js
CHANGED
|
@@ -4,15 +4,11 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.prepareFirstImageFromFolder = void 0;
|
|
7
|
-
|
|
8
7
|
var _pad = require("../../pad");
|
|
9
|
-
|
|
10
8
|
var prepareFirstImageFromFolder = function prepareFirstImageFromFolder(imagesSrcs, srcConfig) {
|
|
11
9
|
var _ref = srcConfig || {},
|
|
12
|
-
|
|
13
|
-
|
|
10
|
+
indexZeroBase = _ref.indexZeroBase;
|
|
14
11
|
var nextZeroFilledIndex = (0, _pad.pad)(1, indexZeroBase);
|
|
15
12
|
return imagesSrcs.replace('{index}', nextZeroFilledIndex);
|
|
16
13
|
};
|
|
17
|
-
|
|
18
14
|
exports.prepareFirstImageFromFolder = prepareFirstImageFromFolder;
|
package/dist/utils/load-images/lazyload/prepare-first-image/prepare-first-image-from-list.js
CHANGED
|
@@ -1,29 +1,20 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.prepareFirstImageFromList = void 0;
|
|
9
|
-
|
|
10
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
11
|
-
|
|
12
9
|
var _generateImagesPath = require("../../../image-src/generate-images-path");
|
|
13
|
-
|
|
14
10
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
15
|
-
|
|
16
11
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
17
|
-
|
|
18
12
|
var prepareFirstImageFromList = function prepareFirstImageFromList(images, srcConfig) {
|
|
19
13
|
var folder = srcConfig.folder;
|
|
20
14
|
var firstImageSrc = images[0];
|
|
21
|
-
|
|
22
15
|
var nextSrcConfig = _objectSpread({}, srcConfig);
|
|
23
|
-
|
|
24
16
|
nextSrcConfig.folder = /(http(s?)):\/\//gi.test(firstImageSrc) ? '' : folder;
|
|
25
17
|
nextSrcConfig.filename = firstImageSrc;
|
|
26
18
|
return (0, _generateImagesPath.generateImagesPath)(nextSrcConfig);
|
|
27
19
|
};
|
|
28
|
-
|
|
29
20
|
exports.prepareFirstImageFromList = prepareFirstImageFromList;
|
|
@@ -1,54 +1,16 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
3
|
Object.defineProperty(exports, "__esModule", {
|
|
6
4
|
value: true
|
|
7
5
|
});
|
|
8
6
|
exports.loadImageAsPromise = void 0;
|
|
9
|
-
|
|
10
|
-
var
|
|
11
|
-
|
|
12
|
-
var
|
|
13
|
-
|
|
14
|
-
var loadImageAsPromise = /*#__PURE__*/function () {
|
|
15
|
-
var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(src, index, cb) {
|
|
16
|
-
var image;
|
|
17
|
-
return _regenerator.default.wrap(function _callee$(_context) {
|
|
18
|
-
while (1) {
|
|
19
|
-
switch (_context.prev = _context.next) {
|
|
20
|
-
case 0:
|
|
21
|
-
image = new Image();
|
|
22
|
-
image.src = src;
|
|
23
|
-
return _context.abrupt("return", new Promise(function (reslove) {
|
|
24
|
-
image.onload = function () {
|
|
25
|
-
reslove(image);
|
|
26
|
-
|
|
27
|
-
if (cb) {
|
|
28
|
-
cb(image, index);
|
|
29
|
-
}
|
|
30
|
-
};
|
|
31
|
-
|
|
32
|
-
image.onerror = function () {
|
|
33
|
-
reslove(image);
|
|
34
|
-
|
|
35
|
-
if (cb) {
|
|
36
|
-
cb(image, index);
|
|
37
|
-
}
|
|
38
|
-
};
|
|
39
|
-
}));
|
|
40
|
-
|
|
41
|
-
case 3:
|
|
42
|
-
case "end":
|
|
43
|
-
return _context.stop();
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
}, _callee);
|
|
47
|
-
}));
|
|
48
|
-
|
|
49
|
-
return function loadImageAsPromise(_x, _x2, _x3) {
|
|
50
|
-
return _ref.apply(this, arguments);
|
|
7
|
+
var loadImageAsPromise = function loadImageAsPromise(src, cb) {
|
|
8
|
+
var image = new Image();
|
|
9
|
+
image.src = src;
|
|
10
|
+
var onImageLoad = function onImageLoad() {
|
|
11
|
+
return cb(image);
|
|
51
12
|
};
|
|
52
|
-
|
|
53
|
-
|
|
13
|
+
image.onload = onImageLoad;
|
|
14
|
+
image.onerror = onImageLoad;
|
|
15
|
+
};
|
|
54
16
|
exports.loadImageAsPromise = loadImageAsPromise;
|
|
@@ -1,58 +1,19 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
3
|
Object.defineProperty(exports, "__esModule", {
|
|
6
4
|
value: true
|
|
7
5
|
});
|
|
8
6
|
exports.loadImagesRelativeToContainerSize = void 0;
|
|
9
|
-
|
|
10
|
-
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
|
|
11
|
-
|
|
12
|
-
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
|
|
13
|
-
|
|
14
7
|
var _loadImageAsPromise = require("./load-image-as-promise");
|
|
15
|
-
|
|
16
|
-
var
|
|
17
|
-
var
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
return Promise.all(imagesSrcs.map( /*#__PURE__*/function () {
|
|
24
|
-
var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(src, index) {
|
|
25
|
-
return _regenerator.default.wrap(function _callee$(_context) {
|
|
26
|
-
while (1) {
|
|
27
|
-
switch (_context.prev = _context.next) {
|
|
28
|
-
case 0:
|
|
29
|
-
_context.next = 2;
|
|
30
|
-
return (0, _loadImageAsPromise.loadImageAsPromise)(src, index, cb);
|
|
31
|
-
|
|
32
|
-
case 2:
|
|
33
|
-
case "end":
|
|
34
|
-
return _context.stop();
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
}, _callee);
|
|
38
|
-
}));
|
|
39
|
-
|
|
40
|
-
return function (_x3, _x4) {
|
|
41
|
-
return _ref2.apply(this, arguments);
|
|
42
|
-
};
|
|
43
|
-
}()));
|
|
44
|
-
|
|
45
|
-
case 2:
|
|
46
|
-
case "end":
|
|
47
|
-
return _context2.stop();
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
}, _callee2);
|
|
51
|
-
}));
|
|
52
|
-
|
|
53
|
-
return function loadImagesRelativeToContainerSize(_x, _x2) {
|
|
54
|
-
return _ref.apply(this, arguments);
|
|
8
|
+
var loadImagesRelativeToContainerSize = function loadImagesRelativeToContainerSize(imagesSrcs, cb) {
|
|
9
|
+
var index = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
|
|
10
|
+
var imageSrc = imagesSrcs[index];
|
|
11
|
+
if (index > imagesSrcs.length - 1) return;
|
|
12
|
+
var imageLoadCallback = function imageLoadCallback(image) {
|
|
13
|
+
var _index = index + 1;
|
|
14
|
+
cb(image, index);
|
|
15
|
+
loadImagesRelativeToContainerSize(imagesSrcs, cb, _index);
|
|
55
16
|
};
|
|
56
|
-
|
|
57
|
-
|
|
17
|
+
(0, _loadImageAsPromise.loadImageAsPromise)(imageSrc, imageLoadCallback);
|
|
18
|
+
};
|
|
58
19
|
exports.loadImagesRelativeToContainerSize = loadImagesRelativeToContainerSize;
|
|
@@ -1,58 +1,44 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.loadOriginalImages = void 0;
|
|
9
|
-
|
|
10
8
|
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
|
|
11
|
-
|
|
12
9
|
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
|
|
13
|
-
|
|
14
10
|
var _loadImageAsPromise = require("./load-image-as-promise");
|
|
15
|
-
|
|
16
11
|
var loadOriginalImages = /*#__PURE__*/function () {
|
|
17
12
|
var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(imagesSrcs, cb) {
|
|
18
13
|
return _regenerator.default.wrap(function _callee2$(_context2) {
|
|
19
|
-
while (1) {
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
};
|
|
43
|
-
}()));
|
|
44
|
-
|
|
45
|
-
case 2:
|
|
46
|
-
case "end":
|
|
47
|
-
return _context2.stop();
|
|
48
|
-
}
|
|
14
|
+
while (1) switch (_context2.prev = _context2.next) {
|
|
15
|
+
case 0:
|
|
16
|
+
_context2.next = 2;
|
|
17
|
+
return Promise.all(imagesSrcs.map( /*#__PURE__*/function () {
|
|
18
|
+
var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(src, index) {
|
|
19
|
+
return _regenerator.default.wrap(function _callee$(_context) {
|
|
20
|
+
while (1) switch (_context.prev = _context.next) {
|
|
21
|
+
case 0:
|
|
22
|
+
_context.next = 2;
|
|
23
|
+
return (0, _loadImageAsPromise.loadImageAsPromise)(src, index, cb);
|
|
24
|
+
case 2:
|
|
25
|
+
case "end":
|
|
26
|
+
return _context.stop();
|
|
27
|
+
}
|
|
28
|
+
}, _callee);
|
|
29
|
+
}));
|
|
30
|
+
return function (_x3, _x4) {
|
|
31
|
+
return _ref2.apply(this, arguments);
|
|
32
|
+
};
|
|
33
|
+
}()));
|
|
34
|
+
case 2:
|
|
35
|
+
case "end":
|
|
36
|
+
return _context2.stop();
|
|
49
37
|
}
|
|
50
38
|
}, _callee2);
|
|
51
39
|
}));
|
|
52
|
-
|
|
53
40
|
return function loadOriginalImages(_x, _x2) {
|
|
54
41
|
return _ref.apply(this, arguments);
|
|
55
42
|
};
|
|
56
43
|
}();
|
|
57
|
-
|
|
58
44
|
exports.loadOriginalImages = loadOriginalImages;
|
|
@@ -4,11 +4,9 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.pad = void 0;
|
|
7
|
-
|
|
8
7
|
var pad = function pad(n) {
|
|
9
8
|
var width = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
10
9
|
n += '';
|
|
11
10
|
return n.length >= width ? n : new Array(width - n.length + 1).join('0') + n;
|
|
12
11
|
};
|
|
13
|
-
|
|
14
12
|
exports.pad = pad;
|