VLEX/BPM-UI/node_modules/devextreme/ui/file_manager/ui.file_manager.js

/**
 * DevExtreme (ui/file_manager/ui.file_manager.js)
 * Version: 19.1.16
 * Build date: Tue Oct 18 2022
 *
 * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
 * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
 */
"use strict";

function _typeof(obj) {
    "@babel/helpers - typeof";
    return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(obj) {
        return typeof obj
    } : function(obj) {
        return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj
    }, _typeof(obj)
}
var _renderer = require("../../core/renderer");
var _renderer2 = _interopRequireDefault(_renderer);
var _events_engine = require("../../events/core/events_engine");
var _events_engine2 = _interopRequireDefault(_events_engine);
var _extend = require("../../core/utils/extend");
var _type = require("../../core/utils/type");
var _type2 = _interopRequireDefault(_type);
var _deferred = require("../../core/utils/deferred");
var _component_registrator = require("../../core/component_registrator");
var _component_registrator2 = _interopRequireDefault(_component_registrator);
var _ui = require("../widget/ui.widget");
var _ui2 = _interopRequireDefault(_ui);
var _notify = require("../notify");
var _notify2 = _interopRequireDefault(_notify);
var _uiFile_manager = require("./ui.file_manager.command_manager");
var _uiFile_manager2 = require("./ui.file_manager.context_menu");
var _uiFile_manager3 = _interopRequireDefault(_uiFile_manager2);
var _uiFile_manager4 = require("./ui.file_manager.files_tree_view");
var _uiFile_manager5 = _interopRequireDefault(_uiFile_manager4);
var _uiFile_managerItem_list = require("./ui.file_manager.item_list.details");
var _uiFile_managerItem_list2 = _interopRequireDefault(_uiFile_managerItem_list);
var _uiFile_managerItem_list3 = require("./ui.file_manager.item_list.thumbnails");
var _uiFile_managerItem_list4 = _interopRequireDefault(_uiFile_managerItem_list3);
var _uiFile_manager6 = require("./ui.file_manager.toolbar");
var _uiFile_manager7 = _interopRequireDefault(_uiFile_manager6);
var _uiFile_manager8 = require("./ui.file_manager.editing");
var _uiFile_manager9 = _interopRequireDefault(_uiFile_manager8);
var _uiFile_manager10 = require("./ui.file_manager.breadcrumbs");
var _uiFile_manager11 = _interopRequireDefault(_uiFile_manager10);
var _uiFile_manager12 = require("./ui.file_manager.adaptivity");
var _uiFile_manager13 = _interopRequireDefault(_uiFile_manager12);
var _uiFile_manager14 = require("./ui.file_manager.utils");
var _file_provider = require("./file_provider/file_provider");
var _array = require("./file_provider/array");
var _array2 = _interopRequireDefault(_array);
var _ajax = require("./file_provider/ajax");
var _ajax2 = _interopRequireDefault(_ajax);
var _onedrive = require("./file_provider/onedrive");
var _onedrive2 = _interopRequireDefault(_onedrive);
var _webapi = require("./file_provider/webapi");
var _webapi2 = _interopRequireDefault(_webapi);

function _interopRequireDefault(obj) {
    return obj && obj.__esModule ? obj : {
        "default": obj
    }
}

function _classCallCheck(instance, Constructor) {
    if (!(instance instanceof Constructor)) {
        throw new TypeError("Cannot call a class as a function")
    }
}

function _defineProperties(target, props) {
    for (var i = 0; i < props.length; i++) {
        var descriptor = props[i];
        descriptor.enumerable = descriptor.enumerable || false;
        descriptor.configurable = true;
        if ("value" in descriptor) {
            descriptor.writable = true
        }
        Object.defineProperty(target, descriptor.key, descriptor)
    }
}

