Hebrew translation

[DeepSpace2]

@aatishb I didn't add a link to index-he.html on index.html, left it for you to do as you see fit 👍

[aatishb]

This is great, thanks so much! I'll add a line to the header that lists all the available translations.

I noticed that the graphs have text that's not listed in the HTML page. This should be an easy fix, I'll look into it now & get back to you.

[aatishb]

@DeepSpace2 I tried to make the graphs translatable by passing the text from html to the layout function in the graph component.

Could you please make the following edits:

• re-translate the credit line in the header on `index-he.html
• translate the word 'Hebrew' into Hebrew in the header on index.html & index-he.html
• translate the text in graph2Layout and graph3Layout function into hebrew on index-he.html ((these are located in the <graph> component)

Thanks, and let me know if any issues arise!

[DeepSpace2]

@aatishb Thanks! Only one small thing is left: The definition of anim-with-caption in vue-definitions should also be translateable from index.html (as of now, the words "Contagious", "Person" and "Susceptible" are hardcoded in vue-definitions.js).

Can we pass them as arguments, like :mask1 and :mask2?

If I had any idea how vue components work I'd have done it myself 😂 I'm more of a backend guy.

[aatishb]

Thanks! Yes, we can definitely pass these words as arguments.. looking into it.

[DeepSpace2]

@aatishb I think I got it. We can add the three words to the props array, then pass the words, translations pairs as attributes, like

<anim-with-caption :mask1="false" :mask2="false" person="אדם">

I also noticed something else. Since Hebrew is right-to-left I added dir="rtl" on body. However, I noticed just now that it also flips the captions on the animations, but that can be fixed by adding dir="ltr" to the div in the template.

Do you agree with this approach?

EDIT We need to translate and pass the entire phrase ("Contagious person" and "Suspectible person") and not individual words because in some languages (for example, Hebrew and Spanish) the adjective comes after the noun.

[aatishb]

@DeepSpace2 yes, that's the right way to extend the component. 👍

I think your approach with the div sounds good. It seems like it would fix this issue but won't affect other languages that are left to right.

My quick thoughts are, if this is the same approach for other right to left languages then let's edit the template in vue-definitions.js. If it's specific to Hebrew that we can add the dir tag in index-he.html.

[aatishb]

Passing the entire phrase sounds good!

[DeepSpace2]

@aatishb Done 👍 I've no idea why, but camel-casing the variable names didn't work. Feel free to change them if you think it's necessary.

[aatishb]

@DeepSpace2 haha this is how Vue works because HTML components are not case sensitive. If you camelCase the components in javascript you have to kebab-case them in HTML. https://vuejs.org/v2/guide/components-props.html

Thanks so much for your efforts! I'll plan to review and merge over the weekend.

[aatishb]

Tagging the translations thread: #4

[aatishb]

Hi @DeepSpace2, I was just going through to compare against the original. One question I had is did you maybe miss a few paragraphs at the end, specifically these ones?

[DeepSpace2]

@aatishb Thanks, added the missing paragraphs

[aatishb]

@all-contributors add @DeepSpace2 for translation

[allcontributors]

@aatishb

I've put up a pull request to add @DeepSpace2! 🎉

[aatishb]

Thanks for your efforts on this @DeepSpace2!

[aatishb]

@DeepSpace2 One more thing, feel free to add a line of credit to yourself in index-he.html. You can add it right after 'This essay was created by Aatish Bhatia in collaboration with Henry Reich.', something like 'It was translated into Hebrew by Adi Vaknin.', and you're welcome to link your name to your twitter or website.