Roll20 uses cookies to improve your experience on our site. Cookies enable you to enjoy certain features, social sharing functionality, and tailor message and display ads to your interests on our site and others. They also help us understand how our site is being used. By continuing to use our site, you consent to our use of cookies. Update your cookie preferences .
×
Create a free account

Translated Text and Untranslated Text

December 02 (1 year ago)

Edited December 02 (1 year ago)
GiGs
Pro
Sheet Author
API Scripter

I don't under stand why to use the data-i18n-vars tag, described over on: https://wiki.roll20.net/Character_Sheet_Translation#Variable_Replacement

In theory, it allows you to create an element with some text to translate and some text that isn't translated. The most obvious example I can thingk of would be an attribute name, which isn't translated. That's probably why this was created. So here are two examples. How would you do this:

<span data-i18n="description-strength">The @{strength} attribute is used for punching things</span>

I want everything shown in the span to be translated except the @Pstrength} attribute part.

Here's the same example, but using popup text.

<input type="number" title="use the @{strength} attribute for melee attacks" data-i18n-title="description-strength" name="attr_strength" value="10">

I wouldnt use both iof those in the same sheet, becuase they both create the description-strength key and include different text. But indulge me - how would you create translations uses i18n-vars?

December 02 (1 year ago)

Edited December 02 (1 year ago)
Scott C.
Forum Champion
Sheet Author
API Scripter
Compendium Curator

Same way for both:

<span data-i18n="description-{{strength attribute call}}" data-i18n-vars="@{strength}">The @{strength} attribute is used for punching things</span>
<input type="number" title="use the @{strength} attribute for melee attacks" data-i18n-title="description-{{strength attribute call}}" data-i18n-vars="@{strength}" name="attr_strength" value="10">

And then your translation.json (for the first one) will look like:

{
  "description-{{strength attribute call}}":"The {{0}} attribute is used for punching things"
}

the {{0}} is the call to the index in the data-i18n-vars for the element. So it will inject @{strength} into that location in the string. So you might get the following translated text in different languages:

  • English: The @{strength} attribute is used for punching things
  • Spanish: El atributo, @{strength}, se usa para golpear cosas
    • es.json would look like: El atributo, {{0}}, se usa para golpear cosas
  • German: Das @{strength} Attribut wird zum Stanzen von Dingen verwendet
    • de.json would look like: Das {{0}} Attribut wird zum Stanzen von Dingen verwendet
  • etc.

I'll note that I like to add a description of what the index is in the translation key to make it easier for translators to place (done above as {{strength attribute call}}.

Personally, I've found more use for this syntax in javascript for creating dynamically translated roll queries and similar. Of course, that does require some custom javascript functions to really do.

December 02 (1 year ago)
GiGs
Pro
Sheet Author
API Scripter

That helps a lot. Why the curly brackets in this? Are they programming or just text?

 data-i18n-title="description-{{strength attribute call}}"

December 02 (1 year ago)
Scott C.
Forum Champion
Sheet Author
API Scripter
Compendium Curator

GiGs said:

That helps a lot. Why the curly brackets in this? Are they programming or just text?

 data-i18n-title="description-{{strength attribute call}}"

It's just how I denote that "hey that number in the curly brackets in the value means this". There's nothing syntactic about it though.

December 02 (1 year ago)
GiGs
Pro
Sheet Author
API Scripter


Scott C. said:


Personally, I've found more use for this syntax in javascript for creating dynamically translated roll queries and similar. Of course, that does require some custom javascript functions to really do.

I don't follow this part yet, but I remember seeing something about dunamic translation ibn the "explanatory" page, so will this become more obvious as I reread it?

December 02 (1 year ago)
GiGs
Pro
Sheet Author
API Scripter


Scott C. said:

GiGs said:

That helps a lot. Why the curly brackets in this? Are they programming or just text?

 data-i18n-title="description-{{strength attribute call}}"

It's just how I denote that "hey that number in the curly brackets in the value means this". There's nothing syntactic about it though.


Okay, that's understood. I wonder if translators will understand that, but they probably aren't primed to see those brackets as computer code the way I am.

December 02 (1 year ago)
Scott C.
Forum Champion
Sheet Author
API Scripter
Compendium Curator

GiGs said:


Scott C. said:


Personally, I've found more use for this syntax in javascript for creating dynamically translated roll queries and similar. Of course, that does require some custom javascript functions to really do.

I don't follow this part yet, but I remember seeing something about dunamic translation ibn the "explanatory" page, so will this become more obvious as I reread it?

The dynamic translation on the wiki page is referring to a specific part of the i18n functionality where you can have it use an attribute's value as the translation key.

What I'm talking about there is let's say that you have a sheet that needs to ask for a bonus to use on a roll. For things that there are a set number of in the system (say skills), you can just write a translation key for this query for every skill roll in the system so that you get something along the lines of "What's your bonus to acrobatics?" in the roll query prompt. But, what if you want to do this same roll query when the player rolls for a weapon attack. One way is to just have the query be "What's your bonus on your weapon attack?", but by using the i18n-vars syntax in our resolution of the translation key in javascript, we can make this highly dynamic where it will say "What's your bonus on your +1 Cutlass of Piracy?" and have everything except the weapon name translated (because presumably, the player has written the item name in a language they can understand). I do something like this in the Scion and They Came From ... sheets.

The K-Scaffold actually provides an alias for getTranslationByKey that allows this. So in the K-scaffold given a translation JSON of:

{
  "What's your bonus on your {{weapon name}}?": "What's your bonus on your {{0}}?"
}

you can just write this to get the translated roll query prompt text and send it to the user:

getAttrs(['repeating_weapons_-oiuyoiu09s_name'],async (attributes) => {
  const promptText = k.getTranslationByKey("What's your bonus on your {{weapon name}}?",[attributes['repeating_weapons_-oiuyoiu09s_name']]);
  const roll = await startRoll(`&{template:default} {{bonus=?{${promptText}}}}`);
  finishRoll(roll.rollId);
});

That's of course a barebones example, but should show some of the use cases.

December 02 (1 year ago)
Scott C.
Forum Champion
Sheet Author
API Scripter
Compendium Curator


GiGs said:


Scott C. said:

GiGs said:

That helps a lot. Why the curly brackets in this? Are they programming or just text?

 data-i18n-title="description-{{strength attribute call}}"

It's just how I denote that "hey that number in the curly brackets in the value means this". There's nothing syntactic about it though.


Okay, that's understood. I wonder if translators will understand that, but they probably aren't primed to see those brackets as computer code the way I am.

Yeah, it's not ideal, but there really isn't a good way to make sure translators know exactly what a given key is being used for unless you want to write extremely verbose keys.

December 02 (1 year ago)
GiGs
Pro
Sheet Author
API Scripter


Scott C. said:

we can make this highly dynamic where it will say "What's your bonus on your +1 Cutlass of Piracy?" and have everything except the weapon name translated

Aha, I see what you're getting it. Thanks for the example code.