Page MenuHomePhabricator

The labels and numbers in CX translation trend graph are not localized
Closed, ResolvedPublic

Description

T90104 created a visualization of translation trends. Now the graph can have localizable numbers and labels.

image.png (802×2 px, 235 KB)

In this screenshot taking in Farsi (fa) language, we see that in the following placed the numerals are not localised:

  • The numbers on Y-axis (should use mw.language.convertNumber from MediaWiki)
  • The days on X-axis (should likely use a proper date formatting from MediaWiki
  • The data on the tooltip (as above)
  • The number on the tooltip

Fixing these requires reading the Chart.js api http://www.chartjs.org/ to understand how those places can be customized.

(copied from https://phabricator.wikimedia.org/T94020#3761885)

Event Timeline

santhosh raised the priority of this task from to Medium.
santhosh updated the task description. (Show Details)
santhosh added a project: ContentTranslation.
santhosh added a subscriber: santhosh.

@Purodha: Are you going to mentor a GCI student to fix this task? If yes, please explicitly say so and thanks a lot!

I will mentor this in #GCI2015

Florian added a subscriber: Florian.

@D3r1ck01 It might be reasonable to have a bit more informative description for the task: What does the student need to change and how? Is there any information material they can use to find that out? Where do they get help or documentation on making things translateable? :)

image.png (802×2 px, 235 KB)

In this screenshot taking in Farsi (fa) language, we see that in the following placed the numerals are not localised:

  • The numbers on Y-axis (should use mw.language.convertNumber from MediaWiki)
  • The days on X-axis (should likely use a proper date formatting from MediaWiki
  • The data on the tooltip (as above)
  • The number on the toolip

Fixing these requires reading the Chart.js api http://www.chartjs.org/ to understand how those places can be customized.

I don't understand how to format the date on the X-axis. If I have a variable that holds the date in the format "2001-1-1", how would I go about converting this into the wanted format?

The current format is 2001-01-01 (this is also what the ISO standard says) and not 2001-1-1.

You can use moment.js to convert: moment( variable ).format('L'); // 13.12.2017

Change 398174 had a related patch set uploaded (by Ryan10145; owner: Ryan10145):
[mediawiki/extensions/ContentTranslation@master] Added Localization for CX Translation Trend Graph

https://gerrit.wikimedia.org/r/398174

Is there any way for me to get any more information about which dates in particular are causing an error with moment.js? I have tried setting up the extension on my own computer in order to see the problems for myself and try to fix them, but I have been having technical difficulties.

Change 398174 merged by jenkins-bot:
[mediawiki/extensions/ContentTranslation@master] Added Localization for CX Translation Trend Graph

https://gerrit.wikimedia.org/r/398174

Nikerabbit renamed this task from The labels and numbers in CX translation trend graph is not localized to The labels and numbers in CX translation trend graph are not localized.Jan 5 2018, 2:48 PM
Nikerabbit updated the task description. (Show Details)

@Nikerabbit I might be wrong, but can you double-check for the proper font size and also the font contrast/resolution (on the tooltip too)? Looks rather small (fawiki -wmf.15, Chrome, 100% scale).

Screen Shot 2018-01-08 at 4.50.47 PM.png (667×1 px, 77 KB)

Even though it is small, it looks legible to me. I believe @Pginer-WMF or @Volker_E would know better from design and accessibility point of view whether we should create a new task to improve size and/or contrast.

@Nikerabbit The graph legend is indeed to small. From a readability perspective we should at least go for 12pt (or it's screen equivalent) if not higher. Compare this article (and its graphs).

Arrbee claimed this task.
Arrbee added a subscriber: Arrbee.