Multilanguage - i18n for custom text in Sugarcube 2 - possible?

Question

Hello, 

I have already implemented the l10nStrings for the ui elements according to the languages I have in my story. So far so good.

What if extending the translation to custom string/words not belonging to the Sugarcube default ui? For instance, if I want to translate a text of my own within the  ::PassageFooter or ::StoryInterface, how can this be done? Extending the following with custom variable (e.g. l10.nStrings.CUSTOMSTRING)?

function initLanguage() {
	/* Set the `l10nStrings` properties for each supported language.
	English need not receive a case as it is the default language. */
	switch (setup.i18n.langs[settings.lang]) {
	// NOTE: User customization required here.
	case 'en':
		l10nStrings.settingsTitle = 'Einstellungen';
           l10nStrings.CUSTOMSTRING  = 'TestEN';
		break;
	case 'fr':
		l10nStrings.settingsTitle = 'Paramètres';
           l10nStrings.CUSTOMSTRING  = 'TestFR';
		break;
	}
	/* finally, set the `lang` attribute on the html tag */
	$('html').attr('lang', setup.i18n.langs[settings.lang]);
}

 

Answer 1

I do not recommend attempting to extend the l10nStrings object for various reasons.  Primary among them is that doing so is mostly pointless as it's only used by SugarCube's UI.

If you want to be able to switch between localized strings, I'd suggest simply adding them to a custom setup object property.  For example:

setup.myStrings = {
	en : {
		someString    : 'TestEN',
		anotherString : 'TestEN'
	},
	fr : {
		someString    : 'TestFR',
		anotherString : 'TestFR'
	}
};

 

Comments

Hi TheMadExile,

thanks for this clarification, things are getting clear. Would be great if you can just share some example for couple of languages, for both default one (EN) and say FR as an example. Thank you a lot

---

Check my original answer for an added example.

---

Does your code above require a case 'en' and break; to detect the languages?

how then you add these string for instance into a ::PassageFooter ?

I think I am far from getting it. This is my progress within the javascript area

function initLanguage() {
	switch (setup.i18n.langs[settings.lang]) {
	case 'en':
		l10nStrings.settingsTitle = 'Einstellungen';
		break;
	case 'fr':
		l10nStrings.settingsTitle = 'Paramètres';
		break;
	}

	setup.myStrings = {
		en : {
			someString    : 'TestEN',
			anotherString : 'TestEN'
		},
		fr : {
			someString    : 'TestFR',
			anotherString : 'TestFR'
		}
	};

	$('html').attr('lang', setup.i18n.langs[settings.lang]);
}
function changeLanguage() {
	window.location.reload();
}
Setting.addList('lang', {
	label    : 'Language.',
	list     : setup.i18n.labels(),
	default  : setup.i18n.labelFromCode('en'),
	onInit   : initLanguage,
	onChange : changeLanguage
});

postrender['i18n-passage-include'] = function (content) {
	var passage = State.passage + '_' + setup.i18n.langs[settings.lang];
	$(content).empty().wiki(Story.get(passage).processText());
};

 

---

That's not all of the code you're using.  In future, you should really show all of the code or link to it, if you've gotten it from someplace else.  I'm going to assume you're using my sc-i18n-example.twee Gist.

If you want your custom strings to fully integrate into that code, then I'd suggest something like the following, rather than my previous example: (n.b. I shortened the name of the setup property to strings)

	/***********************************************************
		Set up a `i18n` object on SugarCube's `setup` object.
	***********************************************************/
	/* setup.i18n code here */


	/***********************************************************
		Set up a `strings` object on SugarCube's `setup` object.
	***********************************************************/
	setup.strings = {
		/*
			Set the English default values.

			These should be overridden within `initLanguage()`.
			for each supported non-English language.
		*/
		someString    : 'someString test (EN)',
		anotherString : 'anotherString test (EN)'
	};


	/***********************************************************
		Language switching setting.
	***********************************************************/
	function initLanguage() {
		/*
			Set the `l10nStrings` and `setup.strings` properties
			to the appropriate values for each supported language.

			English need not receive a case, unless you simply
			want to alter the default values, as it is the
			default language.
		*/
		switch (setup.i18n.langs[settings.lang]) {
		case 'fr':
			/* l10nStrings properties */
			l10nStrings.settingsTitle = 'Paramètres';

			/* setup.strings properties */
			setup.strings.someString    = 'someString test (FR)';
			setup.strings.anotherString = 'anotherString test (FR)';

			break;
		}

		$('html').attr('lang', setup.i18n.langs[settings.lang]);
	}

 

---

Works perfectly, thank you. I will take your note to show the full code for future reference.

As of printing the variable into the story, I am considering the print funtion as follow (example):

<<print setup.strings.someString >>