I will start with the foundation of every Eclipse 4 application, the application model. In this first part, I would like to introduce the different options for modifying this model.

Application Model vs. Views

In Eclipse 4, the application model defines the workbench, including views, menu contributions and key bindings. The model doesn’t require that you first implement the single components. For example, you can work with the model without implementing a view.

The cornerstones of the application model are windows and parts. Contrary to the eclipse 3.x platform, e4 has combined views and editors into the concept of Parts, which represent views inside a window. If you add a part in the model, you can later connect it to your implementation of the selected view. To show the resulting separation between the general workbench design and the implementation of single parts, I will not show any SWT code in this section. Instead we’ll focus on the model and how to connect the model to code.

The Parts of an application model are connected later to their implementations

Installation

You can get the latest version of Eclipse 4 here:  http://www.eclipse.org/eclipse4/. The IDE itself is based on Eclipse 4 and also contains several useful tools to create RCP and RCP 2 applications. Additionally, we recommend installing the e4 Tools, which, thanks to Tom Schindl, provide a very useful template for creating applications as well as an editor to modify the application model. At writing, these tools are still in incubator status and can be installed from this update site: http://download.eclipse.org/e4/downloads/drops/R-0.12M6-201203151300/repository

The first step

After installing Eclipse 4 the easiest way to get started is to use the e4 template to create a new e4 application. To create a project, choose the „e4 Application Project“ entry within the „new Project“ wizard. For this application you don’t have to change anything except the name of the application. The template creates a product definition and you can start the application simply by starting this product. To start it, open the *.product file and click on run or debug in the upper right corner of the editor. As you can see below, the generated template application already contains a window, two menus, a toolbar and a perspective stack.

Click here to start the product.

The Editor

To modify the application model you’ll need an editor which you can start by opening the Application.e4xmi located in the root level of the project. On the left side you see a tree showing the complete contents of the model. By double-clicking an element in the tree, a detailed view will be opened on the right side allowing you to modify the properties of that element.

The top-level elements of an application are usually one or more windows that you can find in the application model under “windows”. The template project already contains a TrimmedWindow. By double-clicking this element you can, for instance, modify the size of this window. Check the result by restarting the application.

With a right click in the tree, new elements can be added and existing ones can be removed. As an example you can remove the existing PerspectiveStack and just add a single Part instead. After a restart of the application you will notice that the main area of the application does not have a border anymore. However, the new part isn’t visible and it would be nice to have some control over the result. I’ll describe how to do that in the next section.

 Open the application model to modify the workbench

Live Editing

Eclipse allows you to define the workbench using the application model even without providing implementations. However, this is sometimes hard to work with because empty Parts are often hard to identify. To resolve this Tom Schindl introduced the idea of a live editor. It allows you to access the application model of a running application, modify it and highlight selected components. To enable the live editor you need to start two plug-ins along with your application. You can check them in the run configuration and additionally click on “Add required” to include the required dependencies. A run configuration should have been created for you when you first started the product.

In the running application you can start the live editor via ALT+SHIFT+F9. This editor works exactly like the editor in your IDE, however, it directly accesses the application model of the running application. If you, for instance, open the TrimmedWindow in the editor and change its size or position, the changes are directly applied in the running application.

The live editor is not only capable of modifying elements, you can even add new ones. As an example, if you add a new window to the application model (right-click on the tree-node windows), a new window will be opened in the application. To maintain an overview of which components are visible in the application, these components can be colored. By right-clicking an element in the live editor, e.g. the TrimBar and selecting “Show Control”, the control will be colored in red in the running application.

Elements of the application models can be colored in the running application.

Using this feature, one can easily visualize changes within the application model. This is especially useful for elements which are not directly visible in the UI. As an example, if you add a new Part in a Window, it will not be visible without coloring as it does not have any content yet.

If you use the live editor to change the application model the changes will only be reflected in the running application. To transfer them into the deployable application, you can copy the modified version of the model using the tab „XMI“ and copy it into the model available in your IDE.

Programmatical Access to the Model

