Merge remote-tracking branch 'upstream/dev' into website-import

3 files changed, 100 insertions, 18 deletions

diff --git a/view/tpl/cloud_actionspanel.tpl b/view/tpl/cloud_actionspanel.tpl
index 81a586e75..eaa613dc4 100644
--- a/view/tpl/cloud_actionspanel.tpl
+++ b/view/tpl/cloud_actionspanel.tpl
@@ -1,20 +1,20 @@
 <div id="files-mkdir-tools" class="section-content-tools-wrapper">
-	<label for="files-mkdir">{{$folder_header}}</label>
-	<form method="post" action="">
-		<input type="hidden" name="sabreAction" value="mkcol">
-		<input id="files-mkdir" type="text" name="name" class="form-control form-group">
-		<button class="btn btn-primary btn-sm pull-right" type="submit" value="{{$folder_submit}}">{{$folder_submit}}</button>
-	</form>
-	<div class="clear"></div>
+  <label for="files-mkdir">{{$folder_header}}</label>
+  <form method="post" action="">
+    <input type="hidden" name="sabreAction" value="mkcol">
+    <input id="files-mkdir" type="text" name="name" class="form-control form-group">
+    <button class="btn btn-primary btn-sm pull-right" type="submit" value="{{$folder_submit}}">{{$folder_submit}}</button>
+  </form>
+  <div class="clear"></div>
 </div>
 <div id="files-upload-tools" class="section-content-tools-wrapper">
-	{{if $quota.limit || $quota.used}}<div class="{{if $quota.warning}}section-content-danger-wrapper{{else}}section-content-info-wrapper{{/if}}">{{if $quota.warning}}<strong>{{$quota.warning}} </strong>{{/if}}{{$quota.desc}}</div>{{/if}}
-	<label for="files-upload">{{$upload_header}}</label>
-	<form method="post" action="" enctype="multipart/form-data">
-		<input type="hidden" name="sabreAction" value="put">
-		<input class="form-group" id="files-upload" type="file" name="file">
-		<button class="btn btn-primary btn-sm pull-right" type="submit" value="{{$upload_submit}}">{{$upload_submit}}</button>
-		<!-- Name (optional): <input type="text" name="name"> we should rather provide a rename action in edit form-->
-	</form>
-	<div class="clear"></div>
+  {{if $quota.limit || $quota.used}}<div class="{{if $quota.warning}}section-content-danger-wrapper{{else}}section-content-info-wrapper{{/if}}">{{if $quota.warning}}<strong>{{$quota.warning}} </strong>{{/if}}{{$quota.desc}}</div>{{/if}}
+  <form id="ajax-upload-files" method="post" action="" enctype="multipart/form-data">
+    <input type="hidden" name="sabreAction" value="put">
+    <label for="files-upload">{{$upload_header}}</label>
+    <div class="clear"></div>
+    <input class="form-group pull-left" id="files-upload" type="file" name="file">
+    <button id="upload-submit" class="btn btn-primary btn-sm pull-right" type="submit" value="{{$upload_submit}}">{{$upload_submit}}</button>
+  </form>
+  <div class="clear"></div>
 </div>
diff --git a/view/tpl/cloud_directory.tpl b/view/tpl/cloud_directory.tpl
index 870f7e9e1..5a84028c1 100644
--- a/view/tpl/cloud_directory.tpl
+++ b/view/tpl/cloud_directory.tpl
@@ -1,4 +1,4 @@
-<div class="section-content-wrapper-np">
+<div id="cloud-drag-area" class="section-content-wrapper-np">
 	<table id="cloud-index">
 		<tr>
 			<th width="1%"></th>
@@ -18,6 +18,7 @@
 			<td class="hidden-xs"></td>
 		</tr>
 	{{/if}}
+		<tr id="new-upload-progress-bar--1"></tr> {{* this is needed to append the upload files in the right order *}}
 	{{foreach $entries as $item}}
 		<tr id="cloud-index-{{$item.attachId}}">
 			<td><i class="fa {{$item.iconFromType}}" title="{{$item.type}}"></i></td>
@@ -38,6 +39,7 @@
 		<tr id="cloud-tools-{{$item.attachId}}">
 			<td id="perms-panel-{{$item.attachId}}" colspan="9"></td>
 		</tr>
+
 	{{/foreach}}
 	</table>
 </div>
diff --git a/view/tpl/jot-header.tpl b/view/tpl/jot-header.tpl
index 9953875ef..c0d524764 100755
--- a/view/tpl/jot-header.tpl
+++ b/view/tpl/jot-header.tpl
@@ -164,6 +164,12 @@ function enableOnUser(){
 			});
 		} catch(e) {
 		}
+        
+        
+        // call initialization file
+        if (window.File && window.FileList && window.FileReader) {
+          DragDropUploadInit();
+        }
 	});
 
 	function deleteCheckedItems() {
@@ -446,7 +452,81 @@ function enableOnUser(){
             },
         'json');
     };
-    
+
+    //
+    // initialize
+    function DragDropUploadInit() {
+
+      var filedrag = $("#profile-jot-text");
+
+      // is XHR2 available?
+      var xhr = new XMLHttpRequest();
+      if (xhr.upload) {
+
+        // file drop
+        filedrag.on("dragover", DragDropUploadFileHover);
+        filedrag.on("dragleave", DragDropUploadFileHover);
+        filedrag.on("drop", DragDropUploadFileSelectHandler);
+
+      }
+
+      window.filesToUpload = 0;
+      window.fileUploadsCompleted = 0;
+
+
+    }
+
+    // file drag hover
+    function DragDropUploadFileHover(e) {
+      e.stopPropagation();
+      e.preventDefault();
+      e.target.className = (e.type == "dragover" ? "hover" : "");
+    }
+
+    // file selection
+    function DragDropUploadFileSelectHandler(e) {
+
+      // cancel event and hover styling
+      DragDropUploadFileHover(e);
+
+      // fetch FileList object
+      var files = e.target.files || e.originalEvent.dataTransfer.files;
+      // process all File objects
+      for (var i = 0, f; f = files[i]; i++) {
+        DragDropUploadFile(f, i);
+      }
+
+    }
+
+    // upload  files
+    function DragDropUploadFile(file, idx) {
+
+      window.filesToUpload = window.filesToUpload + 1;
+
+      var xhr = new XMLHttpRequest();
+      xhr.withCredentials = true;   // Include the SESSION cookie info for authentication
+      (xhr.upload || xhr).addEventListener('progress', function (e) {
+         $('#profile-rotator').spin('tiny');
+      });
+      xhr.addEventListener('load', function (e) {
+        //console.log('xhr upload complete', e);
+        window.fileUploadsCompleted = window.fileUploadsCompleted + 1;
+		addeditortext(xhr.responseText);
+		$('#jot-media').val($('#jot-media').val() + xhr.responseText);
+        // When all the uploads have completed, refresh the page
+        if (window.filesToUpload > 0 && window.fileUploadsCompleted === window.filesToUpload) {  
+          $('#profile-rotator').spin(false);
+          window.fileUploadsCompleted = window.filesToUpload = 0;
+        }
+      });
+      // POST to the wall_upload endpoint
+      xhr.open('post', '{{$baseurl}}/wall_attach/{{$nickname}}', true);
+
+      var data = new FormData();
+      data.append('userfile', file);
+      xhr.send(data);
+    }
+
 </script>
 
 <script>