diff --git a/hypha/apply/templates/forms/includes/field.html b/hypha/apply/templates/forms/includes/field.html index 7005e868d3..c10b00ef17 100644 --- a/hypha/apply/templates/forms/includes/field.html +++ b/hypha/apply/templates/forms/includes/field.html @@ -8,13 +8,17 @@ data-toggle-on="{{ field.field.choices.0.0 }}" data-toggle-off="{{ field.field.choices.1.0 }}" {% endif %} - {% if widget_type == 'clearable_file_input' or widget_type == 'multi_file_input' or widget_type == 'single_file_field_widget' or widget_type == 'multi_file_field_widget' %}data-js-file-upload{% endif %} + {% if widget_type == 'clearable_file_input' or widget_type == 'multi_file_input' or widget_type == 'single_file_field_widget' or widget_type == 'multi_file_field_widget' %}data-js-file-upload data-required-text="{% trans 'This field is required.' %}"{% endif %} {% if field.field.group_number > 1 %} data-hidden="{% if not show_all_group_fields and not field.field.visible %}true{% else %}false{% endif %}" data-required="{{ field.field.required_when_visible }}" {% endif %} {% if field.field.word_limit %} data-word-limit="{{ field.field.word_limit }}" + data-word-count-characters="{% trans 'characters' %}" + data-word-count-out-of="{% trans 'out of' %}" + data-word-count-close="{% trans '(Close to the limit)' %}" + data-word-count-over="{% trans '(Over the limit)' %}" {% endif %} {# fmt:off #} {% if widget_type == 'text_input' and field.field.max_length %} diff --git a/hypha/static_src/javascript/file-uploads.js b/hypha/static_src/javascript/file-uploads.js index bde64e6bad..5f9f6c346f 100644 --- a/hypha/static_src/javascript/file-uploads.js +++ b/hypha/static_src/javascript/file-uploads.js @@ -39,7 +39,10 @@ htmx.onLoad(function () { input.addEventListener("invalid", function (event) { event.preventDefault(); // Prevent default browser behavior - let errorMessage = "This field is required."; + const fileUploadEl = input.closest("[data-js-file-upload]"); + const errorMessage = fileUploadEl + ? fileUploadEl.dataset.requiredText + : "This field is required."; // Find the closest dff-uploader wrapper and display an error let container = input.closest(".form__item"); diff --git a/hypha/static_src/javascript/tinymce-word-count.js b/hypha/static_src/javascript/tinymce-word-count.js index 11fb2f35f5..34ba49825b 100644 --- a/hypha/static_src/javascript/tinymce-word-count.js +++ b/hypha/static_src/javascript/tinymce-word-count.js @@ -9,11 +9,13 @@ */ function updateWordCount(element) { const currentCount = parseInt(element.innerText.match(/\d+/)?.[0], 10) || 0; - const limit = parseInt( - element.closest("[data-word-limit]").dataset.wordLimit, - 10 - ); + const fieldset = element.closest("[data-word-limit]"); + const limit = parseInt(fieldset.dataset.wordLimit, 10); const warningThreshold = limit * WARNING_THRESHOLD; + const textCharacters = fieldset.dataset.wordCountCharacters || "characters"; + const textOutOf = fieldset.dataset.wordCountOutOf || "out of"; + const textClose = fieldset.dataset.wordCountClose || "(Close to the limit)"; + const textOver = fieldset.dataset.wordCountOver || "(Over the limit)"; /** * Clear warning states and classes @@ -23,21 +25,21 @@ element.classList.remove("word-count-warning", "word-count-warning-2"); } - if (element.textContent.includes("characters")) { + if (element.textContent.includes(textCharacters)) { clearWarnings(); return; } - element.dataset.afterWordCount = ` out of ${limit}`; + element.dataset.afterWordCount = ` ${textOutOf} ${limit}`; if (currentCount <= warningThreshold) { clearWarnings(); } else if (currentCount <= limit) { - element.dataset.afterWordCount += " (Close to the limit)"; + element.dataset.afterWordCount += ` ${textClose}`; element.classList.remove("word-count-warning-2"); element.classList.add("word-count-warning"); } else { - element.dataset.afterWordCount += " (Over the limit)"; + element.dataset.afterWordCount += ` ${textOver}`; element.classList.add("word-count-warning-2"); } }