import { Component , EventEmitter , Input , OnChanges , OnInit , Output , SimpleChanges } from '@angular/core' ; import { FileElement } from '../../model/file-element' ; import { FileMetadata } from '../../model/metadata' ; import { BehaviorSubject } from 'rxjs' ; @ Component ( { selector : 'cmdb-folder-tree' , templateUrl : './folder-tree.component.html' , styleUrls : [ './folder-tree.component.scss' ] } ) export class FolderTreeComponent implements OnInit , OnChanges { private elementFileTree : FileElement [ ] = [ ] ; private metadata : FileMetadata = new FileMetadata ( ) ; private selectedFileElement : any ; @ Input ( ) set fileTree ( value ) { this . elementFileTree = value ; } get fileTree ( ) : FileElement [ ] { return this . elementFileTree ; } @ Input ( ) set selectedFileFolder ( value ) { this . selectedFileElement = value ; } get selectedFileFolder ( ) : BehaviorSubject < FileElement > { return this . selectedFileElement ; } /**
     * Marks a property in a child component as a
     * doorway through which data can travel from the child to the parent.
     */ @ Output ( ) createFileElementEvent = new EventEmitter < any > ( ) ; @ Output ( ) renameFileElementEvent = new EventEmitter < any > ( ) ; @ Output ( ) moveFileElementEvent = new EventEmitter < any > ( ) ; @ Output ( ) deleteFileElementEvent = new EventEmitter < any > ( ) ; @ Output ( ) loadFileElementEvent = new EventEmitter < any > ( ) ; constructor ( ) { } static createFolderTree ( arr ) { const tree = [ ] ; const mappedArr = { } ; let arrElem ; let mappedElem ; for ( let i = 0 , len = arr . length ; i < len ; i ++ ) { arrElem = arr [ i ] ; mappedArr [ arrElem . public_id ] = arrElem ; mappedArr [ arrElem . public_id ] . children = [ ] ; } for ( const id in mappedArr ) { if ( mappedArr . hasOwnProperty ( id ) ) { mappedElem = mappedArr [ id ] ; if ( mappedElem . metadata . parent ) { mappedArr [ mappedElem . metadata . parent ] . children . push ( mappedElem ) ; } else { tree . push ( mappedElem ) ; } } } return [ { filename : '' , public_id : null , hasSubFolders : true , children : tree , metadata : { parent : null } } ] ; } ngOnInit ( ) { this . fileTree = FolderTreeComponent . createFolderTree ( this . fileTree ) ; } ngOnChanges ( changes ) { if ( changes . fileTree ) { this . fileTree = FolderTreeComponent . createFolderTree ( changes . fileTree . currentValue ) ; } } public dropTree ( event , value ) { if ( value . children && value . children . length > 0 ) { this . selectedFileFolder . next ( value ) ; value . hasSubFolders = ! value . hasSubFolders ; event . stopPropagation ( ) ; } } public loadFolderFiles ( value ) { this . selectedFileFolder . next ( value ) ; this . loadFileElementEvent . emit ( ) ; } public createFolder ( ) { this . createFileElementEvent . emit ( ) ; } public renameFolder ( ) { this . renameFileElementEvent . emit ( ) ; } public moveFolder ( ) { this . moveFileElementEvent . emit ( ) ; } public deleteFolder ( value ) { this . deleteFileElementEvent . emit ( value ) ; } public loadContextMenu ( ) { console . log ( 'loadContextMenu TODO' ) ; } }