From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Sun, 21 Feb 2021 12:06:53 +0000 (+0100)
Subject: wait #4285 @0.75
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=f321f7f3e3042578345f8670303b4dda6cc32891;p=fluidbook-html5.git

wait #4285 @0.75
---

diff --git a/js/libs/fluidbook/cart/fluidbook.cart.grandvision.js b/js/libs/fluidbook/cart/fluidbook.cart.grandvision.js
index d2b05ea7..a4203253 100644
--- a/js/libs/fluidbook/cart/fluidbook.cart.grandvision.js
+++ b/js/libs/fluidbook/cart/fluidbook.cart.grandvision.js
@@ -24,7 +24,7 @@ FluidbookCartGrandVision.prototype = {
         $(document).on('click', '.grandvision-slideshow .dots a', function () {
             var diff = $(this).data('i') - $this.currentSlide;
             if (diff !== 0) {
-                $this.gotoSlide($(this).data('i'), diff>=1?1:-1);
+                $this.gotoSlide($(this).data('i'), diff >= 1 ? 1 : -1);
             }
             return false;
         });
@@ -34,6 +34,55 @@ FluidbookCartGrandVision.prototype = {
         if (p1 === 'details') {
             return this.openDetails(p2, cb);
         }
+        return this.openSelection(cb);
+    },
+
+    openSelection: function (cb) {
+
+        var res = '<div id="grandvision-cart">';
+        res += this.fluidbook.menu.getCaption('', true);
+        res += '<div class="content">';
+        res += this.cartSelection();
+        res += this.cartBoxes();
+        res += '</div>';
+        res += '</div>';
+        this.fluidbook.menu.viewWrap(res, 'cart-grandvision-selection', 'data-max-width="1200" data-min-width="1200"');
+
+        if (cb !== undefined) {
+            cb();
+        }
+    },
+
+    cartSelection: function () {
+        var $this = this;
+        var res = '<div id="grandvision-selection">';
+        res += '<h2>My Selection</h2>';
+        res += '<div class="filters"></div>';
+        res += '<div class="items">';
+        $.each(this.items, function (k, item) {
+            var data = $this.getProductData(item);
+            var infos = ['Brand: ' + data.BRAND, 'Color: ' + data['Color Code']];
+            if (data.Gender !== '') {
+                infos.push('Gender: ' + data.Gender);
+            }
+            infos.push('EAN: ' + item);
+
+            res += '<div class="item" data-ref="' + item + '">';
+            res += '<div class="img"><img src="data/commerce/' + item + '-front.jpg" /></div>';
+            res += '<h3>' + data['Model Code'] + '</h3>';
+            res += '<div class="infos">' + infos.join(' | ') + '</div>';
+            res += '</div>';
+        });
+        res += '</div>';
+        res += '</div>';
+        return res;
+    },
+
+    cartBoxes: function () {
+        var res = '<div id="grandvision-boxes">';
+        res += '<h2>My Boxes</h2>';
+        res += '</div>';
+        return res;
     },
 
     getProductData: function (ref) {
@@ -83,21 +132,21 @@ FluidbookCartGrandVision.prototype = {
         this.nbslides = 0;
         this.currentSlide = 0;
         this.transitioning = false;
-        var o=1;
+        var o = 1;
         if (data.front) {
-            slides += '<div class="slide" style="opacity: '+o+';"><img src="data/commerce/' + ref + '-front.jpg" /></div>';
+            slides += '<div class="slide" style="opacity: ' + o + ';"><img src="data/commerce/' + ref + '-front.jpg" /></div>';
             this.nbslides++;
-            o=0;
+            o = 0;
         }
         if (data.angle) {
-            slides += '<div class="slide" style="opacity: '+o+';"><img src="data/commerce/' + ref + '-angle.jpg" /></div>';
+            slides += '<div class="slide" style="opacity: ' + o + ';"><img src="data/commerce/' + ref + '-angle.jpg" /></div>';
             this.nbslides++;
-            o=0;
+            o = 0;
         }
         if (data['360']) {
-            slides += '<div class="slide" style="opacity: '+o+';"><video src="data/commerce/' + ref + '-360.mp4" autoplay muted loop preload /></div>';
+            slides += '<div class="slide" style="opacity: ' + o + ';"><video src="data/commerce/' + ref + '-360.mp4" autoplay muted loop preload /></div>';
             this.nbslides++;
-            o=0;
+            o = 0;
         }
         if (this.nbslides === 0) {
             return '';
@@ -111,11 +160,11 @@ FluidbookCartGrandVision.prototype = {
             res += '<a href="#" class="next">' + getSpriteIcon('interface-next') + '</a>';
             res += '<nav class="dots">';
             for (var i = 0; i < this.nbslides; i++) {
-                var c='';
-                if(i===0){
-                    c=' class="active"';
+                var c = '';
+                if (i === 0) {
+                    c = ' class="active"';
                 }
-                res += '<a href="#" '+c+' data-i="' + i + '"></a>';
+                res += '<a href="#" ' + c + ' data-i="' + i + '"></a>';
             }
             res += '</nav>';
         }
@@ -124,16 +173,22 @@ FluidbookCartGrandVision.prototype = {
     },
 
     gotoSlide: function (i, dir) {
-        if(this.transitioning){
+        if (this.transitioning) {
             return;
         }
-        this.transitioning=true;
+        this.transitioning = true;
         var $this = this;
         this.nextSlideIndex = this.normalizeSlide(i);
         var t = 0.6;
         var w = 360;
-        TweenMax.to($('.grandvision-slideshow .slide:eq(' + this.currentSlide + ')'), t, {left: w * dir*-1, opacity: 0});
-        TweenMax.fromTo($('.grandvision-slideshow .slide:eq(' + this.nextSlideIndex + ')'), t, {left: w * dir , opacity: 0}, {
+        TweenMax.to($('.grandvision-slideshow .slide:eq(' + this.currentSlide + ')'), t, {
+            left: w * dir * -1,
+            opacity: 0
+        });
+        TweenMax.fromTo($('.grandvision-slideshow .slide:eq(' + this.nextSlideIndex + ')'), t, {
+            left: w * dir,
+            opacity: 0
+        }, {
             left: 0,
             opacity: 1,
             onComplete: function () {
@@ -146,7 +201,7 @@ FluidbookCartGrandVision.prototype = {
         this.transitioning = false;
         this.currentSlide = this.nextSlideIndex;
         $('.grandvision-slideshow .dots a').removeClass('active');
-        $('.grandvision-slideshow .dots a:eq('+this.currentSlide+')').addClass('active');
+        $('.grandvision-slideshow .dots a:eq(' + this.currentSlide + ')').addClass('active');
     },
 
     normalizeSlide: function (i) {