DroidScript

DroidZine Comic

2010-05-01T08:15:00.001-07:00

DROIDZINE_BEGIN
page(
    title("PMOCT: R1 P9"),
    author("~annarowlye"),
    image(
"http://fc08.deviantart.net/fs70/f/2010/120/8/f/PMOCT__R1_P9_by_annarowlye.jpg"),
    panel1(
        box(0, 0, 292, 278),
        moves(right(2), down(4))),
    panel2(
        box(292, 0, 252, 279),
        moves(left(1), right(3), down(4))),
    panel3(
        box(538, 0, 262, 271),
        moves(left(2), right(4), down(4))),
    panel4(
        box(0, 281, 408, 443),
        moves(left(3), right(5), down(6))),
    panel5(
        box(406, 282, 396, 439),
        moves(left(4), right(6), down(7))),
    panel6(
        box(4, 725, 390, 496),
        moves(left(5), right(7), up(4))),
    panel7(
        box(404, 731, 396, 489), 
        moves(left(6), up(5))))
DROIDZINE_END

A self generating Android program

2010-04-27T15:12:00.000-07:00

This is a more or less insane DroidScript program I prepared as a demo for a seminar on dynamic languages. The program generates a main activity with a list from which you can launch 10000 generated activities. The theme I had in mind was "Fortune Cards", but all I had time to do was a coloured oval. If I get some more time I will improve the program.

I recommend that you try with a smaller number if you want to run the program, say 100. I wanted to show that it is possible to create a really big program in JavaScript on Android in terms of the size of the scrolling list and the number of activities, and still get good performance.

var DroidScriptFileHandler = Packages.comikit.droidscript.DroidScriptFileHandler;
var Intent = Packages.android.content.Intent;

function createAppScript()
{
    return """function onCreate(bundle)
    {
        var lang = Packages.java.lang;
        var android = Packages.android;
        var widget = Packages.android.widget;

        var listView = new widget.ListView(Activity);
        
        var numberOfCards = 10000;
        var cards = lang.reflect.Array.newInstance(lang.String, numberOfCards);
        for (var i = 0; i < numberOfCards; ++i)
        {
            cards[i] = "Card " + (i + 1);
        }

        var arrayAdapter =
            new widget.ArrayAdapter(Activity,
               android.R.layout.simple_list_item_1,
               cards);

        listView.setAdapter(arrayAdapter);
        
        listView.setOnItemClickListener(function(parent, view, position, id) {
            var Intent = Packages.android.content.Intent;
            var DroidScriptFileHandler = Packages.comikit.droidscript.DroidScriptFileHandler;
            var script = DroidScriptFileHandler.create().readStringFromFileOrUrl(
                "droidscript/generated/Card" + position + ".js");
            var intent = new Intent();
            intent.setClassName(Activity, "comikit.droidscript.DroidScriptActivity");
            intent.putExtra("Script", script);
            Activity.startActivity(intent);
        });

        Activity.setContentView(listView);
    }
    """;
}

function createCardScript()
{
    function random255() { return Math.random() * 255; }
        
    var script = """function onCreate(bundle)
    {
        var lang = Packages.java.lang;
        var android = Packages.android;
        var widget = Packages.android.widget;
        var Morph = Packages.comikit.droidscript.Morph;
        var Paint = Packages.android.graphics.Paint;
        var Color = Packages.android.graphics.Color;
        var RectF = Packages.android.graphics.RectF;
                
        var morph = new Morph(Activity);
        var width = 100;
        var height = 100;
        
        morph.setOnDrawListener(function(canvas)
        {""";
     
     var red = random255();
     var green = random255();
     var blue = random255();
     
     script += """
         var brushColor = Color.rgb(""" 
            + red + ", " + green + ", " + blue + """);
         var paint = new Paint();
         paint.setColor(brushColor);
         paint.setStyle(Paint.Style.FILL);
         paint.setAntiAlias(true);
         canvas.drawOval(
             new RectF(
                 0,
                 0,
                 width,
                 height),
                 paint);""";
                
     script += """});
        
        morph.setOnSizeChangedListener(function(w, h, oldw, oldh)
        {
            width = w;
            height = h;
            morph.invalidate();
        });
        
        Activity.setContentView(morph);
    }""";
    
    return script;
}

