feat(maxlength): set threshold dynamically to show remaining chars at 10%...

feat(maxlength): set threshold dynamically to show remaining chars at 10% maxLength, if maxLength is smaller than 10, set treshold to maxLength

discuss_data/static/js/project.js

@@ -155,12 +155,18 @@ $(document).on('beforeSend.ic', function (event, el, data) {
 /*
  * Attach to any element with .textarea or .textinput class and a maxlength
  * attribute a div which shows the number of remaining chars left to type
- * if remaining number falls under 50 chars
+ * if remaining number falls under threshold
  */
 
 $(document).on('keyup','.textarea, .textinput', function() {
   // get maxlength attribute
   var maxLength = $(this).attr( "maxlength" );
+  // set threshold to 10% of maxLength for large lengths or to maxLength for small
+  var threshold = maxLength
+  if (maxLength > 10) {
+    threshold = maxLength / 10
+  }
+
   if (maxLength != null){
     var length = $(this).val().length;
     var remainingLength = maxLength-length;
@@ -169,7 +175,7 @@ $(document).on('keyup','.textarea, .textinput', function() {
     // construct new id using this elements id
     var charsLeftId = elemId + '_chars_left';
 
-    if (remainingLength < 50) {
+    if (remainingLength < threshold) {
       if ($('#' + charsLeftId).length) {
         // if new div exists set text
         $('#'+charsLeftId).text(remainingLength);