When I first dug into programming with the RIM APIs installed with the Blackberry JDE I ran into quite a few roadblocks that took a while to circumvent. Most stemmed with my unfamiliarity with Java and the standard Java UI toolkits (Swing and AWT). After figuring out how to create and display each of the most interesting fields I figured I might as well document them, provide screenshots, and sample application code to help others like myself.

First off for those out there only interested in the download-able code example — here you go. Simply open the FieldExample.jdw workspace in the JDE editor and click Debug -> Go.
Field Examples source code (.zip)

The following field objects are found in the net.rim.device.api.ui.component package. These objects are built-in time savers for building GUIs for Blackberry applications. One of the key benefits is that it provides your application with a consistent interface experience which guarantees users will feel right at home. Custom widgets are great and can make your application unique but each has a learning curve which could frustrate users. We’ll start with the easiest and move to the more complex.

Quick Reference

• NullField
• SeparatorField
• LabelField
• TextField
• RichTextField
• EditField
• PasswordEditField
• BitmapField
• RadioButtonField
• CheckboxField
• ObjectChoiceField
• NumericChoiceField
• GaugeField
• DateField
• ListField
• ButtonField

Note: The latest API available online is v4.2.1 so all API URLs point there. Please utilize the documentation for the latest version installed with the development kit. It should be available in the start menu alongside the editor. Hopefully RIM will fix this issue soon, sorry for the inconvienience.

NullField

I don’t actually have one of these in the code example since to me they seem completely pointless. I’m sure some programmers rely on them for various weird hacks but for the most part I would avoid them. They are invisible but can have focus.
NullField API reference

SeparatorField

In the standard MainScreen layout it is usually necessary to use these. They are very simple to add and provide a single pixel grey horizontal line on the screen from one side to the other. The general purpose is to separate two sections of UI elements. It is possible to override the drawing behavior and change the color/shape of the line but that is a more advanced topic for a future post.
SeparatorField API reference

add(new SeparatorField());

LabelField

This element is essentially a glorified String which knows how to draw itself on the screen. As with all text based Fields you can change the drawing Font and use it as the Screen title. By default this element does not accept focus but as will all Fields you can change this by setting the Field.FOCUSABLE style.
LabelField API reference

// LabelField variations

add(new LabelField("LabelField"));

add(new LabelField("LabelField 2", 0, -1, Field.FIELD_RIGHT));

LabelField lbl = new LabelField("LabelField 3", 0, -1, Field.FIELD_HCENTER);
Font fnt = this.getFont().derive(Font.BOLD | Font.ITALIC);
lbl.setFont(fnt);
add(lbl);

TextField

This class seems to be abstract since it has no constructors listed in the APIs. You can create a TextField but I would avoid it since from everything I have seen it is not used. It is the parent class of RichTextField and BasicEditField which are the fields you should actually use for selectable and editable text respectively.
TextField API reference

RichTextField

TextFields provide the equivalent of standard TextBox from other platforms. Each letter of the text is focusable and selectable. The RichTextField is not editable by default but can made editable by setting the Field.EDITABLE style. The major benefit of using a RichTextField over other text based fields is the configurability of the text formatting. It is quite cumbersome to setup as you can see by the following code example but is handy.
RichTextField API reference

// RichTextField variations

add(new RichTextField("RichTextField"));

String str[] = new String[] {"RichTextField:", "Value"};
int off[] = new int[] {0, str[0].length(), str[0].length() + str[1].length()};
byte attr[] = new byte[] {0, 1};
FontFamily fontfam[] = FontFamily.getFontFamilies();
Font fon[] = new Font[2];
fon[0] = fontfam[0].getFont(FontFamily.SCALABLE_FONT, 16);
fon[1] = fontfam[1].getFont(FontFamily.SCALABLE_FONT, 18);
add(new RichTextField(str[0] + str[1], off, attr, fon, RichTextField.TEXT_ALIGN_HCENTER));

EditField

Pretty much the equivalent of the LabelField but is focusable, selectable and editable. There are some mechanisms included which allow configuration of how the key presses interact with the field but overall it is very simple.
EditField API reference

// EditField

EditField edit = new EditField("Username: ", "");
add(edit);

PasswordEditField

As you might expect this is exactly the same as the EditField but replaces keystrokes with asterisk’s. Both Fields are children of the BasicEditField class. On the Pearl there is a short delay where it shows the actual character before switching it to the asterisk (another benefit of using the built in Fields). Some of the standard features like cut/copy and the auto manipulators are disabled.
PasswordEditField API reference

// PasswordEditField

PasswordEditField pass = new PasswordEditField("Password: ", "");
add(pass);

BitmapField

The BitmapField allows you to add a Bitmap to your application. It can be aligned just like any other field with Field.FIELD_RIGHT or Field.FIELD_HCENTER and additionally can have border padding. I haven’t looked to far into positioning beyond the standard but I will get into more complex layouts in a future post. The Bitmap class can load PNG, GIF or JPEG images along with raw byte data. If you include an image in the project it is automatically added to the .cod file as a resource which can be loaded using getBitmapResource(). When targeting a resource the path begins at the root project level. I’ve made the image focusable just as an example, I belive you can also turn an image into a button.
BitmapField API reference

// BitmapField
Bitmap img = Bitmap.getBitmapResource("com/examples/img/rainbow.png");
BitmapField bf = new BitmapField(img, BitmapField.FOCUSABLE);
add(bf);

RadioButtonField

There are the implementation of the standard radio selection object where you put a bunch into a group and then the user can select one (and only one) of those options. If you have a fairly small set of options these can be nicer than a choice field (a.k.a. drop-down list) since a user doesn’t have to click into the list and then pick an option. You must place the RadioButtonField objects into a RadioButtonGroup or an error will occur.
RadioButtonField API reference

// RadioButtonField (must be part of group)
RadioButtonGroup rgrp = new RadioButtonGroup();
RadioButtonField radio = new RadioButtonField("Radio Button", rgrp, true);
RadioButtonField radio2 = new RadioButtonField("Radio 2", rgrp, false);
add(radio);
add(radio2);

CheckboxField