function launch(script)
{
    var intent = new Intent();
    intent.setClassName(Activity, "comikit.droidscript.DroidScriptActivity");
    intent.putExtra("Script", script);
    Activity.startActivity(intent);
}

// Create directory
var directory = "droidscript/generated/";
var fileHandler = DroidScriptFileHandler.create();
fileHandler.externalStorageCreateDirectory("droidscript/generated/");
    
// Generate main script
fileHandler.writeStringToFile(directory + "CardApp.js", createAppScript());

// Generate card scripts
for (var i = 0; i < 10000; ++i)
{
    fileHandler.writeStringToFile(
        directory + "Card" + i + ".js", createCardScript());
}

// I suggest you first run the above code in the editor at droidscript.se, 
// then launch the app. And I strongly recommend to try a smaller number 
// of "cards", say 100.

// Launch app
launch(DroidScriptFileHandler.create().readStringFromFileOrUrl(
    "droidscript/generated/CardApp.js"));

Deploying DroidScript Apps

2010-04-23T15:10:00.000-07:00

Have made a first test on how to deploy a DroidScript program as a "native" Android application. The app is a demo that illustrates how comic strip formats on Android. Download info can be found at: http://comikit.se

Will get back with instructions on how the app is built. All files, both JavaScript files and images are included in the app as assets. A tiny Java activity starts the main script.

Multiline strings and using DroidScript with WebKit

2010-04-11T09:09:00.000-07:00

After a walk in the sun, I have uploaded yet a new DroidScript version, have made various enhancements, including multiline strings. JavaScript does not have multiline strings, so I have added that to DroidScript. The syntax is similar to Python, with three quotes to begin and terminate a multiline string.

Below is an example that uses this feature. The example shows how to make a DroidScript app that opens a WebView (a WebKit browser) and displays an HTML document encoded as a multiline string. The example also shows how to use addJavascriptInterface to import Java objects into the WebView, and how to make calls from JavaScript in the HTML document to DroidScript. The JavaScript in the HTML document is executed by the WebKit JavaScript engine, and does not have direct access to the Android class library. The JavaScript code that gets evaluated by DroidScript executes on Rhino, and can therefore use the Android API directly.

The short link to this script is: http://bit.ly/bL1heJ

DROIDSCRIPT_BEGIN
function onCreate(bubble)
{
    var WebView = Packages.android.webkit.WebView;

    var webview = new WebView(Activity);
    webview.getSettings().setJavaScriptEnabled(true);
    webview.addJavascriptInterface(Activity, "activity");
    Activity.setContentView(webview);    
    
    var content =
    """<html>
        <body>
            <script>
            function showToast(message) {
                activity.eval(
                    "var Toast = Packages.android.widget.Toast;" +
                    "Toast.makeText(Activity, '" + message + "', " +
                    "Toast.LENGTH_SHORT).show();"); }
            </script>
            <h1>Take the pill</h1>
            <input 
                type="button" 
                value="Take pill" 
                onclick="showToast('You have taken the red pill!')">
        </body>
    </html>""";
    
    webview.loadData(content, "text/html", "utf-8");
}
DROIDSCRIPT_END

Now it is easy to distribute DroidScript scripts

2010-04-11T03:52:00.000-07:00

I have uploaded a new version of DroidScript that has a feature for easily distributing DroidScript scripts. With a new pair of tags, you can publish scripts on any web page (like this blog) and open and run them from the DroidScript app on your Android device.

It is as easy as opening a web page, and that said, this is also an easy way of distributing malicious code.

BE VERY CAREFUL WITH WHAT YOU DOWNLOAD!

I will say this again, because it is important:

BE VERY CAREFUL WITH WHAT YOU DOWNLOAD!

At present, DroidScript has the following permissions:

android.permission.INTERNET
android.permission.WRITE_EXTERNAL_STORAGE
android.permission.CAMERA
android.permission.ACCESS_FINE_LOCATION

So a script could erase your files, mess with your camera, and so on.

