diff --git a/Controller/Adminhtml/Ajax/Free/Image.php b/Controller/Adminhtml/Ajax/Free/Image.php index e2102821..2784a18d 100644 --- a/Controller/Adminhtml/Ajax/Free/Image.php +++ b/Controller/Adminhtml/Ajax/Free/Image.php @@ -76,7 +76,7 @@ public function execute() */ private function defaultTransformWithFreeTransform($freeTransform) { - $transformation = $this->configuration->getDefaultTransformation(); + $transformation = $this->configuration->getDefaultTransformation(true); if ($freeTransform) { $transformation->withFreeform(Freeform::fromString($freeTransform)); diff --git a/Core/CloudinaryImageProvider.php b/Core/CloudinaryImageProvider.php index 218a8838..f8f6d544 100644 --- a/Core/CloudinaryImageProvider.php +++ b/Core/CloudinaryImageProvider.php @@ -134,7 +134,7 @@ public function retrieveTransformed(Image $image, Transformation $transformation 'sign_url' => $this->configuration->getUseSignedUrls(), 'version' => 1 ] - ); + ) . '?_i=AB'; if (!$this->configuration->isEnabledProductGallery()) { //Handle with use-root-path if necessary: diff --git a/Helper/ProductGalleryHelper.php b/Helper/ProductGalleryHelper.php index 9e9c309e..8e3103ca 100644 --- a/Helper/ProductGalleryHelper.php +++ b/Helper/ProductGalleryHelper.php @@ -94,6 +94,7 @@ public function getCloudinaryPGOptions($refresh = false, $ignoreDisabled = false unset($this->cloudinaryPGoptions['custom_free_params']); } $this->cloudinaryPGoptions['cloudName'] = $this->getCloudName(); + $this->cloudinaryPGoptions['queryParam'] = 'AB'; } return $this->cloudinaryPGoptions; diff --git a/Model/Config/Source/Dropdown/FreeTransformBehavior.php b/Model/Config/Source/Dropdown/FreeTransformBehavior.php new file mode 100644 index 00000000..2ed10c1e --- /dev/null +++ b/Model/Config/Source/Dropdown/FreeTransformBehavior.php @@ -0,0 +1,22 @@ + 'add', + 'label' => 'Add', + ], + [ + 'value' => 'override', + 'label' => 'Override', + ], + ]; + } +} diff --git a/Model/Configuration.php b/Model/Configuration.php index e5798956..b0654441 100644 --- a/Model/Configuration.php +++ b/Model/Configuration.php @@ -44,6 +44,8 @@ class Configuration implements ConfigurationInterface const CONFIG_PATH_DEFAULT_FETCH_FORMAT = 'cloudinary/transformations/cloudinary_fetch_format'; const CONFIG_PATH_DEFAULT_IMAGE = 'cloudinary/transformations/cloudinary_default_image'; const CONFIG_PATH_GLOBAL_FREEFORM = 'cloudinary/transformations/cloudinary_free_transform_global'; + const CONFIG_PATH_GLOBAL_FREEFORM_PRODUCTS = 'cloudinary/transformations/cloudinary_free_transform_global_products'; + const CONFIG_PATH_GLOBAL_FREEFORM_PRODUCTS_BEHAVIOR = 'cloudinary/transformations/cloudinary_free_transform_global_products_behavior'; //= Lazyload const XML_PATH_LAZYLOAD_ENABLED = 'cloudinary/lazyload/enabled'; @@ -231,15 +233,24 @@ public function getCredentials() } /** + * @param bool $isProduct * @return Transformation */ - public function getDefaultTransformation() + public function getDefaultTransformation($isProduct = false) { + if ($isProduct && ($globalFreeform = $this->getDefaultGlobalFreeformProducts())) { + if ($this->getDefaultGlobalFreeformProductsBehavior() === 'add') { + $globalFreeform = $this->getDefaultGlobalFreeform() . ',' . $globalFreeform; + } + } else { + $globalFreeform = $this->getDefaultGlobalFreeform(); + } + return Transformation::builder() ->withGravity(Gravity::fromString($this->getDefaultGravity())) ->withQuality(Quality::fromString($this->getImageQuality())) ->withFetchFormat(FetchFormat::fromString($this->getFetchFormat())) - ->withFreeform(Freeform::fromString($this->getDefaultGlobalFreeform())) + ->withFreeform(Freeform::fromString($globalFreeform)) ->withDpr(Dpr::fromString($this->getImageDpr())) ->withDefaultImage(DefaultImage::fromString($this->getCloudinaryDefaultImage())); } @@ -252,6 +263,22 @@ private function getDefaultGlobalFreeform() return (string) $this->configReader->getValue(self::CONFIG_PATH_GLOBAL_FREEFORM); } + /** + * @return string + */ + private function getDefaultGlobalFreeformProducts() + { + return (string) $this->configReader->getValue(self::CONFIG_PATH_GLOBAL_FREEFORM_PRODUCTS); + } + + /** + * @return string + */ + private function getDefaultGlobalFreeformProductsBehavior() + { + return (string) $this->configReader->getValue(self::CONFIG_PATH_GLOBAL_FREEFORM_PRODUCTS_BEHAVIOR); + } + /** * @return boolean */ @@ -575,11 +602,15 @@ public function getMagentoPlatformVersion() */ public function parseCloudinaryUrl($url, $publicId = null) { + $parsedUrlParts = $this->mbParseUrl($url); + $url = preg_replace('/\?.*/', '', $url); + $parsed = [ "orig_url" => $url, - "scheme" => null, - "host" => null, - "path" => null, + "scheme" => isset($parsedUrlParts["scheme"]) ? $parsedUrlParts["scheme"] : null, + "host" => isset($parsedUrlParts["host"]) ? $parsedUrlParts["host"] : null, + "path" => isset($parsedUrlParts["path"]) ? $parsedUrlParts["path"] : null, + "query" => isset($parsedUrlParts["query"]) ? $parsedUrlParts["query"] : null, "extension" => \pathinfo($url, PATHINFO_EXTENSION), "type" => null, "cloudName" => null, @@ -593,10 +624,6 @@ public function parseCloudinaryUrl($url, $publicId = null) "thumbnail_url" => null, ]; - $parsed["scheme"] = $this->mbParseUrl($url, PHP_URL_SCHEME); - $parsed["host"] = $this->mbParseUrl($url, PHP_URL_HOST); - $parsed["path"] = $this->mbParseUrl($url, PHP_URL_PATH); - $_url = ltrim($parsed["path"], '/'); $_url = preg_replace('/\.[^.]+$/', '', $_url); diff --git a/Model/GraphQLResolver/ProductAttributeCldResolver.php b/Model/GraphQLResolver/ProductAttributeCldResolver.php new file mode 100644 index 00000000..5520e6f1 --- /dev/null +++ b/Model/GraphQLResolver/ProductAttributeCldResolver.php @@ -0,0 +1,42 @@ +productGalleryManagement = $productGalleryManagement; + } + + /** + * @inheritdoc + */ + public function resolve(Field $field, $context, ResolveInfo $info, array $value = null, array $args = null) + { + $productId = $value['sku']; + $productMediaStr = $this->productGalleryManagement->getProductMedia($productId); + $jsonDecoder = new \Magento\Framework\Serialize\Serializer\Json(); + $productMedia = $jsonDecoder->unserialize($productMediaStr); + return $productMedia['data']; + } + } \ No newline at end of file diff --git a/Plugin/Catalog/Block/Product/ImageFactory.php b/Plugin/Catalog/Block/Product/ImageFactory.php index 1feb1bbe..657f3642 100644 --- a/Plugin/Catalog/Block/Product/ImageFactory.php +++ b/Plugin/Catalog/Block/Product/ImageFactory.php @@ -216,10 +216,10 @@ function () use ($imageBlock) { private function createTransformation(array $imageMiscParams) { $dimensions = $this->getDimensions($imageMiscParams); - $transform = $this->configuration->getDefaultTransformation()->withDimensions($dimensions); + $transform = $this->configuration->getDefaultTransformation(true)->withDimensions($dimensions); if (isset($imageMiscParams['keep_frame'])) { - $this->keepFrame = ($imageMiscParams['keep_frame'] === 'frame') ? true : false; + $this->keepFrame = (bool) $imageMiscParams['keep_frame']; } if ($this->keepFrame) { diff --git a/Plugin/Catalog/Model/Product/Image/UrlBuilder.php b/Plugin/Catalog/Model/Product/Image/UrlBuilder.php index 2d38ab4c..60268a0a 100644 --- a/Plugin/Catalog/Model/Product/Image/UrlBuilder.php +++ b/Plugin/Catalog/Model/Product/Image/UrlBuilder.php @@ -179,10 +179,10 @@ private function createTransformation(array $imageMiscParams) $imageMiscParams['image_height'] = (isset($imageMiscParams['image_height'])) ? $imageMiscParams['image_height'] : null; $imageMiscParams['image_width'] = (isset($imageMiscParams['image_width'])) ? $imageMiscParams['image_width'] : null; $dimensions = $this->dimensions ?: Dimensions::fromWidthAndHeight($imageMiscParams['image_width'], $imageMiscParams['image_height']); - $transform = $this->configuration->getDefaultTransformation()->withDimensions($dimensions); + $transform = $this->configuration->getDefaultTransformation(true)->withDimensions($dimensions); if (isset($imageMiscParams['keep_frame'])) { - $this->keepFrame = ($imageMiscParams['keep_frame'] === 'frame') ? true : false; + $this->keepFrame = (bool) $imageMiscParams['keep_frame']; } if ($this->keepFrame) { diff --git a/Ui/DataProvider/Product/Form/Modifier/Product.php b/Ui/DataProvider/Product/Form/Modifier/Product.php index ec2d268e..71b5943c 100644 --- a/Ui/DataProvider/Product/Form/Modifier/Product.php +++ b/Ui/DataProvider/Product/Form/Modifier/Product.php @@ -2,17 +2,17 @@ namespace Cloudinary\Cloudinary\Ui\DataProvider\Product\Form\Modifier; -use Cloudinary\Cloudinary\Core\Image; use Cloudinary\Cloudinary\Core\CloudinaryImageProvider; use Cloudinary\Cloudinary\Core\ConfigurationInterface; +use Cloudinary\Cloudinary\Core\Image; use Cloudinary\Cloudinary\Core\Image\Transformation; use Cloudinary\Cloudinary\Core\Image\Transformation\Freeform; -use Magento\Catalog\Model\Locator\LocatorInterface; -use Magento\Catalog\Ui\DataProvider\Product\Form\Modifier\AbstractModifier; -use Magento\Ui\Component\Form; use Cloudinary\Cloudinary\Model\TransformationFactory; +use Magento\Catalog\Model\Locator\LocatorInterface; use Magento\Catalog\Model\Product\Gallery\Entry; +use Magento\Catalog\Ui\DataProvider\Product\Form\Modifier\AbstractModifier; use Magento\Framework\UrlInterface; +use Magento\Ui\Component\Form; class Product extends AbstractModifier { @@ -102,11 +102,10 @@ public function modifyMeta(array $meta) 'collapsible' => true, 'opened' => false, 'componentType' => Form\Fieldset::NAME, - 'sortOrder' => - $this->getNextGroupSortOrder( - $meta, - static::GROUP_CONTENT, - static::SORT_ORDER + 'sortOrder' => $this->getNextGroupSortOrder( + $meta, + static::GROUP_CONTENT, + static::SORT_ORDER ), ], ], @@ -223,7 +222,7 @@ private function injectImageUrls(array $images) */ private function defaultTransformWithFreeTransform($freeTransform) { - $transformation = $this->configuration->getDefaultTransformation(); + $transformation = $this->configuration->getDefaultTransformation(true); if ($freeTransform) { $transformation->withFreeform(Freeform::fromString($freeTransform)); diff --git a/composer.json b/composer.json index cb537ae0..4b1b87b6 100644 --- a/composer.json +++ b/composer.json @@ -2,7 +2,7 @@ "name": "cloudinary/cloudinary-magento2", "description": "Cloudinary Magento 2 Integration.", "type": "magento2-module", - "version": "1.16.1", + "version": "1.17.0", "license": "MIT", "require": { "cloudinary/cloudinary_php": "^1.20.0" diff --git a/etc/adminhtml/system.xml b/etc/adminhtml/system.xml index af50f581..7ff03b4d 100644 --- a/etc/adminhtml/system.xml +++ b/etc/adminhtml/system.xml @@ -42,7 +42,10 @@ - Automatically upload your existing Magento images to your Cloudinary account when an image is requested by a user. Once enabled, click the button below to map your Magento media directory to your Cloudinary account. + Automatically upload your existing Magento images to your Cloudinary account when an image is requested by a user. Once enabled, click the button below to map your Magento media directory to your Cloudinary account.

+

Note: Disabling auto upload mapping from Magento will not remove the configuration from Cloudinary. To completely disable your auto upload mapping, navigate to your Cloudinary Upload settings and clear the Auto upload mapping that corresponds to your Magento URLs.

]]> +
Magento\Config\Model\Config\Source\Yesno
@@ -84,7 +87,20 @@ Custom transformations will be added to the default image transformations settings chosen above.
For information about the full range of transforms available see the Cloudinary documentation.
You may need to clear or rebuild the Magento block and full page caches to see the changes in the front end.]]>
Cloudinary\Cloudinary\Model\Config\Backend\Free + cloudinary/transformations/cloudinary_free_transform_global +
+ + + for products only.
+ *Set the behavior of this field on the dropdown below.]]>
+ Cloudinary\Cloudinary\Model\Config\Backend\Free + cloudinary/transformations/cloudinary_free_transform_global_products +
+ + + Cloudinary\Cloudinary\Model\Config\Source\Dropdown\FreeTransformBehavior Cloudinary\Cloudinary\Block\Adminhtml\Form\Field\Free + cloudinary/transformations/cloudinary_free_transform_global_products_behavior diff --git a/etc/config.xml b/etc/config.xml index 2a6615ec..14c5437b 100644 --- a/etc/config.xml +++ b/etc/config.xml @@ -7,6 +7,7 @@ 1 auto 2.0 + add 1 diff --git a/etc/module.xml b/etc/module.xml index 9f637331..a4b59f0d 100644 --- a/etc/module.xml +++ b/etc/module.xml @@ -1,6 +1,6 @@ - + diff --git a/etc/schema.graphqls b/etc/schema.graphqls new file mode 100644 index 00000000..8d2e385b --- /dev/null +++ b/etc/schema.graphqls @@ -0,0 +1,12 @@ +type CloudinaryData { + image: String + small_image: String + thumbnail: String + media_gallery: [String] +} + +interface ProductInterface { + cld_data: CloudinaryData + @resolver(class: "\\Cloudinary\\Cloudinary\\Model\\GraphQLResolver\\ProductAttributeCldResolver") + @doc(description: "Cloudinary urls generated for product images") +} \ No newline at end of file diff --git a/marketplace.composer.json b/marketplace.composer.json index 7f77c212..d1f80080 100644 --- a/marketplace.composer.json +++ b/marketplace.composer.json @@ -1,18 +1,18 @@ { - "name": "cloudinary/cloudinary", - "description": "Cloudinary Magento 2 Integration.", - "type": "magento2-module", - "version": "1.16.1", - "license": "MIT", - "require": { - "cloudinary/cloudinary_php": "^1.20.0" - }, - "autoload": { - "files": [ - "registration.php" - ], - "psr-4": { - "Cloudinary\\Cloudinary\\": "" - } + "name": "cloudinary/cloudinary", + "description": "Cloudinary Magento 2 Integration.", + "type": "magento2-module", + "version": "1.17.0", + "license": "MIT", + "require": { + "cloudinary/cloudinary_php": "^1.20.0" + }, + "autoload": { + "files": [ + "registration.php" + ], + "psr-4": { + "Cloudinary\\Cloudinary\\": "" } + } } \ No newline at end of file diff --git a/view/adminhtml/templates/config/free.phtml b/view/adminhtml/templates/config/free.phtml index 95b8ef07..82b49cc6 100644 --- a/view/adminhtml/templates/config/free.phtml +++ b/view/adminhtml/templates/config/free.phtml @@ -18,5 +18,5 @@
", "ajaxKey": "getFormKey() ?>"}}'> + data-mage-init='{"cloudinaryFreeTransform":{"previewButtonId": "#cloudinary_free_transform_preview_button", "transformInputFieldId": "#cloudinary_transformations_cloudinary_free_transform_global", "transformInputProductsFieldId": "#cloudinary_transformations_cloudinary_free_transform_global_products", "transformInputProductsBehaviorFieldId": "#cloudinary_transformations_cloudinary_free_transform_global_products_behavior", "ajaxUrl": "getUrl('cloudinary/ajax_free/sample') ?>", "ajaxKey": "getFormKey() ?>"}}'>
diff --git a/view/adminhtml/ui_component/pagebuilder_base_form_with_background_video.xml b/view/adminhtml/ui_component/pagebuilder_base_form_with_background_video.xml new file mode 100644 index 00000000..2b74c1a5 --- /dev/null +++ b/view/adminhtml/ui_component/pagebuilder_base_form_with_background_video.xml @@ -0,0 +1,18 @@ + + +
+
+ + + + Video URLs can be links to videos on YouTube, Vimeo or Cloudinary, or HTTP(S) links to files with valid video extensions (we recommend .mp4) + + + +
+
diff --git a/view/adminhtml/ui_component/pagebuilder_video_form.xml b/view/adminhtml/ui_component/pagebuilder_video_form.xml index c64340f9..81ef3934 100644 --- a/view/adminhtml/ui_component/pagebuilder_video_form.xml +++ b/view/adminhtml/ui_component/pagebuilder_video_form.xml @@ -6,15 +6,13 @@ */ -->
-
- +
+ - - true - - text - - YouTube, Vimeo and Cloudinary are supported + + Video URLs can be links to videos on YouTube, Vimeo or Cloudinary, or HTTP(S) links to files with valid video extensions (we recommend .mp4) + + Video URLs can be links to videos on YouTube, Vimeo or Cloudinary, or HTTP(S) links to files with valid video extensions (we recommend .mp4)
diff --git a/view/adminhtml/web/css/source/_module.less b/view/adminhtml/web/css/source/_module.less index 642d941f..b3e98a91 100644 --- a/view/adminhtml/web/css/source/_module.less +++ b/view/adminhtml/web/css/source/_module.less @@ -1,5 +1,5 @@ .cloudinary-configuration-tab .admin__page-nav-title strong:before { - background-image: url("Cloudinary_Cloudinary::images/cloudinary_icon_for_white_bg.svg"); + background-image: url("Cloudinary_Cloudinary::images/cloudinary_cloud_glyph_regular.svg"); background-size: contain; background-repeat: no-repeat; background-position: center center; @@ -31,7 +31,7 @@ padding: 6px 14px 6px 50px; &:before { - background-image: url("Cloudinary_Cloudinary::images/cloudinary_icon_for_blue_bg.svg"); + background-image: url("Cloudinary_Cloudinary::images/cloudinary_cloud_glyph_white.svg"); background-repeat: no-repeat; background-size: contain; background-position: center; diff --git a/view/adminhtml/web/js/cloudinary-free.js b/view/adminhtml/web/js/cloudinary-free.js index 374c9b83..e98ed72a 100644 --- a/view/adminhtml/web/js/cloudinary-free.js +++ b/view/adminhtml/web/js/cloudinary-free.js @@ -9,46 +9,60 @@ define( 'cloudinary.cloudinaryFreeTransform', { currentTransform: '', + currentTransformProducts: '', + currentTransformBehavior: '', getTransformText: function() { - return $(this.options.transformInputFieldId).val(); + return $(this.options.transformInputFieldId).val() || ''; }, - getImageHtml: function(src) { - var id = 'cloudinary_custom_transform_preview_image', - style = 'width: auto; height: auto; max-width: 500px; max-height: 500px; min-height: 50px;', + getTransformProductsText: function() { + return $(this.options.transformInputProductsFieldId).val() || ''; + }, + + getTransformBehavior: function() { + return $(this.options.transformInputProductsBehaviorFieldId).val(); + }, + + getImageHtml: function(src, header) { + if (!src) { + return ''; + } + var cls = 'cloudinary_custom_transform_preview_image', + style = 'width: auto; height: auto; max-width: 350px; max-height: 350px; min-height: 50px;', + header = header || '', footer = '

Image size restricted for viewing purposes

'; - return '' + footer; + return header + '' + footer; }, getErrorHtml: function(message) { return '
  • ' + message + '
'; }, - updatePreviewImage: function(url) { - var $image = $('#cloudinary_custom_transform_preview_image'); - - if (!$image.length) { - $('#cloudinary_custom_transform_preview').html(this.getImageHtml(url)); - } else { - $image.attr('src', url); - } + updatePreviewImage: function(url, url2) { + $('#cloudinary_custom_transform_preview').html( + this.getImageHtml(url, '

Global Custom Transformation Preview

') + + this.getImageHtml(url2, '

Products Custom Transformation Preview

') + ); }, updatePreview: function() { - var self = this; + var self = this, + transformations_string = ""; if (!self.isPreviewActive()) { return; } self.currentTransform = self.getTransformText(); + self.currentTransformProducts = self.getTransformProductsText(); + self.currentTransformBehavior = self.getTransformBehavior(); self.setPreviewActiveState(false); $.ajax({ url: this.options.ajaxUrl, data: { - free: self.getTransformText(), + free: self.currentTransform, form_key: self.options.ajaxKey }, type: 'post', @@ -56,7 +70,33 @@ define( showLoader: true }).done( function(response) { - self.updatePreviewImage(response.url); + if ((transformations_string = self.currentTransformProducts)) { + if (self.currentTransformBehavior === 'add') { + transformations_string = self.currentTransform + ',' + transformations_string; + } + var globalResURL = response.url; + $.ajax({ + url: self.options.ajaxUrl, + data: { + free: transformations_string, + form_key: self.options.ajaxKey + }, + type: 'post', + dataType: 'json', + showLoader: true + }).done( + function(response) { + self.updatePreviewImage(globalResURL, response.url); + } + ).fail( + function(result) { + $('#cloudinary_custom_transform_preview').html(self.getErrorHtml(result.responseJSON.error)); + } + ); + } else { + return self.updatePreviewImage(response.url); + transformations_string = self.getTransformText(); + } } ).fail( function(result) { @@ -66,7 +106,14 @@ define( }, setPreviewActiveState: function(state) { - if (state && (this.currentTransform !== this.getTransformText())) { + if ( + state && + ( + this.currentTransform !== this.getTransformText() || + this.currentTransformProducts !== this.getTransformProductsText() || + (this.getTransformProductsText() && this.currentTransformBehavior !== this.getTransformBehavior()) + ) + ) { $(this.options.previewButtonId).removeClass('disabled'); } else { $(this.options.previewButtonId).addClass('disabled'); @@ -92,6 +139,18 @@ define( self.setPreviewActiveState(true); } ); + $(this.options.transformInputProductsFieldId).on( + 'change keydown paste input', + function() { + self.setPreviewActiveState(true); + } + ); + $(this.options.transformInputProductsBehaviorFieldId).on( + 'change', + function() { + self.setPreviewActiveState(true); + } + ); } } diff --git a/view/adminhtml/web/js/cloudinary-media-library-modal.js b/view/adminhtml/web/js/cloudinary-media-library-modal.js index 2377a509..fde8b08e 100644 --- a/view/adminhtml/web/js/cloudinary-media-library-modal.js +++ b/view/adminhtml/web/js/cloudinary-media-library-modal.js @@ -115,7 +115,7 @@ define([ asset.asset_derived_image_url .replace(new RegExp('^.*cloudinary.com/(' + this.options.cloudinaryMLoptions.cloud_name + '/)?' + asset.resource_type + '/' + asset.type + '/'), '') .replace(/\.[^/.]+$/, '') - .replace(new RegExp('\/' + widget.escapeRegex(encodeURI(asset.public_id)) + '$'), '') + .replace(new RegExp('\/' + widget.escapeRegex(encodeURI(decodeURI(asset.public_id))) + '$'), '') .replace(new RegExp('\/v[0-9]{1,10}$'), '') .replace(new RegExp('\/'), ','); if (widget.options.useDerived) { @@ -126,7 +126,7 @@ define([ asset.asset_image_url = asset.asset_url .replace(/\.[^/.]+$/, "") .replace(new RegExp('\/v[0-9]{1,10}\/'), '/') - .replace(new RegExp('\/(' + widget.escapeRegex(encodeURI(asset.public_id)) + ')$'), '/so_auto/$1.jpg'); + .replace(new RegExp('\/(' + widget.escapeRegex(encodeURI(decodeURI(asset.public_id))) + ')$'), '/so_auto/$1.jpg'); } $.ajax({ url: widget.options.imageUploaderUrl, @@ -212,4 +212,4 @@ define([ }); return $.mage.cloudinaryMediaLibraryModal; -}); \ No newline at end of file +}); diff --git a/view/adminhtml/web/js/form/element/validator-rules-mixin.js b/view/adminhtml/web/js/form/element/validator-rules-mixin.js index 445945f4..b33b2233 100644 --- a/view/adminhtml/web/js/form/element/validator-rules-mixin.js +++ b/view/adminhtml/web/js/form/element/validator-rules-mixin.js @@ -20,6 +20,7 @@ define([ } return function(validator) { + validator.addRule( 'validate-video-url', function(href) { @@ -29,10 +30,35 @@ define([ href = (href || '').replace(/^\s+/, '').replace(/\s+$/, ''); - return validateIsUrl(href) && (href.match(/youtube\.com|youtu\.be/) || href.match(/vimeo\.com/) || href.match(/cloudinary\.com/)); + return validateIsUrl(href) && ( + href.match(/youtube\.com|youtu\.be/) || + href.match(/vimeo\.com/) || + href.match(/cloudinary\.com/) || + href.match(/\.(mp4|ogv|webm)(?!\w)/) + ); + }, + $.mage.__('Please enter a valid video URL. Valid URLs have a video file extension (.mp4, .webm, .ogv) or links to videos on YouTube, Vimeo or Cloudinary.')//eslint-disable-line max-len + ); + + validator.addRule( + 'validate-video-source', + function (href) { + if (utils.isEmptyNoTrim(href)) { + return true; + } + + href = (href || '').replace(/^\s+/, '').replace(/\s+$/, ''); + + return validateIsUrl(href) && ( + href.match(/youtube\.com|youtu\.be/) || + href.match(/vimeo\.com/) || + href.match(/cloudinary\.com/) || + href.match(/\.(mp4|ogv|webm)(?!\w)/) + ); }, - $.mage.__('Please enter a valid video URL.') + $.mage.__('Please enter a valid video URL. Valid URLs have a video file extension (.mp4, .webm, .ogv) or links to videos on YouTube, Vimeo or Cloudinary.')//eslint-disable-line max-len ); + return validator; }; -}); \ No newline at end of file +}); diff --git a/view/adminhtml/web/js/get-video-information.js b/view/adminhtml/web/js/get-video-information.js index 9cee8d72..db001c90 100644 --- a/view/adminhtml/web/js/get-video-information.js +++ b/view/adminhtml/web/js/get-video-information.js @@ -110,44 +110,45 @@ define( /** * Abstract play command */ - play: function() { + play: function () { this._player.play(); }, /** * Abstract pause command */ - pause: function() { + pause: function () { this._player.pause(); }, /** * Abstract stop command */ - stop: function() { + stop: function () { this._player.stop(); }, /** * Abstract playing command */ - playing: function() { + playing: function () { return this._player.playing(); }, /** * Abstract destroying command */ - destroy: function() { - this._player.destroy(); + destroy: function () { + if (this._player) { + this._player.destroy(); + } }, /** * Calculates ratio for responsive videos - * * @private */ - _calculateRatio: function() { + _calculateRatio: function () { if (!this._responsive) { return; } @@ -314,43 +315,40 @@ define( } ); - $.widget( - 'mage.videoVimeo', $.mage.productVideoLoader, { + $.widget('mage.videoVimeo', $.mage.productVideoLoader, { - /** - * Initialize the Vimeo widget - * - * @private - */ - _create: function() { - var timestamp, - src, - additionalParams; + /** + * Initialize the Vimeo widget + * @private + */ + _create: function () { + var timestamp, + src, + additionalParams; - this._initialize(); - timestamp = new Date().getTime(); + this._initialize(); + timestamp = new Date().getTime(); - if (this._autoplay) { - additionalParams += '&autoplay=1'; - } + if (this._autoplay) { + additionalParams += '&autoplay=1'; + } - src = 'https://player.vimeo.com/video/' + - this._code + '?api=1&player_id=vimeo' + - this._code + - timestamp + - additionalParams; - this.element.append( - $('