Again the standard implementation of a checkbox where each is individual and you can check as many as you want. It appears that you are unable to set the checkbox state to other than on or off. Other platforms generally have a third version representing half checked but it appears the user would need to extend this control to provide that functionality.
CheckboxField API reference

// CheckboxField
CheckboxField chk = new CheckboxField("Checkbox 1", true);
CheckboxField chk2 = new CheckboxField("Checkbox 2", false);
add(chk);
add(chk2);

ObjectChoiceField

The object choice field is essentially what most programmers would know as a drop-down box or list. You provide a list of objects that have the toString() method and it uses that to generate the list the user chooses from. Hitting the space key will roll through the options or the user can click to see all options at one is a list (as seen in the screenshot below). These fields are very handy when you have many options to present or when screen space is at a premium (as it is on most options pages).
ObjectChoiceField API reference

// ObjectChoiceField
String choicestrs[] = {"Opt 1", "Opt 2", "Opt 3"};
ObjectChoiceField choice = new ObjectChoiceField("Object Choice Field: ", choicestrs, 0);
add(choice);

NumericChoiceField

My only guess is that the RIM developers needed lots of choice fields that were numeric. I’m not sure why but that is the only reason to create this very limited field. It simply creates a standard choice field with numeric choices within the range given in the constructor. You can specify a start number, end number and the increment. For the most part I would recommend just using an ObjectChoiceField since it is more flexible.
NumericChoiceField

// NumericChoiceField
NumericChoiceField numeric = new NumericChoiceField("Numeric Choice Field: ", 1, 10, 1, 4);
add(numeric);

GaugeField

The gauge is a very handy field which allows you to show a progress bar style value selector. If the ObjectChoiceField wasn’t enough for you never to use NumericChoiceField then perhaps this field could shoulder the load. It can be a straight uneditable field or it can allow focus and edit so the user can change the value. Overall this control is great and would be handy for anybody working on game programming.
GaugeField API reference

// GaugeField
GaugeField gauge = new GaugeField("Gauge Field: ", 1, 100, 50, Field.EDITABLE | Field.FOCUSABLE);
add(gauge);

DateField

I’ve never actually seen one of these in the standard suite of applications on the blackberry so it took me a bit to figure out how to use it properly. First you get down to the field and click the trackball on it. The appearance of the field will change to be the same as the screenshot below and the date, if not already set, will change to be today. You can then use the trackball to choose the date part and roll through the various dates. When finished click the trackball again to complete. Of all the fields this one has the most configuration options for what I can see. You can choose from many different date input formats and representations, overall it probably needs a full post just for itself.
DateField API reference

// DateField
DateField dte = new DateField("Date Field: ", Long.MIN_VALUE, DateField.DATE);
add(dte);

ListField

This element is what set me on this project in the first place. I was looking to recreate the Status screen under the Wrench icon which has a list with left and right aligned text. I wanted to make an About screen for my game that included device specs like screen size, etc and figured that would be a good way to lay it out. It certainly wasn’t easy to find out how to do it even after I discovered that ListField was the basis for it. The ListFieldCallback is more complicated than I figure is necessary but the most important part is the drawListRow method. drawText defaults to drawing left aligned text which works for the label of the field and if you add the DrawStyle.RIGHT style it will draw right aligned, voila!
ListField API reference

// Listfield (must have a callback)
ListField list = new ListField();
list.setEmptyString("Nothing to see here", DrawStyle.LEFT);
list.setSize(3);
list.setCallback(new TestListCallback());
add(list);

…

final class TestListCallback implements ListFieldCallback {
    public void drawListRow(ListField list, Graphics g, int index, int y, int w) {
        g.drawText("Testing:", 0, y, 0, w);
        g.drawText(String.valueOf(index * 111), 0, y, DrawStyle.RIGHT, w);
    }
    public Object get(ListField listField, int index) {
        return null;
    }
    public int getPreferredWidth(ListField listField) {
        return Graphics.getScreenWidth();
    }
    public int indexOfList(ListField listField, String prefix, int start) {
        return listField.indexOfList(prefix, start);
    }
}

ButtonField

The API had to have a button field and here it is but I don’t feel it is very useful overall. I’ve never seen one in use in the applications on the blackberry but I haven’t dug to deeply. Most applications use a ListField for their buttons instead of actual buttons. The FieldChangeListener is used to catch the click event after it is attached to the ButtonField. You can also attach the listener to any Field since the setChangeListener function is in the parent class so you could easily make a BitmapField clickable using this technique.
ButtonField API reference

// ButtonField
ButtonField btn = new ButtonField("myButton");
btn.setChangeListener(new ButtonListener());
add(btn);

…

final class ButtonListener implements FieldChangeListener {
    public void fieldChanged(Field field, int context) {
        ButtonField btn = (ButtonField) field;
        Status.show("Button pressed: " + btn.getLabel());
    }
}

Recently I became frustrated with the state of free games for the Blackberry platform. Brickbreaker is really hard and choppy on the newer devices so I decided to do something about it. I also have a Blackberry Pearl just sitting at home since my recent upgrade to the Blackberry Curve. So frustration + extra device + time = developement on the Blackberry platform. After wading through some webpages on the developer site and running into more than one snag I decided to document to process in tutorial form. I hope this helps you get starting with the Blackberry JDE. Please feel free to drop questions in the comments or to email me at ahewgill@gmail.com.

Installation

The first step is to install the Blackberry Java Development Environment (JDE) available on from the Blackberry Developer website. (As of this writing the latest version is 4.3.0). You have to register for an account and verify via email in order to download the software which is very annoying. It took them 24 hours to send me the verification link so that I could sign in and begin the download. It is best to download the full JDE rather than the individual pieces in my opinion but this is up to you and your bandwidth constraints.

Running a few samples

Once you have the JDE installed it is time to try out a few of the samples provided. First open the editor by clicking Start -> Programs -> Research in Motion -> Blackberry JDE 4.x.x -> JDE. Once in the editor click File -> Open Workspace… and browse to C:\Program Files\Research in Motion\Blackberry JDE 4.x.x\samples and select samples.jdw.

Let’s run the HelloWorld sample. First thing you must do it set HelloWorld to be the only active project. Click Project -> Set Active Projects… and then in the dialog that appears click Clear All and then check off com_rim_helloworld and click Ok. You are now ready to build and run the project. Click Debug -> Go to build the code and run the simulator (can take time to load so be patient).

