JavaScript API

Install

  yarn add @resys/dialob-fill-api

Create session

The default export exposes a single newSession() method:

  import DialobFill from '@resys/dialob-fill-api';
  const session = DialobFill.newSession(sessionId, config);

For example, to open a session to demo.dialob.io over REST:

  DialobFill.newSession('e9fe4cdad3119b02aaac0f2ef431a2dc', {
    endpoint: 'https://demo.dialob.io/session/dialob',
    transport: {
      mode: 'rest'
    }
  });

Use the session

  session.pull();

You should set up a listener, which will trigger every time the state updates:

  session.on('update', () => {
    const questionnaire = session.getItem('questionnaire');
    questionnaire.items.forEach(itemId => {
      const item = session.getItem(itemId);
      console.log(item);
    });
  });

The above code will get the questionnaire in the state and log all its items’ data.

Live example

TODO: display some session with a basic vanilla JS impl.

Syncing

Syncing of the session state can happen intermittently. Session always updates the local state immediately, but updates to the back-end might not be sent right away and could be batched together in certain situations - this is why Session is mostly event-based. It also tries to automatically handle network errors and has a progressive back-off functionality, however if no updates can be reliably synced, a sync error will be emitted.

API reference

• newSession()

newSession(sessionId, SessionConfig)

Takes in a string sessionId and SessionConfig and returns a Session.

SessionConfig

TransportConfig

Session

• pull()
• getItem()
• getItemErrors()
• getValueSet()
• getLocale()
• isComplete()
• setAnswer()
• addRowToGroup()
• deleteRow()
• complete()
• next()
• previous()
• on()
• removeListener()

pull()

Pulls the session state from the back-end. This can be used to initiate or reset the local state.

getItem(id)

Returns the SessionItem with the given id from the state or undefined if no item with such id exists.

getItemErrors(id)

Returns a SessionError array of the item with the given id or undefined if no item with such id exists. If the item has no errors, an empty list is returned.

getValueSet(id)

Returns the SessionValueSet with the given id or undefined if no value set with such id exists.

getLocale()

Returns the locale of the session.

isComplete()

Returns true if session is marked as completed, otherwise returns false.

setAnswer(id, answer)

Updates the answer of the item with the given id. answer should have a type that is acceptable to the back-end, see SessionItem.type.

addRowToGroup(rowGroupId)

Adds a row to a row group with the given rowGroupId. This action depends on the back-end and undefined is always returned from this method - if you need to get the row that was added, use the on('update') event listener.

deleteRow(rowId)

Deletes the row with the given rowId.

complete()

Marks the session as completed.

next()

Updates the session to the next page.

previous()

Updates the session to the previous page.

on(eventType, handler)

handler will be called whenever an event with the given eventType is emitted.

Event types:

• on('update', () => void) will be triggered whenever session state is updated (this can be local state update as well as an update after a sync)
• on('sync', (status) => void) will trigger the handler during a sync. status will be either INPROGRESS or DONE.
• on('error', (type, error) => void) will trigger the handler whenever an error happens. type is either CLIENT or SYNC

removeListener(eventType, handler)

Removes the handler from eventType listeners.

SessionItem

SessionError

SessionValueSet