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

// phpcs:disable PHPCompatibility.Miscellaneous.RemovedAlternativePHPTags.MaybeASPOpenTagFound
/** @var $block \Magento\Backend\Block\Media\Uploader */
/** @var \Magento\Framework\Escaper $escaper */
?>

<div id="<?= $block->getHtmlId() ?>" 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() ?>
        }
    }'
>
    <div class="fileinput-button form-buttons button">
        <span><?= $escaper->escapeHtml(__('Browse Files...')) ?></span>
        <div id="fileUploader" data-url="<?= $escaper->escapeHtmlAttr($block->getConfig()->getUrl()) ?>"></div>
    </div>
    <div class="clear"></div>
    <script id="<?= $block->getHtmlId() ?>-template" type="text/x-magento-template" data-template="uploader">
        <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>

