Merge branch 'JS-323' into JS-334

uharbachou · uharbachou · commit 8bc6448099ec · 2015-12-07T12:56:45.000+03:00
diff --git a/app/code/Magento/ConfigurableProduct/view/frontend/templates/product/view/type/options/configurable.phtml b/app/code/Magento/ConfigurableProduct/view/frontend/templates/product/view/type/options/configurable.phtml
@@ -33,7 +33,8 @@ $_attributes = $block->decorateArray($block->getAllowAttributes());
         {
             "#product_addtocart_form": {
                 "configurable": {
-                    "spConfig": <?php /* @escapeNotVerified */ echo $block->getJsonConfig() ?>
+                    "spConfig": <?php /* @escapeNotVerified */ echo $block->getJsonConfig() ?>,
+                    "onlyMainImg": true
                 }
             }
         }
diff --git a/app/code/Magento/ConfigurableProduct/view/frontend/web/js/configurable.js b/app/code/Magento/ConfigurableProduct/view/frontend/web/js/configurable.js
@@ -7,11 +7,12 @@ define([
     'jquery',
     'underscore',
     'mage/template',
+    'mage/gallery/preloadImages',
     'priceUtils',
     'priceBox',
     'jquery/ui',
     'jquery/jquery.parsequery'
-], function ($, _, mageTemplate) {
+], function ($, _, mageTemplate, preloadImages) {
     'use strict';
 
     $.widget('mage.configurable', {
@@ -38,6 +39,10 @@ define([
             // Initial setting of various option values
             this._initializeOptions();
 
+            //Preload all gallery images
+            this._preloadImages();
+            this._preloadOptionalImages();
+
             // Override defaults with URL query parameters and/or inputs values
             this._overrideDefaults();
 
@@ -87,6 +92,43 @@ define([
             });
         },
 
+        /**
+         * Preloads default configuration images.
+         * @private
+         */
+        _preloadImages: function () {
+            var options = this.options,
+                fullImagesList = [], 
+                imagesList = [];
+
+            _.each(options.mediaGalleryInitial, function (item) {
+                imagesList.push(item.img);
+                fullImagesList.push(item.full);
+            });
+            preloadImages(imagesList);
+            preloadImages(fullImagesList);
+        },
+
+        /**
+         * Preloads optional configuration images.
+         * @private
+         */
+        _preloadOptionalImages: function () {
+            var options = this.options;
+
+            _.each(options.spConfig.images, function (array) {
+                var fullImagesList = [], 
+                    imagesList = [];
+
+                _.each(array, function (item) {
+                    imagesList.push(item.img);
+                    fullImagesList.push(item.full);
+                });
+                preloadImages(imagesList);
+                preloadImages(fullImagesList);
+            });
+        },
+
         /**
          * Override default options values settings with either URL query parameters or
          * initialized inputs values.
@@ -253,14 +295,33 @@ define([
          * @private
          */
         _changeProductImage: function () {
-            var images = this.options.spConfig.images[this.simpleProduct],
-                galleryObject = $(this.options.mediaGallerySelector).data('gallery');
+            var images,
+                initialImages = $.extend(true, [], this.options.mediaGalleryInitial),
+                galleryObject = $(this.options.mediaGallerySelector).data('gallery'),
+                updateGallery;
+
+            if (this.options.spConfig.images[this.simpleProduct]) {
+                images = $.extend(true, [], this.options.spConfig.images[this.simpleProduct]);
+            }
+
+            updateGallery = function (imagesArr) {
+                var mainImg = imagesArr.filter(function (img) {
+                    return img.isMain;
+                });
+
+                galleryObject.updateDataByIndex(0, mainImg[0]);
+                galleryObject.seek(1);
+            };
 
             if (galleryObject) {
                 if (images) {
-                    galleryObject.updateData(images);
+                    this.options.onlyMainImg ?
+                        updateGallery(images) :
+                        galleryObject.updateData(images);
                 } else {
-                    galleryObject.updateData(this.options.mediaGalleryInitial);
+                    this.options.onlyMainImg ?
+                        updateGallery(initialImages) :
+                        galleryObject.updateData(this.options.mediaGalleryInitial);
                 }
             }
         },
diff --git a/lib/web/fotorama/fotorama.js b/lib/web/fotorama/fotorama.js
@@ -1433,14 +1433,8 @@ fotoramaVersion = '4.6.4';
                 xWin = (tail.go || tail.x || xyDiff >= 0) && !tail.noSwipe,
                 yWin = xyDiff < 0;
 
-            if (touchFLAG && !tail.checked) {
-                if (touchEnabledFLAG = xWin) {
-                    stopEvent(e);
-                }
-            } else {
-                stopEvent(e);
-                (options.onMove || noop).call(el, e, {touch: touchFLAG});
-            }
+            stopEvent(e);
+            (options.onMove || noop).call(el, e, {touch: touchFLAG});
 
             if (!moved && Math.sqrt(Math.pow(xDiff, 2) + Math.pow(yDiff, 2)) > tolerance) {
                 moved = true;
@@ -1481,16 +1475,12 @@ fotoramaVersion = '4.6.4';
 
         function onOtherStart() {
             if (tail.flow) return;
-            setTimeout(function () {
-                tail.flow = true;
-            }, 10);
+            tail.flow = true;
         }
 
         function onOtherEnd() {
             if (!tail.flow) return;
-            setTimeout(function () {
-                tail.flow = false;
-            }, TOUCH_TIMEOUT);
+            tail.flow = false;
         }
 
         if (MS_POINTER) {
@@ -2250,7 +2240,7 @@ fotoramaVersion = '4.6.4';
 
                 if (!$frame) return;
 
-                var fullFLAG = that.fullScreen && dataFrame.full && dataFrame.full !== dataFrame.img && !frameData.$full && type === 'stage';
+                var fullFLAG = that.fullScreen && (!frameData.$full || dataFrame.full) && type === 'stage';
 
                 if (frameData.$img && !again && !fullFLAG) return;
 
@@ -2262,7 +2252,7 @@ fotoramaVersion = '4.6.4';
 
                 var srcKey = type === 'stage' ? (fullFLAG ? 'full' : 'img') : 'thumb',
                     src = dataFrame[srcKey],
-                    dummy = fullFLAG ? null : dataFrame[type === 'stage' ? 'thumb' : 'img'];
+                    dummy = fullFLAG ? dataFrame['img'] : dataFrame[type === 'stage' ? 'thumb' : 'img'];
 
                 if (type === 'navThumb') $frame = frameData.$wrap;
 
@@ -3428,6 +3418,17 @@ fotoramaVersion = '4.6.4';
             return this;
         };
 
+        that.spliceByIndex = function (index, newImgObj) {
+            newImgObj.img && $.ajax({
+                url: newImgObj.img,
+                type: 'HEAD',
+                success: function() {
+                    data.splice(index, 1, newImgObj);
+                    reset();
+                }
+            });
+        };
+
         function unloadVideo($video, unloadActiveFLAG, releaseAutoplayFLAG) {
             if (unloadActiveFLAG) {
                 $wrap.removeClass(wrapVideoClass);
diff --git a/lib/web/mage/gallery/gallery.js b/lib/web/mage/gallery/gallery.js
@@ -453,10 +453,19 @@ define([
                         var images = [];
 
                         _.each(this.fotorama.data, function (item) {
-                            images.push(_.omit(item, '$navThumbFrame', '$navDotFrame', '$stageFrame'));
+                            images.push(_.omit(item, '$navThumbFrame', '$navDotFrame', '$stageFrame', 'labelledby'));
                         });
 
                         return images;
+                    },
+                    /**
+                     * Updates gallery data partially by index
+                     * @param {Number} index - Index of image in data array to be updated.
+                     * @param {Object} item - Standart gallery image object.
+                     *
+                     */
+                    updateDataByIndex: function(index, item){
+                        settings.fotoramaApi.spliceByIndex(index, item);
                     }
                 };
 
diff --git a/lib/web/mage/gallery/preloadImages.js b/lib/web/mage/gallery/preloadImages.js
@@ -0,0 +1,35 @@
+/**
+ * Copyright © 2015 Magento. All rights reserved.
+ * See COPYING.txt for license details.
+ */
+define([], function () {
+
+	/**
+     * Loads images into browser's cash.
+     * @param {Array <String>} array - List of sources of images.
+     */
+    var preloadImages = function (array) {
+        if (!preloadImages.list) {
+            preloadImages.list = [];
+        }
+        var list = preloadImages.list;
+
+        for (var i = 0; i < array.length; i++) {
+            var img = new Image();
+
+            img.onload = function() {            	
+                var index = list.indexOf(this);
+
+                if (index !== -1) {
+                    list.splice(index, 1);
+                }
+            }
+
+            list.push(img);
+            img.src = array[i];
+        }
+    };
+
+    return preloadImages;
+
+});
diff --git a/lib/web/magnifier/magnify.js b/lib/web/magnifier/magnify.js

Original file line number	Diff line number	Diff line change
`@@ -33,7 +33,8 @@ $_attributes = $block->decorateArray($block->getAllowAttributes());`
`33`	`33`	`{`
`34`	`34`	`"#product_addtocart_form": {`
`35`	`35`	`"configurable": {`
`36`		`- "spConfig": <?php /* @escapeNotVerified */ echo $block->getJsonConfig() ?>`
	`36`	`+ "spConfig": <?php /* @escapeNotVerified */ echo $block->getJsonConfig() ?>,`
	`37`	`+ "onlyMainImg": true`
`37`	`38`	`}`
`38`	`39`	`}`
`39`	`40`	`}`