fix: adjust vwo script to listen to consent changes

public/_static/dist/js/vwo.js

@@ -98,7 +98,6 @@ window._vwo_code ||
         w._vwo_settings_timer = setTimeout(function () {
           window._vwo_code.finish();
           stT.removeItem(cK);
-        window._vwo_code.removeLoaderAndOverlay();
         }, sT);
         var filterConfig = this.filterConfig;
         if (!filterConfig || filterConfig.filterTime === "balanced") {
@@ -117,9 +116,6 @@ window._vwo_code ||
           else a.appendChild(d.createTextNode(b));
           h.appendChild(a);
         }
-      if (filterConfig && filterConfig.filterTime === "early") {
-        this.removeLoaderAndOverlay();
-      }
         this.load(
           "https://dev.visualwebsiteoptimizer.com/j.php?a=" +
             account_id +
@@ -144,126 +140,22 @@ window._vwo_code ||
           return;
         }
 
-      if (!config.filterTolerance) {
-        // Execute removal logic immediately when filterTolerance is 0 or empty
-        return;
-      }
-
-      function clearIntervals(timerIds) {
-        for (var i = 0; i < timerIds.length; i++) {
-          clearInterval(timerIds[i]);
-        }
-      }
         this.filterConfig = config;
-      var popupTimer = setInterval(function () {
+
-        if (window._vwo_code.applyFilters(config)) {
-          clearInterval(popupTimer);
-        }
-      }, 100);
         var timer = setInterval(function () {
           var state = config.isConsentGiven();
-        var shouldClearAllIntervals;
+          var shouldClearInterval;
           if (state === "1") {
-          window._vwo_code.showLoader();
             w._vwo_settings_timer = window._vwo_code.init();
-          shouldClearAllIntervals = true;
+            shouldClearInterval = true;
           } else if (state === "2") {
             window._vwo_code.filterConfig = undefined;
-          window._vwo_code.removeLoaderAndOverlay();
+            shouldClearInterval = true;
-          shouldClearAllIntervals = true;
           }
-        if (shouldClearAllIntervals) {
+          if (shouldClearInterval) {
-          clearIntervals([timer, popupTimer]);
+            clearInterval(timer);
-          clearInterval(filterToleranceTimer);
           }
         }, 100);
-      var filterToleranceTimer;
-
-      // RECOMMENDED: When using Best Approach
-      filterToleranceTimer = setTimeout(function () {
-        window._vwo_code.removeLoaderAndOverlay();
-        clearIntervals([timer, popupTimer]);
-      }, config.filterTolerance);
-    },
-    showLoader: function () {
-      var vwoOverlay = d.getElementsByClassName("vwo-overlay")[0];
-      if (!vwoOverlay) return;
-      var vwoContentLoader = d.createElement("div");
-      vwoContentLoader.classList.add("vwo-content-loader");
-      vwoOverlay.parentNode.insertBefore(
-        vwoContentLoader,
-        vwoOverlay.nextSibling
-      );
-    },
-    applyFilters: function (config) {
-      var popup = d.querySelector(config.popupSelector);
-      var popupZIndex;
-      if (!popup && d.getElementById("_vis_opt_overlay")) {
-        return;
-      }
-      var maxZIndex = 2147483647;
-      if (popup) {
-        var popupStyle = w.getComputedStyle(popup);
-        popupZIndex = popupStyle.getPropertyValue("z-index");
-        if (!popupZIndex || popupZIndex === "auto") {
-          popupZIndex = maxZIndex;
-        }
-        popup.style.zIndex = popupZIndex;
-      }
-      popupZIndex = popupZIndex || maxZIndex;
-      // You can change the styling to suit your requirements
-      // This is the default CSS filters VWO provides
-      // NOTE: do not change any class names IMPORTANT ...
-      var vwoFilter =
-          "position: fixed; top: 0; left: 0; right: 0; bottom: 0; height: 100%; width: 100%; -webkit-filter: blur(5px); filter: blur(5px); backdrop-filter: saturate(180%) blur(3px); -webkit-backdrop-filter: saturate(180%) blur(3px); z-index:" +
-          (popupZIndex - 1) +
-          ";",
-        vwoLoaderCss =
-          " .vwo-content-loader{ border: 16px solid #f3f3f3; border-top: 16px solid #3498db; border-radius: 50%; width: 90px; height: 90px; position: fixed; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); animation: vwo-spin 2s linear infinite; z-index:" +
-          (popupZIndex - 1) +
-          "; }" +
-          "@keyframes vwo-spin { 0% { -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); } 100% { -webkit-transform: translate(-50%, -50%) rotate(360deg); transform: translate(-50%, -50%) rotate(360deg); } }";
-      /**
-       * This below written code should not be tweaked
-       * */
-      var overlayStyleTag = d.getElementById("_vis_opt_overlay"),
-        overlayCSS = ".vwo-overlay{" + vwoFilter + "}" + vwoLoaderCss;
-      if (overlayStyleTag) {
-        if (overlayStyleTag.styleSheet) {
-          overlayStyleTag.styleSheet.cssText = overlayCSS;
-        } else {
-          var _vwo_textNode = d.createTextNode(overlayCSS);
-          overlayStyleTag.appendChild(_vwo_textNode);
-          overlayStyleTag.removeChild(overlayStyleTag.childNodes[0]);
-        }
-      } else {
-        var a = d.createElement("style"),
-          h = d.getElementsByTagName("head")[0],
-          body = d.getElementsByTagName("body")[0];
-        var vwoOverlay = d.createElement("div");
-        vwoOverlay.classList.add("vwo-overlay");
-        body.prepend(vwoOverlay);
-        // CAUTION Do not remove this id from your style tag. It is required by VWO
-        a.setAttribute("id", "_vis_opt_overlay");
-        a.setAttribute("type", "text/css");
-        if (a.styleSheet) a.styleSheet.cssText = overlayCSS;
-        else a.appendChild(d.createTextNode(overlayCSS));
-        h.appendChild(a);
-      }
-      return !!popup;
-    },
-    removeLoaderAndOverlay: function () {
-      var overlay = d.getElementsByClassName("vwo-overlay");
-      var loader = d.getElementsByClassName("vwo-content-loader");
-      var overlayStyleTag = d.getElementById("_vis_opt_overlay");
-      overlay &&
-        (overlay = overlay[0]) &&
-        overlay.parentElement.removeChild(overlay);
-      loader &&
-        (loader = loader[0]) &&
-        loader.parentElement.removeChild(loader);
-      overlayStyleTag &&
-        overlayStyleTag.parentElement.removeChild(overlayStyleTag);
       },
       isNonLiveMode: function (accountId) {
         var wName = w.name;
@@ -286,7 +178,20 @@ filterTime: "balanced",
   isConsentGiven: function () {
     /** your custom Code */
     if (document.cookie.indexOf("CookieConsent") != -1) {
-    var ccValue = decodeURIComponent(document.cookie.replace(new RegExp("(?:(?:^|.*;)\\s*" + encodeURIComponent("CookieConsent").replace(/[\-\.\+\*]/g, "\\$&") + "\\s*\\=\\s*([^;]*).*$)|^.*$"), "$1")) || null;
+      var ccValue =
+        decodeURIComponent(
+          document.cookie.replace(
+            new RegExp(
+              "(?:(?:^|.*;)\\s*" +
+                encodeURIComponent("CookieConsent").replace(
+                  /[\-\.\+\*]/g,
+                  "\\$&"
+                ) +
+                "\\s*\\=\\s*([^;]*).*$)|^.*$"
+            ),
+            "$1"
+          )
+        ) || null;
       let consentValue = "2";
       if (ccValue) {
         ccValue = ccValue.substring(ccValue.indexOf(",statistics") + 12);
@@ -298,5 +203,4 @@ isConsentGiven: function () {
       return "3";
     }
   },
-filterTolerance: 0,
 });