Merge pull request #703 from magento-tsg/2.0-develop-pr5

Bug fixes:
- MAGETWO-61112: [Backport] [github #6195, #4101] Gallery doesn't show all images added to configurable options
- MAGETWO-61326: [Backport] State/Province dropdown is broken in frontend customer gift registry

Author: MomotenkoNatalia

app/code/Magento/Checkout/view/frontend/web/js/region-updater.js

@@ -7,9 +7,10 @@
 define([
     'jquery',
     'mage/template',
+    'underscore',
     'jquery/ui',
     'mage/validation'
-], function ($, mageTemplate) {
+], function ($, mageTemplate, _) {
     'use strict';
 
     $.widget('mage.regionUpdater', {
@@ -124,6 +125,8 @@ define([
          * @private
          */
         _clearError: function () {
+            var args = ['clearError', this.options.regionListId, this.options.regionInputId, this.options.postcodeId];
+
             if (this.options.clearError && typeof this.options.clearError === 'function') {
                 this.options.clearError.call(this);
             } else {
@@ -133,8 +136,8 @@ define([
 
                 this.options.form = $(this.options.form);
 
-                this.options.form && this.options.form.data('validator') && this.options.form.validation('clearError',
-                    this.options.regionListId, this.options.regionInputId, this.options.postcodeId);
+                this.options.form && this.options.form.data('validator') &&
+                    this.options.form.validation.apply(this.options.form, _.compact(args));
 
                 // Clean up errors on region & zip fix
                 $(this.options.regionInputId).removeClass('mage-error').parent().find('[generated]').remove();

app/code/Magento/ConfigurableProduct/view/frontend/templates/product/view/type/options/configurable.phtml

@@ -33,7 +33,9 @@ $_attributes = $block->decorateArray($block->getAllowAttributes());
         {
             "#product_addtocart_form": {
                 "configurable": {
-                    "spConfig": <?php /* @escapeNotVerified */ echo $block->getJsonConfig() ?>
+                    "spConfig": <?php /* @escapeNotVerified */ echo $block->getJsonConfig() ?>,
+                    "gallerySwitchStrategy": "<?php /* @escapeNotVerified */ echo $block->getVar('gallery_switch_strategy',
+                        'Magento_ConfigurableProduct') ?: 'replace'; ?>"
                 }
             }
         }

app/code/Magento/ConfigurableProduct/view/frontend/web/js/configurable.js

@@ -28,7 +28,17 @@ define([
             '<% } %>',
             mediaGallerySelector: '[data-gallery-role=gallery-placeholder]',
             mediaGalleryInitial: null,
-            slyOldPriceSelector: '.sly-old-price'
+            slyOldPriceSelector: '.sly-old-price',
+
+            /**
+             * Defines the mechanism of how images of a gallery should be
+             * updated when user switches between configurations of a product.
+             *
+             * As for now value of this option can be either 'replace' or 'prepend'.
+             *
+             * @type {String}
+             */
+            gallerySwitchStrategy: 'replace'
         },
 
         /**
@@ -84,10 +94,9 @@ define([
 
             this.inputSimpleProduct = this.element.find(options.selectSimpleProduct);
 
-            gallery.on('gallery:loaded', function () {
-                var galleryObject = gallery.data('gallery');
-                options.mediaGalleryInitial = galleryObject.returnCurrentImages();
-            });
+            gallery.data('gallery') ?
+                this._onGalleryLoaded(gallery) :
+                gallery.on('gallery:loaded', this._onGalleryLoaded.bind(this, gallery));
         },
 
         /**
@@ -258,15 +267,29 @@ define([
          */
         _changeProductImage: function () {
             var images = this.options.spConfig.images[this.simpleProduct],
+                initialImages = this.options.mediaGalleryInitial,
                 galleryObject = $(this.options.mediaGallerySelector).data('gallery');
 
             if (galleryObject) {
                 if (images) {
+                    if (this.options.gallerySwitchStrategy === 'prepend') {
+                        images = images.concat(initialImages);
+                    }
+
+                    images = $.extend(true, [], images);
+
+                    images.forEach(function (img) {
+                        img.type = 'image';
+                    });
+
                     galleryObject.updateData(images);
                 } else {
-                    galleryObject.updateData(this.options.mediaGalleryInitial);
+                    galleryObject.updateData(initialImages);
+                    $(this.options.mediaGallerySelector).AddFotoramaVideoEvents();
                 }
             }
+
+            galleryObject.first();
         },
 
         /**
@@ -474,8 +497,18 @@ define([
             } else {
                 $(this.options.slyOldPriceSelector).hide();
             }
-        }
+        },
+
+        /**
+         * Callback which fired after gallery gets initialized.
+         *
+         * @param {HTMLElement} element - DOM element associated with gallery.
+         */
+        _onGalleryLoaded: function (element) {
+            var galleryObject = element.data('gallery');
 
+            this.options.mediaGalleryInitial = galleryObject.returnCurrentImages();
+        }
     });
 
     return $.mage.configurable;

app/code/Magento/Swatches/view/frontend/templates/product/view/renderer.phtml

@@ -13,7 +13,9 @@
             "Magento_Swatches/js/SwatchRenderer": {
                 "jsonConfig": <?php /* @escapeNotVerified */ echo $block->getJsonConfig(); ?>,
                 "jsonSwatchConfig": <?php /* @escapeNotVerified */ echo $block->getJsonSwatchConfig(); ?>,
-                "mediaCallback": "<?php /* @escapeNotVerified */ echo $block->getMediaCallback() ?>"
+                "mediaCallback": "<?php /* @escapeNotVerified */ echo $block->getMediaCallback() ?>",
+                "gallerySwitchStrategy": "<?php /* @escapeNotVerified */ echo $block->getVar('gallery_switch_strategy',
+                    'Magento_ConfigurableProduct') ?: 'replace'; ?>"
             }
         }
     }

app/design/frontend/Magento/luma/etc/view.xml

@@ -254,6 +254,11 @@
     <vars module="Magento_Bundle">
         <var name="product_summary_image_size">58</var>         <!-- New Product image size used for summary block-->
     </vars>
+
+    <vars module="Magento_ConfigurableProduct">
+        <var name="gallery_switch_strategy">prepend</var>
+    </vars>
+
     <vars module="Js_Bundle">
         <var name="bundle_size">1MB</var>
     </vars>

lib/web/mage/gallery/gallery.js

@@ -407,7 +407,6 @@ define([
                      */
                     updateData: function (data) {
                         if (_.isArray(data)) {
-                            pushMainFirst(data);
                             settings.fotoramaApi.load(data);
 
                             $.extend(false, settings, {