From 38059e9e6989998a0bcaead6e1509c744a41c8d7 Mon Sep 17 00:00:00 2001 From: Marco Dickert Date: Mon, 24 Jul 2017 00:43:12 +0200 Subject: [PATCH] allow selecting multiple files to upload --- build/libifm.php | 36 +++++++++++++++++++---------- ifm.php | 36 +++++++++++++++++++---------- src/ifm.js | 34 ++++++++++++++++++--------- src/templates/modal.uploadfile.html | 2 +- 4 files changed, 72 insertions(+), 36 deletions(-) diff --git a/build/libifm.php b/build/libifm.php index 6c01c5c..754beb6 100644 --- a/build/libifm.php +++ b/build/libifm.php @@ -422,7 +422,7 @@ f00bar;

-
+

@@ -1298,8 +1298,21 @@ function IFM( params ) { self.showModal( self.templates.uploadfile ); var form = $('#formUploadFile'); form.find( 'input[name=newfilename]' ).on( 'keypress', self.preventEnter ); - form.find( '#buttonUpload' ).on( 'click', function() { - self.uploadFile(); + form.find( 'input[name=files]' ).on( 'change', function( e ) { + if( e.target.files.length > 1 ) + form.find( 'input[name=newfilename]' ).attr( 'readonly', true ); + else + form.find( 'input[name=newfilename]' ).attr( 'readonly', false ); + }); + form.find( '#buttonUpload' ).on( 'click', function( e ) { + e.preventDefault(); + var files = form.find( 'input[name=files]' )[0].files; + if( files.length > 1 ) + for( var i = 0; i < files.length; i++ ) { + self.uploadFile( files[i] ); + } + else + self.uploadFile( files[0], form.find( 'input[name=newfilename]' ).val() ); self.hideModal(); return false; }); @@ -1312,14 +1325,13 @@ function IFM( params ) { /** * Uploads a file */ - this.uploadFile = function() { - var ufile = document.getElementById( 'ufile' ).files[0]; + this.uploadFile = function( file, newfilename ) { var data = new FormData(); - var newfilename = $("#formUploadFile input[name^=newfilename]").val(); - data.append('api', 'upload'); - data.append('dir', self.currentDir); - data.append('file', ufile); - data.append('newfilename', newfilename); + data.append( 'api', 'upload' ); + data.append( 'dir', self.currentDir ); + data.append( 'file', file ); + if( newfilename ) + data.append( 'newfilename', newfilename ); var id = self.generateGuid(); $.ajax({ url: self.api, @@ -1331,7 +1343,7 @@ function IFM( params ) { xhr: function(){ var xhr = $.ajaxSettings.xhr() ; xhr.upload.onprogress = function(evt){ self.task_update(evt.loaded/evt.total*100,id); } ; - xhr.upload.onload = function(){ console.log('Uploading '+newfilename+' done.') } ; + xhr.upload.onload = function(){ console.log('Uploading '+file.name+' done.') } ; return xhr ; }, success: function(data) { @@ -1343,7 +1355,7 @@ function IFM( params ) { error: function() { self.showMessage("General error occured", "e"); }, complete: function() { self.task_done(id); } }); - self.task_add("Upload "+ufile.name, id); + self.task_add("Upload "+file.name, id); }; /** diff --git a/ifm.php b/ifm.php index b5a0d6a..b57ff54 100644 --- a/ifm.php +++ b/ifm.php @@ -422,7 +422,7 @@ f00bar;

-
+

@@ -1298,8 +1298,21 @@ function IFM( params ) { self.showModal( self.templates.uploadfile ); var form = $('#formUploadFile'); form.find( 'input[name=newfilename]' ).on( 'keypress', self.preventEnter ); - form.find( '#buttonUpload' ).on( 'click', function() { - self.uploadFile(); + form.find( 'input[name=files]' ).on( 'change', function( e ) { + if( e.target.files.length > 1 ) + form.find( 'input[name=newfilename]' ).attr( 'readonly', true ); + else + form.find( 'input[name=newfilename]' ).attr( 'readonly', false ); + }); + form.find( '#buttonUpload' ).on( 'click', function( e ) { + e.preventDefault(); + var files = form.find( 'input[name=files]' )[0].files; + if( files.length > 1 ) + for( var i = 0; i < files.length; i++ ) { + self.uploadFile( files[i] ); + } + else + self.uploadFile( files[0], form.find( 'input[name=newfilename]' ).val() ); self.hideModal(); return false; }); @@ -1312,14 +1325,13 @@ function IFM( params ) { /** * Uploads a file */ - this.uploadFile = function() { - var ufile = document.getElementById( 'ufile' ).files[0]; + this.uploadFile = function( file, newfilename ) { var data = new FormData(); - var newfilename = $("#formUploadFile input[name^=newfilename]").val(); - data.append('api', 'upload'); - data.append('dir', self.currentDir); - data.append('file', ufile); - data.append('newfilename', newfilename); + data.append( 'api', 'upload' ); + data.append( 'dir', self.currentDir ); + data.append( 'file', file ); + if( newfilename ) + data.append( 'newfilename', newfilename ); var id = self.generateGuid(); $.ajax({ url: self.api, @@ -1331,7 +1343,7 @@ function IFM( params ) { xhr: function(){ var xhr = $.ajaxSettings.xhr() ; xhr.upload.onprogress = function(evt){ self.task_update(evt.loaded/evt.total*100,id); } ; - xhr.upload.onload = function(){ console.log('Uploading '+newfilename+' done.') } ; + xhr.upload.onload = function(){ console.log('Uploading '+file.name+' done.') } ; return xhr ; }, success: function(data) { @@ -1343,7 +1355,7 @@ function IFM( params ) { error: function() { self.showMessage("General error occured", "e"); }, complete: function() { self.task_done(id); } }); - self.task_add("Upload "+ufile.name, id); + self.task_add("Upload "+file.name, id); }; /** diff --git a/src/ifm.js b/src/ifm.js index e48233a..b32a691 100644 --- a/src/ifm.js +++ b/src/ifm.js @@ -610,8 +610,21 @@ function IFM( params ) { self.showModal( self.templates.uploadfile ); var form = $('#formUploadFile'); form.find( 'input[name=newfilename]' ).on( 'keypress', self.preventEnter ); - form.find( '#buttonUpload' ).on( 'click', function() { - self.uploadFile(); + form.find( 'input[name=files]' ).on( 'change', function( e ) { + if( e.target.files.length > 1 ) + form.find( 'input[name=newfilename]' ).attr( 'readonly', true ); + else + form.find( 'input[name=newfilename]' ).attr( 'readonly', false ); + }); + form.find( '#buttonUpload' ).on( 'click', function( e ) { + e.preventDefault(); + var files = form.find( 'input[name=files]' )[0].files; + if( files.length > 1 ) + for( var i = 0; i < files.length; i++ ) { + self.uploadFile( files[i] ); + } + else + self.uploadFile( files[0], form.find( 'input[name=newfilename]' ).val() ); self.hideModal(); return false; }); @@ -624,14 +637,13 @@ function IFM( params ) { /** * Uploads a file */ - this.uploadFile = function() { - var ufile = document.getElementById( 'ufile' ).files[0]; + this.uploadFile = function( file, newfilename ) { var data = new FormData(); - var newfilename = $("#formUploadFile input[name^=newfilename]").val(); - data.append('api', 'upload'); - data.append('dir', self.currentDir); - data.append('file', ufile); - data.append('newfilename', newfilename); + data.append( 'api', 'upload' ); + data.append( 'dir', self.currentDir ); + data.append( 'file', file ); + if( newfilename ) + data.append( 'newfilename', newfilename ); var id = self.generateGuid(); $.ajax({ url: self.api, @@ -643,7 +655,7 @@ function IFM( params ) { xhr: function(){ var xhr = $.ajaxSettings.xhr() ; xhr.upload.onprogress = function(evt){ self.task_update(evt.loaded/evt.total*100,id); } ; - xhr.upload.onload = function(){ console.log('Uploading '+newfilename+' done.') } ; + xhr.upload.onload = function(){ console.log('Uploading '+file.name+' done.') } ; return xhr ; }, success: function(data) { @@ -655,7 +667,7 @@ function IFM( params ) { error: function() { self.showMessage("General error occured", "e"); }, complete: function() { self.task_done(id); } }); - self.task_add("Upload "+ufile.name, id); + self.task_add("Upload "+file.name, id); }; /** diff --git a/src/templates/modal.uploadfile.html b/src/templates/modal.uploadfile.html index 6381769..8e25510 100644 --- a/src/templates/modal.uploadfile.html +++ b/src/templates/modal.uploadfile.html @@ -2,7 +2,7 @@

-
+