Prevent negative values for number inputs

- settings: incoming/outgoing rate limit - min: 0
- folder: maximum age (staggered file versioning) - min: 0
- help texts for validation

gui/syncthing/folder/editFolderModalView.html

@@ -118,10 +118,11 @@
                 <p class="help-block"><span translate>Files are moved to date stamped versions in a .stversions folder when replaced or deleted by Syncthing.</span> <span translate>Versions are automatically deleted if they are older than the maximum age or exceed the number of files allowed in an interval.</span></p>
                 <p translate class="help-block">The following intervals are used: for the first hour a version is kept every 30 seconds, for the first day a version is kept every hour, for the first 30 days a version is kept every day, until the maximum age a version is kept every week.</p>
                 <label translate for="staggeredMaxAge">Maximum Age</label>
-                <input name="staggeredMaxAge" id="staggeredMaxAge" class="form-control" type="number" ng-model="currentFolder.staggeredMaxAge" required></input>
+                <input name="staggeredMaxAge" id="staggeredMaxAge" class="form-control" type="number" ng-model="currentFolder.staggeredMaxAge" required min="0"></input>
                 <p class="help-block">
                   <span translate ng-if="folderEditor.staggeredMaxAge.$valid || folderEditor.staggeredMaxAge.$pristine">The maximum time to keep a version (in days, set to 0 to keep versions forever).</span>
                   <span translate ng-if="folderEditor.staggeredMaxAge.$error.required && folderEditor.staggeredMaxAge.$dirty">The maximum age must be a number and cannot be blank.</span>
+                  <span translate ng-if="folderEditor.staggeredMaxAge.$error.min && folderEditor.staggeredMaxAge.$dirty">A negative number of days doesn't make sense.</span>
                 </p>
               </div>
               <div class="form-group" ng-if="currentFolder.fileVersioningSelector == 'staggered'">

gui/syncthing/settings/settingsModalView.html

@@ -5,7 +5,7 @@
       <h4 translate class="modal-title">Settings</h4>
     </div>
     <div class="modal-body">
-      <form role="form">
+      <form role="form" name="settingsEditor">
         <div class="row">
 
           <div class="col-md-6">
@@ -17,13 +17,19 @@
               <label translate for="ListenAddressStr">Sync Protocol Listen Addresses</label>
               <input id="ListenAddressStr" class="form-control" type="text" ng-model="tmpOptions._listenAddressStr">
             </div>
-            <div class="form-group">
+            <div class="form-group" ng-class="{'has-error': settingsEditor.MaxRecvKbps.$invalid && settingsEditor.MaxRecvKbps.$dirty}">
               <label translate for="MaxRecvKbps">Incoming Rate Limit (KiB/s)</label>
-              <input id="MaxRecvKbps" class="form-control" type="number" ng-model="tmpOptions.maxRecvKbps">
+              <input id="MaxRecvKbps" name="MaxRecvKbps" class="form-control" type="number" ng-model="tmpOptions.maxRecvKbps" min="0">
+              <p class="help-block">
+                <span translate ng-if="settingsEditor.MaxRecvKbps.$error.min && settingsEditor.MaxRecvKbps.$dirty">The rate limit must be a non-negative number (0: no limit)</span>
+              </p>
             </div>
-            <div class="form-group">
+            <div class="form-group" ng-class="{'has-error': settingsEditor.MaxSendKbps.$invalid && settingsEditor.MaxSendKbps.$dirty}">
               <label translate for="MaxSendKbps">Outgoing Rate Limit (KiB/s)</label>
-              <input id="MaxSendKbps" class="form-control" type="number" ng-model="tmpOptions.maxSendKbps">
+              <input id="MaxSendKbps" name="MaxSendKbps" class="form-control" type="number" ng-model="tmpOptions.maxSendKbps" min="0">
+              <p class="help-block">
+                <span translate ng-if="settingsEditor.MaxSendKbps.$error.min && settingsEditor.MaxSendKbps.$dirty">The rate limit must be a non-negative number (0: no limit)</span>
+              </p>
             </div>
             <div class="col-md-6">
               <div class="form-group">