ntk-cms-filemanager
Version:
Ntk Cms Api And Model For Typscript
1,977 lines • 139 kB
JavaScript
import * as i0 from '@angular/core';
import { Injectable, Input, Component, EventEmitter, Output, TemplateRef, ContentChild, ViewEncapsulation, Inject, ViewChild, Pipe, NgModule } from '@angular/core';
import { Subject, Observable, of, forkJoin, timer } from 'rxjs';
import { map, distinctUntilChanged, first, catchError, delay } from 'rxjs/operators';
import * as i1 from '@angular/common/http';
import { HttpParams, HttpRequest, HttpEventType, HttpClient, provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
import * as i3 from 'ntk-cms-api';
import { FileCategoryModel, FileContentModel, FileContentService, FileCategoryService } from 'ntk-cms-api';
import * as i4 from 'ngx-ntk-smart-module';
import { NtkSmartModalModule } from 'ngx-ntk-smart-module';
import * as i1$1 from '@ngx-translate/core';
import { TranslateService, TranslateModule } from '@ngx-translate/core';
import * as i3$1 from '@angular/common';
import { CommonModule } from '@angular/common';
import { __decorate, __param } from 'tslib';
import * as i3$2 from 'ngx-ntk-file-picker';
import { FilePickerAdapter, UploadStatus, FilePickerModule } from 'ngx-ntk-file-picker';
class ComponentOptionModel {
}
class TreeModel {
constructor(config) {
// this._currentPath = config.startingFolder; // todo implement (config.interfce.ts)
this._currentPath = '';
this.config = config;
this.nodes = {
id: 0,
pathToNode: '',
pathToParent: null,
isFolder: true,
isExpanded: true,
stayOpen: true,
name: 'root',
children: {},
isRoot: true
};
}
get currentPath() {
return this._currentPath;
}
set currentPath(value) {
this._currentPath = value;
}
get nodes() {
return this._nodes;
}
set nodes(value) {
this._nodes = value;
}
get selectedNodeId() {
return this._selectedNodeId;
}
set selectedNodeId(value) {
this._selectedNodeId = value;
}
}
var DownloadModeEnum;
(function (DownloadModeEnum) {
DownloadModeEnum[DownloadModeEnum["DOWNLOAD_DISABLED"] = 0] = "DOWNLOAD_DISABLED";
DownloadModeEnum[DownloadModeEnum["DOWNLOAD_FILES"] = 1] = "DOWNLOAD_FILES";
DownloadModeEnum[DownloadModeEnum["DOWNLOAD_ALL"] = 2] = "DOWNLOAD_ALL";
})(DownloadModeEnum || (DownloadModeEnum = {}));
const initialState = {
path: '',
isLoading: true,
selectedNode: null,
inProcessingList: []
};
class FileManagerStoreService {
constructor() {
this.sub = new Subject();
this.state = {
fileManagerState: initialState
};
// @ts-ignore
window.getInfo = () => this.state;
}
dispatch(param) {
Object.assign(this.state.fileManagerState, stateReducer(this.state.fileManagerState, param));
this.sub.next(this.state);
// if (isDevMode()) console.warn('[FileManagerStoreService] dispatch', param, JSON.parse(JSON.stringify(this.state)));
}
getState(mapFn) {
if (typeof mapFn !== 'function') {
throw new TypeError('argument is not a function. Are you looking for `mapTo()`?');
}
return this.sub.asObservable()
.pipe(map(mapFn))
.pipe(distinctUntilChanged());
}
processStart(name) {
if (this.state?.fileManagerState?.inProcessingList) {
const index = this.state.fileManagerState.inProcessingList.indexOf(name);
if (index < 0) {
// console.log('processStart 1', this.state.fileManagerState.inProcessingList);
const list = [...this.state.fileManagerState.inProcessingList];
list.push(name);
// console.log('processStart 2', this.state.fileManagerState.inProcessingList);
this.dispatch({ type: SET_IN_PROCESSING_LIST, payload: list });
}
}
}
processStop(name) {
if (this.state?.fileManagerState?.inProcessingList) {
const index = this.state.fileManagerState.inProcessingList.indexOf(name);
if (index >= 0) {
// console.log('processStop 1', this.state.fileManagerState.inProcessingList);
const list = [...this.state.fileManagerState.inProcessingList];
list.splice(index, 1);
// console.log('processStop 2', this.state.fileManagerState.inProcessingList);
this.dispatch({ type: SET_IN_PROCESSING_LIST, payload: list });
}
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: FileManagerStoreService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: FileManagerStoreService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: FileManagerStoreService, decorators: [{
type: Injectable
}], ctorParameters: () => [] });
// REDUCERS
function stateReducer(state = initialState, action) {
switch (action.type) {
case SET_PATH:
if (action.payload === '/') {
action.payload = '';
}
if (state.path === action.payload) {
return state;
}
return { ...state, path: action.payload, isLoading: true };
case SET_LOADING_STATE:
return { ...state, isLoading: action.payload };
case SET_IN_PROCESSING_LIST:
return { ...state, inProcessingList: action.payload };
case SET_SELECTED_NODE:
return { ...state, selectedNode: action.payload };
default:
return initialState;
}
}
const SET_PATH = 'SET_PATH';
const SET_LOADING_STATE = 'SET_LOADING_STATE';
const SET_IN_PROCESSING_LIST = 'SET_IN_PROCESSING_LIST';
const SET_SELECTED_NODE = 'SET_SELECTED_NODE';
class SetPath {
constructor() {
this.type = SET_PATH;
}
}
class SetLoadingState {
constructor() {
this.type = SET_LOADING_STATE;
}
}
class SetInProcessingList {
constructor() {
this.type = SET_IN_PROCESSING_LIST;
}
}
class SetSelectedNode {
constructor() {
this.type = SET_SELECTED_NODE;
}
}
/*
{
size: string // e.g. '3 KB'
url?: string // download url
id: string | number; // id can be path or database id
dir: bool // is current node dir?
path: string // path to current item (e.g. /folder1/someFile.txt)
name?: string // optional (but we are using id as name if name is not present) (e.g. someFile.txt)
}
https://github.com/Chiff/ng6-file-man-express/blob/master/index.js
*/
// @Injectable({
// providedIn: 'root'
// })
class NodeService {
constructor(http, store, fileContentService, fileCategoryService) {
this.http = http;
this.store = store;
this.fileContentService = fileContentService;
this.fileCategoryService = fileCategoryService;
/** GUID */
this.guid = '';
/** GUID */
this.guid = this.newGuid();
/** GUID */
// console.log('NodeService Constructor:', this.guid);
}
S4() {
const ran = (1 + Math.random()) * 0x10000;
return (ran | 0).toString(16).substring(1);
}
newGuid() {
const isString = `${this.S4()}${this.S4()}-${this.S4()}-${this.S4()}-${this.S4()}-${this.S4()}${this.S4()}${this.S4()}`;
return isString;
}
/** GUID */
// todo ask server to get parent structure
startManagerAt(path) {
this.currentPath = path;
this.refreshCurrentPath();
}
refreshCurrentPath_orginal() {
this.findNodeByPath_orginal(this.currentPath).children = {};
this.getNodes_orginal(this.currentPath).then(() => {
this.store.dispatch({ type: SET_SELECTED_NODE, payload: this.serviceTree.nodes });
this.store.dispatch({ type: SET_PATH, payload: this.currentPath });
});
}
refreshCurrentPath() {
this.findNodeByPath(this.currentPath).children = {};
this.getNodes(this.currentPath).then(() => {
this.store.dispatch({ type: SET_SELECTED_NODE, payload: this.serviceTree.nodes });
this.store.dispatch({ type: SET_PATH, payload: this.currentPath });
});
}
getNodes_orginal(path) {
return new Promise((resolve => {
this.parseNodes_orginal(path).subscribe((data) => {
for (let i = 0; i < data.length; i++) {
const parentPath = this.getParentPath(data[i].pathToNode);
this.findNodeByPath_orginal(parentPath).children[data[i].name] = data[i];
}
resolve(null);
});
}));
}
getNodes(path) {
//console.log('getNodes Run:', this.guid);
const prosses = 'getNodes';
this.store.processStart(prosses);
return new Promise((resolve => {
this.parseNodes(path).subscribe((data) => {
for (let i = 0; i < data.length; i++) {
const parentPath = this.getParentPath(data[i].pathToNode);
this.findNodeByPath(parentPath).children[data[i].id] = data[i];
}
this.store.processStop(prosses);
resolve(null);
});
}));
}
getParentPath_orginal(path) {
let parentPath = path.split('/');
parentPath = parentPath.slice(0, parentPath.length - 1);
return parentPath.join('/');
}
getParentPath(path) {
let parentPath = path.split('/');
parentPath = parentPath.slice(0, parentPath.length - 1);
return parentPath.join('/');
}
parseNodes_orginal(path) {
return new Observable(observer => {
this.getNodesFromServer_orginal(path).subscribe((data) => {
observer.next(data.map(node => this.createNode_orginal(path, node)));
this.store.dispatch({ type: SET_LOADING_STATE, payload: false });
});
});
}
parseNodes(path) {
return new Observable(observer => {
this.getNodesFromServer(path).subscribe((data) => {
observer.next(data.map(node => this.createNode(path, node)));
this.store.dispatch({ type: SET_LOADING_STATE, payload: false });
});
});
}
createNode_orginal(path, node) {
if (node.path[0] !== '/') {
console.warn('[Node Service] Server should return initial path with "/"');
node.path = '/' + node.path;
}
const ids = node.path.split('/');
if (ids.length > 2 && ids[ids.length - 1] === '') {
ids.splice(-1, 1);
node.path = ids.join('/');
}
const cachedNode = this.findNodeByPath_orginal(node.path);
return {
id: node.id,
isFolder: node.dir,
isExpanded: cachedNode ? cachedNode.isExpanded : false,
pathToNode: node.path,
pathToParent: this.getParentPath_orginal(node.path),
name: node.name || node.id,
children: cachedNode ? cachedNode.children : {}
};
}
createNode(path, node) {
// if (node.parentId && node.parentId > 0) {
// console.warn('[Node Service] Server should return initial path with "/"');
// node.pathToNode = '/' + node.pathToNode;
// }
const ids = node.pathToNode.split('/');
if (ids.length > 2 && ids[ids.length - 1] === '') {
ids.splice(-1, 1);
node.pathToNode = ids.join('/');
}
const cachedNode = this.findNodeByPath(node.pathToNode);
const pathToParentVar = this.getParentPath(node.pathToNode);
// node.isExpanded = cachedNode ? cachedNode.isExpanded : false;
// node.pathToParent = pathToParentVar;
// node.children = cachedNode ? cachedNode.children : {};
// node.name = node.name ? node.name : node.id + '';
// return node;
return {
id: node.id,
isFolder: node.isFolder,
isExpanded: cachedNode ? cachedNode.isExpanded : false,
pathToNode: node.pathToNode,
pathToParent: pathToParentVar,
name: node.name || node.id,
children: cachedNode ? cachedNode.children : {},
createdDate: node.createdDate,
updatedDate: node.updatedDate,
size: node.size,
extension: node.extension,
downloadLinksrc: node.downloadLinksrc,
downloadThumbnailSrc: node.downloadThumbnailSrc,
};
}
getNodesFromServer_orginal(path) {
let folderId = this.findNodeByPath_orginal(path).id;
folderId = folderId === 0 ? '' : folderId;
return this.http.get(this.serviceTree.config.baseURL + this.serviceTree.config.api.listFile, { params: new HttpParams().set('parentPath', folderId) });
}
getNodesFromServer(path) {
this.store.dispatch({ type: SET_LOADING_STATE, payload: true });
const findN = this.findNodeByPath(path);
const folderId = findN ? findN.id : 0;
// folderId = folderId === 0 ? '' : folderId;
const retOut = new Observable(observer => {
return this.getCategoryList(folderId, path).subscribe(xCat => {
return this.getFileList(folderId, path).subscribe((xfile => {
xfile = xfile.concat(xCat);
observer.next(xfile);
}));
});
});
return retOut;
}
findNodeByPath_orginal(nodePath) {
const ids = nodePath.split('/');
ids.splice(0, 1);
return ids.length === 0 ? this.serviceTree.nodes : ids.reduce((value, index) => value.children[index], this.serviceTree.nodes);
}
findNodeByPath(nodePath) {
const ids = nodePath.split('/');
ids.splice(0, 1);
if (ids.length === 0) {
return this.serviceTree.nodes;
}
const retOut = ids.reduce((value, index) => value.children[index], this.serviceTree.nodes);
return retOut;
}
findNodeById_orginal(id) {
const result = this.findNodeByIdHelper_orginal(id);
if (result === null) {
console.warn('[Node Service] Cannot find node by id. Id not existing or not fetched. Returning root.');
return this.serviceTree.nodes;
}
return result;
}
findNodeById(id) {
const result = this.findNodeByIdHelper(id);
if (result === null) {
console.warn('[Node Service] Cannot find node by id. Id not existing or not fetched. Returning root.');
return this.serviceTree.nodes;
}
return result;
}
findNodeByIdHelper_orginal(id, node = this.serviceTree.nodes) {
if (node.id === id) {
return node;
}
const keys = Object.keys(node.children);
for (let i = 0; i < keys.length; i++) {
if (typeof node.children[keys[i]] === 'object') {
const obj = this.findNodeByIdHelper_orginal(id, node.children[keys[i]]);
if (obj != null) {
return obj;
}
}
}
return null;
}
findNodeByIdHelper(id, node = this.serviceTree.nodes) {
if (node.id === id) {
return node;
}
const keys = Object.keys(node.children);
for (let i = 0; i < keys.length; i++) {
if (typeof node.children[keys[i]] === 'object') {
const obj = this.findNodeByIdHelper(id, node.children[keys[i]]);
if (obj != null) {
return obj;
}
}
}
return null;
}
foldRecursively_orginal(node) {
// console.log('folding ', node);
const children = node.children;
Object.keys(children).map((child) => {
if (!children.hasOwnProperty(child) || !children[child].isExpanded) {
return null;
}
this.foldRecursively_orginal(children[child]);
// todo put this getElById into one func (curr inside node.component.ts + fm.component.ts) - this won't be maintainable
document.getElementById('tree_' + children[child].pathToNode).classList.add('deselected');
children[child].isExpanded = false;
});
}
foldRecursively(node) {
// console.log('folding ', node);
const children = node.children;
Object.keys(children).map((child) => {
if (!children.hasOwnProperty(child) || !children[child].isExpanded) {
return null;
}
this.foldRecursively(children[child]);
// todo put this getElById into one func (curr inside node.component.ts + fm.component.ts) - this won't be maintainable
document.getElementById('tree_' + children[child].pathToNode).classList.add('deselected');
children[child].isExpanded = false;
});
}
foldAll_orginal() {
this.foldRecursively_orginal(this.serviceTree.nodes);
}
foldAll(refresh = false) {
if (refresh) {
this.refreshCurrentPath();
// this.foldRecursively(this.serviceTree.nodes);
}
else {
this.foldRecursively(this.serviceTree.nodes);
}
}
get currentPath() {
return this.privatePath;
}
set currentPath(value) {
this.privatePath = value;
}
getCategoryList(folderId, path) {
return this.fileCategoryService.ServiceGetAllInCategoryById(folderId).pipe(map((x) => {
const retList = [];
x.listItems.forEach(element => {
const item = {
name: element.title,
isRoot: true,
id: element.id,
parentId: element.linkParentId ? element.linkParentId : null,
pathToNode: path + '/' + element.id,
pathToParent: '',
isFolder: true,
isExpanded: false,
createdDate: element.createdDate,
updatedDate: element.updatedDate,
downloadLinksrc: element.linkMainImageIdSrc,
};
item.pathToNode = '/' + item.pathToNode;
item.pathToNode = item.pathToNode.replace('//', '/');
// if (retList.length < 4) {
retList.push(item);
// }
});
return retList;
}));
}
getFileList(folderId, path) {
return this.fileContentService.ServiceGetAllInCategoryById(folderId).pipe(map((x) => {
const retList = [];
x.listItems.forEach(element => {
const item = {
name: element.fileName,
isRoot: false,
id: element.id,
parentId: element.linkCategoryId ? element.linkCategoryId : null,
pathToNode: path + '/' + element.id,
pathToParent: '',
isFolder: false,
isExpanded: false,
createdDate: element.createdDate,
updatedDate: element.updatedDate,
downloadLinksrc: element.downloadLinksrc,
downloadThumbnailSrc: element.downloadThumbnailSrc,
size: element.fileSize,
extension: element.extension
};
item.pathToNode = '/' + item.pathToNode;
item.pathToNode = item.pathToNode.replace('//', '/');
// if (retList.length < 2) {
retList.push(item);
// }
});
return retList;
}));
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NodeService, deps: [{ token: i1.HttpClient }, { token: FileManagerStoreService }, { token: i3.FileContentService }, { token: i3.FileCategoryService }], target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NodeService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NodeService, decorators: [{
type: Injectable
}], ctorParameters: () => [{ type: i1.HttpClient }, { type: FileManagerStoreService }, { type: i3.FileContentService }, { type: i3.FileCategoryService }] });
class NodeClickedService {
constructor(ngxSmartModalService, nodeService, store, http, fileContentService, fileCategoryService) {
this.ngxSmartModalService = ngxSmartModalService;
this.nodeService = nodeService;
this.store = store;
this.http = http;
this.fileContentService = fileContentService;
this.fileCategoryService = fileCategoryService;
}
startDownload_orginal(node) {
const parameters = new HttpParams().append('path', node.id + '');
this.reachServer('download', this.serviceTree.config.api.downloadFile, parameters);
}
startDownload(node) {
window.open(node.downloadLinksrc, '_blank');
}
initDelete_orginal(node) {
this.sideEffectHelper('Delete', new HttpParams().append('path', node.id + ''), 'delete', this.serviceTree.config.api.deleteFile, () => this.successWithSideViewClose());
}
initDelete(node) {
const prosses = 'initDelete';
this.store.processStart(prosses);
if (node.isFolder) {
this.fileCategoryService.ServiceDelete(node.id).subscribe((next) => {
if (next.isSuccess) {
this.successWithSideViewClose();
}
else {
this.actionFailed('Delete Folder Error', next.errorMessage);
}
this.store.processStop(prosses);
}, (error) => {
this.actionFailed('Delete Folder Error', error);
this.store.processStop(prosses);
});
}
else {
this.fileContentService.ServiceDelete(node.id).subscribe((next) => {
if (next.isSuccess) {
this.successWithSideViewClose();
}
else {
this.actionFailed('Delete File Error', next.errorMessage);
}
this.store.processStop(prosses);
}, (error) => {
this.actionFailed('Delete File Error', error);
this.store.processStop(prosses);
});
}
}
searchForString_orginal(input) {
this.sideEffectHelper('Search', new HttpParams().append('query', input), 'get', this.serviceTree.config.api.searchFiles, (res) => this.searchSuccess(input, res));
}
searchForString(input) {
}
createFolder_orginal(currentParent, newDirName) {
this.sideEffectHelper('Create Folder', (() => {
let httpParams = new HttpParams().append('dirName', newDirName);
if (currentParent !== 0) {
httpParams = httpParams.append('parentPath', currentParent + '');
}
console.log(currentParent, httpParams.get('dirName'), httpParams.get('parentPath'));
return httpParams;
})(), 'post', this.serviceTree.config.api.createFolder);
}
createFolder(currentParent, newDirName) {
const model = new FileCategoryModel();
model.title = newDirName;
if (currentParent > 0) {
model.linkParentId = currentParent;
}
const prosses = 'createFolder';
this.store.processStart(prosses);
this.fileCategoryService.ServiceAdd(model).subscribe((next) => {
if (next.isSuccess) {
this.successWithSideViewClose();
}
else {
this.actionFailed('Create Folder Error', next.errorMessage);
}
this.store.processStop(prosses);
}, (error) => {
this.actionFailed('Create Folder Error', error);
this.store.processStop(prosses);
});
}
createFile(currentParent, fileName, uploadFileGUID, successMethod, failMethod) {
const model = new FileContentModel();
model.fileName = fileName;
model.uploadFileGUID = uploadFileGUID;
if (currentParent > 0) {
model.linkCategoryId = currentParent;
}
const prosses = 'createFile';
this.store.processStart(prosses);
this.fileContentService.ServiceAdd(model).subscribe((next) => {
if (next.isSuccess) {
this.successWithSideViewClose();
if (successMethod) {
successMethod(next);
}
}
else {
this.actionFailed('Create File Error', next.errorMessage);
}
this.store.processStop(prosses);
}, (error) => {
this.actionFailed('Create File Error', error);
if (failMethod) {
failMethod(error);
}
this.store.processStop(prosses);
});
}
rename_orginal(node, newName) {
this.sideEffectHelper('Rename', new HttpParams().append('path', node.id + '').append('newName', newName), 'post', this.serviceTree.config.api.renameFile, () => this.successWithSideViewClose());
}
rename(node, newName) {
const prosses = 'rename';
this.store.processStart(prosses);
if (node.isFolder) {
this.fileCategoryService.ServiceGetOneById(node.id).subscribe((next) => {
if (next.isSuccess) {
next.item.title = newName;
/** update */
this.fileCategoryService.ServiceEdit(next.item).subscribe((next2) => {
if (next2.isSuccess) {
this.successWithSideViewClose();
}
else {
this.actionFailed('rename Folder Error', next.errorMessage);
}
this.store.processStop(prosses);
}, (error) => {
this.actionFailed('rename Folder Error', error);
this.store.processStop(prosses);
});
/** update */
}
else {
this.actionFailed('rename Folder Error', next.errorMessage);
this.store.processStop(prosses);
}
}, (error) => {
this.actionFailed('rename Folder Error', error);
this.store.processStop(prosses);
});
}
else {
this.fileContentService.ServiceGetOneById(node.id).subscribe((next) => {
if (next.isSuccess) {
next.item.fileName = newName;
/** update */
this.fileContentService.ServiceEdit(next.item).subscribe((next2) => {
if (next2.isSuccess) {
this.successWithSideViewClose();
}
else {
this.actionFailed('rename File Error', next.errorMessage);
}
this.store.processStop(prosses);
}, (error) => {
this.actionFailed('rename File Error', error);
this.store.processStop(prosses);
});
/** update */
}
else {
this.actionFailed('rename File Error', next.errorMessage);
this.store.processStop(prosses);
}
}, (error) => {
this.actionFailed('rename File Error', error);
this.store.processStop(prosses);
});
}
}
sideEffectHelper(name, parameters, httpMethod, apiURL, successMethod = (a) => this.actionSuccess(a), failMethod = (a, b) => this.actionFailed(a, b)) {
this.ngxSmartModalService.getModal('waitModal').open();
this.reachServer(httpMethod, apiURL, parameters)
.subscribe((a) => successMethod(a), (err) => failMethod(name, err));
}
reachServer(method, apiUrl, parameters, data = {}) {
switch (method.toLowerCase()) {
case 'get':
return this.http.get(this.serviceTree.config.baseURL + apiUrl, { params: parameters });
case 'post':
return this.http.post(this.serviceTree.config.baseURL + apiUrl, data, { params: parameters });
case 'delete':
return this.http.delete(this.serviceTree.config.baseURL + apiUrl, { params: parameters });
case 'download':
window.open(this.serviceTree.config.baseURL + apiUrl + '?path=' + parameters.get('path'), '_blank');
return null;
default:
console.warn('[NodeClickedService] Incorrect params for this side-effect');
return null;
}
}
successWithSideViewClose() {
this.actionSuccess();
document.getElementById('side-view').classList.remove('selected');
}
searchSuccess(input, data) {
const obj = {
searchString: input,
response: data
};
this.actionSuccess();
this.ngxSmartModalService.setModalData(obj, 'searchModal', true);
this.ngxSmartModalService.getModal('searchModal').open();
}
actionSuccess(response = '') {
document.body.classList.remove('dialog-open');
this.nodeService.refreshCurrentPath();
const modal = this.ngxSmartModalService.getModal('waitModal');
modal.onOpenFinished.pipe(first()).subscribe(() => modal.close());
modal.close();
}
actionFailed(name, error) {
document.body.classList.remove('dialog-open');
this.ngxSmartModalService.getModal('waitModal').close();
this.ngxSmartModalService.getModal('errorModal').open();
console.warn('[NodeClickedService] Action "' + name + '" failed', error);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NodeClickedService, deps: [{ token: i4.NtkSmartModalService }, { token: NodeService }, { token: FileManagerStoreService }, { token: i1.HttpClient }, { token: i3.FileContentService }, { token: i3.FileCategoryService }], target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NodeClickedService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NodeClickedService, decorators: [{
type: Injectable
}], ctorParameters: () => [{ type: i4.NtkSmartModalService }, { type: NodeService }, { type: FileManagerStoreService }, { type: i1.HttpClient }, { type: i3.FileContentService }, { type: i3.FileCategoryService }] });
class TranslateUiService {
constructor(translateService, http) {
this.translateService = translateService;
this.http = http;
this.availableLanguages = ['en', 'fa', 'fr', 'ru'];
this.translationPath = './assets/i18n/ntk-cms-filemanager/';
}
init(language = null) {
if (language) {
// Initialize one specific language
this.loadTranslation(language).subscribe((translations) => {
this.translateService.setTranslation(language, translations, true);
this.translateService.use(language);
}, (error) => {
console.warn(`Failed to load translation for ${language}, falling back to English`);
this.loadTranslation('en').subscribe((enTranslations) => {
this.translateService.setTranslation(language, enTranslations, true);
this.translateService.use(language);
});
});
}
else {
// Initialize all languages
const loadPromises = this.availableLanguages.map((lang) => this.loadTranslation(lang).pipe(catchError((error) => {
console.warn(`Failed to load translation for ${lang}`);
return of(null);
})));
forkJoin(loadPromises).subscribe((results) => {
results.forEach((translations, index) => {
if (translations) {
const lang = this.availableLanguages[index];
this.translateService.setTranslation(lang, translations, true);
}
});
});
}
}
loadTranslation(language) {
return this.http.get(`${this.translationPath}${language}.json`);
}
setLanguage(language) {
this.translateService.use(language);
}
getCurrentLanguage() {
return this.translateService.currentLang;
}
getAvailableLanguages() {
return this.availableLanguages;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: TranslateUiService, deps: [{ token: i1$1.TranslateService }, { token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: TranslateUiService }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: TranslateUiService, decorators: [{
type: Injectable
}], ctorParameters: () => [{ type: i1$1.TranslateService }, { type: i1.HttpClient }] });
class NodeComponent {
constructor(store, nodeService, nodeClickedService, cdr) {
this.store = store;
this.nodeService = nodeService;
this.nodeClickedService = nodeClickedService;
this.cdr = cdr;
this.isSingleClick = true;
this.store
.getState(state => state.fileManagerState.selectedNode)
.subscribe((value) => {
this.selectedNode = value;
this.cdr.detectChanges();
});
}
method1CallForClick(event) {
event.preventDefault();
this.isSingleClick = true;
setTimeout(() => {
if (this.isSingleClick) {
this.showMenu();
}
}, 200);
}
// todo event.preventDefault for double click
method2CallForDblClick(event) {
event.preventDefault();
this.isSingleClick = false;
this.open();
}
ngOnInit() {
}
open() {
if (!this.node.isFolder) {
if (this.nodeService?.serviceTree?.config?.options?.allowFolderDownload === DownloadModeEnum.DOWNLOAD_DISABLED) {
this.isSingleClick = true;
this.showMenu();
return;
}
this.nodeClickedService.startDownload(this.node);
return;
}
if (this.node.stayOpen) {
if (this.node.name === 'root') {
if (this.selectedNode && this.selectedNode.id === this.node.id) {
this.nodeService.foldAll(true);
}
else {
this.nodeService.foldAll();
}
}
this.store.dispatch({ type: SET_PATH, payload: this.node.pathToNode });
return;
}
this.toggleNodeExpanded();
if (this.node.isExpanded) {
this.store.dispatch({ type: SET_PATH, payload: this.node.pathToNode });
}
this.setNodeSelectedState();
}
showMenu() {
this.store.dispatch({ type: SET_SELECTED_NODE, payload: this.node });
this.cdr.detectChanges();
}
toggleNodeExpanded() {
this.node.isExpanded = !this.node.isExpanded;
}
setNodeSelectedState() {
if (!this.node.isExpanded) {
document.getElementById('tree_' + this.node.pathToNode).classList.add('deselected');
this.nodeService.foldRecursively(this.node);
this.store.dispatch({ type: SET_PATH, payload: this.node.pathToParent });
}
else {
document.getElementById('tree_' + this.node.pathToNode).classList.remove('deselected');
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NodeComponent, deps: [{ token: FileManagerStoreService }, { token: NodeService }, { token: NodeClickedService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: NodeComponent, isStandalone: false, selector: "lib-filemanager-node", inputs: { node: "node" }, ngImport: i0, template: "<div #customTemplate (dblclick)=\"method2CallForDblClick($event)\" (click)=\"method1CallForClick($event)\">\r\n <ng-content></ng-content>\r\n</div>", styles: [""] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NodeComponent, decorators: [{
type: Component,
args: [{ selector: 'lib-filemanager-node', standalone: false, template: "<div #customTemplate (dblclick)=\"method2CallForDblClick($event)\" (click)=\"method1CallForClick($event)\">\r\n <ng-content></ng-content>\r\n</div>" }]
}], ctorParameters: () => [{ type: FileManagerStoreService }, { type: NodeService }, { type: NodeClickedService }, { type: i0.ChangeDetectorRef }], propDecorators: { node: [{
type: Input
}] } });
class FolderContentComponent {
constructor(nodeService, store, cdr) {
this.nodeService = nodeService;
this.store = store;
this.cdr = cdr;
this.openUploadDialog = new EventEmitter();
this.openNewFolderDialog = new EventEmitter();
this.obj = Object;
this.store
.getState(state => state.fileManagerState.inProcessingList)
.subscribe(() => {
this.cdr.detectChanges();
});
this.store
.getState(state => state.fileManagerState.selectedNode)
.subscribe(() => {
this.cdr.detectChanges();
});
}
ngOnInit() {
this.nodes = this.nodeService.serviceTree.nodes;
this.store
.getState(state => state.fileManagerState.path)
.subscribe((path) => {
this.nodes = this.nodeService.findNodeByPath(path);
});
}
newFileClickedAction() {
this.openUploadDialog.emit(true);
}
newFolderClickedAction() {
this.openNewFolderDialog.emit(true);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: FolderContentComponent, deps: [{ token: NodeService }, { token: FileManagerStoreService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: FolderContentComponent, isStandalone: false, selector: "lib-filemanager-folder-content", inputs: { folderContentTemplate: "folderContentTemplate", folderContentBackTemplate: "folderContentBackTemplate", folderContentNewFolderTemplate: "folderContentNewFolderTemplate", folderContentNewFileTemplate: "folderContentNewFileTemplate", folderContentReloadTemplate: "folderContentReloadTemplate" }, outputs: { openUploadDialog: "openUploadDialog", openNewFolderDialog: "openNewFolderDialog" }, ngImport: i0, template: "<div class=\"item-holder\" style=\"direction: ltr;\" *ngIf=\"nodes\">\r\n <ng-container *ngIf=\"nodes.id !== 0\">\r\n <lib-filemanager-node [node]=nodes id=\"{{nodes.pathToNode}}\">\r\n <ng-container [ngTemplateOutletContext]=\"{$implicit: nodes}\" [ngTemplateOutlet]=\"folderContentBackTemplate\">\r\n </ng-container>\r\n </lib-filemanager-node>\r\n </ng-container>\r\n <ng-container *ngIf=\"nodes.id === 0\">\r\n <lib-filemanager-node [node]=\"nodes\" id=\"{{ nodes.id }}\" >\r\n <ng-container [ngTemplateOutletContext]=\"{ $implicit: nodes }\" [ngTemplateOutlet]=\"folderContentReloadTemplate\">\r\n </ng-container>\r\n </lib-filemanager-node>\r\n </ng-container>\r\n\r\n <ng-container *ngFor=\"let node of obj.keys(nodes.children)\">\r\n <lib-filemanager-node [node]=\"nodes.children[node]\" id=\"fc_{{nodes.children[node].pathToNode}}\">\r\n <ng-container [ngTemplateOutletContext]=\"{$implicit: nodes.children[node]}\"\r\n [ngTemplateOutlet]=\"folderContentTemplate\">\r\n </ng-container>\r\n </lib-filemanager-node>\r\n </ng-container>\r\n\r\n <div class=\"new\" (click)=\"newFolderClickedAction()\" *ngIf=\"nodes?.children\">\r\n <ng-container [ngTemplateOutlet]=\"folderContentNewFolderTemplate\"></ng-container>\r\n </div>\r\n <div class=\"new\" (click)=\"newFileClickedAction()\" *ngIf=\"nodes?.children && nodes.id !== 0\">\r\n <ng-container [ngTemplateOutlet]=\"folderContentNewFileTemplate\"></ng-container>\r\n </div>\r\n</div>\r\n", styles: [".item-holder{box-sizing:border-box;display:flex;flex-flow:wrap}.item-holder .new{display:inline}\n"], dependencies: [{ kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NodeComponent, selector: "lib-filemanager-node", inputs: ["node"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: FolderContentComponent, decorators: [{
type: Component,
args: [{ selector: 'lib-filemanager-folder-content', standalone: false, template: "<div class=\"item-holder\" style=\"direction: ltr;\" *ngIf=\"nodes\">\r\n <ng-container *ngIf=\"nodes.id !== 0\">\r\n <lib-filemanager-node [node]=nodes id=\"{{nodes.pathToNode}}\">\r\n <ng-container [ngTemplateOutletContext]=\"{$implicit: nodes}\" [ngTemplateOutlet]=\"folderContentBackTemplate\">\r\n </ng-container>\r\n </lib-filemanager-node>\r\n </ng-container>\r\n <ng-container *ngIf=\"nodes.id === 0\">\r\n <lib-filemanager-node [node]=\"nodes\" id=\"{{ nodes.id }}\" >\r\n <ng-container [ngTemplateOutletContext]=\"{ $implicit: nodes }\" [ngTemplateOutlet]=\"folderContentReloadTemplate\">\r\n </ng-container>\r\n </lib-filemanager-node>\r\n </ng-container>\r\n\r\n <ng-container *ngFor=\"let node of obj.keys(nodes.children)\">\r\n <lib-filemanager-node [node]=\"nodes.children[node]\" id=\"fc_{{nodes.children[node].pathToNode}}\">\r\n <ng-container [ngTemplateOutletContext]=\"{$implicit: nodes.children[node]}\"\r\n [ngTemplateOutlet]=\"folderContentTemplate\">\r\n </ng-container>\r\n </lib-filemanager-node>\r\n </ng-container>\r\n\r\n <div class=\"new\" (click)=\"newFolderClickedAction()\" *ngIf=\"nodes?.children\">\r\n <ng-container [ngTemplateOutlet]=\"folderContentNewFolderTemplate\"></ng-container>\r\n </div>\r\n <div class=\"new\" (click)=\"newFileClickedAction()\" *ngIf=\"nodes?.children && nodes.id !== 0\">\r\n <ng-container [ngTemplateOutlet]=\"folderContentNewFileTemplate\"></ng-container>\r\n </div>\r\n</div>\r\n", styles: [".item-holder{box-sizing:border-box;display:flex;flex-flow:wrap}.item-holder .new{display:inline}\n"] }]
}], ctorParameters: () => [{ type: NodeService }, { type: FileManagerStoreService }, { type: i0.ChangeDetectorRef }], propDecorators: { folderContentTemplate: [{
type: Input
}], folderContentBackTemplate: [{
type: Input
}], folderContentNewFolderTemplate: [{
type: Input
}], folderContentNewFileTemplate: [{
type: Input
}], folderContentReloadTemplate: [{
type: Input
}], openUploadDialog: [{
type: Output
}], openNewFolderDialog: [{
type: Output
}] } });
class NodeListerComponent {
constructor(store, cdr) {
this.store = store;
this.cdr = cdr;
this.obj = Object;
this.store
.getState(state => state.fileManagerState.inProcessingList)
.subscribe(() => {
this.cdr.detectChanges();
});
this.store
.getState(state => state.fileManagerState.selectedNode)
.subscribe(() => {
this.cdr.detectChanges();
});
}
ngOnInit() {
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NodeListerComponent, deps: [{ token: FileManagerStoreService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: NodeListerComponent, isStandalone: false, selector: "lib-filemanager-node-lister", inputs: { nodes: "nodes", showFiles: "showFiles" }, queries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: "<ul class=\"node-lister-flist\" style=\"direction: ltr;text-align: left;\">\r\n <!--In order to avoid having to create that extra div, we can instead use ng-container directive-->\r\n <ng-container *ngFor=\"let node of obj.keys(nodes)\">\r\n <li class=\"node-lister-list-item\" *ngIf=\"nodes[node].isFolder || showFiles\">\r\n\r\n <lib-filemanager-node class=\"node-lister-app-node\" [node]=\"nodes[node]\" id=\"tree_{{nodes[node].isRoot ? 'root' : nodes[node].pathToNode}}\">\r\n <ng-container [ngTemplateOutletContext]=\"{$implicit: (nodes[node])}\"\r\n [ngTemplateOutlet]=\"templateRef\">\r\n </ng-container>\r\n </lib-filemanager-node>\r\n\r\n <lib-filemanager-node-lister class=\"node-lister\" *ngIf=\"obj.keys(nodes[node].children).length > 0\"\r\n [showFiles]=\"showFiles\" [nodes]=\"nodes[node].children\">\r\n <ng-template let-nodes>\r\n <ng-container [ngTemplateOutletContext]=\"{$implicit: (nodes)}\"\r\n [ngTemplateOutlet]=\"templateRef\">\r\n </ng-container>\r\n </ng-template>\r\n </lib-filemanager-node-lister>\r\n </li>\r\n </ng-container>\r\n</ul>\r\n", styles: [".node-lister-flist{margin:0 0 0 1em;padding:0;list-style:none;white-space:nowrap}.node-lister-list-item{list-style:none none;line-height:1.2em;font-size:1em;display:inline}.node-lister-list-item .node-lister-app-node.deselected+.node-lister ul{display:none}\n"], dependencies: [{ kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NodeComponent, selector: "lib-filemanager-node", inputs: ["node"] }, { kind: "component", type: NodeListerComponent, selector: "lib-filemanager-node-lister", inputs: ["nodes", "showFiles"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NodeListerComponent, decorators: [{
type: Component,
args: [{ selector: 'lib-filemanager-node-lister', standalone: false, template: "<ul class=\"node-lister-flist\" style=\"direction: ltr;text-align: left;\">\r\n <!--In order to avoid having to create that extra div, we can instead use ng-container directive-->\r\n <ng-container *ngFor=\"let node of obj.keys(nodes)\">\r\n <li class=\"node-lister-list-item\" *ngIf=\"nodes[node].isFolder || showFiles\">\r\n\r\n <lib-filemanager-node class=\"node-lister-app-node\" [node]=\"nodes[node]\" id=\"tree_{{nodes[node].isRoot ? 'root' : nodes[node].pathToNode}}\">\r\n <ng-container [ngTemplateOutletContext]=\"{$implicit: (nodes[node])}\"\r\n [ngTemplateOutlet]=\"templateRef\">\r\n </ng-container>\r\n </lib-filemanager-node>\r\n\r\n <lib-filemanager-node-lister class=\"node-lister\" *ngIf=\"obj.keys(nodes[node].children).length > 0\"\r\n [showFiles]=\"showFiles\" [nodes]=\"nodes[node].children\">\r\n <ng-template let-nodes>\r\n <ng-container [ngTemplateOutletContext]=\"{$implicit: (nodes)}\"\r\n [ngTemplateOutlet]=\"templateRef\">\r\n </ng-container>\r\n </ng-template>\r\n </lib-filemanager-node-lister>\r\n </li>\r\n </ng-container>\r\n</ul>\r\n", styles: [".node-lister-flist{margin:0 0 0 1em;padding:0;list-style:none;white-space:nowrap}.node-lister-list-item{list-style:none none;line-height:1.2em;font-size:1em;display:inline}.node-lister-list-item .node-lister-app-node.deselected+.node-lister ul{display:none}\n"] }]
}], ctorParameters: () => [{ type: FileManagerStoreService }, { type: i0.ChangeDetectorRef }], propDecorators: { templateRef: [{
type: ContentChild,
args: [TemplateRef, { static: false }]
}], nodes: [{
type: Input
}], showFiles: [{
type: Input
}] } });
class TreeComponent {
constructor(nodeService, store, cdr) {
this.nodeService = nodeService;
this.store = store;
this.cdr = cdr;
this.currentTreeLevel = '';
this.store
.getState(state => state.fileManagerState.inProcessingList)
.subscribe(() => {
this.cdr.detectChanges();
});
this.store
.getState(state => state.fileManagerState.selectedNode)
.subscribe(() => {
this.cdr.detectChanges();
});
}
ngOnInit() {
this.nodes = this.treeModel.nodes;
// todo move this store to proper place
this.store
.getState(state => state.fileManagerState.path)
.subscribe((path) => {
this.nodeService.getNodes(path);
this.currentTreeLevel = this.treeModel.currentPath;
return this.treeModel.currentPath = path;
});
}
ngAfterViewInit() {
this.store
.getState(state => state.fileManagerState.path)
.pipe(first())
.subscribe((path) => {
const nodes = this.nodeService.findNodeByPath(path);
this.store.dispatch({ type: SET_SELECTED_NODE, payload: nodes });
this.cdr.detectChanges();
});
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: TreeComponent, deps: [{ token: NodeService }, { token: FileManagerStoreService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: TreeComponent, isStandalone: false, selector: "lib-filemanager-tree", inputs: { treeModel: "treeModel", config: "config" }, queries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: "<lib-filemanager-node-lister [showFiles]=\"treeModel.config.options.showFilesInsideTree\"\r\n [nodes]=\"{children: nodes}\">\r\n <ng-template let-nodes>\r\n <ng-container [ngTemplateOutletContext]=\"{$implicit: nodes}\" [ngTemplateOutlet]=\"templateRef\"></ng-container>\r\n </ng-template>\r\n</lib-filemanager-node-lister>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NodeListerComponent, selector: "lib-filemanager-node-lister", inputs: ["nodes", "showFiles"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: TreeComponent, decorators: [{
type: Component,
args: [{ selector: 'lib-filemanager-tree', standalone: false, template: "<lib-filemanager-node-lister [showFiles]=\"treeModel.config.options.showFilesInsideTree\"\r\n [nodes]=\"{children: nodes}\">\r\n <ng-template let-nodes>\r\n <ng-container [ngTemplateOutletContext]=\"{$implicit: nodes}\" [ngTemplateOutlet]=\"templateRef\"></ng-container>\r\n </ng-template>\r\n</lib-filemanager-node-lister>\r\n" }]
}], ctorParameters: () => [{ type: NodeService }, { type: FileManagerStoreService }, { type: i0.ChangeDetectorRef }], propDecorators: { templateRef: [{
type: ContentChild,
args: [TemplateRef, { static: false }]
}], treeModel: [{
type: Input
}], config: [{
type: Input
}] } });
class NavBarComponent {
constructor(store, nodeService, cdr) {
this.store = store;
this.nodeService = nodeService;
this.cdr = cdr;
this.store
.getState(state => state.fileManagerState.inProcessingList)
.subscribe(() => {
this.cdr.detectChanges();
});
this.store
.getState(state => state.fileManagerState.selectedNode)
.subscribe(() => {
this.cdr.detectChanges();
});
}
ngOnInit() {
this.store
.getState(state => state.fileManagerState.path)
.subscribe((data) => {
this.nodeService.currentPath = data;
this.currentPath = data.split('/');
});
}
onClick(path, index) {
const newPath = path.slice(0, index + 1).join('/');
this.store.dispatch({ type: SET_PATH, payload: newPath });
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NavBarComponent, deps: [{ token: FileManagerStoreService }, { token: NodeService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: NavBarComponent, isStandalone: false, selector: "lib-filemanager-nav-bar", ngImport: i0, template: "<div>\r\n >> <span *ngFor=\"let to of currentPath; let i = index\">\r\n <a class=\"link\" (click)=\"onClick(currentPath, i)\">\r\n <div *ngIf=\"to === '' || to === 'root'; then icon else name\"></div>\r\n <ng-template #icon><i class=\"fileicon fas fa-home\"></i></ng-template>\r\n <ng-template #name>{{to}}</ng-template>\r\n </a> /\r\n </span>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NavBarComponent, decorators: [{
type: Component,
args: [{ selector: 'lib-filemanager-nav-bar', standalone: false, template: "<div>\r\n >> <span *ngFor=\"let to of currentPath; let i = index\">\r\n <a class=\"link\" (click)=\"onClick(currentPath, i)\">\r\n <div *ngIf=\"to === '' || to === 'root'; then icon else name\"></div>\r\n <ng-template #icon><i class=\"fileicon fas fa-home\"></i></ng-template>\r\n <ng-template #name>{{to}}</ng-template>\r\n </a> /\r\n </span>\r\n</div>\r\n" }]
}], ctorParameters: () => [{ type: FileManagerStoreService }, { type: NodeService }, { type: i0.ChangeDetectorRef }] });
class NavigationComponent {
constructor(nodeClickedService) {
this.nodeClickedService = nodeClickedService;
}
ngOnInit() {
}
onClick(input) {
this.nodeClickedService.searchForString(input);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NavigationComponent, deps: [{ token: NodeClickedService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: NavigationComponent, isStandalone: false, selector: "lib-filemanager-navigation", ngImport: i0, template: "<div class=\"navigation-component\" style=\"direction:ltr\">\r\n <!-- <input #input class=\"navigation-search\" (keyup.enter)=\"onClick(input.value)\"\r\n placeholder=\"{{'filemanager.search' | translate}}\">\r\n\r\n <button type=\"button\" [disabled]=\"input.value.length === 0\" class=\"navigation-search-icon\" (click)=\"onClick(input.value)\">\r\n <i class=\"fileicon fas fa-search\"></i>\r\n </button> -->\r\n\r\n <div>\r\n <ng-content></ng-content>\r\n </div>\r\n</div>\r\n", styles: [".navigation-component{display:flex}\n"], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NavigationComponent, decorators: [{
type: Component,
args: [{ selector: 'lib-filemanager-navigation', standalone: false, encapsulation: ViewEncapsulation.None, template: "<div class=\"navigation-component\" style=\"direction:ltr\">\r\n <!-- <input #input class=\"navigation-search\" (keyup.enter)=\"onClick(input.value)\"\r\n placeholder=\"{{'filemanager.search' | translate}}\">\r\n\r\n <button type=\"button\" [disabled]=\"input.value.length === 0\" class=\"navigation-search-icon\" (click)=\"onClick(input.value)\">\r\n <i class=\"fileicon fas fa-search\"></i>\r\n </button> -->\r\n\r\n <div>\r\n <ng-content></ng-content>\r\n </div>\r\n</div>\r\n", styles: [".navigation-component{display:flex}\n"] }]
}], ctorParameters: () => [{ type: NodeClickedService }] });
class LoadingOverlayComponent {
constructor(translateService) {
this.translateService = translateService;
}
// todo unsubscribe from 'list' event - now we are only dismissing this component
ngOnInit() {
timer(2000).subscribe(() => {
this.timeoutMessage = this.translateService.instant('filemanager.loading_troubles');
});
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LoadingOverlayComponent, deps: [{ token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: LoadingOverlayComponent, isStandalone: false, selector: "lib-filemanager-loading-overlay", inputs: { loadingOverlayTemplate: "loadingOverlayTemplate" }, ngImport: i0, template: "<ng-container\r\n [ngTemplateOutletContext]=\"{$implicit: timeoutMessage}\"\r\n [ngTemplateOutlet]=\"loadingOverlayTemplate\">\r\n</ng-container>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LoadingOverlayComponent, decorators: [{
type: Component,
args: [{ selector: 'lib-filemanager-loading-overlay', standalone: false, template: "<ng-container\r\n [ngTemplateOutletContext]=\"{$implicit: timeoutMessage}\"\r\n [ngTemplateOutlet]=\"loadingOverlayTemplate\">\r\n</ng-container>\r\n" }]
}], ctorParameters: () => [{ type: i1$1.TranslateService }], propDecorators: { loadingOverlayTemplate: [{
type: Input
}] } });
let FileUploaderPickerAdapter = class FileUploaderPickerAdapter extends FilePickerAdapter {
constructor(http) {
super();
this.http = http;
this.baseUploadURL = 'https://apifile.ir/api/v2/';
this.routeUpload = 'upload';
}
uploadFile(fileItem) {
const form = new FormData();
form.append('file', fileItem.file);
const req = new HttpRequest('POST', this.baseUploadURL + this.routeUpload, form, { reportProgress: true });
return this.http.request(req).pipe(map((res) => {
if (res.type === HttpEventType.Response) {
const responseFromBackend = res.body;
return {
body: responseFromBackend,
status: UploadStatus.UPLOADED
};
}
else if (res.type === HttpEventType.UploadProgress) {
/** Compute and show the % done: */
const uploadProgress = +Math.round((100 * res.loaded) / res.total);
return {
status: UploadStatus.IN_PROGRESS,
progress: uploadProgress
};
}
return {
status: UploadStatus.IN_PROGRESS,
};
}), catchError(er => {
console.log(er);
return of({ status: UploadStatus.ERROR, body: er });
}));
}
removeFile(fileItem) {
return new Observable((observer) => {
return () => {
// Detach the event handler from the target
};
});
}
};
FileUploaderPickerAdapter = __decorate([
__param(0, Inject(HttpClient))
], FileUploaderPickerAdapter);
class UploadComponent {
set optionSelectFileType(model) {
this.fileExtensions = [];
if (typeof (model) === 'string') {
this.fileTypeAccept = '.' + model;
this.fileExtensions.push(model);
if (this.fileExtensions.length === 0) {
this.fileExtensions = null;
}
return;
}
if (typeof (model) === typeof ([])) {
let retOut = '';
model.forEach(element => {
this.fileExtensions.push(element);
if (retOut.length > 0) {
retOut = retOut + ', ';
}
retOut = retOut + '.' + element;
});
this.fileTypeAccept = retOut;
if (this.fileExtensions.length === 0) {
this.fileExtensions = null;
}
return;
}
}
constructor(http, nodeService) {
this.http = http;
this.nodeService = nodeService;
this.createFile = new EventEmitter();
this.openDialog = false;
this.openSelectFileDescription = '';
this.closeDialog = new EventEmitter();
this.openDirectUploadSave = false;
this.openDirectUploadView = false;
this.adapter = new FileUploaderPickerAdapter(this.http);
this.fileUplodMaxCount = 20;
this.fileTypeAccept = ''; // '.jpg, .png'
this.fileExtensions = []; // ['pdf', 'jpg', 'jpeg', 'png', 'mp4', 'css']
this.counter = 0;
// @Output() optionUploadSuccess = new EventEmitter<FilePreviewModel>();
// uploadSuccess(event: any): void {
// this.optionUploadSuccess.emit(event);
// }
this.myFiles = [];
this.captions = {
dropzone: {
title: 'Ù…ÛŒ توانید Ùایل ها را در اینجا رها کنید',
or: 'یا',
browse: 'انتخاب Ùایل'
},
cropper: {
crop: 'قطع کردن',
cancel: 'انصراÙ'
},
previewCard: {
remove: 'ØØ°Ù',
uploadError: 'برروز خطا در بارگزاری Ùایل'
}
};
this.allowClose = true;
this.adapter.baseUploadURL = this.nodeService.serviceTree.config.baseUploadURL;
this.adapter.routeUpload = this.nodeService.serviceTree.config.api.uploadFile;
if (this.nodeService.serviceTree.config.options.fileUplodMaxCount > 0)
this.fileUplodMaxCount = this.nodeService.serviceTree.config.options.fileUplodMaxCount;
this.fileTypeAccept = this.nodeService.serviceTree.config.options.fileUplodTypeAccept;
this.fileExtensions = this.nodeService.serviceTree.config.options.fileUplodExtensions;
}
get getCurrentPath() {
const parentPath = this.nodeService.findNodeByPath(this.nodeService.currentPath).id;
return parentPath === 0 ? '' : parentPath;
}
ngOnInit() {
}
ngAfterViewInit() {
}
uploadFiles() {
}
newClickedAction() {
this.closeDialog.emit();
}
onFileAdded(model) {
console.log('onFileAdded', model);
this.myFiles.push(model);
}
onUploadSuccess(model) {
if (!model.uploadResponse) {
}
const ret = model.uploadResponse;
if (!ret.isSuccess) {
}
this.createFile.emit({ fileName: model.fileName, uploadFileGUID: ret.item.fileKey });
}
onValidationError(error) {
alert(`Validation Error ${error.error} in ${error.file.name}`);
}
onRemoveSuccess(e) {
console.log(e);
}
myCustomValidator(file) {
if (!file.name.includes('uploader')) {
return of(true).pipe(delay(200));
}
// if (file.size > 50) {
// return this.http.get('https://vugar.free.beeceptor.com').pipe(map((res) => res === 'OK' ));
// }
return of(false).pipe(delay(200));
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: UploadComponent, deps: [{ token: i1.HttpClient }, { token: NodeService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: UploadComponent, isStandalone: false, selector: "lib-filemanager-upload", inputs: { optionSelectFileType: "optionSelectFileType", openDialog: "openDialog", openSelectFileDescription: "openSelectFileDescription", openDirectUploadSave: "openDirectUploadSave", openDirectUploadView: "openDirectUploadView" }, outputs: { createFile: "createFile", closeDialog: "closeDialog" }, ngImport: i0, template: "<div class=\"backdrop\" (click)=\"newClickedAction()\"></div>\r\n<div class=\"upload-background\">\r\n <div class=\"row\" style=\"flex-direction: column;\">\r\n\r\n <ngx-ntk-file-picker class=\"ntk-awesome-uploader\" #uploader [adapter]=\"adapter\" [fileMaxCount]=\"fileUplodMaxCount\" [fileMaxSize]=\"700\" [uploadType]=\"'multi'\"\r\n (validationError)=\"onValidationError($event)\" [fileExtensions]=\"fileExtensions\"\r\n [enableCropper]=\"false\" (uploadSuccess)=\"onUploadSuccess($event)\" (removeSuccess)=\"onRemoveSuccess($event)\"\r\n (fileAdded)=\"onFileAdded($event)\" [customValidator]=\"myCustomValidator\" [captions]=\"captions\"\r\n [accept]=\"fileTypeAccept\">\r\n </ngx-ntk-file-picker>\r\n <h2>{{openSelectFileDescription}}</h2>\r\n </div>\r\n <div class=\"row\">\r\n <ng-template #myItemTemplate let-fileItem=\"fileItem\" let-uploadProgress=\"uploadProgress\" >\r\n <p>File Size: {{fileItem.file.size}}</p>\r\n <p>File Name: {{fileItem.fileName}}</p>\r\n <p > Upload Progress: {{uploadProgress}} % </p>\r\n <button type=\"button\" (click)=\"uploader.removeFile(fileItem)\">Remove</button>\r\n </ng-template>\r\n <hr>\r\n <div class=\"buttons\">\r\n <button type=\"button\" class=\"button big\" [disabled]=\"this.counter < 1\" (click)=\"uploadFiles()\">\r\n {{'filemanager.upload' | translate }}\r\n </button>\r\n <button type=\"button\" class=\"button big\" [disabled]=\"!allowClose\" (click)=\"newClickedAction()\">\r\n {{'filemanager.close' | translate }}\r\n </button>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [":host{display:block}.ntk-awesome-uploader{max-width:none!important}.dropzoneTemplate{font-size:large}\n"], dependencies: [{ kind: "component", type: i3$2.FilePickerComponent, selector: "ngx-ntk-file-picker", inputs: ["customValidator", "enableCropper", "showeDragDropZone", "showPreviewContainer", "itemTemplate", "uploadType", "fileMaxSize", "fileMaxCount", "totalMaxSize", "accept", "fileExtensions", "cropperOptions", "croppedCanvasOptions", "adapter", "dropzoneTemplate", "captions", "enableAutoUpload", "fileInputCapture"], outputs: ["uploadSuccess", "uploadFail", "removeSuccess", "validationError", "fileAdded", "fileRemoved"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: UploadComponent, decorators: [{
type: Component,
args: [{ selector: 'lib-filemanager-upload', standalone: false, encapsulation: ViewEncapsulation.None, template: "<div class=\"backdrop\" (click)=\"newClickedAction()\"></div>\r\n<div class=\"upload-background\">\r\n <div class=\"row\" style=\"flex-direction: column;\">\r\n\r\n <ngx-ntk-file-picker class=\"ntk-awesome-uploader\" #uploader [adapter]=\"adapter\" [fileMaxCount]=\"fileUplodMaxCount\" [fileMaxSize]=\"700\" [uploadType]=\"'multi'\"\r\n (validationError)=\"onValidationError($event)\" [fileExtensions]=\"fileExtensions\"\r\n [enableCropper]=\"false\" (uploadSuccess)=\"onUploadSuccess($event)\" (removeSuccess)=\"onRemoveSuccess($event)\"\r\n (fileAdded)=\"onFileAdded($event)\" [customValidator]=\"myCustomValidator\" [captions]=\"captions\"\r\n [accept]=\"fileTypeAccept\">\r\n </ngx-ntk-file-picker>\r\n <h2>{{openSelectFileDescription}}</h2>\r\n </div>\r\n <div class=\"row\">\r\n <ng-template #myItemTemplate let-fileItem=\"fileItem\" let-uploadProgress=\"uploadProgress\" >\r\n <p>File Size: {{fileItem.file.size}}</p>\r\n <p>File Name: {{fileItem.fileName}}</p>\r\n <p > Upload Progress: {{uploadProgress}} % </p>\r\n <button type=\"button\" (click)=\"uploader.removeFile(fileItem)\">Remove</button>\r\n </ng-template>\r\n <hr>\r\n <div class=\"buttons\">\r\n <button type=\"button\" class=\"button big\" [disabled]=\"this.counter < 1\" (click)=\"uploadFiles()\">\r\n {{'filemanager.upload' | translate }}\r\n </button>\r\n <button type=\"button\" class=\"button big\" [disabled]=\"!allowClose\" (click)=\"newClickedAction()\">\r\n {{'filemanager.close' | translate }}\r\n </button>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [":host{display:block}.ntk-awesome-uploader{max-width:none!important}.dropzoneTemplate{font-size:large}\n"] }]
}], ctorParameters: () => [{ type: i1.HttpClient }, { type: NodeService }], propDecorators: { optionSelectFileType: [{
type: Input
}], createFile: [{
type: Output
}], openDialog: [{
type: Input
}], openSelectFileDescription: [{
type: Input
}], closeDialog: [{
type: Output
}], openDirectUploadSave: [{
type: Input
}], openDirectUploadView: [{
type: Input
}] } });
class NewFolderComponent {
constructor(translateService) {
this.translateService = translateService;
this.openDialog = false;
this.buttonClicked = new EventEmitter();
this.closeDialog = new EventEmitter();
this.createDir = new EventEmitter();
this.inputValue = '';
this.buttonText = this.translateService.instant('filemanager.close');
}
ngOnInit() {
}
onClick() {
const el = this.uploadFolder.nativeElement;
// @ts-ignore
// this.buttonClicked.emit(el.value);
const name = el.value;
if (name && name.length > 0) {
this.createDir.emit(name);
this.newClickedAction();
}
else {
this.newClickedAction();
}
}
onInputChange(event) {
this.inputValue = event.target.value;
if (this.inputValue.length > 0) {
this.buttonText = this.translateService.instant('filemanager.confirm').toString();
}
else {
this.buttonText = this.translateService.instant('filemanager.close').toString();
}
}
newClickedAction() {
this.closeDialog.emit();
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NewFolderComponent, deps: [{ token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: NewFolderComponent, isStandalone: false, selector: "lib-filemanager-newfolder", inputs: { openDialog: "openDialog" }, outputs: { buttonClicked: "buttonClicked", closeDialog: "closeDialog", createDir: "createDir" }, viewQueries: [{ propertyName: "uploadFolder", first: true, predicate: ["uploadFolder"], descendants: true }], ngImport: i0, template: "<div class=\"backdrop\" (click)=\"newClickedAction()\"></div>\r\n<div class=\"upload-background\">\r\n <p class=\"new-folder-description\">{{'filemanager.type_new_folder_name' | translate}}</p>\r\n <input #uploadFolder placeholder=\"{{'filemanager.folder_name' | translate}}\" (keyup)=\"onInputChange($event)\"\r\n (keyup.enter)=\"onClick()\" type=\"text\" class=\"new-folder-input\" />\r\n <button type=\"button\" class=\"button new-folder-send\" (click)=\"onClick()\">{{buttonText | translate}}</button>\r\n</div>", styles: [".new-folder-description{margin:0 auto;padding:0}\n"], dependencies: [{ kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: NewFolderComponent, decorators: [{
type: Component,
args: [{ selector: 'lib-filemanager-newfolder', standalone: false, template: "<div class=\"backdrop\" (click)=\"newClickedAction()\"></div>\r\n<div class=\"upload-background\">\r\n <p class=\"new-folder-description\">{{'filemanager.type_new_folder_name' | translate}}</p>\r\n <input #uploadFolder placeholder=\"{{'filemanager.folder_name' | translate}}\" (keyup)=\"onInputChange($event)\"\r\n (keyup.enter)=\"onClick()\" type=\"text\" class=\"new-folder-input\" />\r\n <button type=\"button\" class=\"button new-folder-send\" (click)=\"onClick()\">{{buttonText | translate}}</button>\r\n</div>", styles: [".new-folder-description{margin:0 auto;padding:0}\n"] }]
}], ctorParameters: () => [{ type: i1$1.TranslateService }], propDecorators: { openDialog: [{
type: Input
}], uploadFolder: [{
type: ViewChild,
args: ['uploadFolder']
}], buttonClicked: [{
type: Output
}], closeDialog: [{
type: Output
}], createDir: [{
type: Output
}] } });
class SideViewComponent {
constructor(store, cdr) {
this.store = store;
this.cdr = cdr;
this.allowFolderDownload = DownloadModeEnum.DOWNLOAD_DISABLED;
this.clickEvent = new EventEmitter();
this.store
.getState(state => state.fileManagerState.isLoading)
.subscribe((isLoading) => {
this.cdr.detectChanges();
});
this.store
.getState(state => state.fileManagerState.selectedNode)
.subscribe(() => {
this.cdr.detectChanges();
});
}
ngOnInit() {
}
onClick(event, type) {
this.clickEvent.emit({ type, event, node: this.node });
}
isDisabled() {
if (this.allowFolderDownload === DownloadModeEnum.DOWNLOAD_DISABLED) {
return true;
}
else if (this.allowFolderDownload === DownloadModeEnum.DOWNLOAD_FILES && this.node.isFolder) {
return true;
}
return false;
}
AllowPlayMP3(node) {
if (node.isFolder ||
!node.extension ||
node.extension.length === 0 ||
!node.downloadLinksrc ||
node.downloadLinksrc.length === 0) {
return false;
}
if (node.extension.toLowerCase() === 'mp3') {
return true;
}
return false;
}
AllowViewImage(node) {
if (node.isFolder ||
!node.extension ||
node.extension.length === 0 ||
!node.downloadLinksrc ||
node.downloadLinksrc.length === 0) {
return false;
}
if (node.extension.toLowerCase() === 'png' || node.extension.toLowerCase() === 'jpeg'
|| node.extension.toLowerCase() === 'gif'
|| node.extension.toLowerCase() === 'jpg') {
return true;
}
return false;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: SideViewComponent, deps: [{ token: FileManagerStoreService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: SideViewComponent, isStandalone: false, selector: "lib-filemanager-side-view", inputs: { sideViewTemplate: "sideViewTemplate", node: "node", allowFolderDownload: "allowFolderDownload" }, outputs: { clickEvent: "clickEvent" }, ngImport: i0, template: "<div class=\"side-view\" style=\"direction: ltr;\" *ngIf=\"node\">\r\n <div class=\"side-view-preview\">\r\n <i (click)=\"onClick($event, 'closeSideView')\" class=\"fileicon fas fa-times side-view-close\"></i>\r\n\r\n <div class=\"side-view-preview-title\">{{node.name}}</div>\r\n\r\n <div class=\"side-view-preview-content\">\r\n <div *ngIf=\"AllowViewImage(node)\" class=\"side-view-preview-content\">\r\n <img src=\"{{node.downloadThumbnailSrc}}\" loading=\"lazy\" alt=\"...\" class=\"mb-3\"\r\n style=\"max-width: -webkit-fill-available\"/>\r\n </div>\r\n <div *ngIf=\"AllowPlayMP3(node)\" class=\"side-view-preview-content\">\r\n <audio controls>\r\n <source src=\"{{node.downloadLinksrc}}\" type=\"audio/mp3\">\r\n Your browser does not support the audio tag.\r\n </audio>\r\n </div>\r\n <ng-container [ngTemplateOutletContext]=\"{$implicit: node}\" [ngTemplateOutlet]=\"sideViewTemplate\">\r\n </ng-container>\r\n </div>\r\n <div class=\"side-view-buttons\">\r\n <button type=\"button\" (click)=\"onClick($event, 'download')\" class=\"button\" [disabled]=\"isDisabled()\">\r\n {{'filemanager.download' | translate }}\r\n </button>\r\n <button type=\"button\" (click)=\"onClick($event, 'renameConfirm')\" class=\"button\">{{'filemanager.rename' | translate\r\n }}</button>\r\n <button type=\"button\" (click)=\"onClick($event, 'removeAsk')\" class=\"button\">{{'filemanager.delete' | translate\r\n }}</button>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".side-view-close{position:absolute;cursor:pointer;top:0;right:0;padding:15px}.side-view-buttons{width:97%;display:flex;justify-content:center;flex-flow:column}.side-view-buttons .button{margin:5px 0}\n"], dependencies: [{ kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: SideViewComponent, decorators: [{
type: Component,
args: [{ selector: 'lib-filemanager-side-view', standalone: false, encapsulation: ViewEncapsulation.None, template: "<div class=\"side-view\" style=\"direction: ltr;\" *ngIf=\"node\">\r\n <div class=\"side-view-preview\">\r\n <i (click)=\"onClick($event, 'closeSideView')\" class=\"fileicon fas fa-times side-view-close\"></i>\r\n\r\n <div class=\"side-view-preview-title\">{{node.name}}</div>\r\n\r\n <div class=\"side-view-preview-content\">\r\n <div *ngIf=\"AllowViewImage(node)\" class=\"side-view-preview-content\">\r\n <img src=\"{{node.downloadThumbnailSrc}}\" loading=\"lazy\" alt=\"...\" class=\"mb-3\"\r\n style=\"max-width: -webkit-fill-available\"/>\r\n </div>\r\n <div *ngIf=\"AllowPlayMP3(node)\" class=\"side-view-preview-content\">\r\n <audio controls>\r\n <source src=\"{{node.downloadLinksrc}}\" type=\"audio/mp3\">\r\n Your browser does not support the audio tag.\r\n </audio>\r\n </div>\r\n <ng-container [ngTemplateOutletContext]=\"{$implicit: node}\" [ngTemplateOutlet]=\"sideViewTemplate\">\r\n </ng-container>\r\n </div>\r\n <div class=\"side-view-buttons\">\r\n <button type=\"button\" (click)=\"onClick($event, 'download')\" class=\"button\" [disabled]=\"isDisabled()\">\r\n {{'filemanager.download' | translate }}\r\n </button>\r\n <button type=\"button\" (click)=\"onClick($event, 'renameConfirm')\" class=\"button\">{{'filemanager.rename' | translate\r\n }}</button>\r\n <button type=\"button\" (click)=\"onClick($event, 'removeAsk')\" class=\"button\">{{'filemanager.delete' | translate\r\n }}</button>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".side-view-close{position:absolute;cursor:pointer;top:0;right:0;padding:15px}.side-view-buttons{width:97%;display:flex;justify-content:center;flex-flow:column}.side-view-buttons .button{margin:5px 0}\n"] }]
}], ctorParameters: () => [{ type: FileManagerStoreService }, { type: i0.ChangeDetectorRef }], propDecorators: { sideViewTemplate: [{
type: Input
}], node: [{
type: Input
}], allowFolderDownload: [{
type: Input
}], clickEvent: [{
type: Output
}] } });
class CmsFileManagerComponent {
set language(value) {
if (value && value.length > 0) {
this._language = value;
this.translateUiService.init(value);
this.translate.use(this.language);
}
}
get language() {
return this._language;
}
set selectFileType(model) {
if (model && model.length > 0) {
this.configSelectFileType = model;
}
}
set openForm(model) {
if (model !== this.openPopupForm &&
this.mainModal &&
this.mainModal.nativeElement) {
if (model) {
this.mainModal.nativeElement.style.display = 'block';
document.body.classList.add('jw-modal-open');
// this.ntkSmartModalService.getModal('mainModal').open();
}
else {
this.mainModal.nativeElement.style.display = 'none';
document.body.classList.remove('jw-modal-open');
// this.ntkSmartModalService.getModal('mainModal').close();
}
}
this.openPopupForm = model;
this.openFormChange.emit(model);
if (this.openDirectUploadView) {
this.newFileDialog = true;
}
if (model && this.isPopup && !this.startManagerRuned) {
this.nodeService.startManagerAt(this.tree.currentPath + '');
this.startManagerRuned = true;
}
}
get openForm() {
return this.openPopupForm;
}
constructor(store, nodeService, nodeClickedService, ngxSmartModalService, translate, cdr, el, translateUiService) {
this.store = store;
this.nodeService = nodeService;
this.nodeClickedService = nodeClickedService;
this.ngxSmartModalService = ngxSmartModalService;
this.translate = translate;
this.cdr = cdr;
this.el = el;
this.translateUiService = translateUiService;
this._language = 'en';
this.openFilemanagerButtonView = true;
this.openDirectUploadSave = true;
this.openDirectUploadView = false;
this.configSelectFileType = [];
this.isPopup = false;
this.openFilemanagerButtonLabelKey = 'filemanager.open_file_manager';
this.openSelectFileDescription = '';
this.itemClicked = new EventEmitter();
this.itemSelected = new EventEmitter();
this.openPopupForm = false;
this.openFormChange = new EventEmitter();
this.sideMenuClosed = true;
this.newFileDialog = false;
this.newFolderDialog = false;
this.HighestZIndex = 0;
this.startManagerRuned = false;
}
ngOnInit() {
this.nodeService.serviceTree = this.tree;
this.nodeClickedService.serviceTree = this.tree;
if (!this.isPopup) {
this.nodeService.startManagerAt(this.tree.currentPath + '');
this.startManagerRuned = true;
}
this.translate
.get(this.openFilemanagerButtonLabelKey)
.subscribe((translation) => {
this.openFilemanagerButtonLabel = translation;
});
this.store
.getState((state) => state.fileManagerState.inProcessingList)
.subscribe((inProcessingList) => {
this.cdr.detectChanges();
});
this.store
.getState((state) => state.fileManagerState.isLoading)
.subscribe((isLoading) => {
this.loading = isLoading;
this.cdr.detectChanges();
});
this.store
.getState((state) => state.fileManagerState.selectedNode)
.subscribe((selectedNode) => {
this.cdr.detectChanges();
if (!selectedNode) {
return;
}
// fixed highlighting error when closing node but not changing path
if (selectedNode.isExpanded &&
selectedNode.pathToNode !== this.nodeService.currentPath &&
!selectedNode.stayOpen) {
return;
}
this.handleFileManagerClickEvent({
type: 'select',
node: selectedNode,
});
});
}
ngAfterViewInit() {
// this.HighestZIndex = this.findHighestZIndex('div');
}
onItemClicked(event) {
this.itemClicked.emit(event);
}
searchClicked(data) {
// console.log(data);
const node = this.nodeService.findNodeById(data.id);
this.ngxSmartModalService.getModal('searchModal').close();
this.store.dispatch({ type: SET_SELECTED_NODE, payload: node });
this.cdr.detectChanges();
}
handleFileManagerClickEvent(event) {
switch (event.type) {
case 'closeSideView':
return this.nodeClickHandler(event.node, true);
case 'select':
this.onItemClicked(event);
this.highlightSelected(event.node);
return this.nodeClickHandler(event.node);
case 'download':
this.nodeClickedService.startDownload(event.node);
return this.onItemClicked(event);
case 'renameConfirm':
return this.ngxSmartModalService.getModal('renameModal').open();
case 'rename':
this.ngxSmartModalService.getModal('renameModal').close();
this.nodeClickedService.rename(this.selectedNode, event.value);
return this.onItemClicked({
type: event.type,
node: this.selectedNode,
newName: event.value,
});
case 'removeAsk':
return this.ngxSmartModalService.getModal('confirmDeleteModal').open();
case 'remove':
this.ngxSmartModalService.getModal('confirmDeleteModal').close();
this.nodeClickedService.initDelete(this.selectedNode);
return this.onItemClicked({
type: event.type,
node: this.selectedNode,
});
case 'createFolder':
const parentid = this.nodeService.findNodeByPath(this.nodeService.currentPath).id;
this.nodeClickedService.createFolder(parentid, event.payload);
return this.onItemClicked({
type: event.type,
parentId: parentid,
newDirName: event.payload,
});
case 'createFile':
if (this.openDirectUploadView && !this.openDirectUploadSave) {
// tslint:disable-next-line: no-angle-bracket-type-assertion
const selectedModel = {
id: event.payload.uploadFileGUID,
name: event.payload.uploadFileGUID,
isFolder: false,
};
this.selectedNode = selectedModel;
this.confirmSelection();
return;
}
const failMethod = (error) => { };
const successMethod = (next) => {
// tslint:disable-next-line: no-angle-bracket-type-assertion
const selectedModel = {
id: next.item.id,
name: next.item.fileName,
downloadLinksrc: next.item.downloadLinksrc,
downloadThumbnailSrc: next.item.downloadThumbnailSrc,
size: next.item.size,
extension: next.item.extension,
isFolder: false,
};
this.selectedNode = selectedModel;
if (this.openDirectUploadView) {
this.confirmSelection();
return;
}
};
const catid = this.nodeService.findNodeByPath(this.nodeService.currentPath).id;
this.nodeClickedService.createFile(catid, event.payload.fileName, event.payload.uploadFileGUID, successMethod, failMethod);
return this.onItemClicked({
type: event.type,
parentId: catid,
fileName: event.payload.fileName,
uploadFileGUID: event.payload.uploadFileGUID,
});
}
}
nodeClickHandler(node, closing) {
if (node.name === 'root') {
return;
}
if (closing) {
const parentNode = this.nodeService.findNodeByPath(this.nodeService.currentPath);
this.store.dispatch({ type: SET_SELECTED_NODE, payload: parentNode });
this.sideMenuClosed = true;
}
else {
if (this.selectedNode === node && this.sideMenuClosed) {
this.sideMenuClosed = false;
}
else if (this.selectedNode === node && !this.sideMenuClosed) {
this.sideMenuClosed = true;
}
else if (this.selectedNode !== node && this.sideMenuClosed) {
this.sideMenuClosed = false;
}
else if (this.selectedNode !== node && !this.sideMenuClosed) {
this.sideMenuClosed = false;
}
}
this.selectedNode = node;
// todo investigate this workaround - warning: [File Manager] failed to find requested node for path: [path]
if (!document.getElementById('side-view')) {
this.cdr.detectChanges();
return;
}
if (this.sideMenuClosed) {
document.getElementById('side-view').classList.remove('selected');
}
else {
document.getElementById('side-view').classList.add('selected');
}
this.cdr.detectChanges();
}
// todo stay DRY!
highlightSelected(node) {
let pathToNode = node.pathToNode;
if (pathToNode.length === 0) {
pathToNode = 'root';
}
const treeElement = this.getElementById(pathToNode, 'tree_');
const fcElement = this.getElementById(pathToNode, 'fc_');
if (!treeElement && !fcElement) {
console.warn('[File Manager] failed to find requested node for path:', pathToNode);
return;
}
this.removeClass('highlighted');
this.removeClass('light');
if (fcElement) {
this.highilghtChildElement(fcElement);
}
if (treeElement) {
this.highilghtChildElement(treeElement, true);
}
// parent node highlight
let pathToParent = node.pathToParent;
if (pathToParent === null ||
node.pathToNode === this.nodeService.currentPath) {
return;
}
if (pathToParent.length === 0) {
pathToParent = 'root';
}
const parentElement = this.getElementById(pathToParent, 'tree_');
if (!parentElement) {
console.warn('[File Manager] failed to find requested parent node for path:', pathToParent);
return;
}
this.highilghtChildElement(parentElement);
}
highilghtChildElement(el, light = false) {
el.children[0].children[0].classList // appnode div wrapper // ng template first item
.add('highlighted');
if (light) {
el.children[0].children[0].classList.add('light');
}
}
getElementById(id, prefix = '') {
const fullId = prefix + id;
return document.getElementById(fullId);
}
removeClass(className) {
Array.from(document.getElementsByClassName(className)).map((el) => el.classList.remove(className));
}
fmShowHide(act) {
this.openForm = act;
}
onActionOpen(status) {
this.fmShowHide(status);
}
backdropClicked() {
// todo get rid of this ugly workaround
// todo fire userCanceledLoading event
this.store.dispatch({ type: SET_LOADING_STATE, payload: false });
}
handleUploadDialog(event) {
this.newFileDialog = event;
}
handleNewFolderDialog(event) {
this.newFolderDialog = event;
}
confirmSelection() {
this.fmShowHide(false);
this.itemSelected.emit(this.selectedNode);
}
allowConfirmSelection(selectedNode) {
if (!selectedNode ||
(selectedNode.isFolder && !this.tree.config.options.showSelectFolder) ||
(!selectedNode.isFolder && !this.tree.config.options.showSelectFile)) {
return false;
}
if (!selectedNode.isFolder && !this.AllowFileView(selectedNode)) {
return false;
}
return true;
}
cancelSelection() {
this.fmShowHide(false);
}
AllowFileView(model) {
if (!model ||
model.isFolder ||
!model.extension ||
model.extension.length === 0 ||
!this.configSelectFileType ||
this.configSelectFileType.length === 0 ||
this.configSelectFileType.find((t) => t &&
model.extension &&
t.toLowerCase() === model.extension.toLowerCase())) {
return true;
}
return false;
}
findHighestZIndex(elem) {
const elems = document.getElementsByTagName(elem);
let highest = Number.MIN_SAFE_INTEGER || -(Math.pow(2, 53) - 1);
for (let i = 0; i < this.el.nativeElement.length; i++) {
const zindex = Number.parseInt(document.defaultView
.getComputedStyle(elems[i], null)
.getPropertyValue('z-index'), 10);
if (zindex > highest) {
highest = zindex;
}
}
console.log('HighestZIndex', highest);
return highest;
}
AllowViewImage(node) {
if (node.isFolder ||
!node.extension ||
node.extension.length === 0 ||
!node.downloadLinksrc ||
node.downloadLinksrc.length === 0) {
return false;
}
if (node.extension.toLowerCase() === 'png' ||
node.extension.toLowerCase() === 'jpeg' ||
node.extension.toLowerCase() === 'gif' ||
node.extension.toLowerCase() === 'jpg') {
return true;
}
return false;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmsFileManagerComponent, deps: [{ token: FileManagerStoreService }, { token: NodeService }, { token: NodeClickedService }, { token: i4.NtkSmartModalService }, { token: i1$1.TranslateService }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: TranslateUiService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: CmsFileManagerComponent, isStandalone: false, selector: "cms-file-manager", inputs: { language: "language", iconTemplate: "iconTemplate", folderContentTemplate: "folderContentTemplate", folderContentBackTemplate: "folderContentBackTemplate", folderContentNewFileTemplate: "folderContentNewFileTemplate", folderContentNewFolderTemplate: "folderContentNewFolderTemplate", folderContentReloadTemplate: "folderContentReloadTemplate", openFilemanagerButtonView: "openFilemanagerButtonView", openDirectUploadSave: "openDirectUploadSave", openDirectUploadView: "openDirectUploadView", loadingOverlayTemplate: "loadingOverlayTemplate", sideViewTemplate: "sideViewTemplate", selectFileType: "selectFileType", tree: "tree", isPopup: "isPopup", openFilemanagerButtonLabelKey: "openFilemanagerButtonLabelKey", openSelectFileDescription: "openSelectFileDescription", openForm: "openForm" }, outputs: { itemClicked: "itemClicked", itemSelected: "itemSelected", openFormChange: "openFormChange" }, viewQueries: [{ propertyName: "mainModal", first: true, predicate: ["mainModal"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"isPopup; then itIsPopup else showContent\"></ng-container>\r\n\r\n\r\n<ng-template #itIsPopup>\r\n <div>\r\n <button type=\"button\" class=\"button big\" (click)=\"fmShowHide(true)\" [disabled]=\"openPopupForm\"\r\n *ngIf=\"openFilemanagerButtonView\">{{openFilemanagerButtonLabel}}</button>\r\n </div>\r\n <div class=\"modal\" #mainModal>\r\n <div class=\"jw-modal-body\">\r\n <div class=\"jw-modal\">\r\n <br>\r\n <div *ngIf=\"this.openPopupForm; then showContent\"></div>\r\n <div class=\"buttons-panel\">\r\n <button type=\"button\" class=\"button big\" (click)=\"confirmSelection()\"\r\n [disabled]=\"!allowConfirmSelection(selectedNode)\">{{'filemanager.confirm_selection' | translate}}</button>\r\n <button type=\"button\" class=\"button big\" (click)=\"cancelSelection()\">{{'filemanager.cancel_selection' |\r\n translate}}</button>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"jw-modal-background\"></div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #showContent>\r\n <div class=\"content\" style=\"direction: ltr;\">\r\n <div class=\"file-manager-navbar\">\r\n <div class=\"path\">\r\n <lib-filemanager-nav-bar></lib-filemanager-nav-bar>\r\n </div>\r\n\r\n <div class=\"navigation\">\r\n <lib-filemanager-navigation>\r\n <div class=\"button close\" (click)=\"fmShowHide(false)\" *ngIf=\"isPopup\">\r\n <i class=\"fileicon fas fa-2x fa-times\"></i>\r\n </div>\r\n </lib-filemanager-navigation>\r\n </div>\r\n </div>\r\n\r\n <div class=\"holder\">\r\n <div class=\"file-manager-left\">\r\n <lib-filemanager-tree [treeModel]=\"tree\">\r\n <ng-template let-nodes>\r\n <ng-container [ngTemplateOutletContext]=\"{$implicit: nodes}\"\r\n [ngTemplateOutlet]=\"iconTemplate ? iconTemplate : defaultIconTemplate\">\r\n </ng-container>\r\n </ng-template>\r\n </lib-filemanager-tree>\r\n </div>\r\n\r\n <div class=\"right\">\r\n <lib-filemanager-folder-content (openUploadDialog)=\"handleUploadDialog($event)\"\r\n (openNewFolderDialog)=\"handleNewFolderDialog($event)\"\r\n [folderContentTemplate]=\"folderContentTemplate ? folderContentTemplate : defaultFolderContentTemplate\"\r\n [folderContentNewFileTemplate]=\"folderContentNewFileTemplate ? folderContentNewFileTemplate : defaultFileContentNewTemplate\"\r\n [folderContentNewFolderTemplate]=\"folderContentNewFolderTemplate ? folderContentNewFolderTemplate : defaultFolderContentNewTemplate\"\r\n [folderContentReloadTemplate]=\"folderContentReloadTemplate ? folderContentReloadTemplate : defaultFolderContentReloadTemplate\"\r\n [folderContentBackTemplate]=\"folderContentBackTemplate ? folderContentBackTemplate : defaultFolderContentBackTemplate\">\r\n </lib-filemanager-folder-content>\r\n </div>\r\n\r\n <lib-filemanager-side-view id=\"side-view\" [node]=\"selectedNode\"\r\n [sideViewTemplate]=\"sideViewTemplate ? sideViewTemplate : defaultSideViewTemplate\"\r\n [allowFolderDownload]=\"tree.config.options.allowFolderDownload\"\r\n (clickEvent)=\"handleFileManagerClickEvent($event)\">\r\n </lib-filemanager-side-view>\r\n </div>\r\n </div>\r\n\r\n <lib-filemanager-upload *ngIf=\"newFileDialog\" [openDialog]=\"newFileDialog\" [openSelectFileDescription]=\"openSelectFileDescription\" (closeDialog)=\"handleUploadDialog(false)\"\r\n [optionSelectFileType]=\"configSelectFileType\"\r\n (createFile)=\"handleFileManagerClickEvent({type: 'createFile', payload: $event})\">\r\n </lib-filemanager-upload>\r\n <lib-filemanager-newfolder *ngIf=\"newFolderDialog\" [openDialog]=\"newFolderDialog\"\r\n (closeDialog)=\"handleNewFolderDialog(false)\"\r\n (createDir)=\"handleFileManagerClickEvent({type: 'createFolder', payload: $event})\">\r\n </lib-filemanager-newfolder>\r\n\r\n\r\n <lib-filemanager-loading-overlay *ngIf=\"loading\"\r\n [loadingOverlayTemplate]=\"loadingOverlayTemplate ? loadingOverlayTemplate : defaultLoadingOverlayTemplate\">\r\n </lib-filemanager-loading-overlay>\r\n\r\n\r\n <ntk-smart-modal identifier=\"searchModal\" #searchModal [closable]=\"true\">\r\n <h2 class=\"modal-title\" style=\"margin-bottom: 2px\"\r\n *ngIf=\"searchModal.hasData() && searchModal.getData().response.length !== 0\">\r\n {{'filemanager.search_results_for' | translate}}\r\n </h2>\r\n <h2 class=\"modal-title\" style=\"margin-bottom: 2px\"\r\n *ngIf=\"!searchModal.hasData() || searchModal.getData().response.length === 0\">\r\n {{'filemanager.no_results' | translate}}\r\n </h2>\r\n <div style=\"text-align: center\" *ngIf=\"searchModal.hasData()\">{{searchModal.getData().searchString}}</div>\r\n\r\n <div *ngIf=\"searchModal.hasData() && searchModal.getData().response.length !== 0\">\r\n <table style=\"margin: 0 auto\">\r\n <tr>\r\n <td class=\"table-item table-head\">{{'filemanager.file_name' | translate}}</td>\r\n <td class=\"table-item-short table-head\">{{'filemanager.size' | translate}}</td>\r\n </tr>\r\n <tr *ngFor=\"let item of searchModal.getData().response\" (click)=\"searchClicked(item)\">\r\n <td style=\"cursor: pointer\">\r\n <ng-container *ngIf=\"item.fileCategory === 'D'; else file\">\r\n <i class=\"fileicon fas fa-folder search-output-icon\"></i>\r\n </ng-container>\r\n <ng-template #file>\r\n <i class=\"fileicon fas fa-file search-output-icon\"></i>\r\n </ng-template>\r\n <span style=\"text-overflow: ellipsis;direction: ltr;\">{{item.name}}</span>\r\n </td>\r\n <td class=\"table-item-short\" style=\"direction: ltr;\">{{item.size}}</td>\r\n </tr>\r\n </table>\r\n </div>\r\n </ntk-smart-modal>\r\n <ntk-smart-modal identifier=\"waitModal\" [closable]=\"false\" [dismissable]=\"false\" [escapable]=\"false\">\r\n <div style=\"overflow-y: hidden\">\r\n <h2 class=\"modal-title\" style=\"margin-top: 20px\">\r\n {{'filemanager.processing_request' | translate}}...\r\n </h2>\r\n\r\n <div style=\"text-align: center; height: 70px\">\r\n <i class=\"fileicon fas fa-spinner fa-spin fa-4x\"></i>\r\n </div>\r\n </div>\r\n </ntk-smart-modal>\r\n <ntk-smart-modal identifier=\"errorModal\" [closable]=\"true\">\r\n <h2 class=\"modal-title\" style=\"margin-top: 20px\">\r\n {{'filemanager.something_went_wrong_with_your_request' | translate}}...\r\n </h2>\r\n </ntk-smart-modal>\r\n\r\n <ntk-smart-modal *ngIf=\"selectedNode\" identifier=\"confirmDeleteModal\" #deleteModal [dismissable]=\"false\"\r\n [closable]=\"false\">\r\n <h2 class=\"modal-title\">\r\n <span>{{'filemanager.file_delete_confirm' | translate}}</span>\r\n <span *ngIf=\"selectedNode.isFolder\">{{'filemanager.folder' | translate}}</span>\r\n <span *ngIf=\"!selectedNode.isFolder\">{{'filemanager.file' | translate}}</span>\r\n </h2>\r\n\r\n <div style=\"width: 100%; margin: 5px auto; text-align: center;direction: ltr;\">{{selectedNode.name}}</div>\r\n\r\n <div class=\"rename-button\">\r\n <button type=\"button\" class=\"button big\" (click)=\"handleFileManagerClickEvent({type: 'remove'})\">\r\n <span> {{'filemanager.yes_delete_this' | translate}} </span>\r\n <!-- <span *ngIf=\"selectedNode.isFolder\"> {{'filemanager.folder' | translate}} </span>\r\n <span *ngIf=\"!selectedNode.isFolder\"> {{'filemanager.file' | translate}} </span> -->\r\n </button>\r\n <button type=\"button\" class=\"button big\" (click)=\"deleteModal.close()\">\r\n {{'filemanager.cancel'|translate}}\r\n </button>\r\n </div>\r\n </ntk-smart-modal>\r\n <ntk-smart-modal identifier=\"renameModal\" [dismissable]=\"false\" [closable]=\"false\" *ngIf=\"selectedNode\" #renameModal>\r\n <h2 class=\"modal-title\">\r\n {{'filemanager.rename_file' | translate}}\r\n </h2>\r\n <p class=\"rename-name\" >\r\n {{'filemanager.old_name' | translate}}\r\n </p>\r\n <span style=\"margin: 8px;direction: ltr;\">{{selectedNode.name}}</span>\r\n <p class=\"rename-name\">\r\n {{'filemanager.new_name' | translate}}\r\n </p>\r\n <input type=\"text\" class=\"rename-input\" [value]=\"selectedNode.name\" #renameInput\r\n (keyup.enter)=\"handleFileManagerClickEvent({type: 'rename', value: renameInput.value})\">\r\n <br>\r\n\r\n <div class=\"rename-button\">\r\n <button type=\"button\" class=\"button big\"\r\n (click)=\"handleFileManagerClickEvent({type: 'rename', value: renameInput.value})\"\r\n [disabled]=\"renameInput.value === selectedNode.name || renameInput.value.length === 0\">\r\n {{'filemanager.rename' | translate}}\r\n </button>\r\n <button type=\"button\" class=\"button big\" (click)=\"renameModal.close()\">\r\n {{'filemanager.cancel' | translate}}\r\n </button>\r\n </div>\r\n\r\n </ntk-smart-modal>\r\n\r\n</ng-template>\r\n\r\n<ng-template let-node #defaultIconTemplate>\r\n <div class=\"file-manager-node\" style=\"display: inline-block; padding: 3px\">\r\n <div *ngIf=\"node.isFolder; then itIsFolder else showFile\"></div>\r\n\r\n <ng-template #itIsFolder>\r\n <ng-template [ngIf]=\"!node.isRoot\" [ngIfElse]=\"isFolderRoot\">\r\n <div *ngIf=\"node.isExpanded; then isFolderExpanded else isFolderClosed\"></div>\r\n </ng-template>\r\n </ng-template>\r\n\r\n <ng-template #showFile><i class=\"fileicon fas fa-file child\"></i></ng-template>\r\n <ng-template #isFolderExpanded><i class=\"fileicon fas fa-folder-open child\"></i></ng-template>\r\n <ng-template #isFolderClosed><i class=\"fileicon as fa-folder child\"></i></ng-template>\r\n <ng-template #isFolderRoot><i class=\"fileicon fas fa-home\"></i></ng-template>\r\n\r\n\r\n <span *ngIf=\"!node.isRoot\">{{node.name}}</span>\r\n </div>\r\n</ng-template>\r\n<ng-template let-node #defaultFolderContentTemplate>\r\n <div class=\"file-manager-item\" >\r\n <div class=\"file-preview\" >\r\n <div *ngIf=\"node.isFolder; then itIsFolder else showFile\" ></div>\r\n <ng-template #itIsFolder><i class=\"fileicon fas fa-3x fa-folder child\"></i></ng-template>\r\n <ng-template #showFile>\r\n <i *ngIf=\"!node.downloadThumbnailSrc || node.downloadThumbnailSrc?.length==0\" class=\"fileicon fas fa-3x fa-file child\"></i>\r\n <img *ngIf=\"node.downloadThumbnailSrc?.length>0\" src=\"{{node.downloadThumbnailSrc}}\" class=\"child thumbnail\" />\r\n </ng-template>\r\n </div>\r\n <div class=\"file-name\" >\r\n {{node.name}}\r\n </div>\r\n </div>\r\n</ng-template>\r\n<ng-template #defaultFolderContentNewTemplate>\r\n <div class=\"file-manager-item main\">\r\n <div class=\"file-preview\" style=\"width: 100%; height:100%\">\r\n <i class=\"fileicon fas fa-2x fa-plus child\" style=\"line-height: 2;color: black;\"></i>\r\n <br>\r\n {{'filemanager.create_new_folder' | translate}}\r\n </div>\r\n </div>\r\n</ng-template>\r\n<ng-template #defaultFileContentNewTemplate>\r\n <div class=\"file-manager-item main\">\r\n <div class=\"file-preview\" style=\"width: 100%; height:100%\">\r\n <i class=\"fileicon fas fa-2x fa-upload child\" style=\"line-height: 2;color: black;\"></i>\r\n <br>\r\n {{'filemanager.create_new_file' | translate}}\r\n </div>\r\n </div>\r\n</ng-template>\r\n<ng-template let-node #defaultFolderContentReloadTemplate>\r\n <div class=\"file-manager-item main\">\r\n <div class=\"file-preview\" style=\"width: 100%; height:100%\">\r\n <i class=\"fileicon fas fa-2x fa-sync-alt child\" style=\"line-height: 2;color: black;\"></i>\r\n </div>\r\n </div>\r\n</ng-template>\r\n<ng-template let-node #defaultFolderContentBackTemplate>\r\n <div class=\"file-manager-item\">\r\n <div class=\"file-preview\" style=\"width: 100%; height:100%\">\r\n <i class=\"fileicon fas fa-2x fa-ellipsis-h\" style=\"line-height: 5\"></i>\r\n </div>\r\n </div>\r\n</ng-template>\r\n<ng-template let-timeoutMessage #defaultLoadingOverlayTemplate>\r\n <div class=\"file-manager-backdrop loading\" (click)=\"backdropClicked()\">\r\n <div class=\"file-manager-error\" *ngIf=\"timeoutMessage\">{{timeoutMessage | translate}}</div>\r\n </div>\r\n <div class=\"spinner\">\r\n <i class=\"fileicon fas fa-5x fa-spin fa-sync-alt\"></i>\r\n </div>\r\n</ng-template>\r\n<ng-template let-node #defaultSideViewTemplate>\r\n <div style=\"position: absolute; bottom: 0; width: 100%; margin: 5px auto\">\r\n <span *ngIf=\"node.isFolder\">\r\n <span>\r\n {{'filemanager.created_date' | translate}}: {{node.createdDate}}\r\n </span>\r\n </span>\r\n <span *ngIf=\"!node.isFolder\">\r\n <span>\r\n {{'filemanager.created_date' | translate}}: {{node.createdDate}}\r\n </span>\r\n <br />\r\n <span>\r\n {{'filemanager.type' | translate}}: {{node.type}}\r\n </span>\r\n <br />\r\n <span>\r\n {{'filemanager.size' | translate}}: {{node.size}}\r\n </span>\r\n <br />\r\n <span *ngIf=\"!AllowFileView(selectedNode)\" style=\"color:red;\">\r\n Only Select : {{configSelectFileType.join(' - ')}}\r\n </span>\r\n </span>\r\n </div>\r\n</ng-template>\r\n\r\n", styles: [".holder{display:flex;height:calc(100% - 25px)}.path{margin:auto 0;display:block}.navigation{margin:auto 0;display:flex}.navigation .button{margin:0 10px;padding:0;position:relative}.thumbnail{width:62px}.right{width:100%;overflow:auto}.file-name{width:100px;height:25px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;box-sizing:border-box;-webkit-user-select:none;user-select:none}.file-preview{margin:auto}.file-preview i{line-height:1.5}.spinner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);cursor:progress}.rename-button{margin:20px auto;display:block;text-align:center}.modal-title{margin-top:5px;text-align:center}.search-output{margin:15px 0}.search-output-icon{margin:2px 5px}.table-item{width:80%}.table-item-short{width:20%;text-align:right}.buttons-panel{text-align:right}.modal{display:none}.modal .jw-modal{position:fixed;inset:0;z-index:1000;overflow:auto}.modal .jw-modal .jw-modal-body{padding:20px;background:#fff;margin:40px}.modal .jw-modal-background{pointer-events:none;cursor:default;text-decoration:none;color:#000;position:fixed;inset:0;background-color:#000;opacity:.75;z-index:900}body.jw-modal-open{overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.NtkSmartModalComponent, selector: "ntk-smart-modal", inputs: ["closable", "escapable", "dismissable", "identifier", "customClass", "visible", "backdrop", "force", "hideDelay", "autostart", "target", "ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "refocus"], outputs: ["visibleChange", "onClose", "onCloseFinished", "onDismiss", "onDismissFinished", "onAnyCloseEvent", "onAnyCloseEventFinished", "onOpen", "onOpenFinished", "onEscape", "onDataAdded", "onDataRemoved"] }, { kind: "component", type: FolderContentComponent, selector: "lib-filemanager-folder-content", inputs: ["folderContentTemplate", "folderContentBackTemplate", "folderContentNewFolderTemplate", "folderContentNewFileTemplate", "folderContentReloadTemplate"], outputs: ["openUploadDialog", "openNewFolderDialog"] }, { kind: "component", type: TreeComponent, selector: "lib-filemanager-tree", inputs: ["treeModel", "config"] }, { kind: "component", type: NavBarComponent, selector: "lib-filemanager-nav-bar" }, { kind: "component", type: NavigationComponent, selector: "lib-filemanager-navigation" }, { kind: "component", type: LoadingOverlayComponent, selector: "lib-filemanager-loading-overlay", inputs: ["loadingOverlayTemplate"] }, { kind: "component", type: UploadComponent, selector: "lib-filemanager-upload", inputs: ["optionSelectFileType", "openDialog", "openSelectFileDescription", "openDirectUploadSave", "openDirectUploadView"], outputs: ["createFile", "closeDialog"] }, { kind: "component", type: NewFolderComponent, selector: "lib-filemanager-newfolder", inputs: ["openDialog"], outputs: ["buttonClicked", "closeDialog", "createDir"] }, { kind: "component", type: SideViewComponent, selector: "lib-filemanager-side-view", inputs: ["sideViewTemplate", "node", "allowFolderDownload"], outputs: ["clickEvent"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmsFileManagerComponent, decorators: [{
type: Component,
args: [{ selector: 'cms-file-manager', standalone: false, encapsulation: ViewEncapsulation.None, template: "<ng-container *ngIf=\"isPopup; then itIsPopup else showContent\"></ng-container>\r\n\r\n\r\n<ng-template #itIsPopup>\r\n <div>\r\n <button type=\"button\" class=\"button big\" (click)=\"fmShowHide(true)\" [disabled]=\"openPopupForm\"\r\n *ngIf=\"openFilemanagerButtonView\">{{openFilemanagerButtonLabel}}</button>\r\n </div>\r\n <div class=\"modal\" #mainModal>\r\n <div class=\"jw-modal-body\">\r\n <div class=\"jw-modal\">\r\n <br>\r\n <div *ngIf=\"this.openPopupForm; then showContent\"></div>\r\n <div class=\"buttons-panel\">\r\n <button type=\"button\" class=\"button big\" (click)=\"confirmSelection()\"\r\n [disabled]=\"!allowConfirmSelection(selectedNode)\">{{'filemanager.confirm_selection' | translate}}</button>\r\n <button type=\"button\" class=\"button big\" (click)=\"cancelSelection()\">{{'filemanager.cancel_selection' |\r\n translate}}</button>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"jw-modal-background\"></div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #showContent>\r\n <div class=\"content\" style=\"direction: ltr;\">\r\n <div class=\"file-manager-navbar\">\r\n <div class=\"path\">\r\n <lib-filemanager-nav-bar></lib-filemanager-nav-bar>\r\n </div>\r\n\r\n <div class=\"navigation\">\r\n <lib-filemanager-navigation>\r\n <div class=\"button close\" (click)=\"fmShowHide(false)\" *ngIf=\"isPopup\">\r\n <i class=\"fileicon fas fa-2x fa-times\"></i>\r\n </div>\r\n </lib-filemanager-navigation>\r\n </div>\r\n </div>\r\n\r\n <div class=\"holder\">\r\n <div class=\"file-manager-left\">\r\n <lib-filemanager-tree [treeModel]=\"tree\">\r\n <ng-template let-nodes>\r\n <ng-container [ngTemplateOutletContext]=\"{$implicit: nodes}\"\r\n [ngTemplateOutlet]=\"iconTemplate ? iconTemplate : defaultIconTemplate\">\r\n </ng-container>\r\n </ng-template>\r\n </lib-filemanager-tree>\r\n </div>\r\n\r\n <div class=\"right\">\r\n <lib-filemanager-folder-content (openUploadDialog)=\"handleUploadDialog($event)\"\r\n (openNewFolderDialog)=\"handleNewFolderDialog($event)\"\r\n [folderContentTemplate]=\"folderContentTemplate ? folderContentTemplate : defaultFolderContentTemplate\"\r\n [folderContentNewFileTemplate]=\"folderContentNewFileTemplate ? folderContentNewFileTemplate : defaultFileContentNewTemplate\"\r\n [folderContentNewFolderTemplate]=\"folderContentNewFolderTemplate ? folderContentNewFolderTemplate : defaultFolderContentNewTemplate\"\r\n [folderContentReloadTemplate]=\"folderContentReloadTemplate ? folderContentReloadTemplate : defaultFolderContentReloadTemplate\"\r\n [folderContentBackTemplate]=\"folderContentBackTemplate ? folderContentBackTemplate : defaultFolderContentBackTemplate\">\r\n </lib-filemanager-folder-content>\r\n </div>\r\n\r\n <lib-filemanager-side-view id=\"side-view\" [node]=\"selectedNode\"\r\n [sideViewTemplate]=\"sideViewTemplate ? sideViewTemplate : defaultSideViewTemplate\"\r\n [allowFolderDownload]=\"tree.config.options.allowFolderDownload\"\r\n (clickEvent)=\"handleFileManagerClickEvent($event)\">\r\n </lib-filemanager-side-view>\r\n </div>\r\n </div>\r\n\r\n <lib-filemanager-upload *ngIf=\"newFileDialog\" [openDialog]=\"newFileDialog\" [openSelectFileDescription]=\"openSelectFileDescription\" (closeDialog)=\"handleUploadDialog(false)\"\r\n [optionSelectFileType]=\"configSelectFileType\"\r\n (createFile)=\"handleFileManagerClickEvent({type: 'createFile', payload: $event})\">\r\n </lib-filemanager-upload>\r\n <lib-filemanager-newfolder *ngIf=\"newFolderDialog\" [openDialog]=\"newFolderDialog\"\r\n (closeDialog)=\"handleNewFolderDialog(false)\"\r\n (createDir)=\"handleFileManagerClickEvent({type: 'createFolder', payload: $event})\">\r\n </lib-filemanager-newfolder>\r\n\r\n\r\n <lib-filemanager-loading-overlay *ngIf=\"loading\"\r\n [loadingOverlayTemplate]=\"loadingOverlayTemplate ? loadingOverlayTemplate : defaultLoadingOverlayTemplate\">\r\n </lib-filemanager-loading-overlay>\r\n\r\n\r\n <ntk-smart-modal identifier=\"searchModal\" #searchModal [closable]=\"true\">\r\n <h2 class=\"modal-title\" style=\"margin-bottom: 2px\"\r\n *ngIf=\"searchModal.hasData() && searchModal.getData().response.length !== 0\">\r\n {{'filemanager.search_results_for' | translate}}\r\n </h2>\r\n <h2 class=\"modal-title\" style=\"margin-bottom: 2px\"\r\n *ngIf=\"!searchModal.hasData() || searchModal.getData().response.length === 0\">\r\n {{'filemanager.no_results' | translate}}\r\n </h2>\r\n <div style=\"text-align: center\" *ngIf=\"searchModal.hasData()\">{{searchModal.getData().searchString}}</div>\r\n\r\n <div *ngIf=\"searchModal.hasData() && searchModal.getData().response.length !== 0\">\r\n <table style=\"margin: 0 auto\">\r\n <tr>\r\n <td class=\"table-item table-head\">{{'filemanager.file_name' | translate}}</td>\r\n <td class=\"table-item-short table-head\">{{'filemanager.size' | translate}}</td>\r\n </tr>\r\n <tr *ngFor=\"let item of searchModal.getData().response\" (click)=\"searchClicked(item)\">\r\n <td style=\"cursor: pointer\">\r\n <ng-container *ngIf=\"item.fileCategory === 'D'; else file\">\r\n <i class=\"fileicon fas fa-folder search-output-icon\"></i>\r\n </ng-container>\r\n <ng-template #file>\r\n <i class=\"fileicon fas fa-file search-output-icon\"></i>\r\n </ng-template>\r\n <span style=\"text-overflow: ellipsis;direction: ltr;\">{{item.name}}</span>\r\n </td>\r\n <td class=\"table-item-short\" style=\"direction: ltr;\">{{item.size}}</td>\r\n </tr>\r\n </table>\r\n </div>\r\n </ntk-smart-modal>\r\n <ntk-smart-modal identifier=\"waitModal\" [closable]=\"false\" [dismissable]=\"false\" [escapable]=\"false\">\r\n <div style=\"overflow-y: hidden\">\r\n <h2 class=\"modal-title\" style=\"margin-top: 20px\">\r\n {{'filemanager.processing_request' | translate}}...\r\n </h2>\r\n\r\n <div style=\"text-align: center; height: 70px\">\r\n <i class=\"fileicon fas fa-spinner fa-spin fa-4x\"></i>\r\n </div>\r\n </div>\r\n </ntk-smart-modal>\r\n <ntk-smart-modal identifier=\"errorModal\" [closable]=\"true\">\r\n <h2 class=\"modal-title\" style=\"margin-top: 20px\">\r\n {{'filemanager.something_went_wrong_with_your_request' | translate}}...\r\n </h2>\r\n </ntk-smart-modal>\r\n\r\n <ntk-smart-modal *ngIf=\"selectedNode\" identifier=\"confirmDeleteModal\" #deleteModal [dismissable]=\"false\"\r\n [closable]=\"false\">\r\n <h2 class=\"modal-title\">\r\n <span>{{'filemanager.file_delete_confirm' | translate}}</span>\r\n <span *ngIf=\"selectedNode.isFolder\">{{'filemanager.folder' | translate}}</span>\r\n <span *ngIf=\"!selectedNode.isFolder\">{{'filemanager.file' | translate}}</span>\r\n </h2>\r\n\r\n <div style=\"width: 100%; margin: 5px auto; text-align: center;direction: ltr;\">{{selectedNode.name}}</div>\r\n\r\n <div class=\"rename-button\">\r\n <button type=\"button\" class=\"button big\" (click)=\"handleFileManagerClickEvent({type: 'remove'})\">\r\n <span> {{'filemanager.yes_delete_this' | translate}} </span>\r\n <!-- <span *ngIf=\"selectedNode.isFolder\"> {{'filemanager.folder' | translate}} </span>\r\n <span *ngIf=\"!selectedNode.isFolder\"> {{'filemanager.file' | translate}} </span> -->\r\n </button>\r\n <button type=\"button\" class=\"button big\" (click)=\"deleteModal.close()\">\r\n {{'filemanager.cancel'|translate}}\r\n </button>\r\n </div>\r\n </ntk-smart-modal>\r\n <ntk-smart-modal identifier=\"renameModal\" [dismissable]=\"false\" [closable]=\"false\" *ngIf=\"selectedNode\" #renameModal>\r\n <h2 class=\"modal-title\">\r\n {{'filemanager.rename_file' | translate}}\r\n </h2>\r\n <p class=\"rename-name\" >\r\n {{'filemanager.old_name' | translate}}\r\n </p>\r\n <span style=\"margin: 8px;direction: ltr;\">{{selectedNode.name}}</span>\r\n <p class=\"rename-name\">\r\n {{'filemanager.new_name' | translate}}\r\n </p>\r\n <input type=\"text\" class=\"rename-input\" [value]=\"selectedNode.name\" #renameInput\r\n (keyup.enter)=\"handleFileManagerClickEvent({type: 'rename', value: renameInput.value})\">\r\n <br>\r\n\r\n <div class=\"rename-button\">\r\n <button type=\"button\" class=\"button big\"\r\n (click)=\"handleFileManagerClickEvent({type: 'rename', value: renameInput.value})\"\r\n [disabled]=\"renameInput.value === selectedNode.name || renameInput.value.length === 0\">\r\n {{'filemanager.rename' | translate}}\r\n </button>\r\n <button type=\"button\" class=\"button big\" (click)=\"renameModal.close()\">\r\n {{'filemanager.cancel' | translate}}\r\n </button>\r\n </div>\r\n\r\n </ntk-smart-modal>\r\n\r\n</ng-template>\r\n\r\n<ng-template let-node #defaultIconTemplate>\r\n <div class=\"file-manager-node\" style=\"display: inline-block; padding: 3px\">\r\n <div *ngIf=\"node.isFolder; then itIsFolder else showFile\"></div>\r\n\r\n <ng-template #itIsFolder>\r\n <ng-template [ngIf]=\"!node.isRoot\" [ngIfElse]=\"isFolderRoot\">\r\n <div *ngIf=\"node.isExpanded; then isFolderExpanded else isFolderClosed\"></div>\r\n </ng-template>\r\n </ng-template>\r\n\r\n <ng-template #showFile><i class=\"fileicon fas fa-file child\"></i></ng-template>\r\n <ng-template #isFolderExpanded><i class=\"fileicon fas fa-folder-open child\"></i></ng-template>\r\n <ng-template #isFolderClosed><i class=\"fileicon as fa-folder child\"></i></ng-template>\r\n <ng-template #isFolderRoot><i class=\"fileicon fas fa-home\"></i></ng-template>\r\n\r\n\r\n <span *ngIf=\"!node.isRoot\">{{node.name}}</span>\r\n </div>\r\n</ng-template>\r\n<ng-template let-node #defaultFolderContentTemplate>\r\n <div class=\"file-manager-item\" >\r\n <div class=\"file-preview\" >\r\n <div *ngIf=\"node.isFolder; then itIsFolder else showFile\" ></div>\r\n <ng-template #itIsFolder><i class=\"fileicon fas fa-3x fa-folder child\"></i></ng-template>\r\n <ng-template #showFile>\r\n <i *ngIf=\"!node.downloadThumbnailSrc || node.downloadThumbnailSrc?.length==0\" class=\"fileicon fas fa-3x fa-file child\"></i>\r\n <img *ngIf=\"node.downloadThumbnailSrc?.length>0\" src=\"{{node.downloadThumbnailSrc}}\" class=\"child thumbnail\" />\r\n </ng-template>\r\n </div>\r\n <div class=\"file-name\" >\r\n {{node.name}}\r\n </div>\r\n </div>\r\n</ng-template>\r\n<ng-template #defaultFolderContentNewTemplate>\r\n <div class=\"file-manager-item main\">\r\n <div class=\"file-preview\" style=\"width: 100%; height:100%\">\r\n <i class=\"fileicon fas fa-2x fa-plus child\" style=\"line-height: 2;color: black;\"></i>\r\n <br>\r\n {{'filemanager.create_new_folder' | translate}}\r\n </div>\r\n </div>\r\n</ng-template>\r\n<ng-template #defaultFileContentNewTemplate>\r\n <div class=\"file-manager-item main\">\r\n <div class=\"file-preview\" style=\"width: 100%; height:100%\">\r\n <i class=\"fileicon fas fa-2x fa-upload child\" style=\"line-height: 2;color: black;\"></i>\r\n <br>\r\n {{'filemanager.create_new_file' | translate}}\r\n </div>\r\n </div>\r\n</ng-template>\r\n<ng-template let-node #defaultFolderContentReloadTemplate>\r\n <div class=\"file-manager-item main\">\r\n <div class=\"file-preview\" style=\"width: 100%; height:100%\">\r\n <i class=\"fileicon fas fa-2x fa-sync-alt child\" style=\"line-height: 2;color: black;\"></i>\r\n </div>\r\n </div>\r\n</ng-template>\r\n<ng-template let-node #defaultFolderContentBackTemplate>\r\n <div class=\"file-manager-item\">\r\n <div class=\"file-preview\" style=\"width: 100%; height:100%\">\r\n <i class=\"fileicon fas fa-2x fa-ellipsis-h\" style=\"line-height: 5\"></i>\r\n </div>\r\n </div>\r\n</ng-template>\r\n<ng-template let-timeoutMessage #defaultLoadingOverlayTemplate>\r\n <div class=\"file-manager-backdrop loading\" (click)=\"backdropClicked()\">\r\n <div class=\"file-manager-error\" *ngIf=\"timeoutMessage\">{{timeoutMessage | translate}}</div>\r\n </div>\r\n <div class=\"spinner\">\r\n <i class=\"fileicon fas fa-5x fa-spin fa-sync-alt\"></i>\r\n </div>\r\n</ng-template>\r\n<ng-template let-node #defaultSideViewTemplate>\r\n <div style=\"position: absolute; bottom: 0; width: 100%; margin: 5px auto\">\r\n <span *ngIf=\"node.isFolder\">\r\n <span>\r\n {{'filemanager.created_date' | translate}}: {{node.createdDate}}\r\n </span>\r\n </span>\r\n <span *ngIf=\"!node.isFolder\">\r\n <span>\r\n {{'filemanager.created_date' | translate}}: {{node.createdDate}}\r\n </span>\r\n <br />\r\n <span>\r\n {{'filemanager.type' | translate}}: {{node.type}}\r\n </span>\r\n <br />\r\n <span>\r\n {{'filemanager.size' | translate}}: {{node.size}}\r\n </span>\r\n <br />\r\n <span *ngIf=\"!AllowFileView(selectedNode)\" style=\"color:red;\">\r\n Only Select : {{configSelectFileType.join(' - ')}}\r\n </span>\r\n </span>\r\n </div>\r\n</ng-template>\r\n\r\n", styles: [".holder{display:flex;height:calc(100% - 25px)}.path{margin:auto 0;display:block}.navigation{margin:auto 0;display:flex}.navigation .button{margin:0 10px;padding:0;position:relative}.thumbnail{width:62px}.right{width:100%;overflow:auto}.file-name{width:100px;height:25px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;box-sizing:border-box;-webkit-user-select:none;user-select:none}.file-preview{margin:auto}.file-preview i{line-height:1.5}.spinner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);cursor:progress}.rename-button{margin:20px auto;display:block;text-align:center}.modal-title{margin-top:5px;text-align:center}.search-output{margin:15px 0}.search-output-icon{margin:2px 5px}.table-item{width:80%}.table-item-short{width:20%;text-align:right}.buttons-panel{text-align:right}.modal{display:none}.modal .jw-modal{position:fixed;inset:0;z-index:1000;overflow:auto}.modal .jw-modal .jw-modal-body{padding:20px;background:#fff;margin:40px}.modal .jw-modal-background{pointer-events:none;cursor:default;text-decoration:none;color:#000;position:fixed;inset:0;background-color:#000;opacity:.75;z-index:900}body.jw-modal-open{overflow:hidden}\n"] }]
}], ctorParameters: () => [{ type: FileManagerStoreService }, { type: NodeService }, { type: NodeClickedService }, { type: i4.NtkSmartModalService }, { type: i1$1.TranslateService }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: TranslateUiService }], propDecorators: { language: [{
type: Input
}], iconTemplate: [{
type: Input
}], folderContentTemplate: [{
type: Input
}], folderContentBackTemplate: [{
type: Input
}], folderContentNewFileTemplate: [{
type: Input
}], folderContentNewFolderTemplate: [{
type: Input
}], folderContentReloadTemplate: [{
type: Input
}], openFilemanagerButtonView: [{
type: Input
}], openDirectUploadSave: [{
type: Input
}], openDirectUploadView: [{
type: Input
}], loadingOverlayTemplate: [{
type: Input
}], sideViewTemplate: [{
type: Input
}], selectFileType: [{
type: Input
}], tree: [{
type: Input
}], isPopup: [{
type: Input
}], openFilemanagerButtonLabelKey: [{
type: Input
}], openSelectFileDescription: [{
type: Input
}], itemClicked: [{
type: Output
}], itemSelected: [{
type: Output
}], openFormChange: [{
type: Output
}], openForm: [{
type: Input
}], mainModal: [{
type: ViewChild,
args: ['mainModal']
}] } });
/*
* Convert bytes into largest possible unit.
* Takes an precision argument that defaults to 2.
* Usage:
* bytes | fileSize:precision
* Example:
* {{ 1024 | fileSize}}
* formats to: 1 KB
*/
class FileSizePipe {
constructor() {
this.units = [
'bytes',
'KB',
'MB',
'GB',
'TB',
'PB'
];
}
transform(bytes = 0, precision = 2) {
if (isNaN(parseFloat(String(bytes))) || !isFinite(bytes))
return '?';
let unit = 0;
while (bytes >= 1024) {
bytes /= 1024;
unit++;
}
return bytes.toFixed(+precision) + ' ' + this.units[unit];
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: FileSizePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.1.7", ngImport: i0, type: FileSizePipe, isStandalone: false, name: "fileSize" }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: FileSizePipe, decorators: [{
type: Pipe,
args: [{
name: 'fileSize',
standalone: false
}]
}] });
class MapToIterablePipe {
transform(dict) {
const a = [];
for (const keyItem in dict) {
if (dict.hasOwnProperty(keyItem)) {
a.push({ key: keyItem, val: dict[keyItem] });
}
}
return a;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: MapToIterablePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.1.7", ngImport: i0, type: MapToIterablePipe, isStandalone: false, name: "mapToIterablePipe" }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: MapToIterablePipe, decorators: [{
type: Pipe,
args: [{
name: 'mapToIterablePipe',
standalone: false
}]
}] });
class CmsFileManagerModule {
static forRoot() {
return {
ngModule: CmsFileManagerModule,
providers: [TranslateService],
};
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmsFileManagerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.7", ngImport: i0, type: CmsFileManagerModule, declarations: [CmsFileManagerComponent,
FolderContentComponent,
NodeComponent,
TreeComponent,
NodeListerComponent,
NavBarComponent,
NavigationComponent,
LoadingOverlayComponent,
UploadComponent,
NewFolderComponent,
SideViewComponent,
MapToIterablePipe,
FileSizePipe], imports: [CommonModule,
TranslateModule, i4.NtkSmartModalModule, FilePickerModule], exports: [CmsFileManagerComponent] }); }
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmsFileManagerModule, providers: [
provideHttpClient(withInterceptorsFromDi()),
FileContentService,
FileCategoryService,
TranslateUiService,
NodeClickedService,
NodeService,
FileManagerStoreService,
], imports: [CommonModule,
TranslateModule,
NtkSmartModalModule.forRoot(),
FilePickerModule] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmsFileManagerModule, decorators: [{
type: NgModule,
args: [{
declarations: [
CmsFileManagerComponent,
FolderContentComponent,
NodeComponent,
TreeComponent,
NodeListerComponent,
NavBarComponent,
NavigationComponent,
LoadingOverlayComponent,
UploadComponent,
NewFolderComponent,
SideViewComponent,
MapToIterablePipe,
FileSizePipe,
],
imports: [
CommonModule,
TranslateModule,
NtkSmartModalModule.forRoot(),
FilePickerModule,
],
exports: [CmsFileManagerComponent],
providers: [
provideHttpClient(withInterceptorsFromDi()),
FileContentService,
FileCategoryService,
TranslateUiService,
NodeClickedService,
NodeService,
FileManagerStoreService,
],
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
export { CmsFileManagerComponent, CmsFileManagerModule, ComponentOptionModel, DownloadModeEnum, FolderContentComponent, LoadingOverlayComponent, NavBarComponent, NavigationComponent, NewFolderComponent, NodeComponent, NodeListerComponent, NodeService, SideViewComponent, TranslateUiService, TreeComponent, TreeModel, UploadComponent };
//# sourceMappingURL=ntk-cms-filemanager.mjs.map