1 files changed, 96 insertions, 0 deletions
diff --git a/html/content/js/Cart/miniCart.js b/html/content/js/Cart/miniCart.js
new file mode 100644
index 0000000..c02cc38
--- /dev/null
+++ b/html/content/js/Cart/miniCart.js
@@ -0,0 +1,96 @@
+$$plugins.define('miniCart', ['dom'], function (element, options, dom) {
+	const plugin = this,
+        selectors = {
+            openMiniCart: '.open-mini-cart', // Link that opens cart
+            closeMiniCart: '.close-mini-cart', // Link that closes cart
+            contentOuterContainer: '.miniCart', // Container for loader and inner content inner
+            loaderContainer: '.miniCart__holder', // Spinner or any other loader
+            contentInnerContainer: '.miniCart__main', // Content of mini cart
+            cartPluginElement: '[data-plugin-cart]'
+        }, cssClasses = {
+            opened: 'opened', // Added to 'openMinicart' link when opened
+            containerOpened: 'active'
+        };
+    let pendingXhr, clearOnClick;
+
+    function onBodyClick(e) {
+        if (element.contains(e.target)) {
+            return;
+        }
+        // case where node is removed from DOM. This means we dont know it's parent. Usually the case of cart remove.
+        if (!document.body.contains(e.target)) {
+            return;
+        }
+        close();
+    }
+
+    function close() {
+        // Remove opened class from link
+        element.querySelector(selectors.openMiniCart).classList.remove(cssClasses.opened);
+
+        //Hide outer element
+        var outterContainer = element.querySelector(selectors.contentOuterContainer);
+       // dom.hide(outterContainer);
+        outterContainer.classList.remove(cssClasses.containerOpened);
+        // Hide and reset inner element
+        const inner = element.querySelector(selectors.contentInnerContainer);
+        //dom.empty(inner);
+       // dom.hide(inner);
+
+
+        // Show loader again to be ready for next time
+        //dom.show(element.querySelector(selectors.loaderContainer));
+
+        // Unbind body click
+        clearOnClick && clearOnClick();
+    }
+
+    function open() {
+        // Add opened class to link
+        element.querySelector(selectors.openMiniCart).classList.add(cssClasses.opened);
+
+        // Show outer container
+        //dom.show();
+        var outterContainer = element.querySelector(selectors.contentOuterContainer);
+        outterContainer.style.display = "block";
+        outterContainer.classList.add(cssClasses.containerOpened);
+        // Listen for body clicks to close
+        clearOnClick && clearOnClick();
+        clearOnClick = plugin.on('click', document.body, onBodyClick);
+        return true;
+    }
+
+    function updateContent() {
+        return;
+        if (pendingXhr) {
+            return;
+        }
+		pendingXhr = true;
+        http.post(options.RefreshUrl, { responseType: "text" })
+            .then(function (r) {
+                const container = element.querySelector(selectors.contentInnerContainer);
+                container.innerHTML = r.data;
+                dom.hide(element.querySelector(selectors.loaderContainer));
+                dom.show(container);
+            })
+            .finally(function () {
+                pendingXhr = false;
+            });
+    }
+
+    const openedStateSelector = selectors.openMiniCart + '.' + cssClasses.opened,
+        closedStateSelector = selectors.openMiniCart + ':not(.' + cssClasses.opened + ')';
+
+    plugin.on('click', element, function (e) {
+        if (dom.closest(e.target, openedStateSelector)) {
+            e.preventDefault();
+            close();
+        } else if (dom.closest(e.target, closedStateSelector)) {
+
+            if (open()) {
+                e.preventDefault();
+                updateContent();
+            }
+        }
+    });
+});