<?php
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */

// phpcs:disable PHPCompatibility.Miscellaneous.RemovedAlternativePHPTags.MaybeASPOpenTagFound
/** @var $block \Magento\Cms\Block\Adminhtml\Wysiwyg\Images\Content\Uploader */
/** @var \Magento\Framework\Escaper $escaper */

$blockHtmlId = $block->getHtmlId();
?>

<div id="<?= /* @noEscape */ $blockHtmlId ?>" class="uploader"
     data-mage-init='{
        "Magento_Backend/js/media-uploader" : {
            "maxFileSize": <?= /* @noEscape */ $block->getFileSizeService()->getMaxFileSize() ?>,
            "maxWidth": <?= /* @noEscape */ $block->getImageUploadMaxWidth() ?>,
            "maxHeight": <?= /* @noEscape */ $block->getImageUploadMaxHeight() ?>,
            "isResizeEnabled": <?= /* @noEscape */ $block->getImageUploadConfigData()->getIsResizeEnabled() ?>
        }
    }'
>
    <span class="fileinput-button form-buttons">
        <span><?= $escaper->escapeHtml(__('Upload Images')) ?></span>
            <button id="fileUploader"
                name="<?= $escaper->escapeHtmlAttr($block->getConfig()->getFileField()) ?>"
                value="Upload Images"
                data-url="<?= $escaper->escapeUrl($block->getConfig()->getUrl()) ?>"
            ><?= $escaper->escapeHtml(__('Upload Images')) ?></button>
    </span>
    <div class="clear"></div>
    <script type="text/x-magento-template" id="<?= /* @noEscape */ $blockHtmlId ?>-template">
        <div id="<%- data.id %>" class="file-row">
            <span class="file-info"><%- data.name %> (<%- data.size %>)</span>
            <div class="progressbar-container">
                <div class="progressbar upload-progress" style="width: 0%;"></div>
            </div>
            <div class="clear"></div>
        </div>
    </script>
</div>
