Untitled

mail@pastecode.io avatar
unknown
plain_text
6 months ago
9.3 kB
2
Indexable
Never
(function() {
    try {
        /* main variables */
        var debug = 0;
        var variation_name = "";
        var $;
        /* all Pure helper functions */

        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 live(selector, event, callback, context) {
            /****Helper Functions****/
            // helper for enabling IE 8 event bindings
            function addEvent(el, type, handler) {
                if (el.attachEvent) el.attachEvent("on" + type, handler);
                else el.addEventListener(type, handler);
            }
            // matches polyfill
            this.Element &&
                (function(ElementPrototype) {
                    ElementPrototype.matches =
                        ElementPrototype.matches ||
                        ElementPrototype.matchesSelector ||
                        ElementPrototype.webkitMatchesSelector ||
                        ElementPrototype.msMatchesSelector ||
                        function(selector) {
                            var node = this,
                                nodes = (node.parentNode || node.document).querySelectorAll(selector),
                                i = -1;
                            while (nodes[++i] && nodes[i] != node);
                            return !!nodes[i];
                        };
                })(Element.prototype);
            // live binding helper using matchesSelector
            function live(selector, event, callback, context) {
                addEvent(context || document, event, function(e) {
                    var found,
                        el = e.target || e.srcElement;
                    while (el && el.matches && el !== context && !(found = el.matches(selector))) el = el.parentElement;
                    if (found) callback.call(el, e);
                });
            }
            live(selector, event, callback, context);
        }

        live('html body .tyre-tile', 'click', function() {
            document.body.classList.add("eg-fixed");
            this.classList.add("eg-popup-open");
        });

        live("html body .tyre-tile .hover-details .c-close", 'click', function() {
            document.body.classList.remove("eg-fixed");
            this.closest(".tyre-tile").classList.remove("eg-popup-open");
        });

        function listener() {
            /* These are the modifications: */
            window.addEventListener("locationchange", function() {
                waitForElement('html body #mt-search-result .mt-list_item .main-layer:not(.eg-items-added)', init, 500, 15000);
            });
            history.pushState = ((f) =>
                function pushState() {
                    var ret = f.apply(this, arguments);
                    window.dispatchEvent(new Event("pushstate"));
                    window.dispatchEvent(new Event("locationchange"));
                    return ret;
                })(history.pushState);
            history.replaceState = ((f) =>
                function replaceState() {
                    var ret = f.apply(this, arguments);
                    window.dispatchEvent(new Event("replacestate"));
                    window.dispatchEvent(new Event("locationchange"));
                    return ret;
                })(history.replaceState);
            window.addEventListener("popstate", () => {
                window.dispatchEvent(new Event("locationchange"));
            });
        }

        function init() {
            document.querySelectorAll("html body #recommended-tyres .recommended-content-item .recommended-content-item-suggestions>.recommended-content-item_suggestion .main-layer:not(.eg-items-added), html body #mt-search-result .mt-list_item .main-layer:not(.eg-items-added)").forEach(ele => {
                if (!ele.querySelector(".eg-moved-items")) {
                    let offerTag = ele.querySelector(".offer-tag");
                    if (offerTag) {
                        if (offerTag.innerText.indexOf("Buy ") != -1) {
                            offerTag.innerText = offerTag.innerText.replace("Buy ", "");
                        }
                    }
                }
            });

            // DETECTING  CLICK OUTSTIDE OF THE POPUP
            document.body.addEventListener("click", function(e) {
                if (e.target.classList.contains("eg-fixed")) {
                    document.querySelector("html body .tyre-tile.eg-popup-open .hover-details .c-close").click();
                }
            });
        }

        /* Initialize variation */
        waitForElement('html body #mt-search-result .mt-list_item .main-layer:not(.eg-items-added)', init, 500, 15000);
        listener();

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


<style>
@media(max-width:720px) {

    html body #recommended-tyres .recommended-content-item .recommended-content-item-suggestions>.recommended-content-item_suggestion,
    html body #mt-search-result .mt-list_item {
        width: 50%;
    }

    html body.eg-fixed::before {
        content: '';
        background: rgba(0, 0, 0, 0.5);
        position: fixed;
        bottom: 0;
        right: 0;
        left: 0;
        top: 0;
        z-index: 9999;
    }

    html body #recommended-tyres>.content-wrapper {
        padding-left: 18px;
        padding-right: 18px;
    }

    html body #recommended-tyres .recommended-content-item .recommended-content-item-suggestions>.recommended-content-item_suggestion .mt-suggestion_title {
        padding: 11px 11px 13px;
        font-size: 13px;
    }

    html body .tyre-tile .brand-logo {
        margin: 12px auto;
        height: 40px !important;
        justify-content: center;
    }

    html body .tyre-tile .brand-logo>img {
        max-width: 80%;
        height: auto !important;
        max-height: unset !important;
    }

    html body .tyre-tile .title {
        font-size: 14px;
        height: fit-content !important;
        margin-bottom: 5px;
    }

    html body .tyre-tile .setting {
        font-size: 14px;
        font-weight: 500;
    }

    html body .tyre-tile .runflat {
        min-height: fit-content !important;
    }

    html body .tyre-tile .image {
        height: fit-content !important;
    }

    html body .tyre-tile .image>img {
        width: 100% !important;
        height: 120px !important;
        object-fit: contain !important;
    }

    html body .tyre-tile .main-layer .image img.reflection {
        display: none !important;
    }

    html body .tyre-tile .image .rondel-icon {
        left: 53% !important;
        width: 50px !important;
        height: 50px !important;
    }

    html body .tyre-tile .price-summary {
        height: fit-content !important;
        padding-bottom: 20px;
    }

    html body .tyre-tile .price-summary>p {
        font-weight: 500;
        font-size: 13px;
    }

    html body .tyre-tile .price-summary>.price {
        font-size: 26px;
        line-height: normal;
        margin-bottom: 4px;
        margin-top: 8px;
    }


    body #mt-search-result .mt-list_item {
        padding: 0 7px;
    }

    html body .tyre-tile .hover-details {
        transition: opacity 0.5s !important;
    }

    html body .tyre-tile:not(.eg-popup-open) .hover-details{
        z-index: -999999 !important;
    }

    html body .tyre-tile.eg-popup-open .hover-details {
        padding: 20px !important;
        position: fixed !important;
        z-index: 9999 !important;
        width: 90% !important;
        height: 546px !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        border-radius: 10px !important;
        overflow: scroll !important;
        background: rgb(0, 0, 0, 0.91) !important;
        opacity: 1 !important;
    }

    html body .tyre-tile .hover-details form .quantities .item-button {
        align-items: center;
    }

    html body .tyre-tile .hover-details form>button[type='submit'] {
        border-radius: 8px;
    }

    html body .tyre-tile .hover-details .promo-note {
        height: fit-content;
    }

    html body .tyre-tile .hover-details>a.link {
        font-size: 15px;
        padding: 10px !important;
        margin-top: 15px !important;
        display: inline-block;
    }

    html body .tyre-tile .price-summary .from-box .offer-tag {
        font-size: 10px;
        font-weight: 400;
        letter-spacing: 0.1px;
        top: unset !important;
    }

    body #mt-search-result .mt-list_item {
        margin-bottom: 0 !important;
        padding: 7px !important;
    }

    html body #recommended-tyres .recommended-content-item .recommended-content-item-suggestions>.recommended-content-item_suggestion {
        padding: 7px !important;
    }
}
</style>