Server Side Events Extension

The SSE (Server Side Events) module integrates with the Wicket Viewer, and provides the ability to dynamically update properties of type Markdown and AsciiDoc. One use case could be to render a progress bar for a long-running action.

Setup

Dependency Management

In your application’s top level pom.xml, add a dependency for this module’s own bill of materials (BOM):

pom.xml
<dependencyManagement>
    <dependencies>
        <dependency>
            <groupId>org.apache.causeway.extensions</groupId>
            <artifactId>causeway-extensions-sse</artifactId>
            <scope>import</scope>
            <type>pom</type>
            <version>3.1.0</version>
        </dependency>
    </dependencies>
</dependencyManagement>

Dependencies / Imports

In those modules where there are domain objects to be dynamically updated using SSE, add a dependency/import to the applib module:

  • add this dependency:

    pom.xml
    <dependencies>
        <dependency>
            <groupId>org.apache.causeway.extensions</groupId>
            <artifactId>causeway-extensions-sse-applib</artifactId>
        </dependency>
    </dependencies>
  • and @Import this module:

    MyModule.java
    @Configuration
    @Import({
        CausewayModuleExtSseApplib.class,
        // ...
    })
    public class MyModule { ... }

In addition, in the webapp module of your application, add the following dependency:

pom.xml
<dependency>
    <groupId>org.apache.causeway.extensions</groupId>
    <artifactId>causeway-extensions-sse-wicket</artifactId>
</dependency>

And in your application’s App Manifest, import the extension’s implementation module:

AppManifest.java
@Configuration
@Import({
        CausewayModuleExtSseWicket.class,
        ...
})
public class AppManifest {
}

Usage

By way of example, let’s see how to render a progress bar. We’ll start with a background task which for demo purposes wil just count slowly up to some figure. This acts as a source of SSE events:

DemoTask.java
@Named("demo.DemoTask")
@DomainObject(nature=Nature.VIEW_MODEL, editing=Editing.DISABLED)
@RequiredArgsConstructor(staticName="of")
public class DemoTask implements SseSource {                (1)

    @ObjectSupport public String title() {
        return String.format("DemoTask '%s'", Integer.toHexString(hashCode()));
    }

    private final int totalSteps;
    private TaskProgress taskProgress;

    @Override
    public void run(final SseChannel eventStream) {
        taskProgress = TaskProgress.of(new LongAdder(), totalSteps);
        for(int i=0; i<totalSteps; ++i) {
            _ThreadSleep.millis(1000);
            taskProgress.getStepsProgressed().increment();
            eventStream.fire(this);                     (2)
        }
    }

    @Override
    public String getPayload() {                        (3)
        return taskProgress.toHtmlProgressBar();
    }
}
1 Implements SseSource, meaning that it must implement run(SseChannel).
2 Periodically emits events using the provided SseChannel.
3 Also provides a payload, being a string representation of progress to date.

It’s idiomatic to use HTML as the payload, so that it can be rendered in a Markup property (see later). This HTML payload is built using a helper class TaskProgress:

TaskProgress.java
@Data(staticConstructor="of")
public class TaskProgress {

    private final LongAdder stepsProgressed;
    private final long totalSteps;

    public double progressedRelative() {
        final double totalReciprocal = 1. / totalSteps;
        return stepsProgressed.doubleValue() * totalReciprocal;
    }
    public double progressedPercent() {
        return Math.min(progressedRelative()*100., 100.);
    }
    public int progressedPercentAsInt() {
        return (int) Math.round(progressedPercent());
    }

    public String toHtmlProgressBar() {
        final int percent = progressedPercentAsInt();
        return stepsProgressed + "/" + totalSteps +
                "<br/>" +
                "<br/>" +
                "<div class=\"progress\">" +
                "    <div class=\"progress-bar\" " +
                         "role=\"progressbar\" " +
                         "style=\"width: " + percent + "%\" " +
                         "aria-valuenow=\""+percent+"\" " +
                         "aria-valuemin=\"0\" " +
                         "aria-valuemax=\"100\">" +
                    "</div>" +
                "</div>";
    }
}

As mentioned above, we will use a Markup property to display the render the progress:

@XmlElement @XmlJavaTypeAdapter(Markup.JaxbToStringAdapter.class)
@Property
@ServerSentEvents(observe=DemoTask.class)           (1)
@Getter @Setter Markup progressView;
1 observes the state of this background task.
If more than one instance of a task (of this class) runs at the same time, there is (currently) no way to distinguish their events.

Finally, the task is kicked off using the SseService. This runs in the background using a separate thread:

@Action
public SseDemoPage startSimpleTask() {
    final DemoTask demoTask = DemoTask.of(100);
    sseService.submit(demoTask, ExecutionBehavior.REQUIRES_NEW_SESSION);  (1)
    return this;
}

@Inject SseService sseService;
1 The ExecutionBehaviour determines whether the background thread should run in the context of a full-blown Interaction.

Most of the time this will be what you want, but if the background thread runs outside of the framework (eg perhaps just calls out to a web service), then instead Execution.SIMPLE can be used.