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
JavaOne 2013 JavaFX / JacpFX
interaction with JSR356
WebSockets
Andy Moncsek
27. Sept. 2013
30.09.2013
JavaFX / JacpFX interaction with JSR356 WebSockets
1

2013 © Trivadis
Andy Moncsek
Consultant for Application Devlopment (Zürich - Switzerland)
Trainer for JavaEE Assembly & Deployment
Contacts: Andy.Moncsek@Trivadis.com
Twitter: @AndyAHCP

2013 © Trivadis
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
30.09.2013
JEE to the Max
3

2013 © Trivadis
Introduction
30.09.2013
4
Three
Key technologies
and
only
50 min

2013 © Trivadis
Introduction - JavaFX
JavaFX is Swing in cool ![1]
since JDK1.7_u6 included in JDK
JavaFX8 in JDK8
30.09.2013
5

2013 © Trivadis
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
30.09.2013
6
[2]

2013 © Trivadis
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
30.09.2013
7

2013 © Trivadis
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
30.09.2013
8

2013 © Trivadis
Introduction - WebSocket (JSR 356)
Full duplex communication in either direction
Part of JEE7, included in GlassFish 4
Tyrus project: reference implementation
30.09.2013
9

2013 © Trivadis
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
30.09.2013
10

2013 © Trivadis
WebSocket (JSR-356)
30.09.2013
11

2013 © Trivadis
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!
30.09.2013
12

2013 © Trivadis
WebSocket (JSR-356) - ServerEndpoint (by annotation)
30.09.2013
JEE to the Max
13
@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
WebSocket - Encoder/Decoder
• Encoders: Java Object  Binary / Text
public class MEnc implements Encoder.Binary<Message>{
public ByteBuffer encode(Message message) {...}
}
• register: @ServerEndpoint(encoders = {MEnc.class})
• Decoders: Binary / Text Java Object
public class MessageDecoder implements Decoder.Binary<Message>{
public Message decode(ByteBuffer b) {...}
public boolean willDecode(ByteBuffer b) {...}
}
• register: @ServerEndpoint(decoders = {MessageDecoder.class})
30.09.2013
14

2013 © Trivadis
JavaFX - ClientEndpoint
30.09.2013
15

2013 © Trivadis
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):
30.09.2013
16
<dependency>
<groupId>org.glassfish.tyrus</groupId>
<artifactId>tyrus-client</artifactId>
<version>1.0</version>
</dependency>

2013 © Trivadis
30.09.2013
17
• 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
30.09.2013
18
• Configure a ClientEndpoint
@ClientEndpoint
public 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
DEMO
30.09.2013
19

2013 © Trivadis
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
30.09.2013
20

2013 © Trivadis
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;
}
};
}
30.09.2013
21

2013 © Trivadis
Do not modify Nodes outside FX Thread!
Do this instead:
@OnMessage
public void handleChatMessage(Message message) {
Platform.runLater(()-> {
node.getChilderen().add(new Label(message.getText()));
}
);
}
30.09.2013
22

2013 © Trivadis
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/reposi
tories/jacp
• Add the Tyrus (WebSocket client API) dependencies
• Detailed documentation:
• https://code.google.com/p/jacp/wiki/Documentation
30.09.2013
24

2013 © Trivadis
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);
}
}
30.09.2013
26

2013 © Trivadis
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);
}
}
30.09.2013
27

2013 © Trivadis
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)
30.09.2013
29

2013 © Trivadis
Conclusion
• WebSockets (JSR 356)
• WebSockets will change the internet
• Great JEE7 feature
• Easy to use
• Still some tasks to do (e.g. clustering, authentication)
30.09.2013
30

2013 © Trivadis
Thank you.
Andy Moncsek
Mail: Andy.Moncsek@Trivadis.com
Twitter: @AndyAHCP
www.trivadis.com
30.09.2013
JEE to the Max
32

2013 © Trivadis
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
30.09.2013
33

JavaFX / JacpFX interaction with JSR356 WebSockets

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Similar to JavaFX / JacpFX interaction with JSR356 WebSockets

Similar to JavaFX / JacpFX interaction with JSR356 WebSockets (20)

More from Andy Moncsek

More from Andy Moncsek (7)

Recently uploaded

Recently uploaded (20)

JavaFX / JacpFX interaction with JSR356 WebSockets

Editor's Notes