rubynor / bigfive-web

Website for taking personality tests

Rubynor Corporate Site

http://rubynor.heroku.com/

rubynor.no points to rubynor.com

Rubynor is built on a simple sinatra app to server static html pages for the company presentation It's built on the Lotus Template from themeforest

How to develop

KISS. just edit the static html under public/

# run the app locally
$ shotgun  # defaults to read config.ru

TODO

• convert CSS to SASS (scss)
• blog

bigfive-web's Issues

Translate the website to Thai

• Please know the language your translating to, if we wanted Google Translate we could do it ourselves :-)
• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

Jumpy UI On Mobile

I started taking the quiz on mobile and it was very challenging to use because the UI keeps jumping up and down and I'm constantly pressing the wrong choices.

Also, a small thing, the component that shows the test result id has too big a font size on mobile. It matches off the right of the viewport.

Thanks!

The dropdown menu is too long

The dropdown menu is too long, especially for mobile.

We need to find a good solution, so you don't need to scroll down on the menu.

Maybe have an own menu (flag icon with dropdown) for choosing language?

SCORES

I have seen that now it appears the score, but I have already done the tests to people. Could you please say to me the scores here? Like: 0-40 low, 41-90 average, 91-120 high. And above of all, there is not a legend in the results, to know that. Thank you very much in advance.

language files for questions and choices

It's actually an issue per se but it's a newbie question :)

I cloned the repo but I couldn't find the Arabic language files for questions & choices, I might be wrong but I think they are hosted outside the repo at this url https://github.com/Alheimsins/b5-johnson-120-ipip-neo-pi-r/tree/master/data/ar

my question is how to host them with my own cloned repo and what should I change in code to achieve that ?

maximum result should be 100

... not 120

neutral value should be 50

minimal value should be zero

standard stuff : P

Translate the website to Estonian

• Please know the language your translating to, if we wanted Google Translate we could do it ourselves :-)
• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

Swedish translation contains a lot of Danish/Norwegian

For example

bigfive-web/translations/sv.js

Line 9 in 5951c69

description: 'Ta en gratis, open source Big Five-personlighetstest. Lær å kjenne personlighetstrekkene dine - sammenlign deg med partneren din, kollegene, venner eller familie.'

Translate the website to Russian

• Please know the language your translating to
• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

Save the result ID in localStorage

Save the result ID in localStorage here.

Display a link to the test result in a notification window at /result

Translate the website to Spanish

• Please know the language your translating
• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

Translate the website to French

• Please know the language your translating
• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

Choose preferred language automatically

Choose the preffered language (to take the test in) automatically or prefill the browser detected locale.

See:
https://github.com/nuxt-community/nuxt-i18n
https://github.com/rubynor/bigfive-web/blob/master/components/form/Language.vue

Translate the website to Simplified Chinese

• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

Improve Brazilian Portuguese translation

After the translation was deployed, I noticed some typos.

Translate the website to Croatian

• Please know the language your translating to, if we wanted Google Translate we could do it ourselves :-)
• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

Translate the website to Icelandic

• Please know the language your translating
• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

Translate the website to Finnish

• Please know the language your translating
• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

The language switch menu is getting to long for mobile-view

The language switch menu is getting to long for mobile-view.

Possible solutions on sm-breakpoint:

• Fullscreen menu
• Decrease padding around menu elements
• 3 (4?) cols

The component is located at https://github.com/rubynor/bigfive-web/blob/master/components/LanguageSwitcher.vue

For vuetify-documentation on the menu component:
https://vuetifyjs.com/en/components/menus/#menus
https://vuetifyjs.com/en/api/v-menu/

Translate the website to Urdu

• Please know the language your translating to, if we wanted Google Translate we could do it ourselves :-)
• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

Issue with Bahasa Indonesia translation

In the test, indifferent translated as "acuh".
Acuh, in Bahasa Indonesia meaning heed or care. Indonesian people themselves very often misinterpret acuh as indifferent.
This issue can lead to false internal consistency due to misinterpreting item rather than its true meaning

Network error

After filling out the last question, I am shown the button "See Results". When I press it, a notification pops up saying "Network Error". This repeats even though I can open another tab and go to a website without any problems. Possibly this problem was caused by my wifi being down at some earlier instant - my wifi goes down now and then. Me and a few colleagues all did the bigfive-test at the same time, and one of them had exactly the same problem as I did.
After a while, I tried right clicking and "reload frame", but then I was sent to the very start page and asked to do the entire test all over again (lost my motivation to do that).

show result in the order OCEAN

its a de facto standard that many tests use to format the result

is there a good reason to use the NEOAC order?

When changing language, menu items does not change language

Reproduce:

1. Change language on the flag icon
2. Open right menu
3. See that the language is not changed on items, even though they are translated

See the code

This menu should also be an own compoenent.

On mobile it is possible to skip questions by double clicking answers

The mobile view shows 1 question per page, if you click on one answer and changes to another option within a second, sometimes, you skip a question. Then the user can not finish the test because it's 99% done.

See store/index.js

Translate the website to Hebrew

• Please know the language your translating to, if we wanted Google Translate we could do it ourselves :-)
• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

avoid negations

for example:

• Am not bothered by difficult social situations
  • Can easily manage difficult social situations
  • Prefer easy/small social situations
• Am not interested in theoretical discussions
  • Am interested in theoretical discussions
• Have difficulty starting tasks
  • Prefer to start tasks
  • Prefer to start new things (?)
• Try not to think about the needy
  • Prefer to think about the bright sides of life

the question is: should we use binary or ternary logic?
ternary logic uses negations in questions, and a "negation of negation" can be seen as a neutral response,
but here we explicitly provide a "neutral" answer, so i would prefer questions in binary logic

Clear store after test is taken.

