Skip to content

Commit afd8827

Browse files
author
Onischenko, Yaroslav(yonischenko)
committed
Merge pull request #368 from magento-nord/pr-368
[Nord] Sprint 34
2 parents fdc06a4 + c616eb2 commit afd8827

File tree

8 files changed

+389
-9
lines changed

8 files changed

+389
-9
lines changed

‎app/code/Magento/ConfigurableProduct/Block/Plugin/Product/Media/Gallery.php

Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
<?php
2+
/**
3+
* Copyright © 2015 Magento. All rights reserved.
4+
* See COPYING.txt for license details.
5+
*/
6+
namespace Magento\ConfigurableProduct\Block\Plugin\Product\Media;
7+
8+
use Magento\ConfigurableProduct\Model\Product\Type\Configurable;
9+
10+
/**
11+
* Class Gallery
12+
*/
13+
class Gallery extends \Magento\Catalog\Block\Product\View\AbstractView
14+
{
15+
/**
16+
* @var \Magento\Catalog\Model\Product\Gallery\ReadHandler
17+
*/
18+
private $productGalleryReadHandler;
19+
20+
/**
21+
* @var \Magento\Framework\Json\EncoderInterface
22+
*/
23+
private $jsonEncoder;
24+
25+
/**
26+
* @var \Magento\Framework\Json\DecoderInterface
27+
*/
28+
private $jsonDecoder;
29+
30+
/**
31+
* Gallery constructor.
32+
* @param \Magento\Catalog\Block\Product\Context $context
33+
* @param \Magento\Framework\Stdlib\ArrayUtils $arrayUtils
34+
* @param \Magento\Catalog\Model\Product\Gallery\ReadHandler $productGalleryReadHandler
35+
* @param \Magento\Framework\Json\EncoderInterface $jsonEncoder
36+
* @param \Magento\Framework\Json\DecoderInterface $jsonDecoder
37+
* @param array $data
38+
*/
39+
public function __construct(
40+
\Magento\Catalog\Block\Product\Context $context,
41+
\Magento\Framework\Stdlib\ArrayUtils $arrayUtils,
42+
\Magento\Catalog\Model\Product\Gallery\ReadHandler $productGalleryReadHandler,
43+
\Magento\Framework\Json\EncoderInterface $jsonEncoder,
44+
\Magento\Framework\Json\DecoderInterface $jsonDecoder,
45+
array $data = []
46+
) {
47+
$this->productGalleryReadHandler = $productGalleryReadHandler;
48+
$this->jsonEncoder = $jsonEncoder;
49+
$this->jsonDecoder = $jsonDecoder;
50+
parent::__construct($context, $arrayUtils, $data);
51+
}
52+
53+
/**
54+
* @param \Magento\Catalog\Block\Product\View\Gallery $subject
55+
* @param string $result
56+
* @return string
57+
*
58+
* @SuppressWarnings(PHPMD.UnusedFormalParameter)
59+
*/
60+
public function afterGetOptionsMediaGalleryDataJson(
61+
\Magento\Catalog\Block\Product\View\Gallery $subject,
62+
$result
63+
) {
64+
$result = $this->jsonDecoder->decode($result);
65+
if ($this->getProduct()->getTypeId() == 'configurable') {
66+
/** @var Configurable $productType */
67+
$productType = $this->getProduct()->getTypeInstance();
68+
$products = $productType->getUsedProducts($this->getProduct());
69+
$attributes = $productType->getConfigurableAttributesAsArray($this->getProduct());
70+
/** @var \Magento\Catalog\Model\Product $product */
71+
foreach ($attributes as $attribute) {
72+
foreach ($products as $product) {
73+
$attributeValue = $product->getData($attribute['attribute_code']);
74+
if ($attributeValue) {
75+
$key = $attribute['attribute_code'] . '_' . $attributeValue;
76+
$result[$key] = $this->getProductGallery($product);
77+
}
78+
}
79+
}
80+
}
81+
return $this->jsonEncoder->encode($result);
82+
}
83+
84+
/**
85+
* @param \Magento\Catalog\Model\Product $product
86+
* @return array
87+
*/
88+
private function getProductGallery($product)
89+
{
90+
$result = [];
91+
$this->productGalleryReadHandler->execute('', $product);
92+
$images = $product->getMediaGalleryImages();
93+
foreach ($images as $image) {
94+
$result[] = [
95+
'mediaType' => $image->getMediaType(),
96+
'videoUrl' => $image->getVideoUrl(),
97+
'isBase' => $product->getImage() == $image->getFile(),
98+
];
99+
}
100+
return $result;
101+
}
102+
}

