qol: make attachment comments optional

This commit is contained in:
Gary Sharp
2024-12-18 18:40:23 +11:00
parent 77acf0bfdb
commit 9f10eeeb70
21 changed files with 741 additions and 527 deletions
@@ -1,12 +1,13 @@
(function (window, document, $) {
"use strict";
var attachmentUploader = function (uploadUrl, dropTarget, uploadProgressContainer) {
var attachmentUploader = function ($host) {
var self = this;
self.uploadUrl = uploadUrl;
self.dropTarget = dropTarget;
self.uploadProgressContainer = uploadProgressContainer;
self.$host = $host;
self.uploadUrl = $host.attr('data-uploadurl');
self.dropTarget = $host.find('.Disco-AttachmentUpload-DropTarget');
self.uploadProgressContainer = $host.find('.Disco-AttachmentUpload-Progress');
// #region File Selection Support
self._uploadFilesInput = null;
@@ -168,7 +169,7 @@
title: 'Upload File',
'class': 'dialog Disco-AttachmentUpload-CommentDialog'
});
dialog.html('<table><tr><th>File Name:</th><td class="filename"></td></tr><tr><th>Comments:</th><td><input class="comments" type="text"></input></td></tr><tr><td class="thumbnail" colspan="2"><img /></td></tr></table>');
dialog.html('<table><tr><th>File Name:</th><td class="filename"></td></tr><tr><th>Comments:</th><td><input class="comments" type="text" placeholder="optional" /></td></tr><tr><td class="thumbnail" colspan="2"><img /></td></tr></table>');
if (!!thumbnailHandler) {
var td = dialog.find('td.thumbnail');
@@ -181,10 +182,8 @@
var comments = dialog.find('input.comments')
.keypress(function (e) {
if (e.which === 13) {
if (!!comments.val()) {
result = true;
dialog.dialog("close");
}
result = true;
dialog.dialog("close");
}
});
@@ -195,15 +194,11 @@
autoOpen: true,
buttons: {
"Upload": function () {
if (!!comments.val()) {
result = true;
dialog.dialog("close");
window.setTimeout(function () {
comments.focus();
}, 1);
} else {
alert('Please provide a comment for this attachment.');
}
result = true;
dialog.dialog("close");
window.setTimeout(function () {
comments.focus();
}, 1);
},
Cancel: function () {
dialog.dialog("close");
@@ -262,29 +257,33 @@
processNextFile();
};
self._uploadFile = function (fileData, fileName, comments) {
var formData = new FormData();
var xhr = new XMLHttpRequest();
var progress = $('<div>')
self._uploadFile = async function (fileData, fileName, comments) {
const formData = new FormData();
const progress = $('<div>')
.append($('<i>').addClass('fa fa-cog fa-spin'))
.append($('<span>').text('Uploading: ' + fileName))
.appendTo(self.uploadProgressContainer);
formData.append('Comments', comments);
formData.append('File', fileData, fileName);
formData.append('__RequestVerificationToken', self.$host.find('input[name="__RequestVerificationToken"]').val());
formData.append('comments', comments);
formData.append('file', fileData, fileName);
xhr.open("POST", self.uploadUrl, true);
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
if (xhr.status !== 200) {
alert('Error Uploading [' + fileName + ']: ' + xhr.statusText);
}
progress.slideUp(400, function () {
progress.remove();
});
}
};
xhr.send(formData);
const result = await fetch(self.uploadUrl, {
method: 'POST',
body: formData
});
progress.slideUp(400, function () {
progress.remove();
});
if (!result.ok) {
alert('Error Uploading [' + fileName + ']: ' + result.statusText);
const errorText = await result.text();
console.error('Failed to upload file [' + fileName + ']: ' + errorText);
}
};
// #endregion
@@ -1 +1 @@
(function(n,t,i){"use strict";var r=function(r,u,f){var e=this;if(e.uploadUrl=r,e.dropTarget=u,e.uploadProgressContainer=f,e._uploadFilesInput=null,e.uploadFiles=function(){!e._uploadFilesInput||e._uploadFilesInput.remove();e._uploadFilesInput=i("<input>");e._uploadFilesInput.attr({type:"file",multiple:"multiple",title:"Disco ICT File Uploading"}).hide().change(function(n){var t=n.target.files;!!t&&t.length>0&&e._uploadFiles(t);e._uploadFilesInput.remove()}).appendTo(e.uploadProgressContainer).click()},!!e.dropTarget){var h=i(t),o=!1,s=null;h.on("dragover",function(){e.dropTarget.addClass("dragHighlight");e.dropTarget.removeClass("dragHover");o=!1});h.on("dragleave",function(){!s||n.clearInterval(s);o=!0;n.setTimeout(function(){o&&e.dropTarget.removeClass("dragHighlight");s=null},200)});e.dropTarget.on("dragover",function(n){n.stopPropagation();n.preventDefault();e.dropTarget.addClass("dragHover");o=!1;n.originalEvent.dataTransfer.dropEffect="copy"});e.dropTarget.on("drop",function(n){n.stopPropagation();n.preventDefault();o=!0;e.dropTarget.removeClass("dragHighlight");var t=n.originalEvent.dataTransfer.files;e._uploadFiles(t)})}return e.uploadImage=function(){let f=null,o=!1;var u=i("<div><video><\/video><\/div>").attr({id:"Disco_AttachmentUpload_ImageDialog",title:"Upload Image","class":"dialog Disco-AttachmentUpload-ImageDialog"});u.dialog({autoOpen:!0,draggable:!1,modal:!0,resizable:!1,width:720,height:405,close:function(){f&&f.getTracks().forEach(n=>n.stop());n.setTimeout(function(){u.dialog("destroy")},1)}}).closest(".ui-dialog").children(".ui-dialog-titlebar").css("border-bottom","none");const r=u.find("video")[0];navigator.mediaDevices.getUserMedia({audio:!1,video:{width:{ideal:1920},height:{ideal:1080},facingMode:"environment"}}).then(n=>{f=n,r.srcObject=n,r.play()}).catch(n=>{console.error(n),u.dialog("destroy")});r.addEventListener("canplay",()=>{if(!o){const i=720;let n=r.videoHeight/(r.videoWidth/i);isNaN(n)&&(n=405);r.setAttribute("width",i);r.setAttribute("height",n);o=!0;u.dialog("option","buttons",[{text:"Capture",click:()=>{const n=t.createElement("canvas");n.width=r.videoWidth;n.height=r.videoHeight;const i=n.getContext("2d");i.drawImage(r,0,0);n.toBlob(n=>{e._uploadImage(n)},"image/jpg")}}]);u.css("height","");u.closest(".ui-dialog").children(".ui-dialog-buttonpane").css("margin-top",0).find(".ui-button:first").focus()}})},e.getFileComments=function(t,r,u){var o=!1,f=i("<div>").attr({title:"Upload File","class":"dialog Disco-AttachmentUpload-CommentDialog"}),s,h,e;f.html('<table><tr><th>File Name:<\/th><td class="filename"><\/td><\/tr><tr><th>Comments:<\/th><td><input class="comments" type="text"><\/input><\/td><\/tr><tr><td class="thumbnail" colspan="2"><img /><\/td><\/tr><\/table>');!r||(s=f.find("td.thumbnail"),h=s.find("img"),r(h)&&s.show());f.find("td.filename").text(t).attr("title",t);e=f.find("input.comments").keypress(function(n){n.which===13&&(!e.val()||(o=!0,f.dialog("close")))});f.dialog({resizable:!1,width:400,modal:!0,autoOpen:!0,buttons:{Upload:function(){e.val()?(o=!0,f.dialog("close"),n.setTimeout(function(){e.focus()},1)):alert("Please provide a comment for this attachment.")},Cancel:function(){f.dialog("close")}},close:function(){var n=e.val();f.dialog("destroy").remove();u(o,n)}})},e._uploadImage=function(n){var t="CapturedImage-"+moment().format("YYYYMMDD-HHmmss")+".jpg";e.getFileComments(t,function(t){const i=URL.createObjectURL(n);return t.attr("src",i),!0},function(i,r){i&&e._uploadFile(n,t,r)})},e._uploadFiles=function(n){var t=i.makeArray(n),r=function(){if(t&&t.length!==0){var n=t.shift();e.getFileComments(n.name,function(t){if(!!n.type&&n.type.indexOf("image/")===0){var i=new FileReader;return i.onload=function(n){t.attr("src",n.target.result)},i.readAsDataURL(n),!0}return!1},function(t,i){t&&(e._uploadFile(n,n.name,i),r())})}};r()},e._uploadFile=function(n,t,r){var f=new FormData,u=new XMLHttpRequest,o=i("<div>").append(i("<i>").addClass("fa fa-cog fa-spin")).append(i("<span>").text("Uploading: "+t)).appendTo(e.uploadProgressContainer);f.append("Comments",r);f.append("File",n,t);u.open("POST",e.uploadUrl,!0);u.onreadystatechange=function(){u.readyState===4&&(u.status!==200&&alert("Error Uploading ["+t+"]: "+u.statusText),o.slideUp(400,function(){o.remove()}))};u.send(f)},e};t.Disco||(t.Disco={});t.Disco.AttachmentUploader=r})(this,document,$);
(function(n,t,i){"use strict";var r=function(r){var u=this;if(u.$host=r,u.uploadUrl=r.attr("data-uploadurl"),u.dropTarget=r.find(".Disco-AttachmentUpload-DropTarget"),u.uploadProgressContainer=r.find(".Disco-AttachmentUpload-Progress"),u._uploadFilesInput=null,u.uploadFiles=function(){!u._uploadFilesInput||u._uploadFilesInput.remove();u._uploadFilesInput=i("<input>");u._uploadFilesInput.attr({type:"file",multiple:"multiple",title:"Disco ICT File Uploading"}).hide().change(function(n){var t=n.target.files;!!t&&t.length>0&&u._uploadFiles(t);u._uploadFilesInput.remove()}).appendTo(u.uploadProgressContainer).click()},!!u.dropTarget){var o=i(t),f=!1,e=null;o.on("dragover",function(){u.dropTarget.addClass("dragHighlight");u.dropTarget.removeClass("dragHover");f=!1});o.on("dragleave",function(){!e||n.clearInterval(e);f=!0;n.setTimeout(function(){f&&u.dropTarget.removeClass("dragHighlight");e=null},200)});u.dropTarget.on("dragover",function(n){n.stopPropagation();n.preventDefault();u.dropTarget.addClass("dragHover");f=!1;n.originalEvent.dataTransfer.dropEffect="copy"});u.dropTarget.on("drop",function(n){n.stopPropagation();n.preventDefault();f=!0;u.dropTarget.removeClass("dragHighlight");var t=n.originalEvent.dataTransfer.files;u._uploadFiles(t)})}return u.uploadImage=function(){let e=null,o=!1;var f=i("<div><video><\/video><\/div>").attr({id:"Disco_AttachmentUpload_ImageDialog",title:"Upload Image","class":"dialog Disco-AttachmentUpload-ImageDialog"});f.dialog({autoOpen:!0,draggable:!1,modal:!0,resizable:!1,width:720,height:405,close:function(){e&&e.getTracks().forEach(n=>n.stop());n.setTimeout(function(){f.dialog("destroy")},1)}}).closest(".ui-dialog").children(".ui-dialog-titlebar").css("border-bottom","none");const r=f.find("video")[0];navigator.mediaDevices.getUserMedia({audio:!1,video:{width:{ideal:1920},height:{ideal:1080},facingMode:"environment"}}).then(n=>{e=n,r.srcObject=n,r.play()}).catch(n=>{console.error(n),f.dialog("destroy")});r.addEventListener("canplay",()=>{if(!o){const i=720;let n=r.videoHeight/(r.videoWidth/i);isNaN(n)&&(n=405);r.setAttribute("width",i);r.setAttribute("height",n);o=!0;f.dialog("option","buttons",[{text:"Capture",click:()=>{const n=t.createElement("canvas");n.width=r.videoWidth;n.height=r.videoHeight;const i=n.getContext("2d");i.drawImage(r,0,0);n.toBlob(n=>{u._uploadImage(n)},"image/jpg")}}]);f.css("height","");f.closest(".ui-dialog").children(".ui-dialog-buttonpane").css("margin-top",0).find(".ui-button:first").focus()}})},u.getFileComments=function(t,r,u){var e=!1,f=i("<div>").attr({title:"Upload File","class":"dialog Disco-AttachmentUpload-CommentDialog"}),o,h,s;f.html('<table><tr><th>File Name:<\/th><td class="filename"><\/td><\/tr><tr><th>Comments:<\/th><td><input class="comments" type="text" placeholder="optional" /><\/td><\/tr><tr><td class="thumbnail" colspan="2"><img /><\/td><\/tr><\/table>');!r||(o=f.find("td.thumbnail"),h=o.find("img"),r(h)&&o.show());f.find("td.filename").text(t).attr("title",t);s=f.find("input.comments").keypress(function(n){n.which===13&&(e=!0,f.dialog("close"))});f.dialog({resizable:!1,width:400,modal:!0,autoOpen:!0,buttons:{Upload:function(){e=!0;f.dialog("close");n.setTimeout(function(){s.focus()},1)},Cancel:function(){f.dialog("close")}},close:function(){var n=s.val();f.dialog("destroy").remove();u(e,n)}})},u._uploadImage=function(n){var t="CapturedImage-"+moment().format("YYYYMMDD-HHmmss")+".jpg";u.getFileComments(t,function(t){const i=URL.createObjectURL(n);return t.attr("src",i),!0},function(i,r){i&&u._uploadFile(n,t,r)})},u._uploadFiles=function(n){var t=i.makeArray(n),r=function(){if(t&&t.length!==0){var n=t.shift();u.getFileComments(n.name,function(t){if(!!n.type&&n.type.indexOf("image/")===0){var i=new FileReader;return i.onload=function(n){t.attr("src",n.target.result)},i.readAsDataURL(n),!0}return!1},function(t,i){t&&(u._uploadFile(n,n.name,i),r())})}};r()},u._uploadFile=async function(n,t,r){const f=new FormData,o=i("<div>").append(i("<i>").addClass("fa fa-cog fa-spin")).append(i("<span>").text("Uploading: "+t)).appendTo(u.uploadProgressContainer);f.append("__RequestVerificationToken",u.$host.find('input[name="__RequestVerificationToken"]').val());f.append("comments",r);f.append("file",n,t);const e=await fetch(u.uploadUrl,{method:"POST",body:f});if(o.slideUp(400,function(){o.remove()}),!e.ok){alert("Error Uploading ["+t+"]: "+e.statusText);const n=await e.text();console.error("Failed to upload file ["+t+"]: "+n)}},u};t.Disco||(t.Disco={});t.Disco.AttachmentUploader=r})(this,document,$);
@@ -1,12 +1,13 @@
(function (window, document, $) {
"use strict";
var attachmentUploader = function (uploadUrl, dropTarget, uploadProgressContainer) {
var attachmentUploader = function ($host) {
var self = this;
self.uploadUrl = uploadUrl;
self.dropTarget = dropTarget;
self.uploadProgressContainer = uploadProgressContainer;
self.$host = $host;
self.uploadUrl = $host.attr('data-uploadurl');
self.dropTarget = $host.find('.Disco-AttachmentUpload-DropTarget');
self.uploadProgressContainer = $host.find('.Disco-AttachmentUpload-Progress');
// #region File Selection Support
self._uploadFilesInput = null;
@@ -168,7 +169,7 @@
title: 'Upload File',
'class': 'dialog Disco-AttachmentUpload-CommentDialog'
});
dialog.html('<table><tr><th>File Name:</th><td class="filename"></td></tr><tr><th>Comments:</th><td><input class="comments" type="text"></input></td></tr><tr><td class="thumbnail" colspan="2"><img /></td></tr></table>');
dialog.html('<table><tr><th>File Name:</th><td class="filename"></td></tr><tr><th>Comments:</th><td><input class="comments" type="text" placeholder="optional" /></td></tr><tr><td class="thumbnail" colspan="2"><img /></td></tr></table>');
if (!!thumbnailHandler) {
var td = dialog.find('td.thumbnail');
@@ -181,10 +182,8 @@
var comments = dialog.find('input.comments')
.keypress(function (e) {
if (e.which === 13) {
if (!!comments.val()) {
result = true;
dialog.dialog("close");
}
result = true;
dialog.dialog("close");
}
});
@@ -195,15 +194,11 @@
autoOpen: true,
buttons: {
"Upload": function () {
if (!!comments.val()) {
result = true;
dialog.dialog("close");
window.setTimeout(function () {
comments.focus();
}, 1);
} else {
alert('Please provide a comment for this attachment.');
}
result = true;
dialog.dialog("close");
window.setTimeout(function () {
comments.focus();
}, 1);
},
Cancel: function () {
dialog.dialog("close");
@@ -262,29 +257,33 @@
processNextFile();
};
self._uploadFile = function (fileData, fileName, comments) {
var formData = new FormData();
var xhr = new XMLHttpRequest();
var progress = $('<div>')
self._uploadFile = async function (fileData, fileName, comments) {
const formData = new FormData();
const progress = $('<div>')
.append($('<i>').addClass('fa fa-cog fa-spin'))
.append($('<span>').text('Uploading: ' + fileName))
.appendTo(self.uploadProgressContainer);
formData.append('Comments', comments);
formData.append('File', fileData, fileName);
formData.append('__RequestVerificationToken', self.$host.find('input[name="__RequestVerificationToken"]').val());
formData.append('comments', comments);
formData.append('file', fileData, fileName);
xhr.open("POST", self.uploadUrl, true);
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
if (xhr.status !== 200) {
alert('Error Uploading [' + fileName + ']: ' + xhr.statusText);
}
progress.slideUp(400, function () {
progress.remove();
});
}
};
xhr.send(formData);
const result = await fetch(self.uploadUrl, {
method: 'POST',
body: formData
});
progress.slideUp(400, function () {
progress.remove();
});
if (!result.ok) {
alert('Error Uploading [' + fileName + ']: ' + result.statusText);
const errorText = await result.text();
console.error('Failed to upload file [' + fileName + ']: ' + errorText);
}
};
// #endregion