Untitled

 avatar
unknown
plain_text
2 years ago
4.4 kB
9
Indexable
(function () {
  try {
    var debug = 0;
    var variation_name = "";
    var style = `/* Progress bar */
    .eg-progress {
        width: 100% !important;
    }
    
    .progress-bar {
        width: 100%;
        height: 13px;
        background-color: #faf7f1;
        color: #222 !important;
        border: 1px solid #cfbc9e !important;
        border-radius: 3px;
    }
    
    .progress {
        height: 100%;
        background-color: #cfbc9e;
        width: 0;
        transition: width 0.3s ease-in-out;
    }
    
    .eg-progress.eg-hide {
        display: none !important;
    }
    
    .eg-progress .free-gift-msg {
        margin-bottom: 6px !important;
    }
    #nt_cart_canvas .mini_cart_header {
        padding: 5px 20px !important;
        flex-wrap: wrap !important;
    }
    #nt_cart_canvas .mini_cart_header>.close_pp {
        height: 34px !important;
        line-height: 34px !important;
        justify-content: flex-end !important;
        display: flex;
        width: 19px !important;
    }`;
    function waitForElement(selector, trigger, delayInterval, delayTimeout) {
      var interval = setInterval(function () {
        if (
          document &&
          document.querySelector(selector) &&
          document.querySelectorAll(selector).length > 0
        ) {
          clearInterval(interval);
          trigger();
        }
      }, delayInterval);
      setTimeout(function () {
        clearInterval(interval);
      }, delayTimeout);
    }

    function init() {
      addStyles('egst', style);
      // Add Progress bar
      addProgressBar();
    }

    const addProgressBar = () => {
      waitForElement("html body .mini_cart_footer>.total>.js_cat_ttprice > .cart_tot_price", function () {
        // extracting amount
        const amountString = document.querySelector("html body .mini_cart_footer>.total>.js_cat_ttprice > .cart_tot_price").innerText;
        const regex = /(\d+(?:\.\d+)?)/;
        const matches = amountString.match(regex);

        if (matches) {
          if (!document.querySelector(".eg-progress")) {
            document.querySelector("#nt_cart_canvas .mini_cart_header").insertAdjacentHTML('beforeend', `<div class="eg-progress">
                <p class="free-gift-msg"></p>
                <div class="progress-bar">
                <div class="progress"></div>
              </div>
              </div>`);
          }
          const amount = matches[1];
          calculatePercentage(Number(amount));
        }

      }, 50, 15000);
    }

    const calculatePercentage = (amount) => {
      //Amount Represents $40 out of $80
      const progressBar = document.querySelector('.eg-progress .progress');
      if (amount <= 80) {
        const maxAmount = 80;
        const percentage = (amount / maxAmount) * 100;
        if (amount < 80) {
          const amountLeft = maxAmount - amount;
          document.querySelector(".eg-progress .free-gift-msg").innerHTML = `<strong>£${amountLeft.toFixed(2)}</strong> away from your free gift`;
        } else {
          document.querySelector(".eg-progress .free-gift-msg").innerHTML = `<strong>Congrats</strong>, you unlocked a free gift`;
        }
        progressBar.style.width = `${percentage}%`;

      } else {
        document.querySelector(".eg-progress .free-gift-msg").innerHTML = `<strong>Congrats</strong>, you unlocked a free gift`;
        progressBar.style.width = `${100}%`;
      }

    }
    function checkCartUpdate() {
      const originalFetch = window.fetch;

      window.fetch = function (input, initt) {
        const fetchPromise = originalFetch(input, initt);

        fetchPromise.then(response => {
          if (response.url.indexOf("cart") !== -1) {
            waitForElement('html body', init, 50, 15000);
          }
        });

        return fetchPromise;
      };
    }
    function addStyles(expTag, styles) {
      const alreadyAdded = document.querySelector(`style#${expTag}`);

      if (!alreadyAdded) {
        const link = document.createElement("style");

        link.textContent = styles;
        link.id = expTag;

        document.querySelector("head").insertAdjacentElement("beforeend", link);
      }
    }
    waitForElement('html body', init, 50, 15000);
    checkCartUpdate();


  } catch (e) {
    if (debug) console.log(e, "error in Test" + variation_name);
  }
})();


Editor is loading...