‎app/code/Magento/ConfigurableProduct/Test/Unit/Block/Plugin/Product/Media/GalleryTest.php

Lines changed: 111 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,111 @@
1+
<?php
2+
/**
3+
* Copyright © 2015 Magento. All rights reserved.
4+
* See COPYING.txt for license details.
5+
*/
6+
7+
namespace Magento\ConfigurableProduct\Test\Unit\Block\Plugin\Product\Media;
8+
9+
/**
10+
* Class GalleryTest
11+
*/
12+
class GalleryTest extends \PHPUnit_Framework_TestCase
13+
{
14+
/**
15+
* @var \Magento\ConfigurableProduct\Block\Plugin\Product\Media\Gallery
16+
*/
17+
private $plugin;
18+
19+
/**
20+
* @var \Magento\Framework\Json\EncoderInterface|\PHPUnit_Framework_MockObject_MockObject
21+
*/
22+
private $jsonEncoder;
23+
24+
/**
25+
* @var \Magento\Framework\Json\DecoderInterface|\PHPUnit_Framework_MockObject_MockObject
26+
*/
27+
private $jsonDecoder;
28+
29+
/**
30+
* @var \Magento\Catalog\Model\Product\Gallery\ReadHandler
31+
*/
32+
private $galleryHandler;
33+
34+
protected function setUp()
35+
{
36+
$helper = new \Magento\Framework\TestFramework\Unit\Helper\ObjectManager($this);
37+
$this->galleryHandler = $this->getMockBuilder('\Magento\Catalog\Model\Product\Gallery\ReadHandler')
38+
->disableOriginalConstructor()
39+
->setMethods(['execute'])
40+
->getMock();
41+
42+
$this->jsonEncoder = $this->getMock('\Magento\Framework\Json\EncoderInterface');
43+
$this->jsonDecoder = $this->getMock('\Magento\Framework\Json\DecoderInterface');
44+
45+
$productMock = $this->getMockBuilder('\Magento\Catalog\Model\Product')
46+
->setMethods(['getTypeId', 'getTypeInstance'])
47+
->disableOriginalConstructor()
48+
->getMock();
49+
50+
$variationProduct = $this->getMockBuilder('\Magento\Catalog\Model\Product')
51+
->setMethods(['setMediaGalleryEntries', 'getSku', 'getMediaGalleryImages', 'getImage', 'getData'])
52+
->disableOriginalConstructor()
53+
->getMock();
54+
$image = new \Magento\Framework\DataObject(
55+
['media_type' => 'type', 'video_url' => 'url', 'file' => 'image.jpg']
56+
);
57+
$variationProduct->expects($this->any())->method('setMediaGalleryEntries')->willReturn([]);
58+
$variationProduct->expects($this->any())->method('getSku')->willReturn('sku');
59+
$variationProduct->expects($this->any())->method('getMediaGalleryImages')->willReturn([$image]);
60+
$variationProduct->expects($this->any())->method('getImage')->willReturn('image.jpg');
61+
$variationProduct->expects($this->any())->method('getData')->with('configurable_attribute')->willReturn(1);
62+
63+
$this->galleryHandler->expects($this->once())->method('execute')->with('', $variationProduct);
64+
65+
$configurableType = $this->getMockBuilder('\Magento\ConfigurableProduct\Model\Product\Type\Configurable')
66+
->disableOriginalConstructor()
67+
->setMethods(['getUsedProducts', 'getConfigurableAttributesAsArray'])
68+
->getMock();
69+
$configurableType->expects($this->any())->method('getUsedProducts')->with($productMock)
70+
->willReturn([$variationProduct]);
71+
$configurableType->expects($this->any())->method('getConfigurableAttributesAsArray')->with($productMock)
72+
->willReturn([['attribute_code' => 'configurable_attribute']]);
73+
74+
$productMock->expects($this->any())->method('getTypeId')->willReturn('configurable');
75+
$productMock->expects($this->any())->method('getTypeInstance')->willReturn($configurableType);
76+
77+
$this->plugin = $helper->getObject(
78+
'\Magento\ConfigurableProduct\Block\Plugin\Product\Media\Gallery',
79+
[
80+
'productGalleryReadHandler' => $this->galleryHandler,
81+
'jsonEncoder' => $this->jsonEncoder,
82+
'jsonDecoder' => $this->jsonDecoder
83+
]
84+
);
85+
$this->plugin->setData('product', $productMock);
86+
}
87+
88+
public function testAfterGetOptions()
89+
{
90+
$resultJson = '[]';
91+
$this->jsonDecoder->expects($this->once())->method('decode')->with('[]')->willReturn([]);
92+
$expected = [
93+
'configurable_attribute_1' => [
94+
[
95+
'mediaType' => 'type',
96+
'videoUrl' => 'url',
97+
'isBase' => true
98+
]
99+
]
100+
];
101+
$this->jsonEncoder->expects($this->any())->method('encode')->with($expected)
102+
->willReturn(json_encode($expected));
103+
104+
$blockMock = $this->getMockBuilder('\Magento\ProductVideo\Block\Product\View\Gallery')
105+
->disableOriginalConstructor()
106+
->getMock();
107+
108+
$result = $this->plugin->afterGetOptionsMediaGalleryDataJson($blockMock, $resultJson);
109+
$this->assertEquals(json_encode($expected), $result);
110+
}
111+
}

