IBM Castle - [24 hours] Translate Messages from the UI

Welcome to the IBM Castle - Translate Messages from the UI contest. As part of this contest, we want you to provide the translation feature for messages in the User interface.

 

Project Overview

This project is the foundation for a complex, enterprise email, calendaring, and messaging system.  We will be building a full fledged email application and an API server to allow multiple clients to interface with it.

 

Contest Overview

We have now reached a stage where we can see the Email application coming to life. Users will be receiving emails and can view the message details.

 

There is a possibility that the user can receive emails from senders that do not speak the same language of the user. In such a case, the user would like to read a translated version of the message.

 

The backend is already configured to translate text. You just need to call the corresponding API and it will translate the text for you. This service makes use of IBM’s Watson.

 

You may have to create an additional endpoint in the backend to detect the language though.

 

1. When loading the messages (only for the inbox folder), use a nodejs module such a franc to detect the language of the message using the subject

2. If the language used in the subject is not the same as the user’s browser language, proceed to call Watson and get the subject converted into the user’s browser language.

3. When the user views the message’s details by clicking on the message, in the details screen, translate the Subject and the Body of the message.

4. Provide a configuration that allows us to disable this feature.

 

We will share a design that we have in mind that you can follow in your submission.

 

Angularjs Guidelines

We are listing some points here related to the front end that you need to strictly follow. Reviewers will be asked to evaluate strictly using these guidelines

1. Make only those changes that are needed for this contest. Additional changes such as changing the indentation, spaces, additional features are not needed.

2. You will have to use the Loopback AngularJS SDK when making requests to the backend.

3. The Angularjs code is currently broken down into logical components. Make sure that you continue to follow this style.

4. Your code should work across Desktops, Tablets and Mobile devices. As such, you need to make use of CSS and ensure that the display is responsive. Using Javascript for such functions is strictly prohibited.

5. Run the front end linter on your submission before you submit. You can run it using the command $ npm run lintFE. Do not add any exceptions to your code. Adhere to the linter rules.

6. Use appropriate naming conventions in your code.

7. Don’t expose everything to the scope. Only if the view needs it, then attach it to the scope. Else keep it private.

 

For the backend, you need to note the following:

1. You need to use AirBnb’s ESLinter for both javascript code style and checks. This already exists in the existing code base. Make sure that you verify that your submission is free from any warnings and errors. This is only for the javascript aspects of the code. DO NOT add any exceptions to the linter. You can run the linter for the backend using $ npm run lint

2. You can add custom routes to the backend. Follow this guide.

3. Overall, make sure that you follow the guidelines specified in the Loopback documentation

Final Submission Guidelines

Kindly make sure that before uploading your submission, it:

1. Meets the requirements mentioned above.

2. Passes all the lint checks using the ESLint rules that we mentioned

3. Implements all the endpoints requested

 

Once you are ready, create a .zip file of the submission and upload this through the Submit and Review tool for this contest.