Save edited image as base64 in metadata

capsule-prototype/js/online-rekall/Tag.js

@@ -98,8 +98,8 @@ Tag.prototype.openQuickLook = function() {
 Tag.prototype.downloadFile = function() {
 	return this.document.downloadFile();
 }
-Tag.prototype.getDownloadLink = function() {
-  return this.document.getDownloadLink();
+Tag.prototype.getDownloadLink = function(original = false) {
+  return this.document.getDownloadLink(original);
 }
 Tag.prototype.openBrowser = function() {
 	return this.document.openBrowser();

capsule-prototype/js/online-script.js

@@ -553,13 +553,29 @@ function setEditionControls() {
     var keyDoc = ev.target.parentElement.parentElement.attributes['keydoc'];
     var markerArea = new markerjs2.MarkerArea(document.getElementById('annotation_img_edit'));
     markerArea.targetRoot = document.getElementById('edit_pic_modal');
-    markerArea.addEventListener('render', () => {
+    markerArea.addEventListener('render', (event) => {
       var state = markerArea.getState();
       window.my_current_markerjs_data_in_ugly_global = state;
       markerArea.close(true);
       setMetaFromDom(keyDoc.value, "Rekall->MarkerjsState", btoa(JSON.stringify(state)));
+      setMetaFromDom(keyDoc.value, "Rekall->EditedImage", event.dataUrl);
+
+      /* this will create another annotation with edited image (as raw file, not b64 data)
+      var b64img = event.dataUrl;
+      var data = b64img.match(/data:([a-z]+)\/([a-z]+);base64,(.*)/);
+      var type = data[1], subtype = data[2], b64data = data[3];
+      var bin_str = atob(b64data);
+      var n = b64data.length;
+      var uar = new Uint8Array(n);
+      while (n--) uar[n] = bin_str.charCodeAt(n);
+      var file = new File([uar], 'edited_' + Math.floor(Math.random()*100) + '.' + subtype, {type: type+'/'+subtype});
+      $('#left_menu_item_btn_addfile').files = [file];
+      uploadFiles([file]);
+      */
+
     });
     markerArea.addEventListener('close', () => $('#edit_pic_modal').hide());
+    markerArea.renderAtNaturalSize = true;
     markerArea.show();
     if (window.my_current_markerjs_data_in_ugly_global)
       markerArea.restoreState(window.my_current_markerjs_data_in_ugly_global);
@@ -973,8 +989,8 @@ function fillPopupEdit(tag) {
 		$("#popupImg").attr("src","../shared/css/images/img-note.png");
 	} else {
 		if(tag.thumbnail.url){
-			$("#popupImg").attr("src",tag.thumbnail.url);
-      $('#annotation_img_edit').attr('src', tag.getDownloadLink());
+			$("#popupImg").attr("src", tag.getMetadata('Rekall->EditedImage') || tag.thumbnail.url);
+      $('#annotation_img_edit').attr('src', tag.getDownloadLink(true));
 		} else {
 			if(type.indexOf("image") > -1) $("#popupImg").attr("src","../shared/css/images/img-image.png")
 			else if(type.indexOf("pdf") > -1) $("#popupImg").attr("src","../shared/css/images/img-pdf.png")
@@ -999,16 +1015,13 @@ function fillPopupEdit(tag) {
 	$("#popupNom").css("color",tag.color);
 
   window.my_current_markerjs_data_in_ugly_global = null;
+  $('#editAnnotationPic').hide();
   if (type.split('/')[0] == 'image') {
   $('#editAnnotationPic').html('edit');
+  $('#editAnnotationPic').show();
     var data = tag.getMetadata('Rekall->MarkerjsState');
-    if (data) {
-      var _data = JSON.parse(atob(data));
-      window.my_current_markerjs_data_in_ugly_global = _data;
-      // var _mjs = new mjslive.MarkerView(document.getElementById('popupImg'));
-      // _mjs.targetRoot = document.getElementById('popupImg').parentElement;
-      // _mjs.show(_data);
-    }
+    if (data)
+      window.my_current_markerjs_data_in_ugly_global = JSON.parse(atob(data));
   }
 
 	$("#popupType").html(type).css("color",tag.color);

capsule-prototype/js/rekall/Document.js

@@ -86,8 +86,11 @@ Document.prototype.isLink = function(version) {
 	else
 		return type.startsWith("rekall/link"); 
 }
-Document.prototype.getDownloadLink = function() {
-       return Utils.getLocalFilePath(this, "file");
+Document.prototype.getDownloadLink = function(original = false) {
+  var path = Utils.getLocalFilePath(this, "file");
+  if (original)
+    path = path.replace('file.php?r=', 'file.php?r=original_');
+  return path;
 }
 
 

capsule-prototype/php/upload.php

@@ -57,10 +57,11 @@
 			
 			if(is_uploaded_file($_FILES[$fileinfo]['tmp_name'])) {
 				if(file_exists($_FILES[$fileinfo]['tmp_name'])) {
-					if(!file_exists($uploadFolder.$filename)) {
           if(is_writable($uploadFolder)) {
+              if(!file_exists($uploadFolder.$filename)) {
 							//echo "Upload de ".$fileinfo."\t".$filename."...";
 							if(move_uploaded_file($_FILES[$fileinfo]['tmp_name'], $uploadFolder.$filename)) {
+                copy($uploadFolder.$filename, $uploadFolder.'original_'.$filename);
 								$metasAdded = addFileToProject($uploadFolder.$filename, $metas, $tcIn, $tcOut);
 								$key = $metasAdded["key"];
 								unset($metasAdded["key"]);
@@ -71,10 +72,10 @@
 								$retour .= '"code":0, "error":"Server error (copy of '.$uploadFolder.$filename.' is impossible)"';
 						}
 						else
-							$retour .= '"code":-1, "error":"The upload folder '.$uploadFolder.' has not enough permissions"';
+              $retour .= '"code":-2, "error":"File is already in project"';
 					}
 					else
-						$retour .= '"code":-2, "error":"File is already in project"';
+            $retour .= '"code":-1, "error":"The upload folder '.$uploadFolder.' has not enough permissions"';
 				} 
 				else
 					$retour .= '"code":-3, "error":"Server error in upload (temporary file missing)"';