One of the major advantages of the application model is the ability to modify it via API. As the application model is represented in EMF, the API is very familiar to anyone who has used EMF before. Using this API you can create or modify parts of the application programmatically, for example, reacting to a user action. To test this in the template application you can use one of the existing handlers, such as the class OpenHandler.  As you can see in this handler, there is a method execute() marked with the annotation @execute, which will be executed if the connected ToolItem is pressed by the user.

Dependency injection, which we’ll go into more detail on later, allows the programmer to easily define which parameters are needed within this method. In the following code example the method requires the application window as parameter so it will be injected by the framework. In the first line a new part is created and in the second line this part is added to the window. You can check the result by using the live editor described above. First you’ll need to start the application and the live editor. Then click the open button in the toolbar of the example application. In the live editor you can confirm that the new part has been added correctly and even color it in the application.

@Execute
public void execute(MWindow mWindow) {
    MPart newPart = MBasicFactory.INSTANCE.createPart();
    mWindow.getChildren().add(newPart);
}

In the second code example, a new window is created. To add this new window into the application, the application is required as a parameter. Using the API, the window is sized, a new part is added into the window and the window is added to the application. By adding the window to the application, it is opened in the running application. Restart the application and press the button again to check the result.

@Execute
public void execute(MApplication application) {
    MWindow mWindow = MBasicFactory.INSTANCE.createTrimmedWindow();
    mWindow.setHeight(200);
    mWindow.setWidth(400);
    mWindow.getChildren().add(MBasicFactory.INSTANCE.createPart());
    application.getChildren().add(mWindow);
}

Scripting

Another nice feature of the live editor is the ability to apply scripting and access parts of the model API during runtime. As this code will be dynamically interpreted, JavaScript is used. Scripts can be executed on any part of the application model. To do so, start the application and the live editor (ALT+SHIFT+F9). Right click any element, e.g. a window, and select “Execute script”. In the open window, you can enter JavaScript, which will be wrapped to the Java API. The following code example will set the label of a window – during runtime.

mainObject.setLabel("Hello Eclipse")

This second example will make an element invisible. You can try executing this example on the ToolBar, which you can find in the model tree under TrimmedWindow => TrimBar => WindowTrim => ToolBar

mainObject.setVisible(false)

Conclusion

The e4 application models allows you to define the general design of an application in a consistent way, without implementing single parts in advance. We described different methods to modify the application model, including how to modify the model during runtime using the live editor or the API. At this point we have only created placeholders in the application. The next part of this series describes how to connect the application model with the implementation of UI components, that is, how to create the connection between a part and the implementation of a view filling this part.

For more information, contact us:

Maximilian Koegel and Jonas Helming

EclipseSource Munich leads

Email: e4@eclipsesource.com

This tutorial and all other parts of the series are available as a downloadable PDF.

Author: Jonas Helming

Join me on Google+

This API contains a couple of interfaces that we had trouble to find suitable names for. If you’ve used this API already you know that there were two interfaces side-by-side in the same package with almost the same name: ApplicationConfigurator and ApplicationConfiguration. Even though these names seemed to be correct, it turned out that they were hard to tell apart, and if mixed up in a service declaration, the application did not start, without any warning.

So we reviewed the case and eventually came up with better names for the interfaces without changing the structure. Let me explain the new API and our reasoning behind it.

Implementing an ApplicationConfiguration

A RAP application consists of various parts, such as entrypoints, URL mappings, themes, service handlers, etc. All these parts constitute an ApplicationConfiguration. The configuration is like the blueprint for an application. Based on an ApplicationConfiguration, the framework can create and start an application instance. There can be more than one application instances at runtime, e.g. running on different network ports or different servlet contexts.

Hence, when you write a RAP application, you have to provide an ApplicationConfiguration.

An ApplicationConfiguration is used to configure an application before it is started. For this step, RAP follows a callback approach to leave the responsibility for creating and starting the application with the framework. Therefore, the configuration must actively configure the application. To do so, it has one method configure( Application ). The framework provides a reference to the created Application as a parameter to this method. Here’s how a simple implementation looks like:

public class SimpleConfiguration implements ApplicationConfiguration {
 
