Hello Chumby! (a first widget)


So now that I've got the Chumby it seemed like a good idea to test out creating and uploading my first widget.

This is my first foray into flash development, so for the moment I'm just cribbing from other sources. I'm hoping that as Actionscript is a cousin of Javascript it won't be too tricky to pick up. Though of course much of the learning will be related to the various APIs.

To get started I ran over to Open Source Flash and read the article on setting up a flash project without using the Flash IDE (seeing as I don't want to buy Flash - for now at least). I then followed through from there to the MTASC site and looked at the example tutorial and realised that may be all I needed to get a simple "Hello World" widget working.

So here's the Actionscript I used (saved in Tuto.as):

class Tuto {

    static var app : Tuto;

    function Tuto() {
        _root.createTextField("tf",0,0,0,320,240);
        // write some text into it
        _root.tf.text = "Hello\nChumby!";

        // make the text appear bigger on the screen
        var format = new TextFormat();
        format.size = 64;
        _root.tf.setTextFormat(format);
    }

    // entry point
    static function main(mc) {
        app = new Tuto();
    }
}

Which is based on the code in the MTASC tutorial.

Then with MTASC downloaded and installed in ~/bin/mtasc-1.12-osx/ on my Powerbook, I compiled the code using:

~/bin/mtasc-1.12-osx/mtasc -swf tuto.swf -main -header 320:240:12 Tuto.as

Which creates the SWF file tuto.swf.

Note the -header 320:240:12 option. This is to set the size (320x240) and framerate (12fps) of the resulting SWF. These are the settings as required for the Chumby.

With that done I then tried out tuto.swf in my web-browser to make sure it worked. Next I uploaded the widget via chumby.com (which meant I had to create an 80x60 pixel icon too). I made sure that the widget was set to private when uploading (seeing as only I wanted to see the widget) and then added it to my "development" channel.

Then I selected the "development" channel on my chumby to see the results:

image1

I did run into a little trouble getting the widget to refresh after uploading. It seemed to work sometimes, but in the end I started sshd on the chumby so I could stop and start the control panel (after connecting via ssh):

chumby:~# stop_control_panel
chumby:~# start_control_panel

Which seemed to solve the trick. I'll have to investigate other means of deploying to the chumby when I'm properly developing, but overall it wasn't too much effort going via the chumby site.