Saturday, September 22, 2012

A multi-touching experience with a WeTab

Hi there!

This time my post won't be strictly code related. Instead I'll share with you my recent experience with a WeTab, a tablet computer I have for a couple of years, trying to test a few JavaFX multitouch enabled samples from the JFXtras project, from Carl Dea (@carldea) and Gerrit Grunwald (@hansolo_).

First of all, let me introduce you to the WeTab tablet, for those of you who haven't heard of it yet. Instead of boring you with technical data, here you can find the specs, and here you have a very good review of the WeTab. But in short, it includes a (big) 11.6" TN-panel touch screen (1366×768 resolution) powered with Intel GMA 3150 graphics and PCIe x1 Broadcom CrystalHD BCM70015, a 1.66 GHz Intel Atom N450 processor with fan, 1 GB RAM memory, 16 or 32 GB  flash memory, WiFi and optional 3G, 2 USB ports, and a total weight of the device of 1.002 kg.


I knew of it back in 2010, thanks to my partner Ricardo Vela (@rikivela), when we were developing client and server Java based projects, and we felt the necessity to go wireless with our client applications. So we searched for a tablet where we could run java and he found this linux based tablet with MeeGo technology. It was only sold in Germany by then, so we have to buy it through Amazon.de store.
 
So at the beginning of 2011 I had in my hands this heavy tablet. It took me a while to refresh my rusty linux knowledge, but I was able to download and install the last JRE linux version, and test that my application ran on it really nice and smooth. I was so excited I took a (very bad) picture of it:



Even it had its plastic cover on it! I realized I have to fix the screen size of my app, but apart from that, you know what they say: write once, run everywhere.

Then we had the chance to make an iOS version for iPhone and iPad tablet of the same project, and we found the pros and cons of it: The WeTab screen had nothing to do with the Retina Display of iOS devices... but we have to re-write all the client app to Objetive-C. Anyway, this is a story for another day.

For several reasons I had my WeTab parked somewhere, until recently, when Carl Dea tweeted about finding a linux tablet to run JavaFX. I offered myself, and then... the story begins...

Java, JavaFX and MeeGo

If you want to test Java and JavaFX based applications you have to install the last JRE in the tablet. There're plenty of blogs out there to show you how, but here it's what I do:

