diff --git a/models/FileMongo.js b/models/FileMongo.js
index 5dd9fd9..2f02852 100644
--- a/models/FileMongo.js
+++ b/models/FileMongo.js
@@ -2,42 +2,46 @@ var mongoose = require('mongoose');
var Schema = mongoose.Schema;
var FileMongoShema = new Schema({
- uid: {
- type: String,
- unique: false
- },
- name: {
- type: String,
- unique: false
- },
- path: {
- type: String,
- unique: false
- },
- type: {
- type: String,
- unique: false
- },
- taille: {
- type: String,
- unique: false
- },
- idUser: {
- type: String,
- unique: false
- },
- owner: {
- type: String,
- unique: false
- },
- lastDate: {
- type: String,
- unique: false
- },
- url: {
+ uid: {
+ type: String,
+ unique: false
+ },
+ name: {
+ type: String,
+ unique: false
+ },
+ path: {
+ type: String,
+ unique: false
+ },
+ type: {
+ type: String,
+ unique: false
+ },
+ taille: {
+ type: String,
+ unique: false
+ },
+ idUser: {
+ type: String,
+ unique: false
+ },
+ owner: {
+ type: String,
+ unique: false
+ },
+ lastDate: {
+ type: String,
+ unique: false
+ },
+ url: {
type: String,
unique: false
- }
+ },
+ urlSafe: {
+ type: String,
+ unique: false
+ },
});
module.exports = mongoose.model('FileMongo', FileMongoShema);
diff --git a/package-lock.json b/package-lock.json
index bea9b22..30d3f2d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -5740,6 +5740,11 @@
"is-obj": "1.0.1"
}
},
+ "dropzone": {
+ "version": "5.4.0",
+ "resolved": "https://registry.npmjs.org/dropzone/-/dropzone-5.4.0.tgz",
+ "integrity": "sha1-MpDAf1mxietaEemaWMmyra5az+w="
+ },
"duplexer2": {
"version": "0.0.2",
"resolved": "https://registry.npmjs.org/duplexer2/-/duplexer2-0.0.2.tgz",
@@ -11005,6 +11010,14 @@
}
}
},
+ "ngx-dropzone-wrapper": {
+ "version": "6.0.0",
+ "resolved": "https://registry.npmjs.org/ngx-dropzone-wrapper/-/ngx-dropzone-wrapper-6.0.0.tgz",
+ "integrity": "sha512-uwIJVzOjGxXjTpxMdljt16/1bZxLrW1o+K3SA0zB4OXkc01wxA8EdLWOQcYJE+t5S5Y3LJ6XjZ1EAARuGvlFGA==",
+ "requires": {
+ "dropzone": "5.4.0"
+ }
+ },
"no-case": {
"version": "2.3.2",
"resolved": "https://registry.npmjs.org/no-case/-/no-case-2.3.2.tgz",
diff --git a/package.json b/package.json
index 8cb4913..9b08357 100644
--- a/package.json
+++ b/package.json
@@ -33,6 +33,7 @@
"classlist.js": "1.1.x",
"core-js": "2.4.x",
"del": "3.0.x",
+ "dropzone": "^5.4.0",
"easy-pie-chart": "2.1.x",
"express": "^4.16.2",
"express-fileupload": "^0.4.0",
@@ -48,6 +49,7 @@
"multer": "^1.3.0",
"ng-html-util": "1.0.x",
"ngm-cli": "0.5.x",
+ "ngx-dropzone-wrapper": "^6.0.0",
"passport": "^0.4.0",
"passport-facebook": "^2.1.1",
"passport-github": "^1.1.0",
diff --git a/routes/api.js b/routes/api.js
index 53cdeed..45ae823 100644
--- a/routes/api.js
+++ b/routes/api.js
@@ -224,8 +224,8 @@ router.post('/signin', function(req, res) {
/* Multer upload */
router.post('/upload' , multer({storage: storage, limits: {fileSize: 30000000000}}).array("public[]", 12) ,function(req,res,next){
- res.send(req.files);
-
+ console.log('bebeb : ' + JSON.stringify(req));
+ res.send(req.files);
});
/* Get utilisateur courant */
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 889b0fd..1592931 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -23,10 +23,22 @@ import {VgCoreModule} from 'videogular2/core';
import {VgControlsModule} from 'videogular2/controls';
import {VgOverlayPlayModule} from 'videogular2/overlay-play';
import {VgBufferingModule} from 'videogular2/buffering';
+
+// import { DropzoneModule } from 'dropzone';
// import {SingleMediaPlayer} from './single-media-player';
+import { DropzoneModule } from 'ngx-dropzone-wrapper';
+import { DROPZONE_CONFIG } from 'ngx-dropzone-wrapper';
+import { DropzoneConfigInterface } from 'ngx-dropzone-wrapper';
+const DEFAULT_DROPZONE_CONFIG: DropzoneConfigInterface = {
+ // Change this to your upload POST address:
+ url: 'https://httpbin.org/post',
+ //acceptedFiles: 'image/*',
+ createImageThumbnails: true
+};
+
const appRoutes: Routes = [
{
path: 'main',
@@ -64,6 +76,7 @@ const appRoutes: Routes = [
],
imports: [
BrowserModule,
+ DropzoneModule,
VgCoreModule,
VgControlsModule,
VgOverlayPlayModule,
@@ -84,7 +97,12 @@ const appRoutes: Routes = [
apiKey: 'Your_api_key'
})
],
- providers: [MDBSpinningPreloader],
+ providers: [
+ MDBSpinningPreloader,
+ {
+ provide: DROPZONE_CONFIG,
+ useValue: DEFAULT_DROPZONE_CONFIG
+ }],
bootstrap: [AppComponent],
schemas: [ NO_ERRORS_SCHEMA ]
})
diff --git a/src/app/book/book.component.css b/src/app/book/book.component.css
index e69de29..1a465ae 100644
--- a/src/app/book/book.component.css
+++ b/src/app/book/book.component.css
@@ -0,0 +1,73 @@
+.app-title {
+ font-size: 24px;
+}
+
+.box-title {
+ font-size: 20px;
+}
+
+.box-container {
+ box-sizing: border-box;
+ height: 300px;
+ max-width: 90%;
+ max-height: 90%;
+ padding: 24px;
+ margin: 24px auto;
+ border-radius: 4px;
+
+ color: #555;
+ background-color: #eee;
+ box-shadow:
+ 0 6px 20px rgba(0, 0, 0, 0.18),
+ 0 6px 6px rgba(0, 0, 0, 0.25);
+}
+
+.info-container {
+ padding: 12px 16px;
+
+ line-height: 24px;
+}
+
+.action-container,
+.content-container {
+ position: relative;
+
+ overflow: auto;
+ height: 200px;
+ min-height: 0;
+ padding: 16px;
+ margin: 8px 16px;
+ border-radius: 4px;
+
+ background-color: #fff;
+}
+
+.vertical-container,
+.horizontal-container {
+ min-height: 0 !important;
+}
+
+.action-button {
+ box-sizing: border-box;
+ width: calc(100% - 16px);
+ min-height: 35px;
+ padding: 4px 16px;
+ margin: 8px;
+ border: 1px solid #555;
+ border-radius: 4px;
+
+ cursor: pointer;
+ font-size: 14px;
+ font-weight: bold;
+ line-height: 14px;
+ text-align: center;
+}
+
+.action-button:hover {
+ color: #fff;
+ background-color: #555;
+}
+
+.dropzone-container {
+ height: 100%;
+}
diff --git a/src/app/book/book.component.html b/src/app/book/book.component.html
index 3a79fed..0661259 100644
--- a/src/app/book/book.component.html
+++ b/src/app/book/book.component.html
@@ -1,41 +1,54 @@
-
-
-
Path : {{mainFolder.path}}
-
Vous êtes dans le dossier : {{mainFolder.name}}
-
-
+
+
+
Path : {{mainFolder.path}}
+
Vous êtes dans le dossier : {{mainFolder.name}}
+
+
-
+
-
-
+
+
-
-
-
-
+
+
+
+
+
- # |
- Nom |
- Taille |
- Type |
- Date d'ajout |
+ # |
+ Nom |
+ Taille |
+ Type |
+ Date d'ajout |
@@ -59,15 +72,15 @@
-
-
+ |
+
-
-
-
- |
+
+
+
+
|
+
+
+
+
+
+
-
-
\ No newline at end of file
diff --git a/src/app/book/book.component.ts b/src/app/book/book.component.ts
index ae9837c..7864461 100644
--- a/src/app/book/book.component.ts
+++ b/src/app/book/book.component.ts
@@ -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
, files: Array, monFile: any) {
return new Promise((resolve, reject) => {
var formData: any = new FormData();
diff --git a/src/index.html b/src/index.html
index cfcf55c..6b83a22 100644
--- a/src/index.html
+++ b/src/index.html
@@ -17,6 +17,7 @@
+