The first thing you will notice is that you’re presented with a Blackberry 8120 Pearl in its default configuration. Click the menu key and find HelloWorld in the application list. Click the trackball to run it, voila! To exit the application click the menu key and then click the close option. Simple right! I encourage you to take a look through the code of the various demos at some point to become familiar with the Blackberry APIs.

In the editor click File -> Close Workspace and then close any code windows you might have open on the right before continuing.

Creating your own HelloWorld

Now that you know how to use the editor and run an application it is time to start your first program. I’m going to give you the code but the idea of this section is to learn how to create a new workspace, project, and code file. Click File -> New Workspace… and then give your program a name like MyHelloWorld. In the second box add MyHelloWorld to the end of the creation path leaving off the last backslash. Click Ok and then Yes to the directory creation question. You now have a new workspace in which to put your project.

To create the project simply click Project -> Create New Project… and enter the project name (eg HelloWorld) into the first box. This time you don’t have to mess with the directory, just click Ok.

Now it is time to add a code file to your empty project. On the left click the HelloWorld project in the Files tree view. Now click Project -> Create New File and enter a file name (eg HelloWorld.java) into the first box. In the second box we need to add at least one directory because Java likes to organize things into packages. Add \com\sample to the end of the second box and note that the automatically generated code has the line package com.sample;. You’ll notice this type of thing throughout the Java APIs, this is how classes are organized.

Now that we have a code file it is time to add some code. Replace the tiny little empty class stub with the follow code (I stole this directly from the HelloWorld sample we ran above).

import net.rim.device.api.ui.*;
import net.rim.device.api.ui.component.*;
import net.rim.device.api.ui.container.*;
import net.rim.device.api.system.*;

/*
 * BlackBerry applications that provide a user interface
 * must extend UiApplication.
 */
public class HelloWorld extends UiApplication
{
        public static void main(String[] args)
        {
                //create a new instance of the application
                //and start the application on the event thread
                HelloWorld theApp = new HelloWorld();
                theApp.enterEventDispatcher();
        }

        public HelloWorld()
        {
                //display a new screen
                pushScreen(new HelloWorldScreen());
        }
}

//create a new screen that extends MainScreen, which provides
//default standard behavior for BlackBerry applications
final class HelloWorldScreen extends MainScreen
{
        public HelloWorldScreen()
        {
                //invoke the MainScreen constructor
                super();

                //add a title to the screen
                LabelField title = new LabelField("HelloWorld Sample",
                       LabelField.ELLIPSIS | LabelField.USE_ALL_WIDTH);
                setTitle(title);

                //add the text "Hello World!" to the screen
                add(new RichTextField("Hello World!"));
        }

        //override the onClose() method to display a dialog box to the user
        //with "Goodbye!" when the application is closed
        public boolean onClose()
        {
            Dialog.alert("Goodbye!");
            System.exit(0);
            return true;
        }
}

Click Build -> Build (or hit F7) to make sure it compiles with no errors. Any syntax errors or other messages will appear in the bottom Build window so make sure to look there before assuming everything worked. Now hit Debug -> Go to run the code in the Blackberry simulator.

Setting up the PATH

In order to run the command line tools it is easiest to put the JDE \bin directory into your PATH environment variable. To do this right click on My Computer and click Properties. Now click the Advanced tab and then the Environment Variables button. In the system variables (lower) part find and select the PATH variable and then click the Edit button. Now at the very end of the string add ;C:\Program Files\Research In Motion\BlackBerry JDE 4.3.0\bin (make sure you have the semi-colon at the front). Click Ok, then Ok again and finally one last time.

Installation on a physical device

Once you have an application and have run the simulator a few times you might get the desire to install your app on an actual device. It is fairly easy to do this once you have setup the PATH variable. Open a command window by clicking Start -> Run… type cmd and hit enter. In the little black window go to the location of your application and find the .cod file. Make sure you’ve connected your device with the USB cable and then run the following command.

javaloader -usb load HelloWorld.cod

You’re handset will go white with a spinning hour glass for a few seconds and then back to normal. You will now see the application icon installed on the device. Congratulations you are now a Blackberry developer!

My goal is to create a toggle for the status of a page. For example I have a report and it has the possible status of Open or Closed. The DropDownList contains only the opposite of the current status of the report so when the report is Open the DropDownList contains an empty item (no change) and Closed. Here is the code.

<script runat="server">
  Sub Page_Load()
    If Not Page.IsPostBack Then
      Session("bool") = "Open"
    End If

    ' Setup drop down
    ddlItems.Items.Clear()
    ddlItems.Items.Add("")
    If Not Session("bool") = "Open" Then ddlItems.Items.Add("Open")
    If Not Session("bool") = "Closed" Then ddlItems.Items.Add("Closed")
  End Sub

  Sub Click_Submit(ByVal s As Object, ByVal e As EventArgs)
    If ddlItems.SelectedValue = "Open" Then
      Session("bool") = "Closed"
    ElseIf ddlItems.SelectedValue = "Open" Then
      Session("bool") = "Closed"
    End If
  End Sub
</script>

<html>
<head>
  <title>Drop Down Annoyance</title>
</head>
<body>
  <form runat="server">
  <h1>Drop Down Annoyance</h1>
  <p>Current Status: <%= Session("bool") %></p>
  <p>Update to: <asp:DropDownList ID="ddlItems" runat="server" /></p>
  <asp:Button ID="btnSubmit" Text="Update" OnClick="Click_Submit" runat="server" />
  </form>
</body>
</html>

There are two problems at work here that cause a complete failure of the intended action. Firstly, during Page_Load the Click_Submit event has not yet fired so the Session variable still contains the old value of Open. The code then rebuilds the DropDownList based on the Session variable being unchanged. Secondly, doing the change of the DropDownList resets which option is selected loosing the users input.

We can fix both of these problems with one change to the code. Simply move the DropDownList change to the very last moment right before its declaration. Make sure to add all possible options to the declaration using ListItems, this is a must for it to work.

<%@ Page Language="VB" Debug="True" %>

