1+ // Function to display error messages
2+ function showError ( message ) {
3+ const errorDiv = document . getElementById ( 'error-message' ) ;
4+ if ( errorDiv ) {
5+ errorDiv . innerHTML = message ;
6+ errorDiv . style . display = 'block' ;
7+ // Auto-hide after 10 seconds
8+ setTimeout ( ( ) => {
9+ errorDiv . style . display = 'none' ;
10+ } , 10000 ) ;
11+ } else {
12+ // Fallback to alert if error div doesn't exist
13+ alert ( message ) ;
14+ }
15+ }
16+
17+ // Function to hide error messages
18+ function hideError ( ) {
19+ const errorDiv = document . getElementById ( 'error-message' ) ;
20+ if ( errorDiv ) {
21+ errorDiv . style . display = 'none' ;
22+ }
23+ }
24+
125Dropzone . options . dropzoneArea = {
2- maxFilesize : 5 , // Max file size per file
26+ maxFilesize : 15 , // Max file size per file in MB
327 maxFiles : 10 , // Max number of files
428 url : '/fake' ,
529 paramName : 'attachment' ,
@@ -8,28 +32,52 @@ Dropzone.options.dropzoneArea = {
832 addRemoveLinks : true ,
933 uploadMultiple : true ,
1034 dictDefaultMessage : 'You may drop files here to upload' ,
35+ dictFileTooBig : 'File is too big ({{filesize}}MB). Max filesize: {{maxFilesize}}MB.' ,
36+ dictMaxFilesExceeded : 'You can only upload a maximum of {{maxFiles}} files.' ,
1137 init : function ( ) {
38+ var dropzone = this ;
39+
1240 this . on ( "addedfile" , function ( file ) {
13- // Calculate the total added file size
14- var totalSize = this . files . reduce ( function ( total , f ) {
15- return total + f . size ;
16- } , 0 ) ;
17-
18- // If the total added file size is greater than 15 MB, remove the file
19- if ( totalSize > 15 * 1024 * 1024 ) {
41+ hideError ( ) ; // Clear any existing errors
42+
43+ // Check individual file size
44+ if ( file . size > 15 * 1024 * 1024 ) {
45+ this . removeFile ( file ) ;
46+ showError ( `Error: File "${ file . name } " is too large (${ ( file . size / 1024 / 1024 ) . toFixed ( 2 ) } MB). Maximum file size is 15MB.` ) ;
47+ return ;
48+ }
49+
50+ // Calculate the total added file size
51+ var totalSize = this . files . reduce ( function ( total , f ) {
52+ return total + f . size ;
53+ } , 0 ) ;
54+
55+ // If the total added file size is greater than 15 MB, remove the file
56+ if ( totalSize > 15 * 1024 * 1024 ) {
57+ this . removeFile ( file ) ;
58+ showError ( `Error: Total file size would exceed the 15MB limit. Current total: ${ ( totalSize / 1024 / 1024 ) . toFixed ( 2 ) } MB` ) ;
59+ }
60+ } ) ;
61+
62+ this . on ( "maxfilesexceeded" , function ( file ) {
2063 this . removeFile ( file ) ;
21- alert ( "Total file size exceeded the limit of 15 MB, file cannot be added." ) ;
22- }
64+ showError ( `Error: You can only upload a maximum of ${ this . options . maxFiles } files.` ) ;
2365 } ) ;
2466
2567 this . on ( "removedfile" , function ( file ) {
26- // Calculate the total added file size
27- var totalSize = this . files . reduce ( function ( total , f ) {
28- return total + f . size ;
29- } , 0 ) ;
30-
31- // Log the total added file size
32- console . log ( "Total file size: " + totalSize ) ;
68+ hideError ( ) ; // Clear errors when file is removed
69+ // Calculate the total added file size
70+ var totalSize = this . files . reduce ( function ( total , f ) {
71+ return total + f . size ;
72+ } , 0 ) ;
73+
74+ // Log the total added file size
75+ console . log ( "Total file size: " + ( totalSize / 1024 / 1024 ) . toFixed ( 2 ) + "MB" ) ;
76+ } ) ;
77+
78+ this . on ( "error" , function ( file , errorMessage ) {
79+ this . removeFile ( file ) ;
80+ showError ( `Error: ${ errorMessage } ` ) ;
3381 } ) ;
3482 }
3583} ;
@@ -43,33 +91,57 @@ function initDropzone() {
4391 addRemoveLinks : true ,
4492 uploadMultiple : true ,
4593 dictDefaultMessage : 'You may drop files here to upload' ,
46- maxFilesize : 15 , // Max file size per file
94+ dictFileTooBig : 'File is too big ({{filesize}}MB). Max filesize: {{maxFilesize}}MB.' ,
95+ dictMaxFilesExceeded : 'You can only upload a maximum of {{maxFiles}} files.' ,
96+ maxFilesize : 15 , // Max file size per file in MB
4797 maxFiles : 10 , // Max number of files
4898 init : function ( ) {
49- this . on ( "addedfile" , function ( file ) {
50- // Calculate the total added file size
51- var totalSize = this . files . reduce ( function ( total , f ) {
52- return total + f . size ;
53- } , 0 ) ;
99+ var dropzone = this ;
54100
55- // If the total added file size is greater than 15 MB, remove the file
56- if ( totalSize > 15 * 1024 * 1024 ) {
57- this . removeFile ( file ) ;
58- alert ( "Total file size exceeded the limit of 15 MB." ) ;
59- }
60- } ) ;
61-
62- this . on ( "removedfile" , function ( file ) {
63- // Calculate the total added file size
64- var totalSize = this . files . reduce ( function ( total , f ) {
65- return total + f . size ;
66- } , 0 ) ;
101+ this . on ( "addedfile" , function ( file ) {
102+ hideError ( ) ; // Clear any existing errors
103+
104+ // Check individual file size
105+ if ( file . size > 15 * 1024 * 1024 ) {
106+ this . removeFile ( file ) ;
107+ showError ( `Error: File "${ file . name } " is too large (${ ( file . size / 1024 / 1024 ) . toFixed ( 2 ) } MB). Maximum file size is 15MB.` ) ;
108+ return ;
109+ }
110+
111+ // Calculate the total added file size
112+ var totalSize = this . files . reduce ( function ( total , f ) {
113+ return total + f . size ;
114+ } , 0 ) ;
115+
116+ // If the total added file size is greater than 15 MB, remove the file
117+ if ( totalSize > 15 * 1024 * 1024 ) {
118+ this . removeFile ( file ) ;
119+ showError ( `Error: Total file size would exceed the 15MB limit. Current total: ${ ( totalSize / 1024 / 1024 ) . toFixed ( 2 ) } MB` ) ;
120+ }
121+ } ) ;
67122
68- // Log the total added file size
69- console . log ( "Total file size: " + totalSize ) ;
70- } ) ;
123+ this . on ( "maxfilesexceeded" , function ( file ) {
124+ this . removeFile ( file ) ;
125+ showError ( `Error: You can only upload a maximum of ${ this . options . maxFiles } files.` ) ;
126+ } ) ;
127+
128+ this . on ( "removedfile" , function ( file ) {
129+ hideError ( ) ; // Clear errors when file is removed
130+ // Calculate the total added file size
131+ var totalSize = this . files . reduce ( function ( total , f ) {
132+ return total + f . size ;
133+ } , 0 ) ;
134+
135+ // Log the total added file size
136+ console . log ( "Total file size: " + ( totalSize / 1024 / 1024 ) . toFixed ( 2 ) + "MB" ) ;
137+ } ) ;
138+
139+ this . on ( "error" , function ( file , errorMessage ) {
140+ this . removeFile ( file ) ;
141+ showError ( `Error: ${ errorMessage } ` ) ;
142+ } ) ;
71143 }
72- } ) ;
144+ } ) ;
73145}
74146
75147
@@ -122,10 +194,25 @@ document.addEventListener('DOMContentLoaded', function() {
122194 recipientLabel . style . visibility = 'hidden' ;
123195 } ;
124196
125- // Custom text for ESP recipient only
197+ // Handle reference field visibility based on recipient
126198 recipient . addEventListener ( "change" , function ( ) {
127- messageLabel . innerHTML = ( recipient . value == "esp" ) ? "Please include Grant ID in the message. Example: \"FY22-0123\":" : "Message:" ;
199+ const referenceContainer = document . getElementById ( "referenceContainer" ) ;
200+ const referenceInput = document . getElementById ( "reference" ) ;
201+
202+ if ( recipient . value === "security" ) {
203+ // Hide reference field for Security
204+ referenceContainer . style . display = "none" ;
205+ referenceInput . removeAttribute ( "required" ) ;
206+ referenceInput . value = "" ; // Clear the value
207+ } else {
208+ // Show reference field for Legal and Devcon
209+ referenceContainer . style . display = "block" ;
210+ referenceInput . setAttribute ( "required" , "required" ) ;
211+ }
128212 } ) ;
213+
214+ // Trigger change event on page load to set initial state
215+ recipient . dispatchEvent ( new Event ( 'change' ) ) ;
129216
130217 // Redirect clicks on a greed button
131218 const addFileButton = document . getElementById ( 'add-file-button' ) ;
@@ -140,9 +227,46 @@ document.addEventListener('DOMContentLoaded', function() {
140227 // Multi file upload meets encryption
141228 document . forms [ 0 ] . addEventListener ( "submit" , function ( evt ) {
142229 evt . preventDefault ( ) ;
143- captchaExpired ( ) ; // disable the submit button this way to prevent double submission
230+ hideError ( ) ; // Clear any existing errors
144231
232+ // Validate form before submission
145233 const selectedFiles = Dropzone . instances [ 0 ] . files || [ ] ;
234+
235+ // Check if reference is required and empty
236+ const referenceInput = document . getElementById ( "reference" ) ;
237+ const recipient = document . getElementById ( "recipientSelect" ) ;
238+ if ( recipient . value !== "security" && ! referenceInput . value . trim ( ) ) {
239+ showError ( "Error: Please enter a Reference ID before submitting." ) ;
240+ referenceInput . focus ( ) ;
241+ return false ;
242+ }
243+
244+ // Check number of files
245+ if ( selectedFiles . length > 10 ) {
246+ showError ( `Error: Too many files selected. You can only upload a maximum of 10 files. Currently selected: ${ selectedFiles . length } ` ) ;
247+ return false ;
248+ }
249+
250+ // Check total file size
251+ const totalSize = selectedFiles . reduce ( function ( total , file ) {
252+ return total + file . size ;
253+ } , 0 ) ;
254+
255+ if ( totalSize > 15 * 1024 * 1024 ) {
256+ showError ( `Error: Total file size exceeds the 15MB limit. Current total: ${ ( totalSize / 1024 / 1024 ) . toFixed ( 2 ) } MB` ) ;
257+ return false ;
258+ }
259+
260+ // Check individual file sizes
261+ for ( let i = 0 ; i < selectedFiles . length ; i ++ ) {
262+ if ( selectedFiles [ i ] . size > 15 * 1024 * 1024 ) {
263+ showError ( `Error: File "${ selectedFiles [ i ] . name } " is too large (${ ( selectedFiles [ i ] . size / 1024 / 1024 ) . toFixed ( 2 ) } MB). Maximum file size is 15MB.` ) ;
264+ return false ;
265+ }
266+ }
267+
268+ captchaExpired ( ) ; // disable the submit button this way to prevent double submission
269+
146270 dataArray = { message : '' , files : [ ] , requiredChunks : selectedFiles . length + 1 , receivedChunks : 0 } ;
147271
148272 encrypt ( text . value ) . then ( acceptEncryptedData ) ;
@@ -217,5 +341,17 @@ async function postData(url = '/', data = {}) {
217341function displayResult ( status , message ) {
218342 const formElement = document . getElementById ( "submission-form" ) ;
219343 const statusText = ( status == "success" ) ? "Success!" : "Error" ;
220- formElement . innerHTML = `<fieldset><legend>${ statusText } </legend><span class='pure-form-message'>${ message } </span><br><br><span class='pure-form-message'><a href="#" onclick="location.reload()">Send one more submission</a></span></fieldset>`
344+
345+ // If success message, format the identifier specially
346+ if ( status === "success" && message . includes ( "Please record the identifier" ) ) {
347+ // Extract the identifier (format: recipient:YYYY:MM:DD:HH:MM:SS:XXXX)
348+ const identifierMatch = message . match ( / ( [ a - z A - Z ] + : \d { 4 } : \d { 2 } : \d { 2 } : \d { 2 } : \d { 2 } : \d { 2 } : \d { 4 } ) $ / ) ;
349+ if ( identifierMatch ) {
350+ const identifier = identifierMatch [ 1 ] ;
351+ const messageWithoutId = message . substring ( 0 , message . lastIndexOf ( identifier ) ) . trim ( ) ;
352+ message = `${ messageWithoutId } <span class="legal-identifier">${ identifier } </span>` ;
353+ }
354+ }
355+
356+ formElement . innerHTML = `<fieldset><legend>${ statusText } </legend><span class='pure-form-message ${ status === "success" ? "success-message" : "" } '>${ message } </span><br><br><span class='pure-form-message'><a href="#" onclick="location.reload()">Send one more submission</a></span></fieldset>`
221357}
0 commit comments