OpenCms Days 2015 Creating Apps for the OpenCms 10 workplace

Georg Westenberger, Alkacon Software GmbH
Creating Apps for the
OpenCms 10 workplace
28.09.2015

●Vaadin Basics
●Writing and configuring apps
●Adding Explorer context menu items
2
Overview

● Widget-based web GUI framework
● Only requires writing server-side Java code to
add new functionality
● UI actions trigger AJAX requests to the server
● UI is updated when response received
3
OpenCms Workplace with Vaadin

● Why not GWT?
● No dynamic loading of new code
● Need to recompile everything for any change
● Slow compilation
● Vaadin is based on GWT, but
● Only need to recompile client code if you want to
add new widgets which aren‘t composed of
existing widgets
4
OpenCms Workplace with Vaadin

VerticalLayout layout = new VerticalLayout();
layout.addComponent(new Label("Foo"));
Button ok = new Button("OK");
layout.addComponent(ok);
ok.addClickListener(new ClickListener() {
public void buttonClick(ClickEvent event) {
// do stuff
}
});
5
Vaadin – GUI in Java code

<html>
<body>
<v-vertical-layout>
<v-label>Hello world</v-label>
<v-button _id="m_ok">OK</v-button>
</v-vertical-layout>
</body>
</html>
6
Vaadin – Declarative layout

● Live Demo
Demo
Demo
Demo Demo
Demo
デモ
Demo

● For more documentation about Vaadin, see:
https://vaadin.com/book
8
Vaadin Docs

● Currently:
● Apps
● Context menu entries
● Not configured in opencms-*.xml files
● Instead: Plugins loaded from JARs
● Uses Java ServiceLoader API
● Avoids conflicts / problems when updating
OpenCms
● Overridable (via ID & priority)
9
Workplace Extension Points

●The API is not stable and likely to
change until the final version
10
Warning!

11
App Interfaces
I_CmsWorkplaceAppConfiguration
I_CmsWorkplaceApp
I_CmsAppUIContext
Paints widgets on
Creates instance of
Writes
implementation
Developer

● Icon
● Opens dialog when clicked
● Title (localizable)
● ID
● Can override other app with same ID
● App dialog can also be opened directly by URL
http://.../workplace#appid
● Order & Priority
● Category (currently only „Main“, „Legacy“)
12
App configuration class

● Created by app configuration when user activates the
app
● Respond to URI fragment changes
● onStateChange
● Make use of forward / back buttons in browser
● Example: current site & folder in explorer app
● Responsible for initializing the UI
● Use I_CmsAppUIContext for showing widgets in specific
slots
13
App instance

App UI Context – Widget slots
14

● Can use whole OpenCms API
● Get CmsObject for current user with
A_CmsUI.getCmsObject()
● Change part of fragment after app ID with
CmsAppWorkplaceUI.changeCurrentAppState(state)
15
API Access

● Example: Git app
● Other apps currently hard-coded
● Using ServiceLoader mechanism to load app
configurations:
● Compile your classes and put them in a JAR
● JAR needs to contain the following file with the
class name(s) of your implementation(s):
● META-INF/services/org.opencms.ui.apps.I_CmsWorkplaceAppConfiguration
● Copy JAR to WEB-INF/lib folder of OpenCms
instance, restart servlet container
16
Registering an app

● Ported from existing JSP
● Which can still be seen in „old“ Administration
● Simple UI flow:
● Form fields are filled with presets, changable by
the user
● The user clicks on a button
● Some action is performed and the results are
presented to the user
17
Git App

● Configure subclass of
I_CmsContextMenuItemProvider
● Acts as factory for I_CmsContextMenuItem
● Difference from „old“ context menu
configuration:
● No individual lists of menu options for each
resource type
● But context menu items can choose for which
resource types they should be displayed
19
Adding context menu items

● Still missing:
● „Standard“ widgets for OpenCms specific functions
● user / group selection
● Multi-value input fields
● …
● Reports for long-running tasks
● Bookmarks for app states
● More extension points
● More convenience for the developer
21
// TODO

● Any Questions?
Questions?
Fragen?
Questions ?
Questiones?
¿Preguntas?質問

Georg Westenberger
Alkacon Software GmbH
http://www.alkacon.com
http://www.opencms.org
Thank you very much for your attention!

OpenCms Days 2015 Creating Apps for the OpenCms 10 workplace

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Viewers also liked

Viewers also liked (11)

Similar to OpenCms Days 2015 Creating Apps for the OpenCms 10 workplace

Similar to OpenCms Days 2015 Creating Apps for the OpenCms 10 workplace (20)

More from Alkacon Software GmbH & Co. KG

More from Alkacon Software GmbH & Co. KG (14)

Recently uploaded

Recently uploaded (20)

OpenCms Days 2015 Creating Apps for the OpenCms 10 workplace