function _createClass(Constructor, protoProps, staticProps) {
    if (protoProps) {
        _defineProperties(Constructor.prototype, protoProps)
    }
    if (staticProps) {
        _defineProperties(Constructor, staticProps)
    }
    Object.defineProperty(Constructor, "prototype", {
        writable: false
    });
    return Constructor
}

function _get() {
    if ("undefined" !== typeof Reflect && Reflect.get) {
        _get = Reflect.get.bind()
    } else {
        _get = function(target, property, receiver) {
            var base = _superPropBase(target, property);
            if (!base) {
                return
            }
            var desc = Object.getOwnPropertyDescriptor(base, property);
            if (desc.get) {
                return desc.get.call(arguments.length < 3 ? target : receiver)
            }
            return desc.value
        }
    }
    return _get.apply(this, arguments)
}

function _superPropBase(object, property) {
    while (!Object.prototype.hasOwnProperty.call(object, property)) {
        object = _getPrototypeOf(object);
        if (null === object) {
            break
        }
    }
    return object
}

function _inherits(subClass, superClass) {
    if ("function" !== typeof superClass && null !== superClass) {
        throw new TypeError("Super expression must either be null or a function")
    }
    subClass.prototype = Object.create(superClass && superClass.prototype, {
        constructor: {
            value: subClass,
            writable: true,
            configurable: true
        }
    });
    Object.defineProperty(subClass, "prototype", {
        writable: false
    });
    if (superClass) {
        _setPrototypeOf(subClass, superClass)
    }
}

function _setPrototypeOf(o, p) {
    _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(o, p) {
        o.__proto__ = p;
        return o
    };
    return _setPrototypeOf(o, p)
}

function _createSuper(Derived) {
    var hasNativeReflectConstruct = _isNativeReflectConstruct();
    return function() {
        var result, Super = _getPrototypeOf(Derived);
        if (hasNativeReflectConstruct) {
            var NewTarget = _getPrototypeOf(this).constructor;
            result = Reflect.construct(Super, arguments, NewTarget)
        } else {
            result = Super.apply(this, arguments)
        }
        return _possibleConstructorReturn(this, result)
    }
}

function _possibleConstructorReturn(self, call) {
    if (call && ("object" === _typeof(call) || "function" === typeof call)) {
        return call
    } else {
        if (void 0 !== call) {
            throw new TypeError("Derived constructors may only return object or undefined")
        }
    }
    return _assertThisInitialized(self)
}

function _assertThisInitialized(self) {
    if (void 0 === self) {
        throw new ReferenceError("this hasn't been initialised - super() hasn't been called")
    }
    return self
}

function _isNativeReflectConstruct() {
    if ("undefined" === typeof Reflect || !Reflect.construct) {
        return false
    }
    if (Reflect.construct.sham) {
        return false
    }
    if ("function" === typeof Proxy) {
        return true
    }
    try {
        Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {}));
        return true
    } catch (e) {
        return false
    }
}

