javafx on google app engine

Two weeks ago I started to work with python and the django framework in order to deploy a web application in google app engine. (I am really amazed of how fast you can build web applications with python & django – but this will be another post :)

Since JavaFX is my favorite RIA technology I was wondering if we can deploy javafx applications on google app engine. So I started a new project and after 20 minutes it was ready. What surprised me the most is the fact that it is really easy to deploy javafx applications into google app engine. Keep in mind, however, that this is a simple example and I don’t  access the database or other services that are offered by google app engine (maybe I will try that next year ;) .

What you really need to do is to pack your javafx application as an applet and place it under a folder in the google app engine application, declare that folder as a static resource in the app.yaml configuration file and finally use python to write it to the response.

Lets go through it step by step:

1. Create your javafx application and pack it as applet. For this example I will use the SpringAnimation of Josh Marinacci which you can find it here http://javafx.com/samples/SpringAnimation/index.html

2. Create a google app engine application. Instructions on how to create an app engine application can be found here
I have ported the google app engine application into eclipse and it looks something like this:

The most important files are the app.yaml where we need to declare that the javafx folder will serve static files and the mainapp.py python file which will serve our application.

Lets see the app.yaml file

So in the app.yaml configuration file we tell app engine that the application name is javafxtest, we declare the static folder under the handlers and we configure all the urls to be forwarded to the python file mainapp.py

Lets have a look at the python file