That said, I think this is a really cool feature, and it shows how powerful dynamic languages are when it comes to ease of distributing and running programs. And with improved security handling, the risks of distributing scripts could be reduced.

I do like the openness of the web, and native apps are sadly not open for inspection and modification by the user. With DroidScript, the script is always available for preview and modification in the editor on the device before you decide to run it. Still, it is a big security risk to be open, but so much more fun. It is like life, a life without risk taking is no life.

DroidScript is an ongoing experiment, and it is possible to package a program in alternative ways. You could, for instance, embed DroidScript in a native Android app, store JavaScript files in the application space (as resources or files), and no one would be able to tamper with the scripts or download new scripts, and the user would not even notice that the app is written in JavaScript.

Now for an example:

DROIDSCRIPT_BEGIN
function onCreate(bubble)
{
    var Button = Packages.android.widget.Button;
    var Color = Packages.android.graphics.Color;
    var Typeface = Packages.android.graphics.Typeface;

    var numberOfClicks = 0;
    var font = Typeface.create(Typeface.SANS_SERIF, Typeface.BOLD);
    var button = new Button(Activity);
    button.setText("Hello World!");
    button.setTypeface(font);
    button.setTextSize(26);
    button.setBackgroundColor(Color.rgb(0, 0, 64));
    button.setTextColor(Color.rgb(255, 255, 255));
    button.setOnClickListener(function () {
        ++numberOfClicks;
        button.setText(
            "You Clicked Me" +
            (1 == numberOfClicks ? "!" : 
                " " + numberOfClicks + " Times!")); })
    Activity.setContentView(button);
}
DROIDSCRIPT_END

How to run the above program:

Download the latest DroidScript app (instructions are found here)
Start the app and select "Open script" in the options menu
Enter the short url to this page: http://bit.ly/9kFqEi
Then press "Run Activity"

(The short url is quicker to type on the device)

DroidScript will find the code between the tags and filter out the rest of the web page. This makes it very easy to publish scripts embedded on blogs and other web pages. You can of course also put your script in a plain text file and upload that to the web, then you will not need the begin and end tags.

Since a script can open images over the internet, and open other scripts, it is possible to create truly dynamic applications that have the capabilities of native Android applications and the dynamic flow and instant access of web pages.

Android CameraPreview sample in JavaScript

2010-04-11T02:19:00.000-07:00

Here is a DroidScript program that displays preview images from the camera. I have taken the CameraPreview sample program and rewritten it in JavaScript.

Beware! This program runs fine on Motorola Droid :-) but crashes on Nexus One :-(

Update: @JonasBeckman hinted that uncommenting camera.setParameters(parameters); when running on Nexus One does the trick. I tested and it works fine! :-)

To run this program, open the DroidScript app, and select the "Open script" menu item, and enter the short url to this blog post: http://bit.ly/aB2fik

DroidScript will recognise the DROIDSCRIPT_BEGIN and DROIDSCRIPT_END tags and extract the code between the tags. Then press the "Run Activity" button to run the program.

Note that these tags can occur only once on a page. If there are multiple occurrences, the text between the first pair will be used. Therefore, I have escaped the underscore character in the tags above, so that they will not be interpreted as containing DroidScript code.

DROIDSCRIPT_BEGIN
var Camera = Packages.android.hardware.Camera;
var SurfaceHolder = Packages.android.view.SurfaceHolder;
var SurfaceView = Packages.android.view.SurfaceView;
var Window = Packages.android.view.Window;

function onCreate(bundle)
{
    Activity.requestWindowFeature(Window.FEATURE_NO_TITLE);
    var preview = createPreviewSurface();
    Activity.setContentView(preview.getSurfaceView());
}

