maverick/docbrown
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix character limits i18n (#15830)

Browse source
This commit is contained in:
yheuhtozr 2021-12-21 21:15:21 +09:00 • committed by GitHub
parent 7d80475f1a
commit 5253717797
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 11 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
app/javascript/packs/userProfileSettings.js
View file

@ -4,10 +4,11 @@ const profileFields = document.querySelectorAll('[id^="profile["]');
export function fieldCharacterLimits() {
profileFields.forEach((node) => {
const field = document.getElementById(node.id);
const fieldValueLength = field.value.length;
const fieldValueLength = [...field.value].length; // 😀 counts as 1
const fieldCharacterSpan = document.getElementById(
field.dataset.characterSpanId,
);
// TODO: [yheuhtozr] make the entire fraction into one i18n string
fieldCharacterSpan.innerHTML = fieldValueLength;
});
@ -16,8 +17,9 @@ export function fieldCharacterLimits() {
return;
}
document.getElementById(event.target.dataset.characterSpanId).innerHTML =
event.target.value.length;
document.getElementById(event.target.dataset.characterSpanId).innerHTML = [
...event.target.value,
].length;
});
}

8
app/views/users/_profile.html.erb
View file

@ -70,7 +70,7 @@
aria: { describedby: "url-description" },
data: { character_span_id: "url-characters" } %>
<p id="url-description" class="crayons-field__description align-right">
<span class="screen-reader-only">Available characters used: </span>
<span class="screen-reader-only"><%= t("views.settings.characters") %></span>
<span id="url-characters"></span>/100
</p>
</div>
@ -87,7 +87,7 @@
aria: { describedby: "location-description" },
data: { character_span_id: "location-characters" } %>
<p id="location-description" class="crayons-field__description align-right">
<span class="screen-reader-only">Available characters used: </span>
<span class="screen-reader-only"><%= t("views.settings.characters") %></span>
<span id="location-characters"></span>/100
</p>
</div>
@ -104,7 +104,7 @@
aria: { describedby: "summary-description" },
data: { character_span_id: "summary-characters" } %>
<p id="summary-description" class="crayons-field__description align-right">
<span class="screen-reader-only">Available characters used: </span>
<span class="screen-reader-only"><%= t("views.settings.characters") %></span>
<span id="summary-characters"></span>/200
</p>
</div>
@ -146,7 +146,7 @@
data: { character_span_id: "#{field.attribute_name}-characters" },
class: "crayons-textfield") %>
<p id="<%= field.attribute_name %>-description" class="crayons-field__description align-right">
<span class="screen-reader-only">Available characters used: </span>
<span class="screen-reader-only"><%= t("views.settings.characters") %></span>
<span id="<%= field.attribute_name %>-characters"></span>/<%= character_count_denominator(field["input_type"]) %>
</p>
<% end %>

1
config/locales/views/settings/en.yml
View file

@ -64,6 +64,7 @@ en:
make: Make primary
primary: primary
remove: Remove card
characters: "Available characters used: "
complete:
heading: Confirm your email to complete your profile.
desc: While you're at it, go ahead and fill everything out.

1
config/locales/views/settings/fr.yml
View file

@ -64,6 +64,7 @@ fr:
make: Make primary
primary: primary
remove: Remove card
characters: "Available characters used: "
complete:
heading: Confirm your email to complete your profile.
desc: While you're at it, go ahead and fill everything out.