@ -1,4 +1,4 @@
import { Component , OnInit , OnDestroy } from '@angular/core' ;
import { Component , OnInit , OnDestroy , ViewChild } from '@angular/core' ;
import { HttpClient , HttpHeaders } from '@angular/common/http' ;
import { Router , ActivatedRoute } from '@angular/router' ;
import { Observable } from 'rxjs/Observable' ;
@ -10,6 +10,11 @@ import * as formData from 'form-data';
import { forEach } from '@angular/router/src/utils/collection' ;
import { type } from 'os' ;
import { DomSanitizer } from '@angular/platform-browser' ;
//import { Dropzone } from 'dropzone';
import { DropzoneComponent , DropzoneDirective ,
DropzoneConfigInterface } from 'ngx-dropzone-wrapper' ;
@Component ( {
selector : 'app-book' ,
@ -29,13 +34,101 @@ export class BookComponent implements OnInit, OnDestroy {
inputCreateFolder : String ;
reader : FileReader ;
test : String ;
constructor ( private http : HttpClient , private router : Router , private route : ActivatedRoute , public sanitizer : DomSanitizer ) {
previewNode :any ;
previewTemplate :any ;
// config: DropzoneConfigInterface;
//myDropzone: Dropzone;
droptestt :any ;
public type : string = 'component' ;
public disabled : boolean = false ;
public config : DropzoneConfigInterface = {
clickable : true ,
maxFiles : 1 ,
autoReset : null ,
errorReset : null ,
cancelReset : null
} ;
@ViewChild ( DropzoneComponent ) componentRef? : DropzoneComponent ;
@ViewChild ( DropzoneDirective ) directiveRef? : DropzoneDirective ;
constructor ( private http : HttpClient , private router : Router , private route : ActivatedRoute , public sanitizer : DomSanitizer ) {
this . isClickCreateFolder = false ;
this . fileChooseName = 'None' ;
this . filesToUpload = [ ] ;
this . test = '' ;
/ *
if ( document ) {
var myDropzone = new Dropzone ( 'div#madrop' , { url : '../../../public/' } ) ;
// "myAwesomeDropzone" is the camelized version of the HTML element's ID
myDropzone . options . madrop = {
paramName : "file" , // The name that will be used to transfer the file
maxFilesize : 2 , // MB
accept : function ( file , done ) {
console . log ( 'Naha, you don\'t.' ) ;
if ( file . name == "justinbieber.jpg" ) {
console . log ( 'Naha, you don\'t.' ) ;
done ( 'Naha, you don\'t.' ) ;
}
else { console . log ( 'done();' ) }
}
} ;
}
* /
}
public toggleType ( ) : void {
this . type = ( this . type === 'component' ) ? 'directive' : 'component' ;
}
public toggleDisabled ( ) : void {
this . disabled = ! this . disabled ;
}
public toggleAutoReset ( ) : void {
this . config . autoReset = this . config . autoReset ? null : 5000 ;
this . config . errorReset = this . config . errorReset ? null : 5000 ;
this . config . cancelReset = this . config . cancelReset ? null : 5000 ;
}
public toggleMultiUpload ( ) : void {
this . config . maxFiles = this . config . maxFiles ? 0 : 1 ;
}
public toggleClickAction ( ) : void {
this . config . clickable = ! this . config . clickable ;
}
public resetDropzoneUploads ( ) : void {
if ( this . type === 'directive' && this . directiveRef ) {
this . directiveRef . reset ( ) ;
} else if ( this . type === 'component' && this . componentRef && this . componentRef . directiveRef ) {
this . componentRef . directiveRef . reset ( ) ;
}
}
public onUploadError ( args : any ) : void {
console . log ( 'onUploadError:' , args ) ;
}
public onUploadSuccess ( args : any ) : void {
console . log ( 'onUploadSuccess:' , JSON . stringify ( args [ 0 ] ) ) ;
this . filesToUpload = args ;
this . fileChooseName = args [ 0 ] . name ;
console . log ( 'this.fileChooseName:' , this . fileChooseName ) ;
this . upload ( ) ;
this . resetDropzoneUploads ( ) ;
this . openFolder ( this . mainFolder . path ) ;
}
ngOnInit() {
this . httpOptions = {
headers : new HttpHeaders ( { 'Authorization' : localStorage . getItem ( 'jwtToken' ) } ) ,
@ -80,6 +173,7 @@ export class BookComponent implements OnInit, OnDestroy {
}
saveURLFileMongo ( fileToCreateURL ) {
fileToCreateURL . url = '../../../public/' + fileToCreateURL . _id . toString ( ) + this . getStringExtention ( fileToCreateURL ) ;
// fileToCreateURL.urlSafe = this.sanitizer.bypassSecurityTrustResourceUrl(fileToCreateURL.url).toString();
this . http . post ( '/api/saveURLFileMongo' , fileToCreateURL ) . subscribe ( data = > {
console . log ( 'data : ' + data ) ;
@ -99,8 +193,20 @@ export class BookComponent implements OnInit, OnDestroy {
this . allUserFile = files ;
for ( let f of this . allUserFile ) {
f . data = f . url ;
f . url = this . sanitizer . bypassSecurityTrustResourceUrl ( f . url ) ;
if ( f . type === ( 'image/jpeg' ) || f . type === ( 'image/png' ) ) {
console . log ( 'f : ' + JSON . stringify ( f ) ) ;
f . data = f . url ;
console . log ( 'f.url : ' + f . url ) ;
f . urlSafe = this . sanitizer . bypassSecurityTrustUrl ( f . url ) ;
console . log ( 'f.urlSafe : ' + JSON . stringify ( f . urlSafe ) ) ;
} else {
console . log ( 'f : ' + JSON . stringify ( f ) ) ;
f . data = f . url ;
console . log ( 'f.url : ' + f . url ) ;
f . urlSafe = this . sanitizer . bypassSecurityTrustResourceUrl ( f . url ) ;
console . log ( 'f.urlSafe : ' + JSON . stringify ( f . urlSafe ) ) ;
}
}
} else {
this . allUserFile = [ ] ;
@ -168,13 +274,15 @@ export class BookComponent implements OnInit, OnDestroy {
}
upload() {
var me = this ;
if ( this . mainFolder !== undefined ) {
this . http . post ( 'api/uploadFileMongo' , { name : this.fileChooseName.toString ( ) , path : this.mainFolder.path.toString ( ) , type : this . filesToUpload [ 0 ] . type . toString ( ) , taille : this.filesToUpload [ 0 ] . size . toString ( ) , idUser : this.currentUser._id.toString ( ) , owner : this.currentUser.username.toString ( ) , lastDate : Date.now ( ) . toString ( ) , url : '' } ) . subscribe ( resp = > {
this . saveURLFileMongo ( resp ) ;
this . makeFileRequest ( 'http://localhost:3000/api/upload' , [ ] , this . filesToUpload , resp ) . then ( ( result ) = > {
this . getfiles ( ) ;
this . filesToUpload = null ;
this . fileChooseName = 'None' ;
this . http . post ( 'api/uploadFileMongo' , { name : this.fileChooseName.toString ( ) , path : this.mainFolder.path.toString ( ) , type : this . filesToUpload [ 0 ] . type . toString ( ) , taille : this.filesToUpload [ 0 ] . size . toString ( ) , idUser : this.currentUser._id.toString ( ) , owner : this.currentUser.username.toString ( ) , lastDate : Date.now ( ) . toString ( ) , url : '' , urlSafe : '' } ) . subscribe ( resp = > {
me . saveURLFileMongo ( resp ) ;
var mee = this ;
me . makeFileRequest ( 'http://localhost:3000/api/upload' , [ ] , this . filesToUpload , resp ) . then ( ( result ) = > {
mee . getfiles ( ) ;
mee . filesToUpload = null ;
mee . fileChooseName = 'None' ;
} , ( error ) = > {
console . error ( error ) ;
} ) ;
@ -189,6 +297,7 @@ export class BookComponent implements OnInit, OnDestroy {
this . fileChooseName = this . filesToUpload [ 0 ] . name ;
}
makeFileRequest ( url : string , params : Array < string > , files : Array < File > , monFile : any ) {
return new Promise ( ( resolve , reject ) = > {
var formData : any = new FormData ( ) ;
Tmadkaud
6 years ago