Facebook App Starter kit

Posted on February 27, 2011 by Matt

In preparation for the March 10th change I’ve been porting a lot of old fbml apps over to iframe. I noticed that I was copying a lot of the same code every time. So I’ve packaged all of that starter code into a simple project.

The Facebook App Starter Kit automatically loads the Facebook Javascript API and jQuery 1.4.2. It includes:

  • starter javascript file with sample functions to perform an ajax request, do a wall post, request extended permissions, and re-size the facebook iframe around the page content.
  • Eric Meyer’s CSS Reset
  • Starter css file
  • an empty images folder

Just upload to your server, create a new app profile in facebook and replace “YOUR_APP_ID_HERE” in index.html with your App Id.

Visit the google code page to download the project.

And check out the demo on facebook.

Posted in Facebook, Web Development | Leave a comment

Retro Consoles In My Pocket

Posted on February 13, 2011 by Matt

One thing I love to do with a brand new, top of the line, piece of tech is see how it emulates brand new, top of the line, tech from 20 years ago. This is an area where Android and its open culture really shine. I was excited to find myself playing SpaceTaxi with little more than a marketplace download and a visit to c64.com. Nintendo support is amazing, with Nesoid and Snesoid. The list of emulators in the marketplace scrolls on and on.

I have found one big problem with retrogaming on a phone; touch screens make terrible classic controllers. I find myself losing track of where my fingers are needed and miss a button at the worst possible time. The phone’s hardware keyboard kind of works, but it’s cumbersome for any fast moving game. There is the Game Gripper, which attaches a plastic controller pad on top of the phone’s hardware keyboard. This is a great way to get a real d-pad on your phone. The only drawback is that you have to carry around an extra piece of plastic.

The app Wiimote Controller offers something completely different. You can sync a nintendo Wii controller to your android phone via buletooth. Controller buttons are mapped to keyboard events. At first it seems like a novelty since carrying around a Wii controller, and propping up your phone so you and use it, is cumbersome at the very least. One feature of this app however makes this a very intriguing solution: Connect up to 4 controllers at the same time. With that, it’s not so much about gaming on the go, as it is bringing an array of consoles with you in your pocket. A 2 Gigabyte SD card can easily hold over three decades of gaming. For those of us in our thirties, that’s an entire childhood in retro gaming nostalgia.

The ultimate scenario is to plug your phone into a television for the full console experience. Unfortunately, my Droid 2 is lacking in this feature. I quickly learned that android, in general, is lacking in a good screen-casting solution. If your phone does have an hdmi out, then you’re all set. Even without an HDTV it’s a great solution for two player gaming in the back of a car, or over a table top. Here’s a video featuring the Wii controllers in action, starring my son and his friend playing two player TMNT2 on Nesoid.

Posted in Retro Gaming, Reviews, Tech Tip | Leave a comment

A Green Zeta Christmas Story

Posted on December 21, 2010 by Matt
title
panel01panel02
panel03
panel04panel05
panel06panel07
panel08panel09
Posted in Misc, Updates, Zeta Comics | 1 Comment

Ai->Canvas brings <canvas> to human beings.

Posted on October 24, 2010 by Matt

The <canvas> element, new to html 5 but available in some web browsers for quite a while, allows the browser to natively render vector graphics. The end result is: images that can re-size, morphing, animation and, in some cases, smaller file sizes. There has always been one tremendous disadvantage in implementation of the canvas element; you need to code out the drawing of each line, one-by-one, in JavaScript. As a result, most examples of <canvas> are limited to simple shapes. More complex imagery is generally reduced to embedding a bitmap image within the vector canvas.

html5 canvas exampleAi->Canvas, a new plugin for Adobe Illustrator, suddenly takes away all the pain of <canvas> art. Simply choose File-Export from within Illustrator and select <canvas> as the file type. It takes your vector art and automatically converts it to <canvas> ready javascript code. The results are extremely impressive. I gave the <canvas> treatment to my ‘ol Green Zeta mascot and, other than some slight color difference, it’s indistinguishable from a png rendering. From my example, you can see that <canvas> isn’t always the most efficient image format. Complex shapes mean complex code, and bigger file sizes. There are other advantages to <canvas> that are worth considering. A canvas image can be re-sized on the fly. Elements can be broken down and re-used. With the help of some javascript it can even be animated. Imagine my Zeta example in a web-cartoon format. Typically that would have to be done in Flash or rendered out to video.

For platforms which do not support Flash, such as iPhone, <canvas> is your best option. With the help of AI->Canvas, this option is finally viable. I predict we will see the beginnings of a Flash-like development environment, built around html 5 and the <canvas> element, very soon. Like Flash, it will take time to grow and mature. Acceptance of these features will have to grow as well. Internet Explorer users will finally have <canvas> support with the release of version 9. However, the advantages of <canvas> ensure it will become the standard. As a web developer I love the idea of being able to make quick edits to multimedia content without being tied to an IDE/Compiler. Ai->Canvas is a great first step in that direction, bringing canvas art to… artists.

Posted in Web Development | 1 Comment

QuickRTM

Posted on November 6, 2009 by Matt

qrtmI’ve posted in the past on how much I love Remember The Milk for managing my tasks. My first real use of Twitter was when I found out I could use it to update RTM from my mobile phone. However the twitter interface is a little cumbersome. All updates have to be prefixed with “d rtm today” or “tomorrow” or “wednesday”. I had set up text shortcuts but even that required a bunch of clicks through menus. Then it hit me; I’m a .net developer, my crappy phone runs Windows Mobile, why not try out writing mobile apps?

Enter quickrtm, my first attempt at mobile apps. The idea behind quickrtm is to make it as simple as possible to jot down a quick ToDo on my phone. Once the app is installed, click it to launch, enter your todo item and press the “Send” soft key. There’s an optional menu to select a day other than “Today”. You can also press the other soft key to get a list of your current todo items. The app uses the phone’s text messaging so there’s no need for a data plan. Simply follow the instructions on the Remember The Milk site to link it to your Twitter account.

Head over to the quickrtm project page, hosted on Google Code, to check it out.

Posted in Web Development | Tagged | Leave a comment