If you are working on list extension, there is one little thing which you should know about.
This tiny thing is a list column translator.
Might sound simple, but in fact it is a very-very powerful tool when you want to change your list representation.
List Columns Translators are the client side translators, which are used as well as List dictionaries, but when you need translations depending on your client-side context.
From previous video tutorial you can find out how to extend list columns in general.
To recap, you should add column extension to your list definition extension in configuration and define @translate attribute.
Functionally translators themselves are very simple, you have one parameter which is the result of definition xPath selection by @selector attribute. And the return result, which will be pasted as innerHTML(!) to this column value container.
Let`s create a simple Translator which will calculate the vowels percentage of item title and put this column next to Title column.
Then, you have to create a group which will contain a reference to the file with implementation.
And associate it with one of the existing groups through resource extension.
And see what vowel percentage your items has.
Let`s add some charm.
Let`s visualize it!
To do so, add a new column with one more translator:
Put the translator implementation:
And see the result.
Pretty simple, right?