  public void configure( Application application ) {
    application.addEntryPoint( "/simple", SimpleEntryPoint.class, null );
    application.addEntryPoint( "/other", AnotherEntryPoint.class, null );
  }
}

Registering the ApplicationConfiguration

When using OSGi, the ApplicationConfiguration can be registered as a service. I’d recommend using OSGi declarative services (DS) like this:

<scr:component xmlns:scr="http://www.osgi.org/xmlns/scr/v1.1.0">
   <implementation class="com.example.SimpleConfiguration"/>
   <service>
      <provide interface="org.eclipse.rwt.application.ApplicationConfiguration"/>
   </service>
</scr:component>

The bundle org.eclipse.rap.rwt.osgi will automatically start this application on every available HttpService. When using Equinox, don’t forget to also include the org.eclipse.equinox.ds bundle. You can find an example of a simple RAP application using DS on github.

When using RWT as a library in a traditional web application, i.e. without OSGi, you can register your ApplicationConfiguration in the web.xml by adding a context-param with the fully qualified class name of the implementation:

<context-param>
  <param-name>org.eclipse.rap.applicationConfiguration</param-name>
  <param-value>com.example.ExampleConfiguration</param-value>
</context-param>

You can always look up the param-name in the constant ApplicationConfiguration#CONFIGURATION_PARAM. The RAP FAQ has a complete example.

Starting an Application

When an ApplicationConfiguration has been registered as described above, the application is automatically started by the framework. Alternatively, it can also be started explicitly using an ApplicationRunner:

ApplicationConfiguration configuration = new SimpleConfiguration();
ApplicationRunner runner = new ApplicationRunner( configuration, servletContext );
runner.start();

There’s a saying that there were only two hard things in computer science, cache invalidation and naming things. I don’t happen to know what’s so tricky about cache invalidation But I can hardly remember any technical problem that caused me as much of a headache as these few names did. I hope that after so many discussions, this new API will prove to be simple to understand and to use.

Thanks to Frank, Rüdiger, Holger and Jordi for great discussions and especially to Frank for contributing this new API to RAP!

The changes are part of RAP 1.5M7, published this Friday, May 11.

Content assist in in package-info files

and enhanced static analysis of case statements:

Checkout the entire new and noteworthy or download the milestone and try it out:

http://download.eclipse.org/eclipse/downloads/drops4/S-4.2M7-201205031800/

]]> http://eclipsesource.com/blogs/2012/05/05/eclipse-juno-milestone-7-available-for-download/feed/ 3 http://eclipsesource.com/blogs/2012/05/02/rap-mobile-0-5-7-new-and-noteworthy/ http://eclipsesource.com/blogs/2012/05/02/rap-mobile-0-5-7-new-and-noteworthy/#comments Wed, 02 May 2012 16:03:12 +0000 Moritz Post http://eclipsesource.com/blogs/?p=7581 Once again we are releasing a new version of RAP mobile. This latest release 0.5.7 brings with it a very cool new feature that we call the “Client Canvas”. This extension of the classic SWT Canvas allows you to draw freehand on your screen with your stylus or even your finger.

Additional Features and API

Client Canvas

The client canvas provides you with basic freehand drawing options, allowing you to sketch with your stylus or your finger.  Like a regular drawing program, you can choose your color, brush size and opacity. And, you can step through the history of your drawings to undo/redo certain steps. To implement this feature we built upon the SWT Canvas object that allows us to change the pen properties via the established Canvas API. To get started with drawing you’ll just need to instantiate the com.eclipsesource.rap.mobile.widgets.ClientCanvas instead of the regular SWT Canvas. To demonstrate the Client Canvas we have created a sample where you try out a little draw-by-numbers.

Android

Browser

The RAP mobile Android client is catching up with iOS on browser support. We now support the SWT Browser widget, allowing you to show full websites or custom HTML snippets inside your RAP mobile application. We also support the Browser.evaluate() and Browser.execute() methods to execute javascript in the browser on the Android device and to make it possible to send execution results back to server. The screenshot to the right shows examples that display a full website, an HTML snippet and the execution of a custom javascript function.

Support for various SWT Shell style flags

SWT offers many ways to customize the appearance of a shell via the style flags passed to the Shell constructor. These flags are also important to create SWT Dialogs. We now support the additional SWT shell styles TITLE, BORDER and *_MODAL. The following screenshots demonstrate the various style combinations.

Bugfixes

We are constantly working towards a high level of stability and solid performance, and in this release, we squashed some bugs which deserve special mention:

• Fixed an issue where selecting elements inside a vertical ScrolledComposite was not possible
• The GraphicalContext used android APIs not available on the supported basline version android 2.1 (API level 7).

iOS

You’re probably already enjoying the browser support on our RAP mobile iOS client, and can now also take the Client Canvas for a test drive.  Two other things that you might notice in this release are a new UI hint to show how to enter the developer SystemMenu and improvements to modalShell rendering and animation.

The general theme for this year’s testing day is “Testing and Beyond”. Topics of interest include:

1. Testing Eclipse applications
2. Testing within the Eclipse Ecosystem
3. Testing on Eclipse Projects
4. Design for testability in Eclipse
5. Case studies of testing projects
6. Eclipse tooling and technology for the test process
7. Testing as a part of the application lifecycle
8. Continuous integration and testing for Eclipse applications

The call for papers is open. If you would like give a talk on one of the given topics, or maybe if you have a visionary ‘beyond’, don’t hesitate to submit a talk.  The deadline for submissions is May 31st.

You’ll find more information on the wiki at http://wiki.eclipse.org/Eclipse_Testing_Day_2012

The goal of this project is to connect the Microsoft Kinect SDK with Eclipse/Java. In case you do not know the Kinect, it is a device originally built for the Xbox to track human bodies. As persons can be tracked in real-time it allows you to control games, menus and more, just by moving your body. Additionally the Kinect supports speech recognition for pre-defined phrases. Microsoft has also released an SDK for Windows, which allows access to the features of the Kinect in C++/C#. However, there was one important thing missing: Eclipse

Therefore, about a year ago, I and a group of interested students started to work on a way to make the features of Kinect available in Eclipse. Unlike other approaches, we did not want to connect directly to the device and process the raw data. Instead we decided that it would be nice to reuse Microsoft’s SDK which delivers the data processed and on a very high level of abstraction. As an example the SDK delivers the exact positions of different parts of the body of a tracked person.

Building on the SDK, the tricky part was obviously the bridge from C to Java. In a first prototype we used a small C program running in the background and a socket connection to transfer the data from the original SDK to a plugin in Eclipse. This is what I demonstrated last fall at EclipseCon Europe:

In winter another team of students worked on an improvement – the adaptation via JNI. This is more stable and it doesn’t require a second program running, and therefore creates real interoperability.

Not surprisingly we created Jnect as an Eclipse plugin. Recently we created an Eclipse Labs project hosting the plugin (see jnect.org) and we already have a beta-release. It is not perfect yet, but you can test the capabilities of the Kinect and find your use case. Of course, we welcome any feedback and possible contributions. At EclipseCon North America, we were even able to implement a game based on Jnect, which was played during the awards ceremony. The goal was to step thru code as fast as possible using gestures and voice commands. Of course, we have chosen more difficult gestures then just moving a hand. Here you see one of the participants executing the “Step Over” Gesture 

During on our session at EclipseCon, we demonstrated how to move and resize windows in Eclipse 4 using your hands (a little like minority report). This and other code examples are available on jnect.org. You’ll also find videos demonstrating the capabilities of the Kinect as it controls different parts of Eclipse.

Have fun!

I would like to share the links to the presentations, which were shared with me. If you gave a talk and your slides are missing, please send me the link, I will post it here.

Talk 2

Presenter: Mickael Istria

Title: Iterative and agile principles applied to generated code

Slides: http://www.slideshare.net/mickaelistria/iterative-andagilecodegen

Talk 3

Title: What’s new in EGF (Eclipse Generation Factories)

Presenter: Benoit Langlois

Slides: http://wiki.eclipse.org/images/4/47/EclipseCon_US_2012-Whats_new_in_EGF.pdf

Talk 4

Title: You need to extend your models? EMF Facets vs. EMF Profiles

Presenter: Philip Langer & Hugo Bruneliere

Slides: http://www.slideshare.net/HugoBruneliere/you-need-to-extend-your-models-emf-facet-vs-emf-profiles-12163425

Talk 5

Title: EMF Diff/Merge

Presenter: Olivier Constant

Slides: http://wiki.eclipse.org/images/9/98/EclipseCon_US_2012-EDM.pdf

Talk 6

Title: The CDO Model Repository

Presenter: Eike Stepper

Slides: http://www.slideshare.net/Holmes70/cdo-ignite-12281516

Talk 7

Title: EMFStore

Presenter: Maximilian Kögel

Slides: http://www.slideshare.net/koegel/emfstore-demo-eclipsecon2012

Talk 8

Title: EMF Client Platform

Presenter: Jonas Helming

Slides: http://www.slideshare.net/JonasHelming/emf-client-platform-modeling-symposium-eclipsecon-north-america-2012

Talk 9

Presenter: Mickael Istria

Title: What’s up GMF Tooling?

Slides: http://www.slideshare.net/mickaelistria/iterative-andagilecodegen

Talk 10

Presenter: Andres Alvarez & Ruben de Dios

Title: GMF simple map editor

Slides: GMF Simple Mapping Editor (EMS)

Talk 13

Title: MDT/OCL

Presenter: Ed Willink

Slides: http://www.eclipse.org/modeling/mdt/ocl/docs/publications/EclipseConNA2012/EclipseCon2012.pdf

As you can test for yourself, the difference between server-side and client-side validation is quite noticeable.

When using ClientScripting, you will need to know very little JavaScript, and all API is as close to SWT as possible. The project has a wiki page with all further information you might need (including where to get the code). Note that you need RAP 1.5M6 or newer to use it. If you try it out, please consider giving some feedback, report bugs or file enhancement requests.

Just enable the markup support for a certain widget (see below), then you can make its text bold, italic, yellow or … no, not blinking! Actually, RAP will validate the markup and allows only a selection of tags (no <script> tags, please!). But since the <img> tag is in that list, you can add a smiley instead .

Table table = new Table( parent, SWT.BORDER );
table.setData( RWT.MARKUP_ENABLED, Boolean.TRUE );
TableItem item = new TableItem( table, SWT.NONE );
item.setText( "Some <em>text</em> with <strong>markup<strong>" );

This also means that you don’t have to break your neck anymore just to add an HTML link to your RAP UI. You can now place real links in any Label or CLabel:

Label label = new Label( parent, SWT.NONE );
label.setData( RWT.MARKUP_ENABLED, Boolean.TRUE );
label.setText( "<a href=\"http://eclipse.org/rap\" target=\"_blank\">RAP project page<a>" );

Don’t like the setData() programming? We don’t like it either. But for now, it’s the simplest way to expose additional functionality without changing the SWT API. For RAP 2.0, we plan to come up with some better API for our extensions.

Try out the markup support in our updated online demo! BTW, did you notice that this is a deep link into the demo application? Yes, there was a bug preventing them from working in RAP for long, and it’s now finally fixed! You can now use the BrowserHistory to navigate to a certain point in your application right on startup. Here’s the link to an example page that shows markup in a Table.

And there are more Table and Tree enhancements, such as the fixed columns support that lets you exclude one or more colums from horizontal scrolling. Check out the full list of changes in the New & Noteworthy.

Get it while it’s hot, this milestone is a must have

I’ll be giving two presentations on p2 (and likely spending lots of time in the bar talking about p2).  The first presentation is a very gentle introduction to p2.  In this talk we will introduce p2 more pragmatically, presenting the relevant files (profile, content.xml, …), tools (director, mirror, …) and concepts.

In the second talk, It’s Raining Bytes, we’ll discuss how we scale p2 using a variety of cloud technologies.  In particular, we’ll discuss how we deploy over 64,000 plugins (and over store over 500,000 IUs) using different AWS services.

If you’re interested in p2, Yoxos, Eclipse releng, modeling or anything Eclipse related, look for me in the bar or stop by one of my talks.

I look forward to seeing everyone next week!