function createPreviewSurface()
{
    var camera = null;
    var surface = new SurfaceView(Activity);
    
    var object = {
        
        getSurfaceView : function() {
            return surface; },
            
        surfaceCreated : function(holder) {
            camera = Camera.open();
            try {
                camera.setPreviewDisplay(holder); }
            catch (exception) {
                camera.release();
                camera = null; } },
                
        surfaceDestroyed : function(holder) {
            camera.stopPreview();
            camera.release();
            camera = null; },
            
        surfaceChanged : function(holder, format, w, h) {
            var parameters = camera.getParameters();
            parameters.setPreviewSize(w, h);
            // Causes camera to fail on Nexus One
            //camera.setParameters(parameters);
            camera.startPreview(); }
    };
 
    var callback = createInstance(
        Packages.android.view.SurfaceHolder.Callback, 
        object);
    surface.getHolder().addCallback(callback);
    surface.getHolder().setType(
        SurfaceHolder.SURFACE_TYPE_PUSH_BUFFERS);

    return object;
}

// Create an instance of a Java interface.
//   javaInterface - the interface type
//   object - JS object that will receive messages
//     sent to the instance
function createInstance(javaInterface, object)
{
    // Convert a Java array to a JavaScript array
    function javaArrayToJsArray(javaArray)
    {
        var jsArray = [];
        for (var i = 0; i < javaArray.length; ++i) {
            jsArray[i] = javaArray[i];
        }
        return jsArray;
    }
    
    var lang = Packages.java.lang;
    var interfaces = 
        lang.reflect.Array.newInstance(lang.Class, 1);
    interfaces[0] = javaInterface;
    var obj = lang.reflect.Proxy.newProxyInstance(
        lang.ClassLoader.getSystemClassLoader(),
        interfaces,
        // Note, args is a Java array.
        function(proxy, method, args) {
            // Convert Java array to JavaScript array
            return object[method.getName()].apply(
                null,
                javaArrayToJsArray(args));
        });
    return obj;
}
DROIDSCRIPT_END

Version 4 of DroidScript

2010-04-05T11:17:00.000-07:00

Uploaded version 4 of DroidScript today, including new example programs! (I use plain sequential version numbers; version 4 is very much in an early experimental stage!) Download info can be found here: http://droidscript.blogspot.com/2010/03/droidscript-getting-started.html

If you already have DroidScript installed, you need to manually update the JavaScript files on the SD-card. One method is to delete the JavaScript files in the droidscript folder on the SD-card; if they are missing when the app started, they will be downloaded automatically. An easier method is to open DroidScript, press the menu button on the device, and select "Update". That will download and overwrite the JavaScript files in the droidscript folder with the latest versions. Then restart DroidScript.

This whole process can of course be improved. One idea is to make DroidScript check the update server for a new version number, and update the JavaScript code if needed. Admittedly, it is a bit of a hazzle to keep track of updating the actual app and the JavaScript files on the SD-card. But there is also a reason for making manual updates; the user might have modified the JavaScript code, and may wish to save the modifications before updating.

The motivation for putting JavaScript files on the SD-card is highest possible transparency. A user always has access to the content of the card, and can easily inspect and edit the JavaScript code if she wishes. This way, DroidScript is much more malleable and exploration-friendly, compared to putting the code hidden away in the application's private space. The drawback is that files might be messed up, and if you swap SD-cards the files are not there anymore (buy then they will be dynamically downloaded).

New in this version is improved error handling, a new view class for writing graphical applications, and more examples programs.

Errors are now trapped in a more robust way, and the application does no longer shut down in case of runtime JavaScript errors. The notification bar is used to display JavaScript errors. It is a big advantage that notifications are decoupled from the application, so if the application becomes faulty, it is still possible to retrieve the error message form the notification bar. Errors are also logged to the logcat output.

A problem with scripting Java from JavaScript on Android is that there is no support for generating Dalvik byte code, and this is needed for subclassing. This means that subclassing of Java classes in JavaScript is not possible. Since the Android API relies heavily on subclassing in certain areas, this sort of spoils the party. Subclassing View to create your own view class with custom drawing, is impossible, for example. However, a nice solution is to make a subclass of View in Java that has pluggable listeners for drawing and other events that normally would be handled through subclassing. This way, we also get a much nice design that allows for runtime configuration of for example the drawing behaviour (subclassing is one nasty compile-time bound relation that I would be happy to avoid and replace by delegation).

