JS-191: Implement buttons actions

Author: anastasiiabuniak

app/code/Magento/Catalog/view/frontend/templates/product/view/gallery.phtml

@@ -43,20 +43,18 @@
                         ?: $block->getImageAttribute('product_page_image_medium', 'width'); ?>,
                     "transitionduration": <?php echo $block->getVar("gallery:transition:duration"); ?>,
                     "transition": "<?php echo $block->getVar("gallery:transition:effect"); ?>",
-                    "carouselNavigation": <?php echo $block->getVar("gallery:navigation:carousel"); ?>
+                    "navarrows": <?php echo $block->getVar("gallery:navarrows"); ?>,
+                    "navtype": "<?php echo $block->getVar("gallery:navtype"); ?>",
+                    "navdir": "<?php echo $block->getVar("gallery:navdir"); ?>"
                 },
                 "fullscreen": {
                     "nav": "<?php echo $block->getVar("gallery:fullscreen:nav"); ?>",
                     "loop": <?php echo $block->getVar("gallery:fullscreen:loop"); ?>,
                     "navdir": "<?php echo $block->getVar("gallery:fullscreen:navdir"); ?>",
                     "arrows": <?php echo $block->getVar("gallery:fullscreen:arrows"); ?>,
                     "showCaption": <?php echo $block->getVar("gallery:fullscreen:caption"); ?>,
-                    "thumbwidth": <?php echo $block->getVar("gallery:fullscreen:thumbwidth"); ?>,
-                    "thumbheight": <?php echo $block->getVar("gallery:fullscreen:thumbheight")
-                        ?: $block->getVar("gallery:fullscreen:thumbwidth"); ?>,
                     "transitionduration": <?php echo $block->getVar("gallery:fullscreen:transition:duration"); ?>,
-                    "transition": "<?php echo $block->getVar("gallery:fullscreen:transition:effect"); ?>",
-                    "carouselNavigation": <?php echo $block->getVar("gallery:fullscreen:navigation:carousel"); ?>
+                    "transition": "<?php echo $block->getVar("gallery:fullscreen:transition:effect"); ?>"
                 },
                 "breakpoints": {
                     "mobile": {

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

@@ -187,9 +187,10 @@
         <var name="gallery:caption">false</var> <!-- Display alt text as image title (true/false) -->
         <var name="gallery:allowfullscreen">true</var> <!-- Turn on/off fullscreen (true/false) -->
         <var name="gallery:navdir">horizontal</var> <!-- Sliding direction of thumbnails (horizontal/vertical) -->
+        <var name="gallery:navarrows">true</var> <!-- Turn on/off on the thumbs navigation sides (true/false) -->
+        <var name="gallery:navtype">slides</var> <!-- Sliding type of thumbnails (slides/thumbs) -->
         <var name="gallery:transition:effect">slide</var> <!-- Sets transition effect for slides changing (slide/crossfade/dissolve) -->
         <var name="gallery:transition:duration">500</var> <!-- Sets transition duration in ms -->
-        <var name="gallery:navigation:carousel">true</var> <!-- Display navigation thumbs as carousel (true/false) -->
 
         <var name="gallery:fullscreen:nav">thumbs</var> <!-- Fullscreen navigation style (false/thumbs/dots) -->
         <var name="gallery:fullscreen:loop">false</var> <!-- Fullscreen navigation loop (true/false) -->

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

@@ -184,16 +184,17 @@
     <vars module="Magento_Catalog">
 
         <!-- New gallery and magnifier theme settings -->
-        <var name="gallery:nav">dots</var> <!-- Gallery navigation style (false/thumbs/dots) -->
+        <var name="gallery:nav">thumbs</var> <!-- Gallery navigation style (false/thumbs/dots) -->
         <var name="gallery:loop">false</var> <!-- Gallery navigation loop (true/false) -->
         <var name="gallery:keyboard">true</var> <!-- Turn on/off keyboard arrows navigation (true/false) -->
         <var name="gallery:arrows">true</var> <!-- Turn on/off arrows on the sides preview (true/false) -->
-        <var name="gallery:caption">true</var> <!-- Display alt text as image title (true/false) -->
+        <var name="gallery:caption">false</var> <!-- Display alt text as image title (true/false) -->
         <var name="gallery:allowfullscreen">true</var> <!-- Turn on/off fullscreen (true/false) -->
         <var name="gallery:navdir">horizontal</var> <!-- Sliding direction of thumbnails (horizontal/vertical) -->
+        <var name="gallery:navarrows">true</var> <!-- Turn on/off on the thumbs navigation sides (true/false) -->
+        <var name="gallery:navtype">slides</var> <!-- Sliding type of thumbnails (slides/thumbs) -->
         <var name="gallery:transition:effect">slide</var> <!-- Sets transition effect for slides changing (slide/crossfade/dissolve) -->
         <var name="gallery:transition:duration">500</var> <!-- Sets transition duration in ms -->
-        <var name="gallery:navigation:carousel">true</var> <!-- Display navigation thumbs as carousel (true/false) -->
 
         <var name="gallery:fullscreen:nav">thumbs</var> <!-- Fullscreen navigation style (false/thumbs/dots) -->
         <var name="gallery:fullscreen:loop">true</var> <!-- Fullscreen navigation loop (true/false/null) -->