From b55042fa11f3236d10b51ebf730c936e05a6ed44 Mon Sep 17 00:00:00 2001 From: Vincent Vanwaelscappel Date: Mon, 26 Oct 2020 17:16:20 +0100 Subject: [PATCH] wip #3961 @4 --- js/libs/fluidbook/cart/fluidbook.cart.puma.js | 392 +++--------------- js/libs/fluidbook/fluidbook.cart.js | 8 + js/libs/fluidbook/fluidbook.menu.js | 4 +- style/cart.less | 1 + style/cart/puma.less | 60 +++ style/fluidbook.less | 1 + 6 files changed, 131 insertions(+), 335 deletions(-) create mode 100644 style/cart.less create mode 100644 style/cart/puma.less diff --git a/js/libs/fluidbook/cart/fluidbook.cart.puma.js b/js/libs/fluidbook/cart/fluidbook.cart.puma.js index 648722d1..2078a6bb 100644 --- a/js/libs/fluidbook/cart/fluidbook.cart.puma.js +++ b/js/libs/fluidbook/cart/fluidbook.cart.puma.js @@ -2,263 +2,42 @@ function FluidbookCartPuma(cart) { var $this = this; this.cart = cart; this.fluidbook = this.cart.fluidbook; - this.items = this.cart.getSavedData(); - this.data; - this.loggedIn = false; - this.handleTooltips = true; - this.handleTaxes = false; - this.minQuantities = {}; - this.idBySku = {}; - - this.initBaseURL(); + this.data = this.fluidbook.settings.basketReferences; this.init(); } FluidbookCartPuma.prototype = { - initBaseURL: function () { - this.baseURL = window.location.protocol + '//' + window.location.host + '/' + this.fluidbook.l10n.currentLang + '/'; - }, - updateCartData: function (callback) { - var $this = this; - this.sendCookie(); - - $.ajax({ - url: this.baseURL + "customer/section/load/", - dataType: 'json', - cache: false, - xhrFields: {withCredentials: true}, - success: function (data) { - $this.fluidbook.hideLoader(); - $this.updateCartFromData(data.cart, data.customer, callback); - }, - }); - }, - - updateCartFromData: function (data, customer, callback) { - this.data = data; - this.loggedIn = customer.websiteId !== undefined && customer.websiteId !== null; - if (this.dataok()) { - this.updateCart(); - } - this.updateMinQuantities(function () { - if (callback !== undefined) { - callback(); - } - }); - }, - init: function () { - var $this = this; - - $(document).on('change', '[data-menu="cart"] .input-number', function () { - $this.updateCartFromQuantities(this); - return true; - }); - - this.updateCartData(function () { - - }); - - setTimeout(function () { - $this.updateCartData(function () { - - }); - }, 60000); - - $(window).on('focus', function () { - $this.fluidbook.menu.closeView(function () { - }, true, false); - $this.updateCartData(function () { - - }); - }); - - - }, - - checkLoginSession: function () { - if (!this.loggedIn) { - this.fluidbook.links.triggerLinkById('login'); - return false; - } - return true; + this.items = this.fluidbook.cache.get('cart', []); }, addToCart: function (ref, quantity) { - var $this = this; - if (!this.checkLoginSession()) { - return; - } - this.fluidbook.displayLoader(); - - this.getProductIDBySKU(ref, function (product_id) { - if (product_id === null) { - var url = this.fluidbook.settings.product_zoom_references[ref][0]; - $this.fluidbook.hideLoader(); - $this.fluidbook.openInPopupIframe(url); - } else { - var minQuantity = $this.minQuantities[ref]; - if (quantity === undefined || isNaN(quantity) || quantity < minQuantity) { - quantity = minQuantity - } - - $.ajax({ - url: $this.baseURL + 'checkout/cart/add', - cache: false, - data: {product: product_id, qty: quantity, form_key: $this.getFormKey()}, - method: 'post', - xhrFields: {withCredentials: true}, - dataType: 'json', - success: function (data) { - if (data.backUrl) { - $this.fluidbook.hideLoader(); - $this.fluidbook.openInPopupIframe(data.backUrl); - } else { - $this.fluidbook.tooltip.displayTooltip($this.fluidbook.l10n.__("the item has been added to your cart"), 'invert'); - $this.fluidbook.hideLoader(); - $this.updateCartData(function () { - $this.fluidbook.menu.openView('cart'); - }); - } - } - }); - } - }); - - return false; - }, - - getMinQuantity: function (sku, callback) { - if (this.minQuantities[sku] !== undefined) { - callback(this.minQuantities[sku]); - return; + if (this.items.indexOf(ref) === -1) { + this.items.push(ref); + this.save(); } - var $this = this; - console.log('check qty for ' + sku); - this.getProductIDBySKU(sku, function (product_id) { - if ($this.minQuantities[sku] === undefined) { - console.log('no qty for ' + sku); - var e = sku.split('.'); - if (e.length > 1) { - e.pop(); - var nsku = e.join('.') + '.'; - console.log('check qty for ' + nsku); - $this.getProductIDBySKU(nsku, function (product_id) { - if ($this.minQuantities[nsku] === undefined) { - console.log('no qty for ' + nsku); - var ee = nsku.split('.'); - if (ee.length > 1) { - ee.pop(); - ee.pop(); - var nnsku = ee.join('.') + '.'; - console.log('check qty for ' + nnsku); - $this.getProductIDBySKU(nnsku, function (product_id) { - console.log('no qty for ' + nnsku); - if ($this.minQuantities[nnsku] === undefined) { - $this.minQuantities[nnsku] = 1; - } - $this.minQuantities[nsku] = $this.minQuantities[nnsku]; - $this.minQuantities[sku] = $this.minQuantities[nnsku]; - callback($this.minQuantities[nnsku]); - }); - return; - } - } else { - $this.minQuantities[sku] = $this.minQuantities[nsku]; - } - callback($this.minQuantities[nsku]); - }); - return; - } - } else { - callback($this.minQuantities[sku]); - } - }); + return true; }, - updateMinQuantities: function (callback) { - var skus = []; - $.each(this.data.items, function (index, item) { - skus.push(item.product_sku); - }); - this._updateMinQuantity(skus, callback); + removeFromCart: function (key) { + this.items.splice(key, 1); + this.save(); }, - _updateMinQuantity: function (list, callback) { - if (list.length === 0) { - callback(); - return; - } - var sku = list.pop(); - var $this = this; - this.getMinQuantity(sku, function () { - $this._updateMinQuantity(list, callback); - }); + save: function () { + this.fluidbook.cache.set('cart', this.items); }, - - getProductIDBySKU: function (sku, callback) { - if (this.idBySku[sku] !== undefined) { - callback(this.idBySku[sku]); - return; - } - var $this = this; - $.ajax({ - url: this.baseURL + 'fastorder/index/search', - cache: false, - data: {product: sku, sort_order: 0}, - method: 'post', - xhrFields: {withCredentials: true}, - dataType: 'json', - success: function (data) { - var product_id; - if (data === null || data === undefined || data === '' || data.length === 0 || !data) { - product_id = null; - } else { - product_id = data[0].product_id; - var min = 1; - if (data[0].min !== undefined) { - min = data[0].min; - } - console.log('set min qty for ' + sku + ' : ' + min) - $this.minQuantities[sku] = min; - } - $this.idBySku[sku] = product_id; - callback(product_id); - }, error: function () { - $this.idBySku[sku] = null; - callback(null); - } - }); + getItemsNumbers: function () { + return this.items.length; }, - - sendCookie: function () { + getAllQuantities: function () { + return this.getItemsNumbers(); }, - removeFromCart: function (item_id, callback) { - var $this = this; - this.fluidbook.displayLoader(); - $.ajax({ - url: $this.baseURL + 'checkout/sidebar/removeItem', - method: 'post', - data: {item_id: item_id, form_key: this.getFormKey()}, - xhrFields: {withCredentials: true}, - success: function () { - $this.updateCartData(callback); - } - }) - }, - getItemsNumbers: function () { - if (!this.dataok()) { - return 0; + updateCart: function () { + if ($('#pumacart').length > 0) { + $('#pumacart .content').html(this.getCartContent()); } - return this.data.summary_count; - }, - getAllQuantities: function () { - var res = 0; - this.data.find('item quantite').each(function () { - res += parseInt($(this).text()); - }); - return res; }, updateIcon: function () { @@ -266,122 +45,58 @@ FluidbookCartPuma.prototype = { }, openMenu: function (p1, p2, callback) { - if (!this.dataok()) { - callback(); - return; - } this.fluidbook.menu.quickCloseView(); return this.openCart(p2, callback); }, openCart: function (p2, callback) { - if (!this.checkLoginSession()) { - callback(); - return; - } - if (!this.dataok()) { - callback(); - return; - } - this._endMenu(this.fluidbook.l10n.__('your cart'), this.getCartContent(), function () { - $('input[type="number"]').inputNumber(); - + this._endMenu('my cart', this.getCartContent(), function () { callback(); }); }, - dataok: function () { - return this.data !== undefined && this.data !== null; - }, - getCartContent: function () { if (this.getItemsNumbers() == 0) { return '
' + this.fluidbook.l10n.__('your cart is empty') + '
'; } - var $this = this; - var content = ''; - var totalht = 0; - $.each(this.data.items, function (index, item) { - var qty = $this.parseInt(item.qty); - var unit = $this.parseFloat(item.product_price_value); - var ht = unit * qty; - - var options = {}; - $.each(item.options, function (k, opt) { - options[opt.option_id] = opt.option_value; - }); + var columns = ['Catalogue', 'Catégorie', 'Ligne', 'Sexe', 'Modèle', 'Couleur', 'Désignation', 'Tarif', 'PVC', 'Image', 'PACK']; + var $this = this; + var content = '
'; + content += ''; + $.each(columns, function (k, v) { + content += ''; + }); + content += ''; + content += ''; + content += ''; + $.each(this.items, function (i, ref) { content += ''; - content += ''; - var step = $this.minQuantities[item.product_sku]; - if (step === undefined) { - step = 1; - } - content += ''; - content += ''; - content += ''; - content += ''; + $.each(columns, function (k, v) { + var value = $this.data[ref][v]; + if (v === 'PVC' || v === 'Tarif') { + value = $this.formatPrice(value, '€'); + } else if (v === 'Image') { + if ($this.data[ref] && $this.data[ref]['zoom_image']) { + value = ''; + } else { + value = '-'; + } + } + content += ''; + }); + content += ''; content += ''; - - totalht += ht; }); - - content += '
' + v + '
' + item.product_name + '
' + $this.fluidbook.l10n.__('unit price') + ': ' + $this.formatPrice(unit); - content += '
' + $this.fluidbook.l10n.__('price') + ': ' + $this.formatPrice(ht) + '
' + $this.formatPrice(unit) + '' + $this.formatPrice(ht) + '' + getSpriteIcon('interface-close') + '' + value + '' + getSpriteIcon('interface-close') + '
'; - content += ''; - content += ''; - content += ''; + content += ''; content += '
' + $this.fluidbook.l10n.__('total') + '' + $this.formatPrice($this.parseFloat(this.data.subtotalAmount)) + '
'; - content += ''; return content; }, - getFormKey: function () { - return $.cookie('form_key'); - }, - - updateCartFromQuantities: function (el) { - var $this = this; - var input = $(el).find('input.cartqty'); - var item_id = $(input).attr('name'); - var options = $(input).data('options'); - var newVal = $this.parseInt($(input).val()); - - if (newVal === 0) { - this.removeFromCart(item_id, function () { - }); - } else { - this.fluidbook.displayLoader(); - - $.ajax({ - url: $this.baseURL + 'checkout/cart/updateItemOptions/id/' + item_id, - method: "post", - data: {item: item_id, qty: newVal, super_attribute: options, form_key: this.getFormKey()}, - xhrFields: {withCredentials: true}, - success: function () { - $this.updateCartData(function () { - - }); - } - }) - } - }, - - updateCart: function () { - if (!this.dataok()) { - return; - } - $('[data-menu="cart"] .content').html(this.getCartContent()); - $('input[type="number"]').inputNumber(); - this.updateIcon(); - resize(); - - }, - formatPrice: function (price, suffix) { if (typeof price == 'number') { price = parseFloat(price); @@ -391,18 +106,29 @@ FluidbookCartPuma.prototype = { suffix = ''; } - return price.toLocaleString("fr-FR", {style: "currency", currency: "EUR"}) + ' ' + suffix; + return price.toLocaleString("fr-FR", { + style: "currency", + currency: "EUR", + minimumFractionDigits: 2, + maximumFractionDigits: 2 + }) + ' ' + suffix; }, _endMenu: function (title, content, callback) { - var view = this.fluidbook.menu.getCaption(title); + var view = '
'; + view += this.fluidbook.menu.getCaption(title); view += '
'; view += "" + content; view += '
'; + view += '
'; this.fluidbook.menu.viewWrap(view, 'cart'); callback(); }, + getMenuWidth: function () { + return 1200; + }, + parseFloat: function (s) { if (typeof s === 'number') { return s; diff --git a/js/libs/fluidbook/fluidbook.cart.js b/js/libs/fluidbook/fluidbook.cart.js index b89910ee..bf7de9f3 100644 --- a/js/libs/fluidbook/fluidbook.cart.js +++ b/js/libs/fluidbook/fluidbook.cart.js @@ -32,6 +32,14 @@ FluidbookCart.prototype = { return false; }); }, + getMenuWidth: function () { + try { + return this.instance.getMenuWidth(); + } catch (e) { + + } + return 1024; + }, getSavedData: function () { return this.fluidbook.cache.get('cart', {}) }, diff --git a/js/libs/fluidbook/fluidbook.menu.js b/js/libs/fluidbook/fluidbook.menu.js index c2842d21..c56c52b8 100644 --- a/js/libs/fluidbook/fluidbook.menu.js +++ b/js/libs/fluidbook/fluidbook.menu.js @@ -762,8 +762,8 @@ FluidbookMenu.prototype = { } break; case 'cart': - w = 1024; - if (ww < 1024) { + w = this.fluidbook.cart.getMenuWidth(); + if (ww < w) { fullscreen = true; } break; diff --git a/style/cart.less b/style/cart.less new file mode 100644 index 00000000..0c5113d6 --- /dev/null +++ b/style/cart.less @@ -0,0 +1 @@ +@import "cart/puma"; \ No newline at end of file diff --git a/style/cart/puma.less b/style/cart/puma.less new file mode 100644 index 00000000..3cd5853e --- /dev/null +++ b/style/cart/puma.less @@ -0,0 +1,60 @@ +#pumacart { + .caption { + margin-top: 10px; + text-transform: uppercase; + } + + [data-cart-delete] { + color: #fff; + background-color: @menu-button-background; + padding: 5px 6px 7px 6px; + width: 23px; + height: 23px; + display: block; + position: relative; + left: 20px; + } + + table { + padding: 0; + border-collapse: collapse; + margin: 20px 30px 40px; + width: ~"calc(100% - 60px)"; + max-width: none; + + td, th { + padding: 20px 0 20px 30px; + font-size: 11px; + text-align: center; + + img { + max-width: 80px; + } + + &:last-child { + padding-right: 30px; + padding-left: 0px; + } + } + + thead { + th { + text-transform: uppercase; + color: #fff; + background-color: @menu-button-background; + font-weight: normal; + } + } + + tbody { + td { + border-top: 1px solid #000; + } + + tr { + background-color: #fff; + color: #000 + } + } + } +} \ No newline at end of file diff --git a/style/fluidbook.less b/style/fluidbook.less index 32117799..6b9577c0 100644 --- a/style/fluidbook.less +++ b/style/fluidbook.less @@ -2960,3 +2960,4 @@ body > input { @import "nointerface.less"; @import "posad.less"; @import "notes.less"; +@import "cart.less"; -- 2.39.5