function _getPrototypeOf(o) {
    _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function(o) {
        return o.__proto__ || Object.getPrototypeOf(o)
    };
    return _getPrototypeOf(o)
}
var FILE_MANAGER_CLASS = "dx-filemanager";
var FILE_MANAGER_CONTAINER_CLASS = FILE_MANAGER_CLASS + "-container";
var FILE_MANAGER_DIRS_PANEL_CLASS = FILE_MANAGER_CLASS + "-dirs-panel";
var FILE_MANAGER_INACTIVE_AREA_CLASS = FILE_MANAGER_CLASS + "-inactive-area";
var FILE_MANAGER_EDITING_CONTAINER_CLASS = FILE_MANAGER_CLASS + "-editing-container";
var FILE_MANAGER_ITEMS_PANEL_CLASS = FILE_MANAGER_CLASS + "-items-panel";
var FILE_MANAGER_ITEM_CUSTOM_THUMBNAIL_CLASS = FILE_MANAGER_CLASS + "-item-custom-thumbnail";
var FileManager = function(_Widget) {
    _inherits(FileManager, _Widget);
    var _super = _createSuper(FileManager);

    function FileManager() {
        _classCallCheck(this, FileManager);
        return _super.apply(this, arguments)
    }
    _createClass(FileManager, [{
        key: "_initTemplates",
        value: function() {}
    }, {
        key: "_initMarkup",
        value: function() {
            _get(_getPrototypeOf(FileManager.prototype), "_initMarkup", this).call(this);
            this._onSelectedFileOpenedAction = this._createActionByOption("onSelectedFileOpened");
            this._provider = this._getFileProvider();
            this._currentFolder = null;
            this._commandManager = new _uiFile_manager.FileManagerCommandManager(this.option("permissions"));
            this.$element().addClass(FILE_MANAGER_CLASS);
            var $toolbar = (0, _renderer2.default)("<div>").appendTo(this.$element());
            this._toolbar = this._createComponent($toolbar, _uiFile_manager7.default, {
                commandManager: this._commandManager,
                itemViewMode: this.option("itemView").mode
            });
            this._createAdaptivityControl();
            this._createEditing();
            this._initCommandManager();
            this._setItemsViewAreaActive(false)
        }
    }, {
        key: "_createAdaptivityControl",
        value: function() {
            var _this = this;
            var $container = (0, _renderer2.default)("<div>").addClass(FILE_MANAGER_CONTAINER_CLASS).appendTo(this.$element());
            this._adaptivityControl = this._createComponent($container, _uiFile_manager13.default, {
                drawerTemplate: function(container) {
                    return _this._createFilesTreeView(container)
                },
                contentTemplate: function(container) {
                    return _this._createItemsPanel(container)
                },
                onAdaptiveStateChanged: function(e) {
                    return _this._onAdaptiveStateChanged(e)
                }
            })
        }
    }, {
        key: "_createEditing",
        value: function() {
            var _this2 = this;
            var $editingContainer = (0, _renderer2.default)("<div>").addClass(FILE_MANAGER_EDITING_CONTAINER_CLASS).appendTo(this.$element());
            this._editing = this._createComponent($editingContainer, _uiFile_manager9.default, {
                model: {
                    provider: this._provider,
                    getFolders: this._getFilesTreeViewItems.bind(this),
                    getCurrentFolder: this.getCurrentFolder.bind(this),
                    getMultipleSelectedItems: this._getMultipleSelectedItems.bind(this)
                },
                onSuccess: function(_ref) {
                    var message = _ref.message,
                        updatedOnlyFiles = _ref.updatedOnlyFiles;
                    _this2._showSuccess(message);
                    _this2._refreshData(updatedOnlyFiles)
                },
                onError: function(_ref2) {
                    var message = _ref2.message;
                    return _this2._showError(message)
                },
                onCreating: function() {
                    return _this2._setItemsViewAreaActive(false)
                }
            })
        }
    }, {
        key: "_createItemsPanel",
        value: function($container) {
            this._$itemsPanel = (0, _renderer2.default)("<div>").addClass(FILE_MANAGER_ITEMS_PANEL_CLASS).appendTo($container);
            this._createBreadcrumbs(this._$itemsPanel);
            this._createItemView(this._$itemsPanel)
        }
    }, {
        key: "_createFilesTreeView",
        value: function(container) {
            var _this3 = this;
            var $filesTreeView = (0, _renderer2.default)("<div>").addClass(FILE_MANAGER_DIRS_PANEL_CLASS).appendTo(container);
            this._filesTreeView = this._createComponent($filesTreeView, _uiFile_manager5.default, {
                contextMenu: this._createContextMenu(),
                getItems: this._getFilesTreeViewItems.bind(this),
                onCurrentFolderChanged: this._onFilesTreeViewCurrentFolderChanged.bind(this),
                onClick: function() {
                    return _this3._setItemsViewAreaActive(false)
                }
            })
        }
    }, {
        key: "_createItemView",
        value: function($container, viewMode) {
            var _this4 = this;
            var itemViewOptions = this.option("itemView");
            var options = {
                selectionMode: this.option("selectionMode"),
                contextMenu: this._createContextMenu(),
                getItems: this._getItemViewItems.bind(this),
                onError: function(_ref3) {
                    var error = _ref3.error;
                    return _this4._showError(error)
                },
                onSelectionChanged: this._onItemViewSelectionChanged.bind(this),
                onSelectedItemOpened: this._onSelectedItemOpened.bind(this),
                onSelectedFileOpened: this._createActionByOption("onSelectedFileOpened"),
                getItemThumbnail: this._getItemThumbnailInfo.bind(this),
                customizeDetailColumns: this.option("customizeDetailColumns")
            };
            var $itemView = (0, _renderer2.default)("<div>").appendTo($container);
            viewMode = viewMode || itemViewOptions.mode;
            var widgetClass = "thumbnails" === viewMode ? _uiFile_managerItem_list4.default : _uiFile_managerItem_list2.default;
            this._itemView = this._createComponent($itemView, widgetClass, options);
            _events_engine2.default.on($itemView, "click", this._onItemViewClick.bind(this))
        }
    }, {
        key: "_createBreadcrumbs",
        value: function($container) {
            var _this5 = this;
            var $breadcrumbs = (0, _renderer2.default)("<div>").appendTo($container);
            this._breadcrumbs = this._createComponent($breadcrumbs, _uiFile_manager11.default, {
                path: "",
                onPathChanged: function(e) {
                    return _this5.setCurrentFolderPath(e.newPath)
                },
                onOutsideClick: function() {
                    return _this5._clearSelection()
                }
            })
        }
    }, {
        key: "_createContextMenu",
        value: function() {
            var $contextMenu = (0, _renderer2.default)("<div>").appendTo(this.$element());
            return this._createComponent($contextMenu, _uiFile_manager3.default, {
                commandManager: this._commandManager
            })
        }
    }, {
        key: "_initCommandManager",
        value: function() {
            var _this6 = this;
            var actions = (0, _extend.extend)(this._editing.getCommandActions(), {
                refresh: function() {
                    return _this6._refreshData()
                },
                thumbnails: function() {
                    return _this6._switchView("thumbnails")
                },
                details: function() {
                    return _this6._switchView("details")
                },
                clear: function() {
                    return _this6._clearSelection()
                },
                showDirsPanel: function() {
                    return _this6._adaptivityControl.toggleDrawer()
                }
            });
            this._commandManager.registerActions(actions)
        }
    }, {
        key: "_onFilesTreeViewCurrentFolderChanged",
        value: function(e) {
            this.setCurrentFolder(this._filesTreeView.getCurrentFolder())
        }
    }, {
        key: "_onItemViewSelectionChanged",
        value: function() {
            this._updateToolbar()
        }
    }, {
        key: "_onAdaptiveStateChanged",
        value: function(_ref4) {
            var enabled = _ref4.enabled;
            this._commandManager.setCommandEnabled("showDirsPanel", enabled);
            this._updateToolbar()
        }
    }, {
        key: "_updateToolbar",
        value: function() {
            var items = this.getSelectedItems();
            this._toolbar.update(items)
        }
    }, {
        key: "_setItemsViewAreaActive",
        value: function(active) {
            if (this._itemsViewAreaActive === active) {
                return
            }
            this._itemsViewAreaActive = active;
            var $activeArea = null;
            var $inactiveArea = null;
            if (active) {
                $activeArea = this._itemView.$element();
                $inactiveArea = this._filesTreeView.$element()
            } else {
                $activeArea = this._filesTreeView.$element();
                $inactiveArea = this._itemView.$element()
            }
            $activeArea.removeClass(FILE_MANAGER_INACTIVE_AREA_CLASS);
            $inactiveArea.addClass(FILE_MANAGER_INACTIVE_AREA_CLASS);
            if (!active) {
                this._clearSelection()
            }
        }
    }, {
        key: "_tryOpen",
        value: function(item) {
            if (!item) {
                var items = this.getSelectedItems();
                if (items.length > 0) {
                    item = items[0]
                }
            }
            if (!item || !item.isDirectory) {
                return
            }
            var folder = item.createClone();
            if (item.isParentFolder) {
                folder.name = (0, _uiFile_manager14.getName)(item.relativeName);
                folder.relativeName = item.relativeName
            }
            this.setCurrentFolder(folder)
        }
    }, {
        key: "_switchView",
        value: function(viewMode) {
            this._disposeWidget(this._itemView.option("contextMenu"));
            this._disposeWidget(this._itemView);
            this._createItemView(this._$itemsPanel, viewMode)
        }
    }, {
        key: "_disposeWidget",
        value: function(widget) {
            widget.dispose();
            widget.$element().remove()
        }
    }, {
        key: "_clearSelection",
        value: function() {
            this._itemView.clearSelection()
        }
    }, {
        key: "_getMultipleSelectedItems",
        value: function() {
            return this._itemsViewAreaActive ? this.getSelectedItems() : [this.getCurrentFolder()]
        }
    }, {
        key: "_showSuccess",
        value: function(message) {
            this._showNotification(message, true)
        }
    }, {
        key: "_showError",
        value: function(message) {
            this._showNotification(message, false)
        }
    }, {
        key: "_showNotification",
        value: function(message, isSuccess) {
            (0, _notify2.default)({
                message: message,
                width: 450
            }, isSuccess ? "success" : "error", 5e3)
        }
    }, {
        key: "_loadItemViewData",
        value: function() {
            this._itemView.refreshData()
        }
    }, {
        key: "_refreshData",
        value: function(onlyItems) {
            if (!onlyItems) {
                this._filesTreeView.refreshData()
            }
            this._loadItemViewData()
        }
    }, {
        key: "_getFilesTreeViewItems",
        value: function(parent) {
            var path = parent ? parent.relativeName : "";
            return this._provider.getFolders(path)
        }
    }, {
        key: "_getItemViewItems",
        value: function() {
            var path = this.getCurrentFolderPath();
            if (null === path) {
                return (new _deferred.Deferred).promise()
            }
            var options = this.option("itemView");
            var itemType = options.showFolders ? "" : "file";
            var result = this._provider.getItems(path, itemType);
            if (options.showParentFolder && path) {
                var parentPath = (0, _uiFile_manager14.getParentPath)(path);
                var parentFolder = this._createFolderItemByPath(parentPath);
                parentFolder.isParentFolder = true;
                parentFolder.name = "..";
                result = (0, _deferred.when)(result).done(function(items) {
                    return items.unshift(parentFolder)
                })
            }
            return result
        }
    }, {
        key: "_onItemViewClick",
        value: function() {
            this._setItemsViewAreaActive(true)
        }
    }, {
        key: "_getFileProvider",
        value: function() {
            var fileProvider = this.option("fileProvider");
            if (!fileProvider) {
                fileProvider = []
            }
            if (Array.isArray(fileProvider)) {
                return new _array2.default({
                    data: fileProvider
                })
            }
            if ("string" === typeof fileProvider) {
                return new _ajax2.default({
                    url: fileProvider
                })
            }
            if (fileProvider instanceof _file_provider.FileProvider) {
                return fileProvider
            }
            if (fileProvider.type) {
                switch (fileProvider.type) {
                    case "webapi":
                        return new _webapi2.default(fileProvider);
                    case "onedrive":
                        return new _onedrive2.default(fileProvider)
                }
            }
            return new _array2.default(fileProvider)
        }
    }, {
        key: "_getItemThumbnailInfo",
        value: function(item) {
            var func = this.option("customizeThumbnail");
            var thumbnail = _type2.default.isFunction(func) ? func(item) : item.thumbnail;
            if (thumbnail) {
                return {
                    thumbnail: thumbnail,
                    cssClass: FILE_MANAGER_ITEM_CUSTOM_THUMBNAIL_CLASS
                }
            }
            return {
                thumbnail: this._getPredefinedThumbnail(item)
            }
        }
    }, {
        key: "_getPredefinedThumbnail",
        value: function(item) {
            if (item.isDirectory) {
                return "folder"
            }
            var extension = item.getExtension();
            switch (extension) {
                case ".txt":
                    return "doc";
                case ".rtf":
                case ".doc":
                case ".docx":
                case ".odt":
                    return "doc";
                case ".xls":
                case ".xlsx":
                case ".ods":
                    return "exportxlsx";
                case ".ppt":
                case ".pptx":
                case ".odp":
                    return "doc";
                case ".pdf":
                    return "exportpdf";
                case ".png":
                case ".gif":
                case ".jpg":
                case ".jpeg":
                case ".ico":
                case ".bmp":
                    return "image";
                default:
                    return "doc"
            }
        }
    }, {
        key: "_createFolderItemByPath",
        value: function(path) {
            var parentPath = (0, _uiFile_manager14.getParentPath)(path);
            var name = (0, _uiFile_manager14.getName)(path);
            return new _file_provider.FileManagerItem(parentPath, name, true)
        }
    }, {
        key: "_getDefaultOptions",
        value: function() {
            return (0, _extend.extend)(_get(_getPrototypeOf(FileManager.prototype), "_getDefaultOptions", this).call(this), {
                fileProvider: null,
                selectionMode: "multiple",
                itemView: {
                    mode: "details",
                    showFolders: true,
                    showParentFolder: true
                },
                customizeThumbnail: null,
                customizeDetailColumns: null,
                onSelectedFileOpened: null,
                permissions: {
                    create: false,
                    copy: false,
                    move: false,
                    remove: false,
                    rename: false,
                    upload: false
                }
            })
        }
    }, {
        key: "_optionChanged",
        value: function(args) {
            var name = args.name;
            switch (name) {
                case "fileProvider":
                case "selectionMode":
                case "itemView":
                case "customizeThumbnail":
                case "customizeDetailColumns":
                case "permissions":
                    this.repaint();
                    break;
                case "onSelectedFileOpened":
                    this._onSelectedFileOpenedAction = this._createActionByOption("onSelectedFileOpened");
                    break;
                default:
                    _get(_getPrototypeOf(FileManager.prototype), "_optionChanged", this).call(this, args)
            }
        }
    }, {
        key: "executeCommand",
        value: function(commandName) {
            this._commandManager.executeCommand(commandName)
        }
    }, {
        key: "setCurrentFolderPath",
        value: function(path) {
            var folder = this._createFolderItemByPath(path);
            this.setCurrentFolder(folder)
        }
    }, {
        key: "getCurrentFolderPath",
        value: function() {
            return this.getCurrentFolder() ? this.getCurrentFolder().relativeName : null
        }
    }, {
        key: "setCurrentFolder",
        value: function(folder) {
            var newPath = folder ? folder.relativeName : null;
            if (newPath === this.getCurrentFolderPath()) {
                return
            }
            this._currentFolder = folder;
            this._filesTreeView.setCurrentFolderPath(newPath);
            this._loadItemViewData();
            this._breadcrumbs.option("path", newPath || "")
        }
    }, {
        key: "getCurrentFolder",
        value: function() {
            return this._currentFolder
        }
    }, {
        key: "getSelectedItems",
        value: function() {
            return this._itemView.getSelectedItems()
        }
    }, {
        key: "_onSelectedItemOpened",
        value: function(_ref5) {
            var item = _ref5.item;
            if (!item.isDirectory) {
                this._onSelectedFileOpenedAction({
                    fileItem: item
                })
            }
            this._tryOpen(item)
        }
    }]);
    return FileManager
}(_ui2.default);
(0, _component_registrator2.default)("dxFileManager", FileManager);
module.exports = FileManager;