<script runat="server">

  Sub Page_Load()
    If Not Page.IsPostBack Then
      Session("bool") = "Open"
    End If
  End Sub

  Sub Click_Submit(ByVal s As Object, ByVal e As EventArgs)
    If ddlItems.SelectedValue = "Open" Then
      Session("bool") = "Open"
    ElseIf ddlItems.SelectedValue = "Closed" Then
      Session("bool") = "Closed"
    End If
  End Sub

</script>

<html>
<head>
  <title>Drop Down Annoyance</title>
</head>
<body>
  <form runat="server">
  <h1>Drop Down Annoyance</h1>
  <p>Current Status: <%= Session("bool") %></p>
  <%
    ' Setup drop down
    ddlItems.Items.Clear()
    ddlItems.Items.Add("")
    If Not Session("bool") = "Open" Then ddlItems.Items.Add("Open")
    If Not Session("bool") = "Closed" Then ddlItems.Items.Add("Closed")
  %>
  <p>Update to: <asp:DropDownList ID="ddlItems" runat="server">
    <asp:ListItem Text="" Selected="True" />
    <asp:ListItem Text="Open" />
    <asp:ListItem Text="Closed" />
  </asp:DropDownList></p>
  <asp:Button ID="btnSubmit" Text="Update" OnClick="Click_Submit" runat="server" />
  </form>
</body>
</html>

What is going on here is that when ASP.Net creates the ddlItems object it loads it up with all the ListItems given in the declaration. These items are available throughout the code right up until the point where we Clear and then change the DropDownList. The Session variable has been changed by this time and so everything works out. One very important caveat of this method is that you must not use ddlItems.SelectedIndex since the number of options in the list changes, instead use ddlItems.SelectedValue.

Does anybody else have any novel solutions for working with DropDownList controls?

Today I came across a del.icio.us link from Jonathon Snook about how Mambo will be integrating Cake PHP for version 5.0. I wasn’t able to find a development time line but did come across some other interesting news.

The team has spent a considerable amount of time working on XHTML validation, WCAG 1.0 (Priority 1, 2, and some 3), removal of unnecessary and/or inaccessible JavaScript code, improved usability, plus much more.
from "Baking Mambo" written by Chad Auld

I hope that 4.7 comes out soon and that the work indicated by the preceding quote actually makes a difference. It would be great to see a success for Mambo that causes a cascade of other CMSs to follow suit.

My first article on this blog was the first in the “Dynamic Control Creation” series. I wrote it because I was frustrated with how ASP.Net worked and wanted to share my discoveries/workarounds with other frustrated developers. After a period of time Google picked up my article and I started to receive a decent amount of traffic and some positive feedback. Here at work I use ASP.Net for a majority of my applications and so the blog has continued to focus on it primarily. An interesting thing that I’ve noticed is that site traffic has a very consistent pattern — which I attribute to my focus on ASP.Net. Above you see a graph — from Google Analytics — that shows daily traffic over the last five months. Each valley in the graph made up of the numbers for Saturday and Sunday which are consistently very small compared to the weekday traffic.

I’ve done a few inquiries and looked at a few other sites I have stats for and found that this isn’t all that common. When other sites match my pattern they have a high number of work time surfers coming to their site as I do. I use this loose research to conclude that ASP.Net is widely used in the workplace and much less common for personal/weekend projects. PHP blogs and websites have a very consistent amount of traffic on all days of the week as many weekend programmers surf for information.

What does this signify for ASP.Net? Very few people use it for fun for one thing. I certainly don’t when I don’t have to. In fact I am phasing it out at work slowly too, starting most new projects in PHP — which I’m not really a fan of either. Companies across the globe are buying into Microsoft server products and technologies and forcing it down their employees throats.

How do your traffic statistics look? What is your main theme/topic? Would you prefer to use a different programming language at work? Leave a comment, I’m very interested.

The ASP.Net CheckBox and CheckBoxList control don’t allow for the use of the full W3C HTML standard. For some reason Microsoft decided to implement a reduced functionality version that creates more work for the programmer. Come on Microsoft why can’t you follow even the simplest of standards? In this case it would make coding the .Net framework easier for you not to mention us!

The W3C HTML 4.01 specification specifically states for the value attribute to:

– Specify for radio buttons and checkboxes –
W3C HTML 4.01 Specification - INPUT Element

To me this quote reads as a strong recommendation to specify the value attribute rather than leave it up to the browsers default (generally "On"). Microsoft decided to not even allow the value attribute to be set. They went so far as to have a validation message built into Visual Studio that says:

Attribute ‘Value’ is not a valid attribute of element ‘CheckBox’

If you ignore the warning and run the page, the value attribute is missing. I have even tried circumventing the ASP.Net HTML-izer by adding value to the attributes collection with no success. Microsoft intentionally strips it, so I can only assume they have some reasoning behind this behavior and I imagine they will say something about security in defense.

There is one way to circumvent the behavior but it requires not using ASP.Net controls. Simply insert traditional input type=”checkbox” elements into your page and collect their values using Request.Form.

Sub Page_Load ()
  Dim value As String
  value = Request.Form("chkItem")
End Sub
…
<input type="checkbox" id="chkItem" name="chkItem" />
<label for="chkItem">CheckBox Item Text</label>

I made a big deal out of this issue simply because to me it doesn’t make any sense. You can get around the issue and still use ASP.Net controls but it requires extra coding.

Sub Page_Load ()
  Dim value As String
  If chkItem.Checked Then
    value = "Some Value"
  Else
    value = "Some Other Value"
  End If
End Sub
…
<asp:CheckBox ID="chkItem" Text="CheckBox Item Text" runat="server" />

When using the CheckBoxList control you will notice ASP.Net uses tables to layout the list. To keep it from doing this you simply need to add a few attributes. It should then use much more standards compliant code. I also show how to access which boxes are checked after postback in a CheckBoxList.

Sub Page_Load ()
  ' Find out which boxes were checked
  Dim value As String = ""
  For Each item As ListItem In cblTest.Items
    If item.Selected Then
      value &= item.Value
    End If
  Next
