Added check avatar max file size (100KB)

src/themes/d4science/account/account.ftl

@@ -75,10 +75,15 @@
 
     <#assign avatarUrl = url.accountUrl?replace("^(.*)(/account/?)(\\?(.*))?$", "$1/avatar-provider/?account&$4", 'r') />
     <form action="${avatarUrl}" class="form-horizontal" method="post" enctype="multipart/form-data">
-
+ 
         <img src="${avatarUrl}" style="max-width: 200px;"
-          onerror="let div=document.createElement('div');div.innerHTML='${msg("noAvatarSet")}';this.replaceWith(div)" />
+          onerror="let div=document.createElement('div');div.id='avatarInfo';div.innerHTML='${msg("noAvatarSet")}<br/>${msg("avatarFileSizeMessage")}';this.replaceWith(div)" />
         
+        <div id="avatarError" class="alert alert-danger" style="margin-top: 0; display: none;">
+          <span class="pficon pficon-error-circle-o"></span>
+          <strong>${msg("avatarFileTooBig")}</strong> ${msg("avatarFileSizeMessage")}
+        </div>
+
         <input style="margin-top: 1em;" type="file" id="avatar" name="image">
 
         <input type="hidden" name="stateChecker" value="${stateChecker}">
@@ -90,6 +95,22 @@
                 </div>
             </div>
         </div>
-    </form>
 
+        <script>
+          var uploadField = document.getElementById("avatar")
+
+          uploadField.onchange = function() {
+            if(this.files[0].size > (100*1024)) {
+              document.getElementById("avatarInfo").style.display='none'
+              document.getElementById("avatarError").style.display='block'
+              this.value = ""
+            } else {
+              document.getElementById("avatarInfo").style.display='block'
+              document.getElementById("avatarError").style.display='none'
+            }
+          }
+        </script>
+
+    </form>
+    
 </@layout.mainLayout>

src/themes/d4science/account/messages/messages_en.properties

@@ -6,4 +6,6 @@ authenticatorFinishSetUpMessage=Each time you sign in to your D4Science account,
 authenticatorSMSMessage=D4Science will send the Verification code to your phone as the two-factor authentication.
 
 changeAvatarHtmlTitle=Edit Avatar
-noAvatarSet=No image set
+noAvatarSet=Please upload an image (100x100px size is suggested) choosing a file and clicking on Save button.
+avatarFileSizeMessage=The maximum file size permitted is 100KB.
+avatarFileTooBig=File too big error!

src/themes/d4science/account/messages/messages_it.properties

@@ -1,4 +1,6 @@
 accountManagementTitle=D4Science Account Management
 
 changeAvatarHtmlTitle=Modifica Avatar
-noAvatarSet=Nessuna immagine impostata
+noAvatarSet=Caricare un'immagine (si consiglia una dimensione di 100x100 px) con Scegli file e premendo quindi su Salva
+avatarFileSizeMessage=La massima dimensione consentita del file è di 100KB.
+avatarFileTooBig=Dimensione file eccessiva!