Set up autocomplete of Caplin JS Libraries in IntelliJ IDEA

If you like coding and can’t live without that autocomplete feature, you might be interested in setting up IntelliJ for developing with Caplin JS libraries.

This brief tutorial will show how to do just that. Using IntelliJ IDEA’s autocomplete feature, you will be able to carry out code completion on all Caplin Trader and BladeRunner JavaScript library files.

Autocompletion example

IntelliJ will typically carry out the autocomplete on the library files itself, like so:

intellij 1

Note that if you already have JavaScript files within your project and you keep your current settings, code completion should work as before.

What you will need

Essentially, an instance of IntelliJ IDEA up and running with an open or empty project. And of course, access to Caplin JS Libraries!

Getting started

The aim is to create a new JavaScript Library and tell IntelliJ IDEA what .js files to include.

In the following example, we’ll start by creating an empty project in IntelliJ. We’ll then add the external Caplin JS libraries that you have stored outside of your project root directory.

  1. Create an empty project within IntelliJ. If you’ve already got an existing JavaScript based project open, you might want to skip ahead to step 2.

    intellij 2

    If you look at the panel of options on the left side of the pop up box, you’ll find Static Web. Select Web Module underneath, give the project a name and click Finish to continue.

    intellij 3

  2. Go to File, and open up Settings.

  3. Select JavaScript >_Libraries_ on the left. Then click on Configure on the far right.

    intellij 4

  4. From here you can import the .js libraries from an external location. Click the Libraries option on the left to add project-visible Libraries. You can also click the Global Libraries option underneath if you wish to add cross-project visible libraries. When you’re ready, click the green add (+) button at the top and choose the JavaScript option.

    intellij 5

  5. Now navigate to wherever you have stored the Caplin JS libraries directory on your local machine. Select the sdk/libs/javascript/caplin/src/caplin folder of the CT or BR install from the popup. Click OK to import them.

    intellij 6

  6. A dialog box will pop up showing you all the files and roots detected by IntelliJ following a scan. They may contain any debug or release versions of the JS files from the Library that you can choose to attach via the green add (+) button. From this box, you can select and deselect any library files to be included in the import. Click OK when you’re done.

    intellij 7

  7. Choose, and then highlight the project module(s) you wish to include the libraries in. Then click OK to confirm the addition of the libraries.

    intellij 8

  8. You should now see the library files that have been added, as shown in the screenshot. At the top, you can give the library a name of your choice. Hit Apply, then click OK to close the dialog box.

    intellij 9

  9. Now you’ll need to select check box under Enabled next to the library you’ve just added, as shown below. When you’re done, click Apply and then OK and your JavaScript project setting will look like this:

    intellij 10

You’ve just added the libraries. You can now begin testing the code completion feature on the newly added Caplin JS library files and objects. Recognising method, property, and other names.

The example below shows the PresentationModel method being implemented with the code completion feature:

intellij 11

Code completion and navigation will automatically start working for the newly added Caplin libraries, for any file containing JavaScript code.

Here’s a useful PDF showing you the IntelliJ Keymap (Keyboard Shortcuts): IntelliJ IDEA Default Keymap

Happy coding!