‎app/code/Magento/ConfigurableProduct/etc/di.xml

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -126,4 +126,7 @@
126126
<type name="Magento\Catalog\Model\Product\Attribute\Backend\Price">
127127
<plugin name="configurable" type="Magento\ConfigurableProduct\Model\Plugin\PriceBackend" sortOrder="100" />
128128
</type>
129+
<type name="\Magento\ProductVideo\Block\Product\View\Gallery">
130+
<plugin name="product_video_gallery" type="\Magento\ConfigurableProduct\Block\Plugin\Product\Media\Gallery" />
131+
</type>
129132
</config>

‎app/code/Magento/ProductVideo/Block/Product/View/Gallery.php

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -73,4 +73,13 @@ public function getVideoSettingsJson()
7373
];
7474
return $this->jsonEncoder->encode($videoSettingData);
7575
}
76+
77+
/**
78+
* Return media gallery for product options
79+
* @return string
80+
*/
81+
public function getOptionsMediaGalleryDataJson()
82+
{
83+
return $this->jsonEncoder->encode([]);
84+
}
7685
}

‎app/code/Magento/ProductVideo/view/frontend/templates/product/view/gallery.phtml

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,8 @@
1515
"[data-gallery-role=gallery-placeholder]": {
1616
"Magento_ProductVideo/js/fotorama-add-video-events": {
1717
"fotoramaVideoData": <?php /* @escapeNotVerified */ echo $block->getMediaGalleryDataJson(); ?>,
18-
"fotoramaVideoSettings": <?php /* @escapeNotVerified */ echo $block->getVideoSettingsJson(); ?>
18+
"fotoramaVideoSettings": <?php /* @escapeNotVerified */ echo $block->getVideoSettingsJson(); ?>,
19+
"fotoramaOptionsVideoData": <?php /* @noEscape */ echo $block->getOptionsMediaGalleryDataJson(); ?>
1920
}
2021
}
2122
}

‎app/code/Magento/ProductVideo/view/frontend/web/js/fotorama-add-video-events.js

