first upload all files

2023-06-11 13:14:03 +01:00
parent f14dbc52b5
commit c08b36d1b6
1705 changed files with 106852 additions and 0 deletions
--- a/Modules/Media/Resources/assets/admin/js/MediaPicker.js
+++ b/Modules/Media/Resources/assets/admin/js/MediaPicker.js
@@ -0,0 +1,120 @@
+import '../sass/media-picker.scss';
+
+export default class {
+    constructor(options) {
+        this.options = _.merge({
+            type: null,
+            multiple: false,
+            route: 'admin.file_manager.index',
+            title: trans('media::media.file_manager.title'),
+            message: trans('media::messages.image_has_been_added'),
+        }, options);
+
+        this.events = {};
+        this.frame = this.getFrame();
+
+        this.appendModalToBody();
+        this.openFrame();
+    }
+
+    on(event, handler) {
+        this.events[event] = handler;
+    }
+
+    getFrame() {
+        let src = route(this.options.route, {
+            type: this.options.type,
+            multiple: this.options.multiple,
+        });
+
+        return $(`<iframe class="file-manager-iframe" frameborder="0" src="${src}"></iframe>`);
+    }
+
+    appendModalToBody() {
+        if ($('.media-picker-modal').length === 1) {
+            return;
+        }
+
+        $('body').append(this.getModal());
+    }
+
+    openFrame() {
+        this.showModal();
+
+        this.frame.on('load', () => {
+            this.selectMedia();
+        });
+    }
+
+    showModal() {
+        let modal = $('.media-picker-modal').modal('show');
+
+        this.setFrameHeight();
+        this.setModalTitle(modal);
+        this.setModalBody(modal);
+        this.closeModalOnEsc(modal);
+    }
+
+    setFrameHeight() {
+        this.frame.css('height', window.innerHeight * 0.8);
+    }
+
+    setModalTitle(modal) {
+        modal.find('.modal-title').text(this.options.title);
+    }
+
+    setModalBody(modal) {
+        modal.find('.modal-body').html(this.frame);
+    }
+
+    closeModalOnEsc(modal) {
+        $(document).on('keydown', (e) => {
+            if (e.keyCode === 27) {
+                modal.modal('hide');
+            }
+        });
+
+        this.frame.on('load keydown', () => {
+            this.frame.contents().on('keydown', (e) => {
+                if (e.keyCode === 27) {
+                    modal.modal('hide');
+                }
+            });
+        });
+    }
+
+    selectMedia() {
+        this.frame.contents().find('.table').on('click', '.select-media', (e) => {
+            e.preventDefault();
+
+            this.events['select'](e.currentTarget.dataset);
+
+            if (this.options.multiple) {
+                if (this.options.message) {
+                    notify('success', this.options.message, { context: this.frame.contents() });
+                }
+            } else {
+                $('.media-picker-modal').modal('hide');
+            }
+        });
+    }
+
+    getModal() {
+        return `
+            <div class="media-picker-modal modal fade" role="dialog">
+                <div class="modal-dialog clearfix">
+                    <div class="modal-content col-md-10 col-sm-11 clearfix">
+                        <div class="row">
+                            <div class="modal-header">
+                                <a type="button" class="close" data-dismiss="modal">&times;</a>
+                                <h4 class="modal-title"></h4>
+                            </div>
+
+                            <div class="modal-body"></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        `;
+    }
+}