First of all, go to the WeTab Market (first icon you'll find on the desktop), Tools & Utilities section, and download the Firefox Internet browser. It will install itself inmediately. Open it and go to Oracle site and download jre-7u7-linux-i586.rpm. It will be stored by default in /home/<user>/Downloads.

Download also the RootShell app, so you can open a terminal window and enter the command line world.



Write and insert password when asked:
#cd Downloads
#sudo rpm -ivh jre-7u7-linux-i586.rpm

Then the whole package will be installed in /usr/java/jre1.7.0_07. Also the links /usr/java/default and /usr/java/latest will be added. Ignore a few errors shown at the end of the process.

To add the JRE to the path, edit the file:
#sudo gedit java.sh

add the following:
#!/bin/sh
export PATH=/usr/java/default/bin:$PATH
export JAVA_HOME=/usr/java/default


save and close it, and install it:
#sudo install -m755 java.sh /etc/profile.d

Close the console, and you're ready to try any Java or JavaFX application.

SlideLockSample. First try

In my desktop I create a sample class called SlideLockSample1, which I compile and build and then I copy the jar file to the WeTab, with an USB flash drive, for instance. This is part of the start method:

    @Override
    public void start(Stage primaryStage) {
        final Label lbl=new Label("Locked!");
        lbl.styleProperty().set("-fx-text-fill: red;-fx-font: 1.5em \"Arial Bold\";");
                    
        SlideLock slideLock = new SlideLock("slide to JavaFX");
        slideLock.setBackgroundVisible(true);
        slideLock.lockedProperty().addListener(new ChangeListener< boolean >() {

            @Override
            public void changed(ObservableValue observable, Boolean oldValue, Boolean newValue) {
                if (!newValue) {
                    lbl.styleProperty().set("-fx-text-fill: blue");
                    lbl.textProperty().set("Unlocked!!!!");
                } else {
                    lbl.styleProperty().set("-fx-text-fill: red");
                    lbl.textProperty().set("Locked!");
                }
            }
        });
    }


Here you have the code and the jar from JFXtras project, with the very last commits.

And here you have a small video taken with my iPhone showing how I slide the control with my finger, after starting the project with java -jar SlideLockSample1.jar in the console.

I was excited to see the touch event working... until I realized it was in fact a simple mouse event. To test that I commented first the touch events in addHandlers() method in SlideLockSkin class:

private void addHandlers() {
        // MouseEvents
        setOnMousePressed(mouseHandler);
        setOnMouseDragged(mouseHandler);
        setOnMouseReleased(mouseHandler);
        // TouchEvents
        setOnTouchPressed(touchHandler);
        setOnTouchMoved(touchHandler);
        setOnTouchReleased(touchHandler);
    }

And ran the jar again, working as it did the first time. So then I uncommented touch events and commented mouse events. Guess what? It didn't work.

So my multitouch tablet was only handling single touch events as pure mouse events. I found googling that with the last touchscreen firmware (which I had) the multitouch was supported <just> in the browser, the maps and the Picture Viewer app. I tested this one, and it really had zoom, rotation, scrolling  gestures working. You can find it in the WeTab Market, Entertainment and Multimedia section.

What about other applications? Nothing at all.

Quite dissapointed I looked for other options. I found a really good WeTab blog here, and following his post about multitouch I took the plunge and installed Ubuntu in my WeTab, now with instructions from this other post.

Partitioning the WeTab

As I wanted to keep the WeTab OS, I had to partition the 32 GB disk. For that I used GParted software, which I could download from here.  

Shortly, from Windows OS, you have to unzip the content to the USB flash drive, open a command line window with administrator privileges. Then let's say USB drive is H:, type H:cd utils/win32, and run makeboot.bat to install a hidden file and make the flash drive bootable.

Then comes the tricky part... Plug in the flash drive in the WeTab, turn it on and as soon as you see the blue led in the top left corner light up, press both the power-button and the quicktouch orange button (top left corner) together for approximately 1 second, and release them. GParted Live should boot up from the USB flash drive.

Then use the quicktouch orange button on the upper left corner of the WeTab to browse through the Boot menu for Gparted. One short touch switches between options. Select "other modes of Gparted",
hold down a second on the quicktouch button, it selects the entry. Then choose "Run from RAM or memory". It takes a while to load, but at the end it shows a graphical application with all the partitions. Select the sda3 partition (the biggest one) and then Resize. I resized mine to allow 8 GB for Ubuntu. Select the unasigned space and create a new partition with ext3 format (sda4).

Installing Ubuntu

Download last Ubuntu version, 12.04, from here. To create a bootable USB drive from Windows, also download and install this. Then open it, locate the ubuntu image, select the flash drive and click on Create.

Now you have to plug in the flash drive in the WeTab, turn it on, press both power and quicktouch buttons for a second, and when the installer boots up, follow the process to install Ubuntu. At the end of the process, you should modify the WeTab booting options to select WeTab OS or Ubuntu.

Finally, in order to allow multitouch events, following Etheros blog, I opened a console and typed:
sudo add-apt-repository ppa:utouch-team/utouch

Guess what? The repository was gone... You can check it here, the page is not found.

That's one of the thing I fear from Linux... you're always depending on some team's work, which suddenly may disappear.

Belive me I tried other options from the repository, but nothing worked, although I must say probably I missed something as clearly I am not a Linux expert.

Anyway, I installed Java, pretty much as described before, and it happened the same, the touch event was treated like a mouse event. No multitouch at all, as expected.

So I took another approach...

Installing Windows 8

A friend of mine told me about the native support of Windows 7 and Windows 8 for touchscreens, so I decided to give it a try, as the WeTab is x86 based.

So I downloaded Windows 8 Release Preview from here, and unzipped it to the USB flash drive.  Plugged in the flash drive in the WeTab, turned it on, pressed both power and quicktouch buttons for a second, and followed the process to install Windows 8 (in my case, in the sda4 partition, overwritting Ubuntu). At the end of the process the new interface of Windows was ready, with multitouch gestures support.

I won't go any further with that... Just two things: I ran out space! The installation took the 8 GB and left 90 MB free!! And there were no way to boot from WeTab anymore...

Well, I had to start all over again... Booting with GParted Live, I deleted sda4 partition, resized sda3 to have at least 16 GB of free space, created a new NTFS partition and installed again Windows 8.

To allow booting from WeTab OS, I found the EasyBCD software here, which allows to create a bootable menu from Windows. Just add a new Entry, select Bios Extender and install PLOP.

Java and JavaFx, second try

Downloading and installing JRE as usually in Windows, I was finally ready to test JavaFX multitouch gestures!

To end this long post, let me just show you two samples I've tested from JFXtras project.  Also you may have a look at this tutorial from JavaFX documentation.

This is the SlideLock Sample video I've taken with my iPhone, so excuse me for its bad quality:

You can see real touch events in action. Really smooth. Here you may find the surce code for the SlideLockSample2. Great job Carl!!

And this is the Gauge Radial Sample video:


Now, you can see rotate gestures in action. For the code, just look at Gerrit's blog here. As always, great work, Gerrit. 

Well, sure you've noticed in the video the slow performance of the radial... Don't blame Gerrit... As he pointed out, the issue here is hardware vs software acceleration.

If you look at JavaFX 2.2 system requirements here you'll read that for JavaFX applications to take advantage of the new hardware acceleration pipeline provided by JavaFX, your system must feature one of a wide range of GPUs currently available in the market. For Intel graphics cards, as mine, you need at least GMA 4500MHD and GMA HD. 

But the WeTab card is GMA 3150, so that's why if the system does not support hardware acceleration, then JavaFX uses the Java2D software pipeline. Here the Atom N450 does its best...

Conclusions

First of all, excuse me for this long post. I've tried to talk about many things... You can always skip most of them and go to a part of your interest.

Second, you can see there's plenty of room to experiment here... Please, feel free to share any experience!

Finally, about multitouch gestures, although they look astonishing, there's lot to do in many devices and OSes. In this early stages, you should find the proper combination of hardware and software. A bad choice can ruin your work. That's where tablets like the WeTab have their pros, easily you can make a light demo of your projects. 

And it's for another discussion what happens with Java Embedded and JavaFX for more limited architectures like ARM platforms, with devices like Raspberry Pi.


3 comments:

  1. Awesome! When a first release of jfxtras will be released?

    ReplyDelete
  2. Hi Eduardo, please visit http://jfxtras.org/, there you have the links to the github repo to JFXtras-labs, where you'll find the components that are currently under active development. Also you'll find the mailing lists links.

    ReplyDelete
    Replies
    1. Thanks José!. I'm working on a project with JavaFX 2.2 + Spring + OSGi. So far, this is a great experience. Sure that we need some "touch ready" components! I will look closer this links! Thanks!

      Delete