import { Component , ElementRef , Input , NgZone , OnChanges , OnInit , ViewChild , } from "@angular/core" ; import { Router } from "@angular/router" ; import { NgxFileDropEntry , FileSystemFileEntry } from "ngx-file-drop" ; import { ILoading , OptimizationService , ContextMenuService , DialogService , SetService , ElectronService } from "../../../core/services" ; import { FilesSet , ViewMode , AppFile , IFile , saveSet } from "../../../data" ; import { DropdownService } from "../dropdown/dropdown.service" ; import { ImportAnimation , FooterAnimation , LoadingBar , ViewTransition , } from "./images.animations" ; @ Component ( { selector : "app-images" , templateUrl : "./images.component.html" , styleUrls : [ "./images.component.scss" ] , animations : [ ImportAnimation , FooterAnimation , LoadingBar , ViewTransition ] , } ) export class ImagesComponent implements OnChanges , OnInit { @ Input ( ) set : FilesSet ; @ Input ( ) noFilesTitle = "Drop images here to add them to the list" ; @ ViewChild ( "inputFiles" , { static : false } ) inputFiles : ElementRef ; public loading : ILoading ; public dropdownIsClosed = false ; copiedSVGCode : string ; selectedFiles : AppFile [ ] = [ ] ; constructor ( public router , private optimizationService , private contextMenuService , private dialogService , private dropdownService , private setService , private electronService , private zone ) { this . dropdownService . setList ( this . set ) ; } ngOnInit ( ) { this . optimizationService . loading . subscribe ( ( loadingStatus ) => { this . loading = loadingStatus ; } ) ; this . set . setStatistics ( ) ; this . electronService . ipcRenderer . once ( "set-files-from-system" , ( event , paths ) => { console . log ( 'Process files from system: ' , paths , this . set . files ) ; this . zone . run ( ( ) => { paths . forEach ( ( path ) => { if ( ! this . duplicateCheck ( path ) ) { this . set . addFile ( new AppFile ( new IFile ( path , "" ) ) ) ; } } ) ; } ) ; this . set . setStatistics ( ) ; saveSet ( this . set . id ) ; } ) ; } ngOnChanges ( ) { if ( this . set . files . length ) { this . set . files . forEach ( ( file ) => { if ( file . selected ) { file . selected = false ; } this . dialogService . closeDialog ( ) ; } ) ; } this . dropdownService . setList ( this . set ) ; this . set . setStatistics ( ) ; this . setService . saveSets ( ) ; } public async optimizeFiles ( ) { if ( this . set . statistics . notOptimized ) { await this . optimizationService . setOptimization ( this . set ) ; this . set . setStatistics ( ) ; } } public stopProcess ( ) { this . optimizationService . stopProcess ( ) ; } public dropped ( files ) { console . time ( `Processing ${ files . length } files` ) ; for ( const droppedFile of files ) { this . setFile ( droppedFile ) ; } saveSet ( this . set . id ) ; console . timeEnd ( `Processing ${ files . length } files` ) ; } public getFilesFromSystem ( ) { const files = this . inputFiles . nativeElement . files ; this . setFilesFromSystem ( files ) ; this . set . setStatistics ( ) ; saveSet ( this . set . id ) ; console . log ( `%c${ files . length } files added` , "font-weight: bold" ) ; } public setFilesFromSystem ( files ) { for ( const file of files ) { if ( ! this . duplicateCheck ( file . path ) ) { this . set . addFile ( new AppFile ( new IFile ( file . path , file . type , file . name , file . size , undefined , file . lastModified ) ) ) ; } } } private setFile ( droppedFile ) { if ( /\.(gif|jpg|jpeg|tiff|png|svg|sketch|webp)$/i . test ( droppedFile . fileEntry . name ) ) { const fileEntry = droppedFile . fileEntry as FileSystemFileEntry ; fileEntry . file ( ( converted ) => { if ( ! this . duplicateCheck ( converted . path ) ) { const appFile = new AppFile ( new IFile ( converted . path , converted . type ? converted . type : "sketch" , converted . name , converted . size , undefined , converted . lastModified ) ) ; this . set . addFile ( appFile ) ; } else { console . warn ( "File duplicate found" ) ; } } ) ; } else { console . warn ( "File format is not supported" ) ; } } private duplicateCheck ( path ) { return this . set . files . find ( ( source ) => source . original . path === path ) ; } public removeSelectedFiles ( ) { this . zone . run ( ( ) => { this . set . removeFiles ( this . selectedFiles ) ; } ) ; } public selectFile ( file ) { if ( file . selected ) { delete file . selected ; this . selectedFiles = this . selectedFiles . filter ( ( _file ) => _file . id !== file . id ) ; } else { file . selected = true ; this . selectedFiles . push ( file ) ; } this . dropdownService . setList ( this . set ) ; } public onRightClick ( file ) { if ( this . selectedFiles . length > 1 ) { this . contextMenuService . showOnSelectedFiles ( this . selectedFiles , this . set ) ; } else { this . contextMenuService . showOnFile ( file , this . set ) ; } } public onRightClickBody ( ) { this . contextMenuService . showOnBody ( this . set ) ; } public setTitle ( ) { saveSet ( this . set . id ) ; } public getOptimizedFiles ( ) { return this . set . files . length - this . set . statistics . notOptimized ; } public switchViewMode ( ) { this . set . viewMode = this . set . viewMode === ViewMode . grid ? ViewMode . list : ViewMode . grid ; saveSet ( this . set . id ) ; } public isItTemporarySet ( ) { return this . setService . isItStaticSet ( this . set . id ) ; } public setFolder ( ) { this . setService . exportFolder ( this . set . id ) ; } }