End Sub
…
<asp:CheckBoxList ID="cblList" RepeatLayout="Flow" RepeatDirection="Horizontal" runat="server">
  <asp:ListItem Text="Item 1" Value="1" />
  <asp:ListItem Text="Item 2" Value="2" />
  <asp:ListItem Text="Item 3" Value="3" />
</asp:CheckBoxList>

As always let me know if you have any questions.

The thing that most caught my eye was that Norvig has chosen Python to implement the solution in. The syntax is a little confusing and would probably require a quick read of the reference manual to follow along. The required use of white space really helps to make the code more readable which should help out beginners a fair bit. His choice tells me that there is something to Python that is worth looking into.

Recently I’ve been curious about alternatives to ASP.Net and PHP, one of which is Ruby on Rails (RoR). A lot of people are talking about RoR and there are some clear lines in the sand. A lot of people criticize its problems with memory use and the unorthodox way dynamic pages are served. Others extoll the virtues of the languages syntax, its tight integration with AJAX libraries and its scaffolding technology for rapid development. I’ve not had enough time to formulate an opinion but I can definitely see the validity of points on both sides of the argument.

Python has a web framework similar to RoR called Django. One of its major proponents in the web industry is Jeff Croft who has used it to great success for his blog. Django, much like RoR, has an unorthodox page serving technique which makes it difficult to find a hosting company. From the information I could find via Google it appears that AJAX is also integrated along with scaffolding. It looks like Python is worth taking a look at, time to find somewhere to host Django and test it out. Thanks Mr. Norvig.

To break my hiatus here at dev|sushi I decided to publish something I made for myself while working on a project for my freelance business. The form I am creating requires a country selection box and then later to display country names within the application. Instead of doing a god awful static select box on the form and then storing the full country name in the database, I decided to use the MySQL table approach. Simple and effective and allows you to use a nice space saving char(2) over a varchar(150) in your other tables.

I’ve made the two letter country code the primary key and have the full names as used by PayPal. If anybody can think of other important fields that could be included in an update of this reference let me know. Also, any additions or corrections are appreciated.

246 Country MySQL import plain text (.txt) file
103 Country MySQL import plain text (.txt) file

--
-- Table structure for table `countries`
-- 