The new DroidScript version includes a Java class called Morph that has pluggable listeners for drawing and interaction behaviours, which makes it possible to write JavaScript apps with custom graphical rendering, such as games and painting programs. The name "Morph" means "Shape" and is taken from Self/Squeak; but the DroidScript Morph is nowhere nearly as powerful as a Squeak morph, but it might be one day :-)

There are two new example programs included with the version of DroidScript, a program that displays random colours when the screen is pressed, and a painting program. The speed of the painting program shows that JavaScript applications can run at satisfactory speed on Android (at least on a Nexus One).

Here is the source code of the example programs:
http://github.com/divineprog/droidscript/blob/master/javascript/Colors.js
http://github.com/divineprog/droidscript/blob/master/javascript/Paint.js

The example programs are included in the latest version of DroidScript, so you can run them directly on the device, and you can also copy and paste them into the DroidScript Live Editor and run them from there.

Getting Started with DroidScript

2010-03-28T06:49:00.000-07:00

DroidScript is a tool for programming Android applications in JavaScript.

Start by installing the DroidScript app on your device. Scan this QR-code to install the app (use Barcode Scanner by ZXing, which is available at Android Market):

Alternatively, download using this link (works in the browser on the device):
http://droidscript.se/DroidScript.apk

You can edit and run scripts on the device from a web browser with the DroidScript Live Editor: http://droidscript.se

The Live Editor contains some sample code and instructions to get you started.

You can also edit scripts directly on the device, but this is not yet fully developed; the editor is very primitive and you cannot save scripts, for example.

If you want to constribute to the project or browse the source code for the DroidScript app, the code is at GitHub: http://github.com/divineprog/droidscript

When you update the DroidScript app, you will also need to update the associated script files. Do this by seleting "Update" in the options menu. Then restart the DroidScript app.

Contact info:
Email: mikael.kindborg at gmail
Twitter: http://twitter.com/divineprog

Custom ListAdapter in JavaScript on Android using a Java Proxy

2010-03-21T14:18:00.000-07:00

At present, it is a big hazzle to program Android in purely interpreted languages, like JavaScript on the Mozilla Rhino engine. The catch is of course that Dalvik byte code generation is not (yet) implemented by any dynamic language engine, including Rhino. Still, it is possible to do all sorts of cool things with JavaScript on Android.

Today (which means Sunday, and in Stockholm is has been snowing!), I have been working on using Java Proxy as a way to dynamically implement interfaces in JavaScript. My need for this arose from wanting to implement a custom ListAdapter for use with a ListView (see previous post for some more background to the issues involved). It would be possible to implement everything that is needed in Java, but it is much more fun to stretch the limits of what is possible to do in JavaScript. And it is a great learning experience.

The interactive web based DroidScript editor has been invaluable when experimenting with JavaScript on Android. I have my phone next to the computer, edit and run code from Firefox on the computer, and interact with the result on the phone. This is a quite nice way to work. Error handling still leaves much more to wish for in DroidScript. It is sometimes tricky to find errors, and hooking up with a USB cable and using logcat is a big help to track down exceptions. Good, readable error reporting is an important area to improve upon. But, since you typically evaluate small pieces of code when developing incrementally, it is usually easy to spot errors.

The following is a complete example that can run from the DroidScript editor. Make sure the DroidScript server is running on the device, paste the code into the editor, select it, and then click "Run as Activity".

function onCreate(bundle)
{
    var lang = Packages.java.lang;
    var android = Packages.android;
    var widget = Packages.android.widget;
    var Typeface = Packages.android.graphics.Typeface;
    var Color = Packages.android.graphics.Color;
    
    var listView = new widget.ListView(Activity);
    var fruits  = ["Lemon", "Peach", "Plum"];
    
    listView.setAdapter(createListViewArrayAdapter(
        fruits,
        function(position, convertView) {
            var view = convertView;
            if (null == convertView) {
                view = new widget.TextView(Activity);
                view.setPadding(25, 15, 25, 15);
                var font = Typeface.create(
                    Typeface.SANS_SERIF, 
                    Typeface.BOLD);
                view.setTypeface(font);
                view.setTextSize(26);
                view.setBackgroundColor(Color.rgb(0, 0, 64));
                view.setTextColor(Color.rgb(255, 255, 255));
                // It is also possible to put actions on list items
                //view.setOnClickListener(function () {
                //    view.setText("You Clicked Me!"); })
            }
            view.setText(fruits[position]);
            return view; }));
    listView.setOnItemClickListener(function(parent, view, position, id) {
        showMessage("You picked: " + fruits[position]); });
    
    Activity.setContentView(listView);
}

