apxor-rtm-ui 0.6.1 → 0.7.0
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/dist/apxor.rtm.js.bak +1806 -147
- package/dist/apxor.rtm.min.js +4 -4
- package/package.json +1 -1
package/dist/apxor.rtm.js.bak
CHANGED
|
@@ -6404,6 +6404,14 @@
|
|
|
6404
6404
|
"align-self": "alignSelf",
|
|
6405
6405
|
width: "width"
|
|
6406
6406
|
};
|
|
6407
|
+
var imgWrapperStylesForStories = {
|
|
6408
|
+
"margin-left": "marginLeft",
|
|
6409
|
+
"margin-right": "marginRight",
|
|
6410
|
+
"margin-top": "marginTop",
|
|
6411
|
+
"margin-bottom": "marginBottom",
|
|
6412
|
+
"align-self": "alignSelf",
|
|
6413
|
+
width: "width"
|
|
6414
|
+
};
|
|
6407
6415
|
var DIRECTION = {
|
|
6408
6416
|
HORIZONTAL: "horizontal",
|
|
6409
6417
|
VERTICAL: "vertical"
|
|
@@ -6437,7 +6445,7 @@
|
|
|
6437
6445
|
var EMBED_CARD_TYPE = {
|
|
6438
6446
|
cell: "div",
|
|
6439
6447
|
img: "img",
|
|
6440
|
-
text: "
|
|
6448
|
+
text: "span",
|
|
6441
6449
|
button: "button"
|
|
6442
6450
|
};
|
|
6443
6451
|
|
|
@@ -6570,6 +6578,15 @@
|
|
|
6570
6578
|
return ["".concat(font_family, ", ").concat(fallbackFont), font_face];
|
|
6571
6579
|
};
|
|
6572
6580
|
|
|
6581
|
+
/**
|
|
6582
|
+
* @function getFileExtension
|
|
6583
|
+
* @param {*} filename takes image or video url and returns extension
|
|
6584
|
+
* @returns extension (jpg ,png etc)
|
|
6585
|
+
*/
|
|
6586
|
+
function getFileExtension(filename) {
|
|
6587
|
+
return filename.slice((filename.lastIndexOf(".") - 1 >>> 0) + 2);
|
|
6588
|
+
}
|
|
6589
|
+
|
|
6573
6590
|
/**
|
|
6574
6591
|
* @function createNewTextElement
|
|
6575
6592
|
* @description Creates a text element for the given text config. It could either be a title or a description.
|
|
@@ -11660,8 +11677,8 @@
|
|
|
11660
11677
|
var _this = this,
|
|
11661
11678
|
_config$termination;
|
|
11662
11679
|
_classCallCheck(this, TemplateContent);
|
|
11663
|
-
_defineProperty(this, "
|
|
11664
|
-
var element = _this.
|
|
11680
|
+
_defineProperty(this, "icGM", function () {
|
|
11681
|
+
var element = _this.rjYg(_this.layout);
|
|
11665
11682
|
//document.body.appendChild(element);
|
|
11666
11683
|
var tooltipStyles = document.createElement("style");
|
|
11667
11684
|
tooltipStyles.innerHTML = _this.initialStyles;
|
|
@@ -11677,7 +11694,7 @@
|
|
|
11677
11694
|
}
|
|
11678
11695
|
return element;
|
|
11679
11696
|
});
|
|
11680
|
-
_defineProperty(this, "
|
|
11697
|
+
_defineProperty(this, "rjYg", function (config) {
|
|
11681
11698
|
var _window$Apxor;
|
|
11682
11699
|
var element;
|
|
11683
11700
|
switch (config.type) {
|
|
@@ -11808,7 +11825,7 @@
|
|
|
11808
11825
|
if (config.absolute_position_children && config.absolute_position_children.length > 0) {
|
|
11809
11826
|
element.style.position = "relative";
|
|
11810
11827
|
config.absolute_position_children.forEach(function (childConfig) {
|
|
11811
|
-
var childElement = _this.
|
|
11828
|
+
var childElement = _this.rjYg(childConfig);
|
|
11812
11829
|
childElement.style.position = "absolute";
|
|
11813
11830
|
for (var _prop in childConfig.offset) {
|
|
11814
11831
|
childElement.style[_prop] = childConfig.offset[_prop];
|
|
@@ -11826,7 +11843,7 @@
|
|
|
11826
11843
|
// }
|
|
11827
11844
|
|
|
11828
11845
|
config.children.forEach(function (childConfig) {
|
|
11829
|
-
var childElement = _this.
|
|
11846
|
+
var childElement = _this.rjYg(childConfig);
|
|
11830
11847
|
element.appendChild(childElement);
|
|
11831
11848
|
});
|
|
11832
11849
|
}
|
|
@@ -12729,7 +12746,7 @@
|
|
|
12729
12746
|
}, {
|
|
12730
12747
|
key: "_setInLineContent",
|
|
12731
12748
|
value: function _setInLineContent() {
|
|
12732
|
-
this.inLineContainer = this.templateContent.
|
|
12749
|
+
this.inLineContainer = this.templateContent.icGM();
|
|
12733
12750
|
}
|
|
12734
12751
|
}, {
|
|
12735
12752
|
key: "_setObservors",
|
|
@@ -13285,7 +13302,7 @@
|
|
|
13285
13302
|
* }
|
|
13286
13303
|
* }
|
|
13287
13304
|
*/
|
|
13288
|
-
var Image = /*#__PURE__*/function () {
|
|
13305
|
+
var Image$1 = /*#__PURE__*/function () {
|
|
13289
13306
|
function Image() {
|
|
13290
13307
|
var data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
13291
13308
|
_classCallCheck(this, Image);
|
|
@@ -14277,7 +14294,7 @@
|
|
|
14277
14294
|
* @description Creates the styles for Marketing message.
|
|
14278
14295
|
* @returns {string} css styles
|
|
14279
14296
|
*/
|
|
14280
|
-
_defineProperty(this, "
|
|
14297
|
+
_defineProperty(this, "Bexb", function () {
|
|
14281
14298
|
if (!_this.enable_marketing) {
|
|
14282
14299
|
return "";
|
|
14283
14300
|
}
|
|
@@ -14296,7 +14313,7 @@
|
|
|
14296
14313
|
* @private
|
|
14297
14314
|
* @description Sets the marketing content at the end of the Inline
|
|
14298
14315
|
*/
|
|
14299
|
-
_defineProperty(this, "
|
|
14316
|
+
_defineProperty(this, "HBbG", function () {
|
|
14300
14317
|
if (_this.enable_marketing) {
|
|
14301
14318
|
var marketingContainer = document.createElement("div");
|
|
14302
14319
|
marketingContainer.classList.add("apx-inline-marketing".concat(_this.cssPostFix));
|
|
@@ -14358,7 +14375,7 @@
|
|
|
14358
14375
|
this.enable_icon = config.enable_icon;
|
|
14359
14376
|
if (this.enable_icon) this.icon = new Icon(config.icon);
|
|
14360
14377
|
this.enable_image = config.enable_image;
|
|
14361
|
-
if (this.enable_image) this.image = new Image(config.image);
|
|
14378
|
+
if (this.enable_image) this.image = new Image$1(config.image);
|
|
14362
14379
|
this.enable_video = config.enable_video;
|
|
14363
14380
|
if (this.enable_video) this.video = new Video(config.video);
|
|
14364
14381
|
this.enable_title = config.enable_title;
|
|
@@ -14898,7 +14915,7 @@
|
|
|
14898
14915
|
if (apxor_tooltip_styles) {
|
|
14899
14916
|
return;
|
|
14900
14917
|
}
|
|
14901
|
-
var styles = "\n ".concat(this._getCustomFonts(), " \n ").concat(this._getBackgroundContainerStyles(), " \n ").concat(this._getInLineContainerStyles(), " \n ").concat(this._getScrollStyles(), " \n ").concat(this._getControlsStyles(), " \n ").concat(this._getInLineMediaContainerStyles(), "\n ").concat(this._getInLineNonMediaContainerStyles(), "\n ").concat(this._getTextConatinerStyles(), "\n ").concat(this._getTitleStyles(), " \n ").concat(this._getDescriptionStyles(), " \n ").concat(this._getInLineButtonContainerStyles(), " \n ").concat(this._getIconStyles(), " \n ").concat(this._getImageStyles(), " \n ").concat(this._getVideoStyles(), " \n ").concat(this.
|
|
14918
|
+
var styles = "\n ".concat(this._getCustomFonts(), " \n ").concat(this._getBackgroundContainerStyles(), " \n ").concat(this._getInLineContainerStyles(), " \n ").concat(this._getScrollStyles(), " \n ").concat(this._getControlsStyles(), " \n ").concat(this._getInLineMediaContainerStyles(), "\n ").concat(this._getInLineNonMediaContainerStyles(), "\n ").concat(this._getTextConatinerStyles(), "\n ").concat(this._getTitleStyles(), " \n ").concat(this._getDescriptionStyles(), " \n ").concat(this._getInLineButtonContainerStyles(), " \n ").concat(this._getIconStyles(), " \n ").concat(this._getImageStyles(), " \n ").concat(this._getVideoStyles(), " \n ").concat(this.Bexb(), "\n ").concat(this._getTippyStyles(), "\n ").concat(this._getFooterStyles(), "\n ").concat(this._getProgressBarStyles(), "\n ").concat(this._getBootstrapiconsStyles(), " \n ").replaceAll("\n", "").replace(/[\s]{2,999}/g, "");
|
|
14902
14919
|
var styleNode = document.createElement("style");
|
|
14903
14920
|
styleNode.setAttribute("apx-tooltip-styles", "");
|
|
14904
14921
|
styleNode.innerHTML = styles;
|
|
@@ -15708,7 +15725,7 @@
|
|
|
15708
15725
|
this._setCloseButton();
|
|
15709
15726
|
|
|
15710
15727
|
//Set the Marketing content
|
|
15711
|
-
this.
|
|
15728
|
+
this.HBbG();
|
|
15712
15729
|
}
|
|
15713
15730
|
|
|
15714
15731
|
/**
|
|
@@ -18553,7 +18570,7 @@
|
|
|
18553
18570
|
}, {
|
|
18554
18571
|
key: "_setInAppModalContent",
|
|
18555
18572
|
value: function _setInAppModalContent() {
|
|
18556
|
-
this.inAppContainer = this.templateContent.
|
|
18573
|
+
this.inAppContainer = this.templateContent.icGM();
|
|
18557
18574
|
this.inAppContainer.style.zIndex = 99999;
|
|
18558
18575
|
this.overlayElement.appendChild(this.inAppContainer);
|
|
18559
18576
|
}
|
|
@@ -18701,7 +18718,7 @@
|
|
|
18701
18718
|
* @description Creates the styles for Marketing message.
|
|
18702
18719
|
* @returns {string} css styles
|
|
18703
18720
|
*/
|
|
18704
|
-
_defineProperty(this, "
|
|
18721
|
+
_defineProperty(this, "Bexb", function () {
|
|
18705
18722
|
if (!_this.enable_marketing) {
|
|
18706
18723
|
return "";
|
|
18707
18724
|
}
|
|
@@ -18747,7 +18764,7 @@
|
|
|
18747
18764
|
* @private
|
|
18748
18765
|
* @description Get the response for Form content in the InApp modal.
|
|
18749
18766
|
*/
|
|
18750
|
-
_defineProperty(this, "
|
|
18767
|
+
_defineProperty(this, "zoJq", function (form_elements) {
|
|
18751
18768
|
var obj = {};
|
|
18752
18769
|
var callback = "";
|
|
18753
18770
|
form_elements.forEach(function (element) {
|
|
@@ -18787,7 +18804,7 @@
|
|
|
18787
18804
|
* @private
|
|
18788
18805
|
* @description Sets the marketing content at the end of the InApp
|
|
18789
18806
|
*/
|
|
18790
|
-
_defineProperty(this, "
|
|
18807
|
+
_defineProperty(this, "HBbG", function () {
|
|
18791
18808
|
if (_this.enable_marketing) {
|
|
18792
18809
|
var marketingContainer = document.createElement("div");
|
|
18793
18810
|
marketingContainer.classList.add("apx-inapp-marketing".concat(_this.cssPostFix));
|
|
@@ -18827,7 +18844,7 @@
|
|
|
18827
18844
|
this.enable_icon = config.enable_icon;
|
|
18828
18845
|
if (this.enable_icon) this.icon = new Icon(config.icon);
|
|
18829
18846
|
this.enable_image = config.enable_image;
|
|
18830
|
-
if (this.enable_image) this.image = new Image(config.image);
|
|
18847
|
+
if (this.enable_image) this.image = new Image$1(config.image);
|
|
18831
18848
|
this.enable_video = config.enable_video;
|
|
18832
18849
|
if (this.enable_video) this.video = new Video(config.video);
|
|
18833
18850
|
this.enable_title = config.enable_title;
|
|
@@ -19040,7 +19057,7 @@
|
|
|
19040
19057
|
}, {
|
|
19041
19058
|
key: "_setStyles",
|
|
19042
19059
|
value: function _setStyles() {
|
|
19043
|
-
var styles = "\n ".concat(this._getCustomFonts(), " \n ").concat(this._getBackgroundContainerStyles(), " \n ").concat(this._getInAppContainerStyles(), " \n ").concat(this._getScrollStyles(), " \n ").concat(this._getControlsStyles(), " \n ").concat(this._getInAppMediaContainerStyles(), "\n ").concat(this._getInAppNonMediaContainerStyles(), "\n ").concat(this._getTextConatinerStyles(), "\n ").concat(this._getTitleStyles(), " \n ").concat(this._getDescriptionStyles(), " \n ").concat(this._getFormStyles(), "\n ").concat(this._getInAppButtonContainerStyles(), "\n ").concat(this._getIconStyles(), " \n ").concat(this._getImageStyles(), " \n ").concat(this._getVideoStyles(), " \n ").concat(this.
|
|
19060
|
+
var styles = "\n ".concat(this._getCustomFonts(), " \n ").concat(this._getBackgroundContainerStyles(), " \n ").concat(this._getInAppContainerStyles(), " \n ").concat(this._getScrollStyles(), " \n ").concat(this._getControlsStyles(), " \n ").concat(this._getInAppMediaContainerStyles(), "\n ").concat(this._getInAppNonMediaContainerStyles(), "\n ").concat(this._getTextConatinerStyles(), "\n ").concat(this._getTitleStyles(), " \n ").concat(this._getDescriptionStyles(), " \n ").concat(this._getFormStyles(), "\n ").concat(this._getInAppButtonContainerStyles(), "\n ").concat(this._getIconStyles(), " \n ").concat(this._getImageStyles(), " \n ").concat(this._getVideoStyles(), " \n ").concat(this.Bexb(), " \n ").concat(this._getProgressBarStyles(), "\n ").concat(this._getBootstrapiconsStyles(), " \n ").replaceAll("\n", "").replace(/[\s]{2,999}/g, "");
|
|
19044
19061
|
var styleNode = document.createElement("style");
|
|
19045
19062
|
styleNode.setAttribute("id", "apxor-style-" + this.configId);
|
|
19046
19063
|
styleNode.innerHTML = styles;
|
|
@@ -19517,7 +19534,7 @@
|
|
|
19517
19534
|
this._setCloseButton();
|
|
19518
19535
|
|
|
19519
19536
|
//Set the Marketing content
|
|
19520
|
-
this.
|
|
19537
|
+
this.HBbG();
|
|
19521
19538
|
}
|
|
19522
19539
|
|
|
19523
19540
|
/**
|
|
@@ -19722,7 +19739,7 @@
|
|
|
19722
19739
|
var form = document.querySelector(".apx-inapp-form-container".concat(this.cssPostFix));
|
|
19723
19740
|
form.addEventListener("submit", function (e) {
|
|
19724
19741
|
e.preventDefault();
|
|
19725
|
-
var _this4$generateRespon = _this4.
|
|
19742
|
+
var _this4$generateRespon = _this4.zoJq(_this4.form.elements),
|
|
19726
19743
|
obj = _this4$generateRespon.obj,
|
|
19727
19744
|
callback = _this4$generateRespon.callback;
|
|
19728
19745
|
var evalString = "(obj)=>" + callback + "(obj)";
|
|
@@ -20080,7 +20097,7 @@
|
|
|
20080
20097
|
};
|
|
20081
20098
|
} else {
|
|
20082
20099
|
// As the video player is hidden by default, unhide if the mode is not PIP.
|
|
20083
|
-
_this.
|
|
20100
|
+
_this.sVSe();
|
|
20084
20101
|
}
|
|
20085
20102
|
_this.showCallback();
|
|
20086
20103
|
} catch (e) {
|
|
@@ -20101,7 +20118,7 @@
|
|
|
20101
20118
|
* For portrait - width is set to 50% of the screen and height is auto adjusted based on resolution.
|
|
20102
20119
|
* For landscape - height is set to 50% of the screen and width is auto adjusted based on resolution.
|
|
20103
20120
|
*/
|
|
20104
|
-
_defineProperty(this, "
|
|
20121
|
+
_defineProperty(this, "prNI", function () {
|
|
20105
20122
|
var _getHeightWidthFromRe = getHeightWidthFromResolution(_this.video, 1),
|
|
20106
20123
|
width = _getHeightWidthFromRe.width,
|
|
20107
20124
|
height = _getHeightWidthFromRe.height;
|
|
@@ -20113,7 +20130,7 @@
|
|
|
20113
20130
|
* @private
|
|
20114
20131
|
* @description Removes the video player style element.
|
|
20115
20132
|
*/
|
|
20116
|
-
_defineProperty(this, "
|
|
20133
|
+
_defineProperty(this, "RLKV", function () {
|
|
20117
20134
|
var playerStyles = document.getElementById("apx-mpl-styles");
|
|
20118
20135
|
if (playerStyles) {
|
|
20119
20136
|
playerStyles.remove();
|
|
@@ -20124,7 +20141,7 @@
|
|
|
20124
20141
|
* @private
|
|
20125
20142
|
* @description Attach listeners on the video controls
|
|
20126
20143
|
*/
|
|
20127
|
-
_defineProperty(this, "
|
|
20144
|
+
_defineProperty(this, "noqy", function () {
|
|
20128
20145
|
// Listener for the video end. Display the CTA's when the video ends.
|
|
20129
20146
|
_this.videoElement.addEventListener("ended", function () {
|
|
20130
20147
|
var ctaButtons = document.getElementById("apx-cta-btn");
|
|
@@ -20239,7 +20256,7 @@
|
|
|
20239
20256
|
* @private
|
|
20240
20257
|
* @description Attach listeners for the PIP toggle. i.e. for the PIP enter and PIP exit
|
|
20241
20258
|
*/
|
|
20242
|
-
_defineProperty(this, "
|
|
20259
|
+
_defineProperty(this, "xxeD", function () {
|
|
20243
20260
|
var _this$terminationConf;
|
|
20244
20261
|
if (_this.mode === "PIP" && !((_this$terminationConf = _this.terminationConfig) !== null && _this$terminationConf !== void 0 && _this$terminationConf.auto_dismiss)) {
|
|
20245
20262
|
// On Exit of the PIP,
|
|
@@ -20279,7 +20296,7 @@
|
|
|
20279
20296
|
* @private Sets the custom controls on the video player.
|
|
20280
20297
|
* PIP and close are the custom controls that are created and positions on the video.
|
|
20281
20298
|
*/
|
|
20282
|
-
_defineProperty(this, "
|
|
20299
|
+
_defineProperty(this, "mztc", function () {
|
|
20283
20300
|
_this.enable_close_button;
|
|
20284
20301
|
if (_this.enable_close_button) {
|
|
20285
20302
|
var closeButton = document.createElement("span");
|
|
@@ -20326,21 +20343,21 @@
|
|
|
20326
20343
|
* @function hideVideoPlayer
|
|
20327
20344
|
* @description Sets the visibility of the video player to hidden.
|
|
20328
20345
|
*/
|
|
20329
|
-
_defineProperty(this, "
|
|
20346
|
+
_defineProperty(this, "wKGa", function () {
|
|
20330
20347
|
_this.videoPlayer.classList.add("apx-video-hide-elmt".concat(_this.cssPostFix));
|
|
20331
20348
|
});
|
|
20332
20349
|
/**
|
|
20333
20350
|
* @function unhideVideoPlayer
|
|
20334
20351
|
* @description Unhides video player.
|
|
20335
20352
|
*/
|
|
20336
|
-
_defineProperty(this, "
|
|
20353
|
+
_defineProperty(this, "sVSe", function () {
|
|
20337
20354
|
_this.videoPlayer.classList.remove("apx-video-hide-elmt".concat(_this.cssPostFix));
|
|
20338
20355
|
});
|
|
20339
20356
|
/**
|
|
20340
20357
|
* @function getVideoElement
|
|
20341
20358
|
* @returns {HTMLElement} Video ekement
|
|
20342
20359
|
*/
|
|
20343
|
-
_defineProperty(this, "
|
|
20360
|
+
_defineProperty(this, "HjnS", function () {
|
|
20344
20361
|
return _this.videoElement;
|
|
20345
20362
|
});
|
|
20346
20363
|
this.videoPlayer = null;
|
|
@@ -20392,7 +20409,7 @@
|
|
|
20392
20409
|
this.videoPlayer.style.backgroundColor = this.bg_color;
|
|
20393
20410
|
|
|
20394
20411
|
// Video has a resolution, not deviating from the resolution set the height and width.
|
|
20395
|
-
this.
|
|
20412
|
+
this.prNI();
|
|
20396
20413
|
//Generate the styles and add them to the document head.
|
|
20397
20414
|
this._setVideoPlayerStyles();
|
|
20398
20415
|
//Set the position of the video player with in the 5 possible positions.
|
|
@@ -20400,16 +20417,16 @@
|
|
|
20400
20417
|
//Create a video element,set the source and add to the container.
|
|
20401
20418
|
this._setPlayerContent();
|
|
20402
20419
|
//Set the listeners on the video control buttons.
|
|
20403
|
-
this.
|
|
20420
|
+
this.noqy();
|
|
20404
20421
|
//Attach listeners for the PIP toggle. i.e. for the PIP enter and PIP exit
|
|
20405
|
-
this.
|
|
20422
|
+
this.xxeD();
|
|
20406
20423
|
//Set the custom close and PIP controls. Not using the defaults from the html video element.
|
|
20407
20424
|
//Reason - We want to position them at the top right and left positions.
|
|
20408
|
-
this.
|
|
20425
|
+
this.mztc();
|
|
20409
20426
|
//Generate and postion the CTA buttons on the video. By default hidden, visible only when video is completed
|
|
20410
20427
|
this._setButtons(BUTTON_CONTAINER_POSITION.CENTER);
|
|
20411
20428
|
//Hide the video player. Display it based on the video mode. Videoplayer for "video" mode and a direct PIP for "PIP" mode.
|
|
20412
|
-
this.
|
|
20429
|
+
this.wKGa();
|
|
20413
20430
|
//If the auto dismiss is enabled, sets the timeout to call the InApp close.
|
|
20414
20431
|
this._setAutoTerminate();
|
|
20415
20432
|
document.body.appendChild(this.videoPlayer);
|
|
@@ -20524,7 +20541,7 @@
|
|
|
20524
20541
|
}
|
|
20525
20542
|
}
|
|
20526
20543
|
this.videoPlayer.remove();
|
|
20527
|
-
this.
|
|
20544
|
+
this.RLKV();
|
|
20528
20545
|
if (closeButtonName !== "auto_dismiss") {
|
|
20529
20546
|
var _window$ApxorRTM9;
|
|
20530
20547
|
(_window$ApxorRTM9 = window.ApxorRTM) === null || _window$ApxorRTM9 === void 0 || _window$ApxorRTM9.logEvent("apx_video_inapp_close_button_clicked", {
|
|
@@ -20594,7 +20611,7 @@
|
|
|
20594
20611
|
replayCount: _this3.replayCount
|
|
20595
20612
|
});
|
|
20596
20613
|
_this3.videoPlayer.remove();
|
|
20597
|
-
_this3.
|
|
20614
|
+
_this3.RLKV();
|
|
20598
20615
|
_this3.hideCallback();
|
|
20599
20616
|
} catch (e) {
|
|
20600
20617
|
console.log("Can't close the video player\n".concat(e));
|
|
@@ -20681,17 +20698,23 @@
|
|
|
20681
20698
|
|
|
20682
20699
|
var EmbedCards = /*#__PURE__*/_createClass(function EmbedCards(_config, configId, name, showCallback, closeCallback) {
|
|
20683
20700
|
var _this = this,
|
|
20701
|
+
_config$wait_interval,
|
|
20684
20702
|
_config$termination;
|
|
20685
20703
|
_classCallCheck(this, EmbedCards);
|
|
20686
20704
|
_defineProperty(this, "showEmbedCards", function () {
|
|
20687
20705
|
try {
|
|
20688
20706
|
var _window;
|
|
20689
20707
|
(_window = window) === null || _window === void 0 || (_window = _window.ApxorLogger) === null || _window === void 0 || _window.debug("called showEmbedCards");
|
|
20690
|
-
var element = _this.
|
|
20691
|
-
_this.
|
|
20708
|
+
var element = _this.gwsi(_this.layout);
|
|
20709
|
+
_this.QePi();
|
|
20692
20710
|
window.onresize = function () {
|
|
20693
|
-
_this.
|
|
20711
|
+
_this.kpwr();
|
|
20694
20712
|
};
|
|
20713
|
+
_this.imageElements.forEach(function (img) {
|
|
20714
|
+
img.addEventListener("error", function () {
|
|
20715
|
+
_this.qgiL("provided image doesn't exists");
|
|
20716
|
+
});
|
|
20717
|
+
});
|
|
20695
20718
|
var rootContainer = document.createElement("div");
|
|
20696
20719
|
rootContainer.style.display = "flex";
|
|
20697
20720
|
rootContainer.style.justifyContent = "center";
|
|
@@ -20700,7 +20723,7 @@
|
|
|
20700
20723
|
var styleElement = document.createElement("style");
|
|
20701
20724
|
styleElement.innerHTML = _this.styleContent;
|
|
20702
20725
|
document.head.appendChild(styleElement);
|
|
20703
|
-
_this.
|
|
20726
|
+
_this.ZuMk(_this.termination);
|
|
20704
20727
|
try {
|
|
20705
20728
|
eval(_this.script);
|
|
20706
20729
|
} catch (e) {
|
|
@@ -20708,55 +20731,44 @@
|
|
|
20708
20731
|
console.log("found error while executing script: ".concat(e));
|
|
20709
20732
|
(_window2 = window) === null || _window2 === void 0 || (_window2 = _window2.ApxorLogger) === null || _window2 === void 0 || _window2.error("found error while executing script: ".concat(e === null || e === void 0 ? void 0 : e.name, " ").concat(e === null || e === void 0 ? void 0 : e.message));
|
|
20710
20733
|
}
|
|
20711
|
-
|
|
20712
|
-
_this.
|
|
20713
|
-
|
|
20714
|
-
|
|
20715
|
-
|
|
20716
|
-
|
|
20717
|
-
(
|
|
20718
|
-
|
|
20719
|
-
id: _this.configId,
|
|
20720
|
-
apx_nudge_type: "sticky_card",
|
|
20721
|
-
apx_notshown_type: "error",
|
|
20722
|
-
apx_reason: "provided video doesn't exists"
|
|
20723
|
-
});
|
|
20724
|
-
window.onresize = null;
|
|
20725
|
-
(_window3 = window) === null || _window3 === void 0 || (_window3 = _window3.ApxorWidget) === null || _window3 === void 0 || _window3.removeEmbedCard(_this.configId);
|
|
20726
|
-
_this.waitInterval = 30;
|
|
20727
|
-
}
|
|
20728
|
-
if (_this.BhLQ()) {
|
|
20729
|
-
_this.waitInterval = 30;
|
|
20730
|
-
_this.Kitu();
|
|
20731
|
-
clearInterval(_this.intervalToCheckVideoStatus);
|
|
20734
|
+
_this.intervalToCheckMediaLoadingStatus = setInterval(function () {
|
|
20735
|
+
_this.wait_interval -= 1;
|
|
20736
|
+
if (_this.wait_interval <= 0) {
|
|
20737
|
+
_this.qgiL("provided media doesn't exists");
|
|
20738
|
+
} else {
|
|
20739
|
+
if (_this.FfdR() && _this.iFKD()) {
|
|
20740
|
+
_this.kpwr();
|
|
20741
|
+
clearInterval(_this.intervalToCheckMediaLoadingStatus);
|
|
20732
20742
|
}
|
|
20733
|
-
}, 100);
|
|
20734
|
-
};
|
|
20735
|
-
_this.intervalToCheckImgStatus = setInterval(function () {
|
|
20736
|
-
_this.waitInterval = _this.waitInterval - 1;
|
|
20737
|
-
if (_this.waitInterval === 0) {
|
|
20738
|
-
clearInterval(_this.intervalToCheckImgStatus);
|
|
20739
|
-
_this.waitInterval = 30;
|
|
20740
|
-
}
|
|
20741
|
-
if (_this.wMuZ()) {
|
|
20742
|
-
_this.waitInterval = 30;
|
|
20743
|
-
clearInterval(_this.intervalToCheckImgStatus);
|
|
20744
|
-
_this.videoElements.length > 0 ? videoStatusCheck() : _this.Kitu();
|
|
20745
20743
|
}
|
|
20746
20744
|
}, 100);
|
|
20747
20745
|
} catch (e) {
|
|
20748
|
-
var
|
|
20746
|
+
var _window3;
|
|
20749
20747
|
console.log("failed while creating embed card with error ".concat(e));
|
|
20750
|
-
(
|
|
20748
|
+
(_window3 = window) === null || _window3 === void 0 || (_window3 = _window3.ApxorLogger) === null || _window3 === void 0 || _window3.error("failed while creating embed card with error: ".concat(e === null || e === void 0 ? void 0 : e.name, " ").concat(e === null || e === void 0 ? void 0 : e.message));
|
|
20751
20749
|
}
|
|
20752
20750
|
});
|
|
20753
|
-
_defineProperty(this, "
|
|
20751
|
+
_defineProperty(this, "qgiL", function (reason) {
|
|
20752
|
+
var _window$ApxorRTM, _window4;
|
|
20753
|
+
!_this.loggedNudgeNotShownEvent && ((_window$ApxorRTM = window.ApxorRTM) === null || _window$ApxorRTM === void 0 ? void 0 : _window$ApxorRTM.logEvent("apx_nudge_not_shown", {
|
|
20754
|
+
campaignName: _this.name,
|
|
20755
|
+
id: _this.configId,
|
|
20756
|
+
apx_nudge_type: "sticky_card",
|
|
20757
|
+
apx_notshown_type: "error",
|
|
20758
|
+
apx_reason: reason
|
|
20759
|
+
}));
|
|
20760
|
+
_this.loggedNudgeNotShownEvent = true;
|
|
20761
|
+
window.onresize = null;
|
|
20762
|
+
clearInterval(_this.intervalToCheckMediaLoadingStatus);
|
|
20763
|
+
(_window4 = window) === null || _window4 === void 0 || (_window4 = _window4.ApxorWidget) === null || _window4 === void 0 || _window4.removeEmbedCard(_this.configId);
|
|
20764
|
+
});
|
|
20765
|
+
_defineProperty(this, "QePi", function () {
|
|
20754
20766
|
var EmbeddedCardsStyles = document.createElement("style");
|
|
20755
20767
|
EmbeddedCardsStyles.innerHTML = _this.initialStyles;
|
|
20756
20768
|
EmbeddedCardsStyles.setAttribute("apx-tooltip-styles", "");
|
|
20757
20769
|
document.head.appendChild(EmbeddedCardsStyles);
|
|
20758
20770
|
});
|
|
20759
|
-
_defineProperty(this, "
|
|
20771
|
+
_defineProperty(this, "gwsi", function (config) {
|
|
20760
20772
|
var _window$Apxor;
|
|
20761
20773
|
var element;
|
|
20762
20774
|
switch (config.type) {
|
|
@@ -20948,7 +20960,7 @@
|
|
|
20948
20960
|
if (config.absolute_position_children && config.absolute_position_children.length > 0) {
|
|
20949
20961
|
element.style.position = "relative";
|
|
20950
20962
|
config.absolute_position_children.forEach(function (childConfig) {
|
|
20951
|
-
var childElement = _this.
|
|
20963
|
+
var childElement = _this.rjYg(childConfig);
|
|
20952
20964
|
childElement.style.position = "absolute";
|
|
20953
20965
|
for (var _prop in childConfig.offset) {
|
|
20954
20966
|
childElement.style[_prop] = childConfig.offset[_prop];
|
|
@@ -20966,7 +20978,7 @@
|
|
|
20966
20978
|
// }
|
|
20967
20979
|
|
|
20968
20980
|
config.children.forEach(function (childConfig) {
|
|
20969
|
-
var childElement = _this.
|
|
20981
|
+
var childElement = _this.gwsi(childConfig);
|
|
20970
20982
|
element.appendChild(childElement);
|
|
20971
20983
|
});
|
|
20972
20984
|
}
|
|
@@ -20992,7 +21004,7 @@
|
|
|
20992
21004
|
}
|
|
20993
21005
|
return element;
|
|
20994
21006
|
});
|
|
20995
|
-
_defineProperty(this, "
|
|
21007
|
+
_defineProperty(this, "ZuMk", function (config) {
|
|
20996
21008
|
config.forEach(function (id) {
|
|
20997
21009
|
var element = document.getElementById(id);
|
|
20998
21010
|
if (element) {
|
|
@@ -21000,17 +21012,21 @@
|
|
|
21000
21012
|
}
|
|
21001
21013
|
});
|
|
21002
21014
|
});
|
|
21003
|
-
_defineProperty(this, "
|
|
21015
|
+
_defineProperty(this, "iFKD", function () {
|
|
21016
|
+
//This logic is to make sure that image has loaded, it doesn't check whether image is broken
|
|
21017
|
+
//refer: https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/complete#value
|
|
21018
|
+
if (_this.imageElements.length === 0) return true;
|
|
21004
21019
|
return _this.imageElements.every(function (img) {
|
|
21005
21020
|
return img.complete;
|
|
21006
21021
|
});
|
|
21007
21022
|
});
|
|
21008
|
-
_defineProperty(this, "
|
|
21023
|
+
_defineProperty(this, "FfdR", function () {
|
|
21024
|
+
if (_this.videoElements.length === 0) return true;
|
|
21009
21025
|
return _this.videoElements.every(function (video) {
|
|
21010
21026
|
return video.readyState >= 3;
|
|
21011
21027
|
});
|
|
21012
21028
|
});
|
|
21013
|
-
_defineProperty(this, "
|
|
21029
|
+
_defineProperty(this, "kpwr", function () {
|
|
21014
21030
|
var _window6, _window7;
|
|
21015
21031
|
var width = window.document.querySelector("html").offsetWidth;
|
|
21016
21032
|
var height = window.document.querySelector("html").offsetHeight;
|
|
@@ -21027,29 +21043,1602 @@
|
|
|
21027
21043
|
this.closeCallback = closeCallback;
|
|
21028
21044
|
this.layout = _config.layout;
|
|
21029
21045
|
this.styleContent = _config.css;
|
|
21046
|
+
this.wait_interval = (_config$wait_interval = _config === null || _config === void 0 ? void 0 : _config.wait_interval) !== null && _config$wait_interval !== void 0 ? _config$wait_interval : 5000 / 100;
|
|
21030
21047
|
this.termination = (_config$termination = _config.termination) !== null && _config$termination !== void 0 ? _config$termination : [];
|
|
21031
21048
|
this.script = _config.script;
|
|
21032
21049
|
this.initialStyles = "";
|
|
21033
21050
|
this.imageElements = [];
|
|
21034
21051
|
this.videoElements = [];
|
|
21035
|
-
this.
|
|
21036
|
-
this.waitInterval = 30;
|
|
21052
|
+
this.intervalToCheckMediaLoadingStatus = null;
|
|
21037
21053
|
this.loggedNudgeShownEvent = false;
|
|
21054
|
+
this.loggedNudgeNotShownEvent = false;
|
|
21038
21055
|
});
|
|
21039
21056
|
|
|
21057
|
+
/**
|
|
21058
|
+
* @constructor ProgressBar
|
|
21059
|
+
* @example
|
|
21060
|
+
* Example of a ProgressBar model is
|
|
21061
|
+
*
|
|
21062
|
+
* progress_bar: {
|
|
21063
|
+
* seen_color : #e0d210,
|
|
21064
|
+
* unseen_color : #ffffff,
|
|
21065
|
+
* }
|
|
21066
|
+
*/
|
|
21067
|
+
var ProgressBar$1 = /*#__PURE__*/_createClass(function ProgressBar() {
|
|
21068
|
+
var data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
21069
|
+
_classCallCheck(this, ProgressBar);
|
|
21070
|
+
this.seen_color = getColorOrDefault(data === null || data === void 0 ? void 0 : data.seen_color, "#FFFFFF");
|
|
21071
|
+
this.unseen_color = getColorOrDefault(data === null || data === void 0 ? void 0 : data.unseen_color, "#000000");
|
|
21072
|
+
});
|
|
21073
|
+
|
|
21074
|
+
var Stories = /*#__PURE__*/function () {
|
|
21075
|
+
function Stories(_config, configId, name, position, slidesSeenCount, view_id, showCallback, closeCallback) {
|
|
21076
|
+
var _this = this;
|
|
21077
|
+
_classCallCheck(this, Stories);
|
|
21078
|
+
_defineProperty(this, "showStories", function () {
|
|
21079
|
+
_this.storyContainer = document.createElement("div");
|
|
21080
|
+
_this.storyContainer.classList.add("pause");
|
|
21081
|
+
_this.storyContainer.style = "height:100%;display:flex;align-items:center;";
|
|
21082
|
+
_this.progressContainer = document.createElement("div");
|
|
21083
|
+
_this._getStoriesStyles();
|
|
21084
|
+
_this.progressContainer.classList.add("progress-container");
|
|
21085
|
+
|
|
21086
|
+
// Create custom loader element
|
|
21087
|
+
_this.loader = document.createElement("div");
|
|
21088
|
+
_this.loader.classList.add("loader-1", "center");
|
|
21089
|
+
var loaderSpan = document.createElement("span");
|
|
21090
|
+
_this.loader.appendChild(loaderSpan);
|
|
21091
|
+
_this.storyContainer.appendChild(_this.loader);
|
|
21092
|
+
var loaderStyles = "\n *,\n ::after,\n ::before {\n box-sizing: border-box;\n }\n .loader-1 {\n height: 32px;\n width: 32px;\n animation: loader-1-1 4.8s linear infinite;\n }\n @keyframes loader-1-1 {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n }\n .loader-1 span {\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n margin: auto;\n height: 32px;\n width: 32px;\n clip: rect(0, 32px, 32px, 16px);\n animation: loader-1-2 1.2s linear infinite;\n }\n @keyframes loader-1-2 {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(220deg);\n }\n }\n .loader-1 span::after {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n margin: auto;\n height: 32px;\n width: 32px;\n clip: rect(0, 32px, 32px, 16px);\n border: 3px solid #fff;\n border-radius: 50%;\n animation: loader-1-3 1.2s cubic-bezier(0.77, 0, 0.175, 1) infinite;\n }\n @keyframes loader-1-3 {\n 0% {\n transform: rotate(-140deg);\n }\n 50% {\n transform: rotate(-160deg);\n }\n 100% {\n transform: rotate(140deg);\n }\n }\n .center {\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n margin: auto;\n }\n ";
|
|
21093
|
+
var styleSheet = document.createElement("style");
|
|
21094
|
+
styleSheet.type = "text/css";
|
|
21095
|
+
styleSheet.innerText = loaderStyles;
|
|
21096
|
+
document.head.appendChild(styleSheet);
|
|
21097
|
+
_this.slides.forEach(function (slide, index) {
|
|
21098
|
+
var progressSlide = document.createElement("div");
|
|
21099
|
+
progressSlide.classList.add("slide".concat(index));
|
|
21100
|
+
progressSlide.classList.add("progress");
|
|
21101
|
+
var slide_duration = slide.duration / 1000;
|
|
21102
|
+
progressSlide.style.animationDuration = "".concat(slide_duration, "s");
|
|
21103
|
+
_this.progressContainer.appendChild(progressSlide);
|
|
21104
|
+
});
|
|
21105
|
+
_this.storyContainer.appendChild(_this.progressContainer);
|
|
21106
|
+
var breakElement = document.createElement("br");
|
|
21107
|
+
_this.storyContainer.appendChild(breakElement);
|
|
21108
|
+
var currentElement = document.createElement("div");
|
|
21109
|
+
currentElement.classList.add("slide-header");
|
|
21110
|
+
currentElement.style = "position:relative;top:20px;";
|
|
21111
|
+
var slideDetails = document.createElement("div");
|
|
21112
|
+
slideDetails.classList.add("slide-details");
|
|
21113
|
+
slideDetails.style = "display:flex;align-items:center;height:auto;width:100%";
|
|
21114
|
+
_this.storyContainer.appendChild(currentElement);
|
|
21115
|
+
_this.storyContainer.appendChild(slideDetails);
|
|
21116
|
+
document.body.appendChild(_this.storyContainer);
|
|
21117
|
+
_this.xLnm();
|
|
21118
|
+
_this.UIoc();
|
|
21119
|
+
_this.progress = Array.from(document.querySelectorAll(".progress"));
|
|
21120
|
+
var current_slide = document.querySelector(".slide-details");
|
|
21121
|
+
var playNext = function playNext(e) {
|
|
21122
|
+
var _absolute_header, _window2, _window2$logInternalE, _window$ApxorRTM4;
|
|
21123
|
+
var current = e && e.target;
|
|
21124
|
+
var next;
|
|
21125
|
+
var progress1 = Array.from(document.querySelectorAll(".progress"));
|
|
21126
|
+
var activeIndex1 = progress1.findIndex(function (el) {
|
|
21127
|
+
return el.classList.contains("active");
|
|
21128
|
+
});
|
|
21129
|
+
var current_time = Date.now();
|
|
21130
|
+
var time_taken;
|
|
21131
|
+
time_taken = (current_time - _this.slideStartTime) / 1000;
|
|
21132
|
+
if (activeIndex1 != -1) {
|
|
21133
|
+
var _window$ApxorRTM;
|
|
21134
|
+
(_window$ApxorRTM = window.ApxorRTM) === null || _window$ApxorRTM === void 0 || _window$ApxorRTM.logEvent("apx_slide_completed", {
|
|
21135
|
+
apx_nudge_id: _this.config[_this.position].id,
|
|
21136
|
+
apx_nudge_name: _this.config[_this.position].campaign_name,
|
|
21137
|
+
apx_template_name: "stories",
|
|
21138
|
+
apx_variant_code: _this.config[_this.position].variant_code,
|
|
21139
|
+
apx_slide_number: activeIndex1 + 1,
|
|
21140
|
+
apx_slide_label: _this.current_slide_config.slide_label,
|
|
21141
|
+
apx_time_taken: time_taken
|
|
21142
|
+
});
|
|
21143
|
+
}
|
|
21144
|
+
if (current) {
|
|
21145
|
+
var currentIndex = _this.progress.indexOf(current);
|
|
21146
|
+
if (currentIndex < _this.progress.length - 1) {
|
|
21147
|
+
// If there are more slides in the current story group
|
|
21148
|
+
_this.storyContainer.removeEventListener("touchend", _this.boundSwipeUpHandling);
|
|
21149
|
+
var _existingAbsoluteElements = document.querySelectorAll(".apx-slide-header");
|
|
21150
|
+
_existingAbsoluteElements.forEach(function (element) {
|
|
21151
|
+
element.remove();
|
|
21152
|
+
});
|
|
21153
|
+
var currentSlideDetails = document.querySelector(".slide-details");
|
|
21154
|
+
currentSlideDetails.innerHTML = "";
|
|
21155
|
+
next = _this.progress[currentIndex + 1];
|
|
21156
|
+
} else {
|
|
21157
|
+
_this.storyContainer.removeEventListener("touchend", _this.boundSwipeUpHandling);
|
|
21158
|
+
// If it's the last slide of the current story group
|
|
21159
|
+
// Check if there's a next story group
|
|
21160
|
+
var _existingAbsoluteElements2 = document.querySelectorAll(".apx-slide-header");
|
|
21161
|
+
_existingAbsoluteElements2.forEach(function (element) {
|
|
21162
|
+
element.remove();
|
|
21163
|
+
});
|
|
21164
|
+
// this.tdcD();
|
|
21165
|
+
var _currentSlideDetails = document.querySelector(".slide-details");
|
|
21166
|
+
_currentSlideDetails.innerHTML = "";
|
|
21167
|
+
_this.position = _this.position + 1;
|
|
21168
|
+
var nextGroupIndex = _this.position;
|
|
21169
|
+
if (nextGroupIndex < _this.config.length) {
|
|
21170
|
+
var _window$ApxorRTM2;
|
|
21171
|
+
_this.progressContainer.innerHTML = "";
|
|
21172
|
+
// Redirect to the first slide of the next story group
|
|
21173
|
+
var nextGroupSlides = _this.config[nextGroupIndex].slides;
|
|
21174
|
+
_this.progress_bar = new ProgressBar$1(_this.config[nextGroupIndex].progress_bar);
|
|
21175
|
+
_this.slides = nextGroupSlides;
|
|
21176
|
+
_this.slides.forEach(function (slide, index) {
|
|
21177
|
+
var progressSlide = document.createElement("div");
|
|
21178
|
+
progressSlide.classList.add("slide".concat(index));
|
|
21179
|
+
progressSlide.classList.add("progress");
|
|
21180
|
+
var slide_duration = slide.duration / 1000;
|
|
21181
|
+
progressSlide.style.animationDuration = "".concat(slide_duration, "s");
|
|
21182
|
+
_this.progressContainer.appendChild(progressSlide);
|
|
21183
|
+
});
|
|
21184
|
+
_this.progress = Array.from(document.querySelectorAll(".progress"));
|
|
21185
|
+
_this.progress.map(function (el) {
|
|
21186
|
+
return el.addEventListener("animationend", playNext, false);
|
|
21187
|
+
});
|
|
21188
|
+
next = _this.progress[0];
|
|
21189
|
+
_this.current_slide_config = _this.config[_this.position].slides;
|
|
21190
|
+
_this.current_slide_config.media_type === "none" ? _this.currentMediaType = "builder" : _this.currentMediaType = _this.current_slide_config.media_type;
|
|
21191
|
+
var timeTaken;
|
|
21192
|
+
var _current_time = Date.now();
|
|
21193
|
+
timeTaken = (_current_time - _this.slideStartTime) / 1000;
|
|
21194
|
+
(_window$ApxorRTM2 = window.ApxorRTM) === null || _window$ApxorRTM2 === void 0 || _window$ApxorRTM2.logEvent("apx_story_changed", {
|
|
21195
|
+
apx_nudge_id: _this.config[_this.position].id,
|
|
21196
|
+
apx_nudge_name: _this.config[_this.position].campaign_name,
|
|
21197
|
+
apx_template_name: "stories",
|
|
21198
|
+
apx_variant_code: _this.config[_this.position].variant_code,
|
|
21199
|
+
apx_slide_number: 1,
|
|
21200
|
+
apx_slide_label: _this.current_slide_config.slide_label,
|
|
21201
|
+
apx_slide_type: _this.currentMediaType,
|
|
21202
|
+
apx_change_action: "autoplay",
|
|
21203
|
+
apx_time_taken: timeTaken
|
|
21204
|
+
});
|
|
21205
|
+
} else {
|
|
21206
|
+
if (currentIndex === _this.progress.length - 1) {
|
|
21207
|
+
var _window, _window$logInternalEv, _window$ApxorRTM3;
|
|
21208
|
+
//this is the last slide of last story group hence close the current story group
|
|
21209
|
+
|
|
21210
|
+
var progressContainer = document.querySelector(".progress-container");
|
|
21211
|
+
var progressSegments = progressContainer.querySelectorAll(".progress");
|
|
21212
|
+
progressSegments[progressSegments.length - 1].classList.add("passed");
|
|
21213
|
+
(_window = window) === null || _window === void 0 || (_window = _window.Apxor) === null || _window === void 0 || (_window$logInternalEv = _window.logInternalEvent) === null || _window$logInternalEv === void 0 || _window$logInternalEv.call(_window, "story_slides_closed");
|
|
21214
|
+
_this.current_slide_config.media_type === "none" ? _this.currentMediaType = "builder" : _this.currentMediaType = _this.current_slide_config.media_type;
|
|
21215
|
+
(_window$ApxorRTM3 = window.ApxorRTM) === null || _window$ApxorRTM3 === void 0 || _window$ApxorRTM3.logEvent("apx_slide_closed", {
|
|
21216
|
+
apx_nudge_id: _this.config[_this.position].id,
|
|
21217
|
+
apx_nudge_name: _this.config[_this.position].campaign_name,
|
|
21218
|
+
apx_template_name: "stories",
|
|
21219
|
+
apx_variant_code: _this.config[_this.position].variant_code,
|
|
21220
|
+
apx_slide_number: currentIndex + 1,
|
|
21221
|
+
apx_slide_label: _this.current_slide_config.slide_label,
|
|
21222
|
+
apx_slide_type: _this.currentMediaType
|
|
21223
|
+
});
|
|
21224
|
+
return;
|
|
21225
|
+
}
|
|
21226
|
+
}
|
|
21227
|
+
}
|
|
21228
|
+
current.classList.remove("active");
|
|
21229
|
+
current.classList.add("passed");
|
|
21230
|
+
}
|
|
21231
|
+
if (!next) {
|
|
21232
|
+
_this.progress.forEach(function (el) {
|
|
21233
|
+
el.classList.remove("active");
|
|
21234
|
+
el.classList.remove("passed");
|
|
21235
|
+
});
|
|
21236
|
+
next = _this.progress[_this.slidesSeenCount];
|
|
21237
|
+
var _progressContainer = document.querySelector(".progress-container");
|
|
21238
|
+
var _progressSegments = _progressContainer.querySelectorAll(".progress");
|
|
21239
|
+
for (var i = 0; i < _this.slidesSeenCount; i++) {
|
|
21240
|
+
var _progressSegments$i;
|
|
21241
|
+
(_progressSegments$i = _progressSegments[i]) === null || _progressSegments$i === void 0 || _progressSegments$i.classList.add("passed");
|
|
21242
|
+
}
|
|
21243
|
+
}
|
|
21244
|
+
next.classList.add("active");
|
|
21245
|
+
var current_slide_from_config = _this.slides[_this.progress.indexOf(next)];
|
|
21246
|
+
_this.current_slide_config = current_slide_from_config;
|
|
21247
|
+
var slide_header = document.querySelectorAll(".slide_header");
|
|
21248
|
+
if (slide_header.length > 0) {
|
|
21249
|
+
slide_header[0].remove();
|
|
21250
|
+
}
|
|
21251
|
+
//remove existing existing header elements
|
|
21252
|
+
var existingAbsoluteElements = document.querySelectorAll(".apx-slide-header");
|
|
21253
|
+
existingAbsoluteElements.forEach(function (element) {
|
|
21254
|
+
element.remove();
|
|
21255
|
+
});
|
|
21256
|
+
var absolute_header;
|
|
21257
|
+
absolute_header = document.createElement("div");
|
|
21258
|
+
current_slide_from_config.layout.absolute_position_children.forEach(function (current_element) {
|
|
21259
|
+
var current_absolute_element;
|
|
21260
|
+
current_absolute_element = _this.rjYg(current_element);
|
|
21261
|
+
absolute_header.appendChild(current_absolute_element);
|
|
21262
|
+
});
|
|
21263
|
+
(_absolute_header = absolute_header) === null || _absolute_header === void 0 || _absolute_header.classList.add("apx-slide-header");
|
|
21264
|
+
document.body.appendChild(absolute_header);
|
|
21265
|
+
var element;
|
|
21266
|
+
if (current_slide_from_config.media_type === "image") {
|
|
21267
|
+
var _window$Apxor;
|
|
21268
|
+
element = document.createElement("div");
|
|
21269
|
+
var image_src;
|
|
21270
|
+
var image_ext;
|
|
21271
|
+
if (((_window$Apxor = window.Apxor) === null || _window$Apxor === void 0 ? void 0 : _window$Apxor.platform) != "ios") {
|
|
21272
|
+
image_ext = getFileExtension(current_slide_from_config.media_url);
|
|
21273
|
+
image_src = window.Apxor.getFilePath(_this.config[_this.position].id, current_slide_from_config.media_url, image_ext);
|
|
21274
|
+
if (image_src && image_src != "") {
|
|
21275
|
+
document.body.style.backgroundImage = "url(".concat(image_src, ")");
|
|
21276
|
+
document.body.style.backgroundSize = "100% auto";
|
|
21277
|
+
document.body.style.backgroundPosition = "center";
|
|
21278
|
+
document.body.style.backgroundRepeat = "no-repeat";
|
|
21279
|
+
} else {
|
|
21280
|
+
document.body.style.backgroundImage = "url(".concat(current_slide_from_config.media_url, ")");
|
|
21281
|
+
document.body.style.backgroundSize = "100% auto";
|
|
21282
|
+
document.body.style.backgroundPosition = "center";
|
|
21283
|
+
document.body.style.backgroundRepeat = "no-repeat";
|
|
21284
|
+
}
|
|
21285
|
+
} else {
|
|
21286
|
+
document.body.style.backgroundImage = "url(".concat(current_slide_from_config.media_url, ")");
|
|
21287
|
+
document.body.style.backgroundSize = "100% auto";
|
|
21288
|
+
document.body.style.backgroundPosition = "center";
|
|
21289
|
+
document.body.style.backgroundRepeat = "no-repeat";
|
|
21290
|
+
}
|
|
21291
|
+
document.body.style.backgroundColor = current_slide_from_config.media_background_color;
|
|
21292
|
+
document.body.style.margin = "0px";
|
|
21293
|
+
} else if (current_slide_from_config.media_type === "video") {
|
|
21294
|
+
var _window$Apxor2;
|
|
21295
|
+
document.body.style.backgroundImage = "";
|
|
21296
|
+
document.body.style.backgroundSize = "";
|
|
21297
|
+
document.body.style.backgroundPosition = "";
|
|
21298
|
+
document.body.style.backgroundRepeat = "";
|
|
21299
|
+
element = document.createElement("video");
|
|
21300
|
+
element.classList.add("apx-story-video");
|
|
21301
|
+
element.disablePictureInPicture = true;
|
|
21302
|
+
element.autoplay = true;
|
|
21303
|
+
var sourceElement = document.createElement("source");
|
|
21304
|
+
//Set the video tag attributes
|
|
21305
|
+
sourceElement.setAttribute("src", current_slide_from_config.media_url);
|
|
21306
|
+
sourceElement.setAttribute("type", "video/mp4");
|
|
21307
|
+
if (((_window$Apxor2 = window.Apxor) === null || _window$Apxor2 === void 0 ? void 0 : _window$Apxor2.platform) === "ios") {
|
|
21308
|
+
element.playsInline = true;
|
|
21309
|
+
}
|
|
21310
|
+
element.appendChild(sourceElement);
|
|
21311
|
+
element.style = "width:100%;height:auto;align-items:center;display:flex;align-items:center;object-fit:cover";
|
|
21312
|
+
document.body.style.backgroundColor = current_slide_from_config.media_background_color;
|
|
21313
|
+
document.body.style.margin = "0px";
|
|
21314
|
+
} else if (current_slide_from_config.media_type === "none") {
|
|
21315
|
+
document.body.style.backgroundImage = "";
|
|
21316
|
+
document.body.style.backgroundSize = "";
|
|
21317
|
+
document.body.style.backgroundPosition = "";
|
|
21318
|
+
document.body.style.backgroundRepeat = "";
|
|
21319
|
+
var updated_layout_without_absolute_elements = JSON.parse(JSON.stringify(current_slide_from_config.layout));
|
|
21320
|
+
delete updated_layout_without_absolute_elements["absolute_position_children"];
|
|
21321
|
+
element = _this.rjYg(updated_layout_without_absolute_elements);
|
|
21322
|
+
document.body.style.backgroundColor = current_slide_from_config.media_background_color;
|
|
21323
|
+
document.body.style.margin = "0px";
|
|
21324
|
+
}
|
|
21325
|
+
if (current_slide.children.length > 0) {
|
|
21326
|
+
current_slide.removeChild(current_slide.children[0]);
|
|
21327
|
+
}
|
|
21328
|
+
current_slide.appendChild(element);
|
|
21329
|
+
_this.IdEJ();
|
|
21330
|
+
window.intervalToCheckImgStatus = setInterval(function () {
|
|
21331
|
+
if (_this.whhd()) {
|
|
21332
|
+
clearInterval(window.intervalToCheckImgStatus);
|
|
21333
|
+
}
|
|
21334
|
+
}, 500);
|
|
21335
|
+
(_window2 = window) === null || _window2 === void 0 || (_window2 = _window2.Apxor) === null || _window2 === void 0 || (_window2$logInternalE = _window2.logInternalEvent) === null || _window2$logInternalE === void 0 || _window2$logInternalE.call(_window2, "story_slide_seen", JSON.stringify({
|
|
21336
|
+
config_id: _this.config[_this.position].id,
|
|
21337
|
+
position: _this.position,
|
|
21338
|
+
index: parseInt(_this.progress.indexOf(next)) + 1,
|
|
21339
|
+
view_id: _this.view_id
|
|
21340
|
+
}));
|
|
21341
|
+
var currentTime = Date.now();
|
|
21342
|
+
_this.slideStartTime = currentTime;
|
|
21343
|
+
_this.current_slide_config.media_type === "none" ? _this.currentMediaType = "builder" : _this.currentMediaType = _this.current_slide_config.media_type;
|
|
21344
|
+
(_window$ApxorRTM4 = window.ApxorRTM) === null || _window$ApxorRTM4 === void 0 || _window$ApxorRTM4.logEvent("apx_slide_viewed", {
|
|
21345
|
+
apx_nudge_id: _this.config[_this.position].id,
|
|
21346
|
+
apx_nudge_name: _this.config[_this.position].campaign_name,
|
|
21347
|
+
apx_template_name: "stories",
|
|
21348
|
+
apx_variant_code: _this.config[_this.position].variant_code,
|
|
21349
|
+
apx_slide_number: parseInt(_this.progress.indexOf(next)) + 1,
|
|
21350
|
+
apx_slide_label: _this.current_slide_config.slide_label,
|
|
21351
|
+
apx_slide_type: _this.currentMediaType
|
|
21352
|
+
});
|
|
21353
|
+
};
|
|
21354
|
+
_this.progress.map(function (el) {
|
|
21355
|
+
return el.addEventListener("animationend", playNext, false);
|
|
21356
|
+
});
|
|
21357
|
+
playNext();
|
|
21358
|
+
});
|
|
21359
|
+
_defineProperty(this, "tdcD", function () {
|
|
21360
|
+
document.body.classList.add("slide-right");
|
|
21361
|
+
var animationEndCounter = 0;
|
|
21362
|
+
var onAnimationEnd = function onAnimationEnd() {
|
|
21363
|
+
animationEndCounter++;
|
|
21364
|
+
if (animationEndCounter === 2) {
|
|
21365
|
+
document.body.classList.remove("slide-right");
|
|
21366
|
+
document.body.removeEventListener("animationend", onAnimationEnd);
|
|
21367
|
+
}
|
|
21368
|
+
};
|
|
21369
|
+
document.body.addEventListener("animationend", onAnimationEnd);
|
|
21370
|
+
});
|
|
21371
|
+
_defineProperty(this, "rjYg", function (config) {
|
|
21372
|
+
var _window$Apxor3;
|
|
21373
|
+
var element;
|
|
21374
|
+
var startY;
|
|
21375
|
+
var progress_bar;
|
|
21376
|
+
var slide_header;
|
|
21377
|
+
var slide_details;
|
|
21378
|
+
switch (config.type) {
|
|
21379
|
+
case "cell":
|
|
21380
|
+
case "text":
|
|
21381
|
+
case "button":
|
|
21382
|
+
element = document.createElement(EMBED_CARD_TYPE[config.type]);
|
|
21383
|
+
break;
|
|
21384
|
+
case "img":
|
|
21385
|
+
element = document.createElement(EMBED_CARD_TYPE[config.type]);
|
|
21386
|
+
element.addEventListener("error", function () {
|
|
21387
|
+
element.style.visibility = "hidden";
|
|
21388
|
+
var ele = document.querySelector(".loader-1");
|
|
21389
|
+
_this.continueLoading = true;
|
|
21390
|
+
ele.style.display = "block";
|
|
21391
|
+
ele.style.visibility = "visible";
|
|
21392
|
+
progress_bar = document.querySelector(".progress-container");
|
|
21393
|
+
progress_bar.style.visibility = "hidden";
|
|
21394
|
+
slide_header = document.querySelector(".apx-slide-header");
|
|
21395
|
+
slide_header.style.visibility = "hidden";
|
|
21396
|
+
slide_details = document.querySelector(".slide-details");
|
|
21397
|
+
slide_details.style.visibility = "hidden";
|
|
21398
|
+
});
|
|
21399
|
+
break;
|
|
21400
|
+
case "copy_button":
|
|
21401
|
+
element = document.createElement("div");
|
|
21402
|
+
break;
|
|
21403
|
+
case "floating_button":
|
|
21404
|
+
element = document.createElement("button");
|
|
21405
|
+
break;
|
|
21406
|
+
case "swipe_up_button":
|
|
21407
|
+
element = document.createElement("div");
|
|
21408
|
+
element.style.animation = "moveUpDownButton 1000ms ease-in-out infinite alternate";
|
|
21409
|
+
break;
|
|
21410
|
+
case "swipe_up_icon":
|
|
21411
|
+
element = document.createElement("div");
|
|
21412
|
+
element.innerHTML = "<svg width=\"30\" height=\"26\" viewBox=\"0 0 30 26\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M22.1338 22.1335C21.8994 22.3679 21.5815 22.4995 21.25 22.4995C20.9186 22.4995 20.6007 22.3679 20.3663 22.1335L15 16.7673L9.63377 22.1335C9.51847 22.2529 9.38053 22.3481 9.22803 22.4137C9.07552 22.4792 8.9115 22.5136 8.74552 22.5151C8.57955 22.5165 8.41495 22.4849 8.26133 22.4221C8.10771 22.3592 7.96815 22.2664 7.85078 22.149C7.73341 22.0317 7.6406 21.8921 7.57775 21.7385C7.51489 21.5848 7.48327 21.4202 7.48471 21.2543C7.48615 21.0883 7.52064 20.9243 7.58615 20.7718C7.65166 20.6193 7.74688 20.4813 7.86627 20.366L14.1163 14.116C14.3507 13.8817 14.6686 13.75 15 13.75C15.3315 13.75 15.6494 13.8817 15.8838 14.116L22.1338 20.366C22.3681 20.6004 22.4998 20.9183 22.4998 21.2498C22.4998 21.5812 22.3681 21.8991 22.1338 22.1335ZM22.1338 14.6335C21.8994 14.8679 21.5815 14.9995 21.25 14.9995C20.9186 14.9995 20.6007 14.8679 20.3663 14.6335L15 9.26728L9.63377 14.6335C9.39802 14.8612 9.08227 14.9872 8.75452 14.9844C8.42678 14.9815 8.11326 14.8501 7.8815 14.6183C7.64974 14.3865 7.51828 14.073 7.51543 13.7453C7.51258 13.4175 7.63857 13.1018 7.86627 12.866L14.1163 6.61603C14.3507 6.38169 14.6686 6.25004 15 6.25004C15.3315 6.25004 15.6494 6.38169 15.8838 6.61603L22.1338 12.866C22.3681 13.1004 22.4998 13.4183 22.4998 13.7498C22.4998 14.0812 22.3681 14.3991 22.1338 14.6335Z\"/>\n </svg>";
|
|
21413
|
+
break;
|
|
21414
|
+
case "cross_button":
|
|
21415
|
+
element = document.createElement("div");
|
|
21416
|
+
element.innerHTML = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M5.46995 5.46983C5.61058 5.32938 5.8012 5.25049 5.99995 5.25049C6.1987 5.25049 6.38933 5.32938 6.52995 5.46983L18.53 17.4698C18.6036 17.5385 18.6627 17.6213 18.7037 17.7133C18.7447 17.8053 18.7668 17.9046 18.7685 18.0053C18.7703 18.106 18.7518 18.206 18.7141 18.2994C18.6764 18.3928 18.6202 18.4776 18.549 18.5489C18.4778 18.6201 18.3929 18.6762 18.2995 18.714C18.2062 18.7517 18.1061 18.7702 18.0054 18.7684C17.9047 18.7666 17.8054 18.7446 17.7134 18.7036C17.6214 18.6626 17.5386 18.6035 17.4699 18.5298L5.46995 6.52983C5.3295 6.3892 5.25061 6.19858 5.25061 5.99983C5.25061 5.80108 5.3295 5.61045 5.46995 5.46983Z\" />\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M18.53 5.46983C18.6704 5.61045 18.7493 5.80108 18.7493 5.99983C18.7493 6.19858 18.6704 6.3892 18.53 6.52983L6.52997 18.5298C6.38779 18.6623 6.19975 18.7344 6.00545 18.731C5.81114 18.7276 5.62576 18.6489 5.48835 18.5114C5.35093 18.374 5.27222 18.1887 5.26879 17.9944C5.26537 17.8 5.33749 17.612 5.46997 17.4698L17.47 5.46983C17.6106 5.32938 17.8012 5.25049 18 5.25049C18.1987 5.25049 18.3893 5.32938 18.53 5.46983Z\" />\n </svg>";
|
|
21417
|
+
break;
|
|
21418
|
+
case "unmute_icon":
|
|
21419
|
+
element = document.createElement("div");
|
|
21420
|
+
element.innerHTML = "<svg width=\"25\" height=\"25\" viewBox=\"0 0 25 25\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M12.5 4.16667L10.3229 6.34375L12.5 8.52083M4.44792 3.125L3.125 4.44792L8.05208 9.375H3.125V15.625H7.29167L12.5 20.8333V13.8229L16.9271 18.2604C16.2292 18.7917 15.4479 19.2292 14.5833 19.4792V21.6354C16.0208 21.3021 17.3229 20.6458 18.4167 19.75L20.5521 21.875L21.875 20.5521L12.5 11.1771M19.7917 12.5C19.7917 13.4792 19.5833 14.3958 19.2292 15.25L20.8021 16.8229C21.5051 15.4903 21.8733 14.0067 21.875 12.5C21.875 8.04167 18.75 4.3125 14.5833 3.36458V5.51042C17.5938 6.40625 19.7917 9.19792 19.7917 12.5ZM17.1875 12.5C17.1875 10.6562 16.1458 9.07292 14.5833 8.30208V10.6042L17.1354 13.1562C17.1875 12.9479 17.1875 12.7188 17.1875 12.5Z\" />\n </svg>";
|
|
21421
|
+
break;
|
|
21422
|
+
case "mute_icon":
|
|
21423
|
+
element = document.createElement("div");
|
|
21424
|
+
element.innerHTML = "<svg width=\"30\" height=\"30\" viewBox=\"0 0 25 25\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M12.375 4L10.1979 6.17708L7.92708 9.20833H3V15.4583H7.16667L12.375 20.6667V4Z\" fill=\"currentColor\" />\n <path d=\"M14.4905 20.2167C18.9193 20.2167 22.5095 16.6265 22.5095 12.1977C22.5095 7.76894 18.9193 4.17871 14.4905 4.17871\" stroke=\"currentColor\" fill =\"transparent\" stroke-width=\"1.782\"/>\n <path d=\"M14.4905 15.7618C16.4588 15.7618 18.0545 14.1661 18.0545 12.1978C18.0545 10.2294 16.4588 8.63379 14.4905 8.63379\" stroke=\"currentColor\" fill=\"transparent\" stroke-width=\"1.782\"/>\n </svg>";
|
|
21425
|
+
element.id = "apx-mute-icon";
|
|
21426
|
+
element.addEventListener("touchstart", function (event) {
|
|
21427
|
+
_this.dmyU(event);
|
|
21428
|
+
});
|
|
21429
|
+
break;
|
|
21430
|
+
case "copy_icon":
|
|
21431
|
+
element = document.createElement("div");
|
|
21432
|
+
element.innerHTML = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M15 1.25H10.944C9.106 1.25 7.65 1.25 6.511 1.403C5.339 1.561 4.39 1.893 3.641 2.641C2.893 3.39 2.561 4.339 2.403 5.511C2.25 6.651 2.25 8.106 2.25 9.944V16C2.25002 16.8934 2.56894 17.7575 3.14934 18.4367C3.72974 19.1159 4.53351 19.5657 5.416 19.705C5.553 20.469 5.818 21.121 6.348 21.652C6.95 22.254 7.708 22.512 8.608 22.634C9.475 22.75 10.578 22.75 11.945 22.75H15.055C16.422 22.75 17.525 22.75 18.392 22.634C19.292 22.512 20.05 22.254 20.652 21.652C21.254 21.05 21.512 20.292 21.634 19.392C21.75 18.525 21.75 17.422 21.75 16.055V10.945C21.75 9.578 21.75 8.475 21.634 7.608C21.512 6.708 21.254 5.95 20.652 5.348C20.121 4.818 19.469 4.553 18.705 4.416C18.5657 3.53351 18.1159 2.72974 17.4367 2.14934C16.7575 1.56894 15.8934 1.25002 15 1.25ZM17.13 4.271C16.9779 3.827 16.6909 3.44166 16.3089 3.16893C15.927 2.89619 15.4693 2.74971 15 2.75H11C9.093 2.75 7.739 2.752 6.71 2.89C5.705 3.025 5.125 3.279 4.702 3.702C4.279 4.125 4.025 4.705 3.89 5.711C3.752 6.739 3.75 8.093 3.75 10V16C3.74971 16.4693 3.89619 16.927 4.16892 17.3089C4.44166 17.6908 4.827 17.9779 5.271 18.13C5.25 17.52 5.25 16.83 5.25 16.055V10.945C5.25 9.578 5.25 8.475 5.367 7.608C5.487 6.708 5.747 5.95 6.348 5.348C6.95 4.746 7.708 4.488 8.608 4.367C9.475 4.25 10.578 4.25 11.945 4.25H15.055C15.83 4.25 16.52 4.25 17.13 4.271ZM7.408 6.41C7.685 6.133 8.073 5.953 8.808 5.854C9.562 5.753 10.564 5.751 11.999 5.751H14.999C16.434 5.751 17.435 5.753 18.191 5.854C18.925 5.953 19.313 6.134 19.59 6.41C19.867 6.687 20.047 7.075 20.146 7.81C20.247 8.564 20.249 9.566 20.249 11.001V16.001C20.249 17.436 20.247 18.437 20.146 19.193C20.047 19.927 19.866 20.315 19.59 20.592C19.313 20.869 18.925 21.049 18.19 21.148C17.435 21.249 16.434 21.251 14.999 21.251H11.999C10.564 21.251 9.562 21.249 8.807 21.148C8.073 21.049 7.685 20.868 7.408 20.592C7.131 20.315 6.951 19.927 6.852 19.192C6.751 18.437 6.749 17.436 6.749 16.001V11.001C6.749 9.566 6.751 8.564 6.852 7.809C6.951 7.075 7.132 6.687 7.408 6.41Z\"/>\n </svg>";
|
|
21433
|
+
break;
|
|
21434
|
+
case "video":
|
|
21435
|
+
element = document.createElement("video");
|
|
21436
|
+
element.style.width = "100%";
|
|
21437
|
+
element.style.height = "auto";
|
|
21438
|
+
element.controlsList = "noplaybackrate nodownload nofullscreen";
|
|
21439
|
+
// element.controls = true;
|
|
21440
|
+
element.disablePictureInPicture = true;
|
|
21441
|
+
element.autoplay = true;
|
|
21442
|
+
if (((_window$Apxor3 = window.Apxor) === null || _window$Apxor3 === void 0 ? void 0 : _window$Apxor3.platform) === "ios") {
|
|
21443
|
+
element.playsInline = true;
|
|
21444
|
+
}
|
|
21445
|
+
element.addEventListener("error", function () {
|
|
21446
|
+
element.style.visibility = "hidden";
|
|
21447
|
+
progress_bar = document.querySelector(".progress-container");
|
|
21448
|
+
progress_bar.style.visibility = "hidden";
|
|
21449
|
+
slide_header = document.querySelector(".apx-slide-header");
|
|
21450
|
+
slide_header.style.visibility = "hidden";
|
|
21451
|
+
slide_details = document.querySelector(".slide-details");
|
|
21452
|
+
slide_details.style.visibility = "hidden";
|
|
21453
|
+
});
|
|
21454
|
+
break;
|
|
21455
|
+
default:
|
|
21456
|
+
element = document.createElement(config.type);
|
|
21457
|
+
}
|
|
21458
|
+
if (config.properties) {
|
|
21459
|
+
// eslint-disable-next-line no-unused-vars
|
|
21460
|
+
for (var prop in config.properties) {
|
|
21461
|
+
if (config.type === "img" && prop === "src" || config.type === "img" && prop === "format") continue;
|
|
21462
|
+
if (config.type === "video" && prop === "source") {
|
|
21463
|
+
var sourceElement = document.createElement("source");
|
|
21464
|
+
// eslint-disable-next-line no-unused-vars
|
|
21465
|
+
for (var srcprop in (_config$properties = config.properties) === null || _config$properties === void 0 ? void 0 : _config$properties[prop]) {
|
|
21466
|
+
var _config$properties, _config$properties2;
|
|
21467
|
+
sourceElement[srcprop] = (_config$properties2 = config.properties) === null || _config$properties2 === void 0 || (_config$properties2 = _config$properties2[prop]) === null || _config$properties2 === void 0 ? void 0 : _config$properties2[srcprop];
|
|
21468
|
+
}
|
|
21469
|
+
sourceElement["type"] = "video/mp4";
|
|
21470
|
+
element.appendChild(sourceElement);
|
|
21471
|
+
continue;
|
|
21472
|
+
}
|
|
21473
|
+
element[prop] = config.properties[prop];
|
|
21474
|
+
}
|
|
21475
|
+
}
|
|
21476
|
+
element.classList.add(config._id);
|
|
21477
|
+
if (config.css) {
|
|
21478
|
+
if (config.type == "img") {
|
|
21479
|
+
var styleObject = parseCSS(config.css);
|
|
21480
|
+
var imgStyleObject = removeKeys(styleObject, Object.keys(imgWrapperStylesForStories));
|
|
21481
|
+
var styles;
|
|
21482
|
+
styles = objectToCSS(imgStyleObject);
|
|
21483
|
+
element.style = styles;
|
|
21484
|
+
} else {
|
|
21485
|
+
element.style = config.css;
|
|
21486
|
+
}
|
|
21487
|
+
}
|
|
21488
|
+
if (config.enable_actions && config.actions.length > 0) {
|
|
21489
|
+
var slide_details_to_be_deleted;
|
|
21490
|
+
var updated_action;
|
|
21491
|
+
var updated_swipe_action;
|
|
21492
|
+
config.actions.forEach(function (action) {
|
|
21493
|
+
switch (action.type) {
|
|
21494
|
+
case "activity":
|
|
21495
|
+
case "deeplink":
|
|
21496
|
+
element.ontouchstart = function (e) {
|
|
21497
|
+
var _window$ApxorRTM5;
|
|
21498
|
+
_this.redirectionFlag = true;
|
|
21499
|
+
e.stopPropagation();
|
|
21500
|
+
updated_action = _objectSpread2(_objectSpread2({}, action), {}, {
|
|
21501
|
+
display_type: "stories"
|
|
21502
|
+
});
|
|
21503
|
+
window.Apxor.redirect(JSON.stringify(updated_action));
|
|
21504
|
+
var progress = Array.from(document.querySelectorAll(".progress"));
|
|
21505
|
+
var activeIndex = progress.findIndex(function (el) {
|
|
21506
|
+
return el.classList.contains("active");
|
|
21507
|
+
});
|
|
21508
|
+
_this.current_slide_config.media_type === "none" ? _this.currentMediaType = "builder" : _this.currentMediaType = _this.current_slide_config.media_type;
|
|
21509
|
+
var current_time = Date.now();
|
|
21510
|
+
var time_taken;
|
|
21511
|
+
time_taken = (current_time - _this.slideStartTime) / 1000;
|
|
21512
|
+
(_window$ApxorRTM5 = window.ApxorRTM) === null || _window$ApxorRTM5 === void 0 || _window$ApxorRTM5.logEvent("apx_slide_interaction", {
|
|
21513
|
+
apx_nudge_id: _this.config[_this.position].id,
|
|
21514
|
+
apx_nudge_name: _this.config[_this.position].campaign_name,
|
|
21515
|
+
apx_template_name: "stories",
|
|
21516
|
+
apx_variant_code: _this.config[_this.position].variant_code,
|
|
21517
|
+
apx_slide_number: activeIndex + 1,
|
|
21518
|
+
apx_slide_label: _this.current_slide_config.slide_label,
|
|
21519
|
+
apx_slide_type: _this.currentMediaType,
|
|
21520
|
+
apx_interaction_type: "cta-clicked",
|
|
21521
|
+
apx_time_taken: time_taken
|
|
21522
|
+
});
|
|
21523
|
+
};
|
|
21524
|
+
break;
|
|
21525
|
+
case "swipe_redirect_deeplink":
|
|
21526
|
+
case "swipe_redirect_activity":
|
|
21527
|
+
updated_swipe_action = _objectSpread2(_objectSpread2({}, action), {}, {
|
|
21528
|
+
display_type: "stories"
|
|
21529
|
+
});
|
|
21530
|
+
_this.storyContainer.addEventListener("touchstart", function (event) {
|
|
21531
|
+
event.stopPropagation();
|
|
21532
|
+
startY = event.touches[0].clientY;
|
|
21533
|
+
_this.startY = startY;
|
|
21534
|
+
_this.swipe_action = updated_swipe_action;
|
|
21535
|
+
});
|
|
21536
|
+
_this.storyContainer.addEventListener("touchend", _this.boundSwipeUpHandling);
|
|
21537
|
+
break;
|
|
21538
|
+
case "dismiss":
|
|
21539
|
+
element.ontouchstart = function (e) {
|
|
21540
|
+
var _window$ApxorRTM6, _window3, _window3$logInternalE;
|
|
21541
|
+
e.stopPropagation();
|
|
21542
|
+
_this.dismissFlag = true;
|
|
21543
|
+
slide_details_to_be_deleted = document.querySelector(".slide-details");
|
|
21544
|
+
var childElements = slide_details_to_be_deleted.querySelectorAll("video");
|
|
21545
|
+
for (var i = 0; i < childElements.length; i++) {
|
|
21546
|
+
var child = childElements[i];
|
|
21547
|
+
if (child.tagName.toLowerCase() === "video") {
|
|
21548
|
+
child.muted = true;
|
|
21549
|
+
}
|
|
21550
|
+
}
|
|
21551
|
+
var progress = Array.from(document.querySelectorAll(".progress"));
|
|
21552
|
+
var activeIndex = progress.findIndex(function (el) {
|
|
21553
|
+
return el.classList.contains("active");
|
|
21554
|
+
});
|
|
21555
|
+
_this.current_slide_config.media_type === "none" ? _this.currentMediaType = "builder" : _this.currentMediaType = _this.current_slide_config.media_type;
|
|
21556
|
+
(_window$ApxorRTM6 = window.ApxorRTM) === null || _window$ApxorRTM6 === void 0 || _window$ApxorRTM6.logEvent("apx_slide_closed", {
|
|
21557
|
+
apx_nudge_id: _this.config[_this.position].id,
|
|
21558
|
+
apx_nudge_name: _this.config[_this.position].campaign_name,
|
|
21559
|
+
apx_template_name: "stories",
|
|
21560
|
+
apx_variant_code: _this.config[_this.position].variant_code,
|
|
21561
|
+
apx_slide_number: activeIndex + 1,
|
|
21562
|
+
apx_slide_label: _this.current_slide_config.slide_label,
|
|
21563
|
+
apx_slide_type: _this.currentMediaType
|
|
21564
|
+
});
|
|
21565
|
+
(_window3 = window) === null || _window3 === void 0 || (_window3 = _window3.Apxor) === null || _window3 === void 0 || (_window3$logInternalE = _window3.logInternalEvent) === null || _window3$logInternalE === void 0 || _window3$logInternalE.call(_window3, "story_slides_closed");
|
|
21566
|
+
return;
|
|
21567
|
+
};
|
|
21568
|
+
return;
|
|
21569
|
+
case "never":
|
|
21570
|
+
element.onclick = function () {
|
|
21571
|
+
window.Apxor.neverShow(_this.config[_this.position].id, _this.name, "IN_APP");
|
|
21572
|
+
window.Apxor.logActionEvent("never_show_clicked", _this.config[_this.position].id, _this.name);
|
|
21573
|
+
};
|
|
21574
|
+
break;
|
|
21575
|
+
case "copy-content":
|
|
21576
|
+
element.ontouchstart = function (e) {
|
|
21577
|
+
var _window4, _window4$logInternalE, _window$ApxorRTM7;
|
|
21578
|
+
e.stopPropagation();
|
|
21579
|
+
e.stopImmediatePropagation();
|
|
21580
|
+
e.preventDefault();
|
|
21581
|
+
var textToCopy = action.content;
|
|
21582
|
+
(_window4 = window) === null || _window4 === void 0 || (_window4 = _window4.Apxor) === null || _window4 === void 0 || (_window4$logInternalE = _window4.logInternalEvent) === null || _window4$logInternalE === void 0 || _window4$logInternalE.call(_window4, "TextCopied", JSON.stringify({
|
|
21583
|
+
text_to_copy: textToCopy.toString()
|
|
21584
|
+
}));
|
|
21585
|
+
var progress = Array.from(document.querySelectorAll(".progress"));
|
|
21586
|
+
var activeIndex = progress.findIndex(function (el) {
|
|
21587
|
+
return el.classList.contains("active");
|
|
21588
|
+
});
|
|
21589
|
+
_this.current_slide_config.media_type === "none" ? _this.currentMediaType = "builder" : _this.currentMediaType = _this.current_slide_config.media_type;
|
|
21590
|
+
var current_time = Date.now();
|
|
21591
|
+
var time_taken;
|
|
21592
|
+
time_taken = (current_time - _this.slideStartTime) / 1000;
|
|
21593
|
+
(_window$ApxorRTM7 = window.ApxorRTM) === null || _window$ApxorRTM7 === void 0 || _window$ApxorRTM7.logEvent("apx_slide_interaction", {
|
|
21594
|
+
apx_nudge_id: _this.config[_this.position].id,
|
|
21595
|
+
apx_nudge_name: _this.config[_this.position].campaign_name,
|
|
21596
|
+
apx_template_name: "stories",
|
|
21597
|
+
apx_variant_code: _this.config[_this.position].variant_code,
|
|
21598
|
+
apx_slide_number: activeIndex + 1,
|
|
21599
|
+
apx_slide_label: _this.current_slide_config.slide_label,
|
|
21600
|
+
apx_slide_type: _this.currentMediaType,
|
|
21601
|
+
apx_interaction_type: "cta-clicked",
|
|
21602
|
+
apx_time_taken: time_taken
|
|
21603
|
+
});
|
|
21604
|
+
return;
|
|
21605
|
+
};
|
|
21606
|
+
break;
|
|
21607
|
+
case "log-app-event":
|
|
21608
|
+
element.onclick = function () {
|
|
21609
|
+
window.Apxor.logAppEvent(action === null || action === void 0 ? void 0 : action.event_name);
|
|
21610
|
+
};
|
|
21611
|
+
break;
|
|
21612
|
+
case "log-client-event":
|
|
21613
|
+
element.onclick = function () {
|
|
21614
|
+
window.Apxor.logClientEvent(action === null || action === void 0 ? void 0 : action.event_name);
|
|
21615
|
+
};
|
|
21616
|
+
}
|
|
21617
|
+
});
|
|
21618
|
+
}
|
|
21619
|
+
if (config.absolute_position_children && config.absolute_position_children.length > 0) {
|
|
21620
|
+
config.absolute_position_children.forEach(function (childConfig) {
|
|
21621
|
+
var childElement = _this.rjYg(childConfig);
|
|
21622
|
+
element.appendChild(childElement);
|
|
21623
|
+
});
|
|
21624
|
+
}
|
|
21625
|
+
|
|
21626
|
+
// Process children
|
|
21627
|
+
if (config.children && config.children.length > 0) {
|
|
21628
|
+
config.children.forEach(function (childConfig) {
|
|
21629
|
+
var childElement = _this.rjYg(childConfig);
|
|
21630
|
+
element.appendChild(childElement);
|
|
21631
|
+
});
|
|
21632
|
+
}
|
|
21633
|
+
if (config.type === "img") {
|
|
21634
|
+
var _config$properties3, _config$properties4, _window5, _window5$getFilePath;
|
|
21635
|
+
var src = config === null || config === void 0 || (_config$properties3 = config.properties) === null || _config$properties3 === void 0 ? void 0 : _config$properties3.src;
|
|
21636
|
+
var format = config === null || config === void 0 || (_config$properties4 = config.properties) === null || _config$properties4 === void 0 ? void 0 : _config$properties4.format;
|
|
21637
|
+
element["src"] = src && format ? ((_window5 = window) === null || _window5 === void 0 || (_window5 = _window5.Apxor) === null || _window5 === void 0 || (_window5$getFilePath = _window5.getFilePath) === null || _window5$getFilePath === void 0 ? void 0 : _window5$getFilePath.call(_window5, _this.config[_this.position].id, src, format)) || src : src;
|
|
21638
|
+
_this.imageElements.push(element);
|
|
21639
|
+
var imgWrapper = document.createElement("div");
|
|
21640
|
+
var _styleObject = parseCSS(config.css);
|
|
21641
|
+
Object.keys(imgWrapperStylesForStories).forEach(function (prop) {
|
|
21642
|
+
if (prop in _styleObject) {
|
|
21643
|
+
imgWrapper.style[imgWrapperStylesForStories[prop]] = _styleObject[prop];
|
|
21644
|
+
if (prop === "width") {
|
|
21645
|
+
element.style.width = _styleObject[prop];
|
|
21646
|
+
}
|
|
21647
|
+
}
|
|
21648
|
+
});
|
|
21649
|
+
imgWrapper.appendChild(element);
|
|
21650
|
+
return imgWrapper;
|
|
21651
|
+
} else if (config.type === "video") {
|
|
21652
|
+
_this.videoElements.push(element);
|
|
21653
|
+
}
|
|
21654
|
+
return element;
|
|
21655
|
+
});
|
|
21656
|
+
_defineProperty(this, "dmyU", function (event) {
|
|
21657
|
+
var slide_details_to_be_deleted;
|
|
21658
|
+
var mute_child_elements;
|
|
21659
|
+
var unmute_child_elements;
|
|
21660
|
+
_this.muteElement = document.getElementById("apx-mute-icon");
|
|
21661
|
+
event.stopPropagation();
|
|
21662
|
+
if (_this.videoAudioState === "unmute") {
|
|
21663
|
+
_this.muteElement.innerHTML = "<svg width=\"30\" height=\"30\" viewBox=\"0 0 25 25\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M12.5 4.16667L10.3229 6.34375L12.5 8.52083M4.44792 3.125L3.125 4.44792L8.05208 9.375H3.125V15.625H7.29167L12.5 20.8333V13.8229L16.9271 18.2604C16.2292 18.7917 15.4479 19.2292 14.5833 19.4792V21.6354C16.0208 21.3021 17.3229 20.6458 18.4167 19.75L20.5521 21.875L21.875 20.5521L12.5 11.1771M19.7917 12.5C19.7917 13.4792 19.5833 14.3958 19.2292 15.25L20.8021 16.8229C21.5051 15.4903 21.8733 14.0067 21.875 12.5C21.875 8.04167 18.75 4.3125 14.5833 3.36458V5.51042C17.5938 6.40625 19.7917 9.19792 19.7917 12.5ZM17.1875 12.5C17.1875 10.6562 16.1458 9.07292 14.5833 8.30208V10.6042L17.1354 13.1562C17.1875 12.9479 17.1875 12.7188 17.1875 12.5Z\" />\n </svg>";
|
|
21664
|
+
_this.videoAudioState = "mute";
|
|
21665
|
+
slide_details_to_be_deleted = document.querySelector(".slide-details");
|
|
21666
|
+
mute_child_elements = slide_details_to_be_deleted.querySelectorAll("video");
|
|
21667
|
+
for (var i = 0; i < mute_child_elements.length; i++) {
|
|
21668
|
+
var child = mute_child_elements[i];
|
|
21669
|
+
if (child.tagName.toLowerCase() === "video") {
|
|
21670
|
+
child.muted = true;
|
|
21671
|
+
}
|
|
21672
|
+
}
|
|
21673
|
+
} else if (_this.videoAudioState === "mute") {
|
|
21674
|
+
_this.muteElement.innerHTML = "<svg width=\"30\" height=\"30\" viewBox=\"0 0 25 25\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M12.375 4L10.1979 6.17708L7.92708 9.20833H3V15.4583H7.16667L12.375 20.6667V4Z\" fill=\"currentColor\" />\n <path d=\"M14.4905 20.2167C18.9193 20.2167 22.5095 16.6265 22.5095 12.1977C22.5095 7.76894 18.9193 4.17871 14.4905 4.17871\" stroke=\"currentColor\" fill =\"transparent\" stroke-width=\"1.782\"/>\n <path d=\"M14.4905 15.7618C16.4588 15.7618 18.0545 14.1661 18.0545 12.1978C18.0545 10.2294 16.4588 8.63379 14.4905 8.63379\" stroke=\"currentColor\" fill=\"transparent\" stroke-width=\"1.782\"/>\n </svg>";
|
|
21675
|
+
_this.videoAudioState = "unmute";
|
|
21676
|
+
slide_details_to_be_deleted = document.querySelector(".slide-details");
|
|
21677
|
+
unmute_child_elements = slide_details_to_be_deleted.querySelectorAll("video");
|
|
21678
|
+
for (var j = 0; j < unmute_child_elements.length; j++) {
|
|
21679
|
+
var child2 = unmute_child_elements[j];
|
|
21680
|
+
if (child2.tagName.toLowerCase() === "video") {
|
|
21681
|
+
child2.muted = false;
|
|
21682
|
+
}
|
|
21683
|
+
}
|
|
21684
|
+
// this.muteElement.addEventListener("touchstart", (event) => {
|
|
21685
|
+
// event.stopPropagation();
|
|
21686
|
+
// this.dmyU(event);
|
|
21687
|
+
// });
|
|
21688
|
+
}
|
|
21689
|
+
});
|
|
21690
|
+
_defineProperty(this, "UIoc", function () {
|
|
21691
|
+
var tapTimeout;
|
|
21692
|
+
var tapThreshold = 0.5; // Assuming 0.5 is the center of the WebView
|
|
21693
|
+
var longPressDuration = 200;
|
|
21694
|
+
_this.storyContainer.addEventListener("touchstart", function (event) {
|
|
21695
|
+
_this.gestureTouch = true;
|
|
21696
|
+
var touchX = event.touches[0].clientX - _this.storyContainer.getBoundingClientRect().left;
|
|
21697
|
+
var webViewWidth = _this.storyContainer.offsetWidth;
|
|
21698
|
+
var relativeX = touchX / webViewWidth;
|
|
21699
|
+
clearTimeout(tapTimeout);
|
|
21700
|
+
tapTimeout = setTimeout(function () {
|
|
21701
|
+
if (!_this.swipe_up_redirect) {
|
|
21702
|
+
var _window$ApxorRTM8;
|
|
21703
|
+
var progress = Array.from(document.querySelectorAll(".progress"));
|
|
21704
|
+
var activeIndex = progress.findIndex(function (el) {
|
|
21705
|
+
return el.classList.contains("active");
|
|
21706
|
+
});
|
|
21707
|
+
progress[activeIndex].style.animationPlayState = "paused";
|
|
21708
|
+
_this.slidePaused = true;
|
|
21709
|
+
_this.current_slide_config.media_type === "none" ? _this.currentMediaType = "builder" : _this.currentMediaType = _this.current_slide_config.media_type;
|
|
21710
|
+
var current_time = Date.now();
|
|
21711
|
+
var time_taken;
|
|
21712
|
+
time_taken = (current_time - _this.slideStartTime) / 1000;
|
|
21713
|
+
(_window$ApxorRTM8 = window.ApxorRTM) === null || _window$ApxorRTM8 === void 0 || _window$ApxorRTM8.logEvent("apx_slide_paused", {
|
|
21714
|
+
apx_nudge_id: _this.config[_this.position].id,
|
|
21715
|
+
apx_nudge_name: _this.config[_this.position].campaign_name,
|
|
21716
|
+
apx_template_name: "stories",
|
|
21717
|
+
apx_variant_code: _this.config[_this.position].variant_code,
|
|
21718
|
+
apx_slide_number: activeIndex + 1,
|
|
21719
|
+
apx_slide_label: _this.current_slide_config.slide_label,
|
|
21720
|
+
apx_slide_type: _this.currentMediaType,
|
|
21721
|
+
apx_time_taken: time_taken
|
|
21722
|
+
});
|
|
21723
|
+
var slide_details_to_be_deleted;
|
|
21724
|
+
slide_details_to_be_deleted = document.querySelector(".slide-details");
|
|
21725
|
+
var childElements = slide_details_to_be_deleted.querySelectorAll("video");
|
|
21726
|
+
for (var i = 0; i < childElements.length; i++) {
|
|
21727
|
+
var child = childElements[i];
|
|
21728
|
+
if (child.tagName.toLowerCase() === "video") {
|
|
21729
|
+
child.pause();
|
|
21730
|
+
}
|
|
21731
|
+
}
|
|
21732
|
+
} else {
|
|
21733
|
+
_this.swipe_up_redirect = false;
|
|
21734
|
+
}
|
|
21735
|
+
}, longPressDuration);
|
|
21736
|
+
event.target.dataset.relativeX = relativeX;
|
|
21737
|
+
});
|
|
21738
|
+
_this.storyContainer.addEventListener("touchend", function (event) {
|
|
21739
|
+
setTimeout(function () {
|
|
21740
|
+
if (_this.gestureTouch && !_this.swipeUpTouch) {
|
|
21741
|
+
_this.gestureTouch = false;
|
|
21742
|
+
clearTimeout(tapTimeout);
|
|
21743
|
+
var progress = Array.from(document.querySelectorAll(".progress"));
|
|
21744
|
+
var activeIndex = progress.findIndex(function (el) {
|
|
21745
|
+
return el.classList.contains("active");
|
|
21746
|
+
});
|
|
21747
|
+
progress[activeIndex].style.animationPlayState = "running";
|
|
21748
|
+
if (_this.slidePaused) {
|
|
21749
|
+
var _window$ApxorRTM9;
|
|
21750
|
+
_this.current_slide_config.media_type === "none" ? _this.currentMediaType = "builder" : _this.currentMediaType = _this.current_slide_config.media_type;
|
|
21751
|
+
var current_time = Date.now();
|
|
21752
|
+
var time_taken;
|
|
21753
|
+
time_taken = (current_time - _this.slideStartTime) / 1000;
|
|
21754
|
+
(_window$ApxorRTM9 = window.ApxorRTM) === null || _window$ApxorRTM9 === void 0 || _window$ApxorRTM9.logEvent("apx_slide_resumed", {
|
|
21755
|
+
apx_nudge_id: _this.config[_this.position].id,
|
|
21756
|
+
apx_nudge_name: _this.config[_this.position].campaign_name,
|
|
21757
|
+
apx_template_name: "stories",
|
|
21758
|
+
apx_variant_code: _this.config[_this.position].variant_code,
|
|
21759
|
+
apx_slide_number: activeIndex + 1,
|
|
21760
|
+
apx_slide_label: _this.current_slide_config.slide_label,
|
|
21761
|
+
apx_slide_type: _this.currentMediaType,
|
|
21762
|
+
apx_time_taken: time_taken
|
|
21763
|
+
});
|
|
21764
|
+
_this.slidePaused = false;
|
|
21765
|
+
}
|
|
21766
|
+
var slide_details_to_be_deleted;
|
|
21767
|
+
slide_details_to_be_deleted = document.querySelector(".slide-details");
|
|
21768
|
+
var childElements = slide_details_to_be_deleted.querySelectorAll("video");
|
|
21769
|
+
for (var i = 0; i < childElements.length; i++) {
|
|
21770
|
+
var child = childElements[i];
|
|
21771
|
+
if (child.tagName.toLowerCase() === "video") {
|
|
21772
|
+
child.play();
|
|
21773
|
+
}
|
|
21774
|
+
}
|
|
21775
|
+
if (event.timeStamp - event.target.dataset.touchStartTime < longPressDuration) {
|
|
21776
|
+
var relativeX = event.target.dataset.relativeX;
|
|
21777
|
+
if (!_this.swipeDownFlag) {
|
|
21778
|
+
if (relativeX > tapThreshold) {
|
|
21779
|
+
var _slide_details_to_be_deleted = document.querySelector(".slide-details");
|
|
21780
|
+
var _childElements = _slide_details_to_be_deleted.children;
|
|
21781
|
+
for (var _i = 0; _i < _childElements.length; _i++) {
|
|
21782
|
+
var _child = _childElements[_i];
|
|
21783
|
+
if (_child.tagName.toLowerCase() === "video") {
|
|
21784
|
+
_child.muted = true;
|
|
21785
|
+
}
|
|
21786
|
+
}
|
|
21787
|
+
if (!_this.dismissFlag && !_this.swipeDownFlag) {
|
|
21788
|
+
if (!_this.swipeLeft && !_this.swipeRight) {
|
|
21789
|
+
_this.moveToNextSlide();
|
|
21790
|
+
} else {
|
|
21791
|
+
_this.swipeLeft = false;
|
|
21792
|
+
_this.swipeRight = false;
|
|
21793
|
+
}
|
|
21794
|
+
}
|
|
21795
|
+
} else if (relativeX < tapThreshold) {
|
|
21796
|
+
if (!_this.swipeLeft && !_this.swipeRight) {
|
|
21797
|
+
_this.moveToPreviousSlide();
|
|
21798
|
+
} else {
|
|
21799
|
+
_this.swipeLeft = false;
|
|
21800
|
+
_this.swipeRight = false;
|
|
21801
|
+
}
|
|
21802
|
+
}
|
|
21803
|
+
}
|
|
21804
|
+
}
|
|
21805
|
+
} else {
|
|
21806
|
+
_this.swipeUpTouch = false;
|
|
21807
|
+
}
|
|
21808
|
+
}, 50);
|
|
21809
|
+
});
|
|
21810
|
+
_this.storyContainer.addEventListener("touchstart", function (event) {
|
|
21811
|
+
event.target.dataset.touchStartTime = event.timeStamp;
|
|
21812
|
+
});
|
|
21813
|
+
});
|
|
21814
|
+
_defineProperty(this, "xLnm", function () {
|
|
21815
|
+
var startY, startX;
|
|
21816
|
+
_this.storyContainer.addEventListener("touchstart", function (event) {
|
|
21817
|
+
_this.swipeTouch = true;
|
|
21818
|
+
startX = event.touches[0].clientX;
|
|
21819
|
+
startY = event.touches[0].clientY;
|
|
21820
|
+
});
|
|
21821
|
+
_this.storyContainer.addEventListener("touchend", function (event) {
|
|
21822
|
+
setTimeout(function () {
|
|
21823
|
+
if (_this.swipeTouch && !_this.swipeUpTouch) {
|
|
21824
|
+
var endX = event.changedTouches[0].clientX;
|
|
21825
|
+
var endY = event.changedTouches[0].clientY;
|
|
21826
|
+
var deltaY = startY - endY;
|
|
21827
|
+
var deltaX = startX - endX;
|
|
21828
|
+
event.stopPropagation();
|
|
21829
|
+
event.preventDefault();
|
|
21830
|
+
var progress = Array.from(document.querySelectorAll(".progress"));
|
|
21831
|
+
var activeIndex = progress.findIndex(function (el) {
|
|
21832
|
+
return el.classList.contains("active");
|
|
21833
|
+
});
|
|
21834
|
+
_this.swipeTouch = false;
|
|
21835
|
+
if (deltaY < -50 && Math.abs(deltaY) > Math.abs(deltaX)) {
|
|
21836
|
+
var _window6, _window6$logInternalE;
|
|
21837
|
+
_this.swipeDownFlag = true;
|
|
21838
|
+
var slide_details_to_be_deleted;
|
|
21839
|
+
slide_details_to_be_deleted = document.querySelector(".slide-details");
|
|
21840
|
+
var childElements = slide_details_to_be_deleted.querySelectorAll("video");
|
|
21841
|
+
for (var i = 0; i < childElements.length; i++) {
|
|
21842
|
+
var child = childElements[i];
|
|
21843
|
+
if (child.tagName.toLowerCase() === "video") {
|
|
21844
|
+
child.muted = true;
|
|
21845
|
+
}
|
|
21846
|
+
}
|
|
21847
|
+
(_window6 = window) === null || _window6 === void 0 || (_window6 = _window6.Apxor) === null || _window6 === void 0 || (_window6$logInternalE = _window6.logInternalEvent) === null || _window6$logInternalE === void 0 || _window6$logInternalE.call(_window6, "story_slides_closed");
|
|
21848
|
+
return;
|
|
21849
|
+
} else if (deltaX > 50 && Math.abs(deltaX) > Math.abs(deltaY)) {
|
|
21850
|
+
var _progress$activeIndex, _progress$activeIndex2, _window8, _window8$logInternalE, _window$ApxorRTM10, _window$ApxorRTM11;
|
|
21851
|
+
_this.swipeRight = true;
|
|
21852
|
+
if (_this.position === _this.config.length - 1) {
|
|
21853
|
+
var _window7, _window7$logInternalE;
|
|
21854
|
+
// If it's the last group, log event and return
|
|
21855
|
+
(_window7 = window) === null || _window7 === void 0 || (_window7 = _window7.Apxor) === null || _window7 === void 0 || (_window7$logInternalE = _window7.logInternalEvent) === null || _window7$logInternalE === void 0 || _window7$logInternalE.call(_window7, "story_slides_closed");
|
|
21856
|
+
var _slide_details_to_be_deleted2 = document.querySelector(".slide-details");
|
|
21857
|
+
var mute_child_elements = _slide_details_to_be_deleted2.querySelectorAll("video");
|
|
21858
|
+
for (var j = 0; j < mute_child_elements.length; j++) {
|
|
21859
|
+
var child1 = mute_child_elements[j];
|
|
21860
|
+
if (child1.tagName.toLowerCase() === "video") {
|
|
21861
|
+
child1.muted = true;
|
|
21862
|
+
}
|
|
21863
|
+
}
|
|
21864
|
+
return;
|
|
21865
|
+
}
|
|
21866
|
+
_this.position++;
|
|
21867
|
+
_this.progress_bar = new ProgressBar$1(_this.config[_this.position].progress_bar);
|
|
21868
|
+
_this.slides = _this.config[_this.position].slides;
|
|
21869
|
+
var slideToStart;
|
|
21870
|
+
if (_this.slides.length === _this.config[_this.position].slides_seen) {
|
|
21871
|
+
slideToStart = 0;
|
|
21872
|
+
} else if (_this.config[_this.position].slides_seen === 0) {
|
|
21873
|
+
slideToStart = 0;
|
|
21874
|
+
} else {
|
|
21875
|
+
slideToStart = _this.config[_this.position].slides_seen;
|
|
21876
|
+
}
|
|
21877
|
+
(_progress$activeIndex = progress[activeIndex]) === null || _progress$activeIndex === void 0 || _progress$activeIndex.classList.remove("active");
|
|
21878
|
+
(_progress$activeIndex2 = progress[activeIndex]) === null || _progress$activeIndex2 === void 0 || _progress$activeIndex2.classList.add("passed");
|
|
21879
|
+
var progressContainer = document.querySelector(".progress-container");
|
|
21880
|
+
progressContainer.innerHTML = "";
|
|
21881
|
+
_this.slides.forEach(function (slide, index) {
|
|
21882
|
+
var progressSlide = document.createElement("div");
|
|
21883
|
+
progressSlide.classList.add("slide".concat(index));
|
|
21884
|
+
progressSlide.classList.add("progress");
|
|
21885
|
+
var slide_duration = slide.duration / 1000;
|
|
21886
|
+
progressSlide.style.animationDuration = "".concat(slide_duration, "s");
|
|
21887
|
+
progressContainer.appendChild(progressSlide);
|
|
21888
|
+
});
|
|
21889
|
+
var progressSegments = progressContainer.querySelectorAll(".progress");
|
|
21890
|
+
for (var _i2 = 0; _i2 < slideToStart; _i2++) {
|
|
21891
|
+
var _progressSegments$_i;
|
|
21892
|
+
(_progressSegments$_i = progressSegments[_i2]) === null || _progressSegments$_i === void 0 || _progressSegments$_i.classList.add("passed");
|
|
21893
|
+
}
|
|
21894
|
+
progressSegments[slideToStart].classList.add("active");
|
|
21895
|
+
Array.from(progressSegments).map(function (el) {
|
|
21896
|
+
return el.addEventListener("animationend", function () {
|
|
21897
|
+
_this.moveToNextSlide();
|
|
21898
|
+
}, false);
|
|
21899
|
+
});
|
|
21900
|
+
_this._getStoriesStyles();
|
|
21901
|
+
_this.storyContainer.removeEventListener("touchend", _this.boundSwipeUpHandling);
|
|
21902
|
+
_this.updateSlideDetails(0);
|
|
21903
|
+
(_window8 = window) === null || _window8 === void 0 || (_window8 = _window8.Apxor) === null || _window8 === void 0 || (_window8$logInternalE = _window8.logInternalEvent) === null || _window8$logInternalE === void 0 || _window8$logInternalE.call(_window8, "story_slide_seen", JSON.stringify({
|
|
21904
|
+
config_id: _this.config[_this.position].id,
|
|
21905
|
+
position: _this.position,
|
|
21906
|
+
index: slideToStart + 1,
|
|
21907
|
+
view_id: _this.view_id
|
|
21908
|
+
}));
|
|
21909
|
+
(_window$ApxorRTM10 = window.ApxorRTM) === null || _window$ApxorRTM10 === void 0 || _window$ApxorRTM10.logEvent("apx_slide_viewed", {
|
|
21910
|
+
apx_slide_number: slideToStart + 1,
|
|
21911
|
+
apx_slide_label: _this.current_slide_config.slide_label,
|
|
21912
|
+
apx_slide_type: _this.currentMediaType,
|
|
21913
|
+
apx_template_name: "stories",
|
|
21914
|
+
apx_nudge_id: _this.config[_this.position].id,
|
|
21915
|
+
apx_nudge_name: _this.config[_this.position].campaign_name,
|
|
21916
|
+
apx_variant_code: _this.config[_this.position].variant_code
|
|
21917
|
+
});
|
|
21918
|
+
var current_time = Date.now();
|
|
21919
|
+
var time_taken;
|
|
21920
|
+
time_taken = (current_time - _this.slideStartTime) / 1000;
|
|
21921
|
+
(_window$ApxorRTM11 = window.ApxorRTM) === null || _window$ApxorRTM11 === void 0 || _window$ApxorRTM11.logEvent("apx_story_changed", {
|
|
21922
|
+
apx_nudge_id: _this.config[_this.position].id,
|
|
21923
|
+
apx_nudge_name: _this.config[_this.position].campaign_name,
|
|
21924
|
+
apx_template_name: "stories",
|
|
21925
|
+
apx_variant_code: _this.config[_this.position].variant_code,
|
|
21926
|
+
apx_slide_number: slideToStart + 1,
|
|
21927
|
+
apx_slide_label: _this.current_slide_config.slide_label,
|
|
21928
|
+
apx_slide_type: _this.currentMediaType,
|
|
21929
|
+
apx_change_action: "swiped-right",
|
|
21930
|
+
apx_time_taken: time_taken
|
|
21931
|
+
});
|
|
21932
|
+
var currentTime = Date.now();
|
|
21933
|
+
_this.slideStartTime = currentTime;
|
|
21934
|
+
return;
|
|
21935
|
+
} else if (deltaX < -50 && Math.abs(deltaX) > Math.abs(deltaY)) {
|
|
21936
|
+
var _progress$activeIndex3, _progress$activeIndex4, _window9, _window9$logInternalE, _window$ApxorRTM12, _window$ApxorRTM13;
|
|
21937
|
+
_this.swipeLeft = true;
|
|
21938
|
+
if (activeIndex === 0 && _this.position === 0) {
|
|
21939
|
+
return;
|
|
21940
|
+
}
|
|
21941
|
+
if (_this.position === 0) {
|
|
21942
|
+
return;
|
|
21943
|
+
}
|
|
21944
|
+
_this.position--;
|
|
21945
|
+
_this.progress_bar = new ProgressBar$1(_this.config[_this.position].progress_bar);
|
|
21946
|
+
_this.slides = _this.config[_this.position].slides;
|
|
21947
|
+
var lastSlideIndex;
|
|
21948
|
+
if (_this.slides.length === _this.config[_this.position].slides_seen) {
|
|
21949
|
+
lastSlideIndex = 0;
|
|
21950
|
+
} else if (_this.config[_this.position].slides_seen === 0) {
|
|
21951
|
+
lastSlideIndex = 0;
|
|
21952
|
+
} else {
|
|
21953
|
+
lastSlideIndex = _this.config[_this.position].slides_seen;
|
|
21954
|
+
}
|
|
21955
|
+
(_progress$activeIndex3 = progress[activeIndex]) === null || _progress$activeIndex3 === void 0 || _progress$activeIndex3.classList.remove("active");
|
|
21956
|
+
(_progress$activeIndex4 = progress[activeIndex]) === null || _progress$activeIndex4 === void 0 || _progress$activeIndex4.classList.add("passed");
|
|
21957
|
+
var _progressContainer2 = document.querySelector(".progress-container");
|
|
21958
|
+
_progressContainer2.innerHTML = "";
|
|
21959
|
+
_this.slides.forEach(function (slide, index) {
|
|
21960
|
+
var progressSlide = document.createElement("div");
|
|
21961
|
+
progressSlide.classList.add("slide".concat(index));
|
|
21962
|
+
progressSlide.classList.add("progress");
|
|
21963
|
+
var slide_duration = slide.duration / 1000;
|
|
21964
|
+
progressSlide.style.animationDuration = "".concat(slide_duration, "s");
|
|
21965
|
+
_progressContainer2.appendChild(progressSlide);
|
|
21966
|
+
});
|
|
21967
|
+
var _progressSegments2 = _progressContainer2.querySelectorAll(".progress");
|
|
21968
|
+
if (_progressSegments2.length > 0) {
|
|
21969
|
+
for (var _i3 = 0; _i3 < lastSlideIndex; _i3++) {
|
|
21970
|
+
var _progressSegments2$_i;
|
|
21971
|
+
(_progressSegments2$_i = _progressSegments2[_i3]) === null || _progressSegments2$_i === void 0 || _progressSegments2$_i.classList.add("passed");
|
|
21972
|
+
}
|
|
21973
|
+
_progressSegments2[lastSlideIndex].classList.add("active");
|
|
21974
|
+
}
|
|
21975
|
+
Array.from(_progressSegments2).map(function (el) {
|
|
21976
|
+
return el.addEventListener("animationend", function () {
|
|
21977
|
+
_this.moveToNextSlide();
|
|
21978
|
+
}, false);
|
|
21979
|
+
});
|
|
21980
|
+
_this._getStoriesStyles();
|
|
21981
|
+
_this.storyContainer.removeEventListener("touchend", _this.boundSwipeUpHandling);
|
|
21982
|
+
_this.updateSlideDetails(lastSlideIndex);
|
|
21983
|
+
(_window9 = window) === null || _window9 === void 0 || (_window9 = _window9.Apxor) === null || _window9 === void 0 || (_window9$logInternalE = _window9.logInternalEvent) === null || _window9$logInternalE === void 0 || _window9$logInternalE.call(_window9, "story_slide_seen", JSON.stringify({
|
|
21984
|
+
config_id: _this.config[_this.position].id,
|
|
21985
|
+
position: _this.position,
|
|
21986
|
+
index: lastSlideIndex + 1,
|
|
21987
|
+
view_id: _this.view_id
|
|
21988
|
+
}));
|
|
21989
|
+
_this.current_slide_config.media_type === "none" ? _this.currentMediaType = "builder" : _this.currentMediaType = _this.current_slide_config.media_type;
|
|
21990
|
+
(_window$ApxorRTM12 = window.ApxorRTM) === null || _window$ApxorRTM12 === void 0 || _window$ApxorRTM12.logEvent("apx_slide_viewed", {
|
|
21991
|
+
apx_nudge_id: _this.config[_this.position].id,
|
|
21992
|
+
apx_nudge_name: _this.config[_this.position].campaign_name,
|
|
21993
|
+
apx_template_name: "stories",
|
|
21994
|
+
apx_variant_code: _this.config[_this.position].variant_code,
|
|
21995
|
+
apx_slide_number: lastSlideIndex + 1,
|
|
21996
|
+
apx_slide_label: _this.current_slide_config.slide_label,
|
|
21997
|
+
apx_slide_type: _this.currentMediaType
|
|
21998
|
+
});
|
|
21999
|
+
var _current_time2 = Date.now();
|
|
22000
|
+
var _time_taken;
|
|
22001
|
+
_time_taken = (_current_time2 - _this.slideStartTime) / 1000;
|
|
22002
|
+
(_window$ApxorRTM13 = window.ApxorRTM) === null || _window$ApxorRTM13 === void 0 || _window$ApxorRTM13.logEvent("apx_story_changed", {
|
|
22003
|
+
apx_nudge_id: _this.config[_this.position].id,
|
|
22004
|
+
apx_nudge_name: _this.config[_this.position].campaign_name,
|
|
22005
|
+
apx_template_name: "stories",
|
|
22006
|
+
apx_variant_code: _this.config[_this.position].variant_code,
|
|
22007
|
+
apx_slide_number: lastSlideIndex + 1,
|
|
22008
|
+
apx_slide_label: _this.current_slide_config.slide_label,
|
|
22009
|
+
apx_slide_type: _this.currentMediaType,
|
|
22010
|
+
apx_change_action: "swiped-left",
|
|
22011
|
+
apx_time_taken: _time_taken
|
|
22012
|
+
});
|
|
22013
|
+
var _currentTime = Date.now();
|
|
22014
|
+
_this.slideStartTime = _currentTime;
|
|
22015
|
+
return;
|
|
22016
|
+
}
|
|
22017
|
+
}
|
|
22018
|
+
}, 50);
|
|
22019
|
+
});
|
|
22020
|
+
});
|
|
22021
|
+
_defineProperty(this, "IdEJ", function () {
|
|
22022
|
+
_this.loader.style.display = "block";
|
|
22023
|
+
var progress = Array.from(document.querySelectorAll(".progress"));
|
|
22024
|
+
var activeIndex = progress.findIndex(function (el) {
|
|
22025
|
+
return el.classList.contains("active");
|
|
22026
|
+
});
|
|
22027
|
+
progress[activeIndex].style.animationPlayState = "paused";
|
|
22028
|
+
var slide_details_to_be_deleted = document.querySelector(".slide-details");
|
|
22029
|
+
var childElements = slide_details_to_be_deleted.querySelectorAll("video");
|
|
22030
|
+
for (var i = 0; i < childElements.length; i++) {
|
|
22031
|
+
var child = childElements[i];
|
|
22032
|
+
if (child.tagName.toLowerCase() === "video") {
|
|
22033
|
+
child.style.opacity = 0;
|
|
22034
|
+
}
|
|
22035
|
+
}
|
|
22036
|
+
});
|
|
22037
|
+
_defineProperty(this, "UUjl", function () {
|
|
22038
|
+
if (!_this.continueLoading) {
|
|
22039
|
+
var slide_details_to_be_deleted = document.querySelector(".slide-details");
|
|
22040
|
+
var childElements = slide_details_to_be_deleted.querySelectorAll("video");
|
|
22041
|
+
for (var i = 0; i < childElements.length; i++) {
|
|
22042
|
+
var child = childElements[i];
|
|
22043
|
+
if (child.tagName.toLowerCase() === "video") {
|
|
22044
|
+
child.style.opacity = 1;
|
|
22045
|
+
}
|
|
22046
|
+
}
|
|
22047
|
+
var progress = Array.from(document.querySelectorAll(".progress"));
|
|
22048
|
+
var activeIndex = progress.findIndex(function (el) {
|
|
22049
|
+
return el.classList.contains("active");
|
|
22050
|
+
});
|
|
22051
|
+
progress[activeIndex].style.animationPlayState = "running";
|
|
22052
|
+
var ele = document.querySelector(".loader-1");
|
|
22053
|
+
ele.style.display = "none";
|
|
22054
|
+
_this.loader.style.display = "none";
|
|
22055
|
+
}
|
|
22056
|
+
});
|
|
22057
|
+
_defineProperty(this, "iFKD", function () {
|
|
22058
|
+
if (_this.imageElements.length === 0) return true;
|
|
22059
|
+
return _this.imageElements.every(function (img) {
|
|
22060
|
+
return img.complete;
|
|
22061
|
+
});
|
|
22062
|
+
});
|
|
22063
|
+
_defineProperty(this, "FfdR", function () {
|
|
22064
|
+
if (_this.videoElements.length === 0) return true;
|
|
22065
|
+
return _this.videoElements.every(function (video) {
|
|
22066
|
+
return video.readyState >= 3;
|
|
22067
|
+
});
|
|
22068
|
+
});
|
|
22069
|
+
_defineProperty(this, "whhd", function () {
|
|
22070
|
+
var bodyStyles = window.getComputedStyle(document.body);
|
|
22071
|
+
var backgroundImage = bodyStyles.backgroundImage;
|
|
22072
|
+
if (backgroundImage && backgroundImage !== "none" && _this.current_slide_config.media_type === "image") {
|
|
22073
|
+
var imageUrl = backgroundImage.slice(5, -2);
|
|
22074
|
+
var loader_ele = document.createElement("div");
|
|
22075
|
+
loader_ele.classList.add = "wrapper";
|
|
22076
|
+
var img = new Image();
|
|
22077
|
+
img.src = imageUrl;
|
|
22078
|
+
if (img.complete) {
|
|
22079
|
+
_this.UUjl();
|
|
22080
|
+
return true;
|
|
22081
|
+
}
|
|
22082
|
+
return false;
|
|
22083
|
+
} else if (_this.current_slide_config.media_type === "video") {
|
|
22084
|
+
var slide_details_to_be_deleted = document.querySelector(".slide-details");
|
|
22085
|
+
var childElements = slide_details_to_be_deleted.querySelectorAll("video");
|
|
22086
|
+
if (childElements[0].readyState >= 3) {
|
|
22087
|
+
_this.UUjl();
|
|
22088
|
+
return true;
|
|
22089
|
+
}
|
|
22090
|
+
return false;
|
|
22091
|
+
} else {
|
|
22092
|
+
if (_this.videoElements.length == 0 && _this.imageElements.length == 0) {
|
|
22093
|
+
_this.UUjl();
|
|
22094
|
+
return true;
|
|
22095
|
+
} else if (_this.iFKD() && _this.FfdR()) {
|
|
22096
|
+
_this.UUjl();
|
|
22097
|
+
return true;
|
|
22098
|
+
}
|
|
22099
|
+
}
|
|
22100
|
+
});
|
|
22101
|
+
_defineProperty(this, "odfH", function (event, startY, action) {
|
|
22102
|
+
event.stopPropagation();
|
|
22103
|
+
var endY = event.changedTouches[0].clientY;
|
|
22104
|
+
var deltaY = startY - endY;
|
|
22105
|
+
if (!_this.redirectionFlag) {
|
|
22106
|
+
if (deltaY > 50) {
|
|
22107
|
+
var _window$ApxorRTM14;
|
|
22108
|
+
_this.swipe_up_redirect = true;
|
|
22109
|
+
_this.swipeUpTouch = true;
|
|
22110
|
+
window.Apxor.redirect(JSON.stringify(action));
|
|
22111
|
+
var progress = Array.from(document.querySelectorAll(".progress"));
|
|
22112
|
+
var activeIndex = progress.findIndex(function (el) {
|
|
22113
|
+
return el.classList.contains("active");
|
|
22114
|
+
});
|
|
22115
|
+
_this.current_slide_config.media_type === "none" ? _this.currentMediaType = "builder" : _this.currentMediaType = _this.current_slide_config.media_type;
|
|
22116
|
+
var current_time = Date.now();
|
|
22117
|
+
var time_taken;
|
|
22118
|
+
time_taken = (current_time - _this.slideStartTime) / 1000;
|
|
22119
|
+
(_window$ApxorRTM14 = window.ApxorRTM) === null || _window$ApxorRTM14 === void 0 || _window$ApxorRTM14.logEvent("apx_slide_interaction", {
|
|
22120
|
+
apx_nudge_id: _this.config[_this.position].id,
|
|
22121
|
+
apx_nudge_name: _this.config[_this.position].campaign_name,
|
|
22122
|
+
apx_template_name: "stories",
|
|
22123
|
+
apx_variant_code: _this.config[_this.position].variant_code,
|
|
22124
|
+
apx_slide_number: activeIndex + 1,
|
|
22125
|
+
apx_slide_label: _this.current_slide_config.slide_label,
|
|
22126
|
+
apx_slide_type: _this.currentMediaType,
|
|
22127
|
+
apx_interaction_type: "gesture",
|
|
22128
|
+
apx_time_taken: time_taken
|
|
22129
|
+
});
|
|
22130
|
+
progress[activeIndex].style.animationPlayState = "running";
|
|
22131
|
+
var slide_details_to_be_deleted;
|
|
22132
|
+
slide_details_to_be_deleted = document.querySelector(".slide-details");
|
|
22133
|
+
var childElements = slide_details_to_be_deleted.querySelectorAll("video");
|
|
22134
|
+
for (var i = 0; i < childElements.length; i++) {
|
|
22135
|
+
var child = childElements[i];
|
|
22136
|
+
if (child.tagName.toLowerCase() === "video") {
|
|
22137
|
+
child.play();
|
|
22138
|
+
}
|
|
22139
|
+
}
|
|
22140
|
+
return;
|
|
22141
|
+
}
|
|
22142
|
+
} else {
|
|
22143
|
+
_this.redirectionFlag = false;
|
|
22144
|
+
}
|
|
22145
|
+
});
|
|
22146
|
+
this.config = _config;
|
|
22147
|
+
this.configId = configId;
|
|
22148
|
+
this.name = name;
|
|
22149
|
+
this.position = position;
|
|
22150
|
+
this.slidesSeenCount = slidesSeenCount;
|
|
22151
|
+
this.view_id = view_id;
|
|
22152
|
+
this.showCallback = showCallback;
|
|
22153
|
+
this.closeCallback = closeCallback;
|
|
22154
|
+
this.progress_bar = new ProgressBar$1(_config[position].progress_bar);
|
|
22155
|
+
this.slides = _config[position].slides;
|
|
22156
|
+
if (this.slides.length === this.slidesSeenCount) {
|
|
22157
|
+
this.slidesSeenCount = 0;
|
|
22158
|
+
}
|
|
22159
|
+
if (this.slidesSeenCount > this.slides.length) {
|
|
22160
|
+
var _window10, _window10$logInternal;
|
|
22161
|
+
(_window10 = window) === null || _window10 === void 0 || (_window10 = _window10.Apxor) === null || _window10 === void 0 || (_window10$logInternal = _window10.logInternalEvent) === null || _window10$logInternal === void 0 || _window10$logInternal.call(_window10, "story_slides_closed");
|
|
22162
|
+
}
|
|
22163
|
+
this.storiesStyles = "";
|
|
22164
|
+
this.progressContainer;
|
|
22165
|
+
this.storyContainer;
|
|
22166
|
+
this.dismissFlag = false;
|
|
22167
|
+
this.videoAudioState = "unmute";
|
|
22168
|
+
this.muteElement;
|
|
22169
|
+
this.progress = [];
|
|
22170
|
+
this.swipeDownFlag = false;
|
|
22171
|
+
this.current_slide_config;
|
|
22172
|
+
this.imageElements = [];
|
|
22173
|
+
this.videoElements = [];
|
|
22174
|
+
this.swipeTouch = false;
|
|
22175
|
+
this.gestureTouch = false;
|
|
22176
|
+
this.swipeLeft = false;
|
|
22177
|
+
this.swipeRight = false;
|
|
22178
|
+
this.slidePaused = false;
|
|
22179
|
+
this.currentMediaType;
|
|
22180
|
+
this.slideStartTime;
|
|
22181
|
+
this.swipeUpTouch = false;
|
|
22182
|
+
this.swipe_up_redirect = false;
|
|
22183
|
+
this.boundSwipeUpHandling;
|
|
22184
|
+
this.redirectionFlag = false;
|
|
22185
|
+
this.startY;
|
|
22186
|
+
this.swipe_action;
|
|
22187
|
+
this.continueLoading = false;
|
|
22188
|
+
this.boundSwipeUpHandling = function (event) {
|
|
22189
|
+
return _this.odfH(event, _this.startY, _this.swipe_action);
|
|
22190
|
+
};
|
|
22191
|
+
}
|
|
22192
|
+
_createClass(Stories, [{
|
|
22193
|
+
key: "_getStoriesStyles",
|
|
22194
|
+
value: function _getStoriesStyles() {
|
|
22195
|
+
var head = document.head || document.getElementsByTagName("head")[0];
|
|
22196
|
+
var styleNodes = head.querySelectorAll(".apx-progressbar-styles");
|
|
22197
|
+
styleNodes.forEach(function (node) {
|
|
22198
|
+
node.parentNode.removeChild(node);
|
|
22199
|
+
});
|
|
22200
|
+
this.storiesStyles = "\n .progress-container {\n position:absolute;\n top:12px;\n display: flex;\n flex-direction: row;\n width:100%;\n }\n\n *,:before,:after {\n box-sizing: border-box;\n -webkit-user-select: none;\n -webkit-touch-callout: none;\n border-width: 0;\n border-style: solid;\n border-color: #e5e7eb\n }\n\n .progress {\n height: 4px;\n flex-grow: 1;\n border-radius: 4px;\n margin: 0 4px;\n display: flex;\n background-image: linear-gradient(\n to right,\n ".concat(this.progress_bar.seen_color, " 0%,\n ").concat(this.progress_bar.seen_color, " 50%,\n ").concat(this.progress_bar.unseen_color, " 50%,\n ").concat(this.progress_bar.unseen_color, " 100%\n );\n background-repeat: no-repeat;\n background-size: 200%;\n background-position: 100% 50%;\n animation-timing-function: linear;\n animation-delay: 0.2s;\n }\n\n .progress.active {\n animation-name: Loader;\n }\n\n .progress.passed { \n background-position: 0 0;\n }\n\n .slide-right {\n animation: 0.5s slide-right forwards;\n background: linear-gradient(to right, rgba(225, 219, 30, 0.99), rgb(36, 202, 238)); \n background-size: 200% 100%;\n }\n \n @keyframes slide-right {\n from {\n background-position: 0% 0;\n }\n to {\n background-position: 100% 0;\n }\n }\n\n @-webkit-keyframes Loader {\n 0% {\n background-position: 100% 0;\n }\n 100% {\n background-position: 0 0;\n }\n }\n\n @keyframes moveUpDownButton {\n 0%,\n 100% {\n bottom: 12px;\n }\n 50% {\n bottom: 32px;\n }\n } \n\n body {\n background: #121216;\n }\n ").replaceAll("\n", "").replace(/[\s]{2,999}/g, "");
|
|
22201
|
+
var styleNode = document.createElement("style");
|
|
22202
|
+
styleNode.setAttribute("apx-stories-styles", "");
|
|
22203
|
+
styleNode.classList.add("apx-progressbar-styles");
|
|
22204
|
+
styleNode.innerHTML = this.storiesStyles;
|
|
22205
|
+
document.head.appendChild(styleNode);
|
|
22206
|
+
return this.storiesStyles;
|
|
22207
|
+
}
|
|
22208
|
+
}, {
|
|
22209
|
+
key: "moveToNextSlide",
|
|
22210
|
+
value: function moveToNextSlide() {
|
|
22211
|
+
var _window$ApxorRTM15, _progress$activeIndex7, _progress$activeIndex8, _progress$nextIndex, _window13, _window13$logInternal, _window$ApxorRTM19, _window$ApxorRTM20;
|
|
22212
|
+
this.storyContainer.removeEventListener("touchend", this.boundSwipeUpHandling);
|
|
22213
|
+
var progress1 = Array.from(document.querySelectorAll(".progress"));
|
|
22214
|
+
var activeIndex1 = progress1.findIndex(function (el) {
|
|
22215
|
+
return el.classList.contains("active");
|
|
22216
|
+
});
|
|
22217
|
+
var current_time_new = Date.now();
|
|
22218
|
+
var time_taken_new;
|
|
22219
|
+
time_taken_new = (current_time_new - this.slideStartTime) / 1000;
|
|
22220
|
+
(_window$ApxorRTM15 = window.ApxorRTM) === null || _window$ApxorRTM15 === void 0 || _window$ApxorRTM15.logEvent("apx_slide_completed", {
|
|
22221
|
+
apx_nudge_id: this.config[this.position].id,
|
|
22222
|
+
apx_nudge_name: this.config[this.position].campaign_name,
|
|
22223
|
+
apx_template_name: "stories",
|
|
22224
|
+
apx_variant_code: this.config[this.position].variant_code,
|
|
22225
|
+
apx_slide_number: activeIndex1 + 1,
|
|
22226
|
+
apx_slide_label: this.current_slide_config.slide_label,
|
|
22227
|
+
apx_time_taken: time_taken_new
|
|
22228
|
+
});
|
|
22229
|
+
var progress = Array.from(document.querySelectorAll(".progress"));
|
|
22230
|
+
var activeIndex = progress.findIndex(function (el) {
|
|
22231
|
+
return el.classList.contains("active");
|
|
22232
|
+
});
|
|
22233
|
+
if (activeIndex === progress.length - 1) {
|
|
22234
|
+
// If at the last slide of the current group
|
|
22235
|
+
if (this.position === this.config.length - 1) {
|
|
22236
|
+
var _window11, _window11$logInternal;
|
|
22237
|
+
// If it's the last group, log event and return
|
|
22238
|
+
(_window11 = window) === null || _window11 === void 0 || (_window11 = _window11.Apxor) === null || _window11 === void 0 || (_window11$logInternal = _window11.logInternalEvent) === null || _window11$logInternal === void 0 || _window11$logInternal.call(_window11, "story_slides_closed");
|
|
22239
|
+
var slide_details_to_be_deleted;
|
|
22240
|
+
slide_details_to_be_deleted = document.querySelector(".slide-details");
|
|
22241
|
+
var childElements = slide_details_to_be_deleted.querySelectorAll("video");
|
|
22242
|
+
for (var i = 0; i < childElements.length; i++) {
|
|
22243
|
+
var child = childElements[i];
|
|
22244
|
+
if (child.tagName.toLowerCase() === "video") {
|
|
22245
|
+
child.muted = true;
|
|
22246
|
+
}
|
|
22247
|
+
}
|
|
22248
|
+
return;
|
|
22249
|
+
} else {
|
|
22250
|
+
var _progress$activeIndex5, _progress$activeIndex6, _progress$, _window12, _window12$logInternal, _window$ApxorRTM16, _window$ApxorRTM17, _window$ApxorRTM18;
|
|
22251
|
+
// Move to the first slide of the next group
|
|
22252
|
+
// this.tdcD();
|
|
22253
|
+
this.position++;
|
|
22254
|
+
this.progress_bar = new ProgressBar$1(this.config[this.position].progress_bar);
|
|
22255
|
+
this.slides = this.config[this.position].slides;
|
|
22256
|
+
this.updateProgressBarSegments();
|
|
22257
|
+
(_progress$activeIndex5 = progress[activeIndex]) === null || _progress$activeIndex5 === void 0 || _progress$activeIndex5.classList.remove("active");
|
|
22258
|
+
(_progress$activeIndex6 = progress[activeIndex]) === null || _progress$activeIndex6 === void 0 || _progress$activeIndex6.classList.add("passed");
|
|
22259
|
+
(_progress$ = progress[0]) === null || _progress$ === void 0 || _progress$.classList.add("active");
|
|
22260
|
+
this.updateSlideDetails(0);
|
|
22261
|
+
(_window12 = window) === null || _window12 === void 0 || (_window12 = _window12.Apxor) === null || _window12 === void 0 || (_window12$logInternal = _window12.logInternalEvent) === null || _window12$logInternal === void 0 || _window12$logInternal.call(_window12, "story_slide_seen", JSON.stringify({
|
|
22262
|
+
config_id: this.config[this.position].id,
|
|
22263
|
+
position: this.position,
|
|
22264
|
+
index: 1,
|
|
22265
|
+
view_id: this.view_id
|
|
22266
|
+
}));
|
|
22267
|
+
var _time_taken2;
|
|
22268
|
+
var _current_time3 = Date.now();
|
|
22269
|
+
_time_taken2 = (_current_time3 - this.slideStartTime) / 1000;
|
|
22270
|
+
this.current_slide_config.media_type === "none" ? this.currentMediaType = "builder" : this.currentMediaType = this.current_slide_config.media_type;
|
|
22271
|
+
(_window$ApxorRTM16 = window.ApxorRTM) === null || _window$ApxorRTM16 === void 0 || _window$ApxorRTM16.logEvent("apx_slide_changed", {
|
|
22272
|
+
apx_nudge_id: this.config[this.position].id,
|
|
22273
|
+
apx_nudge_name: this.config[this.position].campaign_name,
|
|
22274
|
+
apx_template_name: "stories",
|
|
22275
|
+
apx_variant_code: this.config[this.position].variant_code,
|
|
22276
|
+
apx_slide_number: 1,
|
|
22277
|
+
apx_slide_label: this.current_slide_config.slide_label,
|
|
22278
|
+
apx_slide_type: this.currentMediaType,
|
|
22279
|
+
apx_change_action: "next-clicked",
|
|
22280
|
+
apx_time_taken: _time_taken2
|
|
22281
|
+
});
|
|
22282
|
+
(_window$ApxorRTM17 = window.ApxorRTM) === null || _window$ApxorRTM17 === void 0 || _window$ApxorRTM17.logEvent("apx_slide_viewed", {
|
|
22283
|
+
apx_nudge_id: this.config[this.position].id,
|
|
22284
|
+
apx_nudge_name: this.config[this.position].campaign_name,
|
|
22285
|
+
apx_template_name: "stories",
|
|
22286
|
+
apx_variant_code: this.config[this.position].variant_code,
|
|
22287
|
+
apx_slide_number: 1,
|
|
22288
|
+
apx_slide_label: this.current_slide_config.slide_label,
|
|
22289
|
+
apx_slide_type: this.currentMediaType
|
|
22290
|
+
});
|
|
22291
|
+
(_window$ApxorRTM18 = window.ApxorRTM) === null || _window$ApxorRTM18 === void 0 || _window$ApxorRTM18.logEvent("apx_story_changed", {
|
|
22292
|
+
apx_nudge_id: this.config[this.position].id,
|
|
22293
|
+
apx_nudge_name: this.config[this.position].campaign_name,
|
|
22294
|
+
apx_template_name: "stories",
|
|
22295
|
+
apx_variant_code: this.config[this.position].variant_code,
|
|
22296
|
+
apx_slide_number: 1,
|
|
22297
|
+
apx_slide_label: this.current_slide_config.slide_label,
|
|
22298
|
+
apx_slide_type: this.currentMediaType,
|
|
22299
|
+
apx_change_action: "autoplay",
|
|
22300
|
+
apx_time_taken: _time_taken2
|
|
22301
|
+
});
|
|
22302
|
+
var _currentTime2 = Date.now();
|
|
22303
|
+
this.slideStartTime = _currentTime2;
|
|
22304
|
+
return;
|
|
22305
|
+
}
|
|
22306
|
+
}
|
|
22307
|
+
|
|
22308
|
+
// Move to the next slide within the current group
|
|
22309
|
+
var nextIndex = activeIndex + 1;
|
|
22310
|
+
(_progress$activeIndex7 = progress[activeIndex]) === null || _progress$activeIndex7 === void 0 || _progress$activeIndex7.classList.remove("active");
|
|
22311
|
+
(_progress$activeIndex8 = progress[activeIndex]) === null || _progress$activeIndex8 === void 0 || _progress$activeIndex8.classList.add("passed");
|
|
22312
|
+
(_progress$nextIndex = progress[nextIndex]) === null || _progress$nextIndex === void 0 || _progress$nextIndex.classList.add("active");
|
|
22313
|
+
this.updateSlideDetails(nextIndex);
|
|
22314
|
+
(_window13 = window) === null || _window13 === void 0 || (_window13 = _window13.Apxor) === null || _window13 === void 0 || (_window13$logInternal = _window13.logInternalEvent) === null || _window13$logInternal === void 0 || _window13$logInternal.call(_window13, "story_slide_seen", JSON.stringify({
|
|
22315
|
+
config_id: this.config[this.position].id,
|
|
22316
|
+
position: this.position,
|
|
22317
|
+
index: activeIndex + 2,
|
|
22318
|
+
view_id: this.view_id
|
|
22319
|
+
}));
|
|
22320
|
+
this.current_slide_config.media_type === "none" ? this.currentMediaType = "builder" : this.currentMediaType = this.current_slide_config.media_type;
|
|
22321
|
+
var time_taken;
|
|
22322
|
+
var current_time = Date.now();
|
|
22323
|
+
time_taken = (current_time - this.slideStartTime) / 1000;
|
|
22324
|
+
(_window$ApxorRTM19 = window.ApxorRTM) === null || _window$ApxorRTM19 === void 0 || _window$ApxorRTM19.logEvent("apx_slide_changed", {
|
|
22325
|
+
apx_nudge_id: this.config[this.position].id,
|
|
22326
|
+
apx_nudge_name: this.config[this.position].campaign_name,
|
|
22327
|
+
apx_template_name: "stories",
|
|
22328
|
+
apx_variant_code: this.config[this.position].variant_code,
|
|
22329
|
+
apx_slide_number: activeIndex + 2,
|
|
22330
|
+
apx_slide_label: this.current_slide_config.slide_label,
|
|
22331
|
+
apx_slide_type: this.currentMediaType,
|
|
22332
|
+
apx_change_action: "next-clicked",
|
|
22333
|
+
apx_time_taken: time_taken
|
|
22334
|
+
});
|
|
22335
|
+
(_window$ApxorRTM20 = window.ApxorRTM) === null || _window$ApxorRTM20 === void 0 || _window$ApxorRTM20.logEvent("apx_slide_viewed", {
|
|
22336
|
+
apx_nudge_id: this.config[this.position].id,
|
|
22337
|
+
apx_nudge_name: this.config[this.position].campaign_name,
|
|
22338
|
+
apx_template_name: "stories",
|
|
22339
|
+
apx_variant_code: this.config[this.position].variant_code,
|
|
22340
|
+
apx_slide_number: activeIndex + 2,
|
|
22341
|
+
apx_slide_label: this.current_slide_config.slide_label,
|
|
22342
|
+
apx_slide_type: this.currentMediaType
|
|
22343
|
+
});
|
|
22344
|
+
var currentTime = Date.now();
|
|
22345
|
+
this.slideStartTime = currentTime;
|
|
22346
|
+
}
|
|
22347
|
+
}, {
|
|
22348
|
+
key: "moveToPreviousSlide",
|
|
22349
|
+
value: function moveToPreviousSlide() {
|
|
22350
|
+
var _window$ApxorRTM21, _progress$activeIndex11, _progress$activeIndex12, _progress$previousInd, _progress$previousInd2, _window15, _window15$logInternal, _window$ApxorRTM25, _window$ApxorRTM26;
|
|
22351
|
+
this.storyContainer.removeEventListener("touchend", this.boundSwipeUpHandling);
|
|
22352
|
+
var progress1 = Array.from(document.querySelectorAll(".progress"));
|
|
22353
|
+
var activeIndex1 = progress1.findIndex(function (el) {
|
|
22354
|
+
return el.classList.contains("active");
|
|
22355
|
+
});
|
|
22356
|
+
var current_time_new = Date.now();
|
|
22357
|
+
var time_taken_new;
|
|
22358
|
+
time_taken_new = (current_time_new - this.slideStartTime) / 1000;
|
|
22359
|
+
(_window$ApxorRTM21 = window.ApxorRTM) === null || _window$ApxorRTM21 === void 0 || _window$ApxorRTM21.logEvent("apx_slide_completed", {
|
|
22360
|
+
apx_nudge_id: this.config[this.position].id,
|
|
22361
|
+
apx_nudge_name: this.config[this.position].campaign_name,
|
|
22362
|
+
apx_template_name: "stories",
|
|
22363
|
+
apx_variant_code: this.config[this.position].variant_code,
|
|
22364
|
+
apx_slide_number: activeIndex1 + 1,
|
|
22365
|
+
apx_slide_label: this.current_slide_config.slide_label,
|
|
22366
|
+
apx_time_taken: time_taken_new
|
|
22367
|
+
});
|
|
22368
|
+
var progress = Array.from(document.querySelectorAll(".progress"));
|
|
22369
|
+
var activeIndex = progress.findIndex(function (el) {
|
|
22370
|
+
return el.classList.contains("active");
|
|
22371
|
+
});
|
|
22372
|
+
if (activeIndex === 0 && this.position === 0) {
|
|
22373
|
+
return;
|
|
22374
|
+
}
|
|
22375
|
+
if (activeIndex === 0) {
|
|
22376
|
+
var _progress$activeIndex9, _progress$activeIndex10, _progress$lastSlideIn, _window14, _window14$logInternal, _window$ApxorRTM22, _window$ApxorRTM23, _window$ApxorRTM24;
|
|
22377
|
+
// If at the first slide of the current group, move to the last slide of the previous group
|
|
22378
|
+
// this.tdcD();
|
|
22379
|
+
this.position--;
|
|
22380
|
+
this.progress_bar = new ProgressBar$1(this.config[this.position].progress_bar);
|
|
22381
|
+
this.slides = this.config[this.position].slides;
|
|
22382
|
+
this.updateProgressBarSegments(true);
|
|
22383
|
+
var lastSlideIndex = this.slides.length - 1;
|
|
22384
|
+
(_progress$activeIndex9 = progress[activeIndex]) === null || _progress$activeIndex9 === void 0 || _progress$activeIndex9.classList.remove("active");
|
|
22385
|
+
(_progress$activeIndex10 = progress[activeIndex]) === null || _progress$activeIndex10 === void 0 || _progress$activeIndex10.classList.add("passed");
|
|
22386
|
+
(_progress$lastSlideIn = progress[lastSlideIndex]) === null || _progress$lastSlideIn === void 0 || _progress$lastSlideIn.classList.add("active");
|
|
22387
|
+
this.updateSlideDetails(lastSlideIndex);
|
|
22388
|
+
(_window14 = window) === null || _window14 === void 0 || (_window14 = _window14.Apxor) === null || _window14 === void 0 || (_window14$logInternal = _window14.logInternalEvent) === null || _window14$logInternal === void 0 || _window14$logInternal.call(_window14, "story_slide_seen", JSON.stringify({
|
|
22389
|
+
config_id: this.config[this.position].id,
|
|
22390
|
+
position: this.position,
|
|
22391
|
+
index: lastSlideIndex + 1,
|
|
22392
|
+
view_id: this.view_id
|
|
22393
|
+
}));
|
|
22394
|
+
this.current_slide_config.media_type === "none" ? this.currentMediaType = "builder" : this.currentMediaType = this.current_slide_config.media_type;
|
|
22395
|
+
var _time_taken3;
|
|
22396
|
+
var _current_time4 = Date.now();
|
|
22397
|
+
_time_taken3 = (_current_time4 - this.slideStartTime) / 1000;
|
|
22398
|
+
(_window$ApxorRTM22 = window.ApxorRTM) === null || _window$ApxorRTM22 === void 0 || _window$ApxorRTM22.logEvent("apx_slide_changed", {
|
|
22399
|
+
apx_nudge_id: this.config[this.position].id,
|
|
22400
|
+
apx_nudge_name: this.config[this.position].campaign_name,
|
|
22401
|
+
apx_template_name: "stories",
|
|
22402
|
+
apx_variant_code: this.config[this.position].variant_code,
|
|
22403
|
+
apx_slide_number: lastSlideIndex + 1,
|
|
22404
|
+
apx_slide_label: this.current_slide_config.slide_label,
|
|
22405
|
+
apx_slide_type: this.currentMediaType,
|
|
22406
|
+
apx_change_action: "previous-clicked",
|
|
22407
|
+
apx_time_taken: _time_taken3
|
|
22408
|
+
});
|
|
22409
|
+
(_window$ApxorRTM23 = window.ApxorRTM) === null || _window$ApxorRTM23 === void 0 || _window$ApxorRTM23.logEvent("apx_slide_viewed", {
|
|
22410
|
+
apx_nudge_id: this.config[this.position].id,
|
|
22411
|
+
apx_nudge_name: this.config[this.position].campaign_name,
|
|
22412
|
+
apx_template_name: "stories",
|
|
22413
|
+
apx_variant_code: this.config[this.position].variant_code,
|
|
22414
|
+
apx_slide_number: lastSlideIndex + 1,
|
|
22415
|
+
apx_slide_label: this.current_slide_config.slide_label,
|
|
22416
|
+
apx_slide_type: this.currentMediaType
|
|
22417
|
+
});
|
|
22418
|
+
(_window$ApxorRTM24 = window.ApxorRTM) === null || _window$ApxorRTM24 === void 0 || _window$ApxorRTM24.logEvent("apx_story_changed", {
|
|
22419
|
+
apx_nudge_id: this.config[this.position].id,
|
|
22420
|
+
apx_nudge_name: this.config[this.position].campaign_name,
|
|
22421
|
+
apx_template_name: "stories",
|
|
22422
|
+
apx_variant_code: this.config[this.position].variant_code,
|
|
22423
|
+
apx_slide_number: lastSlideIndex + 1,
|
|
22424
|
+
apx_slide_label: this.current_slide_config.slide_label,
|
|
22425
|
+
apx_slide_type: this.currentMediaType,
|
|
22426
|
+
apx_change_action: "autoplay",
|
|
22427
|
+
apx_time_taken: _time_taken3
|
|
22428
|
+
});
|
|
22429
|
+
var _currentTime3 = Date.now();
|
|
22430
|
+
this.slideStartTime = _currentTime3;
|
|
22431
|
+
return;
|
|
22432
|
+
}
|
|
22433
|
+
// Move to the previous slide within the current group
|
|
22434
|
+
var previousIndex = activeIndex - 1;
|
|
22435
|
+
(_progress$activeIndex11 = progress[activeIndex]) === null || _progress$activeIndex11 === void 0 || _progress$activeIndex11.classList.remove("active");
|
|
22436
|
+
(_progress$activeIndex12 = progress[activeIndex]) === null || _progress$activeIndex12 === void 0 || _progress$activeIndex12.classList.add("passed");
|
|
22437
|
+
(_progress$previousInd = progress[previousIndex]) === null || _progress$previousInd === void 0 || _progress$previousInd.classList.remove("passed");
|
|
22438
|
+
(_progress$previousInd2 = progress[previousIndex]) === null || _progress$previousInd2 === void 0 || _progress$previousInd2.classList.add("active");
|
|
22439
|
+
var noOfSegments = progress.length;
|
|
22440
|
+
for (var i = activeIndex; i < noOfSegments; i++) {
|
|
22441
|
+
var _progress$i;
|
|
22442
|
+
(_progress$i = progress[i]) === null || _progress$i === void 0 || _progress$i.classList.remove("passed");
|
|
22443
|
+
}
|
|
22444
|
+
this.updateSlideDetails(previousIndex);
|
|
22445
|
+
(_window15 = window) === null || _window15 === void 0 || (_window15 = _window15.Apxor) === null || _window15 === void 0 || (_window15$logInternal = _window15.logInternalEvent) === null || _window15$logInternal === void 0 || _window15$logInternal.call(_window15, "story_slide_seen", JSON.stringify({
|
|
22446
|
+
config_id: this.config[this.position].id,
|
|
22447
|
+
position: this.position,
|
|
22448
|
+
index: activeIndex,
|
|
22449
|
+
view_id: this.view_id
|
|
22450
|
+
}));
|
|
22451
|
+
var currentTime = Date.now();
|
|
22452
|
+
this.current_slide_config.media_type === "none" ? this.currentMediaType = "builder" : this.currentMediaType = this.current_slide_config.media_type;
|
|
22453
|
+
var time_taken;
|
|
22454
|
+
var current_time = Date.now();
|
|
22455
|
+
time_taken = (current_time - this.slideStartTime) / 1000;
|
|
22456
|
+
(_window$ApxorRTM25 = window.ApxorRTM) === null || _window$ApxorRTM25 === void 0 || _window$ApxorRTM25.logEvent("apx_slide_changed", {
|
|
22457
|
+
apx_nudge_id: this.config[this.position].id,
|
|
22458
|
+
apx_nudge_name: this.config[this.position].campaign_name,
|
|
22459
|
+
apx_template_name: "stories",
|
|
22460
|
+
apx_variant_code: this.config[this.position].variant_code,
|
|
22461
|
+
apx_slide_number: activeIndex,
|
|
22462
|
+
apx_slide_label: this.current_slide_config.slide_label,
|
|
22463
|
+
apx_slide_type: this.currentMediaType,
|
|
22464
|
+
apx_change_action: "previous-clicked",
|
|
22465
|
+
apx_time_taken: time_taken
|
|
22466
|
+
});
|
|
22467
|
+
(_window$ApxorRTM26 = window.ApxorRTM) === null || _window$ApxorRTM26 === void 0 || _window$ApxorRTM26.logEvent("apx_slide_viewed", {
|
|
22468
|
+
apx_nudge_id: this.config[this.position].id,
|
|
22469
|
+
apx_nudge_name: this.config[this.position].campaign_name,
|
|
22470
|
+
apx_template_name: "stories",
|
|
22471
|
+
apx_variant_code: this.config[this.position].variant_code,
|
|
22472
|
+
apx_slide_number: activeIndex,
|
|
22473
|
+
apx_slide_label: this.current_slide_config.slide_label,
|
|
22474
|
+
apx_slide_type: this.currentMediaType
|
|
22475
|
+
});
|
|
22476
|
+
this.slideStartTime = currentTime;
|
|
22477
|
+
}
|
|
22478
|
+
}, {
|
|
22479
|
+
key: "updateSlideDetails",
|
|
22480
|
+
value: function updateSlideDetails(activeIndex) {
|
|
22481
|
+
var _this2 = this;
|
|
22482
|
+
// Update slide details for the new active slide
|
|
22483
|
+
var existingAbsoluteElements = document.querySelectorAll(".apx-slide-header");
|
|
22484
|
+
existingAbsoluteElements.forEach(function (element) {
|
|
22485
|
+
element.remove();
|
|
22486
|
+
});
|
|
22487
|
+
var currentSlideDetails = document.querySelector(".slide-details");
|
|
22488
|
+
currentSlideDetails.style.display = "none";
|
|
22489
|
+
currentSlideDetails.innerHTML = "";
|
|
22490
|
+
currentSlideDetails.style.display = "flex";
|
|
22491
|
+
|
|
22492
|
+
// Get details of the new active slide
|
|
22493
|
+
var current_slide_from_config = this.slides[activeIndex];
|
|
22494
|
+
this.current_slide_config = current_slide_from_config;
|
|
22495
|
+
|
|
22496
|
+
// Update slide details
|
|
22497
|
+
var slideHeader = document.createElement("div");
|
|
22498
|
+
slideHeader.classList.add("slide-header");
|
|
22499
|
+
slideHeader.style.position = "relative";
|
|
22500
|
+
slideHeader.style.top = "20px";
|
|
22501
|
+
// Append slide header to slide details container
|
|
22502
|
+
currentSlideDetails.appendChild(slideHeader);
|
|
22503
|
+
|
|
22504
|
+
// Update slide content
|
|
22505
|
+
var element;
|
|
22506
|
+
if ((current_slide_from_config === null || current_slide_from_config === void 0 ? void 0 : current_slide_from_config.media_type) === "image") {
|
|
22507
|
+
var _window$Apxor4;
|
|
22508
|
+
element = document.createElement("div");
|
|
22509
|
+
var image_src;
|
|
22510
|
+
var image_ext;
|
|
22511
|
+
if (((_window$Apxor4 = window.Apxor) === null || _window$Apxor4 === void 0 ? void 0 : _window$Apxor4.platform) != "ios") {
|
|
22512
|
+
image_ext = getFileExtension(current_slide_from_config.media_url);
|
|
22513
|
+
image_src = window.Apxor.getFilePath(this.config[this.position].id, current_slide_from_config.media_url, image_ext);
|
|
22514
|
+
if (image_src && image_src != "") {
|
|
22515
|
+
document.body.style.backgroundImage = "url(".concat(image_src, ")");
|
|
22516
|
+
document.body.style.backgroundSize = "100% auto";
|
|
22517
|
+
document.body.style.backgroundPosition = "center";
|
|
22518
|
+
document.body.style.backgroundRepeat = "no-repeat";
|
|
22519
|
+
} else {
|
|
22520
|
+
document.body.style.backgroundImage = "url(".concat(current_slide_from_config.media_url, ")");
|
|
22521
|
+
document.body.style.backgroundSize = "100% auto";
|
|
22522
|
+
document.body.style.backgroundPosition = "center";
|
|
22523
|
+
document.body.style.backgroundRepeat = "no-repeat";
|
|
22524
|
+
}
|
|
22525
|
+
} else {
|
|
22526
|
+
document.body.style.backgroundImage = "url(".concat(current_slide_from_config.media_url, ")");
|
|
22527
|
+
document.body.style.backgroundSize = "100% auto";
|
|
22528
|
+
document.body.style.backgroundPosition = "center";
|
|
22529
|
+
document.body.style.backgroundRepeat = "no-repeat";
|
|
22530
|
+
}
|
|
22531
|
+
document.body.style.backgroundColor = current_slide_from_config.media_background_color;
|
|
22532
|
+
document.body.style.margin = "0px";
|
|
22533
|
+
} else if ((current_slide_from_config === null || current_slide_from_config === void 0 ? void 0 : current_slide_from_config.media_type) === "video") {
|
|
22534
|
+
var _window$Apxor5;
|
|
22535
|
+
document.body.style.backgroundImage = "";
|
|
22536
|
+
document.body.style.backgroundSize = "";
|
|
22537
|
+
document.body.style.backgroundPosition = "";
|
|
22538
|
+
document.body.style.backgroundRepeat = "";
|
|
22539
|
+
element = document.createElement("video");
|
|
22540
|
+
element.classList.add("apx-story-video");
|
|
22541
|
+
element.disablePictureInPicture = true;
|
|
22542
|
+
element.autoplay = true;
|
|
22543
|
+
var sourceElement = document.createElement("source");
|
|
22544
|
+
sourceElement.setAttribute("src", current_slide_from_config.media_url);
|
|
22545
|
+
sourceElement.setAttribute("type", "video/mp4");
|
|
22546
|
+
element.appendChild(sourceElement);
|
|
22547
|
+
element.style.width = "100%";
|
|
22548
|
+
element.style.height = "auto";
|
|
22549
|
+
document.body.style.backgroundColor = current_slide_from_config.media_background_color;
|
|
22550
|
+
document.body.style.margin = "0px";
|
|
22551
|
+
if (((_window$Apxor5 = window.Apxor) === null || _window$Apxor5 === void 0 ? void 0 : _window$Apxor5.platform) === "ios") {
|
|
22552
|
+
element.playsInline = true;
|
|
22553
|
+
}
|
|
22554
|
+
element.style.alignItems = "center";
|
|
22555
|
+
element.style.objectFit = "cover";
|
|
22556
|
+
element.style.display = "flex";
|
|
22557
|
+
element.style.alignItems = "center";
|
|
22558
|
+
} else if ((current_slide_from_config === null || current_slide_from_config === void 0 ? void 0 : current_slide_from_config.media_type) === "none") {
|
|
22559
|
+
document.body.style.backgroundImage = "";
|
|
22560
|
+
document.body.style.backgroundSize = "";
|
|
22561
|
+
document.body.style.backgroundPosition = "";
|
|
22562
|
+
document.body.style.backgroundRepeat = "";
|
|
22563
|
+
// If media type is none ,build each element in story using builder approach
|
|
22564
|
+
// Create custom content
|
|
22565
|
+
var updated_layout_without_absolute_elements = JSON.parse(JSON.stringify(current_slide_from_config.layout));
|
|
22566
|
+
delete updated_layout_without_absolute_elements["absolute_position_children"];
|
|
22567
|
+
element = this.rjYg(updated_layout_without_absolute_elements);
|
|
22568
|
+
}
|
|
22569
|
+
// Append slide content to slide details container
|
|
22570
|
+
|
|
22571
|
+
document.body.style.backgroundColor = current_slide_from_config.media_background_color;
|
|
22572
|
+
document.body.style.margin = "0px";
|
|
22573
|
+
currentSlideDetails.appendChild(element);
|
|
22574
|
+
this.IdEJ();
|
|
22575
|
+
|
|
22576
|
+
// Handle absolute position children
|
|
22577
|
+
if (current_slide_from_config.layout.absolute_position_children && current_slide_from_config.layout.absolute_position_children.length > 0) {
|
|
22578
|
+
current_slide_from_config.layout.absolute_position_children.forEach(function (childConfig) {
|
|
22579
|
+
var childElement = _this2.rjYg(childConfig);
|
|
22580
|
+
// Append absolute position children to slide details container
|
|
22581
|
+
currentSlideDetails.appendChild(childElement);
|
|
22582
|
+
});
|
|
22583
|
+
}
|
|
22584
|
+
window.intervalToCheckImgStatus2 = setInterval(function () {
|
|
22585
|
+
if (_this2.whhd()) {
|
|
22586
|
+
clearInterval(window.intervalToCheckImgStatus2);
|
|
22587
|
+
}
|
|
22588
|
+
}, 500);
|
|
22589
|
+
}
|
|
22590
|
+
}, {
|
|
22591
|
+
key: "updateProgressBarSegments",
|
|
22592
|
+
value: function updateProgressBarSegments() {
|
|
22593
|
+
var _this3 = this;
|
|
22594
|
+
var previousChecker = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
|
|
22595
|
+
// Update progress bar segments based on the number of slides in the current group
|
|
22596
|
+
var progressContainer = document.querySelector(".progress-container");
|
|
22597
|
+
progressContainer.innerHTML = "";
|
|
22598
|
+
this.slides.forEach(function (slide, index) {
|
|
22599
|
+
var progressSlide = document.createElement("div");
|
|
22600
|
+
progressSlide.classList.add("slide".concat(index));
|
|
22601
|
+
progressSlide.classList.add("progress");
|
|
22602
|
+
var slide_duration = slide.duration / 1000;
|
|
22603
|
+
progressSlide.style.animationDuration = "".concat(slide_duration, "s");
|
|
22604
|
+
progressContainer.appendChild(progressSlide);
|
|
22605
|
+
});
|
|
22606
|
+
var progressSegments = progressContainer.querySelectorAll(".progress");
|
|
22607
|
+
if (progressSegments.length > 0) {
|
|
22608
|
+
if (previousChecker) {
|
|
22609
|
+
for (var i = 0; i < progressSegments.length - 1; i++) {
|
|
22610
|
+
var _progressSegments$i2;
|
|
22611
|
+
(_progressSegments$i2 = progressSegments[i]) === null || _progressSegments$i2 === void 0 || _progressSegments$i2.classList.add("passed");
|
|
22612
|
+
}
|
|
22613
|
+
progressSegments[progressSegments.length - 1].classList.add("active");
|
|
22614
|
+
} else {
|
|
22615
|
+
progressSegments[0].classList.add("active");
|
|
22616
|
+
}
|
|
22617
|
+
}
|
|
22618
|
+
Array.from(progressSegments).map(function (el) {
|
|
22619
|
+
return el.addEventListener("animationend", function () {
|
|
22620
|
+
_this3.moveToNextSlide();
|
|
22621
|
+
}, false);
|
|
22622
|
+
});
|
|
22623
|
+
this._getStoriesStyles();
|
|
22624
|
+
}
|
|
22625
|
+
}]);
|
|
22626
|
+
return Stories;
|
|
22627
|
+
}();
|
|
22628
|
+
|
|
21040
22629
|
var RTM = /*#__PURE__*/_createClass(function RTM() {
|
|
21041
22630
|
var _this = this;
|
|
21042
22631
|
_classCallCheck(this, RTM);
|
|
21043
|
-
_defineProperty(this, "
|
|
22632
|
+
_defineProperty(this, "zCgG", {});
|
|
21044
22633
|
_defineProperty(this, "isShowingAction", false);
|
|
21045
22634
|
_defineProperty(this, "currentAction", null);
|
|
21046
|
-
_defineProperty(this, "
|
|
21047
|
-
_defineProperty(this, "version",
|
|
22635
|
+
_defineProperty(this, "mgMJ", null);
|
|
22636
|
+
_defineProperty(this, "version", 70);
|
|
21048
22637
|
_defineProperty(this, "isInitialised", false);
|
|
21049
|
-
_defineProperty(this, "
|
|
21050
|
-
_defineProperty(this, "
|
|
22638
|
+
_defineProperty(this, "tPDI", {});
|
|
22639
|
+
_defineProperty(this, "yqcV", false);
|
|
21051
22640
|
_defineProperty(this, "_isShownECCalled", false);
|
|
21052
|
-
_defineProperty(this, "
|
|
22641
|
+
_defineProperty(this, "cNcz", function () {
|
|
21053
22642
|
_this.isInitialised = true;
|
|
21054
22643
|
var oldPushState = history.pushState;
|
|
21055
22644
|
history.pushState = function pushState() {
|
|
@@ -21074,7 +22663,7 @@
|
|
|
21074
22663
|
});
|
|
21075
22664
|
_defineProperty(this, "show", function (uiJson, duration, uuid, name) {
|
|
21076
22665
|
if (!_this.isInitialised) {
|
|
21077
|
-
_this.
|
|
22666
|
+
_this.cNcz();
|
|
21078
22667
|
}
|
|
21079
22668
|
window.addEventListener("pagehide", function () {
|
|
21080
22669
|
var _window$Apxor, _window$Apxor$pageUnl;
|
|
@@ -21101,7 +22690,7 @@
|
|
|
21101
22690
|
} else if (ui_config.display_type === "new-inline" || ui_config.action_class === "tooltip_builder") {
|
|
21102
22691
|
_this.createInLineToolTip(ui_config, duration, uuid, name, ui_config.action_class === "tooltip_builder" ? "tooltip_builder" : "new-inline");
|
|
21103
22692
|
} else if (ui_config.display_type === "coach_mark_v2") {
|
|
21104
|
-
_this.
|
|
22693
|
+
_this.CDCV(ui_config, duration, uuid, name);
|
|
21105
22694
|
} else {
|
|
21106
22695
|
showCoachmarkWithDelay(_this, ui_config, {
|
|
21107
22696
|
configId: uuid,
|
|
@@ -21198,17 +22787,45 @@
|
|
|
21198
22787
|
});
|
|
21199
22788
|
cardsContainer.showEmbedCards();
|
|
21200
22789
|
});
|
|
22790
|
+
_defineProperty(this, "showStories", function (config, duration, configId, name, position, slidesSeenCount, view_id) {
|
|
22791
|
+
try {
|
|
22792
|
+
config = config.split("\n").join("\\n");
|
|
22793
|
+
var ui_config = JSON.parse(config);
|
|
22794
|
+
_this.nzCu(ui_config, configId, name, position, slidesSeenCount, view_id);
|
|
22795
|
+
} catch (e) {
|
|
22796
|
+
var _window$Apxor3;
|
|
22797
|
+
if (((_window$Apxor3 = window.Apxor) === null || _window$Apxor3 === void 0 ? void 0 : _window$Apxor3.platform) === "ios") {
|
|
22798
|
+
var _window14, _window14$logInternal, _window15, _window15$updateFlag;
|
|
22799
|
+
(_window14 = window) === null || _window14 === void 0 || (_window14 = _window14.Apxor) === null || _window14 === void 0 || (_window14$logInternal = _window14.logInternalEvent) === null || _window14$logInternal === void 0 || _window14$logInternal.call(_window14, "story_slides_closed");
|
|
22800
|
+
(_window15 = window) === null || _window15 === void 0 || (_window15 = _window15.Apxor) === null || _window15 === void 0 || (_window15$updateFlag = _window15.updateFlag) === null || _window15$updateFlag === void 0 || _window15$updateFlag.call(_window15, false, "IN_APP");
|
|
22801
|
+
} else {
|
|
22802
|
+
var _window16, _window16$updateFlag;
|
|
22803
|
+
(_window16 = window) === null || _window16 === void 0 || (_window16 = _window16.Apxor) === null || _window16 === void 0 || (_window16$updateFlag = _window16.updateFlag) === null || _window16$updateFlag === void 0 || _window16$updateFlag.call(_window16, "IN_APP", false);
|
|
22804
|
+
}
|
|
22805
|
+
console.error(e);
|
|
22806
|
+
}
|
|
22807
|
+
});
|
|
22808
|
+
_defineProperty(this, "nzCu", function (config, configId, name, position, slidesSeenCount, view_id) {
|
|
22809
|
+
var cardsContainer = new Stories(config, configId, name, position, slidesSeenCount, view_id, function () {
|
|
22810
|
+
window.Apxor.logAppEvent("apx_nudge_shown", {
|
|
22811
|
+
campaignName: name,
|
|
22812
|
+
id: configId,
|
|
22813
|
+
apx_nudge_type: "stories"
|
|
22814
|
+
});
|
|
22815
|
+
}, function () {});
|
|
22816
|
+
cardsContainer.showStories();
|
|
22817
|
+
});
|
|
21201
22818
|
_defineProperty(this, "removeAll", function () {
|
|
21202
|
-
var
|
|
21203
|
-
(
|
|
22819
|
+
var _window17, _window17$updateFlag;
|
|
22820
|
+
(_window17 = window) === null || _window17 === void 0 || (_window17 = _window17.Apxor) === null || _window17 === void 0 || (_window17$updateFlag = _window17.updateFlag) === null || _window17$updateFlag === void 0 || _window17$updateFlag.call(_window17, false);
|
|
21204
22821
|
if (_this.currentAction !== null && _this.currentAction !== undefined) {
|
|
21205
22822
|
_this.isShowingAction = false;
|
|
21206
22823
|
try {
|
|
21207
|
-
var
|
|
22824
|
+
var _window18;
|
|
21208
22825
|
_this.currentAction();
|
|
21209
22826
|
_this.currentAction = null;
|
|
21210
22827
|
console.log("Callback is called");
|
|
21211
|
-
(
|
|
22828
|
+
(_window18 = window) === null || _window18 === void 0 || (_window18 = _window18.ApxorLogger) === null || _window18 === void 0 || _window18.debug("Callback is called");
|
|
21212
22829
|
} catch (e) {}
|
|
21213
22830
|
}
|
|
21214
22831
|
});
|
|
@@ -21220,48 +22837,48 @@
|
|
|
21220
22837
|
var onShow = function onShow() {
|
|
21221
22838
|
_this.isShowingAction = true;
|
|
21222
22839
|
if (window.Apxor && window.Apxor.logActionEvent) {
|
|
21223
|
-
var
|
|
21224
|
-
(
|
|
22840
|
+
var _window19, _window19$updateFlag, _window20, _window20$updateCount;
|
|
22841
|
+
(_window19 = window) === null || _window19 === void 0 || (_window19 = _window19.Apxor) === null || _window19 === void 0 || (_window19$updateFlag = _window19.updateFlag) === null || _window19$updateFlag === void 0 || _window19$updateFlag.call(_window19, true);
|
|
21225
22842
|
window.Apxor.logActionEvent("inline_shown", uuid, name);
|
|
21226
|
-
(
|
|
22843
|
+
(_window20 = window) === null || _window20 === void 0 || (_window20 = _window20.Apxor) === null || _window20 === void 0 || (_window20$updateCount = _window20.updateCount) === null || _window20$updateCount === void 0 || _window20$updateCount.call(_window20, uuid);
|
|
21227
22844
|
if (ui_config !== null && ui_config !== void 0 && ui_config.is_preview) {
|
|
21228
22845
|
setTimeout(function () {
|
|
21229
|
-
var
|
|
21230
|
-
(
|
|
22846
|
+
var _window21, _window21$logInternal;
|
|
22847
|
+
(_window21 = window) === null || _window21 === void 0 || (_window21 = _window21.Apxor) === null || _window21 === void 0 || (_window21$logInternal = _window21.logInternalEvent) === null || _window21$logInternal === void 0 || _window21$logInternal.call(_window21, "capt");
|
|
21231
22848
|
}, 500);
|
|
21232
22849
|
}
|
|
21233
22850
|
}
|
|
21234
22851
|
};
|
|
21235
22852
|
var onHide = function onHide(isCancelled) {
|
|
21236
|
-
var
|
|
22853
|
+
var _window22, _window22$updateFlag, _window23;
|
|
21237
22854
|
_this.isShowingAction = false;
|
|
21238
22855
|
_this.currentAction = null;
|
|
21239
|
-
_this.
|
|
21240
|
-
(
|
|
22856
|
+
_this.mgMJ = null;
|
|
22857
|
+
(_window22 = window) === null || _window22 === void 0 || (_window22 = _window22.Apxor) === null || _window22 === void 0 || (_window22$updateFlag = _window22.updateFlag) === null || _window22$updateFlag === void 0 || _window22$updateFlag.call(_window22, false);
|
|
21241
22858
|
if (window.Apxor && window.Apxor.logActionEvent && !isCancelled) {
|
|
21242
22859
|
window.Apxor.logActionEvent("inline_dismissed", uuid, name);
|
|
21243
22860
|
}
|
|
21244
|
-
if (((
|
|
21245
|
-
var
|
|
21246
|
-
(
|
|
22861
|
+
if (((_window23 = window) === null || _window23 === void 0 || (_window23 = _window23.ApxorWebView) === null || _window23 === void 0 ? void 0 : _window23.getLayoutType()) === "web-inline") {
|
|
22862
|
+
var _window24;
|
|
22863
|
+
(_window24 = window) === null || _window24 === void 0 || (_window24 = _window24.ApxorWebView) === null || _window24 === void 0 || _window24.removeWebView();
|
|
21247
22864
|
}
|
|
21248
22865
|
};
|
|
21249
22866
|
if (action_class === "new-inline") {
|
|
21250
|
-
_this.
|
|
22867
|
+
_this.mgMJ = new InLineTooltip(ui_config, [], [], terminationConfig, {
|
|
21251
22868
|
configId: uuid,
|
|
21252
22869
|
configName: name
|
|
21253
22870
|
}, _this, onShow, onHide, function () {}, false, 0);
|
|
21254
22871
|
} else if (action_class === "tooltip_builder") {
|
|
21255
|
-
_this.
|
|
22872
|
+
_this.mgMJ = new NewInLineTooltip(ui_config, terminationConfig, {
|
|
21256
22873
|
configId: uuid,
|
|
21257
22874
|
configName: name
|
|
21258
22875
|
}, _this, onShow, onHide);
|
|
21259
22876
|
}
|
|
21260
22877
|
setTimeout(function () {
|
|
21261
|
-
_this.
|
|
22878
|
+
_this.mgMJ.createNewTooltip();
|
|
21262
22879
|
}, ui_config.delay);
|
|
21263
22880
|
});
|
|
21264
|
-
_defineProperty(this, "
|
|
22881
|
+
_defineProperty(this, "CDCV", function (ui_config, duration, uuid, name) {
|
|
21265
22882
|
var terminationConfig = {};
|
|
21266
22883
|
terminationConfig["auto_dismiss"] = duration > 0;
|
|
21267
22884
|
terminationConfig["duration"] = duration;
|
|
@@ -21271,35 +22888,35 @@
|
|
|
21271
22888
|
}, _this, function () {
|
|
21272
22889
|
_this.isShowingAction = true;
|
|
21273
22890
|
if (window.Apxor && window.Apxor.logActionEvent) {
|
|
21274
|
-
var
|
|
21275
|
-
(
|
|
22891
|
+
var _window25, _window25$updateFlag;
|
|
22892
|
+
(_window25 = window) === null || _window25 === void 0 || (_window25 = _window25.Apxor) === null || _window25 === void 0 || (_window25$updateFlag = _window25.updateFlag) === null || _window25$updateFlag === void 0 || _window25$updateFlag.call(_window25, true);
|
|
21276
22893
|
window.Apxor.logActionEvent("inline_shown", uuid, name);
|
|
21277
22894
|
if (ui_config !== null && ui_config !== void 0 && ui_config.is_preview) {
|
|
21278
22895
|
setTimeout(function () {
|
|
21279
|
-
var
|
|
21280
|
-
(
|
|
22896
|
+
var _window26, _window26$logInternal;
|
|
22897
|
+
(_window26 = window) === null || _window26 === void 0 || (_window26 = _window26.Apxor) === null || _window26 === void 0 || (_window26$logInternal = _window26.logInternalEvent) === null || _window26$logInternal === void 0 || _window26$logInternal.call(_window26, "capt");
|
|
21281
22898
|
}, 500);
|
|
21282
22899
|
}
|
|
21283
22900
|
}
|
|
21284
22901
|
}, function (isCancelled) {
|
|
21285
|
-
var
|
|
22902
|
+
var _window27, _window27$updateFlag, _window28;
|
|
21286
22903
|
_this.isShowingAction = false;
|
|
21287
22904
|
_this.currentAction = null;
|
|
21288
|
-
_this.
|
|
21289
|
-
(
|
|
22905
|
+
_this.mgMJ = null;
|
|
22906
|
+
(_window27 = window) === null || _window27 === void 0 || (_window27 = _window27.Apxor) === null || _window27 === void 0 || (_window27$updateFlag = _window27.updateFlag) === null || _window27$updateFlag === void 0 || _window27$updateFlag.call(_window27, false);
|
|
21290
22907
|
if (window.Apxor && window.Apxor.logActionEvent && !isCancelled) {
|
|
21291
22908
|
window.Apxor.logActionEvent("inline_dismissed", uuid, name);
|
|
21292
22909
|
}
|
|
21293
|
-
if (((
|
|
21294
|
-
var
|
|
21295
|
-
(
|
|
22910
|
+
if (((_window28 = window) === null || _window28 === void 0 || (_window28 = _window28.ApxorWebView) === null || _window28 === void 0 ? void 0 : _window28.getLayoutType()) === "web-inline") {
|
|
22911
|
+
var _window29;
|
|
22912
|
+
(_window29 = window) === null || _window29 === void 0 || (_window29 = _window29.ApxorWebView) === null || _window29 === void 0 || _window29.removeWebView();
|
|
21296
22913
|
}
|
|
21297
22914
|
}, _this.stepperCallback, false, 0);
|
|
21298
22915
|
_this._currentCoachmark.createNewCoachMark();
|
|
21299
22916
|
});
|
|
21300
22917
|
_defineProperty(this, "updateElementPositionOnScroll", function (top, left, height, width) {
|
|
21301
|
-
if (_this.
|
|
21302
|
-
_this.
|
|
22918
|
+
if (_this.mgMJ) {
|
|
22919
|
+
_this.mgMJ.updateElementPositionOnScroll(top, left, height, width);
|
|
21303
22920
|
}
|
|
21304
22921
|
});
|
|
21305
22922
|
_defineProperty(this, "createInAppVideo", function (config, duration, configId, name) {
|
|
@@ -21316,15 +22933,15 @@
|
|
|
21316
22933
|
var VideoInAppInstance = new VideoInApp(videoConfig, terminationConfig, configId, name, function () {
|
|
21317
22934
|
_this.isShowingAction = true;
|
|
21318
22935
|
if (window.Apxor && window.Apxor.logActionEvent) {
|
|
21319
|
-
var
|
|
21320
|
-
(
|
|
22936
|
+
var _window30, _window30$updateFlag;
|
|
22937
|
+
(_window30 = window) === null || _window30 === void 0 || (_window30 = _window30.Apxor) === null || _window30 === void 0 || (_window30$updateFlag = _window30.updateFlag) === null || _window30$updateFlag === void 0 || _window30$updateFlag.call(_window30, true);
|
|
21321
22938
|
window.Apxor.logActionEvent("inapp_shown", configId, name);
|
|
21322
22939
|
}
|
|
21323
22940
|
}, function () {
|
|
21324
|
-
var
|
|
22941
|
+
var _window31, _window31$updateFlag;
|
|
21325
22942
|
_this.isShowingAction = false;
|
|
21326
22943
|
_this.currentAction = null;
|
|
21327
|
-
(
|
|
22944
|
+
(_window31 = window) === null || _window31 === void 0 || (_window31 = _window31.Apxor) === null || _window31 === void 0 || (_window31$updateFlag = _window31.updateFlag) === null || _window31$updateFlag === void 0 || _window31$updateFlag.call(_window31, false);
|
|
21328
22945
|
if (window.Apxor && window.Apxor.logActionEvent) {
|
|
21329
22946
|
window.Apxor.logActionEvent("inapp_dismissed", configId, name);
|
|
21330
22947
|
}
|
|
@@ -21350,19 +22967,19 @@
|
|
|
21350
22967
|
var onShow = function onShow() {
|
|
21351
22968
|
_this.isShowingAction = true;
|
|
21352
22969
|
if (window.Apxor && window.Apxor.logActionEvent) {
|
|
21353
|
-
var _window$
|
|
21354
|
-
if (((_window$
|
|
21355
|
-
var
|
|
21356
|
-
(
|
|
22970
|
+
var _window$Apxor4;
|
|
22971
|
+
if (((_window$Apxor4 = window.Apxor) === null || _window$Apxor4 === void 0 ? void 0 : _window$Apxor4.platform) === "ios") {
|
|
22972
|
+
var _window32, _window32$updateFlag;
|
|
22973
|
+
(_window32 = window) === null || _window32 === void 0 || (_window32 = _window32.Apxor) === null || _window32 === void 0 || (_window32$updateFlag = _window32.updateFlag) === null || _window32$updateFlag === void 0 || _window32$updateFlag.call(_window32, true, "IN_APP");
|
|
21357
22974
|
} else {
|
|
21358
|
-
var
|
|
21359
|
-
(
|
|
22975
|
+
var _window33, _window33$updateFlag;
|
|
22976
|
+
(_window33 = window) === null || _window33 === void 0 || (_window33 = _window33.Apxor) === null || _window33 === void 0 || (_window33$updateFlag = _window33.updateFlag) === null || _window33$updateFlag === void 0 || _window33$updateFlag.call(_window33, "IN_APP", true);
|
|
21360
22977
|
}
|
|
21361
22978
|
window.Apxor.logActionEvent("inapp_shown", configId, name);
|
|
21362
22979
|
}
|
|
21363
22980
|
};
|
|
21364
22981
|
var onHide = function onHide(backgroundDiv, action) {
|
|
21365
|
-
var _dialogContent$classL, _window$
|
|
22982
|
+
var _dialogContent$classL, _window$Apxor5;
|
|
21366
22983
|
var cssClass = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : ".apx-dlg-c";
|
|
21367
22984
|
var closeListener = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
|
|
21368
22985
|
var redirectionListener = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : null;
|
|
@@ -21373,12 +22990,12 @@
|
|
|
21373
22990
|
// setTimeout(() => {
|
|
21374
22991
|
backgroundDiv.remove();
|
|
21375
22992
|
_this.isShowingAction = false;
|
|
21376
|
-
if (((_window$
|
|
21377
|
-
var
|
|
21378
|
-
(
|
|
22993
|
+
if (((_window$Apxor5 = window.Apxor) === null || _window$Apxor5 === void 0 ? void 0 : _window$Apxor5.platform) === "ios") {
|
|
22994
|
+
var _window34, _window34$updateFlag;
|
|
22995
|
+
(_window34 = window) === null || _window34 === void 0 || (_window34 = _window34.Apxor) === null || _window34 === void 0 || (_window34$updateFlag = _window34.updateFlag) === null || _window34$updateFlag === void 0 || _window34$updateFlag.call(_window34, false, "IN_APP");
|
|
21379
22996
|
} else {
|
|
21380
|
-
var
|
|
21381
|
-
(
|
|
22997
|
+
var _window35, _window35$updateFlag;
|
|
22998
|
+
(_window35 = window) === null || _window35 === void 0 || (_window35 = _window35.Apxor) === null || _window35 === void 0 || (_window35$updateFlag = _window35.updateFlag) === null || _window35$updateFlag === void 0 || _window35$updateFlag.call(_window35, "IN_APP", false);
|
|
21382
22999
|
}
|
|
21383
23000
|
_this.currentAction = null;
|
|
21384
23001
|
if (window.Apxor && window.Apxor.logActionEvent && !(action == "cancel" || action == "redirect")) {
|
|
@@ -21393,11 +23010,11 @@
|
|
|
21393
23010
|
inappModal.createInAppModal();
|
|
21394
23011
|
});
|
|
21395
23012
|
_defineProperty(this, "showPlaceHolder", function () {
|
|
21396
|
-
var
|
|
21397
|
-
if (_this.
|
|
23013
|
+
var _window36;
|
|
23014
|
+
if (_this.yqcV) {
|
|
21398
23015
|
return;
|
|
21399
23016
|
}
|
|
21400
|
-
_this.
|
|
23017
|
+
_this.yqcV = true;
|
|
21401
23018
|
var ele = document.createElement("div");
|
|
21402
23019
|
ele.innerHTML = "place your immersive card here";
|
|
21403
23020
|
ele.style.backgroundColor = "#f5f5f5";
|
|
@@ -21407,20 +23024,62 @@
|
|
|
21407
23024
|
ele.style.padding = "12px";
|
|
21408
23025
|
ele.style.fontSize = "14px";
|
|
21409
23026
|
document.body.appendChild(ele);
|
|
21410
|
-
(
|
|
23027
|
+
(_window36 = window) === null || _window36 === void 0 || (_window36 = _window36.ApxorWidget) === null || _window36 === void 0 || _window36.setDimensions(window.document.querySelector("html").offsetWidth, window.document.querySelector("html").offsetHeight);
|
|
23028
|
+
});
|
|
23029
|
+
_defineProperty(this, "pauseStories", function () {
|
|
23030
|
+
var progress = Array.from(document.querySelectorAll(".progress"));
|
|
23031
|
+
var activeIndex = progress.findIndex(function (el) {
|
|
23032
|
+
return el.classList.contains("active");
|
|
23033
|
+
});
|
|
23034
|
+
progress[activeIndex].style.animationPlayState = "paused";
|
|
23035
|
+
var slide_details_to_be_deleted;
|
|
23036
|
+
slide_details_to_be_deleted = document.querySelector(".slide-details");
|
|
23037
|
+
var childElements = slide_details_to_be_deleted.querySelectorAll("video");
|
|
23038
|
+
for (var i = 0; i < childElements.length; i++) {
|
|
23039
|
+
var child = childElements[i];
|
|
23040
|
+
if (child.tagName.toLowerCase() === "video") {
|
|
23041
|
+
child.pause();
|
|
23042
|
+
}
|
|
23043
|
+
}
|
|
23044
|
+
});
|
|
23045
|
+
_defineProperty(this, "resumeStories", function () {
|
|
23046
|
+
var progress = Array.from(document.querySelectorAll(".progress"));
|
|
23047
|
+
var activeIndex = progress.findIndex(function (el) {
|
|
23048
|
+
return el.classList.contains("active");
|
|
23049
|
+
});
|
|
23050
|
+
progress[activeIndex].style.animationPlayState = "running";
|
|
23051
|
+
var slide_details_to_be_deleted;
|
|
23052
|
+
slide_details_to_be_deleted = document.querySelector(".slide-details");
|
|
23053
|
+
var childElements = slide_details_to_be_deleted.querySelectorAll("video");
|
|
23054
|
+
for (var i = 0; i < childElements.length; i++) {
|
|
23055
|
+
var child = childElements[i];
|
|
23056
|
+
if (child.tagName.toLowerCase() === "video") {
|
|
23057
|
+
child.play();
|
|
23058
|
+
}
|
|
23059
|
+
}
|
|
21411
23060
|
});
|
|
21412
23061
|
// createSurvey = (config, configId, name) => {
|
|
21413
23062
|
// const survey_obj = new NewSurveys(configId, name, config, []);
|
|
21414
23063
|
// survey_obj.createSurvey();
|
|
21415
23064
|
// };
|
|
21416
23065
|
_defineProperty(this, "logEvent", function (name, additional_info) {
|
|
21417
|
-
var _window$
|
|
21418
|
-
if (((_window$
|
|
23066
|
+
var _window$Apxor6;
|
|
23067
|
+
if (((_window$Apxor6 = window.Apxor) === null || _window$Apxor6 === void 0 ? void 0 : _window$Apxor6.platform) === "ios") {
|
|
21419
23068
|
window.Apxor.logAppEvent(name, additional_info);
|
|
21420
23069
|
} else {
|
|
21421
23070
|
window.Apxor.logAppEvent(name, JSON.stringify(additional_info));
|
|
21422
23071
|
}
|
|
21423
23072
|
});
|
|
23073
|
+
_defineProperty(this, "pauseVideos", function () {
|
|
23074
|
+
var videos_to_be_paused = document.querySelector(".slide-details");
|
|
23075
|
+
var childElements = videos_to_be_paused.querySelectorAll("video");
|
|
23076
|
+
for (var i = 0; i < childElements.length; i++) {
|
|
23077
|
+
var child = childElements[i];
|
|
23078
|
+
if (child.tagName.toLowerCase() === "video") {
|
|
23079
|
+
child.muted = true;
|
|
23080
|
+
}
|
|
23081
|
+
}
|
|
23082
|
+
});
|
|
21424
23083
|
});
|
|
21425
23084
|
|
|
21426
23085
|
/* eslint-disable no-empty */
|