JavaScript in Coast

The Coast builder attempts to interpret anything written within {{ }} as a path in the Local Database. If it can't find a path, the builder will then attempt to evaluate the contents as JavaScript. The Coast Builder executes all JavaScript in a scoped eval, for security purposes, where the environment is referred to as this.

As a result, you can write custom JavaScript anywhere in the builder with {{ }} notation. For example, {{ 1 + 1 }} will be evaluated as 2. Or, {{ 1 + 1 > 0 ? "Cool" : "Demo" }} will evaluate to Cool.

The this enviornment has access to the local database, via this.db. It is for this reason that you will need to provide this.db as a prefix to your Local Database path when you are trying to access a Local Database value and apply a custom script, like so: {{ this.db.myLocalDatabasePath + 1 }}.

Your environment also has access to the moment.js package, which enables you to do things like {{ this.moment().format("YYYY-MM-DD") }} to get the current date.

There are areas in Coast where you can write JavaScript, as well as access the Local Database without the {{ }} notation.

Wherever there is a code editor in Coast (identified by blue text, and an Eval value at the bottom), you can write JavaScript. For example, in the Dynamic Default Value code editor area, you can write JavaScript without the {{ }} notation. You can also access the Local Database without the {{ }} notation. For example, this.db.myLocalDatabasePath will return the value at myLocalDatabasePath.

Check out the Eval: value at the bottom of these code editors as a means of debugging your JavaScript. Don't see the value you expect? Try looking at your syntax or checking the values in your Local Database.

Window Functions in Coast

Access the following window functions inside of the iFrame Editor or a Custom Code block. Use these functions to write to the Local Database, dynamically navigate the user through the demo or display a toast message.

window.parent?.modDb("PATH", value) // writes value at PATH in the Local Database

window.parent?.setNavForward()
// advances the demo

window.parent?.navigateToDbKey("dbKey") // navigates the demo to a specific tab's database key

window.parent?.successToast("msg")
// shows a success toast with msg

window.parent?.errorToast("msg")
// shows an error toast with msg

window.parent?.toast("msg")
// shows a toast with msg

Accessing Local DB in Custom Code Block

There are 2 methods of accessing data values stored in the local database while writing JavaScript in a Custom Code Block,

If your custom code block is wrapped in <html>...</html> , you can use the {{ }} notation to access DB values. Make sure to wrap the reference in " ", if need be.

Plaid Connection

iFrame Example

<html>
  <script>
    const dbValue = '{{ this.db.path_to_value }}'
  </script>
</html>

You can also reference the local DB with the $DB('path_to_value') function. Simply provide the direct path to a DB value into this function to access its value from within a Custom Code Block.

Plaid Connection

iFrame Example

<View>
  <Text>
    Welcome to {$DB('instance.prospectDetails.company')}
  </Text>
</View>