// Display a Toast on the device
function showMessage(message)
{
    var Toast = Packages.android.widget.Toast;
    Toast.makeText(
        Activity,
        message,
        Toast.LENGTH_LONG).show();
}

// Convert a Java array to a JavaScript array
function javaArrayToJsArray(javaArray)
{
    var jsArray = [];
    for (i = 0; i < javaArray.length; ++i) {
        jsArray[i] = javaArray[i];
    }
    return jsArray;
}

// Create an instance of a Java interface
// javaInterface - the interface type
// handler - object that will be sent messages to the instance
function createInstance(javaInterface, handler)
{
    var lang = Packages.java.lang;
    var interfaces = lang.reflect.Array.newInstance(lang.Class, 1);
    interfaces[0] = javaInterface;
    var obj = lang.reflect.Proxy.newProxyInstance(
        lang.ClassLoader.getSystemClassLoader(),
        interfaces,
        // Note, args is a Java array.
        function(proxy, method, args) {
            // Convert Java array to JavaScript array
            return handler[method.getName()].apply(
                null,
                javaArrayToJsArray(args));
        });
    return obj;
}

// Creates a custom ListAdapter
// items - a JavaScript array
// viewFun - a function called to handle the creation 
// of views for the elements in the list
function createListViewArrayAdapter(items, viewFun)
{
    var lang = Packages.java.lang;
    var widget = Packages.android.widget;
    var observer;
    
    var handler = {
        areAllItemsEnabled : function() {
            return lang.Boolean.TRUE; },
        isEnabled : function(position) {
            return lang.Boolean.TRUE; },
        getCount : function() {
            return lang.Integer.valueOf(items.length); },
        getItem : function(position) {
            return items[position]; },
        getItemId : function(position) {
            return lang.Long.valueOf(position); },
        getItemViewType : function(position) {
            return lang.Integer.valueOf(0); },
        getView : function(position, convertView, parent) {
            return viewFun(position, convertView); },
        getViewTypeCount : function(position) {
            return lang.Integer.valueOf(1); },
        hasStableIds : function(position) {
            return true; },
        isEmpty : function(position) {
            return 0 == items.length; },
        // We can only have one observer!
        registerDataSetObserver : function(theObserver) {
            observer = theObserver; },
        unregisterDataSetObserver : function(theObserver) {
            observer = null; },
    };
    
    return createInstance(Packages.android.widget.ListAdapter, handler);
}

How to make a simple ListView

2010-03-21T06:49:00.000-07:00

I have been frustrated about the fact that all of the handy adapter classes used with ListView take a resource id for the view to be used to present list items. When scripting Android, you typically do not create the layout using XML, rather you create widgets programatically. Why not put in a constructor that accepts a view factory rather than a resource id? (Note that it is perfectly possible to create a DSL for defining user interfaces in a declarative way in JavaScript, to replace XML definitions. By the way, anyone knows if there is a way to dynamically manipulate and update XML definitions on the device?).

Now, while experimenting with creating a custom ListAdapter in JavaScript, I discovered that there are predefined resources that can be used to specify the type of list view item. Very handy! (Still miss a constructor that accepts a view factory!)

Here is an example of how to create a sample application that displays a simple list view. Start the server in the DroidScript app, go to http://droidscript.se and enter the ip-address of the device, then paste the function below into the editor, select it, and click "Run as Activity", which will run the selected code as a new activity.

