12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697 |
- <?php
- /**
- * Copyright © Magento, Inc. All rights reserved.
- * See COPYING.txt for license details.
- */
- // @codingStandardsIgnoreFile
- ?>
- <?php
- /** @var $block \Magento\Theme\Block\Adminhtml\Wysiwyg\Files\Content\Uploader */
- ?>
- <div id="<?= $block->getHtmlId() ?>" class="uploader">
- <span class="fileinput-button form-buttons">
- <span><?= /* @escapeNotVerified */ __('Browse Files') ?></span>
- <input id="fileupload" type="file" name="<?= /* @escapeNotVerified */ $block->getConfig()->getFileField() ?>"
- data-url="<?= /* @escapeNotVerified */ $block->getConfig()->getUrl() ?>" multiple>
- </span>
- <div class="clear"></div>
- <script id="<?= $block->getHtmlId() ?>-template" type="text/x-magento-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>
- <script>
- require([
- 'jquery',
- 'mage/template',
- 'jquery/file-uploader',
- 'domReady!',
- 'mage/translate'
- ], function ($, mageTemplate) {
- $('#fileupload').fileupload({
- dataType: 'json',
- formData: {
- isAjax: 'true',
- form_key: FORM_KEY
- },
- sequentialUploads: true,
- maxFileSize: <?= /* @escapeNotVerified */ $block->getFileSizeService()->getMaxFileSize() ?> ,
- add: function (e, data) {
- var progressTmpl = mageTemplate('#<?= $block->getHtmlId() ?>-template'),
- fileSize,
- tmpl;
- $.each(data.files, function (index, file) {
- fileSize = typeof file.size == "undefined" ?
- $.mage.__('We could not detect a size.') :
- byteConvert(file.size);
- data.fileId = Math.random().toString(36).substr(2, 9);
- tmpl = progressTmpl({
- data: {
- name: file.name,
- size: fileSize,
- id: data.fileId
- }
- });
- $(tmpl).appendTo('#<?= $block->getHtmlId() ?>');
- });
- $(this).fileupload('process', data).done(function () {
- data.submit();
- });
- },
- done: function (e, data) {
- var progressSelector = '#' + data.fileId + ' .progressbar-container .progressbar';
- $(progressSelector).css('width', '100%');
- if (data.result && !data.result.hasOwnProperty('errorcode')) {
- $(progressSelector).removeClass('upload-progress').addClass('upload-success');
- MediabrowserInstance.handleUploadComplete();
- } else {
- $(progressSelector).removeClass('upload-progress').addClass('upload-failure');
- }
- },
- progress: function (e, data) {
- var progress = parseInt(data.loaded / data.total * 100, 10);
- var progressSelector = '#' + data.fileId + ' .progressbar-container .progressbar';
- $(progressSelector).css('width', progress + '%');
- },
- fail: function (e, data) {
- var progressSelector = '#' + data.fileId + ' .progressbar-container .progressbar';
- $(progressSelector).removeClass('upload-progress').addClass('upload-failure');
- }
- });
- });
- </script>
|