wip #5535 @4

diff --git a/_index.html b/_index.html
index 78f21d510e00076a82373d0780ec1fb2bcb3a027..f8597a22996866561e2af64813dd818803cc5497 100644 (file)
--- a/_index.html
+++ b/_index.html
@@ -19,7 +19,7 @@
         }
 
         body, html {
-            background-color: # <!-- $ bgcolor -->;
+            background-color: #<!-- $bgcolor -->;
             width: 100%;
             height: 100%;
         }

diff --git a/js/libs/fluidbook/cart/fluidbook.cart.puma-se.js b/js/libs/fluidbook/cart/fluidbook.cart.puma-se.js
new file mode 100644 (file)
index 0000000..8653836
--- /dev/null
+++ b/js/libs/fluidbook/cart/fluidbook.cart.puma-se.js
@@ -0,0 +1,522 @@
+function FluidbookCartPumaSE(cart) {
+    var $this = this;
+    this.cart = cart;
+    this.fluidbook = this.cart.fluidbook;
+    this.data = this.fluidbook.settings.basketReferences;
+    this.exportFileName = '';
+    this.init();
+}
+
+FluidbookCartPumaSE.prototype = {
+    init: function () {
+        var $this = this;
+        this.items = this.fluidbook.cache.get('cart', []);
+        $(document).on(this.fluidbook.input.clickEvent, '.exportCartPDF', function () {
+            $this.chooseFileName(function () {
+                $this.exportPDF();
+            });
+            return false;
+        });
+
+        $(document).on(this.fluidbook.input.clickEvent, '.exportCartXLS', function () {
+            try {
+                $this.chooseFileName(function () {
+                    $this.exportXLS();
+                });
+            } catch (err) {
+                console.log(err);
+            }
+            return false;
+        });
+        $(document).on(this.fluidbook.input.clickEvent, '.exportEANXLS', function () {
+            try {
+                $this.chooseFileName(function () {
+                    $this.exportEANXLS();
+                });
+            } catch (err) {
+                console.log(err);
+            }
+            return false;
+        });
+
+        $(document).on(this.fluidbook.input.clickEvent, '.emptyCart', function () {
+            $.confirm({
+                backgroundDismiss: true,
+                title: 'Empty my cart',
+                content: 'Are you sure you want to empty your cart?',
+                buttons: {
+                    confirm: {
+                        text: 'Confirm', btnClass: 'btn-ok', action: function () {
+                            $this.emptyCart();
+                        },
+                    }, cancel: function () {
+
+                    },
+                }
+            });
+            return false;
+        });
+    },
+
+    emptyCart: function () {
+        this.items = [];
+        this.updateCart();
+        this.save();
+        resize();
+    },
+
+    addToCart: function (ref, quantity) {
+        if (this.getItems().indexOf(ref) === -1) {
+            this.items.push(ref);
+            this.save();
+            return this.fluidbook.l10n.__("the item has been added to your cart");
+        } else {
+            this.removeFromCartByRef(ref);
+            return this.fluidbook.l10n.__("the item has been removed from your cart");
+        }
+    },
+
+    removeFromCartByRef: function (ref) {
+        var key = this.items.indexOf(ref);
+        if (key >= 0) {
+            this.removeFromCart(key)
+        }
+    },
+
+    removeFromCart: function (key) {
+        if (key >= 0) {
+            this.items.splice(key, 1);
+            this.save();
+        }
+    },
+
+    save: function () {
+        this.fluidbook.cache.set('cart', this.getItems());
+        this.fluidbook.cart.updateLinks();
+    },
+
+    getItemsReferences: function () {
+        return this.getItems();
+    },
+
+    getItemsNumbers: function () {
+        return this.getItems().length;
+    },
+
+    getAllQuantities: function () {
+        return this.getItemsNumbers();
+    },
+
+    updateCart: function () {
+        if ($('#pumacart').length > 0) {
+            $('#pumacart .content').html(this.getCartContent());
+        }
+    },
+
+    updateIcon: function () {
+        $(this.fluidbook).trigger('fluidbook.cart.updateIcon', {number: this.getItemsNumbers()});
+    },
+
+    openMenu: function (p1, p2, callback) {
+        this.fluidbook.menu.quickCloseView();
+        return this.openCart(p2, callback);
+    },
+
+    openCart: function (p2, callback) {
+        this._endMenu('my cart', this.getCartContent(), function () {
+            callback();
+        });
+    },
+
+    getXLSColumns: function () {
+        return [
+            {key: 'Image', label: 'IMAGE', type: 'image', format: '@', width: 7},
+            {key: 'Reference', label: 'REFERENCE', type: 'reference', format: '@', width: 5},
+            {key: 'Catégorie', label: 'RBU', type: 'text', format: '@', width: 8},
+            {key: 'Sexe', label: 'GENDER', type: 'text', format: '@', width: 5},
+            {key: 'Ligne', label: 'LINE', type: 'text', format: '@', width: 3},
+            {key: 'Désignation', label: 'NAME', type: 'text', format: '@', width: 15},
+            {key: 'Coloris', label: 'COLOUR', type: 'text', format: '@', width: 5},
+            {key: 'Tailles', label: 'SIZES', type: 'size', format: '@', width: 5},
+            {key: 'MATERIAL', label: 'MATERIAL', type: 'text', format: '@', width: 10},
+            {key: 'UPPER', label: 'UPPER', type: 'text', format: '@', width: 5},
+            {key: 'MIDSOLE', label: 'MIDSOLE', type: 'text', format: '@', width: 5},
+            {key: 'OUTSOLE', label: '', type: 'text', format: '@', width: 5},
+            {key: 'ISD', label: 'ISD', type: 'text', format: '@', width: 3},
+            {key: 'RRP CI', label: 'RRP CI', type: 'price', format: '# ##0.00 €;-# ##0.00 €', width: 3},
+            {key: 'RRP IT', label: 'RRP IT', type: 'price', format: '# ##0.00 €;-# ##0.00 €', width: 3},
+            {key: 'RRP IB', label: 'RRP IB', type: 'price', format: '# ##0.00 €;-# ##0.00 €', width: 3},
+            {key: 'WSP IT', label: 'WSP IT', type: 'text', format: '# ##0.00 €;-# ##0.00 €', width: 3},
+            {key: 'WSP IB', label: 'WSP IB', type: 'text', format: '# ##0.00 €;-# ##0.00 €', width: 3},
+            {key: 'REF', label: 'REF', type: 'text', format: '@', width: 5},
+        ];
+    },
+
+    getHTMLColumns: function () {
+        return [
+            {key: 'Reference', label: 'REF', cls: '', type: 'reference'}, {
+                key: 'Image',
+                label: 'Image',
+                cls: 'noprint',
+                type: 'image'
+            }, {key: 'Désignation', label: 'NAME', cls: '', type: 'text'}, {
+                key: 'Ligne',
+                label: 'LINE',
+                cls: '',
+                type: 'text'
+            }, {key: 'Catégorie', label: 'RBU', cls: '', type: 'text'}, {
+                key: 'RRP IB',
+                label: 'RRP IB',
+                cls: '',
+                type: 'price'
+            }, {key: 'RRP IT', label: 'RRP IT', cls: '', type: 'price'}, {
+                key: 'RRP CI',
+                label: 'RRP CI',
+                cls: '',
+                type: 'price'
+            }, {key: 'Tailles', label: 'Size', cls: '', type: 'size'}, {
+                key: 'ISD',
+                label: 'ISD',
+                cls: '',
+                type: 'text'
+            }, {
+                key: 'Image',
+                label: 'Image',
+                cls: 'onlyprint',
+                type: 'image'
+            }]
+    },
+
+    getPDFColumns: function () {
+
+    },
+
+    getItems: function () {
+        var res = [];
+        var $this = this;
+        $(this.items).each(function (i, ref) {
+            if ($this.data[ref] !== undefined && $this.data[ref] !== null) {
+                res.push(ref);
+            }
+        });
+        return res;
+    },
+
+    getCartContent: function () {
+        if (this.getItemsNumbers() == 0) {
+            return '<div class="cart-empty">' + this.fluidbook.l10n.__('your cart is empty') + '</div>';
+        }
+
+        var $this = this;
+        var columns = this.getHTMLColumns();
+        var head = '<thead><tr>';
+        $.each(columns, function (k, v) {
+            head += '<th data-type="' + v.type + '" data-label="' + v.label + '" class="' + v.cls + '">' + v.label + '</th>';
+        });
+        head += '<th></th>';
+        head += '</tr></thead>';
+
+        var content = '<table id="pumacarttable" class="cart-items" cellpadding="0" cellspacing="0">';
+        content += head;
+        content += '<tbody>';
+        $.each(this.getItems(), function (i, ref) {
+            if (i % 12 === 0 && i > 0) {
+                content += '<tr class="break">';
+            } else {
+                content += '<tr>';
+            }
+            $.each(columns, function (k, v) {
+                var value = $this.data[ref][v.key];
+                if (v.type === 'reference') {
+                    value = ref;
+                } else if (v.type === 'price') {
+                    value = $this.formatPrice(value, '€');
+                } else if (v.type === 'image') {
+                    if ($this.data[ref] && $this.data[ref]['zoom_image']) {
+                        value = '<img data-ref="' + ref + '" src="' + $this.data[ref]['zoom_image'] + '" />';
+                    } else {
+                        value = '-';
+                    }
+                } else if (v.type === 'size') {
+                    value = value.replace(/,/g, ', ');
+                }
+                if (value == undefined || value == null || value == 'null' || value == 'undefined') {
+                    value = '-';
+                }
+                content += '<td data-type="' + v.type + '" data-label="' + v.label + '" class="' + v.cls + '"><span>' + value + '</span></td>';
+            });
+            content += '<td><a href="#" data-cart-delete="' + i + '">' + getSpriteIcon('interface-close') + '</a></td>';
+            content += '</tr>';
+        });
+        content += '</tbody>';
+        content += '</table>';
+        content += '<div class="cart-footer">';
+        var ean = '';
+        if (this.fluidbook.settings.eanReferences) {
+            ean = '<a href="#" class="exportEANXLS">EAN Export (XLS)</a>';
+        }
+        content += '<div class="fonctions"><a href="#" class="emptyCart">Empty my cart</a><a href="#" class="exportCartPDF">Export (PDF)</a><a href="#" class="exportCartXLS">Export (XLS)</a>' + ean + '</div>';
+        content += '</div>';
+
+        return content;
+    },
+
+
+    exportPDF: function () {
+
+        var element = $('#pumacarttable').get(0);
+        var options = {
+            margin: 15,
+            filename: this.getExportFileName() + '.pdf',
+            image: {type: 'jpeg', quality: 0.98},
+            html2canvas: {dpi: 150, scale: 2, letterRendering: true},
+            jsPDF: {unit: 'mm', format: 'A4', orientation: 'landscape'}
+        };
+        $(element).addClass('print')
+        html2pdf().set(options).from(element).save().then(function () {
+            $(element).removeClass('print');
+        });
+
+        setTimeout(function () {
+            $(element).removeClass('print');
+        }, 2000);
+    },
+
+    getExportFileName: function () {
+        if (this.exportFileName !== '') {
+            return this.exportFileName;
+        }
+        var date = new Date();
+        return this.fluidbook.settings.title + ' - ' + this.formatDate(date);
+    },
+
+    formatDate: function (date) {
+        var d = new Date(date), month = '' + (d.getMonth() + 1), day = '' + d.getDate(), year = d.getFullYear();
+
+        if (month.length < 2) month = '0' + month;
+        if (day.length < 2) day = '0' + day;
+
+        return [year, month, day].join('-');
+    },
+
+    getEANColumns: function () {
+        return [
+            {key: 'Reference', label: 'Reference', type: 'reference', format: '@', width: 4},
+            {key: 'SeasonDescription', label: 'SeasonDescription', type: 'text', format: '@', width: 5},
+            {key: 'Rbu', label: 'Rbu', type: 'text', format: '@', width: 8},
+            {key: 'Family', label: 'Family', type: 'text', format: '@', width: 5},
+            {key: 'Article', label: 'Article', type: 'text', format: '@', width: 5},
+            {key: 'ModelId', label: 'ModelId', type: 'text', format: '@', width: 3},
+            {key: 'ColorId', label: 'ColorId', type: 'text', format: '@', width: 3},
+            {key: 'BeginSeasonCode', label: 'BeginSeasonCode', type: 'text', format: '@', width: 5},
+            {key: 'EndSeasonCode', label: 'EndSeasonCode', type: 'text', format: '@', width: 5},
+            {key: 'SizeDescription', label: 'SizeDescription', type: 'text', format: '@', width: 5},
+            {key: 'EAN13', label: 'EAN13', type: 'text', format: '@', width: 5},
+            {key: 'Units', label: 'Units', type: 'units', format: '@', width: 2},
+        ];
+    },
+
+    exportEANXLS: function () {
+        var $this = this;
+        const workbook = new ExcelJS.Workbook();
+        const sheet = workbook.addWorksheet(this.fluidbook.settings.title);
+        sheet.views = [{state: 'frozen', xSplit: 0, ySplit: 1, topLeftCell: 'A2', activeCell: 'A2'}];
+        sheet.properties.defaultRowHeight = 15;
+        var columnsLabels = this.getEANColumns();
+        var columns = [];
+
+        $.each(columnsLabels, function (k, v) {
+            columns.push({
+                header: v.label,
+                key: v.key,
+                numFmt: v.format,
+                style: {numFmt: v.format, alignment: {vertical: 'middle', horizontal: 'left', wrapText: true}},
+                width: v.width * 4,
+            });
+        });
+
+        sheet.columns = columns;
+
+        $.each(this.getItems(), function (i, ref) {
+            $.each($this.fluidbook.settings.eanReferences, function (k, v) {
+                if (v.Reference === ref) {
+                    var row = {};
+                    $.each(columnsLabels, function (kk, vv) {
+                        if (vv.type === 'units') {
+                            row[vv.key] = 1;
+                        } else if (vv.type === 'reference') {
+                            row[vv.key] = v[vv.key].replace(/\s+/g, '-');
+                        } else {
+                            row[vv.key] = v[vv.key];
+                        }
+                    });
+                    sheet.addRow(row);
+                }
+            });
+        });
+        $.each(columnsLabels, function (k, v) {
+            sheet.getColumn(k + 1).numFmt = v.format;
+        });
+
+        workbook.xlsx.writeBuffer().then(function (data) {
+            var blob = new Blob([data], {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"});
+            const url = window.URL.createObjectURL(blob);
+            const anchor = document.createElement('a');
+            anchor.href = url;
+            anchor.download = $this.getExportFileName() + '.xlsx';
+            anchor.click();
+            window.URL.revokeObjectURL(url);
+        });
+    },
+
+    chooseFileName: function (callback) {
+        var $this = this;
+        $.confirm({
+            title: 'Name your file',
+            content: '' + '<form action="" class="formName">' + '<div class="form-group">' + '<input type="text" value="' + this.getExportFileName() + '" placeholder="File name" class="name form-control" required />' + '</div>' + '</form>',
+            buttons: {
+                formSubmit: {
+                    text: 'Submit', btnClass: 'btn-ok', action: function () {
+                        $this.exportFileName = this.$content.find('.name').val();
+                        callback();
+                    }
+                }, cancel: function () {
+                    //close
+                },
+            },
+            onContentReady: function () {
+                // bind to events
+                var jc = this;
+                this.$content.find('form').on('submit', function (e) {
+                    // if the user submits the form by pressing enter in the field.
+                    e.preventDefault();
+                    jc.$$formSubmit.trigger('click'); // reference the button and click it
+                });
+            }
+        });
+    },
+
+    exportXLS: function () {
+        var $this = this;
+        const workbook = new ExcelJS.Workbook();
+        const sheet = workbook.addWorksheet(this.fluidbook.settings.title);
+        sheet.views = [{state: 'frozen', xSplit: 0, ySplit: 1, topLeftCell: 'A2', activeCell: 'A2'}];
+        sheet.properties.defaultRowHeight = 15;
+        var columnsLabels = this.getXLSColumns();
+        var columns = [];
+
+        $.each(columnsLabels, function (k, v) {
+            columns.push({
+                header: v.label,
+                key: v.key,
+                numFmt: v.format,
+                style: {numFmt: v.format, alignment: {vertical: 'middle', horizontal: 'left', wrapText: true}},
+                width: v.width * 4
+            });
+        });
+
+        sheet.columns = columns;
+        $.each(this.getItems(), function (i, ref) {
+            var row = {};
+            $.each(columnsLabels, function (k, v) {
+                var val = $this.data[ref][v.key];
+                if (v.type === 'price') {
+                    val = $this.normalizePrice(val);
+                } else if (v.type === 'reference') {
+                    val = ref;
+                }
+                row[v.key] = val;
+            });
+            var r = sheet.addRow(row);
+            r.height = Math.round(150 / $this.data[ref]['zoom_image_ratio']);
+        });
+        $.each(columnsLabels, function (k, v) {
+            sheet.getColumn(k + 1).numFmt = v.format;
+        });
+        //
+        $.each(this.getItems(), function (i, ref) {
+            var img = workbook.addImage({
+                base64: 'data:image/jpeg;base64,' + $this.data[ref]['zoom_url'], extension: 'jpeg',
+            });
+            sheet.addImage(img, {tl: {col: 0, row: i + 1}, br: {col: 1, row: i + 2}, editAs: 'twoCell'});
+        });
+
+        workbook.xlsx.writeBuffer().then(function (data) {
+            var blob = new Blob([data], {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"});
+            const url = window.URL.createObjectURL(blob);
+            const anchor = document.createElement('a');
+            anchor.href = url;
+            anchor.download = $this.getExportFileName() + '.xlsx';
+            anchor.click();
+            window.URL.revokeObjectURL(url);
+        });
+    },
+
+    normalizePrice: function (price) {
+        if (price === undefined || price === null) {
+            return 0;
+        }
+        if (typeof price !== 'number') {
+            price = price.replace(/[\$\€]+/g, '');
+            price = parseFloat(price);
+        }
+        return price;
+    },
+
+    formatPrice: function (price, suffix) {
+        if (price === undefined || price === null) {
+            return '';
+        }
+
+        price = this.normalizePrice(price);
+
+        if (suffix == undefined) {
+            suffix = '';
+        }
+
+        var res = price.toLocaleString("fr-FR", {
+            style: "currency", currency: "EUR", minimumFractionDigits: 2, maximumFractionDigits: 2
+        });
+        if (res.indexOf(suffix) === -1) {
+            res += '&nbsp;' + suffix;
+        }
+        return res;
+    },
+
+    _endMenu: function (title, content, callback) {
+        var view = '<div id="pumacart">';
+        view += this.fluidbook.menu.getCaption(title);
+        view += '<div class="content">';
+        view += "" + content;
+        view += '</div>';
+        view += '</div>';
+        this.fluidbook.menu.viewWrap(view, 'cart');
+        callback();
+    },
+
+    getMenuWidth: function () {
+        return 1200;
+    },
+
+    parseFloat: function (s) {
+        if (typeof s === 'number') {
+            return s;
+        }
+        if (s === undefined || s === null || s === '') {
+            return 0;
+        }
+        s = s.replace(/\s/g, '');
+        return parseFloat(s);
+    },
+
+    parseInt: function (s) {
+        if (typeof s === 'number') {
+            return Math.round(s);
+        }
+        if (s === undefined || s === null || s === '') {
+            return 0;
+        }
+        s = s.replace(/\s/g, '');
+        return parseInt(s);
+    },
+};
\ No newline at end of file

diff --git a/js/libs/fluidbook/fluidbook.cart.js b/js/libs/fluidbook/fluidbook.cart.js
index b3b3f834bd583ec1aa797bcadbe1c7c5981557aa..815cb67452d53266b48c41f944b02e7383943af8 100644 (file)
--- a/js/libs/fluidbook/fluidbook.cart.js
+++ b/js/libs/fluidbook/fluidbook.cart.js
@@ -88,7 +88,7 @@ FluidbookCart.prototype = {
                         c.push('no-minus');
                         haveMinus = false;
                     }
-                }catch (e){
+                } catch (e) {
 
                 }
                 var size = 2;
@@ -137,6 +137,7 @@ FluidbookCart.prototype = {
             });
         }
     },