function onCreate(bundle)
{
    var lang = Packages.java.lang;
    var android = Packages.android;
    var widget = Packages.android.widget;

    var listView = new widget.ListView(Activity);

    var fruits = lang.reflect.Array.newInstance(lang.String, 3);
    fruits[0] = "Lemon";
    fruits[1] = "Peach";
    fruits[2] = "Plum";

    var arrayAdapter =
        new widget.ArrayAdapter(Activity,
           android.R.layout.simple_list_item_1,
           fruits);

    listView.setAdapter(arrayAdapter);

    Activity.setContentView(listView);
}

DroidScript for Android 1.6

2010-03-14T13:59:00.000-07:00

I have changed the version requirements so that DroidScript now should work with Android 1.6. Get the new version at http://droidscript.se

Also made some updates of the repository at http://github.com/divineprog/droidscript, the README-file is now up-to-date.

An example on the use of closures in JavaScript on Android

2010-02-26T15:00:00.000-08:00

Here is a code example that illustrates the use of closures in JavaScript in an Android program. The variable n is introduced in the local scope of the function createButton, and is used in the closure for the button's click listener. Each button will have its own counter value, because each function invocation of createButton allocates its own space for the local variable n.

function createButton() {
    var n = 1;
    var Graphics = Packages.android.graphics;
    var font = Graphics.Typeface.create(
        Graphics.Typeface.SANS_SERIF,
        Graphics.Typeface.BOLD);
    var button = new Packages.android.widget.Button(Activity);
    button.setTypeface(font);
    button.setTextSize(26);
    button.setBackgroundColor(Graphics.Color.rgb(0, 0, 64));
    button.setTextColor(Graphics.Color.rgb(255, 255, 255));
    button.setText("How many times can you click me?");
    button.setOnClickListener(function () {
        button.setText("You clicked me " + n + " times!");
        n = n + 1;
    });
    return button;
}

var layout = new Packages.android.widget.LinearLayout(Activity);
layout.setOrientation(Widget.LinearLayout.VERTICAL);
layout.addView(createButton());
layout.addView(createButton());
layout.addView(createButton());
Activity.setContentView(layout);

More code examples

2010-02-21T13:41:00.000-08:00

There is a new update of DroidScript available at http://droidscript.se

I have also included the following code examples in the editor:

// Toast example program. Select this code and click Run.
var Toast = Packages.android.widget.Toast;
Toast.makeText(
    Activity,
    "Hello World!",
    Toast.LENGTH_SHORT).show();
   
// Select this code and click Run. It will create a button in
// the server activity.
var Widget = Packages.android.widget;
var button = new Widget.Button(Activity);
button.setText("Hello World!");
button.setOnClickListener(function () {
    button.setText("You Clicked Me!"); })
Activity.setContentView(button);

// You can also run code as a new Activity. Select this code
// and click "Run as Activity". A new DroidScript activity will
// be created, and the onCreate function is called.
function onCreate(icicle)
{
    var Widget = Packages.android.widget;
    var Graphics = Packages.android.graphics;
    var font = Graphics.Typeface.create(
        Graphics.Typeface.SANS_SERIF,
        Graphics.Typeface.BOLD);
    var button = new Widget.Button(Activity);
    button.setText("Hello World!");
    button.setTypeface(font);
    button.setTextSize(26);
    button.setBackgroundColor(Graphics.Color.rgb(0, 0, 64));
    button.setTextColor(Graphics.Color.rgb(255, 255, 255));
    button.setOnClickListener(function () {
        button.setText("You Clicked Me!"); })
    Activity.setContentView(button);
}

DroidScript GET requests

2010-02-21T12:26:00.000-08:00

Besides using the editor at http://droidscript.se you can also enter urls directly in the brower. There are some encoding issues, but its an entertaining demonstration.

Start the DroidScript application on the device, press menu button, and select "Start server". The actual ip-address of the device is displayed on the screen; in the following examples it is 192.168.0.100. DroidScript listens on port 4042. Then open a web browser and enter the following urls (note that we must encode + as %2B):

http://192.168.0.100:4042/eval/2*3
http://192.168.0.100:4042/eval/2%2B3
http://192.168.0.100:4042/eval/function twice(n) { return n * 2; }
http://192.168.0.100:4042/eval/twice(33)
http://192.168.0.100:4042/hello

Java proxy classes in JavaScript on Android

