GWT Augmented Reality - HOWTO - step 2

Welcome to the third (and fortunately last) step of using NyARToolkit in a GWT project.

In the previous steps (step 0 and step 1) we got NyARToolkit ready for our GWT project and we
used  the toolkit to detect a marker on a static image; now we are going use the stream from the webcam to populate the sensor.

First of all we should now really switch to GWT 2.5 and Elemental; quoting form the first post of the series:

Using Elemental in a GWT project is quite straightforward:

1. donwload the latest GWT (well, we used for this project RC1 but all seems safe to be done with 2.5.0 final) and setup a new project;
2. add to the build path gwt-elemental.jar (is in the unpacked gwt 2.5 archive);
3. add to the gwt.xml file the line  <inherits name='elemental.Elemental'/>
   ....

and we are ready.

WebGL with GWT/Elemental, Going 3D

In a previous post we described how to setup a first program to use WebGL with GWT's Elemental,
library, now we will elaborate our code introducing some basic 3-D graphics.

The bad: WebGL has not support for 3D graphics.  "WebGL is a 2D library" (http://games.greggman.com/game/webgl-fundamentals/).

The good: we can provide projections operators to the graphics library and let the vertex shader(s) apply them to the data and we can, quite easily, provide a fragment shader that, using eventually values computed vertex-per-vertex by the vertex shader, will do some basic shading and lighting on  3-D objects.

WebGL tinysample

 Tiny WebGL/Elemental sample

1. Donwload latest GWT  (here) and setup a new project.
    
2. Add to the build path gwt-elemental.jar (is in the unpacked gwt 2.5 archive).
    
3. Add to the gwt.xml file the line  <inherits name='elemental.Elemental'/>.
    
4. Use TestWGLdrawrectangles.java as EntryPoint.
    
5. Compile and enjoy.

WebGL/GWT Fundamentals/Elemental, tiny update, texture loading works on firefox

Just after the publication of our  first post on Elemental and WebGL  (here) we found that the first two  examples we wrote for the post were running on firefox but not the remaining three.
The sample that uses a video as background image requires WebRTC so it is not a surprise, but
the sample that just loads an image and draws it in a canvas and the one with a small rotating cube were supposed to be 'portable'.

Augmented Reality using WebRTC, NyARToolkit, GWT, Elemental, WebGL --- Test 0

What an intense coding day today but finally we had the first working-test :)

               

[Demo HERE, use latest chrome]

Only GWT 2.5/Elemental, no plugins are required. 

Based on NyArToolkit, using WebGL for 3D rendering and WebRTC to access the camera this shows why GWT is a booster :). 
Thanks Google !!

WebGL/GWT Fundamentals/Elemental

A couple of weeks ago we started experimenting with the new "to the metal" library of GWT 2.5 (https://developers.google.com/web-toolkit/articles/elemental) and, being computer graphics enthusiasts, we targeted WebGL as our main focus.

Learning deeply WebGL (WebGL - OpenGL ES 2.0 for the Web) was unfortunately a too time-consuming task four our purposse, so we decided to start translating some basic examples from javascript to GWT/elemental, just to understand how far Elemental will bring us.