2013 © Trivadis

10.04.2023

1

BASEL BERN LAUSANNE ZÜRICH DÜSSELDORF FRANKFURT A.M. FREIBURG I.BR. HAMBURG MÜNCHEN STUTTGART WIEN

JavaOne 2013 JavaFX / JacpFX interaction with JSR356 WebSockets Andy Moncsek

27. Sept. 2013

JavaFX / JacpFX interaction with JSR356 WebSockets

2013 © Trivadis

BASEL BERN LAUSANNE ZÜRICH DÜSSELDORF FRANKFURT A.M. FREIBURG I.BR. HAMBURG MÜNCHEN STUTTGART WIEN

Andy Moncsek

Consultant for Application Devlopment (Zürich - Switzerland)Trainer for JavaEE Assembly & DeploymentContacts: Andy.Moncsek@Trivadis.comTwitter: @AndyAHCP

2013 © Trivadis

10.04.2023

3

AGENDA

1. Introduction

2. WebSocket (JSR-356) Create a simple maven WebApp Create a ServerEndpoint Create Encoder/Decoder

3. JavaFX Create a maven JavaFX application Create a JavaFX - (WebSocket) ClientEndpoint

4. JacpFX Create a maven JacpFX application Create a JacpFX - (WebSocket) ClientEndpoint

5. Conclusion

JEE to the Max

2013 © Trivadis

10.04.2023

4

Introduction

JavaFX / JacpFX interaction with JSR356 WebSockets

ThreeKey technologies

andonly

50 min

2013 © Trivadis

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

5

Introduction - JavaFX

JavaFX is Swing in cool ![1]

since JDK1.7_u6 included in JDK

JavaFX8 in JDK8

2013 © Trivadis

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

6

Introduction - JavaFX - key features

• SceneGraph

• Contains all nodes (e.g. UI components, shapes, images,

containers)

• Rendered on GPU (Prism)

• Skinnable with CSS

• Declarative UI with FXML

[2]

2013 © Trivadis

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

7

Introduction - JacpFX

JacpFX is a RCP framework on top of JavaFX

Developed since 2009 (on Swing), since 2011 on JavaFX

Currently migrated to Java8 / JavaFX8

2013 © Trivadis

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

8

Introduction - JacpFX - key features

• Simple API to create Rich Clients in MVC style with JavaFX,

Spring

• Actor like component approach with component messaging

• Structure your FX application

• Less effort on threading topics

• No locking or unresponsive UI

2013 © Trivadis

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

9

Introduction - WebSocket (JSR 356)

Full duplex communication in either direction

Part of JEE7, included in GlassFish 4

Tyrus project: reference implementation

2013 © Trivadis

10.04.2023

10

Introduction - WebSocket (JSR 356) - key features

• Java API for Server- and Client-Side (JEE7)

• Programmatic and annotation-based endpoints

• Support for Encoder/Decoder to map message to Java objects

• Support for @PathParam

JavaFX / JacpFX interaction with JSR356 WebSockets

2013 © Trivadis

10.04.2023

11

WebSocket (JSR-356)

JavaFX / JacpFX interaction with JSR356 WebSockets

2013 © Trivadis

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

12

WebSocket (JSR-356) - maven

•Create a simple webapp with maven

mvn archetype:generate -DarchetypeArtifactId=maven-archetype-webapp

•Add JEE coordinates: <dependency> <groupId>javax</groupId> <artifactId>javaee-api</artifactId> <version>7.0</version> <scope>provided</scope> </dependency>

That’s it!

2013 © Trivadis

10.04.2023JEE to the Max

13

WebSocket (JSR-356) - ServerEndpoint (by annotation)

@ServerEndpoint("/chat")public class ChatServerEndpoint {

@OnOpen public void init(Session session) {…}

@OnMessage public void handleMessage(Message message, Session session) {

session.getBasicRemote().sendObject(message); }

@OnClose …

@OnError …}

2013 © Trivadis

10.04.2023

14

WebSocket - Encoder/Decoder

• Encoders: Java Object Binary / Textpublic class MEnc implements Encoder.Binary<Message>{

public ByteBuffer encode(Message message) {...}}

• register: @ServerEndpoint(encoders = {MEnc.class})

• Decoders: Binary / Text Java Objectpublic class MessageDecoder implements Decoder.Binary<Message>{

public Message decode(ByteBuffer b) {...}public boolean willDecode(ByteBuffer b) {...}

}

• register: @ServerEndpoint(decoders = {MessageDecoder.class})

JavaFX / JacpFX interaction with JSR356 WebSockets

2013 © Trivadis

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

15

JavaFX - ClientEndpoint

2013 © Trivadis16

JavaFX - maven

• Maven plugin and archetype provided by community [3]

• Create a simple JavaFX app with maven:mvn archetype:generate -DarchetypeGroupId=com.zenjava -DarchetypeArtifactId=javafx-basic-archetype -DarchetypeVersion=2.0.1

• Add the Tyrus (WebSocket client API) dependencies (tyrus-client & tyrus-container-grizzly):

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

<dependency> <groupId>org.glassfish.tyrus</groupId> <artifactId>tyrus-client</artifactId> <version>1.0</version></dependency>

2013 © Trivadis

10.04.2023

17

JavaFX - ClientEndpoint

JavaFX / JacpFX interaction with JSR356 WebSockets

