Archive for January, 2009

Super Mario Bros in JavaScript

Friday, January 16th, 2009

Sometimes I stumble upon web development projects that push the envelope of what I previously thought was possible, and today was just such as day. Here is the first 2 levels, plus a level map editor, of a fully functioning port of Super Mario Bros built in JavaScript. Examples like this make AJAX (Asynchronous JavaScript and XML) appear like it will increasingly became a viable alternative to dynamic webpage interactivity once dominated exclusively by Flash.

Super Mario Bros in JavaScript

The botched introduction of Windows 7

Saturday, January 10th, 2009

A few days ago I caught wind that Microsoft would be releasing the beta version of Windows 7 on Friday, January 9 to the public, but would only be allowing 2.5 million downloads. I was running an old version of Windows XP in VirtualBox on my MacBook Pro and thought I would give Windows 7 a try in there as well.

I was working late Thursday night, so when Friday rolled around, I went over to the Windows 7 page and the Window’s Team Blog. Almost immediately the blog went down. The Windows 7 page noted to check back in the afternoon. I went to bed.

Friday afternoon I checked into both sites periodically. The blog would range from down (“Site Busy” error) to barely responsive. By early evening there was a new post saying they would be delaying the roll-out of the beta while they added more resources to handle the demand.

Friday evening the Windows 7 site read:

“Thanks for your interest in the Windows 7 Beta. The volume has been phenomenal—we’re in the process of adding more servers to handle the demand. We’re sorry for the delay and we’ll re-post the Beta as soon as we can ensure a quality download experience.”

I found a direct download link to the installer via this blog post, but still lacked a beta product key, which by late Friday was still not available via official Microsoft routes. I went to bed.

Saturday morning the same message still appeared on Windows 7’s front page, with no other release information. A google search for “Windows 7 key” revealed numerous blog posts showing several ways to manipulate the Microsoft site to release a beta product key. Each was filled with comments throughout the night ranging from the “I got one!” to the later “the links don’t work anymore.” By mid-morning the top results from Google for the product key began to fill with bittorrent information and warez sites. I can only surmise the engineers have gone home for the weekend, so for now I have given up on getting a key and installed the 30-day trial. The beta expires on August 1st, 2009 anyway.

Aside from the hilarity (and possibly tragedy) of imagining this release happening from an actual brick and mortar store, there is the sobering relief that this is not the operating system I depend on for my daily productivity. Cold shivers are sent down my back as I recall the hours of my life sucked away configuring and troubleshooting a Windows XP install a few years back.

Somehow the Mozilla Foundation was able to accomplish more than 8 million downloads (more than 3 times MS’s release volume) in a single 24 hour period last year (Firefox 3 download record official). Granted that was not a completely smooth release either, but at the end of the day it did happen. To Microsoft’s credit, they were no doubt slammed with millions of hits to their website in a very short period of time. But we are talking about the developer of the most widely used operating system in the world, wasn’t that to be expected?

Anyway, here’s a screenshot of it running in VirtualBox. It runs fairly smoothly, although it does not recognize my network adapter, but that is probably a VirtualBox issue, not a Windows 7 issue.

win7-virtual-box

What command-line tools are included in the Flex SDK?

Wednesday, January 7th, 2009

Inside the bin directory of the Flex SDK you will find a long list of command-line tools. The following is an overview of what these tools do:

AIR Development Tools

  • aasdoc – For creating documentation of the classes in an AIR application
  • acompc – For creating a SWC component (a reuseable library of source code for use in other projects) for AIR.
  • adl (not included in the Open Source Flex SDK) – AIR Debug Launcher for debugging AIR applications. Described here.
  • adt (not included in the Open Source Flex SDK) – A utility for packaging an application into an AIR installation file, which you can distribute to your users. An AIR installation file is an archive that contains all the application files.
  • amxmlc – The compiler to use when building AIR applications, invokes the standard Flex mxmlc ActionScript and MXML compiler with an additional parameter, +configname=air.

Flex Development Tools

  • asdoc – For creating documentation of MXML and/or ActionScript classes.
  • compc – For creating SWC component libraries, reusable archives of source code that can be used in other projects. Makes distribution of a library of classes easy.
  • copylocale – Utility for helping with localization in Flex Applications.
  • digest – Used after SWCs have been optimized with optimizer to update SWC digest information.
  • fcsh – The Flex Compiler Shell Utility provides a shell environment for compiling Flex applications, modules, and component libraries that is quicker than using mxmlc or compc.
  • fdb – A command-line based debugger.
  • jvm.config – Allows the custom configuration of the JVM (Java Virtual Machine) for more efficient use by the mxmlc and compc.
  • mxmlc – The standard Flex compiler. Converts ActionScript and/or MXML code into a SWF that can run inside the Flash Player.
  • optimizer – Removes debugging code and unnecessary metadata from a SWC library. This can be run after compc.

Curious about Adobe Open Source? Get started with the Flex SDK on Mac OS X

Tuesday, January 6th, 2009