Lines changed: 47 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -93,7 +93,8 @@ define([
9393
$.widget('mage.AddFotoramaVideoEvents', {
9494
options: {
9595
VideoData: '',
96-
VideoSettings: ''
96+
VideoSettings: '',
97+
OptionsVideoData: ''
9798
},
9899

99100
PV: 'product-video', // [CONST]
@@ -106,12 +107,15 @@ define([
106107
Base: 0, //on check for video is base this setting become true if there is any video with base role
107108
MobileMaxWidth: 767,
108109
GP: 'gallery-placeholder', //gallery placeholder class is needed to find and erase <script> tag
110+
videoData: null,
109111

110112
/**
111113
*
112114
* @private
113115
*/
114116
_init: function () {
117+
this._loadVideoData();
118+
115119
if (this._checkForVideoExist()) {
116120
this._checkFullscreen();
117121
this._listenForFullscreen();
@@ -122,6 +126,32 @@ define([
122126
}
123127
},
124128

129+
/**
130+
*
131+
* @private
132+
*/
133+
_loadVideoData: function () {
134+
var $widget = this;
135+
136+
if (!$widget.videoData) {
137+
$widget.videoData = $widget.options.VideoData;
138+
}
139+
140+
$('#product-options-wrapper').find('[option-selected]').each(function () {
141+
var key = $(this).attr('attribute-code') + '_' + $(this).attr('option-selected');
142+
143+
if ($widget.options.OptionsVideoData && $widget.options.OptionsVideoData[key]) {
144+
$widget.options.VideoData = $widget.options.OptionsVideoData[key];
145+
} else {
146+
$widget.options.VideoData = $widget.videoData;
147+
}
148+
});
149+
150+
if (!$('#product-options-wrapper').find('[option-selected]').length) {
151+
$widget.options.VideoData = $widget.videoData;
152+
}
153+
},
154+
125155
/**
126156
*
127157
* @private
@@ -439,18 +469,23 @@ define([
439469
* @private
440470
*/
441471
_checkForVideo: function (e, fotorama, number) {
442-
var frameNumber = parseInt(fotorama.activeFrame.i, 10),
443-
videoData = this.options.VideoData[frameNumber - 1 + number],
444-
$image = fotorama.data[frameNumber - 1 + number];
472+
var videoData = this.options.VideoData[fotorama.activeIndex + number],
473+
$image = fotorama.data[fotorama.activeIndex + number];
445474

446-
if ($image) {
447-
$image = $image.$stageFrame;
475+
if (!$image) {
476+
return;
448477
}
449478

450-
if ($image && videoData && videoData.mediaType === this.VID) {
479+
$image = $image.$stageFrame;
480+
481+
if (videoData && videoData.mediaType === this.VID) {
451482
$(fotorama.activeFrame.$stageFrame).removeAttr('href');
452483
this._prepareForVideoContainer($image, videoData, fotorama, number);
453484
$('.fotorama-video-container').addClass('video-unplayed');
485+
} else if ($image.find('.' + this.PV).length !== 0) {
486+
$image.find('.' + this.PV).remove();
487+
$image.removeClass('fotorama-video-container');
488+
$image.removeClass('video-unplayed');
454489
}
455490
},
456491

@@ -596,6 +631,9 @@ define([
596631
_unloadVideoPlayer: function ($wrapper, current, close) {
597632
var self = this;
598633

634+
if (!$wrapper) {
635+
return;
636+
}
599637
$wrapper.find('.' + this.PV).each(function () {
600638
var $item = $(this).parent(),
601639
cloneVideoDiv,
@@ -642,7 +680,8 @@ define([
642680
$('.gallery-placeholder').on('fotorama:ready', function () {
643681
$(element).find('.fotorama').AddFotoramaVideoEvents({
644682
VideoData: config.fotoramaVideoData || [],
645-
VideoSettings: config.fotoramaVideoSettings || {}
683+
VideoSettings: config.fotoramaVideoSettings || {},
684+
OptionsVideoData: config.fotoramaOptionsVideoData || {}
646685
});
647686
});
648687
};

0 commit comments

Comments
 (0)