The content of this file is straightforward, we just write html code to the response. Note how we refer to the jar file and the folder that servers the static files. In the same folder with the jar file there is also the SpringAnimation_browser.jnlp file, we have to edit this file and change the codebase to the appropriate one (for me it was codebase=”http://localhost:9999/javafx/“) to test the application locally before uploading it, when you are about to upload it, change the codebase to the url of the app engine (for me it is codebase=”http://javafxtest.appspot.com/javafx”)

3. Upload the application in the app engine. The command to upload the application is python appcfg.py update <PROJECT_PATH>\JavaFXonGAE\src enter the email address and the password. You need to create an account if you do not have one.
You can find more info on how to deploy app engine applications here

You can access the application at http://javafxtest.appspot.com/

Resources:
Google app engine: http://code.google.com/appengine/docs/gettingstarted/
JavaFX: http://javafx.com/samples/SpringAnimation/index.html

Advertisements

The 8 ball problem, have a try!

Almost 2 months ago Kasper B. Graversen wrote in his blog about a puzzle that most people with computer science background get it wrong… Here’s how it goes, given 8 identical looking balls where one of them is heavier than the other seven and a scale, identify the one heavier ball using the least number of weightings. You can read about the puzzle at Kasper B. Graversen blog.

In order to simulate this problem I have created a JavaFX game, so before reading the solution have a try at my simulator and try to find the heavier ball.

You can find the code here
Note: You can also download the code from JavaFXExamples at google code.
svn checkout http://javafxexamples.googlecode.com/svn/trunk/ javafxexamples-read-only

Here are few screen shots of the game.

Drag and Drop the ball in the balance, left or right side

When pressing the “Start Balance” button you will see something similar to this screen shot.

Ask the Experts

Ask the Experts is a program from Sun that gives the developers the opportunity to ask questions on Java technology of a specific topic and get answers from the experts of that technology. The program work in the following way:
A topic is published from Sun on a Java technology.
There is one week for the developers to submit their questions.
Sun collects the questions periodically and send them to the experts.
Selected questions and answers are published.

But this is old news, what is new is the upcoming topic:

August 18, 2008 – August 22, 2008
Topic: JavaFX Preview

Experts:

So list your headbreaking questions and hopefully you will get your answers. Keep in mind that your questions should be relavant to the published topic.

The previews topics for 2008 were:
Java SE 6 update 10
JRuby Support on NetBeans IDE 6
Developing and Deploying Java SE-Based Applications in Solaris

Moving around a room

Today was a holiday here in Belgium, I suppose in other countries too, so I had a chance to work a bit more with JavaFX. I have created a simple example where a sphere moves around a room. There are few points to notice about this example:

1. How to make an object move around automatically using Timeline and KeyFrame classes.

2. How to control the movement of your object in the x and y axis.

3. How to use colors that are not listed in the Color class.

4. How to create CustomNode.

5. How to make a 2D object look like 3D.

6. Adding effects to an object.

I am sure you can find -if not all- most of this points in other examples but I have put them all together and I hope it is helpful.

Note: You can download the code from JavaFXExamples at google code.
svn checkout http://javafxexamples.googlecode.com/svn/trunk/ javafxexamples-read-only

Update:
The rotate() method in class Ball has changed so the ball goes to the corners of the Frame, also the speed of the ball is almost the same in all directions as suggested by Ruth in the comment.

Here is a picture of the application:

The code of the application follows:

import javafx.scene.*;
import javafx.scene.*;
import javafx.scene.effect.*;
import javafx.scene.geometry.*;
import javafx.scene.paint.*;
import javafx.application.*;
import javafx.animation.*;
import javafx.input.*;
import javafx.scene.transform.*;
import javafx.scene.image.ImageView;
import javafx.scene.image.Image;

/**
 * @author Omer Haderi
 */

var heightPlus: Integer = 35;
var widthPlus: Integer = 9;

var height: Integer = 400 + heightPlus;
var width: Integer = 400 + widthPlus;
var interval: Integer = 1;
var ball: Ball = Ball {}
/*
 * Point 1. How to make an object move around automatically
 * using Timeline and KeyFrame classes.
 */
var timer : Timeline = Timeline {
    repeatCount: Timeline.INDEFINITE
    keyFrames :
    KeyFrame {
        time : 15ms
        action : function() : Void {
            ball.rotate(interval);
        }
    }
};

Frame {
    stage: Stage {
        // Point 3. How to use colors that are not listed in the Color class.
        fill: Color.web("#2E2E2E")
        content: [Room {}, ball]
    };
    visible: true
    title: "Moving around room!"
    width: width
    height: height

    closeAction : function() {
        java.lang.System.exit( 0 );
    }
}
timer.start();

//Point 4. How to create CustomNodes + implements create() function.
public class Room extends CustomNode {
    public function create(): Node {
        // Point 5. Using basic shapes you can make 2D object look like 3D
        return Group {
            translateX: 0
            translateY: 0
            content: [
                Polyline {
                    points: [ 0,400, 100,300, 300,300, 400,400]
                    strokeWidth: 1
                    stroke: Color.GRAY
                },
                Line {
                    startX : 100, startY : 0
                    endX : 100 endY : 300
                    stroke : Color.GRAY
                },
                Line {
                    startX : 300, startY : 0
                    endX : 300, endY : 300
                    stroke : Color.GRAY
                }
            ]
        }
    }
}

//Point 4. How to create CustomNodes + implements create() function.
public class Ball extends CustomNode {
    public attribute x : Number = 100;
    public attribute y : Number = 300;
    public attribute radius : Number = 15;
    public attribute color : Color = Color.BLUE;

    /*
     * Point 2. How to control the movement of your object in the x and y axis.
     */
    public function rotate(interval: Number) {
        if (x <= 100 and y < 380 ) {
            y += interval / 2; 
            x -= interval / 2; 
            radius += 0.04;
        }
        if (y == 380 and x  300 and y > 300) {
            y -= interval / 2; 
            x -= interval / 2; 
            radius -= 0.04;
        }
        if (y == 300 and x > 100) {x -= interval;}
    }

    public function create(): Node {
        return Circle {
            centerX: bind x
            centerY: bind y
            radius: bind radius
            // Point 6. Adding effects to an object.
            effect: Reflection {
              fraction: 1
              topOpacity: 0.3
            }
            fill: RadialGradient {
                centerX: 200
                centerY: 350
                radius: 200
                proportional: false
                stops: [
                    Stop {offset: 0.0 color: Color.WHITE},
                    Stop {offset: 0.5 color: bind this.color},
                    Stop {offset: 1.0 color: Color.WHITE},
                ]
            }
        };
    }
}

Early Access Edition of JavaFX in Action

Manning Publications have a new JavaFX book in MEAP (early access edition), the author name is Simon Morris. Not surprisingly the title of the book is JavaFX in Action. The discription follows as it is published in manning site:

“Whether you’re writing a desktop app, spinning up a rich web interface, or pushing code to a mobile phone, graphics programming should be easier, and more fun, than it currently is. New technologies and devices—not to mention higher user expectations—have greatly multiplied the complexity level of interface programming. Enter JavaFX.

JavaFX is a set of Java-based rich user interface technologies that sits atop the existing Java Standard and Micro Editions, making current Java packages readily accessible from the JavaFX environment. At its heart is JavaFX Script, an innovative, compiled, domain specific language. JavaFX Script boasts a declarative syntax where the code structure mirrors the structure of the interface. Related UI pieces are kept in one efficient bundle, not strewn across multiple locations. A simple coding model reduces code complexity while increasing productivity. The JavaFX-specific libraries for presentation and animation take advantage of JavaFX Script’s unique language features.

JavaFX in Action is a hands-on tutorial that introduces and explores JavaFX through numerous bite-sized projects. The book provides a solid grounding in the JavaFX syntax and related APIs by showing you how to apply the key features of the JavaFX platform. You’ll absorb the fundamentals of the technology while exploring the possibilities JavaFX open up for your designs.

Author Simon Morris helps you transform variables and operators into bouncing raindrops, brilliant colors, and dancing interface components. Below the chrome, you’ll master techniques to make your applications more responsive and user friendly. You’ll also learn how to interact with your existing Java code so you can give your old apps some new JavaFX sparkle.”

I hope other authors are in contact with publication companies to publish more JavaFX books in NEAR future.

I am looking forward to read it!

JavaFX Preview SDK

JavaFX Preview SDK was launched today, it is a preview version of JavaFX platform. The e-mail I recieved today states the following – among other – “The JavaFX Preview SDK provides web scripters and Java developers with the foundation to quickly and easily build high-impact, immersive RIAs that combine 2D and 3D graphics, high fidelity audio and video and animation, all while leveraging the power and functionality of the existing Java Platform.”

Can’t wait to try it!!!

Check the following links for more info:
(copy paste from the e-mail I received from Sun Community Network)

View www.javafx.com to learn more about the JavaFX technology platform and new JavaFX Preview SDK

Try the new JavaFX Preview SDK – Go to: http://www.javafx.com to download the free JavaFX Preview SDK

Bookmark the JavaFX developer page on SDN: http://java.sun.com/javafx/

Bookmark the new JavaFX blog: http://blogs.sun.com/javafx to stay informed on all the new developments on the JavaFX platform technology and strategy

And the motto is: Think Creative – Be Creative!

Enjoy!

JavaFX Script Book

Two weeks ago I started to experiment with JavaFX Script, I really liked this language, actually I got obsessed – in good way – so I started to look for resources. The only available book in English is JavaFX Script by James Weaver, so  I ordered the book and early this week I finally received the book. There is also another book in German JavaFX by Ralph Steyer. However, this post is for the JavaFX Script book since I do not speak any German.

The book has a tutorial style and a HowTo attitude. Everything is explained in a nice and understandable way, it is short so you can read it very fast, it took me only two days to read it. All the concepts are explained by examples and at the end of each chapter there is an exercise, the author has also created a non trivial application to demonstrate the power of JavaFX. But more important since JavaFX is changing in many areas until the SDK is out, the author modifies the examples and publish them in his blog, by the way you will find a lot of information about JavaFX in that blog.

What you will find in the chapters:

Chapter 1: Introduces the reader to JavaFX Family, very sort chapter no technical details.

Chapter 2: You will find here what are the available tools to write and run JavaFX Script applications and of curse you will find here the famous hello word application.  The chapter continues with the basics of the language,  writing declarative code, using basic classes like Frame and Canvas, creating your own classes, declaring variables and attribute, the bind operator and more.

Chapter 3: As I said before the author has created an application to explain and demonstrate most of the features of the language, so the chapter starts with the introduction of this application. In this chapter you will learn about typical components that you see in every swing application like Buttons, Borders, Menus, Layouts etc.

Chapter 4: This chapter enhances on concepts that you have been exposed in previews chapters. You will learn more about classes, triggers, operations, functions, data types, access modifiers etc. Keep in mind that some of this concepts have changed since the book was written as JavaFX is not out yet.

Chapter 5: 2D graphics is the area that JavaFX Script rocks, so this chapter makes a very good introduction on how to create 2D applications and UIs using JavaFX Script. Again, keep in mind that a lot of things have changed in this area and there are a lot of things added to it too. However, this chapter will help you a lot.

For the examples of this book I suggest you use eclipse and the JavaFX pugin since the eclipse plugin uses an older version of JavaFX Script and the examples run without modification.

However if you are experienced programmer I suggest the NetBeans 6.1 with JavaFX plugin, it is much better than the eclipse one and it also uses the Technology Preview Release of the JavaFX SDK, but you will need to modify the examples or get some of them from the authors blog.

Get a copy of the book and start writing some code ;)

Enjoy!

JavaFX Script test drive… amazing experience

“It is vain to do more with what can be done with less.” The quote of William of Ockham should be the moto of the JavaFX Script technology. This weekend I decided to go for a test drive with the JavaFX script, I am surprised of the simplicity and the power that lies under this technology. It is amazing how fast someone can learn to write useful programs, I recreated the user interface from the SCJD assignment in just one hour where in Swing it took me almost 6 hours. I usually use eclipse for development and there is a plugin for JavaFX but for writting JavaFX I suggest NetBeans 6.0 or 6.1, the plugin for the NetBeans platform is much better.

JavaFX Script is part of JavaFX which was announced by Sun in the JavaOne of May 2007, it’s purpose is to create RIA applications and obviously to compete with Adobe Air and MS Silverlight, the other part pf the JavaFX is JavaFX Mobile which is a java operating system for mobiles devices.

There are plenty of resources to learn JavaFX Scripting, Apress has also published a book on JavaFX Scripting. Check the following links for more information on this cool technology (There are a lot more links for the javafx but I can’t list them all).

Planet JFX

Open JFX

JavaFX @ Sun

James Weaver’s blog