How about creating a SWF that runs in the Adobe Flash Player without building it in the Flash or Flex Builder authoring environment, using tools that are free and open source? Ever since Adobe made the move from ActionScript 2.0 to 3.0 there has been a gem of a toolkit available that allows precisely that. The Flex SDK (Software Development Kit) allows developers to create SWFs from ActionScript and MXML source code, and with the right setup is not difficult to configure and use.

Housed at Adobe Open Source, the Flex SDK is available in two incarnations through the site:

  • The Open Source Flex SDK containing everything needed to create a functional application using ActionScript and/or MXML and the Flex framework.
  • The Free Adobe Flex 3 SDK containing everything in the Open Source Flex SDK plus additional components such as advanced font encoders, tools for packaging Adobe AIR applications, and the Adobe Flash Player.
  • How to use the Flex SDK

    I have developed an Apache Ant build script that makes—after some configuration—the Flex SDK quite easy to use on Mac OS X. Here’s how to configure it:

    1. Download the latest Flex SDK from Adobe Open Source. Rename the SDK folder flex_sdk_3 and place it in /Applications/ on your hard drive.
    2. Locate Apache Ant on your system. Ant will already be installed if you have installed the Mac OS X Developer Tools (which are an optional install included with every version of OS X) or are running Leopard.

      Open Terminal and type:

      whereis ant

      It should say something like

      /usr/bin/ant

      If Ant is not installed, no path will be shown in Terminal. To install Ant I recommend using MacPorts, an excellent open source utility for managing unix tools on Mac OS X (follow these well written directions for installation). If you are not comfortable using the Terminal, there is a GUI available for MacPorts called Porticus.

    3. Copy the Flex Ant tasks to your Ant installation’s library. These will allow Ant to communicate with the major Flex SDK tools. To copy the tasks, first locate the Ant lib directory, which will be in Ant’s main installation folder. For example on Mac OS X 10.5 it appears at usr/share/ant/lib. Copy /Applications/flex_sdk_3/ant/lib/flexTasks.jar into this directory.
    4. If you are an advanced user and would like to utilize Unit Testing using FlexUnit, Download the FlexUnit Ant Tasks. Place these in the Ant installation’s library folder as well.

      (Note: The project template you will download from my site in the next step includes two SWCs for use with unit testing. For those that may be curious where these came from, here are the links to the original locations: FlexUnit SWC library and FlexUnit Optional SWC library)

    5. Download the Flex SDK example application template from my site. Unzip the archive and place the FlexSDKProjectTemplate folder on your desktop. Open the folder.
    6. Make a copy of build.properties.template and rename it build.properties.
    7. Open the build.properties file you just created and edit the REQUIRED TOOL LOCATIONS section to reflect the path to the Flex SDK, your preferred web browser, and the location of the Flash Player (which you will need to download if you have not already done so).
    8. Using Terminal navigate to the example application template. For example:
      cd Desktop/FlexSDKProjectTemplate/

      And then type the following:

      ant run

      The sample application will launch, typing ant usage will show you what other options are available, such as creating documentation, SWCs, or launching the application in a web browser.

    9. Lastly, to enable the trace() method so that it will work from your code when using the Flash debug player, create a textfile called mm.cfg and fill it with the following:

      TraceOutPutFileName=flashlog.txt
      ErrorReportingEnable=1
      TraceOutputFileEnable=1
      MaxWarnings=0

      Place this file at
      /Library/Application Support/Macromedia/mm.cfg
      . Whenever you have a trace("some text"); statement in your code, it will be written to:

      /Users/[your username]/Library/Preferences/Macromedia/Flash Player/Logs/flashlog.txt

    Please leave comments with any suggestions, problems, questions, etc. Enjoy!

    Troubleshooting

    Problem: Running ASDoc produces: Execute failed: java.io.IOException: /Applications/flex_sdk_3/bin/asdoc: cannot execute

    Solution: This mostly likely means the ASDoc script Ant uses is not set to be executable. Type the following in Terminal:

    cd /Applications/flex_sdk_3/bin/
    chmod +x asdoc

    The first line changes the directory to the one ASDoc resides in. The second line makes ASDoc executable.

    Problem: Running ASDoc produces: exec returned: 255

    Solution: This mostly likely means the ASDoc script (which is just a text file) contains Window-style line endings. These will need to be converted to linux.

    Install dos2unix using MacPorts and type the following in Terminal:

    cd /Applications/flex_sdk_3/bin/
    dos2unix asdoc

    This will turn off the executable bit in the permission tables, so you will have to re-enable that using the instructions in the first solution above.

    Problem: Running ASDoc produces: Could not create toplevel.xml: /Applications/flex_sdk_3/asdoc/templates/asDocHelper: cannot execute

    Solution: This mostly likely means that a helper script used by ASDoc is not set to be executable. Type the following in Terminal:

    cd /Applications/flex_sdk_3/asdoc/templates/
    chmod +x asDocHelper

Teaching at Ohio University’s School of Visual Communication

Tuesday, January 6th, 2009

viscomYesterday kicked off my first class in a course in interactive media (Flash) that I am teaching this quarter at Ohio University’s School of Visual Communication. This is a larger class and will cover more advanced topics than what I taught at Marietta College during the fall, so I am looking forward to the challenges and rewards ahead.