Alheimsins / bigfive-web

Website for taking personality tests
MIT License
213 stars 86 forks source link

How to decide in which language the results should displayed? #184

Closed jfrcom closed 4 years ago

jfrcom commented 5 years ago

I would like to know how to change the results language. Can I decide in which language the results will be displayed?

zrrrzzt commented 5 years ago

If the result is translated it will be displayed in the same language as the questions. It will use english as default. The module responsible for results is b5-result-text so feel free to translate if anything is missing. If you want to override the selected language this is the line you'll have to change https://github.com/Alheimsins/bigfive-web/blob/master/pages/showResult.js#L25

jfrcom commented 5 years ago

Is it possible to display the results in another language that questions were?

Edit: I just found out the possibility to change the lang in the database. But is there another possibility without creating new document and ID?

Edit 2: Where to change in the result page where it should redirect. When I change line 27 to another page (I duplicated showresultfile and made one with en and the another one with de but I always get the showresult file. It doesnt matter if there is Router.pushRoute('shworesultde', { id }) or Router.pushRoute('shworesult', { id }). I always get redirected to the showresultfile.

zrrrzzt commented 5 years ago

So this is what happens when you load a result:

This means that result does not care about the original language. It shows whatever you sends it. In this version we only shows the language selector on the test page and use chosen language for the results. But you do not have to do it that way. You can have a selector on the showResults page or you can hard code another language id if that is what you prefer. Here's an example of a result page with language selector

This is from another implementation I did for a pure static version b5-web but mechanics are the same.

You redirect to showresult in pages/result https://github.com/Alheimsins/bigfive-web/blob/master/pages/result.js#L27 if you want to load a result and from pages/test https://github.com/Alheimsins/bigfive-web/blob/master/pages/test.js#L126 if you just have taken a test

If you always want to show results in German you can override this line https://github.com/Alheimsins/bigfive-web/blob/master/pages/showResult.js#L25 with something like

return getResult({ scores, lang: 'de' })

Happy Hacking :-)

jfrcom commented 5 years ago

Thanks a lot for your answer! Where is the code for the language selector?

zrrrzzt commented 5 years ago

For the test site pages/test.js

The component is here https://github.com/Alheimsins/bigfive-web/blob/master/components/LanguageBar.js

jfrcom commented 5 years ago

I meant this [lang selector]https://b5.allthethings.win/result?id=eMKcwq3CmMKxDsKCQBBEw7_DpWoaRS3DqMOIwoXClsO7AGNxQSQmCgloLAjDvy52w4TChMOLwrtdOhLDhsOdwrvDmcOZw5nDhcORPHzDm8K8fVPCm8OMwrTCnUnCjG_Ch0_DnQ8mO8KPw6bDmj3DvcK9wp3Dn8OYw7nDhcONV8O1a37DnsONw49Dw5XDtcK_X8KkZkoWwrB8AcObwq_Dg8OKBcOsw4jCosKdw5ZhRTwsXcKHORYtZ8ORwpZJD8KMwpAAb8KOw4FywpbDlMOGwp8Nw540wqAQw4vDqHUswprCoMO0AcK9wpXDscORAsK8FcKsWMOwbHk8IcKwClBvw7rClhHDsBYgBMK2MzQuF8KvED3DjDFCYMOpYTvDm3jCvcOpbcKwwowvPcO0N3jChcOAw5nDoMOMwoLDkcKgwr9BU8KFTg7Du1TCkBTDkhvDoG1bw4PCh30Kw6cCNC4bX3powqrDkC3DtcKEQBssGUzCsErDgSvDqHtBwrDCqULCi8KGesKDey88G8KUJWxAWCwYDcOOLEjCr14hcMKew4JhBMKjCcKqwqA3LsOYC3DClRJYNBQ5woTDgUHCqcKnd1vCkW_Dm8O1cDoLeMKDScOhFSAhwrABw7Ufw6zCgj8Tw7QfUMKQEMOBw6rCvsOtw4bCpXdLw4Eww7pLesKZwr4dw4c1wrQQ) in the result page.

zrrrzzt commented 5 years ago

ahhh

methods are required here https://github.com/zrrrzzt/b5-web/blob/master/pages/result.js#L9 and here here's the translate function https://github.com/zrrrzzt/b5-web/blob/master/pages/result.js#L127 and this is where the language bar is rendered https://github.com/zrrrzzt/b5-web/blob/master/pages/result.js#L142

jfrcom commented 5 years ago

I tried to implement this to the showresult.js page but I still get an error. I replaced in this function translateResume (e) { e.preventDefault() const language = e.target.dataset.language const scores = this.state.scores const resume = getResult({ scores: scores, lang: language }) this.setState({ resume: resume, viewLanguage: language }) } the line this.state.scores with calculateScore but when I try to change the language I get this error

TypeError: Cannot read property 'setState' of undefined

I would really appreciate if you could help me!

zrrrzzt commented 5 years ago

b5-web and bigfive-webare two different solutions for doing simple big five testing. Even though they are using the same modules they are not necessarily compatible enough to do copy-paste between them.

Do you have a repo for your version? I can take a look but no guarantees.

You can of course add "language selector for result page" to the feature request document https://github.com/Alheimsins/bigfive-web/issues/95