Tweets Per Day – Chrome Extension
September 19th, 2011

One of the key factors I look at when deciding to follow someone on twitter is how often that user tweets.  If I’m not careful, it’s easy to add someone who will overwhelm my stream.  To that end I created an extension for Chrome that adds an info box (next to the other info items, such as follower count, following count, etc) with the rate at which they post new tweets.  With this add on it’s now very easy to see if someone is a “once per day” user, once per week, or “28.2 tweets per day” type.

It won’t change your life, but it only takes about 5 seconds to install and you can forget it after that.

download (Chrome Store): http://bit.ly/tweetsperday

source: https://github.com/trg/Tweets-Per-Day

 

 

 

 

 

 

 

MathJax – Pure Clientside Javascript TeX Equation Renderer
July 8th, 2011

I implimented MathJax on mathproblems.us today and so far I’m pretty impressed.  It’s worked beautifully so far and the documentation, while not the easiest to navigate, is very useful and complete.  It makes good use of hooks which were useful because it allowed me to hide the raw equation text until after it’s rendered (otherwise it flickers).

My first Impact Javascript Game: omgaliens
May 24th, 2011

If you’re looking for the game itself, you can find it here: omgaliens.

My Thoughts on Writing my First Game in Impact

I thought it might be nice to write up a retrospective of the last month or so spent working on omgaliens with Impact (also sometimes called ImpactJS) and give my general impression of the Impact framework.  For those not familiar, Impact is a relatively new framework that’s sprouted up among other frameworks in the relatively new area of “HTML5/Javascript game engines”.  I won’t go into detail here, but basically in the last few years most modern browsers (even Internet Explorer) have implemented the canvas element, which in turn has allowed developers to create various kinds of graphical and game engines that use this feature. One major thing that sets Impact  apart from the slew of other libraries is that it costs $99 (most are free and open source), and it comes with a graphical level editor.  It also runs well on mobile platforms, which often have performance issues.

Before I continue, a little background on myself:  I’ve been programming in some form for about 10 years now, but I’m not a game developer.  The only other game framework I’ve used is cocos2d for the iPhone, and I did not complete that game though I did have a playable demo.  So this review is strictly from the prospective of someone who’s a programmer but *not* a game developer.  I also did not use the level editor much; nor did I use the Box2d physics, so I won’t be commenting on that.

What It Is, and What It Isn’t

Since it costs money and there’s no “trial” license, I figured I’d start out by noting a few things I learned about the framework that I didn’t know by reading the various descriptions on their site (though this info can be found in the documentation).

First, it’s a sprite based game engine, not vector.  Second, it’s designed for action type games (platformers, 2D shooters, etc) with build in methods for managing player/enemy health and interaction, including acceleration and velocity parameters for each entity.  It is not just a cool physics engine wrapped in a while() loop, rather it has a lot of your basic game utilities built in as well: volume, loading screens, levels, music, pausing, etc.   Basically it’s a great engine to make games similar to Pac Man or Super Mario Bros, but it would be a bad choice to make games like Scrabble or Chess.

The Good

So what’s good about it?  Well for starters, it’s just pretty easy to use.  The structure makes a lot of sense, and once you read the Getting Started docs and watch the tutorial videos you can start making a game.  Whenever I wanted to add something new, like music or sound effects, I could hit the docs and have something implemented in less than an hour.  When the docs failed me (while complete, they tend to be on the sparse side — some method descriptions are only one line) the forums had my answer.  When I couldn’t find my answer on the forums, the source code is well documented and at the very least I could find my answer there.  So overall, pretty good documentation, which is very important when you’re using someone else’s library.

It works very nicely on mobile and on the iPad, which is pretty important these days, especially with the iOS platform not supporting flash.

I didn’t get a chance in my first game to have the need for a level editor, but what little I played around with it, it seems quite powerful.

The Not So Good

HTML5 Audio browser support is flaky. so Impact has some difficulty playing sounds.

The Big Question: Is it Worth $99?

So the question on everyone’s mind: Is it worth 100 bucks, especially since there are so many alternatives that are free?  Well, that depends on what you’re looking for and what you expect for $99.

