<?xml version="1.0" encoding="UTF-8"?>
<!--
/**
 * @author Amasty Team
 * @copyright Copyright (c) Amasty (https://www.amasty.com)
 * @package Image Optimizer UI for Magento 2 (System)
 */-->

<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
    <argument name="data" xsi:type="array">
        <item name="js_config" xsi:type="array">
            <item name="provider" xsi:type="string">amimageoptimizer_image_form.amimageoptimizer_image_form_data_source</item>
            <item name="deps" xsi:type="string">amimageoptimizer_image_form.amimageoptimizer_image_form_data_source</item>
        </item>
        <item name="config" xsi:type="array">
            <item name="dataScope" xsi:type="string">data</item>
            <item name="namespace" xsi:type="string">amimageoptimizer_image_form_data_source</item>
        </item>
        <item name="label" xsi:type="string" translate="true">Edit Item Reason</item>
        <item name="template" xsi:type="string">templates/form/collapsible</item>
        <item name="buttons" xsi:type="array">
            <item name="back" xsi:type="array">
                <item name="name" xsi:type="string">back</item>
                <item name="label" xsi:type="string" translate="true">Back</item>
                <item name="class" xsi:type="string">back</item>
                <item name="url" xsi:type="string">*/*/</item>
            </item>
            <item name="delete" xsi:type="string">Amasty\ImageOptimizerUi\Block\Adminhtml\Buttons\Image\Delete</item>
            <item name="saveandoptimize" xsi:type="string">Amasty\ImageOptimizerUi\Block\Adminhtml\Buttons\Image\SaveAndOptimize</item>
            <item name="save" xsi:type="array">
                <item name="name" xsi:type="string">save</item>
                <item name="label" xsi:type="string" translate="true">Save</item>
                <item name="class" xsi:type="string">save primary</item>
            </item>
            <item name="save_and_continue" xsi:type="array">
                <item name="name" xsi:type="string">save_and_continue</item>
                <item name="label" xsi:type="string" translate="true">Save and Continue Edit</item>
                <item name="class" xsi:type="string">save_and_continue</item>
            </item>
        </item>
    </argument>
    <dataSource name="amimageoptimizer_image_form.amimageoptimizer_image_form_data_source">
        <argument name="dataProvider" xsi:type="configurableObject">
            <argument name="class" xsi:type="string">Amasty\ImageOptimizerUi\Ui\DataProvider\Image\Form</argument>
            <argument name="name" xsi:type="string">amimageoptimizer_image_form_data_source</argument>
            <argument name="primaryFieldName" xsi:type="string">image_setting_id</argument>
            <argument name="requestFieldName" xsi:type="string">image_setting_id</argument>
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="submit_url" xsi:type="url" path="*/*/save"/>
                </item>
            </argument>
        </argument>
        <argument name="data" xsi:type="array">
            <item name="js_config" xsi:type="array">
                <item name="component" xsi:type="string">Magento_Ui/js/form/provider</item>
            </item>
        </argument>
    </dataSource>
    <fieldset name="general">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="label" xsi:type="string" translate="true">Image Optimization Settings</item>
                <item name="additionalClasses" xsi:type="string">amoptimizer-pattern-form</item>
            </item>
        </argument>
        <container name="comment">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="sortOrder" xsi:type="number">10</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="componentType" xsi:type="string">html</item>
                    <item name="component" xsi:type="string">Amasty_ImageOptimizerUi/js/form/components/comment</item>
                    <item name="template" xsi:type="string">Amasty_ImageOptimizerUi/image-optimization-comment</item>
                    <item name="commands" xsi:type="array">
                        <item name="0" xsi:type="array">
                            <item name="label" xsi:type="string" translate="true">Please note, that it is possible to launch queue generation and optimization with the following CLI command:</item>
                            <item name="code" xsi:type="string">php bin/magento amasty:optimizer:optimize</item>
                        </item>
                        <item name="1" xsi:type="array">
                            <item name="label" xsi:type="string" translate="true">You may also optimize images in bulk using the following command (here 4 is the number of threads):</item>
                            <item name="code" xsi:type="string">bin/magento amasty:optimizer:optimize -j 4</item>
                        </item>
                        <item name="2" xsi:type="array">
                            <item name="label" xsi:type="string" translate="true">Moreover, you can specify the particular pattern (-i is the ID of the pattern):</item>
                            <item name="code" xsi:type="string">bin/magento amasty:optimizer:optimize -j 4 -i 2</item>
                        </item>
                    </item>
                </item>
            </argument>
        </container>
        <field name="is_enabled">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="sortOrder" xsi:type="number">30</item>
                    <item name="label" xsi:type="string" translate="true">Enabled</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="source" xsi:type="string">is_enabled</item>
                    <item name="dataType" xsi:type="string">boolean</item>
                    <item name="formElement" xsi:type="string">checkbox</item>
                    <item name="prefer" xsi:type="string">toggle</item>
                    <item name="valueMap" xsi:type="array">
                        <item name="true" xsi:type="number">1</item>
                        <item name="false" xsi:type="number">0</item>
                    </item>
                    <item name="default" xsi:type="number">1</item>
                </item>
            </argument>
        </field>
        <field name="title">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="sortOrder" xsi:type="number">40</item>
                    <item name="label" xsi:type="string" translate="true">Title</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="dataType" xsi:type="string">text</item>
                    <item name="formElement" xsi:type="string">input</item>
                    <item name="source" xsi:type="string">title</item>
                    <item name="validation" xsi:type="array">
                        <item name="required-entry" xsi:type="boolean">true</item>
                    </item>
                </item>
            </argument>
        </field>
        <field name="folders">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="sortOrder" xsi:type="number">50</item>
                    <item name="label" xsi:type="string" translate="true">Folders for Optimization</item>
                    <item name="dataType" xsi:type="string">text</item>
                    <item name="componentType" xsi:type="string">field</item>
                    <item name="formElement" xsi:type="string">select</item>
                    <item name="component" xsi:type="string">Amasty_ImageOptimizerUi/js/form/element/ui-select</item>
                    <item name="foldersUrl" xsi:type="url" path="amimageoptimizer/image/folders" />
                    <item name="elementTmpl" xsi:type="string">Amasty_ImageOptimizerUi/grid/filters/elements/ui-select</item>
                    <item name="optgroupTmpl" xsi:type="string">Amasty_ImageOptimizerUi/grid/filters/elements/ui-select-optgroup</item>
                    <item name="source" xsi:type="string">folders</item>
                    <item name="breakLine" xsi:type="boolean">true</item>
                    <item name="filterOptions" xsi:type="boolean">true</item>
                    <item name="showCheckbox" xsi:type="boolean">true</item>
                    <item name="disableLabel" xsi:type="boolean">true</item>
                    <item name="multiple" xsi:type="boolean">true</item>
                    <item name="visibleValue" xsi:type="string">3</item>
                    <item name="levelsVisibility" xsi:type="number">0</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="validation" xsi:type="array">
                        <item name="required-entry" xsi:type="boolean">true</item>
                    </item>
                </item>
            </argument>
        </field>
        <field name="is_automatic_optimization">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="sortOrder" xsi:type="number">60</item>
                    <item name="label" xsi:type="string" translate="true">Automatically Optimize Newly Uploaded Images in Folder</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="source" xsi:type="string">is_automatic_optimization</item>
                    <item name="dataType" xsi:type="string">boolean</item>
                    <item name="formElement" xsi:type="string">checkbox</item>
                    <item name="prefer" xsi:type="string">toggle</item>
                    <item name="valueMap" xsi:type="array">
                        <item name="true" xsi:type="number">1</item>
                        <item name="false" xsi:type="number">0</item>
                    </item>
                    <item name="default" xsi:type="number">1</item>
                    <item name="notice" xsi:type="string" translate="true">Enabling the setting will automatically optimize newly uploaded images.</item>
                    <item name="tooltip" xsi:type="array">
                        <item name="description" xsi:type="string" translate="true">For correct work, please make sure that the 'Automatically Optimize Newly Uploaded Images' setting is enabled in the general configuration.</item>
                    </item>
                </item>
            </argument>
        </field>
        <field name="is_automatic_optimization_exist_img" formElement="checkbox" template="Amasty_Base/form/promo-field">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="isPromo" xsi:type="boolean">true</item>
                    <item name="promoLink" xsi:type="string"><![CDATA[https://amasty.com/amcustomer/account/products/?utm_source=extension&utm_medium=backend&utm_campaign=subscribe_imageoptimizer]]></item>
                    <item name="additionalInfo" xsi:type="string"><![CDATA[The functionality is available as a part of an active product subscription or support subscription. To upgrade and obtain functionality, please follow the <a target="_blank" href="https://amasty.com/amcustomer/account/products/?utm_source=extension&utm_medium=backend&utm_campaign=subscribe_imageoptimizer">link</a>. Then you can find the 'amasty/module-optimizer-premium-subscription-functionality' package for installation in composer suggest.]]></item>
                    <item name="label" xsi:type="string" translate="true">Automatically Optimize Existing Images in Folder</item>
                    <item name="dataScope" xsi:type="string">am_image_setting_schedule.is_enabled</item>
                    <item name="sortOrder" xsi:type="number">65</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="dataType" xsi:type="string">boolean</item>
                    <item name="formElement" xsi:type="string">checkbox</item>
                    <item name="prefer" xsi:type="string">toggle</item>
                    <item name="valueMap" xsi:type="array">
                        <item name="true" xsi:type="number">1</item>
                        <item name="false" xsi:type="number">0</item>
                    </item>
                    <item name="default" xsi:type="number">0</item>
                </item>
            </argument>
        </field>
        <field name="is_create_mobile_resolution">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="sortOrder" xsi:type="number">70</item>
                    <item name="label" xsi:type="string" translate="true">Create Image for Mobile</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="source" xsi:type="string">is_create_mobile_resolution</item>
                    <item name="dataType" xsi:type="string">boolean</item>
                    <item name="formElement" xsi:type="string">checkbox</item>
                    <item name="prefer" xsi:type="string">toggle</item>
                    <item name="valueMap" xsi:type="array">
                        <item name="true" xsi:type="number">1</item>
                        <item name="false" xsi:type="number">0</item>
                    </item>
                    <item name="default" xsi:type="number">0</item>
                    <item name="tooltip" xsi:type="array">
                        <item name="description" xsi:type="string" translate="true">When a user uses a mobile or tablet device it's no worth to load a high-resolution image on a small display. Using the feature an image with appropriate size will be uploaded, making the upload process faster and positively impacting the Google rank for mobile.</item>
                    </item>
                </item>
            </argument>
        </field>
        <field name="is_create_tablet_resolution">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="sortOrder" xsi:type="number">80</item>
                    <item name="label" xsi:type="string" translate="true">Create Image for Tablet</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="source" xsi:type="string">is_create_tablet_resolution</item>
                    <item name="dataType" xsi:type="string">boolean</item>
                    <item name="formElement" xsi:type="string">checkbox</item>
                    <item name="prefer" xsi:type="string">toggle</item>
                    <item name="valueMap" xsi:type="array">
                        <item name="true" xsi:type="number">1</item>
                        <item name="false" xsi:type="number">0</item>
                    </item>
                    <item name="default" xsi:type="number">0</item>
                    <item name="notice" xsi:type="string" translate="true">The extension will create a copy of every image in suitable for mobile or tablet size. Please make sure that you have enough disc space on your server.</item>
                    <item name="tooltip" xsi:type="array">
                        <item name="description" xsi:type="string" translate="true">When a user uses a mobile or tablet device it's no worth to load a high-resolution image on a small display. Using the feature an image with appropriate size will be uploaded, making the upload process faster and positively impacting the Google rank for mobile.</item>
                    </item>
                </item>
            </argument>
        </field>
        <field name="resize_algorithm">
            <argument name="data" xsi:type="array">
                <item name="options" xsi:type="object">Amasty\ImageOptimizer\Model\OptionSource\ResizeAlgorithm</item>
                <item name="config" xsi:type="array">
                    <item name="sortOrder" xsi:type="number">90</item>
                    <item name="label" xsi:type="string" translate="true">Resize Algorithm</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="dataType" xsi:type="string">select</item>
                    <item name="formElement" xsi:type="string">select</item>
                    <item name="source" xsi:type="string">resize_algorithm</item>
                    <item name="tooltip" xsi:type="array">
                        <item name="description" xsi:type="string" translate="true">Resize - the image will be resized proportionally to the original size. Simply it will be the same picture, but smaller in pixels. Crop - when cropping a photo, you cut the part of an image changing its width. While the height of the image would be the same. In the result the cropped image will look like the part of the original picture</item>
                    </item>
                </item>
            </argument>
        </field>
        <field name="webp_tool">
            <argument name="data" xsi:type="array">
                <item name="options" xsi:type="object">Amasty\ImageOptimizer\Model\Command\WebpCommandProvider</item>
                <item name="config" xsi:type="array">
                    <item name="sortOrder" xsi:type="number">100</item>
                    <item name="label" xsi:type="string" translate="true">Create Webp Copy</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="dataType" xsi:type="string">select</item>
                    <item name="formElement" xsi:type="string">select</item>
                    <item name="source" xsi:type="string">webp_tool</item>
                    <item name="notice" xsi:type="string" translate="true">When WebP format is used the extension will create a copy for every image in the WebP format. Please make sure that you have enough disc space on your server.</item>
                    <item name="tooltip" xsi:type="array">
                        <item name="description" xsi:type="string" translate="true">WebP is a modern image format that provides superior lossless and lossy compression for images on the web. Using WebP, webmasters and web developers can create smaller, richer images that make the web faster. WebP lossless images are 26% smaller in size compared to PNGs. WebP lossy images are 25-34% smaller than comparable JPEG images at equivalent SSIM quality index.</item>
                    </item>
                </item>
            </argument>
        </field>
        <field name="avif_tool">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="template" xsi:type="string">Amasty_Base/form/promo-field</item>
                    <item name="isPromo" xsi:type="boolean">true</item>
                    <item name="promoLink" xsi:type="string"><![CDATA[https://amasty.com/amcustomer/account/products/?utm_source=extension&utm_medium=backend&utm_campaign=subscribe_pageoptimizer]]></item>
                    <item name="sortOrder" xsi:type="number">95</item>
                    <item name="label" xsi:type="string" translate="true">Create AVIF Copy</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="dataType" xsi:type="string">select</item>
                    <item name="formElement" xsi:type="string">select</item>
                    <item name="source" xsi:type="string">avif_tool</item>
                    <item name="additionalInfo" xsi:type="string"><![CDATA[<span class="admin__field-note">The functionality is available as part of an active product subscription or support subscription. To upgrade and obtain functionality please follow the <a href='https://amasty.com/amcustomer/account/products/?utm_source=extension&utm_medium=backend&utm_campaign=subscribe_pageoptimizer' target='_blank'>link</a>. Than you can find the 'amasty/module-avif-image-optimizer' package for installation in composer suggest.</span>]]></item>
                    <item name="tooltip" xsi:type="array">
                        <item name="description" xsi:type="string" translate="true"><![CDATA[AVIF is a modern image format based on the AV1 video format. AVIF generally has better compression than WebP, JPEG, PNG and GIF and is designed to supersede them. Using AVIF, webmasters and web developers can create smaller, richer images that make the web faster. AVIF is not supported by all browsers, you can see the full list of the supported browsers and read more about this image compression format in the <a href='https://amasty.com/docs/doku.php?id=magento_2:google_page_speed_optimizer#replace_images' target='_blank'>User Guide</a>.]]></item>
                    </item>
                </item>
            </argument>
        </field>
        <field name="is_create_dump">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="sortOrder" xsi:type="number">110</item>
                    <item name="label" xsi:type="string" translate="true">Create Image Dump</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="source" xsi:type="string">is_create_dump</item>
                    <item name="dataType" xsi:type="string">boolean</item>
                    <item name="formElement" xsi:type="string">checkbox</item>
                    <item name="prefer" xsi:type="string">toggle</item>
                    <item name="valueMap" xsi:type="array">
                        <item name="true" xsi:type="number">1</item>
                        <item name="false" xsi:type="number">0</item>
                    </item>
                    <item name="default" xsi:type="number">1</item>
                    <item name="tooltip" xsi:type="array">
                        <item name="description" xsi:type="string" translate="true">Original images will be stored in the ‘pub/media/amasty/amoptimizer_dump’ folder</item>
                    </item>
                </item>
            </argument>
        </field>
        <field name="jpeg_tool">
            <argument name="data" xsi:type="array">
                <item name="options" xsi:type="object">Amasty\ImageOptimizer\Model\Command\JpegCommandProvider</item>
                <item name="config" xsi:type="array">
                    <item name="sortOrder" xsi:type="number">120</item>
                    <item name="label" xsi:type="string" translate="true">JPEG Optimization Tool</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="dataType" xsi:type="string">select</item>
                    <item name="formElement" xsi:type="string">select</item>
                    <item name="source" xsi:type="string">jpeg_tool</item>
                </item>
            </argument>
        </field>
        <field name="jpeg_tool_example">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="sortOrder" xsi:type="number">130</item>
                    <item name="label" xsi:type="boolean">false</item>
                    <item name="visible" xsi:type="boolean">false</item>
                    <item name="formElement" xsi:type="string">container</item>
                    <item name="componentType" xsi:type="string">container</item>
                    <item name="component" xsi:type="string">Amasty_ImageOptimizerUi/js/jpeg-example</item>
                    <item name="elementTmpl" xsi:type="string">Amasty_ImageOptimizerUi/jpeg-optimization-example</item>
                    <item name="template" xsi:type="string">ui/form/field</item>
                    <item name="imports" xsi:type="array">
                        <item name="visible" xsi:type="string">${ $.parentName }.jpeg_tool:value</item>
                        <item name="selectValue" xsi:type="string">${ $.parentName }.jpeg_tool:value</item>
                    </item>
                </item>
            </argument>
        </field>
        <field name="png_tool">
            <argument name="data" xsi:type="array">
                <item name="options" xsi:type="object">Amasty\ImageOptimizer\Model\Command\PngCommandProvider</item>
                <item name="config" xsi:type="array">
                    <item name="sortOrder" xsi:type="number">140</item>
                    <item name="label" xsi:type="string" translate="true">PNG Optimization Tool</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="dataType" xsi:type="string">select</item>
                    <item name="formElement" xsi:type="string">select</item>
                    <item name="source" xsi:type="string">png_tool</item>
                </item>
            </argument>
        </field>
        <field name="gif_tool">
            <argument name="data" xsi:type="array">
                <item name="options" xsi:type="object">Amasty\ImageOptimizer\Model\Command\GifCommandProvider</item>
                <item name="config" xsi:type="array">
                    <item name="sortOrder" xsi:type="number">150</item>
                    <item name="label" xsi:type="string" translate="true">GIF Optimization Tool</item>
                    <item name="visible" xsi:type="boolean">true</item>
                    <item name="dataType" xsi:type="string">select</item>
                    <item name="formElement" xsi:type="string">select</item>
                    <item name="source" xsi:type="string">gif_tool</item>
                </item>
            </argument>
        </field>
    </fieldset>
    <container name="modal">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="componentType" xsi:type="string">modal</item>
                <item name="component" xsi:type="string">Magento_Ui/js/modal/modal-component</item>
                <item name="options" xsi:type="array">
                    <item name="type" xsi:type="string">popup</item>
                    <item name="title" xsi:type="string" translate="true">Images Optimization</item>
                    <item name="buttons" xsi:type="array">
                        <item name="0" xsi:type="array">
                            <item name="text" xsi:type="string" translate="true">Close</item>
                            <item name="actions" xsi:type="array">
                                <item name="0" xsi:type="string">closeModal</item>
                            </item>
                        </item>
                    </item>
                </item>
            </item>
        </argument>
        <container name="optimization">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="componentType" xsi:type="string">container</item>
                    <item name="startUrl" xsi:type="url"  path="*/*/start"/>
                    <item name="processUrl" xsi:type="url"  path="*/*/process"/>
                    <item name="template" xsi:type="string">Amasty_ImageOptimizerUi/image-optimization</item>
                    <item name="component" xsi:type="string">Amasty_ImageOptimizerUi/js/image-optimization</item>
                </item>
            </argument>
        </container>
    </container>
</form>
