Last active
January 15, 2024 15:13
-
-
Save chavesm/1dca9557f4351c45ecd949e156885349 to your computer and use it in GitHub Desktop.
A mockup for sending an impression to GA for every slide displayed by Swiper JS from the DG Divi Slider Carousel Plugin
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Modified to mockup sending an impression to GA for every slide displayed. | |
| * | |
| * I don't think this is really practical, but it was a customer request. | |
| */ | |
| !function(e) { | |
| var t = {}; | |
| function o(a) { | |
| if (t[a]) | |
| return t[a].exports; | |
| var n = t[a] = { | |
| i: a, | |
| l: !1, | |
| exports: {} | |
| }; | |
| return e[a].call(n.exports, n, n.exports, o), | |
| n.l = !0, | |
| n.exports | |
| } | |
| o.m = e, | |
| o.c = t, | |
| o.d = function(e, t, a) { | |
| o.o(e, t) || Object.defineProperty(e, t, { | |
| configurable: !1, | |
| enumerable: !0, | |
| get: a | |
| }) | |
| } | |
| , | |
| o.n = function(e) { | |
| var t = e && e.__esModule ? function() { | |
| return e.default | |
| } | |
| : function() { | |
| return e | |
| } | |
| ; | |
| return o.d(t, "a", t), | |
| t | |
| } | |
| , | |
| o.o = function(e, t) { | |
| return Object.prototype.hasOwnProperty.call(e, t) | |
| } | |
| , | |
| o.p = "/", | |
| o(o.s = 13) | |
| }([function(e, t, o) { | |
| "use strict"; | |
| Object.defineProperty(t, "__esModule", { | |
| value: !0 | |
| }); | |
| var a = { | |
| extend: function(e, t) { | |
| var o, a = {}; | |
| for (o in e) | |
| Object.prototype.hasOwnProperty.call(e, o) && (a[o] = e[o]); | |
| for (o in t) | |
| Object.prototype.hasOwnProperty.call(t, o) && (a[o] = t[o]); | |
| return a | |
| }, | |
| apply_element_color: function(e, t, o, a, n, r, c) { | |
| var i = e[t] | |
| , l = e[t + "__hover"] | |
| , s = !0 === c ? "!important" : ""; | |
| "" !== i && o.push([{ | |
| selector: n, | |
| declaration: "".concat(a, ": ").concat(i + s, ";") | |
| }]), | |
| e[t + "__hover_enabled"] && e.hover_enabled && 1 == e.hover_enabled && e[t + "__hover"] && o.push([{ | |
| selector: n, | |
| declaration: "".concat(a, ": ").concat(l + s, ";") | |
| }]) | |
| }, | |
| adding_margin_padding: function(e, t, o, a, n, r) { | |
| var c = e[t] | |
| , i = e[t + "_tablet"] | |
| , l = e[t + "_phone"]; | |
| if (c && "" !== c) { | |
| var s = c.split("|"); | |
| o.push([{ | |
| selector: a, | |
| declaration: "".concat(r, "-top: ").concat(s[0], "!important;\n ").concat(r, "-right: ").concat(s[1], "!important;\n ").concat(r, "-bottom: ").concat(s[2], "!important;\n ").concat(r, "-left: ").concat(s[3], "!important;") | |
| }]) | |
| } | |
| if (i && "" !== i) { | |
| var p = i.split("|"); | |
| o.push([{ | |
| selector: a, | |
| declaration: "".concat(r, "-top: ").concat(p[0], "!important;\n ").concat(r, "-right: ").concat(p[1], "!important;\n ").concat(r, "-bottom: ").concat(p[2], "!important;\n ").concat(r, "-left: ").concat(p[3], "!important;"), | |
| device: "tablet" | |
| }]) | |
| } | |
| if (l && "" !== l) { | |
| var d = l.split("|"); | |
| o.push([{ | |
| selector: a, | |
| declaration: "".concat(r, "-top: ").concat(d[0], "!important;\n ").concat(r, "-right: ").concat(d[1], "!important;\n ").concat(r, "-bottom: ").concat(d[2], "!important;\n ").concat(r, "-left: ").concat(d[3], "!important;"), | |
| device: "phone" | |
| }]) | |
| } | |
| if (e[t + "__hover_enabled"] && e.hover_enabled && 1 == e.hover_enabled && e[t + "__hover"]) { | |
| var u = e[t + "__hover"].split("|"); | |
| o.push([{ | |
| selector: a, | |
| declaration: "".concat(r, "-top: ").concat(u[0], "!important;\n ").concat(r, "-right: ").concat(u[1], "!important;\n ").concat(r, "-bottom: ").concat(u[2], "!important;\n ").concat(r, "-left: ").concat(u[3], "!important;") | |
| }]) | |
| } | |
| }, | |
| apply_single_value: function(e, t, o, a, n) { | |
| var r = arguments.length > 5 && void 0 !== arguments[5] ? arguments[5] : "%" | |
| , c = arguments.length > 6 && void 0 !== arguments[6] ? arguments[6] : "" | |
| , i = arguments.length > 7 && void 0 !== arguments[7] && arguments[7] | |
| , l = !(arguments.length > 8 && void 0 !== arguments[8]) || arguments[8] | |
| , s = !e[t] && c ? c : parseInt(e[t]) | |
| , p = !1 === i ? s : 100 - s | |
| , d = !1 === i ? parseInt(e[t + "_tablet"]) : 100 - parseInt(e[t + "_tablet"]) | |
| , u = !1 === i ? parseInt(e[t + "_phone"]) : 100 - parseInt(e[t + "_phone"]) | |
| , h = !1 === l ? "-" : ""; | |
| d = h + d + r, | |
| u = h + u + r, | |
| (p = h + p + r) && "" !== p && o.push([{ | |
| selector: a, | |
| declaration: "".concat(n, ": ").concat(p, ";") | |
| }]), | |
| d && "" !== d && o.push([{ | |
| selector: a, | |
| declaration: "".concat(n, ": ").concat(d, ";"), | |
| device: "tablet" | |
| }]), | |
| u && "" !== u && o.push([{ | |
| selector: a, | |
| declaration: "".concat(n, ": ").concat(u, ";"), | |
| device: "phone" | |
| }]) | |
| }, | |
| control_width_and_spacing: function(e, t, o, a, n) { | |
| var r = e[t] | |
| , c = e[t + "_tablet"] | |
| , i = e[t + "_phone"]; | |
| r && "" !== r && o.push([{ | |
| selector: a, | |
| declaration: "".concat(n, ": ").concat(r, "!important;") | |
| }]), | |
| c && "" !== c && o.push([{ | |
| selector: a, | |
| declaration: "".concat(n, ": ").concat(c, "!important;"), | |
| device: "tablet" | |
| }]), | |
| i && "" !== i && o.push([{ | |
| selector: a, | |
| declaration: "".concat(n, ": ").concat(i, "!important;"), | |
| device: "phone" | |
| }]) | |
| }, | |
| render_title: function(e) { | |
| var t = e.title; | |
| return e.url && (t = '<a href="'.concat(e.url, '" target="').concat(e.url_new_window, '">').concat(t, "</a>")), | |
| { | |
| __html: t | |
| } | |
| }, | |
| render_subtitle: function(e) { | |
| return { | |
| __html: e.sub_title | |
| } | |
| }, | |
| process_single_value: function() { | |
| var e = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {} | |
| , t = this.extend({ | |
| props: {}, | |
| key: "", | |
| additionalCss: "", | |
| selector: "", | |
| type: "", | |
| unit: "%", | |
| default_value: "", | |
| decrease: !1, | |
| addition: !0, | |
| no_unit: !1, | |
| unit_type: !0 | |
| }, e) | |
| , o = t.props | |
| , a = t.key | |
| , n = t.additionalCss | |
| , r = t.selector | |
| , c = t.type | |
| , i = t.unit | |
| , l = t.default_value | |
| , s = t.decrease | |
| , p = t.addition | |
| , d = t.unit_type | |
| , u = "" !== o[a].replace(parseInt(o[a]), "") ? o[a].replace(parseInt(o[a]), "") : i | |
| , h = o[a + "_tablet"] ? o[a + "_tablet"].replace(parseInt(o[a + "_tablet"]), "") : u | |
| , _ = o[a + "_phone"] ? o[a + "_phone"].replace(parseInt(o[a + "_phone"]), "") : h | |
| , v = !o[a] && l ? l : parseInt(o[a]) | |
| , f = !1 === s ? v : 100 - v | |
| , b = !1 === s ? parseInt(o[a + "_tablet"]) : 100 - parseInt(o[a + "_tablet"]) | |
| , m = !1 === s ? parseInt(o[a + "_phone"]) : 100 - parseInt(o[a + "_phone"]) | |
| , g = !1 === p ? "-" : ""; | |
| if (f = g + f, | |
| b = g + b, | |
| m = g + m, | |
| !0 === d && (f += u, | |
| b += h, | |
| m += _), | |
| f && "" !== f && n.push([{ | |
| selector: r, | |
| declaration: "".concat(c, ": ").concat(f, ";") | |
| }]), | |
| b && "" !== b && n.push([{ | |
| selector: r, | |
| declaration: "".concat(c, ": ").concat(b, ";"), | |
| device: "tablet" | |
| }]), | |
| m && "" !== m && n.push([{ | |
| selector: r, | |
| declaration: "".concat(c, ": ").concat(m, ";"), | |
| device: "phone" | |
| }]), | |
| o[a + "__hover_enabled"] && o.hover_enabled && 1 == o.hover_enabled && o[a + "__hover"]) { | |
| var y = o[a + "__hover"]; | |
| n.push([{ | |
| selector: r, | |
| declaration: "".concat(c, ": ").concat(y, "!important;") | |
| }]) | |
| } | |
| } | |
| }; | |
| t.default = a | |
| } | |
| , function(e, t) {} | |
| , function(e, t) {} | |
| , , , , , , , , , , , function(e, t, o) { | |
| o(14), | |
| o(1), | |
| o(2), | |
| o(0), | |
| e.exports = o(15) | |
| } | |
| , function(e, t) {} | |
| , function(e, t) { | |
| jQuery(function(e) { | |
| e(".dica_divi_carousel").each(function(t, o) { | |
| var a = o.querySelector(".swiper-container") | |
| , n = o.querySelector(".dica-container") | |
| , r = JSON.parse(n.dataset.props) | |
| , c = Number(r.speed) | |
| , i = Number(r.desktop) | |
| , l = Number(r.tablet) | |
| , s = Number(r.mobile) | |
| , p = r.arrow | |
| , d = r.dots | |
| , u = r.autoplay | |
| , h = Number(r.autoSpeed) | |
| , _ = r.loop | |
| , v = Number(r.item_spacing.replace(/[^0-9.]/g, "")) | |
| , f = r.center_mode | |
| , b = r.slider_effec | |
| , m = r.pause_onhover | |
| , g = r.multislide | |
| , y = r.cfshadow | |
| , w = r.order | |
| , N = "on" == r.lazyload && { | |
| loadedClass: "swiper-lazy-loaded" | |
| } | |
| , I = r.scroller_effect | |
| , x = Number(r.scroller_speed) | |
| , P = r.autowidth | |
| , S = Number(r.item_spacing_tablet.replace(/[^0-9.]/g, "")) | |
| , k = Number(r.item_spacing_phone.replace(/[^0-9.]/g, "")); | |
| h = "on" !== I ? h : 1, | |
| "on" == r.lazybefore ? N.loadOnTransitionStart = !0 : N.loadOnTransitionStart = !1; | |
| var O = "on" == p && { | |
| nextEl: ".dica-next-btn-" + w, | |
| prevEl: ".dica-prev-btn-" + w | |
| } | |
| , C = "on" == d && { | |
| el: ".dica-paination-" + w, | |
| clickable: !0 | |
| } | |
| , z = Number(parseInt(r.cover_rotate)); | |
| z = isNaN(z) ? 0 : z; | |
| var j = new Swiper(a,{ | |
| slidesPerView: "on" !== P ? i : "auto", | |
| slidesPerGroup: "on" == g && "on" !== P && "on" !== I ? Number(i) : 1, | |
| navigation: O, | |
| pagination: C, | |
| spaceBetween: v, | |
| speed: "on" !== I ? c : x, | |
| autoplay: "on" == u && { | |
| delay: h, | |
| disableOnInteraction: !1 | |
| }, | |
| slideClass: "dica_divi_carouselitem", | |
| loop: "on" == _, | |
| centeredSlides: "on" == f, | |
| effect: "1" == b ? "slide" : b, | |
| coverflowEffect: { | |
| rotate: z, | |
| stretch: 0, | |
| depth: 100, | |
| modifier: 1, | |
| slideShadows: "off" !== y | |
| }, | |
| observer: !0, | |
| observeParents: !0, | |
| observeSlideChildren: !0, | |
| preloadImages: "on" != r.lazyload, | |
| watchSlidesVisibility: !0, | |
| preventClicks: !0, | |
| preventClicksPropagation: !0, | |
| slideToClickedSlide: !1, | |
| touchMoveStopPropagation: !0, | |
| threshold: 15, | |
| lazy: N, | |
| hashNavigation: "on" === r.hashNavigation && { | |
| watchState: !0 | |
| }, | |
| breakpoints: { | |
| 981: { | |
| slidesPerView: "on" !== P ? i : "auto", | |
| slidesPerGroup: "on" == g && "on" !== P && "on" !== I ? Number(i) : 1, | |
| spaceBetween: v | |
| }, | |
| 768: { | |
| slidesPerView: "on" !== P ? l : "auto", | |
| slidesPerGroup: "on" == g && "on" !== P && "on" !== I ? Number(l) : 1, | |
| spaceBetween: S | |
| }, | |
| 1: { | |
| slidesPerView: "on" !== P ? s : "auto", | |
| slidesPerGroup: "on" == g && "on" !== P && "on" !== I ? Number(s) : 1, | |
| spaceBetween: k | |
| } | |
| } | |
| }); | |
| // Intercept the event to do something interesting like | |
| // sending an impression event to GA. ~mlc | |
| j.on("slideChange", function () { | |
| // Console log it for now. | |
| // To do: get some ID/label for the slide and call | |
| // send event. ~mlc | |
| console.log( | |
| "slide changed from " + j.slides[j.activeIndex].innerHTML | |
| ); | |
| }); | |
| if ("on" === r.hashNavigation && j.slides.each(function(e, t) { | |
| var o = t.querySelector(".dica-item").dataset.hash; | |
| t.dataset.hash = o | |
| }), | |
| "on" == I && "on" == u) { | |
| var E = function() { | |
| j.autoplay.start() | |
| }; | |
| j.freeMode = !0, | |
| j.autoplay.stop(), | |
| e(window).load(function() { | |
| setTimeout(E, 1e3) | |
| }) | |
| } | |
| "on" !== I && j.on("observerUpdate", function(e) { | |
| "on" == u && (j.autoplay.paused = !1, | |
| j.translate = 0), | |
| j.update() | |
| }), | |
| "on" == m && "on" == u && (a.addEventListener("mouseover", function() { | |
| j.autoplay.stop() | |
| }), | |
| a.addEventListener("mouseout", function() { | |
| j.autoplay.start() | |
| })), | |
| "on" == r.lazyload && j.on("lazyImageReady", function(e, t) { | |
| e.querySelector(".dica-item").classList.remove("loading") | |
| }), | |
| e(this).find(".dica_divi_carouselitem .et_pb_module_inner").on("click", function(t) { | |
| var o = e(this).find(".dica-item")[0].dataset.link; | |
| if (o) { | |
| t.stopPropagation(); | |
| var a = e(this).find(".dica-item")[0].dataset.target; | |
| void 0 !== o && ("_blank" === a ? window.open(o) : window.location = o) | |
| } | |
| }) | |
| }); | |
| e("body").append('<div class="dg-carousel-lightbox"><div class="lightbox-header"><button class="close-btn">╳</button></div><div class="image-wrapper"><span><img src="" /></span></div></div>'); | |
| e(".dica-image-container a[data-lightbox]").each(function(t, o) { | |
| var a = e(this) | |
| , n = a.attr("href") | |
| , r = e(".dg-carousel-lightbox"); | |
| a.click(function(t) { | |
| t.preventDefault(), | |
| e(".dg-carousel-lightbox").addClass("open"), | |
| r.find("img").attr("src", n) | |
| }) | |
| }), | |
| e(".dg-carousel-lightbox .close-btn").click(function() { | |
| e(this).parent().parent().removeClass("open") | |
| }), | |
| e(".dg-carousel-lightbox .image-wrapper").click(function(t) { | |
| "IMG" !== t.target.tagName && e(this).parent().removeClass("open") | |
| }) | |
| }) | |
| } | |
| ]); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment