Tim Buschtoens
Tabris.js 2.0 – Top 10 Features: TypeScript & JSX
Tomorrow Tabris.js 2.0 will be released and we conclude our count-down of the top 10 new features with our favorite addition: support for TypeScript 2 & JSX.
Tabris.js 2.0 – Top 10 Features: Windows 10 Support
The Tabris.js 2.0 release is almost here (July 18) and we continue with our count-down of the top 10 new features in the major release. Number 2 is support for the Universal Windows Platform.
Tabris.js 2 now supports Windows 10 Apps
As of version 2.0 (Beta 2), Windows 10 officially belongs to the family of platforms supported by Tabris.js, the cross-platform Mobile App development framework. This means the Tabris.js 2 Windows Developer App and Cordova Platform are now available to download and will be updated with each new Tabris.js Release. Our Tabris Build Service also has been updated and lets you create appxbundle packages suitable for sideloading Windows Store apps on any Windows 10 device. Building appxupload packages (for uploading to the the Windows Store) will be possible soon. Everyone is encouraged to test this new service, as we are still working out possible issues and would like to find them sooner rather than later.
Announcement: Windows 10 Support coming to Tabris.js
The goal of Tabris.js is to enable you to write an app once and run it on any mobile platform you need, always using 100% native UI components. By now Windows 10 Mobile has a respectable market share in Europe, and its x86 counterpart is running on millions of tablets and laptop/tablet hybrids everywhere. Therefore Tabris.js will deliver for those devices as well.
Tabris.js Tips & Tricks: Parts 1 - 3
1 - A module for every page!
The Page widget and JS modules are a natural fit. The backbone of your Tabris.js App should consist of modules defining pages. For example ‘MyPage.js’:
How to find local resources in Tabris.js
The built-in, node compatible module system of Tabris.js makes it pretty easy to find and load JavaScript files within your project. NPM modules aside, all paths are relative. So even if your current module is "subProject/modules/dialogs/foo.js", you can open "subProject/modules/dialogs/bar.js" simply by calling "require("./bar");"
RAP 3.0 Released
It’s good to be back.
After using half-year release cycles for the RAP 2.x versions, taking a full year for RAP 3.0 felt eerily long. On the other hand I think it was exactly the time we needed to create a release that we can be proud of.
Nebula Grid and FileDialog are now part of RAP
If there is a theme for RAP 3.0, it is to bring the current incarnation of the framework to its fullest potential. On the one hand this meant cleaning up API and code and raising the minimum requirements to take advantage of current HTML5/CSS3 features. For example this allowed us to add clipping support, modern ScrollBars and some other theming enhancements.
Working with modules and libraries in Tabris.js
Tabris.js implements a module system as outlined by Common.js and supported by npm. Modules are a great way to organize your application code into isolated units. Unlike conventional scripts they keep the global namespace clean and are automatically loaded in the right order.
RAP 3.0 Release Schedule Update
We have recently updated the RAP 3.0 release plan, it is now going to ship together with the Eclipse Mars release train in June 2015. I would like to provide some insight into this unusual update.
RAP 3.0 M3: revised ScrollBar, row templates in Nebula Grid
Last Friday, 14 November 2014, we published another milestone build for RAP: RAP 3.0 M3. It is available for download from https://www.eclipse.dev/rap/downloads/. This milestone is mostly about theming improvements.
RAP 3.0 M2 - What's new in Widgets
Once again these are exciting times for RAP as we are preparing for the next major release, RAP 3.0. We continue to clean up code, work on the look and feel, and integrate matured Incubator components. The RAP 3.0 M2 milestone build is available for download since October 03, 2014. Here’s a list of the most interesting M2 changes specifically in the widget set.
(Yet) Another Charting Widget for RAP
Maybe you’re familiar with Ralf Sternberg’s d3 widget for RAP (it’s part of the RAP Examples Demo). Like the name implies, it’s a charting widget based on the d3 library, which uses SVG to render its elements.
Eclipse RAP 2.3 is here!
Yes, the rumors are true, you can finally download RAP 2.3.0 from our website, from Maven Central, or conveniently bundled with the Eclipse 4.4 IDE as “Eclipse for RCP and RAP Developers”.
Even fancier RAP Tables with Templates & native CSS
In RAP 2.2 we introduced the Row Templates feature, which allows you to layout the cells of table rows in different ways than just in columns. In RAP 2.3 we improve on this a bit by allowing not just absolute (pixel) but also percentage values for positioning. However, another cool feature that isn’t documented (because it’s considered experimental) is that you can now style your cells with native CSS.
RAP and Accessibility / Screen Reader
As I mentioned in my previous post about RAP and Selenium, EclipseSource offers a commercial Add-On that adds WAI-ARIA support to RAP. While we use it mainly for UI-Tests, that’s not really the purpose of ARIA.
How to write UI tests for RAP with Selenium 2.0
We’re occasionally asked how RAP supports UI tests. And while we were aware that there are developers creating UI tests for RAP, we never gathered much experience ourselves. However, in recent months I had the opportunity to delve deeper into this topic myself, specifically researching if Selenium 2.0 works with RAP 2.x. Spoiler: It does.
A look at the Internet Explorer 11 Developer Tools
Ever since the release of Internet Explorer 9 Microsoft has put a very noticeable effort into catching up to other browser (specifically Chrome and Firefox) in terms of compatibility and performance. The results haven’t been half-bad, especially considering they added HTML5, CSS3 and SVG support seemingly overnight. Of course, MS easily has the resources to do such a thing - and then pay for a stylish ad-campaign with licensed music on top of it:
RAP 2.2M3 introducing "Row Templates" on Tree & Table
Behold! ;-) After moving ClientScripting from Incubator to RAP proper in M1 and revising ToolTips in M2, we finally introduce an all new key feature in 2.2M3 called Row Templates.
Coming Up: RAP 2.2M2 with sexy new ToolTips
RAP 2.2M2 is due next week, and if you use any ToolTips (the property, not the class) in your application you will notice quite a few changes. First, ToolTips have a new default look, and they can now point towards the widget they describe. Instead of placing it somewhere besides the mouse cursor, the ToolTip is positioned above, below, or besides the widget, with a small pointer attached to it:
Introducing RAP AutoSuggest
A while ago we started a new RAP Incubator project, the DropDown widget. This is basically a List widget that can be attached to a text field, like the pop-up of a combo box. In itself this widget isn’t terribly useful, but it provided the basis for the new AutoSuggest component, which is currently part of the same incubator project.
RAP 2.2M1 published, ClientScripting changes
The first milestone of RAP 2.2 has been published last Friday. It’s main attraction is the RWT Scripting feature which was formerly known as the incubator “ClientScripting” project. If you are currently using ClientScripting and wish to upgrade to RAP 2.2 (which will be released in December 2013), you should be aware of some breaking changes*:
How to debug RAP 2.x custom widgets and client listener
RAP 2.0 introduced the JavaScriptLoader service to allow custom widgets to load their scripts dynamically. However, because this is based on an “eval”-like JavaScript feature, the scripts did not appear like all other in the browser developer tools, and setting break points was not possible. The same exact same issue always existed for ClientListener. For the JavaScriptLoader this will be fixed in RAP 2.2M1, but ClientListener can not be changed in the way they are parsed.
Four ways to deal with private members in JavaScript
I’ve been programming JavaScript for a few years now, and the one thing that definitely bothered me from the beginning was the lack of built-in support for private object members. The feeling that anyone using your code (including yourself) could by accident or intent mess with the internals of your objects isn’t great. Not just can anyone change the value of any property at any time, even methods can be overwritten from outside the instance. I’ve seen and toyed with a few different ways to solve this issues, and these are my preliminary findings for each method.
RAP Client Scripting Phase II (3/3)
Part 3: Cross-Widget Scripting
The most glaring limitation of ClientScripting since it’s inception was that a listener can only manipulate the widget that fired the current event. Consider, for example, an onscreen number keypad like this:
RAP Client Scripting Phase II (2/3)
Part 2: How to Pass Data to Your ClientListener
A ClientListener is executed in a completely different environment to a traditional SWT listener. The only data it has access to is the event object, which in turn has a reference to the ClientScripting-version of the widget that fired the event. Until now, the almost only way to pass any data to a ClientListener was to hard-code it into the JavaScript. Consider this code for a Verify listener:
RAP Client Scripting Phase II (1/3)
Part 1: RAP 2.1 and Client Scripting
The RAP ClientScripting add-on was introduced with RAP 1.5/Juno to enable more responsive input validation on text widgets. The basic idea is that while most components of a RAP application can run exclusively on the server, some surface-level behavior is best implemented to run on the client. ClientScripting allows this by adding support for SWT-style event listeners written in JavaScript which can be executed within the user’s browser without any latency.
How to use multiple browser tabs in your RAP 2.1 Application
You can now download RAP 2.1 M2, the final milestone of RAP before the 2.1 (Kepler) release in June.
The D.I.Y. RAP Client Construction Kit
Since RAP 2.0 has fully implemented the JSON-based RAP Protocol I was eager to test it’s full potential myself. The Tabris clients for Android and iOS already exist and others may follow, but as I’m mostly at home in the browser that’s where I would like to use it.
Writing JavaScript Tests with Jasmine for RAP
If you are writing unit tests for your Java code, then you should also write them for any other code you wrote for the same project. Otherwise these tests only give you a false sense of security. RAP 2.0 provides a new JavaScript API to extend the framework with custom components, as you can read in this blog post. Using third party JavaScript libaries (jQuery, D3, etc) or widgets/applications (like GMaps, CKEditor… ) makes the task manageable even if you are not an HTML/CSS/JavaScript expert. But what about tests?
Keyboard Controls in RAP: Next Step Mnemonics
Applications built with RAP are often designed for high productivity: The faster you can control the app, the more work you can get done. In many cases, keyboard controls are significantly faster than mouse controls. Consequentially, RAP has continually improved keyboard controls since it’s inception.
RAP 2.0 RC1 published
The RAP team wishes everyone a Happy New Year and proudly presents the first release candidate for RAP 2.0.
RAP ClientServices explained
One of the bigger changes in the RAP 2.0 API is the introduction of client services. These are features that interact with the client, but aren’t directly related to the widget toolkit. Since there are now multiple types of clients that can be connected (mainly our default WebClient, Tabris for iOS and Tabris for Android), as well as different environments (browser, OS version, hardware), not all of these features may be available at all times.
Eclipse RAP on Windows 8: First Impressions
Along with the release of Windows 8 also came the new Internet Explorer 10. (It has not yet been released for Windows 7.) While IE9 was an impressive (but overdue) technical improvement over IE8, IE10 is - naturally - a much smaller step forward. Significant for RAP are especially the improvements in CSS3 support, and the new touchscreen controls when running IE in its “modern app” (Metro) mode. Google Chrome also already supports the new windows 8 UI, so we will take a look at that too. Firefox only runs in desktop mode, but I also tried it shortly.
How to deal with whitespaces in the Eclipse IDE
Whatever your project’s specific policy on whitespaces is (tabs vs. spaces, etc), the most important rule should always be consistency. Not just to make your code look nice, but also to avoid issues with patches and your version control system. Changes to whitespaces may be more or less invisible to the naked eye, but Git and co. register them anyway.
Why should we always program in English?
Want to be a developer, but your English is really, really bad? Are you learning some other language and want to practice while doing your job? Or do you just want drive your colleagues insane with code that only you can read - because you happen to know Hindi?
Scrolling in mobile Web-Apps
I love Android, but its default browser is terrible. For relatively simple, static websites it’s okay, but i’m talking about complex HTML(5)/JavaScript applications here. And while Safari for iOs is considerably faster, it’s has almost as many quirks and bugs. A great alternative to native apps or Flash this ain’t (yet).
Client-Side input validation with RAP ClientScripting
The RAP team started working on a new feature called ClientScripting. It’s still in it’s infancy and will not (yet) be part of the core framework , but its already very useable. The goal is to allow adding pieces of behavior to the client-components of RAP widgets. This makes it possible to have swift, dynamic user feedback in situations that require a certain amout of logic - so far a problematic scenario for RAP applications. It can be considered an alternative to custom widget development in many cases, and might also save some network traffic. We currently focus on the scenario of validating text input while typing, and will expand from there. Interactions between widgets are not yet possible, but is planned.
CKEditor for RAP
If you ever need a WYSIWYG editor in your RAP application, look no further.
Using Key Events effectively in RAP
Good keyboard controls have become a staple of modern web applications, such as Google Mail, Github (press “?”) and Flickr. However, almost every browser implements key events slightly differently, all with some quirks, and none of them like in SWT. For this reason, key events in RAP had, until recently, several issues and limitations. That is a thing of the past now, as the key events implementation has been largely rewritten in RAP 1.5M5, and now finally works reliably. This also brings some general changes to RAP key event handling.
CSS3 and Shadows in RAP
RAP already offers advanced styling features including customizable cross-browser gradients, rounded borders and animations. We now complete this feature set by introducing advanced, configurable shadows, giving your RAP application a modern, subtle 3D-look.
A new Google Maps Widget for SWT and RAP
Your early Christmas present from EclipseSource: a custom-widget that displays, controls and reacts to a Google-Map. While there have been similar widgets before, this one is the first (as far as I know) that runs in RAP and RCP without any changes.
RAP 1.4 with improved iPad support
If you ever wondered if RAP runs on the iPad, the answer is now YES. We fixed a number of iPad-related bugs for 1.4M2, and now it runs (almost) trouble-free. You can even start your RAP-application in fullscreen, making it look more like a native app. See for yourself with this video:
RAP now does animations
Animations are an integral part of most modern UIs, including many “web 2.0”-applications and websites. (Just watch carefully when opening google.com.) They have become so common that we even subconsciously miss them if they aren’t there. The transition between two states of an UI should never be sudden, but gradually (albeit quickly), as we are used from real life. If done right, this increases usability without attracting too much attention or slow down the user. Ideally one isn’t even aware of the effect, it only feels more organic and natural.