2010-02-20T16:59:00.000-08:00

The problem with running alternative (dynamic) languages on Android is that the Dalvik byte code format is different from the standard JVM format. Thus languages that do on-the-fly byte code generation won't work out of the box on Android. This also makes things more fun, since you can't just use the old and tired stuff you have always used. Room for new concepts!

Rhino, Mozilla's JavaScript engine, plays nicely on Android since it can run in interpreted-only-mode. Thus no need for generating Dalvik byte codes. But, to my great disappointment, it is not possible do subclassing in JavaScript on Android, because here byte code generation is required. It is not possible (as I understand it) to "hook into" the method call when Dalvik calls our Java object without having a proper Java class for the object.

Furthermore, it turns out that implementing interfaces cannot be done in Rhino without code generation. Interfaces that contain only one method, work fine, however. You just specify a JavaScript function object in place of the interface implementation. But with interfaces that have more than one method, you are toast (hehe, nice Android joke there). I have not yet got a good grasp of the inner workings of Rhino, but I am sure that this can be implemented using Java's Proxy classes, either in Rhino, or in the DroidScript app, or even in JavaScript.

I did some experimentation that kept me awake (it is now two a clock in the night here in Stockholm), and here is the result, in JavaScript. A particular tricky case was to make a proxy for an "inner" interface in JavaScript (whatever that is called in Java lingo). Of course, this could be done in Java and called from JavaScript, but it is more fun to use JavaScript all the way ;-)

var Lang = Packages.java.lang;
var proxy = Lang.reflect.Proxy.getProxyClass(
    Lang.ClassLoader.getSystemClassLoader(), 
    Packages.android.view.View.OnClickListener);

And here we have our proxy class! Will continue to research this tomorrow and during the week.

Sleep well :-)

DroidScript - Live JavaScript on Android

2010-02-20T14:40:00.000-08:00

I have spent the day with getting the DroidScript web based editor up and running. It is available here: http://droidscript.se (droidscript.org and droidscript.net will also work in the near future). The site has a QR-Code you can use for downloading and installing the app on your device.

The source code is on GitHub at http://github.com/divineprog/droidscript. The application consists of a core part written in Java, and the user interface which is written in JavaScript ("eat your own dog food!"). There are still many rough edges, but the project is great fun. I think this style of programming, directly on the device, has several benefits. It opens up for exploration, and incremental development. I envision that this style can be great fun for young people who want to learn to program on their Android device.

The JavaScript code of the app is in the droidscript directory on the sdcard. This means that you can edit these files and modify the program without having to install the Android SDK. Of course you can also write your own programs. Unfurtunately, it seems as if you cannot have the device connected and mounted via USB and at the same time have apps that access the sdcard. That would have been nice, because then you could have had the JavaScript code open in an editor on the computer and the program running while editing it. But the web based editor solve this problem.

The web based editor sends in requests to a tiny web server that is running on the device. It accepts PUT and GET requests with JavaScript as content. The code is evaluated by the Mozilla Rhino JavaScript engine, and the result is sent back to the web browser (including error messages). With this tool, it is possible to incrementally create the user interface and other components of a program. (I should make a YouTube video that shows how to do this!)

Next step is to implement missing parts and to make the app more stable and also to make error handling more roubust. Regarding other languages, besides JavaScript, it would be nice to make the interpreter pluggable. BeanShell, for example, would be rather easy to integrate into the program. Ruby would also be very nice to have.

First version of DroidScript - JavaScript for Android

2010-02-14T23:06:00.000-08:00

The first version of DroidScript is now on GitHub: http://github.com/divineprog/droidscript

DroidScript - new name for RhinoDroid

2010-02-06T06:59:00.000-08:00

I have decided to use the name DroidScript for the JavaScript Android tool I am developing. For now, I am blogging at divineprogrammer.blogspot.com, and twitter at @divineprog

I will use this blog to publish DroidScript documentation, code examples, and other related stuff.

DroidScript was previosly called RhinoDroid, as a tribute to the Rhino JavaScript interpreter/compiler developed by Mozilla, but I decided that DroidScript is a more on-the-spot name.