Multi language banner load variables from text question (AS3)

[ZZWWBUG]

Hey,

I have a banner example and want to make it multilingual.

I would prefer to load words from 1 external text file (language_txt.txt) for each translation.

I have dynamic text fields with instance names. (Header_001, Slogan_001, Button_001)

With what code do I load the variables from (language_txt.txt) ?
And in which frame do I put that code in the *.fla? (970x250-multi-language-banner.fla)

What code do I put in the *.text (language_txt.txt) files to link the translated words to the dynamic text fields.

Goal: An explanation and tuturiol for many creative people who can't program very well 😉

----------------------------------------------------------------
this.Header_001 = new cjs.Text("Sun is shining the weather is sweet", "normal 700 44px 'Roboto'", "#FFFFFF");
this.Slogan_001 = new cjs.Text("Make you want to move your dancing feet", "normal 700 28px 'Roboto'");
this.Button_001 = new cjs.Text("CLICK HERE", "normal 700 28px 'Roboto'", "#FFFFFF");
----------------------------------------------------------------

Files: Attachments - Github
970x250-multi-language-banner.fla
970x250-multi-language-banner.html
970x250-multi-language-banner.js
Multi-language-banner-load-variables-from-text-question-as3-adobe-animate
- language_txt.txt

More @ https://github.com/ZZWWBUG/oldskool
More @ https://github.com/ZZWWBUG/oldskool/find/main

----------------------------------------------------------------

Language 1 - (language_txt.txt)
Header_001 = Sun is shining the weather is sweet
Slogan_001 = Make you want to move your dancing feet
Button_001 = CLICK HERE

Language 1 - (language_txt.txt)
Header_001 = El sol está brillando, el clima es dulce
Slogan_001 = Te dan ganas de mover tus pies bailando
Button_001 = HAGA CLIC AQUÍ

Language 1 - (language_txt.txt)
Header_001 = Die Sonne scheint, das Wetter ist schön
Slogan_001 = Machen Sie Lust, Ihre tanzenden Füße zu bewegen
Button_001 = KLICKE HIER

----------------------------------------------------------------

[JoãoCésar · Accepted solution]

Hi.

Here is a sample using a JSON file.

JavaScript code:

var root = this;
var xhttp = new XMLHttpRequest();
var languages = [ "enUS", "ptBR" ];
var language = 1;
var json;

function main()
{
	xhttp.onreadystatechange = function()
	{
		if (this.readyState == 4 && this.status == 200)
			loadComplete(xhttp.responseText);
	};

	xhttp.open("GET", "languages.json", true);
	xhttp.send();
}

function loadComplete(data)
{
	json = JSON.parse(data);
	root.win.Header_001.text = json[languages[language]].Header_001;
	root.win.Slogan_001.text = json[languages[language]].Slogan_001;
	root.win.clickHereButton.button.Button_001.text = json[languages[language]].Button_001;
}

main();

FLA / code / source download:

https://bit.ly/3CYxndS

I hope this helps.

Regards,

JC

[ZZWWBUG]

Thank you mister JoãoCésar 🙂

It works realy nice... I also added a Dutch translation and that works fine.

If I run into a problem in the further development of this option, I'll post another question here.

Now I'm going to see how this works in an HTML5 banner/presentation with lots of layers and texts.

Greetings From Holland!

[JoãoCésar]

Awesome! You're welcome!

Just let us know if you need further assistance and I wish success in your journey.

Greetings from Brazil!

Regards,

JC

[Leen5FA6]

Hi ZZWWBUG and JoãoCésar;

I came here because I am facing a similar problem. I should create a series of banners in 20+ languages.

I had downloaded your source files to test but when I export I only get to see 1 index.html file, each time from the original design (English). How do you get an index.html file for each language?

Thanks in advance from a designer who doesn't understand code very well.

[kglad]

@Leen5FA6 

it's the same index file for each.  you can rename it after it's published.

[JoãoCésar]

Hi.

The approach suggested is actually supposed to change the language when the banner is running.

What you could do is to get the language from the website's url. For example:

https://www.yourWebsite.com?language=ptBR

And the code could be something like this:

var root = this;
var languages = { EN_US: "enUS", PT_BR: "ptBR" };
var jsonsrc="languages.json";
var xhttp, json, urlParams, language;

function main()
{
	xhttp = new XMLHttpRequest();
	
	xhttp.onreadystatechange = function()
	{
		if (this.readyState == 4 && this.status == 200)
			loadComplete(xhttp.responseText);
	};

	xhttp.open("GET", jsonSrc, true);
	xhttp.send();
}

function loadComplete(data)
{
	urlParams = new URLSearchParams(window.location.search);
	language = languages[urlParams.get("language")] || languages.EN_US;
	json = JSON.parse(data);
	root.win.Header_001.text = json[language].Header_001;
	root.win.Slogan_001.text = json[language].Slogan_001;
	root.win.clickHereButton.button.Button_001.text = json[language].Button_001;
}

main();

In this way, you just need only one index.html file and to change the url to update the idiom.

Are you able to do it?

Please let us know.

Regards,

JC