@syncfusion/ej2-filemanager 30.1.37 → 30.1.39

package/dist/ts/file-manager/actions/breadcrumb-bar.ts

@@ -1,423 +0,0 @@
-import { EventHandler, closest, isNullOrUndefined, KeyboardEvents, KeyboardEventArgs } from '@syncfusion/ej2-base';
-import { getValue, addClass, removeClass, remove, createElement, DragEventArgs } from '@syncfusion/ej2-base';
-import { TextBox, ChangedEventArgs } from '@syncfusion/ej2-inputs';
-import { IFileManager, NotifyArgs, ReadArgs, FileOpenEventArgs } from '../base/interface';
-import { DropDownButton, MenuEventArgs } from '@syncfusion/ej2-splitbuttons';
-import { read } from '../common/operations';
-import { getLocaleText, searchWordHandler } from '../common/utility';
-import * as events from '../base/constant';
-import * as CLS from '../base/classes';
-import { SearchSettingsModel } from '../models';
-
-/**
- * BreadCrumbBar module
- */
-export class BreadCrumbBar {
-
-    /* Internal variables */
-    private parent: IFileManager;
-    public addressPath: string = '';
-    public addressBarLink: string = '';
-    public searchObj: TextBox;
-    private subMenuObj: DropDownButton;
-    private keyboardModule: KeyboardEvents;
-    private searchTimer: number = null;
-    private keyConfigs: { [key: string]: string };
-    private searchWrapWidth: number = null;
-    /**
-     * constructor for addressbar module
-     *
-     * @hidden
-     * @param {IFileManager} parent - specifies parent element.
-     * @private
-     *
-     */
-    constructor(parent?: IFileManager) {
-        this.parent = parent;
-        this.keyConfigs = {
-            enter: 'enter'
-        };
-        this.render();
-    }
-    private onPropertyChanged(e: NotifyArgs): void {
-        if (e.module !== this.getModuleName() && e.module !== 'common') {
-            return;
-        }
-        for (const prop of Object.keys(e.newProp)) {
-            const value: SearchSettingsModel = e.newProp.searchSettings;
-            switch (prop) {
-            case 'searchSettings':
-                if (!isNullOrUndefined(value.allowSearchOnTyping)) {
-                    this.searchEventBind(value.allowSearchOnTyping);
-                }
-                if (this.parent.breadcrumbbarModule.searchObj.value && this.parent.breadcrumbbarModule.searchObj.value !== '' &&
-                        !(!isNullOrUndefined(value.allowSearchOnTyping) && isNullOrUndefined(value.filterType) &&
-                            isNullOrUndefined(value.ignoreCase))) {
-                    searchWordHandler(this.parent, this.parent.breadcrumbbarModule.searchObj.value, false);
-                }
-                break;
-            }
-        }
-    }
-    private render(): void {
-        this.addEventListener();
-    }
-    public onPathChange(): void {
-        const pathNames: string[] = this.parent.pathNames;
-        const paths: string[] = this.parent.path.split('/');
-        const addressbarUL: HTMLElement = this.parent.createElement('ul', { className: 'e-addressbar-ul' });
-        let addressbarLI: HTMLElement = null;
-        const pathNamesLen: number = pathNames.length;
-        if (pathNames.length > 0) {
-            let id: string = '';
-            for (let i: number = 0; i < pathNamesLen; i++) {
-                let addressATag: HTMLElement = null;
-                addressbarLI = this.parent.createElement('li', { className: 'e-address-list-item' });
-                for (let j: number = 0; j <= i; j++) {
-                    id = id + paths[j as number] + '/';
-                }
-                addressbarLI.setAttribute('data-utext', id);
-                if (i !== 0) {
-                    const icon: HTMLElement = createElement('span', { className: CLS.ICONS });
-                    addressbarLI.appendChild(icon);
-                }
-                if (pathNamesLen - i !== 1) {
-                    addressATag = createElement('a', { className: CLS.LIST_TEXT });
-                    addressbarLI.setAttribute('tabindex', '0');
-                } else {
-                    addressATag = createElement('span', { className: CLS.LIST_TEXT });
-                }
-                id = '';
-                addressATag.innerText = pathNames[i as number];
-                addressbarLI.appendChild(addressATag);
-                addressbarUL.appendChild(addressbarLI);
-            }
-            const ulElement: Element = this.parent.breadCrumbBarNavigation.querySelector('.e-addressbar-ul');
-            if (!isNullOrUndefined(ulElement)) {
-                if (!isNullOrUndefined(this.subMenuObj)) {
-                    this.subMenuObj.destroy();
-                }
-                remove(ulElement);
-            }
-            const searchWrap: Element = this.parent.breadCrumbBarNavigation.querySelector('.e-search-wrap');
-            if (!searchWrap) {
-                this.parent.breadCrumbBarNavigation.insertBefore(addressbarUL, searchWrap);
-            } else {
-                this.parent.breadCrumbBarNavigation.appendChild(addressbarUL);
-            }
-            this.updateBreadCrumbBar(addressbarUL);
-        }
-    }
-    /* istanbul ignore next */
-    private updateBreadCrumbBar(addresBarUL: HTMLElement): void {
-        const liElements: NodeListOf<Element> = addresBarUL.querySelectorAll('li');
-        const ulElement: Element = this.parent.breadCrumbBarNavigation.querySelector('.e-addressbar-ul');
-        const style: CSSStyleDeclaration = window.getComputedStyle(ulElement, null);
-        const pRight: number = parseFloat(style.getPropertyValue('padding-right'));
-        const pLeft: number = parseFloat(style.getPropertyValue('padding-left'));
-        let breadCrumbBarWidth: number = (<HTMLElement>ulElement).offsetWidth - pRight - pLeft;
-        const addressbarUL: HTMLElement = this.parent.createElement('ul', { className: 'e-addressbar-ul' });
-        let liElementsWidth: number = 0;
-        const liElementsWidths: number[] = [];
-        for (let i: number = 0; i < liElements.length; i++) {
-            const width: number = liElements[i as number].clientWidth;
-            liElementsWidths.push(width);
-            liElementsWidth = liElementsWidth + width;
-        }
-        if (!isNullOrUndefined(ulElement)) {
-            remove(ulElement);
-        }
-        const searchContainer: HTMLElement = this.parent.createElement('div');
-        searchContainer.setAttribute('class', 'e-search-wrap');
-        const id: string = this.parent.element.id + CLS.SEARCH_ID;
-        const searchInput: HTMLElement = createElement('input', { id: id,
-            attrs: { autocomplete: 'off', 'aria-label': getLocaleText(this.parent, 'Search') } });
-        searchContainer.appendChild(searchInput);
-        const searchEle: Element = this.parent.breadCrumbBarNavigation.querySelector('.e-search-wrap .e-input');
-        if (isNullOrUndefined(searchEle)) {
-            this.parent.breadCrumbBarNavigation.appendChild(searchContainer);
-            const span: Element = createElement('span', { className: 'e-icons e-fe-search' });
-            EventHandler.add(span, 'click', this.onShowInput, this);
-            searchInput.parentElement.insertBefore(span, searchInput);
-            this.searchObj = new TextBox({
-                value: '',
-                showClearButton: true,
-                placeholder: getLocaleText(this.parent, 'Search'),
-                focus: this.onFocus.bind(this),
-                blur: this.onBlur.bind(this)
-            });
-            this.searchObj.appendTo('#' + this.parent.element.id + CLS.SEARCH_ID);
-            this.searchEventBind(this.parent.searchSettings.allowSearchOnTyping);
-            const search: Element = this.searchObj.element.nextElementSibling;
-            EventHandler.add(search, 'mousedown', this.searchChangeHandler.bind(this), this);
-            EventHandler.add(this.searchObj.element, 'keyup', this.onKeyUp.bind(this), this);
-        }
-        const searchWrap: HTMLElement = this.parent.breadCrumbBarNavigation.querySelector('.e-search-wrap');
-        breadCrumbBarWidth = breadCrumbBarWidth - (this.searchWrapWidth ? this.searchWrapWidth : searchWrap.offsetWidth);
-        if (liElementsWidth > breadCrumbBarWidth) {
-            let i: number = liElements.length;
-            while (i--) {
-                const diff: number = breadCrumbBarWidth - liElementsWidths[i as number];
-                if (diff > 40) {
-                    addressbarUL.insertBefore(liElements[i as number], addressbarUL.querySelector('li'));
-                    breadCrumbBarWidth = diff;
-                } else {
-                    const items: Object[] = [];
-                    for (let j: number = 0; j <= i; j++) {
-                        const liElement: Element = liElements[j as number];
-                        items.push({
-                            text: (<HTMLElement>liElement).innerText,
-                            utext: liElement.getAttribute('data-utext')
-                        });
-                    }
-                    const subMenuLi: HTMLElement = this.parent.createElement('li', { className: 'e-breadcrumb-menu' });
-                    const attributes: Object = { className: 'e-breadcrumb-submenu' };
-                    const subMenuSpan: HTMLElement = this.parent.createElement('button', attributes);
-                    subMenuLi.appendChild(subMenuSpan);
-                    addressbarUL.insertBefore(subMenuLi, addressbarUL.querySelector('li'));
-                    this.subMenuObj = new DropDownButton({
-                        items: items,
-                        cssClass: 'e-caret-hide e-submenu',
-                        iconCss: CLS.ICON_BREADCRUMB,
-                        iconPosition: 'Top',
-                        enableHtmlSanitizer: this.parent.enableHtmlSanitizer,
-                        beforeItemRender: this.addSubMenuAttributes.bind(this),
-                        select: this.subMenuSelectOperations.bind(this)
-                    });
-                    this.subMenuObj.isStringTemplate = true;
-                    this.subMenuObj.appendTo(subMenuSpan);
-                    break;
-                }
-            }
-            this.parent.breadCrumbBarNavigation.insertBefore(addressbarUL, searchWrap);
-        } else {
-            this.parent.breadCrumbBarNavigation.insertBefore(addresBarUL, searchWrap);
-        }
-    }
-    /* istanbul ignore next */
-    private onFocus(): void {
-        const wrap: Element = closest(this.searchObj.element, '.e-search-wrap');
-        wrap.classList.add('e-focus');
-    }
-    /* istanbul ignore next */
-    private onKeyUp(): void {
-        this.parent.notify(events.pathColumn, { args: this.parent });
-    }
-    /* istanbul ignore next */
-    private onBlur(): void {
-        const wrap: Element = closest(this.searchObj.element, '.e-search-wrap');
-        wrap.classList.remove('e-focus');
-    }
-    /* istanbul ignore next */
-    private subMenuSelectOperations(event: MenuEventArgs): void {
-        const args: Object = { target: event.element };
-        this.addressPathClickHandler(<Event>args);
-    }
-    /* istanbul ignore next */
-    private addSubMenuAttributes(args: MenuEventArgs): void {
-        args.element.setAttribute('data-utext', getValue('utext', args.item));
-        const anchor: HTMLElement = this.parent.createElement('a', { className: 'e-list-text' });
-        args.element.appendChild(anchor);
-    }
-    private searchEventBind(allow: boolean): void {
-        if (allow) {
-            this.searchObj.input = this.searchChangeHandler.bind(this);
-            this.searchObj.change = null;
-        } else {
-            this.searchObj.change = this.searchChangeHandler.bind(this);
-            this.searchObj.input = null;
-        }
-    }
-    private searchChangeHandler(args?: ChangedEventArgs): void {
-        if (!isNullOrUndefined(args.value)) {
-            this.parent.isFiltered = false;
-            if (this.parent.searchSettings.allowSearchOnTyping) {
-                window.clearTimeout(this.searchTimer);
-                this.searchTimer = window.setTimeout(() => { searchWordHandler(this.parent, args.value, false); }, 300);
-            } else {
-                searchWordHandler(this.parent, args.value, false);
-            }
-        }
-    }
-    private addressPathClickHandler(e: Event): void {
-        const li: HTMLElement = (<HTMLElement>e.target);
-        if (li.nodeName === 'LI' || li.nodeName === 'A') {
-            const node: Element = li.nodeName === 'LI' ? li.children[0] : li;
-            if (!isNullOrUndefined(node)) {
-                this.parent.isFiltered = false;
-                const currentPath: string = this.updatePath((<HTMLElement>node));
-                this.parent.itemData = [getValue(this.parent.pathId[this.parent.pathId.length - 1], this.parent.feParent)];
-                this.triggerFileOpen(this.parent.itemData[0]);
-                read(this.parent, events.pathChanged, currentPath);
-                const treeNodeId: string = this.parent.pathId[this.parent.pathId.length - 1];
-                this.parent.notify(events.updateTreeSelection, { module: 'treeview', selectedNode: treeNodeId });
-            }
-        }
-    }
-
-    private triggerFileOpen(data: Object): void {
-        const eventArgs: FileOpenEventArgs = { cancel: false, fileDetails: data, module: 'BreadCrumbBar' };
-        delete eventArgs.cancel;
-        this.parent.trigger('fileOpen', eventArgs);
-    }
-
-    /* istanbul ignore next */
-    private onShowInput(): void {
-        if (this.parent.isMobile) {
-            if (this.parent.element.classList.contains(CLS.FILTER)) {
-                removeClass([this.parent.element], CLS.FILTER);
-                this.searchWrapWidth = null;
-            } else {
-                const searchWrap: HTMLElement = this.parent.breadCrumbBarNavigation.querySelector('.e-search-wrap');
-                this.searchWrapWidth = searchWrap.offsetWidth;
-                addClass([this.parent.element], CLS.FILTER);
-                this.searchObj.element.focus();
-            }
-        }
-    }
-
-    private updatePath(list: HTMLElement): string {
-        const li: Element = closest(list, 'li');
-        const liElementId: string = li.getAttribute('data-utext');
-        this.addressBarLink = liElementId;
-        const link: string[] = this.addressBarLink.split('/');
-        const ids: string[] = this.parent.pathId;
-        const names: string[] = this.parent.pathNames;
-        this.parent.pathId = [];
-        this.parent.pathNames = [];
-        let newpath: string = '';
-        for (let i: number = 0, len: number = link.length - 1; i < len; i++) {
-            this.parent.pathId.push(ids[i as number]);
-            this.parent.pathNames.push(names[i as number]);
-            newpath += link[i as number] + '/';
-        }
-        this.parent.setProperties({ path: newpath }, true);
-        return newpath;
-    }
-
-    private onUpdatePath(): void {
-        this.onPathChange();
-        this.removeSearchValue();
-    }
-
-    private onCreateEnd(): void {
-        this.onPathChange();
-    }
-
-    private onRenameEnd(): void {
-        this.onPathChange();
-    }
-
-    /* istanbul ignore next */
-    private onDeleteEnd(): void {
-        this.onUpdatePath();
-    }
-
-    /* istanbul ignore next */
-    private removeSearchValue(): void {
-        this.parent.isFiltered = false;
-        if (this.searchObj && (this.searchObj.value !== '' || this.searchObj.element.value !== '')) {
-            this.searchObj.value = '';
-            this.searchObj.element.value = '';
-            this.searchObj.dataBind();
-        }
-    }
-
-    private onResize(): void {
-        this.onPathChange();
-    }
-    private onPasteEnd(): void {
-        this.onPathChange();
-    }
-
-    private addEventListener(): void {
-        this.keyboardModule = new KeyboardEvents(
-            this.parent.breadCrumbBarNavigation,
-            {
-                keyAction: this.keyActionHandler.bind(this),
-                keyConfigs: this.keyConfigs,
-                eventName: 'keydown'
-            }
-        );
-        this.parent.on(events.modelChanged, this.onPropertyChanged, this);
-        EventHandler.add(this.parent.breadCrumbBarNavigation, 'click', this.addressPathClickHandler, this);
-        this.parent.on(events.destroy, this.destroy, this);
-        this.parent.on(events.pathChanged, this.onUpdatePath, this);
-        this.parent.on(events.finalizeEnd, this.onUpdatePath, this);
-        this.parent.on(events.refreshEnd, this.onUpdatePath, this);
-        this.parent.on(events.openEnd, this.onUpdatePath, this);
-        this.parent.on(events.createEnd, this.onCreateEnd, this);
-        this.parent.on(events.renameEnd, this.onRenameEnd, this);
-        this.parent.on(events.deleteEnd, this.onDeleteEnd, this);
-        this.parent.on(events.splitterResize, this.onResize, this);
-        this.parent.on(events.pasteEnd, this.onPasteEnd, this);
-        this.parent.on(events.resizeEnd, this.onResize, this);
-        this.parent.on(events.searchTextChange, this.onSearchTextChange, this);
-        this.parent.on(events.dropInit, this.onDropInit, this);
-        this.parent.on(events.layoutRefresh, this.onResize, this);
-        this.parent.on(events.dropPath, this.onPathChange, this);
-    }
-
-    private keyActionHandler(e: KeyboardEventArgs): void {
-        switch (e.action) {
-        case 'enter':
-            this.addressPathClickHandler(e);
-            break;
-        }
-    }
-    private removeEventListener(): void {
-        this.keyboardModule.destroy();
-        this.parent.off(events.pathChanged, this.onUpdatePath);
-        this.parent.off(events.finalizeEnd, this.onUpdatePath);
-        this.parent.off(events.refreshEnd, this.onUpdatePath);
-        this.parent.off(events.openEnd, this.onUpdatePath);
-        this.parent.off(events.pasteEnd, this.onPasteEnd);
-        this.parent.off(events.createEnd, this.onCreateEnd);
-        this.parent.off(events.renameEnd, this.onRenameEnd);
-        this.parent.off(events.deleteEnd, this.onDeleteEnd);
-        this.parent.off(events.splitterResize, this.onResize);
-        this.parent.off(events.resizeEnd, this.onResize);
-        this.parent.off(events.searchTextChange, this.onSearchTextChange);
-        this.parent.off(events.dropInit, this.onDropInit);
-        this.parent.off(events.layoutRefresh, this.onResize);
-        this.parent.off(events.dropPath, this.onPathChange);
-    }
-
-    /* istanbul ignore next */
-    private onDropInit(args: DragEventArgs): void {
-        if (this.parent.targetModule === this.getModuleName()) {
-            const liEle: Element = args.target.closest('li');
-            this.parent.dropPath = this.updatePath(<HTMLElement>(liEle.children[0]));
-            this.parent.dropData = getValue(this.parent.pathId[this.parent.pathId.length - 1], this.parent.feParent);
-            this.triggerFileOpen(this.parent.dropData);
-            const treeNodeId: string = this.parent.pathId[this.parent.pathId.length - 1];
-            this.parent.notify(events.updateTreeSelection, { module: 'treeview', selectedNode: treeNodeId });
-        }
-    }
-
-    /**
-     * For internal use only - Get the module name.
-     *
-     * @returns {string} - returns the module name
-     * @private
-     */
-    private getModuleName(): string {
-        return 'breadcrumbbar';
-    }
-
-    public destroy(): void {
-        if (this.parent.isDestroyed) { return; }
-        this.removeEventListener();
-        /* istanbul ignore next */
-        if (!isNullOrUndefined(this.subMenuObj)) {
-            this.subMenuObj.destroy();
-        }
-        if (!isNullOrUndefined(this.searchObj)) {
-            this.searchObj.destroy();
-        }
-    }
-
-    private onSearchTextChange(args: ReadArgs): void {
-        this.searchObj.element.placeholder = (this.parent.searchSettings.placeholder != null) ? this.parent.searchSettings.placeholder : getLocaleText(this.parent, 'Search') + ' ' + getLocaleText(this.parent, args.cwd.name.toString());
-    }
-}

