Proposal for Improving Internationalization (i18n)

[dawin64]

The current i18n system in this project has several limitations that make it difficult to maintain and expand internationalization support. I propose to change it to only use one HTML file per page, In the current (English) HTML files, for example the <span>Hello World</span> would become something like <span msg="helloWorld"></span> where "helloWorld" would be the key inside the _locale/*/messages.json", that would allow us to delete de/ es/ he/ it/ pt_BR/ in the future, and allow us to translate more pages easier.

Would you be interested in something like this?

[proginosko]

I had thought about this approach previously, but the problem is that the order of words/clauses isn't the same across languages, so you can't assume that any section of text can simply be swapped out for an equivalent in another language. The most extreme case of this occurs with Hebrew, which has right-to-left text order. (Compare the two blocked.html files and you'll see what I mean.)

[dawin64]

I thought about this issue, and i think i have a solution like placeholders <p msg="helloWorld" msg-arg1="SOME CUSTOM PARSER"></p> this will insert an element like a <span></span> with an id or a link or simply a value

inside the messages.json: str1: %1 test str2: test %1 this will be the following code after the i18n process <p msg="test" msg-arg1="SOME CUSTOM PARSER">test <span id="example"></span></p>

[dawin64]

For the custom parser, if this is something we would consider

[Key](https://example.com) < This would be replaced inside the DOM to <a href="https://example.com">Test</a>, the Key is the message key inside the messages.json

{strong}[ID] < This would be replaced inside the DOM to <strong><span id="ID"></span></strong>

[dawin64]

When we would use it at the current state the following from the blocked.html would become

before:
<p id="lbKeywordMatched">Keyword matched: <strong><span id="lbKeywordMatch"></span></strong></p>
<p>The page will be unblocked at: <strong><span id="lbUnblockTime">the end of time</span></strong></p>

after:
<p id="lbKeywordMatched" msg="keywordMatched" msg-arg1="{strong}[lbKeywordMatch]"></p>
<p msg="unblockTime" msg-arg1="{strong}[lbUnblockTime]"></p>
edit with changes mentioned below:
<p id="lbKeywordMatched" msg="keywordMatched" msg-arg1="{strong}[lbKeywordMatch]"></p>
<p msg="unblockTime" msg-arg1="{strong}[lbUnblockTime][unblockTimeRemain]"></p>

messages.json
keywordMatched = Keyword matched: %1
unblockTime = The page will be unblocked at: %1
unblockTimeRemain = the end of time

[dawin64]

I have now tested it a bit and I think this is an acceptable solution, but the {strong}[ID] should have another argument Key like {strong}[ID][Key] Key is the key inside the messages.json and adds the value to the innerHtml <strong><span id="ID">Value from message json</span></strong> and all of this can be parsed with an regex. This should work for blocked.html, delayed.html, popup.html

If this is something you would be interested in, then I would continue.