CREATE TABLE `countries` (
  `ccode` varchar(2) NOT NULL default '',
  `name` varchar(200) NOT NULL default '',
  PRIMARY KEY  (`ccode`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8;

--
-- Dumping data for table `countries`
-- 

INSERT INTO `countries` VALUES ('AF', 'Afghanistan');
INSERT INTO `countries` VALUES ('AX', 'Åland Islands');
INSERT INTO `countries` VALUES ('AL', 'Albania');
INSERT INTO `countries` VALUES ('DZ', 'Algeria');
INSERT INTO `countries` VALUES ('AS', 'American Samoa');
INSERT INTO `countries` VALUES ('AD', 'Andorra');
INSERT INTO `countries` VALUES ('AO', 'Angola');
INSERT INTO `countries` VALUES ('AI', 'Anguilla');
INSERT INTO `countries` VALUES ('AQ', 'Antarctica');
INSERT INTO `countries` VALUES ('AG', 'Antigua and Barbuda');
INSERT INTO `countries` VALUES ('AR', 'Argentina');
INSERT INTO `countries` VALUES ('AM', 'Armenia');
INSERT INTO `countries` VALUES ('AW', 'Aruba');
INSERT INTO `countries` VALUES ('AU', 'Australia');
INSERT INTO `countries` VALUES ('AT', 'Austria');
INSERT INTO `countries` VALUES ('AZ', 'Azerbaijan');
INSERT INTO `countries` VALUES ('BS', 'Bahamas');
INSERT INTO `countries` VALUES ('BH', 'Bahrain');
INSERT INTO `countries` VALUES ('BD', 'Bangladesh');
INSERT INTO `countries` VALUES ('BB', 'Barbados');
INSERT INTO `countries` VALUES ('BY', 'Belarus');
INSERT INTO `countries` VALUES ('BE', 'Belgium');
INSERT INTO `countries` VALUES ('BZ', 'Belize');
INSERT INTO `countries` VALUES ('BJ', 'Benin');
INSERT INTO `countries` VALUES ('BM', 'Bermuda');
INSERT INTO `countries` VALUES ('BT', 'Bhutan');
INSERT INTO `countries` VALUES ('BO', 'Bolivia');
INSERT INTO `countries` VALUES ('BA', 'Bosnia and Herzegovina');
INSERT INTO `countries` VALUES ('BW', 'Botswana');
INSERT INTO `countries` VALUES ('BV', 'Bouvet Island');
INSERT INTO `countries` VALUES ('BR', 'Brazil');
INSERT INTO `countries` VALUES ('IO', 'British Indian Ocean Territory');
INSERT INTO `countries` VALUES ('BN', 'Brunei Darussalam');
INSERT INTO `countries` VALUES ('BG', 'Bulgaria');
INSERT INTO `countries` VALUES ('BF', 'Burkina Faso');
INSERT INTO `countries` VALUES ('BI', 'Burundi');
INSERT INTO `countries` VALUES ('KH', 'Cambodia');
INSERT INTO `countries` VALUES ('CM', 'Cameroon');
INSERT INTO `countries` VALUES ('CA', 'Canada');
INSERT INTO `countries` VALUES ('CV', 'Cape Verde');
INSERT INTO `countries` VALUES ('KY', 'Cayman Islands');
INSERT INTO `countries` VALUES ('CF', 'Central African Republic');
INSERT INTO `countries` VALUES ('TD', 'Chad');
INSERT INTO `countries` VALUES ('CL', 'Chile');
INSERT INTO `countries` VALUES ('CN', 'China');
INSERT INTO `countries` VALUES ('CX', 'Christmas Island');
INSERT INTO `countries` VALUES ('CC', 'Cocos (Keeling) Islands');
INSERT INTO `countries` VALUES ('CO', 'Colombia');
INSERT INTO `countries` VALUES ('KM', 'Comoros');
INSERT INTO `countries` VALUES ('CG', 'Congo');
INSERT INTO `countries` VALUES ('CD', 'Congo, The Democratic Republic of the');
INSERT INTO `countries` VALUES ('CK', 'Cook Islands');
INSERT INTO `countries` VALUES ('CR', 'Costa Rica');
INSERT INTO `countries` VALUES ('CI', 'Côte D'Ivoire');
INSERT INTO `countries` VALUES ('HR', 'Croatia');
INSERT INTO `countries` VALUES ('CU', 'Cuba');
INSERT INTO `countries` VALUES ('CY', 'Cyprus');
INSERT INTO `countries` VALUES ('CZ', 'Czech Republic');
INSERT INTO `countries` VALUES ('DK', 'Denmark');
INSERT INTO `countries` VALUES ('DJ', 'Djibouti');
INSERT INTO `countries` VALUES ('DM', 'Dominica');
INSERT INTO `countries` VALUES ('DO', 'Dominican Republic');
INSERT INTO `countries` VALUES ('EC', 'Ecuador');
INSERT INTO `countries` VALUES ('EG', 'Egypt');
INSERT INTO `countries` VALUES ('SV', 'El Salvador');
INSERT INTO `countries` VALUES ('GQ', 'Equatorial Guinea');
INSERT INTO `countries` VALUES ('ER', 'Eritrea');
INSERT INTO `countries` VALUES ('EE', 'Estonia');
INSERT INTO `countries` VALUES ('ET', 'Ethiopia');
INSERT INTO `countries` VALUES ('FK', 'Falkland Islands (Malvinas)');
INSERT INTO `countries` VALUES ('FO', 'Faroe Islands');
INSERT INTO `countries` VALUES ('FJ', 'Fiji');
INSERT INTO `countries` VALUES ('FI', 'Finland');
INSERT INTO `countries` VALUES ('FR', 'France');
INSERT INTO `countries` VALUES ('GF', 'French Guiana');
INSERT INTO `countries` VALUES ('PF', 'French Polynesia');
INSERT INTO `countries` VALUES ('TF', 'French Southern Territories');
INSERT INTO `countries` VALUES ('GA', 'Gabon');
INSERT INTO `countries` VALUES ('GM', 'Gambia');
INSERT INTO `countries` VALUES ('GE', 'Georgia');
INSERT INTO `countries` VALUES ('DE', 'Germany');
INSERT INTO `countries` VALUES ('GH', 'Ghana');
INSERT INTO `countries` VALUES ('GI', 'Gibraltar');
INSERT INTO `countries` VALUES ('GR', 'Greece');
INSERT INTO `countries` VALUES ('GL', 'Greenland');
INSERT INTO `countries` VALUES ('GD', 'Grenada');
INSERT INTO `countries` VALUES ('GP', 'Guadeloupe');
INSERT INTO `countries` VALUES ('GU', 'Guam');
INSERT INTO `countries` VALUES ('GT', 'Guatemala');
INSERT INTO `countries` VALUES ('GG', 'Guernsey');
INSERT INTO `countries` VALUES ('GN', 'Guinea');
INSERT INTO `countries` VALUES ('GW', 'Guinea-Bissau');
INSERT INTO `countries` VALUES ('GY', 'Guyana');
INSERT INTO `countries` VALUES ('HT', 'Haiti');
INSERT INTO `countries` VALUES ('HM', 'Heard Island and McDonald Islands');
INSERT INTO `countries` VALUES ('VA', 'Holy See (Vatican City State)');
INSERT INTO `countries` VALUES ('HN', 'Honduras');
INSERT INTO `countries` VALUES ('HK', 'Hong Kong');
INSERT INTO `countries` VALUES ('HU', 'Hungary');
INSERT INTO `countries` VALUES ('IS', 'Iceland');
INSERT INTO `countries` VALUES ('IN', 'India');
INSERT INTO `countries` VALUES ('ID', 'Indonesia');
INSERT INTO `countries` VALUES ('IR', 'Iran, Islamic Republic of');
INSERT INTO `countries` VALUES ('IQ', 'Iraq');
INSERT INTO `countries` VALUES ('IE', 'Ireland');
INSERT INTO `countries` VALUES ('IM', 'Isle of Man');
INSERT INTO `countries` VALUES ('IL', 'Israel');
INSERT INTO `countries` VALUES ('IT', 'Italy');
INSERT INTO `countries` VALUES ('JM', 'Jamaica');
INSERT INTO `countries` VALUES ('JP', 'Japan');
INSERT INTO `countries` VALUES ('JE', 'Jersey');
INSERT INTO `countries` VALUES ('JO', 'Jordan');
INSERT INTO `countries` VALUES ('KZ', 'Kazakhstan');
INSERT INTO `countries` VALUES ('KE', 'Kenya');
INSERT INTO `countries` VALUES ('KI', 'Kiribati');
INSERT INTO `countries` VALUES ('KP', 'Korea, Democratic People's Republic of');
INSERT INTO `countries` VALUES ('KR', 'Korea, Republic of');
INSERT INTO `countries` VALUES ('KW', 'Kuwait');
INSERT INTO `countries` VALUES ('KG', 'Kyrgyzstan');
INSERT INTO `countries` VALUES ('LA', 'Lao People's Democratic Republic');
INSERT INTO `countries` VALUES ('LV', 'Latvia');
INSERT INTO `countries` VALUES ('LB', 'Lebanon');
INSERT INTO `countries` VALUES ('LS', 'Lesotho');
INSERT INTO `countries` VALUES ('LR', 'Liberia');
INSERT INTO `countries` VALUES ('LY', 'Libyan Arab Jamahiriya');
INSERT INTO `countries` VALUES ('LI', 'Liechtenstein');
INSERT INTO `countries` VALUES ('LT', 'Lithuania');
INSERT INTO `countries` VALUES ('LU', 'Luxembourg');
INSERT INTO `countries` VALUES ('MO', 'Macao');
INSERT INTO `countries` VALUES ('MK', 'Macedonia, The Former Yugoslav Republic of');
INSERT INTO `countries` VALUES ('MG', 'Madagascar');
INSERT INTO `countries` VALUES ('MW', 'Malawi');
INSERT INTO `countries` VALUES ('MY', 'Malaysia');
INSERT INTO `countries` VALUES ('MV', 'Maldives');
INSERT INTO `countries` VALUES ('ML', 'Mali');
INSERT INTO `countries` VALUES ('MT', 'Malta');
INSERT INTO `countries` VALUES ('MH', 'Marshall Islands');
INSERT INTO `countries` VALUES ('MQ', 'Martinique');
INSERT INTO `countries` VALUES ('MR', 'Mauritania');
INSERT INTO `countries` VALUES ('MU', 'Mauritius');
INSERT INTO `countries` VALUES ('YT', 'Mayotte');
INSERT INTO `countries` VALUES ('MX', 'Mexico');
INSERT INTO `countries` VALUES ('FM', 'Micronesia, Federated States of');
INSERT INTO `countries` VALUES ('MD', 'Moldova, Republic of');
INSERT INTO `countries` VALUES ('MC', 'Monaco');
INSERT INTO `countries` VALUES ('MN', 'Mongolia');
INSERT INTO `countries` VALUES ('ME', 'Montenegro');
INSERT INTO `countries` VALUES ('MS', 'Montserrat');
INSERT INTO `countries` VALUES ('MA', 'Morocco');
INSERT INTO `countries` VALUES ('MZ', 'Mozambique');
INSERT INTO `countries` VALUES ('MM', 'Myanmar');
INSERT INTO `countries` VALUES ('NA', 'Namibia');
INSERT INTO `countries` VALUES ('NR', 'Nauru');
INSERT INTO `countries` VALUES ('NP', 'Nepal');
INSERT INTO `countries` VALUES ('NL', 'Netherlands');
INSERT INTO `countries` VALUES ('AN', 'Netherlands Antilles');
INSERT INTO `countries` VALUES ('NC', 'New Caledonia');
INSERT INTO `countries` VALUES ('NZ', 'New Zealand');
INSERT INTO `countries` VALUES ('NI', 'Nicaragua');
INSERT INTO `countries` VALUES ('NE', 'Niger');
INSERT INTO `countries` VALUES ('NG', 'Nigeria');
INSERT INTO `countries` VALUES ('NU', 'Niue');
INSERT INTO `countries` VALUES ('NF', 'Norfolk Island');
INSERT INTO `countries` VALUES ('MP', 'Northern Mariana Islands');
INSERT INTO `countries` VALUES ('NO', 'Norway');
INSERT INTO `countries` VALUES ('OM', 'Oman');
INSERT INTO `countries` VALUES ('PK', 'Pakistan');
INSERT INTO `countries` VALUES ('PW', 'Palau');
INSERT INTO `countries` VALUES ('PS', 'Palestinian Territory, Occupied');
INSERT INTO `countries` VALUES ('PA', 'Panama');
INSERT INTO `countries` VALUES ('PG', 'Papua New Guinea');
INSERT INTO `countries` VALUES ('PY', 'Paraguay');
INSERT INTO `countries` VALUES ('PE', 'Peru');
INSERT INTO `countries` VALUES ('PH', 'Philippines');
INSERT INTO `countries` VALUES ('PN', 'Pitcairn');
INSERT INTO `countries` VALUES ('PL', 'Poland');
INSERT INTO `countries` VALUES ('PT', 'Portugal');
INSERT INTO `countries` VALUES ('PR', 'Puerto Rico');
INSERT INTO `countries` VALUES ('QA', 'Qatar');
INSERT INTO `countries` VALUES ('RE', 'Reunion');
INSERT INTO `countries` VALUES ('RO', 'Romania');
INSERT INTO `countries` VALUES ('RU', 'Russian Federation');
INSERT INTO `countries` VALUES ('RW', 'Rwanda');
INSERT INTO `countries` VALUES ('BL', 'Saint Barthélemy');
INSERT INTO `countries` VALUES ('SH', 'Saint Helena');
INSERT INTO `countries` VALUES ('KN', 'Saint Kitts and Nevis');
INSERT INTO `countries` VALUES ('LC', 'Saint Lucia');
INSERT INTO `countries` VALUES ('MF', 'Saint Martin');
INSERT INTO `countries` VALUES ('PM', 'Saint Pierre and Miquelon');
INSERT INTO `countries` VALUES ('VC', 'Saint Vincent and the Grenadines');
INSERT INTO `countries` VALUES ('WS', 'Samoa');
INSERT INTO `countries` VALUES ('SM', 'San Marino');
INSERT INTO `countries` VALUES ('ST', 'Sao Tome and Principe');
INSERT INTO `countries` VALUES ('SA', 'Saudi Arabia');
INSERT INTO `countries` VALUES ('SN', 'Senegal');
INSERT INTO `countries` VALUES ('RS', 'Serbia');
INSERT INTO `countries` VALUES ('SC', 'Seychelles');
INSERT INTO `countries` VALUES ('SL', 'Sierra Leone');
INSERT INTO `countries` VALUES ('SG', 'Singapore');
INSERT INTO `countries` VALUES ('SK', 'Slovakia');
INSERT INTO `countries` VALUES ('SI', 'Slovenia');
INSERT INTO `countries` VALUES ('SB', 'Solomon Islands');
INSERT INTO `countries` VALUES ('SO', 'Somalia');
INSERT INTO `countries` VALUES ('ZA', 'South Africa');
INSERT INTO `countries` VALUES ('GS', 'South Georgia and the South Sandwich Islands');
INSERT INTO `countries` VALUES ('ES', 'Spain');
INSERT INTO `countries` VALUES ('LK', 'Sri Lanka');
INSERT INTO `countries` VALUES ('SD', 'Sudan');
INSERT INTO `countries` VALUES ('SR', 'Suriname');
INSERT INTO `countries` VALUES ('SJ', 'Svalbard and Jan Mayen');
INSERT INTO `countries` VALUES ('SZ', 'Swaziland');
INSERT INTO `countries` VALUES ('SE', 'Sweden');
INSERT INTO `countries` VALUES ('CH', 'Switzerland');
INSERT INTO `countries` VALUES ('SY', 'Syrian Arab Republic');
INSERT INTO `countries` VALUES ('TW', 'Taiwan, Province Of China');
INSERT INTO `countries` VALUES ('TJ', 'Tajikistan');
INSERT INTO `countries` VALUES ('TZ', 'Tanzania, United Republic of');
INSERT INTO `countries` VALUES ('TH', 'Thailand');
INSERT INTO `countries` VALUES ('TL', 'Timor-Leste');
INSERT INTO `countries` VALUES ('TG', 'Togo');
INSERT INTO `countries` VALUES ('TK', 'Tokelau');
INSERT INTO `countries` VALUES ('TO', 'Tonga');
INSERT INTO `countries` VALUES ('TT', 'Trinidad and Tobago');
INSERT INTO `countries` VALUES ('TN', 'Tunisia');
INSERT INTO `countries` VALUES ('TR', 'Turkey');
INSERT INTO `countries` VALUES ('TM', 'Turkmenistan');
INSERT INTO `countries` VALUES ('TC', 'Turks and Caicos Islands');
INSERT INTO `countries` VALUES ('TV', 'Tuvalu');
INSERT INTO `countries` VALUES ('UG', 'Uganda');
INSERT INTO `countries` VALUES ('UA', 'Ukraine');
INSERT INTO `countries` VALUES ('AE', 'United Arab Emirates');
INSERT INTO `countries` VALUES ('GB', 'United Kingdom');
INSERT INTO `countries` VALUES ('US', 'United States');
INSERT INTO `countries` VALUES ('UM', 'United States Minor Outlying Islands');
INSERT INTO `countries` VALUES ('UY', 'Uruguay');
INSERT INTO `countries` VALUES ('UZ', 'Uzbekistan');
INSERT INTO `countries` VALUES ('VU', 'Vanuatu');
INSERT INTO `countries` VALUES ('VE', 'Venezuela');
INSERT INTO `countries` VALUES ('VN', 'Viet Nam');
INSERT INTO `countries` VALUES ('VG', 'Virgin Islands, British');
INSERT INTO `countries` VALUES ('VI', 'Virgin Islands, U.S.');
INSERT INTO `countries` VALUES ('WF', 'Wallis And Futuna');
INSERT INTO `countries` VALUES ('EH', 'Western Sahara');
INSERT INTO `countries` VALUES ('YE', 'Yemen');
INSERT INTO `countries` VALUES ('ZM', 'Zambia');
INSERT INTO `countries` VALUES ('ZW', 'Zimbabwe');

I was browsing through the typography tagged bookmarks on Ma.gnolia.com over the weekend and ran into a video that I found extremely engaging to watch. The video was comprised of lyrics moving on screen set to music; the timing of the words appearing was synchronized to the vocals too great effect. See for yourself.

The Hush Sound - The Lions Roar

I’ve seen stuff like this before on occasion and have always been captivated. TBS did a few self promotional advertisements for Everybody loves Raymond and Seinfeld that used the technique to punctuate well-known series moments. The only unfortunate part was they used Arial Rounded Bold which in my opinion is much overused in their marketing.

A second bookmark on Ma.gnolia.com also caught my eye during my search. It was a kinetic typography video set to Samuel L. Jackson’s amazing speech in Pulp Fiction. At a few points in the video the camera motion didn’t work very well causing the type to be lost but overall it is good. The video has been going around the web and is linked on a few different services including boing boing but check out the author’s site which has some other interesting stuff.

Intonation - Jarratt Moody

Motionographer, one of the linking sites, had a lengthy discussion about how this was ripped off from a video done by MK12 called MachoBox (boring warning). The site is an authority on motion graphics so they would know and I can see why they would say it but I don’t agree that it was “ripped off”. The author of the video is a student at Savannah College of Art and Design (SCAD) and is taking a course on kinetic typography where the instructor likely gave them the reference material to pull from for the project.

BCST 369 Time-based Typography I
This course addresses historical and contemporary typographic design concepts using film and television. Students construct graphic elements and typography for use in projects while addressing issues of motion and dynamic relationships. Prerequisite: GRDS 205.
SCAD Course List

After watching these videos I decided to see if I could find more so I went trolling through YouTube with a search for kinetic typography and didn’t really turn up anything worth watching. I did find a music video by zero 7 that is alright (not sure if it is the official video or not). If you’re wondering where you’ve heard that name before it was probably from their inclusion on the Garden State soundtrack or movie. Have you seen anything out there like this? I’d love some more links to check out.

Most people by now have been to YouTube (now a Google property) at least once to view some stupid video that a friend told them about. Perhaps Diet Coke and Mentos or maybe Starwars Kid, paradied to great effect on Arrested Development. The Digg video section is very popular and usually contains a few gems beside the regular America’s Funniest Home Videos type clips; here are the best of the year. Another video service that is very popular at the moment is Revver; take a look at the their most watched list. They put advertising into the videos and then share the profit 50/50 with the creators. I still don’t know if that is a sustainable business model but it is interesting.

I upgraded to Windows Live Messenger a while ago and have occasionally noticed an interesting video roll across the bottom of the main window. It started with mostly celebrity gossip clips that I suspect were quite unpopular. Next came music video clips and movie trailers which was a step in the right direction. I generally get my movie clips from Apple’s trailer site so this didn’t interest me either. Finally they started to collect user submitted video which was added to the mix.

The player that MSN uses is Window Media Player and not a flash based solution like the majority of other sites. Every time I’ve clicked on a video thus far it has failed during streaming. I have a very good connection and never have any trouble with other services. The problem is that MSN Video doesn’t seem to buffer the video very well. I suspect it is a combination of Windows Media Player and a very strong DRM but I haven’t looked into it. Give it a try yourself and see how it goes. Oh ya, it requires Internet Explorer, Windows Media Player and apparently Macromedia Flash for some reason. Overall I give this product a huge thumbs down; MSN Video sucks.

While researching this article I ran into MSN SoapBox which is yet another video service but this time uses a Flash based player. It is definatly an improvement but has a small set of videos and a poorly designed interface. I noticed bandwidth issues with a video or two from this service too but they are far less frequent. For some reason the site fails to load in FireFox on MacOSX but works fine on FireFox in Windows. Two javascript errors prevent the page from loading but I didn’t spend any time figuring out what specifically was at fault. I am going to reserve judgement on this service for a while but I recommend Microsoft spends a bit of time on it and moves all MSN Video over, including the Live Messenger links. I’m curious to hear the opinions and experiences of others who have tried out this stuff, so leave a comment.