package/dist/ts/file-manager/actions/index.d.ts

@@ -1,6 +0,0 @@
-/**
- * File Manager actions modules
- */
-export * from './toolbar';
-export * from './breadcrumb-bar';
-export * from './virtualization';

package/dist/ts/file-manager/actions/index.ts

@@ -1,6 +0,0 @@
-/**
- * File Manager actions modules
- */
-export * from './toolbar';
-export * from './breadcrumb-bar';
-export * from './virtualization';

package/dist/ts/file-manager/actions/toolbar.d.ts

@@ -1,54 +0,0 @@
-import { Toolbar as BaseToolbar } from '@syncfusion/ej2-navigations';
-import { IFileManager } from '../base/interface';
-/**
- * Toolbar module
- */
-export declare class Toolbar {
-    private parent;
-    private items;
-    private buttonObj;
-    private layoutBtnObj;
-    private default;
-    private single;
-    private multiple;
-    private selection;
-    toolbarObj: BaseToolbar;
-    /**
-     * Constructor for the Toolbar module
-     *
-     * @hidden
-     * @param {IFileManager} parent - specifies the parent element.
-     * @private
-     */
-    constructor(parent?: IFileManager);
-    private render;
-    getItemIndex(item: string): number;
-    private getItems;
-    private onClicked;
-    private toolbarCreateHandler;
-    private updateSortByButton;
-    private getPupupId;
-    private layoutChange;
-    private toolbarItemData;
-    private getItemModel;
-    private getId;
-    private addEventListener;
-    private reRenderToolbar;
-    private onSelectionChanged;
-    private hideItems;
-    private hideStatus;
-    private showPaste;
-    private hidePaste;
-    private onLayoutChange;
-    private removeEventListener;
-    /**
-     * For internal use only - Get the module name.
-     *
-     * @returns {string} - returns module name.
-     * @private
-     */
-    private getModuleName;
-    private onPropertyChanged;
-    destroy(): void;
-    enableItems(items: string[], isEnable?: boolean): void;
-}