Reacting to live updates

How to detect and react to real-time updates

The platform is real-time by nature with all client apps connected via a socket at all time. Data changes are broadcast to connected users as soon as you publish content, or as values change.

To ensure your app displays constantly relevant data, we offer the possibility to register listeners that are notified when those changes occur.

Responding to updates is commonly needed on several levels:

Project updates: for example Project Settings
Event updates: Elements being added, removed or other metadata changes
Element updates: for example content being changed

Reacting to Project updates

The following snippet demonstrates how you can react to changes in the Project. For example a change in its configuration fields or if a new Event is created.

class MyProjectUpdateDelegate: ProjectUpdateDelegate {
    func didPublishEvent(project: Project, event: Event) {
        // Code when an event is published
    }

    func didRemoveEvent(project: Project, event: Event) {
        // Called when an event is removed
    }

    func didUpdateProjectFields(project: Project) {
        // Called when the project fields change
    }
}

let myDelegate = MyProjectUpdateDelegate()
project.add(listener: myDelegate)

// When we no longer need to be notified about project changes.
project.remove(listener: myDelegate)

class MyProjectUpdateListener : ProjectUpdateListener {
    override fun onEventPublished(project: Project, event: Event) {
        // Code when an event is published
    }

    override fun onEventRemoved(project: Project, event: Event) {
        // Called when an event is removed
    }

    override fun onProjectFieldsUpdated(project: Project) {
        // Called when the project fields change
    }
}

val myListener = MyProjectUpdateListener()
project.add(myListener)

// When we no longer need to be notified about project changes.
project.remove(myListener)

import {
  onProjectFieldsUpdated,
  onProjectListingsUpdated,
  onEventPublished,
} from '@monterosa/sdk-interact-kit';

// Called whe the project fields are updated
const unsubscribeOnProjectFieldsUpdated = onProjectFieldsUpdated(
    project, 
    () => { console.log(project) }
);

// Called when the project listings are updated
const unsubscribeOnProjectListingsUpdated = onProjectListingsUpdated(
    project, 
    () => { console.log(project) }
);

// Called when an event is published
const unsubscribeOnEventPublished = onEventPublished(
    project, 
    (event) => { console.log(event) }
);

import {
  onProjectFieldsUpdated,
  onProjectListingsUpdated,
  onEventPublished,
} from '@monterosa-sdk/interact-kit';

// Called whe the project fields are updated
const unsubscribeOnProjectFieldsUpdated = onProjectFieldsUpdated(
    project, 
    () => { console.log(project) }
);

// Called when the project listings are updated
const unsubscribeOnProjectListingsUpdated = onProjectListingsUpdated(
    project, 
    () => { console.log(project) }
);

// Called when an event is published
const unsubscribeOnEventPublished = onEventPublished(
    project, 
    (event) => { console.log(event) }
);

Reacting to Event updates

The following snippet demonstrates how you can react to changes in the Event, be it a change in their fields, state, or Elements being added or removed. For example, a new Poll being published during a live Event.

class MyEventUpdateDelegate: EventUpdateDelegate {
    func didReceiveUpdate(event: Event) {
        // Called when the data in the event changes
    }
    
    func didChangeState(event: Event) {
        // Called when the state of the event changes
    }
    
    func didPublishElement(event: Event, element: Element) {
        // Called when an element is published
    }
    
    func didRevokeElement(event: Event, element: Element) {
        // Called when an element is revoked
    }
}

let myDelegate = MyEventUpdateDelegate()
event.add(listener: myDelegate)

// When we no longer need to be notified about event changes.
event.remove(listener: myDelegate)

class MyEventUpdateListener : EventUpdateListener {
    override fun onEventUpdated(event: Event) {
        // Called when the data in the event changes
    }

    override fun onEventStateChanged(event: Event) {
        // Called when the state of the event changes
    }

    override fun onElementPublished(event: Event, element: Element) {
        // Called when an element is published
    }

    override fun onElementRevoked(event: Event, element: Element) {
        // Called when an element is revoked
    }
}

val myListener = MyEventUpdateListener()
event.add(myListener)

// When we no longer need to be notified about event changes.
event.remove(myListener)

import {
  onElementPublished,
  onElementRevoked,
  onEventUpdated,
  onEventState,
} from '@monterosa/sdk-interact-kit';

// Called when an element is published to an event
const unsubscribeOnElementPublished = onElementPublished(event, 
    (element) => { console.log(element) }
);

// Called when an element is revoked from the event
const unsubscribeOnElementRevoked = onElementRevoked(
    event, 
    element => { console.log(element) }
);

// Called when the event is updated
const unsubscribeOnEventUpdated = onEventUpdated(
    event, 
    () => { console.log(event) }
);

// Called when the event state changes
const unsubscribeOnEventState = onEventState(
    event, 
    (state) => { console.log(state) }
);

import {
  onElementPublished,
  onElementRevoked,
  onEventUpdated,
  onEventState,
} from '@monterosa-sdk/interact-kit';

// Called when an element is published to an event
const unsubscribeOnElementPublished = onElementPublished(event, 
    (element) => { console.log(element) }
);

// Called when an element is revoked from the event
const unsubscribeOnElementRevoked = onElementRevoked(
    event, 
    element => { console.log(element) }
);

// Called when the event is updated
const unsubscribeOnEventUpdated = onEventUpdated(
    event, 
    () => { console.log(event) }
);

// Called when the event state changes
const unsubscribeOnEventState = onEventState(
    event, 
    (state) => { console.log(state) }
);

React to Element updates

The following snippet demonstrates how you can be notified about changes in an Element. For example if the content creator changes a field after making a mistake.

import {
  onElementResults,
  onElementUpdated,
  onElementStateChanged,
} from '@monterosa/sdk-interact-kit'

// Called when the results of an interactive element change
const unsubscribeOnElementResults = onElementResults(
    element, 
    (results) => { console.log(results) }
);

// Called when the element is updated
const unsubscribeOnElementUpdated = onElementUpdated(
    element, 
    () => { console.log(element) }
);

// Called when the state of the element is updated
const unsubscribeOnElementStateChanged = onElementStateChanged(
    element, 
    () => { console.log(element) }
);

import {
  onElementResults,
  onElementUpdated,
  onElementStateChanged,
} from '@monterosa-sdk/interact-kit'

// Called when the results of an interactive element change
const unsubscribeOnElementResults = onElementResults(
    element, 
    (results) => { console.log(results) }
);

// Called when the element is updated
const unsubscribeOnElementUpdated = onElementUpdated(
    element, 
    () => { console.log(element) }
);

// Called when the state of the element is updated
const unsubscribeOnElementStateChanged = onElementStateChanged(
    element, 
    () => { console.log(element) }
);

Last updated 1 day ago