https://www.arboretum.ie/shop/scripts/basket-hash.js

1var basketHash;
2
3const updateBasketHash = () => {
4
5    let pageName = window.location.pathname.substring(window.location.pathname.lastIndexOf('/') + 1);
6
7    let checkoutPages = ['basket.html',
8                         'quick-checkout.html',
9                         'checkout.html',
10                         'click-and-collect-checkout.html',
11                         'checkout-login.html',
12                         'quick-order-confirmation.html',
13                         'order-confirmation.html',
14                         'payment-processing.html',
15                         'quick-order-confirmation-account-payment.html',
16                         'basket',
17                         'quick-checkout',
18                         'checkout',
19                         'click-and-collect-checkout',
20                         'checkout-login',
21                         'quick-order-confirmation',
22                         'order-confirmation',
23                         'payment-processing',
24                         'quick-order-confirmation-account-payment'];
25
26    // If it looks like we're on a redirect page, don't do anything
27    if (document.getElementsByTagName('body')[0].onload && document.getElementsByTagName('body')[0].onload.toString().includes('location.replace')) {
28        return;
29    }
30
31    // Obtain the current basket hash cookie
32    basketHash = getBasketHashCookie();
33
34    // Update the bash hash in local storage
35    localStorage.setItem('basket-hash', basketHash);
36
37    //console.log(`Listening for basket hash changes in "${pageName}" (Checkout page: ${checkoutPages.includes(pageName)})`);
38    //console.log(`Current basket hash is "${basketHash}"`);
39
40
41    // Listen for changes to the storage object
42    window.addEventListener('storage', function (e) {
43        // If the basket hash has changed, display the overlay
44        if (e.key === 'basket-hash' && e.newValue != basketHash) {
45
46            //console.log(`Basket hash changed from "${e.oldValue}" to "${e.newValue}"`);
47
48            // Show the overlay if we're on a checkout page
49            if (checkoutPages.includes(pageName))
50                document.getElementById('basket-changed-overlay').style.display = 'block';
51
52            // Update the local value
53            basketHash = e.newValue;
54        }
55    });
56
57
58    // Don't do anything further pages that are not in the checkout pages list
59    if (!checkoutPages.includes(pageName))
60        return;
61
62    // Grab the overlay object
63    let basketOverlay = document.getElementById('basket-changed-overlay');
64
65    // If we couldn't find an element with the above ID, we'll create one
66    if (!basketOverlay) {
67
68        // Build CSS element to add to the HEAD element. This may be overridden later in stylesheets
69        let basketOverlayCSS = document.createElement('style');
70
71        let css = '#basket-changed-overlay { position: fixed; display: none; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,0.5); z-index: 999999999; cursor: not-allowed; #basket-changed-error { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 10px; background-color: white; padding: 20px; border: 2px solid black; border-radius: 10px; z-index: 1000000000; cursor: auto; }';
72
73        if (basketOverlayCSS.stylesheet) { //IE
74            basketOverlayCSS.stylesheet.cssText = css;
75        } else {                // rest of the world
76            basketOverlayCSS.appendChild(document.createTextNode(css));
77        }
78
79        // Attach it to the HEAD element
80        document.head.prepend(basketOverlayCSS);
81
82        // Build the E-Availability Timer container element
83        basketOverlay = document.createElement('div');
84
85        basketOverlay.id        = 'basket-changed-overlay';
86
87        if (pageName === 'basket.html')
88           basketOverlay.innerHTML = '<div id="basket-changed-error"><p>Sorry, it appears that your basket may have changed since this page was loaded.</p><p>Please reload <a href="basket.html">this page</a> to continue.</p></div>';
89        else
90           basketOverlay.innerHTML = '<div id="basket-changed-error"><p>Sorry, it appears that your basket may have changed since this page was loaded.</p><p>Please return to the <a href="basket.html">Basket page</a> to continue.</p></div>';
91
92        // Add it to the BODY element
93        document.body.prepend(basketOverlay);
94    }
95}
96
97const getBasketHashCookie = () => {
98    const name = 'basket-hash=';
99    const cDecoded = decodeURIComponent(document.cookie); //to be careful
100    const cArr = cDecoded.split('; ');
101    let res;
102    cArr.forEach(val => {
103      if (val.indexOf(name) === 0) {
104        res = val.substring(name.length);
105      }
106    })
107
108    if (!res) {
109        return null;
110    }
111
112    return res;
113}
114
115updateBasketHash();