+
     getMenuWidth: function () {
         try {
             return this.instance.getMenuWidth();
@@ -145,6 +146,7 @@ FluidbookCart.prototype = {
         }
         return 1024;
     },
+
     getSavedData: function () {
         return this.fluidbook.cache.get('cart', {})
     },
@@ -159,6 +161,8 @@ FluidbookCart.prototype = {
                 return new FluidbookCartMopec(this);
             case 'Puma':
                 return new FluidbookCartPuma(this);
+            case 'Puma-SE':
+                return new FluidbookCartPumaSE(this);
             case 'MIF':
                 return new FluidbookCartMIF(this);
             case 'GrandPavois':

diff --git a/style/cart/puma-se.less b/style/cart/puma-se.less
new file mode 100644 (file)
index 0000000..03b0059
--- /dev/null
+++ b/style/cart/puma-se.less
@@ -0,0 +1,154 @@
+#pumacart {
+  .caption {
+    margin-top: 10px;
+    text-transform: uppercase;
+  }
+
+  .exportCartXLS {
+    .msie & {
+      display: none;
+    }
+  }
+
+  .emptyCart {
+    float: left;
+    margin-left: 30px;
+    border: 1px solid @menu-button-background;
+    color: @menu-button-background;
+    background-color: transparent;
+  }
+}
+
+[data-type="7"] {
+  svg {
+    pointer-events: none;
+  }
+
+  .on {
+    visibility: hidden;
+  }
+
+  .off {
+    visibility: visible;
+  }
+
+  &.active {
+    .off {
+      visibility: hidden;
+    }
+
+    .on {
+      visibility: visible;
+    }
+  }
+}
+
+
+#pumacarttable {
+  [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;
+  }
+
+
+  padding: 0;
+  border-collapse: collapse;
+  margin: 20px 30px 40px;
+  width: ~"calc(100% - 60px)";
+  max-width: none;
+
+  &.xls {
+    [data-type="image"] {
+      display: none;
+    }
+  }
+
+  &.print {
+    margin: 0;
+    font-size: 8px;
+    width: 100%;
+
+    tr.break {
+      page-break-after: always;
+    }
+
+    td, th {
+      vertical-align: top;
+      padding: 1px;
+
+      &.onlyprint {
+        display: table-cell;
+      }
+
+      &.noprint {
+        display: none;
+      }
+
+      &:last-child {
+        display: none;
+      }
+    }
+
+    [data-cart-delete] {
+      display: none;
+    }
+  }
+
+  td, th {
+    padding: 20px 0 20px 30px;
+    font-size: 11px;
+    text-align: center;
+
+    &.onlyprint {
+      display: none;
+    }
+
+    &.noprint {
+      display: table-cell;
+    }
+
+    span {
+      display: block;
+      max-width: 120px;
+      white-space: normal;
+      margin: 0 auto;
+    }
+
+    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