After the test is taken, you need to refresh the page to take the test again.

We need to clear the store after the test is taken and save ID to localStorage.

Here?
https://github.com/rubynor/bigfive-web/blob/master/store/index.js#L171

Can we access the test using an API request?

Translate the website to Polish

• Please know the language your translating to
• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

Translate the website to Ukrainian

• Please know the language your translating to
• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

Nuxt: Add basic unit tests

We need to add some basic unit tests.

See nuxt docs on testing

A simple test POC

Translate the website to Hindi

• Please know the language your translating to
• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

Finish translating the file into Spanish

I saw that a Spanish translation was added in this Pull Request #49 but it still needs to finish translating (section "opennessToExperience").

Another thing I saw is that not all pages or sections are available for translations, for example.

• Openness to experience
• Conscientiousness
• Extraversion
• Agreeableness
• Neuroticism
• Privacy, etc.

Only the "Openness_to_experience.vue" uses a translation file, the others don't, I don't know if there is a plan to change this or a reason for that.

If there is no problem, I can finish to translate the es.js file.

Translate the website to Japanese

• Please know the language your translating to
• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

Trying to deploy dev environment

Hi guys,

Can you please advise I probably missed something as I am new using nuxt but I am not able to deploy the dev environment.
followed the step on the readme and replaced in next.config.js

• Tittle (just to see if my page is modified)
• hostname => http://localhost:3000
• API_URL => http://localhost/api/

The point is

1. It does not seem to chang my title html tag..
2. When I want to save I have a 404 error
3. It does not seems to create my mongodb database (even changing .env)

Any clue of what I am missing ?

Bahasa Indonesia translation Issue

The issue is about the options.
Moderately accurate translated as "sedikit akurat"

"Moderate" word

According to Cambride dictionary, moderate mean "neither small nor large in size, amount, degree, or strength".
In Bahasa Indonesia, moderate translated as "moderat" but the definition is very different.

Moderat in Bahasa Indonesia mean; (1) always avoid extreme behavior or disclosures; (2) inclination toward the dimension or middle ground (according to Government Dictionary

Issue with "moderate" translation to Bahasa Indonesia

"Sedikit" in Bahasa Indonesia mean "a little" or "a few" or "slight".
I worried that people will define moderately accurate as a little accurate.

Suggestion

• "Cukup Akurat" equal to "accurate enough"
• "Lumayan Akurat" equal to "pretty good". But this is rarely used in formal situation

I'm not too expert at translation, but you can use this as reference and hope an expert will come here and help.

Thank you very much.

amount itens

Hello, I would like to have a test with a smaller number of questions, does anyone know how I could get it?

Translate the website to Indonesian

• Please know the language your translating to
• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

There are some issues in the french texts, where can i fix them?

Environment Variable "MONGODB_URI" references Secret "mongodb_uri", which does not exist.

mongodb+srv://user:[email protected]/test

So, I'm new to this, but I keep getting this error on vercel. What should I do?

I've ran it on my computer at localhost:3000 fine, without mongodb, but when I try to use vercel, it seems like mongodb is missing. I keep getting this error: "Environment Variable "MONGODB_URI" references Secret "mongodb_uri", which does not exist."

What should I do?

Translate the website to Portuguese (brazil)

• Please know the language your translating to
• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

List of translators in the about page

We have many wonderful translators who have translated the survey.
We should list them in the about page

List of translators is found here:
https://github.com/alheimsins/b5-johnson-120-ipip-neo-pi-r#supported-languages
https://github.com/Alheimsins/b5-result-text#supported-languages

License

I love your work transitioning the original Alheimsins Big Five project from Next to Nuxt. It would be great to build upon what you have done.

The Alheimsins project was under the MIT License:
https://github.com/Alheimsins/bigfive-web/blob/master/LICENSE

Is this project still under the MIT license? Can you clarify if it is still open source?

Add age, gender, nationality to end of the test

Add optional age, gender, nationality to end of the test. This is very useful for research

See:
https://github.com/rubynor/bigfive-web/tree/master/components/form

Translate the website to Italian

• Please know the language your translating to
• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

Scores

How can I know if the scores are low, average or high? It doesn't appear in the big five. It appears only 90/120 for example.

Save test answers in localStorage

We need to save the users answers in localStorage and restore them if the page is refreshed.

The old version did exactly this see localStorageStore.js

Translate the website to Dutch

• Please know the language your translating to, if we wanted Google Translate we could do it ourselves :-)
• Clone the repo
• Enter the project and run yarn
• Go into the folder translations
• Copy the file of the language you know into a new file
• Use ISO 639-1 language code as file name
• Open the new file and do the translation
• Add the language you translated to nuxt.config.js under modules['nuxt-i18n'].locales
• Run yarn lint (or npm run lint) to see that your changes are consistent with the projects coding style
• Run yarn dev and open the web-browser at http://localhost:3000
• Change to your translated language in the right dropdown menu and see that the translation looks good.
• Submit the pull request
• Happiness :-)

Cannot change the language of result

Hi, I took the test and chose my local language (Norwegian) without thinking, and thus got my results in Norwegian. But I regretted this because other people wouldn't understand my result if I were to show it to them, and also the translated names of the traits etc makes it harder to google them to get more information.

Therefore I wanted to view my results in English instead. But this does not seem to be possible. When changing to English using the sidebar, my results are still in Norwegian. Some of the page changes, such as the text "Important! Save the following ID to see the results later or compare yourself to others", but the names and explanations of the traits stays Norwegian. This is also the case if I clear my browser cache/cookies. It seems to be tied to the result ID I was given.

To reproduce: Go to https://bigfive-test.com/result/5e7924a30c98860008d2a6b8 , and observe that the results are in Norwegian even if the site language is set to English, at least it is for me.