Impact licenses are the framework authors only source of income and allow him to work on it full time, which is great because (in theory) you’re ensuring that your game will work on future browsers because he’s continuing to develop the framework.  It would really suck if you spent a lot of time writing a game in a free library that turned out to be some summer project, only to watch your game slowly become unusable as browser technology moves on.  So in that respect, (hopefully) Impact wins out.  Unfortunately, upgrades are not free, though they are discounted.  Also, as any TextMate user might tell you, spending money on the promise of future versions can be a waste [TextMate 1.0 users were promised a free upgrade to TextMate 2.0, it's been 3 or 4 years and no TextMate 2 exists yet] so it’s a bit of a tossup.

Of course, just because something is free and open source, doesn’t mean it won’t be maintained, after all pretty much all the software powering the very site you’re reading is open source.  However, where open source thrives are applications that are useful to a lot of people (operating systems, text editors, web servers).  In contrast, game engines are very specific and I have serious doubts about whether the “HTML5 2D sprite physics based game development” ecosystem is big enough to support a solid open source project without a single project leader pushing the way forward.  However that’s all just my hunch, I could be wildly wrong.

For me, I think it was worth the $99, but it does have some issues (mentioned above) that are disappointing.  On the other hand, as a web development freelancer myself, I do NOT feel bad about giving another web developer freelancer some money, after all, he did do some work that saved me time (and thus money), so he deserves compensation.  Then again, taken to the logical conclusion, so do the literally thousands of open source developers that contributed to the server software… so… :-/

Well I’ll probably add to this post as time goes on (or at least post some new updates).  Whether or not the tone of this post conveys it: I am pretty stoked about Impact and consider myself fairly satisfied thus far.

Recent Incoming Searches:

  • impactjs review
Google Chart Generator (Beta)
January 31st, 2010

Today I was going through some of my old Subversion repositories and came across a slew of projects I forgot I made.  One of them was an javascript google chart generator and I’ve put it up at tomgraft.com/gchart.  It’s one of the least impressive projects I found, but it was the easiest to put back up on the web.  Over the next few days (weeks? months?) I plan on uploading more of the re-found code on github.  Stay tuned.

GreaseMonkey Script – Reddit.com: Highlight Submitter’s Posts
December 6th, 2009

I’m a redditor and one thing that I’ve always wanted to do is have a way for the submitter’s posts to be more prominent.  So I whipped up a quick GM script to do just that.  This is the result:

Click to Enlarge

Submitter's posts are now in a light blue box.

Certainly nothing spectacular but it’s pretty trivial to change the CSS to your liking or extent this script to do other things to the submitter’s posts.

gm_reddit_submitter_css @ github

See the New Google.com
November 27th, 2009

1. Go to Google.

2. Copy/paste this in to your address bar and hit enter:

javascript:void(document.cookie="PREF=ID=20b6e4c2f44943bb:U=4bf292d46faad806:TM=1249677602:LM=1257919388:S=odm0Ys-53ZueXfZG;path=/; domain=.google.com");

3. Refresh the page.

Don’t forget to check around to other Google properties (Google News, Video, etc) as many of them also received significant updates as well.

Google Map API (with a tiny tutorial)
April 22nd, 2009

The Google Map API is excellent, I’ve been using it on a recent project.

Google Map

To get something that looks like the above image, get a Google Map API key, include the relevant Google API Javascript files, and add:

map = new GMap2(document.getElementById('classroom_map'));
map.setUIToDefault();
map.setCenter(new GLatLng(42.3337872, -71.0958314), 10);
marker = new GMarker(new GLatLng(40.6101, -79.9669));
marker.bindInfoWindowHtml("HTML GOES HERE");
map.addOverlay(marker);

Breakdown:

map = new GMap2(document.getElementById('classroom_map'))

Creates a GMap2 object in the div with the id ‘classroom_map’.  Elsewhere on the page, we would have an empty div with the id ‘classroom_map’ and whatever CSS we want our Google Map to have.


map.setUIToDefault();

Sets the various default widgets (Zoom, Map Type) to their default positions.


map.setCenter(new GLatLng(42.3337872, -71.0958314), 10);

The GLatLng object is first created with the lat and lng values shown. The map.setCenter() method takes in this GLatLng object, along with a zoom level (10). So this step centers our GMap at the above coords and zoom level.


marker = new GMarker(new GLatLng(40.6101, -79.9669));

Using GLatLng again, we create a GMarker object called ‘marker’. GMarkers are the little red arrows that you can click on Google Maps. This step creates the marker object but does not display it. We won’t want to display it yet because first we’ll want to bind the tooltip shown in the example picture.


marker.bindInfoWindowHtml("HTML GOES HERE");

This step adds the HTML that is displayed in the tooltip. “bindInfoWindowHtml(the_html)” basically says “When the user clicks this marker, show a tooltip with ‘the_html’ as the content of the tooltip.”


map.addOverlay(marker);

This step adds the marker to the map.


And that’s pretty much it!  I didn’t show any of the advanced features of the Google Map API but with only a few lines you can have a functional map with tooltips.