• Annotation is the easiest way for JavaFX / ClientEndpoints

• Annotate Controls, Containers or FXML Controller

@ClientEndpoint

public class ChatView extends VBox{

@OnOpen

…

@OnClose

…

@OnError

…

@OnMessage

…

}

2013 © Trivadis

10.04.2023

18

JavaFX - ClientEndpoint

JavaFX / JacpFX interaction with JSR356 WebSockets

• Configure a ClientEndpoint

@ClientEndpointpublic class ChatView extends VBox{

public void init() { ClientManager client = ClientManager.createClient();

client.connectToServer(this, ClientEndpointConfig.Builder.create(), URI.create(“ws://host/chat“));

}

@OnOpen, @OnMessage, …

}

2013 © Trivadis

10.04.2023

19

JavaFX - ClientEndpoint

DEMO

JavaFX / JacpFX interaction with JSR356 WebSockets

2013 © Trivadis

10.04.2023

20

JavaFX - ClientEndpoint

What went wrong?

We forgot the FX application thread !!!

1. Don´t create connections on FX application thread

2. @OnOpen, @OnMessage… are NOT on FX application thread

JavaFX / JacpFX interaction with JSR356 WebSockets

2013 © Trivadis

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

21

JavaFX - ClientEndpoint

Use a service to create connections

private static class ConnectionService extends Service<Void>{

protected Task<Void> createTask() {

return new Task<Void>(){

ClientManager client = ClientManager.createClient();

// connect to Server

return null;

}

};

}

2013 © Trivadis

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

22

JavaFX - ClientEndpoint

Do not modify Nodes outside FX Thread!Do this instead:

@OnMessagepublic void handleChatMessage(Message message) {

Platform.runLater(()-> {

node.getChilderen().add(new Label(message.getText())); }

);}

2013 © Trivadis

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

23

JacpFX - ClientEndpoint

2013 © Trivadis24

JacpFX - maven

• Create a sample JacpFX app with maven:

mvn archetype:generate -DarchetypeGroupId=org.jacp -DarchetypeArtifactId=JacpFX-quickstart-archetype -DarchetypeVersion=1.4 -DarchetypeRepository=http://developer.ahcp.de/nexus/content/repositories/jacp

• Add the Tyrus (WebSocket client API) dependencies

• Detailed documentation:

• https://code.google.com/p/jacp/wiki/Documentation

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

2013 © Trivadis

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

25

JacpFX - maven

• JacpFX application / messaging structure:

2013 © Trivadis

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

26

JacpFX - Endpoint

@Component(id = "id3”)

@ClientEndpoint

public class WebSocketEndpoint implements CallbackComponent {

@Resource private JACPContext context;

@PostConstruct

public void init() {

// connect to Server Endpoint

}

public Object handle(final IAction<Event, Object> arg0) {…}

@OnMessage

public void onChatMessage(Message m) {

context.getActionListener("id2”,m).performAction(null);

}

}

2013 © Trivadis

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

27

JacpFX - UI

@Component(id = "id2")

@DeclarativeView(viewLocation = "chat.fxml", executionTarget = "main")

public class ChatView implements FXComponent {

public Node handle(final IAction<Event, Object> action) {…}

public Node postHandle(Node n, IAction<Event, Object> action) {

// runs in FX application thread

if (action.isMessageType(ChatMessage.class)) {

chat.getChildren().add(arg0);

}

return null;

}

@FXML

private void handleSend(ActionEvent event) {

context.getActionListener("id3", …)

.performAction(null);

}

}

2013 © Trivadis

10.04.2023

28

JacpFX - ClientEndpoint

DEMO

JavaFX / JacpFX interaction with JSR356 WebSockets

2013 © Trivadis

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

29

Conclusion

• JavaFX is cool… BUT

• Take care of your application structure (same as plain Swing)

• Take care of the application thread (same as every UI toolkit)

• JacpFX

• Helps to structure your application

• Avoid threading issues

• BUT… still ongoing development (target Java8 release)

2013 © Trivadis

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

30

Conclusion

• WebSockets (JSR 356)

• WebSockets will change the internet

• Great JEE7 feature

• Easy to use

• Still some tasks to do (e.g. clustering, authentication)

2013 © Trivadis

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

31

Any Questions ?

2013 © Trivadis

10.04.2023JEE to the Max

32

BASEL BERN LAUSANNE ZÜRICH DÜSSELDORF FRANKFURT A.M. FREIBURG I.BR. HAMBURG MÜNCHEN STUTTGART WIEN

Thank you.Andy Moncsek

Mail: Andy.Moncsek@Trivadis.com

Twitter: @AndyAHCP

www.trivadis.com

2013 © Trivadis

10.04.2023JavaFX / JacpFX interaction with JSR356 WebSockets

33

appendix

• [1] Slides from Michal Heinrich (http://de.slideshare.net/michael_heinrichs/javafx-11583106?from_search=1)

• http://jfxtras.org/

• http://fxexperience.com/controlsfx/

• [2] http://docs.oracle.com/javafx/2/architecture/jfxpub-architecture.html

• [3] http://zenjava.com/javafx/maven/

• Tyrus Project: http://java.net/projects/tyrus

• JacpFX: https://code.google.com/p/jacp/

• GlassFish 4 downloads: http://glassfish.java.net/public/downloadsindex.html